/* =========================================================================
   Goldrand – ergänzende Styles zu theme.json
   Regel: Bernstein nur als Akzent, max. 1 verspieltes Detail pro Viewport.
   ========================================================================= */

:root {
	--honey-color: #C77B1E; /* Fallback; je Sorte via Meta-Feld überschrieben */
	--goldrand-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* ---- Typografische Grundpflege (Deutsch) ------------------------------- */
body {
	hyphens: auto;
	-webkit-hyphens: auto;
	text-rendering: optimizeLegibility;
}

.entry-content > p,
.entry-content > ul,
.entry-content > ol {
	max-width: 68ch;
}

/* ---- Links: „zäh wie Honig" – Unterstreichung dickt beim Hover auf ----- */
.entry-content a:not(.wp-block-button__link),
.wp-block-post-content a:not(.wp-block-button__link) {
	text-decoration-thickness: 1.5px;
	text-underline-offset: 3px;
	transition: text-decoration-thickness 250ms var(--goldrand-ease),
	            color 250ms var(--goldrand-ease);
}

.entry-content a:not(.wp-block-button__link):hover,
.wp-block-post-content a:not(.wp-block-button__link):hover {
	text-decoration-thickness: 2.5px;
}

/* ---- Signatur: das Hexagon (nur in Sortenkarten & Steckbrief!) --------- */
.goldrand-hex {
	display: inline-block;
	width: var(--hex-size, 40px);
	height: var(--hex-size, 40px);
	background: var(--honey-color, #C77B1E);
	clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
	transition: transform 300ms ease-out;
	flex: none;
}

.goldrand-sortenkarte:hover .goldrand-hex,
.goldrand-sortenkarte:focus-within .goldrand-hex {
	transform: rotate(30deg);
}

/* ---- Sortenkarte -------------------------------------------------------- */
.goldrand-sortenkarte {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--30);
	height: 100%;
	transition: border-color 250ms var(--goldrand-ease);
}

.goldrand-sortenkarte:hover {
	border-color: var(--wp--preset--color--amber);
}

.goldrand-sortenkarte h3 a,
.goldrand-sortenkarte .wp-block-post-title a {
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: color 250ms var(--goldrand-ease);
}

.goldrand-sortenkarte:hover h3 a,
.goldrand-sortenkarte:hover .wp-block-post-title a {
	color: var(--wp--preset--color--amber-deep);
}

/* ---- Artikelkarte ------------------------------------------------------- */
.goldrand-artikelkarte {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	overflow: hidden;
	height: 100%;
}

.goldrand-artikelkarte .wp-block-post-featured-image img {
	border-radius: 0;
}

.goldrand-artikelkarte .wp-block-post-title a {
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: color 250ms var(--goldrand-ease);
}

.goldrand-artikelkarte .wp-block-post-title a:hover {
	color: var(--wp--preset--color--amber-deep);
}

/* ---- Eyebrow / Label ---------------------------------------------------- */
.goldrand-eyebrow {
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--amber-deep);
}

/* ---- Infobox „Gut zu wissen" -------------------------------------------- */
.goldrand-infobox {
	background: var(--wp--preset--color--honey-light);
	border-left: 3px solid var(--wp--preset--color--amber);
	border-radius: 0 12px 12px 0;
	padding: var(--wp--preset--spacing--30) !important;
}

.goldrand-infobox.is-variant-gesundheit {
	border-left-color: var(--wp--preset--color--meadow);
}

.goldrand-infobox.is-variant-achtung {
	border-left-color: var(--wp--preset--color--propolis);
}

.goldrand-infobox > :first-child {
	margin-top: 0;
}

.goldrand-infobox > :last-child {
	margin-bottom: 0;
}

/* ---- Steckbrief (Lexikon-Kern) ------------------------------------------ */
.goldrand-steckbrief {
	background: color-mix(in srgb, var(--wp--preset--color--honey-light) 40%, transparent);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--30) !important;
	font-variant-numeric: tabular-nums;
}

.goldrand-steckbrief .goldrand-steckbrief__label {
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--propolis);
	margin-bottom: 0;
}

.goldrand-steckbrief .goldrand-steckbrief__value {
	margin-top: 0.1em;
	margin-bottom: 0.9em;
}

/* ---- Tag-Pills ----------------------------------------------------------- */
.goldrand-pill,
.wp-block-tag-cloud a,
.wp-block-post-terms a {
	display: inline-block;
	border: 1.5px solid var(--wp--preset--color--line);
	border-radius: 999px;
	padding: 0.25em 0.9em;
	font-size: 0.875rem !important;
	font-weight: 600;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: background 250ms var(--goldrand-ease),
	            border-color 250ms var(--goldrand-ease);
}

.goldrand-pill:hover,
.wp-block-tag-cloud a:hover,
.wp-block-post-terms a:hover {
	background: var(--wp--preset--color--honey-light);
	border-color: var(--wp--preset--color--amber);
}

.wp-block-post-terms {
	font-size: 0.875rem;
}

.wp-block-post-terms .wp-block-post-terms__separator {
	display: inline-block;
	width: 0.4em;
	visibility: hidden;
}

/* ---- Tabellen ------------------------------------------------------------ */
.wp-block-table table {
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}

.wp-block-table th {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	background: var(--wp--preset--color--honey-light);
}

.wp-block-table th,
.wp-block-table td {
	border: 1px solid var(--wp--preset--color--line);
	padding: 0.6em 0.9em;
}

.wp-block-table tbody tr:nth-child(even) {
	background: color-mix(in srgb, var(--wp--preset--color--honey-light) 50%, transparent);
}

/* ---- Suche ---------------------------------------------------------------- */
.wp-block-search__input {
	border: 1.5px solid var(--wp--preset--color--line);
	border-radius: 10px;
	background: var(--wp--preset--color--white);
	padding: 0.7em 1em;
	font-size: 1rem;
}

.wp-block-search__input:focus {
	border-color: var(--wp--preset--color--amber);
	outline: none;
}

.wp-block-search__button {
	border-radius: 10px;
	border: none;
	background: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--white);
	font-weight: 600;
	transition: background 250ms var(--goldrand-ease);
}

.wp-block-search__button:hover {
	background: var(--wp--preset--color--amber-deep);
}

/* ---- Header / Footer ------------------------------------------------------ */
.goldrand-header {
	border-bottom: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--paper);
	position: sticky;
	top: 0;
	z-index: 50;
}

/* Wortmarke: der Punkt in „honig.wiki" leuchtet bernstein (Spiel-Detail) */
.goldrand-wortmarke .goldrand-punkt {
	color: var(--wp--preset--color--amber);
}

.goldrand-footer a {
	color: var(--wp--preset--color--paper-dim);
}

.goldrand-footer a:hover {
	color: var(--wp--preset--color--white);
}

/* ---- Sekundär-Button ------------------------------------------------------- */
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 1.5px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
	background: transparent;
	transition: background 250ms var(--goldrand-ease);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--honey-light);
}

/* ---- Barrierefreiheit ------------------------------------------------------- */
:focus-visible {
	outline: 2px solid var(--wp--preset--color--amber-deep);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---- Reduzierte Bewegung ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
	}
}