/* =========================================================================
   Tokajská pivnica – hlavný štýl (žiadny build krok, čistý CSS)
   Obsah:
   1. Design tokeny (musia zodpovedať theme.json)
   2. Reset a základy
   3. Typografia
   4. Layout / kontajner / sekcie
   5. Prístupnosť (skip-link, focus, sr-only)
   6. Tlačidlá
   7. Header a navigácia (desktop + mobil)
   8. Hero (Cover blok)
   9. Intro / O nás
   10. Degustačné karty (custom blok)
   11. Vinárstva grid
   12. Región Tokaj – fakty, odrody
   13. Aktivity v okolí (Query Loop nad CPT)
   14. Novinky a podujatia (Query Loop nad Post)
   15. Galéria + lightbox
   16. Kontakt, mapa, formulár
   17. Footer
   18. Utility
   ========================================================================= */

/* ---------- 1. Design tokeny -------------------------------------------- */
:root {
	/* Paleta prepočítaná priamo z farieb loga (magenta -> oranžová -> zlatá)
	   a fotiek pivnice (kameň, drevo, hrozno) – nie ľubovoľne zvolená.
	   Kontrasty overené podľa WCAG AA (min. 4.5:1 pre bežný text). */
	/* Farby prevzaté priamo z Claude Design zdroja (presné hex hodnoty,
	   nie priblížené) – overené proti .dc.html všetkých 4 artboardov. */
	--c-vinova: #8E1B52;
	--c-vinova-tmava: #3A1224;
	--c-zelena: #2a1f16;
	--c-piesok: #C9992E;
	--c-piesok-tmava: #89672b;
	--c-krem: #F6EEE0;
	--c-biela: #ffffff;
	--c-hneda: #241A1E;
	--c-hneda-svetla: #6B5B57;

	/* Rozšírenie palety pre redizajn podľa Claude Design – takmer čierna
	   tmavá plocha (header/footer/hero na vnútorných stránkach) a
	   gradient magenta -> oranžová -> zlatozelená, ktorý presne kopíruje
	   farby loga a používa sa na akcentové prúžky, odznaky a hlavné CTA. */
	--c-cierna: #150910;
	--c-cierna-svetlejsia: #2b201a;
	--gradient-tokaj: linear-gradient(90deg, #9E1B5F 0%, #E0642E 33%, #EFB61C 58%, #C9D62A 79%, #8FBE2B 100%);
	--gradient-cta: linear-gradient(90deg, #8E1B52, #B7343F);

	/* Doplnkové farby z dizajnu – druhé (teplejšie) krémové odtiene použité
	   len v konkrétnych sekciách (Spolupráca, Cibéby box, karty odrôd/noviniek),
	   textové farby pre bežný text (nie nadpisy) a krémový akcent na tmavých
	   plochách (eyebrow text, "Tokaj" v H1, odkazy v pätičke). */
	--c-krem-alt: #F1E5D2;
	--c-krem-tepla: #FBF6EC;
	--c-text-sekundarny: #4A3A3E;
	--c-akcent-tmava-plocha: #EBD9B4;

	--font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--font-sans: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	--space-20: 0.5rem;
	--space-30: 1rem;
	--space-40: 1.5rem;
	--space-50: 2.5rem;
	--space-60: 4rem;
	--space-70: 6rem;

	--container-width: 1240px;
	--content-width: 816px;
	/* Mäkšie, "prémiovejšie" zaoblenie kariet/vstupov/máp/obrázkov naprieč
	   celou témou (nahrádza pôvodné takmer ostré 3px rohy) + samostatný
	   token pre plne zaoblené pilulkové tlačidlá a odznaky. */
	--radius: 14px;
	--radius-pill: 999px;
	--transition: 180ms ease;
}

/* ---------- 2. Reset ----------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

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

body {
	margin: 0;
	background: var(--c-krem);
	color: var(--c-hneda);
	font-family: var(--font-sans);
	font-size: 1.0625rem;
	line-height: 1.65;
	overflow-x: hidden;
}

img,
svg,
video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--c-vinova);
	text-decoration: none;
}

a:hover {
	color: var(--c-vinova-tmava);
	text-decoration: underline;
}

/* ---------- 3. Typografia ------------------------------------------------ */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-serif);
	color: var(--c-vinova-tmava);
	line-height: 1.08;
	font-weight: 300;
	letter-spacing: -0.01em;
	margin: 0 0 var(--space-30);
}

h3, h4, h5, h6 {
	font-weight: 400;
	letter-spacing: 0;
}

/* Veľkosti presne podľa clamp() hodnôt z Claude Design (H1 52–112px,
   H2 34–58px, H3 26–36px – merané v .dc.html zdroji, nie odhadnuté). */
h1 { font-size: clamp(3.25rem, 8.4vw, 7rem); line-height: 0.98; letter-spacing: -0.015em; }
h2 { font-size: clamp(2.125rem, 4.4vw, 3.625rem); }
h3 { font-size: clamp(1.625rem, 2.8vw, 2.25rem); }

em, i {
	font-style: italic;
}

p {
	margin: 0 0 var(--space-30);
	color: var(--c-text-sekundarny);
	font-weight: 300;
}

/* Bežný text v tmavých sekciách (Ochutnávka, Kontakt, Galéria, Footer,
   hero) je krémový/priesvitný, nie tmavohnedý – dedí sa cez .section--dark
   / .section--wine-dark namiesto opakovania na každom mieste zvlášť. */
.section--dark p,
.section--wine-dark p,
.hero-cover p {
	color: inherit;
}

/* "Eyebrow" popisok sekcie + krátka farebná linka pred ním – opakujúci sa
   dekoratívny motív z dizajnu (každá sekcia má vlastnú kombináciu farieb
   gradientu, nastavuje sa cez --kicker-gradient v HTML danej sekcie). */
.section-kicker {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 20px;
}

/* Dizajn zarovnáva nadpisy VŠETKÝCH sekcií doľava (žiadna sekcia okrem
   samotných kariet/dlaždíc nepoužíva centrovaný text) – táto trieda je tu
   len pre prípad, že by konkrétna inštancia centrovanie výslovne chcela. */
.section-kicker--center {
	justify-content: center;
}

.section-kicker__line {
	display: inline-block;
	width: 44px;
	height: 2px;
	flex-shrink: 0;
	background-image: var(--kicker-gradient, linear-gradient(90deg, #9E1B5F, #EFB61C));
}

.section-eyebrow {
	display: inline-block;
	font-family: var(--font-sans);
	font-size: 0.72rem;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--c-vinova);
	font-weight: 400;
	margin: 0;
}

.section--dark .section-eyebrow,
.section--wine-dark .section-eyebrow {
	color: var(--c-akcent-tmava-plocha);
}

.section-lede {
	max-width: 62ch;
	color: var(--c-text-sekundarny);
	font-size: 1.03rem;
	font-weight: 300;
	line-height: 1.7;
}

.section-lede--center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* ---------- 4. Layout ----------------------------------------------------- */
.container {
	width: 100%;
	max-width: var(--container-width);
	margin-inline: auto;
	padding-inline: var(--space-40);
}

section[id] {
	scroll-margin-top: 90px;
}

.section {
	padding-block: var(--space-70);
}

/* Domovska stranka sklada sekcie z nativnych Gutenberg "group" blokov
   (wp:group, layout:constrained) - NIE z .container. Na sirokych
   obrazovkach to funguje "nahodou" vdaka core Gutenberg CSS, ktore detom
   is-layout-constrained/alignwide bloku dava max-width + margin-inline:auto
   (podla theme.json contentSize/wideSize) - akonahle je ale viewport uzsi
   nez tento max-width (mobil, tablet), auto-margin prestava posobit a obsah
   sa nalepi na okraj obrazovky bez akehokolvek odsadenia. Tato trieda dava
   samotnemu .section boxu (nie jeho konstruovanym potomkom) rovnake bocne
   odsadenie ako .container, takze funguje ako "poistka" na malych
   obrazovkach a je prakticky neviditelna na sirokych (kde je stred obsahu
   uz aj tak daleko od okraja). Sablony mimo homepage vnaraju .container
   priamo do .section (napr. template-parts/aktivity-grid.php) - tam sa
   .wp-block-group trieda nikdy nepridava, takze sa toto pravidlo na ne
   nevztahuje a nedochadza k zdvojeniu odsadenia. */
.section.wp-block-group {
	padding-inline: var(--space-40);
}

.section--tight {
	padding-block: var(--space-60);
}

/* Presné pozadia sekcií podľa dizajnu – nejde o ľubovoľné "svetlá/tmavá"
   variácia, každý odtieň je z konkrétneho miesta v .dc.html zdroji:
   --wine-dark = tmavovínová (Ochutnávka, Kontakt), --night = takmer čierna
   (Galéria, hero, pätička), --krem-alt = teplejší krémový tón (Spolupráca). */
.section--wine-dark,
.section--dark {
	background: var(--c-vinova-tmava);
	color: var(--c-krem);
}

.section--night {
	background: var(--c-cierna);
	color: var(--c-krem);
}

.section--krem-alt {
	background: var(--c-krem-alt);
}

.section--wine-dark h2,
.section--wine-dark h3,
.section--dark h2,
.section--dark h3,
.section--night h2,
.section--night h3 {
	color: var(--c-krem);
}

/* Dizajn zarovnáva hlavičky sekcií (kicker + nadpis + úvodný text) doľava,
   nie na stred – nadpis a text majú vlastnú max-width, ale samotný blok
   zostáva pri ľavom okraji kontajnera (viď napr. "Ochutnávka", "Spolupráca",
   "O Tokaji" v .dc.html zdroji). */
.section-header {
	margin: 0 0 var(--space-50);
}

.section-header h2 {
	max-width: var(--content-width);
}

.o-tokaji-heading {
	max-width: var(--content-width);
}

/* ---------- 5. Prístupnosť ------------------------------------------------ */
.screen-reader-text,
.sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link.screen-reader-text:focus {
	position: fixed;
	top: var(--space-20);
	left: var(--space-20);
	width: auto;
	height: auto;
	padding: var(--space-20) var(--space-30);
	background: var(--c-vinova);
	color: var(--c-biela);
	z-index: 10000;
	border-radius: var(--radius);
	clip: auto;
}

:focus-visible {
	outline: 3px solid var(--c-piesok);
	outline-offset: 2px;
}

/* ---------- 6. Tlačidlá ---------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.85em 1.8em;
	min-height: 44px;
	border-radius: var(--radius-pill);
	font-weight: 600;
	font-size: 1rem;
	letter-spacing: 0.01em;
	border: 2px solid transparent;
	cursor: pointer;
	transition: background-color var(--transition), color var(--transition), border-color var(--transition), transform var(--transition);
	text-decoration: none;
}

.btn--primary {
	background-color: var(--c-vinova);
	background-image: var(--gradient-cta);
	color: var(--c-krem);
	box-shadow: 0 14px 34px rgba(142, 27, 82, 0.4);
}
.btn--primary:hover,
.btn--primary:focus-visible {
	color: var(--c-krem);
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 18px 42px rgba(142, 27, 82, 0.55);
}

/* Pozn.: 5-farebný "dúhový" gradient (--gradient-tokaj) sa v dizajne
   používa VÝLUČNE na dekoratívne prúžky/oddeľovače, nikdy na tlačidlá –
   hlavné CTA tlačidlá (aj tu) používajú 2-farebný vínový gradient. */
.btn--gradient {
	background-image: var(--gradient-cta);
	color: var(--c-krem);
	box-shadow: 0 14px 34px rgba(142, 27, 82, 0.4);
}
.btn--gradient:hover,
.btn--gradient:focus-visible {
	color: var(--c-krem);
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 18px 42px rgba(142, 27, 82, 0.55);
}

/* Nahlásený bug – "hranatá vrstva/pozadie presvitá spoza tlačidla": keď sa
   btn--gradient použije ako className na wp:button bloku, Gutenberg ju
   vypíše na VONKAJŠÍ .wp-block-button div (obdĺžnik, bez zaoblenia), nie
   na vnútorný odkaz (ten má tvar pilulky) – rovnaká trieda tak omylom
   vykreslí dve prekrývajúce sa pozadia a rohy obdĺžnika vykúkajú spoza
   zaobleného tlačidla. Wrapper preto vždy necháme priehľadný; vizuál nesie
   výhradne .wp-block-button__link (viď pravidlo nižšie / hero-cover). */
.wp-block-button.btn--gradient {
	background: none;
	background-image: none;
	box-shadow: none;
	border-radius: 0;
}

.wp-block-button.btn--gradient .wp-block-button__link {
	background-image: var(--gradient-cta);
	color: var(--c-krem);
	border-radius: var(--radius-pill);
	box-shadow: 0 14px 34px rgba(142, 27, 82, 0.4);
	transition: transform var(--transition), box-shadow var(--transition);
}
.wp-block-button.btn--gradient .wp-block-button__link:hover,
.wp-block-button.btn--gradient .wp-block-button__link:focus-visible {
	color: var(--c-krem);
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 18px 42px rgba(142, 27, 82, 0.55);
}

.btn--outline {
	background: transparent;
	border-color: currentColor;
	color: var(--c-vinova);
}
.btn--outline:hover,
.btn--outline:focus-visible {
	background: var(--c-vinova);
	border-color: var(--c-vinova);
	color: var(--c-biela);
	text-decoration: none;
}

.btn--sm {
	padding: 0.55em 1.2em;
	min-height: 36px;
	font-size: 0.88rem;
}

.section--dark .btn--outline {
	color: var(--c-krem);
}
.section--dark .btn--outline:hover {
	background: var(--c-piesok);
	border-color: var(--c-piesok);
	color: var(--c-vinova-tmava);
}

/* Core WP "outline" tlačidlový štýl (wp:buttons is-style-outline) – bez tejto
   pravidla dedí len prehliadačový predvolený čierny okraj/text. Používa sa
   napr. v sekcii "Čo zažiť v okolí" (CTA "Zobraziť všetky aktivity"). */
.wp-block-button.is-style-outline .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 15px 30px;
	border-radius: var(--radius-pill);
	border: 1px solid rgba(142, 27, 82, 0.4);
	background: transparent;
	color: var(--c-vinova);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background var(--transition), color var(--transition), border-color var(--transition);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background: rgba(142, 27, 82, 0.08);
	color: var(--c-vinova);
}

/* ---------- 7. Header ------------------------------------------------------ */
.site-header {
	position: sticky;
	top: 0;
	z-index: 500;
	background: var(--c-cierna);
}

/* Na domovskej stránke header podľa dizajnu "pláva" priehľadne nad hero
   obrázkom (position:absolute, bez pozadia) – hero má vlastný tmavý
   gradient overlay, takže text v hlavičke zostáva čitateľný. Na ostatných
   typoch stránok (Aktivity/Aktuality/Detail príspevku) dizajn používa
   plnú tmavú lištu, čo zodpovedá pôvodnému sticky správaniu nižšie. */
body.home .site-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: transparent;
}

/* V dizajne nie je pod hlavičkou žiadny farebný prúžok – prechod medzi
   hlavičkou a obsahom je plynulý (rovnaká tmavá plocha). Element necháme
   v značkovaní kvôli spätnej kompatibilite, len ho vizuálne skryjeme. */
.site-header__accent {
	display: none;
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-30);
	padding-block: 0.9rem;
}

.site-header__brand {
	display: flex;
	align-items: center;
	gap: 0.875rem;
	min-width: 0;
	padding-left: clamp(0.25rem, 1vw, 0.75rem);
}

/* Logo dostáva rovnaké kruhové "odznakové" spracovanie ako v dizajne –
   krémový kruh 54px s tieňom, samotné logo je vycentrované vo vnútri cez
   object-fit:contain (nezoreže sa, len sa zmenší do kruhu). WP vypisuje
   the_custom_logo() ako <a class="custom-logo-link">, takže kruh vieme
   pridať čisto cez CSS bez zásahu do PHP šablóny. */
.site-header__brand .custom-logo-link {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--c-krem);
	box-shadow: 0 6px 20px rgba(21, 9, 16, 0.35);
	overflow: hidden;
}

.site-header__brand img,
.site-header__brand .custom-logo {
	max-width: 38px;
	max-height: 38px;
	width: auto;
	height: auto;
	object-fit: contain;
	flex-shrink: 0;
}

.site-header__title,
.site-header__wordmark {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	min-width: 0;
}

.site-header__wordmark-title {
	font-family: var(--font-serif);
	font-size: 1.3rem;
	font-weight: 400;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-krem);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.site-header__wordmark:hover .site-header__wordmark-title {
	color: var(--c-piesok);
	text-decoration: none;
}

/* Dizajn má v hlavičke jediný riadok značky – podtitul (rovnaký text ako
   názov stránky, kým si klient v Prispôsobiť nenastaví iný) sa tu preto
   skrýva; naďalej sa používa v pätičke a v kontaktnej sekcii. */
.site-header__subtitle {
	display: none;
}

/* Na veľmi úzkych obrazovkách necháme len logo (ikonu) – šetrí miesto vedľa
   hamburgeru a CTA, značka ostáva rozpoznateľná aj bez textu. */
@media (max-width: 380px) {
	.site-header__wordmark {
		display: none;
	}
}

/* Menu položky ("Novinky a podujatia" a pod.) sa NESMÚ nikdy zmenšiť pod
   svoju obsahovú šírku – inak sa box vizuálne zmenší, ale text pretečie
   von z neho a prekryje susedné CTA tlačidlo (reálny nahlásený bug:
   "Kontakt" prekrývajúci "Rezervovať"). Namiesto toho necháme zmenšovať
   VÝHRADNE .site-header__brand (má už pripravené orezanie s trojbodkou
   na wordmark-title), takže názov značky sa skráti skôr, než by sa menu
   alebo CTA čo i len o pixel stlačili. */
.site-header__nav-wrap {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-shrink: 0;
}

.site-header__menu {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: nowrap;
	flex-shrink: 0;
}

.site-header__menu a {
	color: rgba(246, 238, 224, 0.82);
	font-weight: 400;
	font-size: 0.84rem;
	letter-spacing: 0.06em;
	white-space: nowrap;
}
.site-header__menu a:hover,
.site-header__menu a:focus-visible {
	color: var(--c-krem);
	text-decoration: none;
}

.site-header__cta--mobile {
	display: none;
}

.site-header__cta--desktop {
	flex-shrink: 0;
}

.site-header__cta .btn {
	background: var(--c-krem);
	background-image: none;
	box-shadow: none;
	color: var(--c-vinova-tmava);
}
.site-header__cta .btn:hover,
.site-header__cta .btn:focus-visible {
	background: var(--c-piesok);
	color: var(--c-cierna);
	transform: translateY(-1px);
	box-shadow: none;
}

.site-header__cta--desktop .btn {
	white-space: nowrap;
	padding: 0.7em 1.3em;
	font-size: 0.92rem;
}

/* Nad 1441px má container viac miesta (1320px), takže menu a CTA
   môžu použiť plnú pohodlnú veľkosť namiesto zúženej varianty. */
@media (min-width: 1441px) {
	.site-header__nav-wrap {
		gap: var(--space-40);
	}
	.site-header__menu {
		gap: var(--space-40);
	}
	.site-header__menu a {
		font-size: 0.98rem;
	}
	.site-header__cta--desktop .btn {
		padding: 0.85em 1.6em;
		font-size: 1rem;
	}
}

.site-header__toggle {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.5rem;
	min-width: 44px;
	min-height: 44px;
}

.site-header__toggle-box {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.site-header__toggle-line {
	display: block;
	width: 26px;
	height: 2px;
	background: var(--c-krem);
	transition: transform var(--transition), opacity var(--transition);
}

.site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(2) {
	opacity: 0;
}
.site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 1024px) {
	.site-header__toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.site-header__nav-wrap {
		position: fixed;
		inset: 0 0 0 30%;
		background: var(--c-cierna);
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		padding: var(--space-60) var(--space-50);
		transform: translateX(100%);
		transition: transform 260ms ease;
		box-shadow: -8px 0 30px rgba(0, 0, 0, 0.15);
	}

	.site-header__nav-wrap.is-open {
		transform: translateX(0);
	}

	.site-header__menu {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-30);
	}

	.site-header__menu a {
		font-size: 1.2rem;
	}

	.site-header__cta--desktop {
		display: none;
	}

	.site-header__cta--mobile {
		display: block;
		margin-top: var(--space-40);
	}
}

@media (max-width: 430px) {
	.site-header__nav-wrap {
		inset: 0;
	}
}

/* ---------- 8. Hero (Cover blok) -------------------------------------------- */
/* Dizajn: obsah je zarovnaný DOLE a DOĽAVA (nie na stred) – hero je
   position:relative/flex s align-items:flex-end, textový blok má
   max-width:760px bez centrovania. */
.wp-block-cover.hero-cover {
	min-height: min(94vh, 900px);
	display: flex;
	align-items: flex-end;
}

@media (max-width: 600px) {
	.wp-block-cover.hero-cover {
		min-height: 78vh;
	}
}

/* Presný tmavý gradient z dizajnu namiesto plochého WP "dim" prekrytia –
   nahrádza vstavaný mechanizmus dimRatio, aby farby/priehľadnosť/smer
   sedeli 1:1 (nie len približne tmavá vrstva). */
.hero-cover .wp-block-cover__background {
	background: linear-gradient(180deg, rgba(21, 9, 16, 0.72) 0%, rgba(21, 9, 16, 0.28) 38%, rgba(21, 9, 16, 0.88) 100%) !important;
	opacity: 1 !important;
}

.hero-cover .wp-block-cover__image-background {
	filter: saturate(0.85) contrast(1.05);
	opacity: 0.9;
}

.hero-cover .wp-block-cover__inner-container {
	max-width: 760px;
	width: 100%;
	margin-inline: 0;
	text-align: left;
	padding-inline: var(--space-40);
	padding-block-end: clamp(4rem, 8vw, 6.875rem);
}

.hero-cover .hero-kicker {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 26px;
}

.hero-cover .hero-kicker__line {
	width: 64px;
	height: 2px;
	flex-shrink: 0;
	background-image: var(--gradient-tokaj);
}

.hero-cover .hero-kicker__text {
	font-size: 0.72rem;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: rgba(246, 238, 224, 0.75);
	font-weight: 400;
}

.hero-cover h1 {
	color: var(--c-krem);
	text-align: left;
}

.hero-cover h1 em {
	font-style: italic;
	color: var(--c-akcent-tmava-plocha);
}

.hero-cover p {
	color: rgba(246, 238, 224, 0.82);
	font-size: clamp(1rem, 1.5vw, 1.1875rem);
	font-weight: 300;
	line-height: 1.65;
	max-width: 520px;
	text-align: left;
	margin-top: 28px;
}

.hero-cover .wp-block-buttons {
	justify-content: flex-start;
	margin-top: var(--space-40);
}

/* Primárne CTA tlačidlo v hero sekcii – presne podľa dizajnu: 2-farebný
   vínový gradient (nie dúhový – ten je len na dekoratívne prúžky). */
.hero-cover .wp-block-button.btn--gradient .wp-block-button__link {
	background: var(--gradient-cta);
	color: var(--c-krem);
	border-radius: var(--radius-pill);
	box-shadow: 0 14px 34px rgba(142, 27, 82, 0.4);
	transition: transform var(--transition), box-shadow var(--transition);
}
.hero-cover .wp-block-button.btn--gradient .wp-block-button__link:hover,
.hero-cover .wp-block-button.btn--gradient .wp-block-button__link:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 18px 42px rgba(142, 27, 82, 0.55);
	text-decoration: none;
}

.hero-cover .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgba(246, 238, 224, 0.35);
	color: var(--c-krem);
	background: transparent;
}
.hero-cover .wp-block-button.is-style-outline .wp-block-button__link:hover,
.hero-cover .wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background: rgba(246, 238, 224, 0.1);
	border-color: rgba(246, 238, 224, 0.7);
	color: var(--c-krem);
	text-decoration: none;
}

/* ---------- 9. Intro / Vitajte (asymetrická 2-fotková koláž) --------------- */
h2 em, h3 em {
	font-style: italic;
	color: var(--c-vinova);
}

.section--wine-dark h2 em,
.section--dark h2 em,
.section--night h2 em {
	color: var(--c-akcent-tmava-plocha);
}

.o-nas-collage {
	position: relative;
	min-height: clamp(380px, 42vw, 560px);
}

.o-nas-collage::before {
	content: "";
	position: absolute;
	left: -10px;
	top: -18px;
	width: 86px;
	height: 86px;
	border-radius: 50%;
	background: linear-gradient(135deg, #9E1B5F, #EFB61C 60%, #8FBE2B);
	opacity: 0.14;
}

.o-nas-collage__hlavna {
	position: absolute;
	inset: 0 22% 14% 0;
	margin: 0;
	border-radius: 200px 200px 8px 8px;
	overflow: hidden;
	box-shadow: 0 26px 60px rgba(36, 26, 30, 0.24);
}

.o-nas-collage__hlavna img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.o-nas-collage__druha {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 52%;
	aspect-ratio: 4 / 5;
	margin: 0;
	border-radius: 999px 999px 8px 8px;
	overflow: hidden;
	border: 10px solid var(--c-krem);
	box-shadow: 0 20px 48px rgba(36, 26, 30, 0.28);
}

.o-nas-collage__druha img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 600px) {
	.o-nas-collage {
		min-height: 320px;
	}
}

.o-nas-stats {
	gap: clamp(1.75rem, 4vw, 3.5rem) !important;
	margin-top: var(--space-50);
	padding-top: var(--space-40);
	border-top: 1px solid rgba(36, 26, 30, 0.14);
}

.o-nas-stat__cislo {
	margin: 0;
	font-family: var(--font-serif);
	font-weight: 400;
	font-size: 42px;
	line-height: 1;
	color: var(--c-vinova);
}

.o-nas-stat__popis {
	margin: 0.5rem 0 0;
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-text-sekundarny);
}

/* ---------- 10. Degustačné karty -------------------------------------------- */
.degustacie-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-50);
	align-items: stretch;
	max-width: 980px;
	margin-inline: auto;
}

@media (max-width: 768px) {
	.degustacie-grid {
		grid-template-columns: 1fr;
	}
}

/* Štandard = priesvitná karta na tmavovínovom pozadí sekcie; Exclusive
   (odporúčané) = plná krémová karta, ktorá sa zámerne vizuálne odlišuje
   a "vyskočí" dopredu – presne podľa dizajnu, nie len iným okrajom. */
.degustacia-karta {
	background: rgba(246, 238, 224, 0.06);
	border: 1px solid rgba(246, 238, 224, 0.16);
	border-radius: 28px;
	padding: clamp(2rem, 3.6vw, 3rem);
	display: flex;
	flex-direction: column;
	position: relative;
	color: var(--c-krem);
}

.degustacia-karta--odporucane {
	background: var(--c-krem);
	border-color: transparent;
	box-shadow: 0 28px 64px rgba(0, 0, 0, 0.35);
	color: var(--c-hneda);
}

.degustacia-karta__badge {
	position: absolute;
	top: -13px;
	left: clamp(2rem, 3.6vw, 3rem);
	background-image: linear-gradient(90deg, #9E1B5F, #E0642E);
	color: var(--c-krem);
	font-size: 0.656rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	padding: 0.44em 1.1em;
	border-radius: 999px;
}

.degustacia-karta__nazov {
	margin: 0;
	font-size: 2.125rem;
	font-weight: 400;
	color: inherit;
}

.degustacia-karta__cena {
	font-family: var(--font-serif);
	font-size: 2.75rem;
	color: var(--c-akcent-tmava-plocha);
	margin: 0.35em 0 1.85em;
}

.degustacia-karta--odporucane .degustacia-karta__cena {
	color: var(--c-vinova);
}

.degustacia-karta__cena span {
	font-size: 0.94rem;
	font-family: var(--font-sans);
	color: rgba(246, 238, 224, 0.62);
	font-weight: 300;
}

.degustacia-karta--odporucane .degustacia-karta__cena span {
	color: var(--c-hneda-svetla);
}

.degustacia-karta__zoznam {
	list-style: none;
	margin: 0 0 var(--space-40);
	padding: 0;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
}

.degustacia-karta__zoznam li {
	padding-left: 1.5em;
	position: relative;
	margin: 0;
	font-size: 1rem;
	font-weight: 300;
	color: rgba(246, 238, 224, 0.86);
	line-height: 1.45;
}

.degustacia-karta--odporucane .degustacia-karta__zoznam li {
	color: var(--c-text-sekundarny);
}

.degustacia-karta__zoznam li::before {
	content: "—";
	position: absolute;
	left: 0;
	top: 0;
	color: #EFB61C;
}

.degustacia-karta--odporucane .degustacia-karta__zoznam li::before {
	color: var(--c-vinova);
}

.degustacia-karta .btn {
	width: 100%;
}

.degustacia-karta .btn--outline {
	border-color: rgba(246, 238, 224, 0.4);
	color: var(--c-krem);
}
.degustacia-karta .btn--outline:hover,
.degustacia-karta .btn--outline:focus-visible {
	background: rgba(246, 238, 224, 0.12);
	border-color: rgba(246, 238, 224, 0.4);
	color: var(--c-krem);
}

.degustacie-note {
	margin: var(--space-50) 0 0;
	color: rgba(246, 238, 224, 0.6);
	font-size: 0.906rem;
	font-weight: 300;
	line-height: 1.8;
}

/* ---------- 11. Vinárstva grid ---------------------------------------------- */
.vinarstva-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1px;
	background: rgba(36, 26, 30, 0.14);
	border: 1px solid rgba(36, 26, 30, 0.14);
	width: 100%;
	margin-top: var(--space-50);
}

.vinarstvo-karta {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 150px;
	padding: 1.75rem 1.25rem;
	background: var(--c-krem-alt);
	text-align: center;
	transition: background var(--transition);
}

.vinarstvo-karta:hover {
	background: var(--c-krem);
}

.vinarstvo-karta__kind {
	margin: 0;
	font-size: 0.625rem;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--c-vinova);
}

.vinarstvo-karta__nazov {
	margin: 0;
	font-family: var(--font-serif);
	font-size: 1.5rem;
	line-height: 1.15;
	color: var(--c-hneda);
	font-weight: 400;
}

.vinarstvo-karta__deliaci {
	width: 26px;
	height: 1px;
	margin: 0;
	border: 0;
	background: rgba(36, 26, 30, 0.3);
}

.vinarstvo-karta__miesto {
	margin: 0;
	font-size: 0.656rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-hneda-svetla);
}

/* ---------- 12. Región Tokaj ------------------------------------------------ */
.fakty-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-40);
	margin-block: var(--space-50);
}

@media (max-width: 768px) {
	.fakty-grid {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 430px) {
	.fakty-grid {
		grid-template-columns: 1fr;
	}
}

.fakt {
	text-align: center;
	padding: var(--space-30);
}

.fakt__cislo {
	font-family: var(--font-serif);
	font-size: 2.5rem;
	color: var(--c-piesok-tmava);
	display: block;
	margin-bottom: 0.2em;
}

.fakt__popis {
	color: var(--c-hneda-svetla);
	font-size: 0.98rem;
}

.odrody-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1.25rem, 2.6vw, 2.125rem);
	align-items: stretch;
}

@media (max-width: 768px) {
	.odrody-grid {
		grid-template-columns: 1fr;
	}
}

/* Karta odrody – jemný svetlý rámik, žiadny farebný okraj (dizajn ho
   nemá). Fotoslot je dočasne vyplnený existujúcou fotkou z Knižnice médií
   (kým klient nedodá konkrétnu fotku danej odrody) – ostáva bežným
   wp:image blokom, takže sa dá kedykoľvek vymeniť v editore. */
.odroda-karta {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--c-krem-tepla);
	border: 1px solid rgba(36, 26, 30, 0.1);
	border-radius: 24px;
	overflow: hidden;
	padding: 0;
}

.odroda-karta__foto.wp-block-image {
	margin: 0;
	aspect-ratio: 3 / 2;
	width: 100%;
}

.odroda-karta__foto.wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}

.odroda-karta__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 1.75rem 1.625rem 1.875rem;
}

.odroda-karta h3 {
	margin: 0;
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 1.1;
}

.odroda-karta__percento {
	margin: 10px 0 16px;
	font-family: var(--font-sans);
	font-size: 0.72rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-vinova);
}

.odroda-karta p:last-child {
	margin-bottom: 0;
	font-size: 0.97rem;
}

/* Zvýraznený box pre "Putňové vína a cibéby" – v dizajne samostatná
   krémová (F1E5D2) plocha, nie bežný textový odsek za sebou. */
.cibeby-box {
	margin-top: clamp(3rem, 6vw, 5rem);
	padding: clamp(2rem, 4vw, 3.5rem);
	border-radius: 28px;
	background: var(--c-krem-alt);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: start;
}

.cibeby-box h3 {
	margin: 0;
	line-height: 1.15;
}

.cibeby-box__text p:last-child {
	margin-bottom: 0;
}

/* ---------- 13/14b. Kompaktný teaser (okolie + novinky, 2 stĺpce) ---------- */
.okolie-novinky-columns {
	gap: clamp(2rem, 5vw, 4.5rem) !important;
}

.novinka-teaser-query .wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
}

.novinka-teaser {
	display: block;
	padding: 28px 30px;
	border-radius: 22px;
	background: var(--c-krem-tepla);
	border: 1px solid rgba(36, 26, 30, 0.1);
	transition: transform var(--transition), box-shadow var(--transition);
}

.novinka-teaser:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 38px rgba(36, 26, 30, 0.14);
}

.novinka-teaser .wp-block-post-date {
	font-size: 11.5px;
	font-weight: 400;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-text-sekundarny);
}

.novinka-teaser .wp-block-post-title {
	margin: 10px 0 0;
	font-family: var(--font-serif);
	font-weight: 400;
	font-size: 26px;
	line-height: 1.2;
}

.novinka-teaser .wp-block-post-title a {
	color: var(--c-hneda);
	text-decoration: none;
}

.novinka-teaser .wp-block-post-excerpt {
	margin-top: 10px;
	color: var(--c-text-sekundarny);
	font-size: 15.5px;
	font-weight: 300;
	line-height: 1.65;
}

@media (max-width: 768px) {
	.okolie-novinky-columns {
		flex-direction: column;
	}
	.okolie-novinky-columns .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* ---------- 15b. Karusel – hlavička, šípky a popisky ------------------------ */
.galeria-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: clamp(2rem, 4vw, 3.25rem);
}

.galeria-header .section-kicker {
	margin-bottom: 1.125rem;
}

.galeria-header h2 {
	margin: 0;
}

.tokaj-carousel-controls {
	gap: 12px !important;
}

.tokaj-carousel-btn {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	border: 1px solid rgba(246, 238, 224, 0.34);
	background: transparent;
	color: var(--c-krem);
	font-size: 19px;
	cursor: pointer;
	transition: background var(--transition), border-color var(--transition);
}

.tokaj-carousel-btn:hover {
	background: rgba(246, 238, 224, 0.14);
	border-color: var(--c-krem);
	color: var(--c-krem);
}

.wp-block-gallery.galeria-tokaj.tokaj-carousel {
	border-radius: 24px;
	overflow: hidden;
}

.wp-block-gallery.galeria-tokaj.tokaj-carousel figure.wp-block-image {
	position: relative;
}

.wp-block-gallery.galeria-tokaj.tokaj-carousel .wp-element-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 60px 32px 26px;
	background: linear-gradient(180deg, transparent, rgba(21, 9, 16, 0.85));
	color: rgba(246, 238, 224, 0.9);
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 0.04em;
	text-align: left;
}

/* ---------- 13/14. Query Loop karty (aktivity, novinky) -------------------- */
.wp-block-query .aktivita-card,
.wp-block-query .novinka-card {
	background: var(--c-biela);
	border-radius: var(--radius);
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 1px solid rgba(74, 55, 40, 0.1);
	transition: transform var(--transition), box-shadow var(--transition);
}

.wp-block-query .aktivita-card:hover,
.wp-block-query .novinka-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 30px rgba(60, 26, 30, 0.1);
}

.wp-block-post-featured-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.card-body {
	padding: var(--space-30) var(--space-30) var(--space-40);
}

.aktivita-meta {
	display: flex;
	gap: 0.9em;
	flex-wrap: wrap;
	align-items: center;
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--c-hneda-svetla);
	margin-top: var(--space-20);
	padding-top: var(--space-20);
	border-top: 1px solid rgba(74, 55, 40, 0.1);
}

.aktivita-meta__vzdialenost,
.aktivita-meta__trvanie,
.aktivita-meta__sezona {
	white-space: nowrap;
}

.aktivita-meta__odkaz {
	margin-left: auto;
	font-weight: 700;
	color: var(--c-vinova);
}
.aktivita-meta__odkaz:hover {
	color: var(--c-vinova-tmava);
}

.empty-state {
	text-align: center;
	color: var(--c-hneda-svetla);
	padding: var(--space-40);
}

/* ---------- 15. Galéria ------------------------------------------------------ */
.wp-block-gallery.galeria-tokaj figure {
	border-radius: var(--radius);
	overflow: hidden;
}

.wp-block-gallery.galeria-tokaj img {
	cursor: zoom-in;
	transition: transform var(--transition);
}
.wp-block-gallery.galeria-tokaj img:hover {
	transform: scale(1.03);
}

/* Galéria na homepage sa zobrazuje ako karusel (jedna fotka + bodkové
   stránkovanie) – editori naďalej pridávajú/uberajú/preusporadúvajú fotky
   cez bežný Galéria blok, CSS/JS len mení spôsob zobrazenia. Bodky
   generuje assets/js/main.js (initGalleryCarousel). */
.wp-block-gallery.galeria-tokaj.tokaj-carousel {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	max-width: 900px;
	margin-inline: auto;
	gap: 0;
}
.wp-block-gallery.galeria-tokaj.tokaj-carousel::-webkit-scrollbar {
	display: none;
}

.wp-block-gallery.galeria-tokaj.tokaj-carousel figure.wp-block-image {
	flex: 0 0 100%;
	scroll-snap-align: start;
	margin: 0;
}

.wp-block-gallery.galeria-tokaj.tokaj-carousel img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

@media (max-width: 430px) {
	.wp-block-gallery.galeria-tokaj.tokaj-carousel img {
		aspect-ratio: 4 / 3;
	}
}

.tokaj-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(20, 10, 12, 0.92);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2000;
	padding: var(--space-40);
}

.tokaj-lightbox[hidden] {
	display: none;
}

.tokaj-lightbox img {
	max-width: 90vw;
	max-height: 85vh;
	border-radius: var(--radius);
}

.tokaj-lightbox__close {
	position: absolute;
	top: var(--space-40);
	right: var(--space-40);
	background: none;
	border: none;
	color: var(--c-biela);
	font-size: 2rem;
	line-height: 1;
	cursor: pointer;
	min-width: 44px;
	min-height: 44px;
}

/* ---------- 16. Kontakt ------------------------------------------------------ */
.kontakt-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-60);
	align-items: start;
}

@media (max-width: 900px) {
	.kontakt-grid {
		grid-template-columns: 1fr;
	}
}

.kontakt-udaje address {
	font-style: normal;
	margin-bottom: var(--space-30);
}

.kontakt-mapa {
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid rgba(246, 238, 224, 0.18);
	aspect-ratio: 4 / 3;
}

.kontakt-mapa iframe {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
	filter: saturate(0.7) contrast(1.05);
}

.kontakt-formular.tokaj-form-wrap {
	padding: clamp(28px, 3.4vw, 44px);
	border-radius: 28px;
	background: rgba(246, 238, 224, 0.06);
	border: 1px solid rgba(246, 238, 224, 0.16);
}

.kontakt-formular.tokaj-form-wrap h3 {
	margin: 0 0 26px;
	font-weight: 400;
	font-size: 1.75rem;
	color: var(--c-krem);
}

.tokaj-form {
	display: grid;
	gap: 16px;
}

.tokaj-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

@media (max-width: 600px) {
	.tokaj-form__row {
		grid-template-columns: 1fr;
	}
}

.tokaj-form label {
	display: block;
	font-weight: 400;
	margin-bottom: 8px;
	font-size: 0.72rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(246, 238, 224, 0.6);
}

.tokaj-form label span[aria-hidden] {
	color: rgba(246, 238, 224, 0.6);
}

.tokaj-form input,
.tokaj-form select,
.tokaj-form textarea {
	width: 100%;
	padding: 14px 18px;
	min-height: 44px;
	border: 1px solid rgba(246, 238, 224, 0.24);
	border-radius: var(--radius-pill);
	font: inherit;
	font-size: 15px;
	background: rgba(21, 9, 16, 0.35);
	color: var(--c-krem);
}

.tokaj-form select {
	background-image: linear-gradient(45deg, transparent 50%, rgba(246, 238, 224, 0.6) 50%), linear-gradient(135deg, rgba(246, 238, 224, 0.6) 50%, transparent 50%);
	background-position: calc(100% - 20px) center, calc(100% - 15px) center;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	appearance: none;
	-webkit-appearance: none;
	padding-right: 2.5em;
}

.tokaj-form input::placeholder,
.tokaj-form textarea::placeholder {
	color: rgba(246, 238, 224, 0.4);
}

.tokaj-form input:focus-visible,
.tokaj-form select:focus-visible,
.tokaj-form textarea:focus-visible {
	outline: 2px solid rgba(246, 238, 224, 0.7);
	outline-offset: 1px;
}

.tokaj-form textarea {
	min-height: 100px;
	border-radius: 20px;
	resize: vertical;
}

.tokaj-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.tokaj-form__gdpr {
	grid-column: 1 / -1;
	margin: 4px 0 0;
	font-size: 0.78rem;
	font-weight: 300;
	line-height: 1.6;
	color: rgba(246, 238, 224, 0.5);
}

.tokaj-form__status {
	padding: 1.1rem 1.4rem;
	border-radius: 16px;
	display: none;
	font-size: 0.9rem;
}

.tokaj-form__status.is-success {
	display: block;
	background: rgba(143, 190, 43, 0.14);
	color: #d7ecb0;
}

.tokaj-form__status.is-error {
	display: block;
	background: rgba(224, 100, 46, 0.14);
	color: #f3c6b0;
}

/* ---------- 17. Footer -------------------------------------------------------- */
.site-footer {
	background: var(--c-cierna);
	color: var(--c-krem);
}

.site-footer__gradient-line {
	height: 2px;
	border: 0;
	margin: 0;
	background-image: var(--gradient-tokaj);
}

.site-footer__brand {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	column-gap: 14px;
	row-gap: 0;
	margin-bottom: 18px;
}

.site-footer__logo {
	grid-row: 1 / 2;
}

.site-footer__logo .custom-logo-link {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--c-krem);
	overflow: hidden;
}

.site-footer__logo img,
.site-footer__logo .custom-logo {
	max-width: 36px;
	max-height: 36px;
	width: auto;
	object-fit: contain;
}

.site-footer__wordmark {
	grid-row: 1 / 2;
	font-family: var(--font-serif);
	font-weight: 400;
	font-size: 19px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--c-krem);
	display: block;
	margin: 0;
}

.site-footer__tagline {
	grid-column: 1 / -1;
	margin: 18px 0 0;
	font-size: 14.5px;
	font-weight: 300;
	line-height: 1.7;
	color: rgba(246, 238, 224, 0.55);
	max-width: 280px;
}

.site-footer__nav-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-30) var(--space-40);
}

/* Jediné ploché WP menu (Vzhľad → Menu → Menu v pätičke) sa vizuálne
   rozdelí do 2 stĺpcov čisto cez CSS Grid (4 riadky, auto-flow: column) –
   žiadny vlastný walker, klient naďalej spravuje jedno menu v adminovi. */
.site-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-rows: repeat(4, auto);
	grid-auto-flow: column;
	column-gap: 24px;
	row-gap: 12px;
}

@media (max-width: 480px) {
	.site-footer__menu {
		grid-template-rows: none;
		grid-auto-flow: row;
	}
}

.site-footer a {
	color: rgba(246, 238, 224, 0.72);
	font-weight: 300;
	font-size: 14.5px;
	text-decoration: none;
	transition: color var(--transition);
}
.site-footer a:hover {
	color: var(--c-krem);
}

.site-footer address {
	font-style: normal;
	line-height: 1.8;
}

.site-footer__grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1.4fr;
	gap: var(--space-50);
	padding-block: var(--space-70) var(--space-50);
}

@media (max-width: 768px) {
	.site-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 430px) {
	.site-footer__grid {
		grid-template-columns: 1fr;
	}
}

.site-footer__heading {
	text-transform: uppercase;
	letter-spacing: 0.24em;
	font-size: 11px;
	font-weight: 400;
	color: var(--c-akcent-tmava-plocha);
	margin: 0 0 20px;
}

.site-footer__social {
	list-style: none;
	display: flex;
	gap: var(--space-30);
	margin: var(--space-30) 0 0;
	padding: 0;
}

.site-footer__bottom {
	border-top: 1px solid rgba(246, 238, 224, 0.12);
}

.site-footer__bottom-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--space-20);
	padding-block: 26px 34px;
	font-size: 12.5px;
	font-weight: 300;
	color: rgba(246, 238, 224, 0.45);
}

.site-footer__legal a {
	margin-left: var(--space-30);
	color: rgba(246, 238, 224, 0.45);
	font-size: 12.5px;
}
.site-footer__legal a:hover {
	color: var(--c-krem);
}

/* ---------- 18b. Fotografie v sekciách (O nás, O Tokaji, galéria) --------------- */
.o-nas-columns,
.o-tokaji-columns {
	align-items: center;
	gap: clamp(2rem, 5vw, 4.5rem);
}

.o-tokaji-columns--reverse {
	flex-direction: row-reverse;
}

/* O Tokaji – veľké "pilulkové" fotky presne podľa dizajnu (aspect-ratio
   4/5, výrazne zaoblené horné/dolné rohy, striedavo prehodené podľa
   toho, či je fotka v hornom alebo dolnom riadku sekcie). */
.o-tokaji-columns figure.wp-block-image {
	margin: 0;
	aspect-ratio: 4 / 5;
	border-radius: 220px 220px 20px 20px;
	overflow: hidden;
	box-shadow: 0 24px 56px rgba(36, 26, 30, 0.2);
}

.o-tokaji-columns--reverse figure.wp-block-image {
	border-radius: 20px 20px 220px 220px;
}

.o-tokaji-columns img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.is-style-rounded img,
figure.is-style-rounded {
	border-radius: 6px;
	overflow: hidden;
}

.galeria-tokaj img {
	width: 100%;
	height: 260px;
	object-fit: cover;
	border-radius: 4px;
}

@media (max-width: 768px) {
	.o-nas-columns,
	.o-tokaji-columns,
	.o-tokaji-columns--reverse {
		flex-direction: column;
	}

	.o-nas-columns .wp-block-column,
	.o-tokaji-columns .wp-block-column {
		flex-basis: 100% !important;
	}

	.o-tokaji-columns figure.wp-block-image,
	.o-tokaji-columns--reverse figure.wp-block-image {
		aspect-ratio: 4 / 3;
		border-radius: 20px;
	}

	.galeria-tokaj img {
		height: 200px;
	}
}

@media (max-width: 430px) {
	.galeria-tokaj img {
		height: 170px;
	}
}

/* ---------- 18. Utility -------------------------------------------------------- */
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }

@media (min-width: 1441px) {
	.container { max-width: 1320px; }
}

/* =========================================================================
   19. Redizajn podľa Claude Design – zdieľané komponenty pre vnútorné
   stránky (Aktivity, Aktuality, Detail príspevku): tmavé hero sekcie,
   odznaky, filtrovacie "pilulky", karty s fotkou a meta údajmi,
   breadcrumb, pullquote, bočný info-box, stránkovanie, bodkovaný karusel.
   ========================================================================= */

/* Gradientový akcentový prúžok – pod headerom, nad nadpismi sekcií. */
.gradient-bar {
	width: 100%;
	max-width: none;
	height: 4px;
	background-image: var(--gradient-tokaj);
	background-color: transparent;
	border: 0;
	margin: 0;
}

/* Tmavá "hero" hlavička vnútorných stránok (Aktivity, Aktuality, Detail). */
.page-hero {
	background: var(--c-cierna);
	color: var(--c-krem);
	padding-block: var(--space-60) var(--space-70);
}

.page-hero h1 {
	color: var(--c-krem);
}

.page-hero h1 em {
	color: var(--c-piesok);
	font-style: italic;
}

.page-hero .section-lede {
	color: rgba(250, 246, 236, 0.72);
}

/* Breadcrumb navigácia. */
.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(250, 246, 236, 0.55);
	margin-bottom: var(--space-40);
}

.breadcrumb a {
	color: rgba(250, 246, 236, 0.72);
}
.breadcrumb a:hover {
	color: var(--c-piesok);
	text-decoration: none;
}

.breadcrumb__current {
	color: var(--c-piesok);
}

.section .breadcrumb {
	color: var(--c-hneda-svetla);
}
.section .breadcrumb a {
	color: var(--c-hneda);
}

/* Odznak kategórie – plne zaoblená pilulka na fotke alebo pri nadpise. */
.tokaj-badge {
	display: inline-flex;
	align-items: center;
	background: var(--c-cierna);
	color: var(--c-krem);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 0.45em 1em;
	border-radius: var(--radius-pill);
}

.tokaj-badge--on-image {
	position: absolute;
	top: var(--space-30);
	left: var(--space-30);
	z-index: 2;
}

/* Filtrovacie "pilulky" nad mriežkou kariet (kategórie/taxonómie). */
.filter-pills {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6em;
	margin-bottom: var(--space-50);
}

.filter-pill {
	display: inline-flex;
	align-items: center;
	padding: 0.55em 1.3em;
	border-radius: var(--radius-pill);
	border: 1px solid rgba(74, 55, 40, 0.18);
	background: var(--c-biela);
	color: var(--c-hneda);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: background-color var(--transition), color var(--transition), border-color var(--transition);
}

.filter-pill:hover,
.filter-pill:focus-visible {
	border-color: var(--c-vinova);
	color: var(--c-vinova);
	text-decoration: none;
}

.filter-pill.is-active {
	background: var(--c-cierna);
	border-color: var(--c-cierna);
	color: var(--c-krem);
}

.filter-pills__count {
	margin-left: auto;
	font-size: 0.85rem;
	color: var(--c-hneda-svetla);
}

/* Karta s fotkou (aktivita/novinka) – náhrada za pôvodné jednoduchšie
   .aktivita-card / .novinka-card; obe naďalej fungujú, tieto triedy len
   dopĺňajú vizuál podľa Claude Design (obrázok + odznak + meta pätička). */
.tokaj-card {
	background: var(--c-krem-tepla);
	border-radius: 22px;
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	border: 1px solid rgba(36, 26, 30, 0.1);
	transition: transform var(--transition), box-shadow var(--transition);
}

.tokaj-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 38px rgba(36, 26, 30, 0.14);
}

.tokaj-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: linear-gradient(135deg, rgba(122, 37, 48, 0.08), rgba(201, 151, 63, 0.14));
}

.tokaj-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tokaj-card__body {
	padding: var(--space-30) var(--space-30) var(--space-40);
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.tokaj-card__title {
	margin: 0 0 0.4em;
	font-family: var(--font-serif);
	font-weight: 400;
}

.tokaj-card__title a {
	color: var(--c-hneda);
	text-decoration: none;
}

.tokaj-card__excerpt {
	color: var(--c-text-sekundarny);
	font-size: 15.5px;
	font-weight: 300;
	line-height: 1.65;
	flex-grow: 1;
}

.tokaj-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-20);
	margin-top: var(--space-30);
	padding-top: var(--space-30);
	border-top: 1px solid rgba(74, 55, 40, 0.1);
	font-size: 0.85rem;
}

.tokaj-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.9em;
	color: var(--c-hneda-svetla);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-weight: 600;
	font-size: 0.78rem;
}

.tokaj-card__link {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.78rem;
	color: var(--c-vinova);
	white-space: nowrap;
}
.tokaj-card__link:hover {
	color: var(--c-vinova-tmava);
}

.tokaj-card__date {
	color: var(--c-text-sekundarny);
	font-size: 11.5px;
	font-weight: 400;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin-bottom: 0.5em;
	display: block;
}

/* Zvýraznená (featured) karta na vrchu zoznamu Aktualít. */
.tokaj-card--featured {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-50);
	align-items: center;
	background: var(--c-krem-tepla);
	border-radius: 22px;
	overflow: hidden;
	border: 1px solid rgba(36, 26, 30, 0.1);
	margin-bottom: var(--space-60);
}

.tokaj-card--featured .tokaj-card__media {
	aspect-ratio: auto;
	height: 100%;
	min-height: 280px;
}

.tokaj-card--featured .tokaj-card__body {
	padding: var(--space-50) var(--space-50) var(--space-50) 0;
}

@media (max-width: 768px) {
	.tokaj-card--featured {
		grid-template-columns: 1fr;
	}
	.tokaj-card--featured .tokaj-card__body {
		padding: var(--space-40);
	}
}

/* Citácia s menom pivnice (pullquote v tele článku). Rovnaký vizuál
   dostane aj bežná <blockquote> vložená priamo v obsahu článku (redaktor
   ju vytvorí štandardným blokom "Citácia") – netreba žiadnu špeciálnu
   triedu, funguje to automaticky pre každý budúci príspevok. */
.tokaj-pullquote,
.entry-content blockquote {
	background: var(--c-krem);
	border-radius: var(--radius);
	padding: var(--space-50);
	margin-block: var(--space-50);
	border: 0;
}

.tokaj-pullquote p,
.entry-content blockquote p {
	font-family: var(--font-serif);
	font-style: italic;
	font-size: 1.3rem;
	color: var(--c-vinova-tmava);
	margin-bottom: var(--space-20);
}

.tokaj-pullquote cite,
.entry-content blockquote cite {
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.78rem;
	color: var(--c-hneda-svetla);
}

/* Bočný informačný box ("Dobré vedieť" / detaily aktivity). */
.tokaj-info-box {
	background: var(--c-vinova-tmava);
	color: var(--c-krem);
	border-radius: var(--radius);
	padding: var(--space-50);
	margin-block: var(--space-50);
}

.tokaj-info-box__label {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: 0.75rem;
	color: var(--c-piesok);
	margin-bottom: var(--space-20);
	font-weight: 700;
}

.tokaj-info-box p:last-child {
	margin-bottom: 0;
}

/* Zdieľanie + galéria obrázkov v tele článku. */
.tokaj-share {
	display: flex;
	align-items: center;
	gap: var(--space-30);
	margin-block: var(--space-50);
	padding-top: var(--space-40);
	border-top: 1px solid rgba(74, 55, 40, 0.12);
}

.tokaj-share__label {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.78rem;
	color: var(--c-hneda-svetla);
	font-weight: 700;
}

/* Rovnaký vizuál dostane aj bežný Galéria blok priamo v tele článku –
   netreba žiadnu špeciálnu triedu, funguje automaticky pre každý budúci
   príspevok. */
.tokaj-article-gallery,
.entry-content .wp-block-gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-30);
	margin-block: var(--space-50);
}

.tokaj-article-gallery img,
.entry-content .wp-block-gallery img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--radius);
}

@media (max-width: 600px) {
	.tokaj-article-gallery,
	.entry-content .wp-block-gallery {
		grid-template-columns: 1fr 1fr;
	}
}

/* Dvojstĺpcový layout detailu príspevku – článok + bočný panel. */
.article-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: var(--space-60);
	align-items: start;
}

.article-layout__sidebar {
	position: sticky;
	top: 110px;
}

@media (max-width: 900px) {
	.article-layout {
		grid-template-columns: 1fr;
	}
	.article-layout__sidebar {
		position: static;
	}
}

.article-lead {
	font-size: 1.2rem;
	color: var(--c-hneda-svetla);
	margin-bottom: var(--space-40);
}

.article-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em;
	margin-bottom: var(--space-30);
	font-size: 0.85rem;
	color: rgba(250, 246, 236, 0.72);
}

/* Responzívna mriežka kariet (napr. archív Aktivít) – 3 / 2 / 1 stĺpec. */
.tokaj-card-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-50);
	max-width: var(--container-width);
	margin-inline: auto;
}

@media (max-width: 900px) {
	.tokaj-card-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.tokaj-card-grid {
		grid-template-columns: 1fr;
	}
}

/* Modifikátor – 2 stĺpce namiesto 3 (napr. zoznam Aktualít). */
.tokaj-card-grid.tokaj-card-grid--2 {
	grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 600px) {
	.tokaj-card-grid.tokaj-card-grid--2 {
		grid-template-columns: 1fr;
	}
}

/* Súvisiace/ďalšie príspevky. */
.tokaj-related {
	padding-block: var(--space-60);
}

.tokaj-related__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: var(--space-40);
	gap: var(--space-30);
}

.tokaj-related__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-40);
}

@media (max-width: 768px) {
	.tokaj-related__grid {
		grid-template-columns: 1fr;
	}
}

/* Číselné stránkovanie (Aktuality). */
.tokaj-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	margin-top: var(--space-50);
}

.tokaj-pagination a,
.tokaj-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	font-weight: 600;
	color: var(--c-hneda);
	text-decoration: none;
}

.tokaj-pagination a:hover {
	background: rgba(122, 37, 48, 0.08);
	text-decoration: none;
}

.tokaj-pagination .current {
	background: var(--c-vinova-tmava);
	color: var(--c-biela);
}

/* Karusel galérie na homepage – jedna fotka + bodkové stránkovanie. */
.tokaj-carousel {
	position: relative;
	max-width: 900px;
	margin-inline: auto;
}

.tokaj-carousel__track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	border-radius: var(--radius);
	scrollbar-width: none;
}
.tokaj-carousel__track::-webkit-scrollbar {
	display: none;
}

.tokaj-carousel__slide {
	flex: 0 0 100%;
	scroll-snap-align: start;
}

.tokaj-carousel__slide img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.tokaj-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 26px;
}

.tokaj-carousel__dot {
	width: 34px;
	height: 4px;
	border-radius: var(--radius-pill);
	background: rgba(246, 238, 224, 0.25);
	border: 0;
	padding: 0;
	cursor: pointer;
}

.tokaj-carousel__dot.is-active {
	background: var(--c-krem);
	transition: background-color var(--transition);
}

/* Štatistický pás (napr. roky skúseností / počet odrôd / hektáre). */
.tokaj-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-30);
	margin-block: var(--space-50);
}

@media (max-width: 600px) {
	.tokaj-stats {
		grid-template-columns: 1fr 1fr;
	}
}

/* CTA pás pred pätičkou (vínové pozadie, gradientové tlačidlo). */
.tokaj-cta-band {
	background: var(--c-vinova-tmava);
	color: var(--c-krem);
	padding-block: var(--space-60);
}

.tokaj-cta-band h2 {
	color: var(--c-krem);
}

.tokaj-cta-band p {
	color: rgba(250, 246, 236, 0.78);
	max-width: 46ch;
}