/* =========================================================================
   Rave Fusion 3 — vizuálny systém
   -------------------------------------------------------------------------
   Materiál je ľad a chróm, nie „tmavý web s modrým akcentom".
   Tri pravidlá, ktoré držia celok pokope:
     1. Predely medzi sekciami sú zamrznuté hrany s cencúľmi, nie linky.
     2. Nulové zaoblenie — brnenie a ľad sú ostré.
     3. Elektrická modrá označuje na obrazovke práve jednu vec: čo urobiť ďalej.
   ========================================================================= */

:root {
	/* --- povrchy, od najhlbšej noci po ľad --- */
	--rf-night:      #050A13;
	--rf-deep:       #0A1624;
	--rf-steel-900:  #17263A;
	--rf-steel-700:  #2B3546;
	--rf-steel-500:  #40546F;
	--rf-steel-300:  #68768E;

	/* --- text --- */
	--rf-ice:        #D7E3F1;
	--rf-ice-dim:    #BBC5D7;
	--rf-ice-quiet:  #94A8C3;
	/* Drobné popisky potrebujú svetlejšiu oceľ než okraje — #68768E má na
	   oceľovej doske len 3,32 : 1. */
	--rf-label:      #97A6C1;

	/* --- jediný akcent ---
	   #197AE5 je farba z plagátu a používa sa na okraje, žiaru a zvýraznenia.
	   Ako výplň pod bielym textom je ale na 4,24 : 1, čo nestačí — preto má
	   tlačidlo o niečo tmavší odtieň, ktorý drží 4,74 : 1. */
	--rf-blue:       #197AE5;
	--rf-blue-fill:  #1772D8;
	--rf-blue-hot:   #4FB0FF;

	/* --- rytmus: jedna stupnica, žiadne náhodné hodnoty --- */
	--rf-1:  4px;
	--rf-2:  8px;
	--rf-3:  16px;
	--rf-4:  24px;
	--rf-5:  40px;
	--rf-6:  64px;
	--rf-7:  96px;
	--rf-8: 144px;

	--rf-measure: 68ch;   /* dĺžka riadku bežného textu */
	--rf-shell:  1680px;  /* šírka obsahu; web je celoplošný, obmedzuje sa až text */

	/* Cesty sú relatívne k tomuto súboru, nie k stránke — rf.css leží v assets/. */
	--rf-edge: url("img/drip-edge.svg");
	--rf-edge-sm: url("img/drip-edge-sm.svg");
	/* Podklad pod hero je rozostrený o 46 px, takže detail v ňom nikto
	   neuvidí — nesie ho zmenšená kópia plagátu (360 px, 13 kB namiesto
	   190 kB). Zdroj `img/hero.webp` ostáva v téme, keby bolo treba
	   podklad prerobiť. */
	--rf-hero-wash: url("img/hero-wash.webp");
	--rf-znacka: url("img/znacka.svg");
}

/* =========================================================================
   Základná vrstva
   Bez nej je čerstvý WordPress biely a vizuálny systém sa prejaví až tam,
   kde sa použije trieda rf-. Stránka má stáť na tmavom podklade od prvej
   sekundy, aj na miestach, ktoré ešte nie sú postavené — biely záblesk pri
   načítaní tmavého webu je vidieť viac než čokoľvek iné.

   Bez !important, aby si Elementor Kit mohol presadiť vlastnú typografiu
   tam, kde ju Samuel nastaví cez rozhranie.
   ========================================================================= */

html {
	background: var(--rf-night);
}

body {
	background: var(--rf-night);
	color: var(--rf-ice-dim);
	font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

body a {
	color: var(--rf-blue-hot);
}

body a:hover {
	color: var(--rf-ice);
}

/* =========================================================================
   Typografia
   Dve písma. Big Shoulders Display nesie čísla a nadpisy, Inter všetko ostatné.
   Je výrazne užšie a ľahšie než bežné ťažké groteskné písma, takže nadpisy
   idú o stupeň väčšie a v reze 800 — inak by na tmavom podklade zoslabli.
   Čísla sú najhlasnejší prvok na stránke — dátum, cena, odpočet, zostávajúce
   lístky. To sú údaje, kvôli ktorým sa človek rozhoduje.
   ========================================================================= */

.rf-display,
.rf-h1, .rf-h2, .rf-h3 {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .005em;
	color: var(--rf-ice);
}

.rf-h1 { font-size: clamp(3.25rem, 8.4vw, 6.5rem);  line-height: .84; }
.rf-h2 { font-size: clamp(2.25rem, 5vw, 4.25rem);   line-height: .9; }
.rf-h3 { font-size: clamp(1.35rem, 2vw, 1.75rem);   line-height: 1.05; }

.rf-body {
	font-family: Inter, system-ui, sans-serif;
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--rf-ice-dim);
	max-width: var(--rf-measure);
}

/* Údaj, ktorý sa číta ako číslo na plagáte. */
.rf-figure {
	font-family: "Big Shoulders Display", sans-serif;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	color: var(--rf-ice);
	line-height: 1;
}

/* Chrómový nadpis podľa loga. Používaj striedmo — na stránke patrí jednému. */
.rf-chrome {
	background: linear-gradient(180deg, #fff 6%, #cfe0f4 34%, #7d95b4 56%, #eaf3ff 84%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	filter: drop-shadow(0 0 26px rgba(25, 122, 229, .45));
}

/* =========================================================================
   Zamrznutá hrana
   Jeden SVG tvar použitý ako maska, takže ho zafarbí background sekcie
   a netreba ho duplikovať pre každú farbu.
   ========================================================================= */

.rf-section {
	position: relative;
	padding: clamp(72px, 10vh, 140px) clamp(20px, 4vw, 72px);
}
.rf-section > * { position: relative; z-index: 1; }

.rf-section--night { background: var(--rf-night); }
.rf-section--deep  { background: var(--rf-deep); }
.rf-section--steel { background: var(--rf-steel-900); }

/* Hrana visí NADOL do nasledujúcej sekcie a farbu preberá zo sekcie, z ktorej visí.
   Maska sa NEŠKÁLUJE na šírku kontajnera — cencúle si držia svoju veľkosť a dláždia sa.
   Keby sa škálovali, na úzkej obrazovke by sa stlačili do zubatého pásu, ktorý
   vyzerá ako zvuková vlna, nie ako ľad. */
.rf-section::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	/* Horných 16 px tvaru je plná hrana a musí zostať v sekcii, z ktorej visí;
	   nadol prečnieva zvyšok. Väčší previs by dosahoval na nadpis nasledujúcej sekcie. */
	bottom: -68px;
	height: 84px;
	background: inherit;
	-webkit-mask-image: var(--rf-edge);
	mask-image: var(--rf-edge);
	-webkit-mask-size: 1200px 84px;
	mask-size: 1200px 84px;
	-webkit-mask-repeat: repeat-x;
	mask-repeat: repeat-x;
	-webkit-mask-position: left top;
	mask-position: left top;
	z-index: 2;
	pointer-events: none;
}

.rf-section--last::after,
.rf-section--flat::after { display: none; }

.rf-section--fine::after {
	bottom: -34px;
	height: 36px;
	-webkit-mask-image: var(--rf-edge-sm);
	mask-image: var(--rf-edge-sm);
	-webkit-mask-size: 1200px 36px;
	mask-size: 1200px 36px;
}

/* Bez podpory masky sa hrana nezobrazí; sekcie sa aj tak líšia farbou. */
@supports not ((mask-image: url("img/drip-edge.svg")) or (-webkit-mask-image: url("img/drip-edge.svg"))) {
	.rf-section::after { display: none; }
}

.rf-shell { max-width: var(--rf-shell); margin-inline: auto; }

/* =========================================================================
   Tlačidlá
   Jedno hlavné na obrazovku. Bez šípok, bez zaoblenia.
   ========================================================================= */

.rf-btn {
	display: inline-block;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 15px var(--rf-4);
	border: 1px solid transparent;
	border-radius: 0;
	transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.rf-btn:focus-visible,
.rf-btn .elementor-button:focus-visible {
	outline: 2px solid var(--rf-blue-hot);
	outline-offset: 3px;
}

/* Trieda .rf-btn sedí raz na samotnom odkaze (lepiaca lišta, pätička),
   raz na obale widgetu Elementora — vzhľad preto musí platiť pre oba tvary.
   Zdvojená trieda kvôli váhe: Elementor si do hárku stránky generuje
   `.elementor-widget-button .elementor-button { … }` a načíta sa neskôr. */
a.rf-btn--go,
a.rf-btn--quiet,
.rf-btn--go.rf-btn--go .elementor-button,
.rf-btn--quiet.rf-btn--quiet .elementor-button {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid transparent;
	border-radius: 0;
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	font-size: 1.1rem;
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: .04em;
	text-decoration: none;
	padding: 15px 28px;
	transition: transform .18s cubic-bezier(.22, .61, .36, 1),
	            background-color .2s ease, border-color .2s ease, box-shadow .25s ease;
}

/* Odlesk ako svetlo po ľade. Prejde raz, nie dokola. */
a.rf-btn--go::before,
a.rf-btn--quiet::before,
.rf-btn--go.rf-btn--go .elementor-button::before,
.rf-btn--quiet.rf-btn--quiet .elementor-button::before {
	content: "";
	position: absolute;
	inset: -20% -40%;
	background: linear-gradient(104deg, transparent 34%, rgba(232, 241, 255, .38) 50%, transparent 66%);
	translate: -120% 0;
	transition: translate .6s cubic-bezier(.3, .7, .3, 1);
	pointer-events: none;
}

a.rf-btn--go:hover::before,
a.rf-btn--quiet:hover::before,
.rf-btn--go.rf-btn--go .elementor-button:hover::before,
.rf-btn--quiet.rf-btn--quiet .elementor-button:hover::before {
	translate: 120% 0;
}

a.rf-btn--go,
.rf-btn--go.rf-btn--go .elementor-button {
	background-color: var(--rf-blue-fill);
	color: #fff;
	border-color: rgba(160, 205, 255, .5);
	box-shadow: 0 0 0 1px rgba(79, 176, 255, .2), 0 10px 30px rgba(8, 46, 96, .5);
}

a.rf-btn--go:hover,
a.rf-btn--go:focus,
.rf-btn--go.rf-btn--go .elementor-button:hover,
.rf-btn--go.rf-btn--go .elementor-button:focus {
	background-color: var(--rf-blue-hot);
	color: #fff;
	border-color: rgba(214, 233, 255, .8);
	box-shadow: 0 0 0 1px rgba(160, 205, 255, .55), 0 14px 34px rgba(25, 122, 229, .45);
	transform: translateY(-2px);
}

a.rf-btn--go:active,
.rf-btn--go.rf-btn--go .elementor-button:active { transform: translateY(0); }

/* Tiché tlačidlo je doska ľadu, nie prázdny rámik. */
a.rf-btn--quiet,
.rf-btn--quiet.rf-btn--quiet .elementor-button {
	background-color: transparent;
	background-image: linear-gradient(180deg, rgba(140, 180, 230, .16), rgba(90, 130, 190, .05));
	color: var(--rf-ice);
	border-color: var(--rf-steel-500);
}

a.rf-btn--quiet:hover,
a.rf-btn--quiet:focus,
.rf-btn--quiet.rf-btn--quiet .elementor-button:hover,
.rf-btn--quiet.rf-btn--quiet .elementor-button:focus {
	background-color: transparent;
	background-image: linear-gradient(180deg, rgba(170, 210, 250, .26), rgba(100, 145, 205, .1));
	color: #fff;
	border-color: var(--rf-ice-quiet);
	transform: translateY(-2px);
}

a.rf-btn--quiet:active,
.rf-btn--quiet.rf-btn--quiet .elementor-button:active { transform: translateY(0); }

/* Cencúle z hornej hrany — ten istý motív ako v logu. Narastú pri prejdení. */
a.rf-btn--quiet::after,
.rf-btn--quiet.rf-btn--quiet .elementor-button::after {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 10px;
	background: var(--rf-ice-quiet);
	-webkit-mask: url("img/drip-edge-sm.svg") top left / 120px 10px repeat-x;
	        mask: url("img/drip-edge-sm.svg") top left / 120px 10px repeat-x;
	opacity: 0;
	transition: opacity .22s ease;
	pointer-events: none;
}

a.rf-btn--quiet:hover::after,
a.rf-btn--quiet:focus::after,
.rf-btn--quiet.rf-btn--quiet .elementor-button:hover::after,
.rf-btn--quiet.rf-btn--quiet .elementor-button:focus::after {
	opacity: .5;
}

@media (prefers-reduced-motion: reduce) {

	a.rf-btn--go,
	a.rf-btn--quiet,
	.rf-btn--go.rf-btn--go .elementor-button,
	.rf-btn--quiet.rf-btn--quiet .elementor-button {
		transition: background-color .2s ease, border-color .2s ease;
		transform: none;
	}

	a.rf-btn--go::before,
	a.rf-btn--quiet::before,
	.rf-btn--go.rf-btn--go .elementor-button::before,
	.rf-btn--quiet.rf-btn--quiet .elementor-button::before {
		display: none;
	}
}

/* =========================================================================
   Obraz z promo videa pod sekciou
   Sekcia si necháva svoju tmu; obraz leží hlboko pod ňou a je vidieť ho
   len tam, kde nič nie je. Stmavenie je v tom istom deklarácii, nie v
   prekryve cez pseudoprvok — hroty aj reťaze si ::before a ::after už
   zabrali a druhý by prvý prepísal.
   Zdvojená trieda kvôli váhe: `.rf-section--night` nastavuje `background`
   skratkou, ktorá by obraz zhasla.
   ========================================================================= */

.rf-obraz--dav.rf-obraz--dav,
.rf-obraz--drak.rf-obraz--drak {
	background-repeat: no-repeat, no-repeat;
	background-size: cover, cover;
	background-attachment: scroll, scroll;
}

/* Sekcie sa striedajú: pohyblivé pozadie — plocha — pohyblivé pozadie.
   Line-up, miesto a kontakt sú plochy. Predtým mali pod sebou fotku, ktorá
   začínala až v polovici sekcie a na jej hornej hrane bol vidieť rovný
   zlom — obraz vyzeral ako nedotiahnutý, nie ako pozadie. Plocha nie je
   mŕtva čierna: prechod v oceľových tónoch drží hĺbku, len sa nikde
   nezalomí. */
.rf-obraz--hrad.rf-obraz--hrad,
.rf-obraz--tron.rf-obraz--tron {
	background-image: linear-gradient(180deg, var(--rf-night), #071120 46%, var(--rf-night));
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/* Zamrznutý dav pod otázkami a drak pod vstupenkami. Oba sedia pri
   spodnej hrane sekcie, aby nešli pod nadpis — text má nad sebou tmu,
   obraz začína tam, kde obsah končí. */
.rf-obraz--dav.rf-obraz--dav {
	background-image:
		linear-gradient(180deg, rgba(5, 10, 19, .97) 16%, rgba(5, 10, 19, .62) 60%, rgba(5, 10, 19, .88)),
		var(--rf-dav, none);
	background-position: center, center bottom;
}

.rf-obraz--drak.rf-obraz--drak {
	background-image:
		linear-gradient(180deg, rgba(5, 10, 19, .96) 14%, rgba(5, 10, 19, .54) 58%, rgba(5, 10, 19, .86)),
		var(--rf-drak, none);
	background-position: center, center bottom;
}

/* Na úzkej obrazovke by obraz na plnú šírku zmizol do pár desiatok
   pixelov výšky — tam ho radšej zväčšíme a orežeme. */
@media (max-width: 900px) {

	.rf-obraz--hrad.rf-obraz--hrad,
	.rf-obraz--tron.rf-obraz--tron,
	.rf-obraz--dav.rf-obraz--dav,
	.rf-obraz--drak.rf-obraz--drak {
		background-size: cover, cover;
	}
}


/* =========================================================================
   Oceľová doska — základ kariet vstupeniek aj interpretov
   ========================================================================= */

.rf-plate {
	position: relative;
	background: linear-gradient(180deg, var(--rf-steel-900), var(--rf-deep));
	border: 1px solid var(--rf-steel-700);
	border-radius: 0;
	padding: var(--rf-4);
}

.rf-plate--live { border-color: var(--rf-blue); }

/* Vypredané a zamknuté sú doslova zamrznuté: námraza cez celú dosku. */
.rf-plate--frozen { border-color: var(--rf-steel-700); }
.rf-plate--frozen::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(200deg, rgba(215, 227, 241, .16), rgba(215, 227, 241, .04) 42%, transparent 68%),
		repeating-linear-gradient(118deg, rgba(215, 227, 241, .07) 0 2px, transparent 2px 9px);
	pointer-events: none;
}
/* Zamrznutý obsah je stlmený, ale musí zostať čitateľný. Pri .58 vyšlo
   „Zamknuté" na 3,96 : 1 — pod hranicou 4,5 : 1. Odmerané, nie odhadnuté. */
.rf-plate--frozen > * { opacity: .72; }

/* =========================================================================
   Vstupenky
   ========================================================================= */

.rf-tickets {
	display: grid;
	gap: var(--rf-3);
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.rf-ticket__wave  { font-family: "Big Shoulders Display", sans-serif; font-weight: 700; text-transform: uppercase;
                    font-size: 1.5rem; color: var(--rf-ice); }
.rf-ticket__price { font-family: "Big Shoulders Display", sans-serif; font-weight: 800; font-size: 3.75rem; line-height: 1;
                    color: var(--rf-ice); margin-top: var(--rf-2); }
.rf-ticket__price small { font-size: 1.125rem; color: var(--rf-ice-quiet); margin-left: 6px; }

.rf-ticket__left {
	font-family: Inter, sans-serif;
	font-size: .8125rem;
	color: var(--rf-ice-quiet);
	margin-top: var(--rf-2);
}
.rf-ticket__left b { color: var(--rf-blue-hot); font-weight: 700; }

/* =========================================================================
   Line-up
   Neohlásený slot je zaliaty v ľade a ovinutý reťazou — nie karta s otáznikom.
   ========================================================================= */

.rf-lineup {
	display: grid;
	gap: var(--rf-3);
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.rf-act { position: relative; overflow: hidden; }
.rf-act__name { font-family: "Big Shoulders Display", sans-serif; font-weight: 800; text-transform: uppercase;
                font-size: 2.6rem; line-height: 1; color: var(--rf-ice); }
.rf-act__meta { font-family: Inter, sans-serif; font-size: .8125rem;
                color: var(--rf-ice-quiet); margin-top: var(--rf-2); }
.rf-act--head .rf-act__name { font-size: 3rem; }

.rf-act--locked .rf-act__name { color: var(--rf-ice-quiet); }

/* Reťaz cez zamknutý slot. Leží POD textom, nie cezeň — informácia
   „odomkneme v októbri" musí zostať čitateľná. Karta na ňu má vyhradené
   miesto v spodnom odsadení. */
.rf-act--locked { padding-bottom: 56px; }

/* Ľadová klietka z promo videa. Zamknutý slot je doslova zamrznutý meno
   — obrázok leží hlboko pod tmavým prechodom, aby z neho zostal materiál,
   nie fotka na karte. */
.rf-act--locked {
	background-image:
		linear-gradient(180deg, rgba(10, 22, 36, .86), rgba(5, 10, 19, .94)),
		var(--rf-klietka, none);
	background-size: cover, cover;
	background-position: center, center 30%;
	background-repeat: no-repeat, no-repeat;
}

.rf-act--locked::after {
	content: "";
	position: absolute;
	/* Reťaz zostáva v karte. Presah cez okraj (bolo -14 % na oboch
	   stranách) preložil reťaz cez susednú kartu a vytiekol zo sekcie —
	   odmerané na vykreslenej stránke, čítalo sa to ako chyba sadzby,
	   nie ako ozdoba. Konce sa strácajú v maske, aby reťaz nekončila
	   odseknutým článkom. */
	left: 18px;
	right: 18px;
	bottom: 16px;
	height: 26px;
	background: url("img/chain.svg") left center/34px 26px repeat-x;
	/* Na holej doske stačilo .5; cez ľadovú klietku sa reťaz strácala. */
	opacity: .68;
	transform: rotate(-1.6deg);
	-webkit-mask: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
	        mask: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
	pointer-events: none;
}

/* =========================================================================
   Odpočet
   ========================================================================= */

.rf-countdown { display: flex; gap: var(--rf-4); }
.rf-countdown__unit { min-width: 68px; text-align: center; }
.rf-countdown__n { font-family: "Big Shoulders Display", sans-serif; font-weight: 800; font-variant-numeric: tabular-nums;
                   font-size: clamp(2.4rem, 4.6vw, 3.35rem); line-height: 1; color: var(--rf-ice); }
.rf-countdown__l { font-family: Inter, sans-serif; font-size: .6875rem;
                   letter-spacing: .18em; text-transform: uppercase;
                   color: var(--rf-ice-quiet); margin-top: 6px; }

/* =========================================================================
   Údajová lišta
   Miesto reťazca spájaného bodkami: samostatné bunky oddelené oceľou,
   ako kreditný blok na plagáte.
   ========================================================================= */

.rf-facts {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	border-top: 1px solid var(--rf-steel-700);
	border-bottom: 1px solid var(--rf-steel-700);
}
.rf-facts__cell {
	/* Kontajner Elementora si drží `width: var(--width)` s predvolenými 100 %.
	   Bunky sa preto zalomili pod seba a lišta faktov mala 262 px namiesto 89 —
	   hero potom prerástol okno o 18 px. Šírka podľa obsahu, nie na celý riadok. */
	--width: auto;
	flex: 0 1 auto;
	align-items: center;
	text-align: center;
	padding: 14px var(--rf-4);
	border-right: 1px solid var(--rf-steel-700);
}
.rf-facts__cell:last-child { border-right: 0; }

/* Kontajner Elementora je široký na celý riadok; lišta faktov má byť
   široká podľa obsahu, inak sa linky ťahajú cez celú obrazovku. */
.rf-hero .rf-facts {
	--width: auto;
	width: auto;
	max-width: 100%;
}
.rf-facts__k { font-family: Inter, sans-serif; font-size: .6875rem; letter-spacing: .16em;
               text-transform: uppercase; color: var(--rf-label); }
.rf-facts__v { font-family: "Big Shoulders Display", sans-serif; font-weight: 700; font-size: 1.7rem; color: var(--rf-ice);
               margin-top: 4px; text-transform: uppercase; }

/* =========================================================================
   Hero
   Celá obrazovka, od okraja po okraj. Pozadie je video, ak je zadané,
   inak rozostrená kópia plagátu — plagát má len 941 px na šírku a nikdy
   sa neroztiahne nad svoju veľkosť, celoplošný dojem robí tá kópia.
   ========================================================================= */

.rf-hero {
	position: relative;
	overflow: hidden;
	background: var(--rf-night);
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	isolation: isolate;
}

/* Hlavička leží na hero a pás s heslami mu kryje spodnú hranu. Odsadenie
   patrí na vnútorný blok, nie na hero: hero má výšku obrazovky a padding
   by ho o svoju hodnotu predĺžil — pás s heslami by spadol pod ohyb.
   Odmerané na 390 px: hlavička 102 px, pás 56 px, obsah 588 px. */
@media (max-width: 900px) {

	/* Odsadenie zadané v Elementore má v hárku stránky tri triedy a načíta
	   sa neskôr; preto štyri. */
	.rf-hero .rf-hero__inner.rf-hero__inner.rf-hero__inner {
		padding-top: 88px;
		padding-bottom: 66px;
	}
}

.rf-hero__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.rf-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rf-hero__wash {
	position: absolute; inset: -8%;
	background: var(--rf-hero-wash) center/cover no-repeat;
	filter: blur(46px) saturate(.85) brightness(.5);
	transform: scale(1.08);
	animation: rf-drift 34s ease-in-out infinite alternate;
}

@keyframes rf-drift {
	from { transform: scale(1.08) translate3d(-1.2%, -0.8%, 0); }
	to   { transform: scale(1.16) translate3d(1.2%, 0.8%, 0); }
}

/* Video z promo je samo o sebe svetlé — bez poriadneho závoja sa v ňom
   stratil aj nadpis aj popisky. Tmavne od stredu k okrajom, aby logo
   sedelo v jame svetla a text mal pod sebou plochu. */
.rf-hero__veil {
	position: absolute; inset: 0;
	background:
		radial-gradient(120% 76% at 50% 30%, rgba(25, 122, 229, .12), transparent 60%),
		radial-gradient(88% 62% at 50% 46%, rgba(5, 10, 19, .5), rgba(5, 10, 19, .2) 64%, transparent 84%),
		linear-gradient(180deg, rgba(5, 10, 19, .72), rgba(5, 10, 19, .24) 30%, rgba(5, 10, 19, .46) 66%, rgba(5, 10, 19, .92));
}

/* Elementor pustí video na pozadí kontajnera. Stlmené je aj tak — toto je
   posledná vrstva, aby cez neho text držal kontrast na každej snímke. */
.rf-hero .elementor-background-video-container {
	filter: brightness(.82) saturate(.85) contrast(1.04);
}

/* Na mobile video nebeží a kontajner nesie záskokový obrázok. Ten cez
   filter neprejde — odmerané: nadpisy na ňom takmer zanikli. Závoj preto
   na úzkej obrazovke pritvrdí. */
@media (max-width: 900px) {

	.rf-hero__veil {
		background:
			radial-gradient(120% 70% at 50% 26%, rgba(25, 122, 229, .1), transparent 58%),
			linear-gradient(180deg, rgba(5, 10, 19, .8), rgba(5, 10, 19, .5) 32%, rgba(5, 10, 19, .66) 68%, rgba(5, 10, 19, .95));
	}
}

/* Jemné zrno zjednotí video, fotku aj plochú farbu do jedného povrchu.
   Bez neho vyzerá prechod medzi obrazom a tmou ako plastová páska. */
.rf-hero__grain {
	position: absolute; inset: 0;
	opacity: .28;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27140%27 height=%27140%27%3E%3Cfilter id=%27n%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%27.85%27 numOctaves=%273%27/%3E%3C/filter%3E%3Crect width=%27140%27 height=%27140%27 filter=%27url(%23n)%27 opacity=%27.5%27/%3E%3C/svg%3E");
}

/* Hero je jeden stĺpec na stred. Dvojstĺpec s plagátom vpravo pôsobil
   rozhádzane a plagát bol druhá kópia toho istého diela, ktoré teraz beží
   na pozadí ako video. */
.rf-hero__inner {
	position: relative; z-index: 1;
	width: 100%;
	max-width: 1120px;
	margin-inline: auto;
	padding: clamp(88px, 11vh, 150px) clamp(20px, 4vw, 48px) clamp(112px, 13vh, 170px);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.rf-hero__copy {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}

.rf-hero__poster {
	width: 100%; max-width: 460px; height: auto; display: block;
	border: 1px solid var(--rf-steel-700);
	box-shadow: 0 30px 80px rgba(0, 0, 0, .6), 0 0 60px rgba(25, 122, 229, .18);
}

/* Plagát sa nakláňa za kurzorom. Je to jediný pohyb, ktorý reaguje na
   človeka — preto si ho môže dovoliť práve tá jedna vec, kvôli ktorej
   sa na hero pozerá. */
.rf-hero__art {
	transition: transform .35s cubic-bezier(.22, .61, .36, 1);
}

/* Perspektíva sa zapne až pri kurzore nad plagátom. Natrvalo zapnutá
   spolu s will-change si prvok povyšovala na vlastnú kompozitnú vrstvu
   a tá sa občas vykreslila prázdna — plagát raz bol a raz nie. */
.rf-hero__art--naklonene {
	transform: perspective(1100px)
	           rotateX(var(--rf-tilt-x, 0deg))
	           rotateY(var(--rf-tilt-y, 0deg));
}

.rf-hero__logo {
	width: min(100%, 640px); height: auto; display: block;
	filter: drop-shadow(0 0 46px rgba(25, 122, 229, .28));
}

/* Na telefóne ide filter preč úplne. WebKit si nad obrázkom s filtrom
   vyrobí vlastnú kompozitnú vrstvu a keď je obrázok dekódovaný asynchrónne
   (Elementor dáva `decoding="async"`), ostane v nej biely obdĺžnik —
   presne to hlásil iPhone. Logo má žiaru namaľovanú v grafike, takže sa
   tým nič nestratí. */
@media (max-width: 900px) {

	.rf-hero__logo {
		filter: none;
	}
}

.rf-hero__tag {
	font-family: "Big Shoulders Display", sans-serif; font-weight: 600;
	text-transform: uppercase;
	font-size: clamp(1.1rem, 1.7vw, 1.45rem); letter-spacing: .26em;
	color: var(--rf-ice-quiet); margin-top: var(--rf-3);
}

.rf-hero__cta { display: flex; flex-wrap: wrap; gap: var(--rf-3); align-items: center;
                justify-content: center; margin-top: var(--rf-4); }

.rf-hero__odpocet { margin-top: var(--rf-5); }

.rf-hero .rf-countdown { justify-content: center; }

/* Ukazovateľ, že stránka pokračuje. Čiara sa spúšťa a mizne — šípka by
   sľubovala kliknutie, toto len naznačuje smer. */
.rf-hero__scroll {
	position: absolute;
	left: 50%; bottom: 84px;
	translate: -50% 0;
	z-index: 3;
	display: block; width: 24px; height: 46px;
}

.rf-hero__scroll-line {
	position: absolute; left: 50%; top: 0;
	width: 1px; height: 100%;
	background: linear-gradient(180deg, transparent, var(--rf-ice-quiet));
	transform-origin: top;
	animation: rf-scroll 2.4s ease-in-out infinite;
}

@keyframes rf-scroll {
	0%   { transform: scaleY(0); opacity: 0; }
	40%  { transform: scaleY(1); opacity: 1; }
	100% { transform: scaleY(1); opacity: 0; }
}

/* =========================================================================
   Bežiaci pás
   Nesie skutočné brandové vety z dodaných materiálov, nie vymyslené heslá.
   ========================================================================= */

/* Spodok hero prechádza do ďalšej sekcie. Pás s vetami sa vešia na widget,
   nie na hero — pod ním tak ostávalo ešte sedemdesiat pixelov plagátu a na
   hrane sekcie z toho bola rovná linka. Toto ju prekryje bez ohľadu na to,
   kde presne pás skončí. Farba na konci je presne farba sekcie Line-up. */
.rf-hero::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 120px;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(10, 22, 36, 0) 0%, var(--rf-deep) 88%);
}

/* Pás nie je doska položená na plagát — je to spodok hero, ktorý sa
   stmieva do ďalšej sekcie. Preto nemá ani rámik, ani rozostrenie
   podkladu: predtým tu boli nad sebou tri vodorovné linky (horná hrana
   dosky, jej spodná hrana a hrana hero) a pás vyzeral ako nalepený
   pásik. Spodná farba je presne farba sekcie Line-up, takže prechod
   medzi hero a ňou nie je vidieť.
   Na koncoch sa pás stráca — inak sa veta sekla uprostred slova a reťaz
   po stranách hero vyzerala preseknutá. */
.rf-marquee {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 3;
	overflow: hidden;
	background: linear-gradient(180deg,
		rgba(5, 10, 19, 0) 0%,
		rgba(5, 10, 19, .55) 30%,
		rgba(7, 15, 27, .92) 62%,
		var(--rf-deep) 100%);
	padding: 30px 0 20px;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	        mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}

.rf-marquee__track {
	display: flex;
	width: max-content;
	animation: rf-marquee 38s linear infinite;
}

.rf-marquee__item {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 600;
	font-size: 1.05rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	/* Zmerané na živom pozadí: pri `--rf-ice-quiet` sa veta v páse
	   strácala natoľko, že sa nedala prečítať. */
	color: rgba(228, 240, 255, .92);
	padding-inline: clamp(24px, 4vw, 56px);
	white-space: nowrap;
}

.rf-marquee__item::after {
	content: "\25C6";
	margin-left: clamp(24px, 4vw, 56px);
	color: var(--rf-blue);
}

@keyframes rf-marquee {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(-50%, 0, 0); }
}

/* =========================================================================
   Príchod obsahu
   ========================================================================= */

/* Skrytie je podmienené triedou `rf-js`, ktorú nasadzuje krátky skript
   v hlavičke. Bez nej — teda keď JS neprejde, čo sa stáva častejšie, než
   sa zdá — ostane obsah normálne viditeľný. Inak by pri zlyhaní jedného
   súboru bola celá stránka prázdna. */
.rf-js [data-rf-in],
.rf-js [data-rf-reveal],
.rf-js .rf-reveal {
	opacity: 0;
	transform: translate3d(0, 18px, 0);
	transition: opacity .7s cubic-bezier(.22, .61, .36, 1),
	            transform .7s cubic-bezier(.22, .61, .36, 1);
}

/* Rovnaká váha ako `.rf-js .rf-reveal` vyššie, inak by skrytie vyhralo
   navždy a odkryté by sa nezobrazilo nič. Stalo sa presne to — osem
   prvkov ostalo neviditeľných. */
.rf-js .rf-in--hotovo,
.rf-in--hotovo {
	opacity: 1;
	transform: none;
}

/* Kto má v systéme vypnuté animácie, dostane hotovú stránku. Nie pomalšiu
   animáciu — žiadnu. */
@media (prefers-reduced-motion: reduce) {

	[data-rf-in],
	[data-rf-reveal],
	.rf-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.rf-hero__wash,
	.rf-marquee__track,
	.rf-hero__scroll-line {
		animation: none;
	}

	.rf-hero__art,
	.rf-hero__art--naklonene {
		transform: none;
		transition: none;
	}
}

/* =========================================================================
   Lišta s tlačidlom, ktorá príde až po hero sekcii
   Dovtedy je tlačidlo v hlavičke aj v hero; tretia kópia by prekážala.
   ========================================================================= */

.rf-bar {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 60;
	display: flex; align-items: center; justify-content: space-between;
	gap: var(--rf-3);
	padding: 12px clamp(16px, 3vw, 32px);
	background: rgba(10, 22, 36, .92);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-top: 1px solid var(--rf-steel-700);
	transform: translate3d(0, 110%, 0);
	transition: transform .32s cubic-bezier(.22, .61, .36, 1);
}

.rf-bar--vidno {
	transform: none;
}

.rf-bar__text {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	font-size: 1.25rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--rf-ice);
	margin: 0;
}

.rf-bar__note {
	display: block;
	font-family: Inter, sans-serif;
	font-weight: 400;
	font-size: .78rem;
	letter-spacing: .02em;
	text-transform: none;
	color: var(--rf-label);
}

/* Na úzkej obrazovke sa dátum lámal na dva riadky a tlačidlo na ďalšie
   dva — z lišty bol trojposchodový blok. Dátum je aj v hero aj v pätičke,
   tu ustúpi tlačidlu. */
@media (max-width: 480px) {

	.rf-bar {
		padding: 10px 14px;
		gap: var(--rf-2);
	}

	.rf-bar__note {
		display: none;
	}

	.rf-bar a.rf-btn--go {
		white-space: nowrap;
		padding-inline: 16px;
	}
}

@media (max-width: 900px) {
	.rf-hero__inner { padding-top: var(--rf-5); }
	.rf-section { padding: var(--rf-6) var(--rf-3); }
	.rf-countdown { gap: var(--rf-3); }
	.rf-countdown__unit { min-width: 56px; }
}

@media (max-width: 620px) {
	/* Vedľa seba sa bunky na úzkej obrazovke zalamujú do nepravidelných riadkov
	   a zvislé oceľové linky končia uprostred ničoho. Pod sebou drží lišta tvar. */
	.rf-facts { display: block; }
	.rf-facts__cell {
		--width: 100%;
		border-right: 0;
		border-bottom: 1px solid var(--rf-steel-700);
		margin-right: 0;
		padding: 10px 0;
	}
	.rf-facts__cell:last-child { border-bottom: 0; }

	/* Popis a hodnota vedľa seba — smer riadi nastavenie prvku v Elementore,
	   tu ostáva len zarovnanie textu. Pod sebou brali tri fakty 271 px z 812
	   a odpočet padol pod ohyb. */
	.rf-facts__v { margin-top: 0; text-align: right; }
}

/* =========================================================================
   Kvalitatívny základ
   ========================================================================= */

/* Nadpis h1 patrí každej stránke aj vtedy, keď je vizuálne nahradený logom.
   Bez neho nemá stránka pre čítačku ani pre Google hlavný nadpis. */
.rf-hidden {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.rf-skip {
	position: absolute; left: -9999px;
	background: var(--rf-blue); color: #fff; padding: 12px 18px; z-index: 99;
}
.rf-skip:focus { left: var(--rf-3); top: var(--rf-3); }

@media (prefers-reduced-motion: reduce) {
	.rf-chrome { filter: none; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* =========================================================================
   Integrácia s Elementorom
   Elementor vešia vlastné triedy na obal widgetu, nie na samotný odkaz či
   tlačidlo. Trieda z poľa „CSS Classes" preto sedí na .elementor-widget,
   a odtiaľ sa treba dostať na prvok vnútri. Bez tohto bloku vyzerá
   tlačidlo ako predvolené zelené Elementor tlačidlo — čo bol prvý stav.
   ========================================================================= */

.rf-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 50;
	background: transparent;
	transition: background-color .3s ease, backdrop-filter .3s ease;
}

/* Nad hero je hlavička priehľadná — plagát nemá byť rozdelený lištou.
   Až keď hero odíde, dostane podklad, aby text menu ostal čitateľný. */
.rf-header--nadpodkladom {
	background: rgba(10, 22, 36, .86);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(43, 53, 70, .8);
}

/* Hero si obsah podkladá pod hlavičku sám. Ostatné stránky by inak mali
   prvý riadok schovaný za ňou. Šablóna „Elementor Full Width" nevykresľuje
   <main>, takže odsadenie patrí priamo obalu obsahu Elementora. */
body:not(.home) > .elementor:not(.elementor-location-header):not(.elementor-location-footer),
body:not(.home) main {
	padding-top: 96px;
}

.rf-header__logo img {
	display: block;
}

/* Navigácia je krátka a funkčná — nesie ju to isté písmo ako nadpisy,
   aby hlavička nevyzerala ako cudzí prvok nalepený na plagát. */
/* Elementor Kit má na položky menu vlastný selektor s rovnakou váhou a
   načíta sa neskôr, takže by vyhral on. Preto o triedu navyše — inak
   ostane menu v Robote a sivé, čo bol nameraný stav pred opravou. */
.rf-header .rf-header__nav .elementor-item {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 600;
	font-size: 1.15rem;
	text-transform: uppercase;
	letter-spacing: .02em;
	color: var(--rf-ice-dim);
}

.rf-header .rf-header__nav .elementor-item:hover,
.rf-header .rf-header__nav .elementor-item.elementor-item-active {
	color: var(--rf-ice);
}

/* -------------------------------------------------------------------------
   Rozbalené menu na telefóne
   Elementor necháva rozbalené menu v toku hlavičky — panel bol široký
   141 px, visel v strede obrazovky a hlavička sa pri otvorení natiahla
   z 90 na 302 px. Panel preto vyberáme z toku a vešiame ho na celú šírku
   pod hlavičku. Hlavička je `position: fixed`, takže je preň
   obsahujúcim blokom a `top: 100%` sedí presne na jej spodnú hranu.
   ------------------------------------------------------------------------- */

/* Aby panel visel na hlavičke a nie na widgete, nesmie byť medzi nimi nič
   polohované. Elementor obal widgetu polohuje sám — vraciame ho do toku,
   inak sa panel roztiahne len po šírku hamburgera pri pravom okraji. */
.rf-header .rf-header__nav,
.rf-header .rf-header__nav > .elementor-widget-container {
	position: static;
}

.rf-header .rf-header__nav .elementor-nav-menu--dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	width: auto;
	padding: 8px 0 18px;
	/* Cez .97 presvitalo logo z hero a menu sa v ňom strácalo. */
	background-color: rgba(8, 17, 29, .995);
	border-top: 1px solid var(--rf-steel-700);
	box-shadow: 0 24px 48px rgba(0, 0, 0, .5);
}

/* Položky sú na dotyk, nie na kurzor: cez celú šírku a s výškou, ktorá
   sa dá trafiť palcom. */
.rf-header .rf-header__nav .elementor-nav-menu--dropdown a.elementor-item {
	justify-content: flex-start;
	padding: 15px clamp(16px, 5vw, 32px);
	font-size: 1.35rem;
	color: var(--rf-ice-dim);
}

.rf-header .rf-header__nav .elementor-nav-menu--dropdown a.elementor-item:hover,
.rf-header .rf-header__nav .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active {
	color: var(--rf-ice);
	background-color: rgba(25, 122, 229, .12);
}

/* Kúpa vstupenky bola na telefóne v hlavičke vedľa hamburgera a tlačila
   sa s logom. Tu je z nej posledná položka menu — a vyzerá ako tlačidlo,
   lebo ním je. Vo vodorovnom menu na väčších obrazovkách ju nechceme,
   tam tlačidlo v hlavičke zostáva. */
/* Elementor drží položky vodorovného menu pravidlom s dvoma triedami
   a prvkom (`… .elementor-nav-menu > li`), takže samotné dve triedy
   prehrali a položka svietila aj na počítači vedľa tlačidla. */
.elementor-nav-menu--main ul.elementor-nav-menu > li.rf-menu__cta {
	display: none;
}

.rf-header .rf-header__nav .elementor-nav-menu--dropdown .rf-menu__cta {
	margin: 14px clamp(16px, 5vw, 32px) 2px;
}

/* Tá istá modrá ako na ostatných tlačidlách webu. Svetlejšia --rf-blue
   spadla pod hranicu kontrastu (namerané 4,24 pri požadovaných 4,5). */
.rf-header .rf-header__nav .elementor-nav-menu--dropdown .rf-menu__cta a.elementor-item {
	justify-content: center;
	padding: 15px 22px;
	background: var(--rf-blue-fill);
	color: #fff;
	font-weight: 700;
	letter-spacing: .06em;
	border: 1px solid rgba(160, 205, 255, .5);
}

.rf-header .rf-header__nav .elementor-nav-menu--dropdown .rf-menu__cta a.elementor-item:hover {
	background: var(--rf-blue-hot);
	color: #fff;
}

/* Hamburger je jediné ovládanie v hlavičke telefónu — má byť biely
   a dosť veľký na to, aby sa dal trafiť. */
.rf-header .rf-header__nav .elementor-menu-toggle {
	color: #fff;
	background: transparent;
	font-size: 26px;
	padding: 8px;
}

.rf-header .rf-header__nav .elementor-menu-toggle svg {
	fill: currentColor;
	width: 1em;
	height: 1em;
}

/* Kým je menu otvorené, hlavička musí mať podklad aj nad hero — inak by
   logo aj krížik plávali v obraze. */
.rf-header:has(.elementor-menu-toggle.elementor-active) {
	background: rgba(10, 22, 36, .97);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

/* Trieda .rf-btn sedí raz na samotnom odkaze (lepiaca lišta, pätička),
   raz na obale widgetu Elementora. V druhom prípade sa vypĺňanie aj
   podklad zdvojili — odmerané v hlavičke: modrý blok 171×67 px a v ňom
   tlačidlo 121×35. Obal widgetu má byť len obal. */
/* Prepínač viditeľnosti v Elementore je jedna trieda (.elementor-hidden-*),
   kým Elementor aj tento web polohujú widgety pravidlami s dvoma — a tie ho
   prehrajú. Odmerané: sekcia sa skryť dala, tlačidlo „Pozrieť line-up“ malo
   všetky tri triedy a napriek tomu `display: flex`. Vypnutie prvku má
   vyhrať vždy, inak sa klientovi prepínač v Elementore tvári ako pokazený.
   Hranice sú Elementorove predvolené: mobil ≤ 767, tablet 768–1024. */
@media (max-width: 767px) {
	.elementor-hidden-mobile.elementor-hidden-mobile { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-hidden-tablet.elementor-hidden-tablet { display: none !important; }
}

@media (min-width: 1025px) {
	.elementor-hidden-desktop.elementor-hidden-desktop { display: none !important; }
}

.elementor-widget-button.rf-btn {
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
}

.rf-footer {
	background: var(--rf-deep);
	text-align: center;
}

/* Lišta s tlačidlom je `position: fixed` pri spodnej hrane okna a na konci
   stránky ležala na poslednom riadku pätičky — z „© 2026 Rave Fusion" bola
   vidieť horná polovica. Miesto pod seba si pridáva pätička sama; robiť to
   cez `padding` obalu by sa bilo s hodnotou, ktorú tam píše Elementor. */
.rf-footer::after {
	content: "";
	display: block;
	width: 100%;
	height: 72px;
}

.rf-footer__motto {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 600;
	font-size: clamp(1.1rem, 2vw, 1.5rem);
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--rf-ice);
	margin: 0;
}

/* Trieda sedí na obale widgetu a text dedí. Elementor Kit má vlastnú
   sivú (#7A7A7A), ktorá cez dedenie prešla až do riadku s právnymi
   odkazmi — odmerané 4,24 : 1 pri požadovaných 4,5. Zdvojená trieda kvôli
   váhe; `rf-footer__odkazy` je widget s odkazmi na podmienky. */
.rf-footer__kontakt.rf-footer__kontakt,
.rf-footer__pravne.rf-footer__pravne,
.rf-footer__odkazy.rf-footer__odkazy {
	color: var(--rf-ice-quiet);
	font-size: .92rem;
	line-height: 1.7;
}

.rf-footer__kontakt a,
.rf-footer__pravne a,
.rf-footer__odkazy a {
	color: var(--rf-ice-dim);
}

.rf-footer__kontakt a:hover,
.rf-footer__pravne a:hover,
.rf-footer__odkazy a:hover {
	color: var(--rf-blue-hot);
}

/* Na 390 px sa hlavička zalomila do dvoch riadkov a tlačidlo spadlo pod
   logo. Ostáva v jednom riadku — je to jediná vec, kvôli ktorej sem
   návštevník z Instagramu chodí, nemá sa kam schovať. */
@media (max-width: 767px) {

	.rf-header {
		flex-wrap: nowrap;
	}

	.rf-header .rf-btn--go.rf-btn--go .elementor-button {
		/* Odmerané: tlačidlo malo na mobile 121×35 a prepínač menu 33×33.
		   Palec potrebuje 44 px — pod tým sa mieri, nie klikne. */
		display: inline-flex;
		align-items: center;
		min-height: 44px;
		padding: 10px 16px;
		font-size: .95rem;
		white-space: nowrap;
	}

	.rf-header .elementor-menu-toggle {
		min-width: 44px;
		min-height: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
}


/* =========================================================================
   Detail interpreta
   ========================================================================= */

.rf-act__udaje {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rf-3) var(--rf-5);
	margin: var(--rf-4) 0;
	padding: 0;
}

.rf-act__udaj dt {
	font-size: .78rem;
	letter-spacing: .12em;
	color: var(--rf-label);
	margin: 0 0 4px;
}

.rf-act__udaj dd {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	font-size: 1.7rem;
	line-height: 1;
	color: var(--rf-ice);
	margin: 0;
}

.rf-act__odkazy {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rf-2);
	margin: var(--rf-4) 0 0;
}

.rf-act__note {
	color: var(--rf-ice-quiet);
	margin: var(--rf-2) 0 0;
}

/* Pri zamknutom slote nemá zmysel ukazovať meno ani fotku — to je celý
   jeho zmysel. Šablóna ostáva jedna, skrýva sa triedou na <body>. */
.rf-interpret-zamknuty .rf-interpret__foto,
.rf-interpret-zamknuty .rf-interpret__meno {
	display: none;
}


/* =========================================================================
   Archív interpretov
   ========================================================================= */

.rf-archiv__mriezka .elementor-post {
	background: var(--rf-steel-900);
	border: 1px solid var(--rf-steel-700);
	padding: var(--rf-4);
}

.rf-archiv__mriezka .elementor-post__title,
.rf-archiv__mriezka .elementor-post__title a {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 800;
	font-size: 1.85rem;
	line-height: 1.05;
	text-transform: uppercase;
	color: var(--rf-ice);
}

.rf-archiv__mriezka .elementor-post__title a:hover {
	color: var(--rf-blue-hot);
}

/* Dátum vytvorenia záznamu nehovorí návštevníkovi nič — kedy sme meno
   zapísali do CMS nie je informácia, podľa ktorej sa niekto rozhoduje. */
.rf-archiv__mriezka .elementor-post__meta-data {
	display: none;
}


/* Meno interpreta je odkaz na jeho podstránku — dedí farbu dosky, aby
   karta ostala celistvá a nevyzerala ako odkaz nalepený na obdĺžnik. */
.rf-act__name a {
	color: inherit;
	text-decoration: none;
}

.rf-act__name a:hover {
	color: var(--rf-blue-hot);
}

/* Na 390 px prečnievala posledná bunka odpočtu o tri pixely a hero ju
   orezalo — „sekúnd" sa lámalo na „sekú". Odmerané, nie odhadnuté:
   pravý okraj bunky bol na 393 px pri šírke okna 390 px. */
@media (max-width: 430px) {

	.rf-countdown {
		gap: var(--rf-2);
	}

	.rf-countdown__unit {
		min-width: 0;
		flex: 1 1 0;
	}

	.rf-countdown__n {
		font-size: 2.1rem;
	}

	.rf-countdown__l {
		font-size: .625rem;
	}
}


/* =========================================================================
   Doska interpreta: reakcia na kurzor
   Doska je kov. Pri nabehnutí sa po nej prejde odlesk a zdvihne sa —
   nie zväčší, zdvihne. Kov sa nenafukuje.
   ========================================================================= */

.rf-act {
	position: relative;
	overflow: hidden;
	transition: transform .28s cubic-bezier(.22, .61, .36, 1),
	            border-color .28s ease,
	            box-shadow .28s ease;
}

.rf-act::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(105deg, transparent 38%, rgba(215, 227, 241, .16) 50%, transparent 62%);
	translate: -120% 0;
	transition: translate .6s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {

	.rf-act:hover {
		transform: translate3d(0, -4px, 0);
		border-color: var(--rf-blue);
		box-shadow: 0 18px 40px rgba(0, 0, 0, .45), 0 0 34px rgba(25, 122, 229, .18);
	}

	.rf-act:hover::before {
		translate: 120% 0;
	}

	/* Zamknutá doska sa nedvíha. Nie je to pozvánka, je to zamrznuté miesto. */
	.rf-act--locked:hover {
		transform: none;
		border-color: var(--rf-steel-700);
		box-shadow: none;
	}

	.rf-act--locked:hover::before {
		translate: -120% 0;
	}
}

@media (prefers-reduced-motion: reduce) {

	.rf-act,
	.rf-act::before {
		transition: none;
	}
}

/* Nadpis sekcie dostane pod seba krátku modrú značku — jediné miesto,
   kde je modrá bez toho, aby na niečo viedla. */
/* Kontajner sekcie je flexbox v stĺpci, takže sa položka zmrští na šírku
   obsahu a `margin-inline: auto` ju potom odplaví do stredu. Odmerané na
   line-upe: nadpis 256 px na pozícii 585 v sekcii širokej 1425. Šírku
   treba povedať výslovne. */
/* Odsadenie pod nadpisom tu nie je naschvál. Elementor riadi medzery
   medzi widgetmi cez `margin-block-end` na kontajneri (a v CSSOM sa to
   ani neukáže ako `margin-bottom`), takže pravidlo odtiaľto nemalo
   účinok — odmerané 0 px na štyroch z piatich sekcií. Medzera patrí
   nastaveniu medzery kontajnera v Elementore, kde ju vie zmeniť aj
   klient. */
.rf-section__head {
	width: 100%;
	max-width: var(--rf-shell);
	margin-inline: auto;
}

/* Elementor dáva obe triedy na ten istý obal widgetu, takže potomok
   s .rf-h2 vo väčšine sekcií neexistuje a modrá značka sa nevykreslila.
   Sedí oboje — vnorený nadpis aj nadpis, ktorý je hlavičkou sám. */
/* Značka pod nadpisom je štvorcípa hviezda zo zástav na plagáte a vlások,
   ktorý z nej vybieha. Modrý pásik, ktorý tu bol predtým, je značka
   z ktorejkoľvek inej stránky. */
.rf-section__head.rf-h2::after,
.rf-section__head .rf-h2::after {
	content: "";
	display: block;
	width: 88px;
	height: 14px;
	margin-top: var(--rf-3);
	background: linear-gradient(90deg, var(--rf-blue-hot) 0 14px, var(--rf-blue) 22px, var(--rf-steel-500) 86%, transparent);
	-webkit-mask: var(--rf-znacka) left center / 88px 14px no-repeat;
	        mask: var(--rf-znacka) left center / 88px 14px no-repeat;
}

.rf-lineup {
	max-width: var(--rf-shell);
	margin-inline: auto;
}

/* Widgety priamo v sekcii (nadpis, úvodná veta) musia mať tú istú šírku
   ako bloky pod nimi. Pravidlá v súboroch sekcií im ju dávajú, ale Elementor
   ju prebije `.elementor.elementor .e-con > .elementor-widget { max-width:
   100% }` (štyri triedy). Kontajnery (mapa, karty, akordeón) sa pritom
   centrujú v 1680 px, takže na obrazovke širšej než ~1824 px ostal nadpis
   pri ľavom okraji a obsah odskočil doprava. Zmerané pri 2072 px: nadpis
   Miesta od 72, doska s adresou od 196. Reťaz nad sekciou je naschvál
   cez celú šírku, dokumenty (rf-prose) majú vlastnú užšiu mieru. */
.elementor.elementor .rf-section.e-con:not(.rf-prose) > .elementor-widget:not(.rf-retaz-obal) {
	width: 100%;
	max-width: var(--rf-shell);
	margin-inline: auto;
}

/* Bočné odsadenie sekcií. Elementor ho pod 1024 px na štyroch sekciách
   prepisuje na 16 px, Vstupenky si ho držali vlastným pravidlom — na
   mobile tak bola jedna sekcia o 4 px, na tablete o 15 px inde než
   ostatné. Zmerané pri 390 a 768 px. */
.rf-section.e-con:not(.rf-prose) {
	padding-inline: clamp(20px, 4vw, 72px);
}


/* Nižší notebook: hero sa stiahne, aby sa odpočet zmestil nad zlom.
   Merané pri 1440x900 — s pôvodnými hodnotami mal hero 1050 px. */
@media (min-width: 901px) and (max-height: 1000px) {

	.rf-hero__inner {
		padding-top: clamp(72px, 9vh, 104px);
		padding-bottom: clamp(92px, 11vh, 124px);
		gap: clamp(28px, 3.5vw, 56px);
	}

	.rf-hero__logo {
		width: min(100%, 500px);
	}

	.rf-hero__cta,
	.rf-hero__odpocet {
		margin-top: var(--rf-4);
	}

	.rf-facts__v {
		font-size: 1.45rem;
	}
}

/* Veľmi nízke okno (napr. 1366x768): plagát ustúpi, hero drží text. */
@media (min-width: 901px) and (max-height: 800px) {

	.rf-hero__logo {
		width: min(100%, 420px);
	}

}


/* „Read More" pod menom interpreta nič nepridáva — meno je odkaz a celá
   karta vedie na to isté miesto. Dva odkazy na jeden cieľ len zdržujú. */
.rf-archiv__mriezka .elementor-post__read-more-wrapper,
.rf-archiv__mriezka .elementor-post__read-more {
	display: none;
}

.rf-archiv__mriezka .elementor-post {
	transition: transform .28s cubic-bezier(.22, .61, .36, 1),
	            border-color .28s ease;
}

@media (hover: hover) and (pointer: fine) {

	.rf-archiv__mriezka .elementor-post:hover {
		transform: translate3d(0, -4px, 0);
		border-color: var(--rf-blue);
	}
}

@media (prefers-reduced-motion: reduce) {

	.rf-archiv__mriezka .elementor-post {
		transition: none;
	}
}


/* =========================================================================
   KOTVY
   ========================================================================= */

/* Hlavička je fixovaná, takže skok na kotvu by nadpis sekcie schoval pod ňu.
   Odsadenie patrí cieľu skoku, nie hlavičke. */
.rf-section[id],
[id^="rf-"][id$="-sekcia"] {
	scroll-margin-top: 104px;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}
}


/* =========================================================================
   TYPOGRAFIA VNÚTRI WIDGETOV ELEMENTORA
   ========================================================================= */

/* Elementor dáva typografiu vnútornému prvku widgetu
   (`.elementor-widget-heading .elementor-heading-title`), naše triedy
   sedia na obale widgetu. Rovnaká váha, ale hárok stránky sa načíta
   neskôr, takže vyhrá Elementor — a odkedy majú globálne písma v Kite
   naše rodiny, prebil aj popisky, ktoré majú byť v Inter.

   Zdvojená trieda zvyšuje váhu bez `!important`. Zoznam je úmyselne
   vymenovaný: platí len pre obaly, ktoré si typografiu naozaj určujú,
   aby to neprebíjalo nastavenia, ktoré si niekto zapne priamo vo
   widgete. */
.rf-h1.rf-h1 .elementor-heading-title,
.rf-h2.rf-h2 .elementor-heading-title,
.rf-hero__tag.rf-hero__tag .elementor-heading-title,
.rf-facts__k.rf-facts__k .elementor-heading-title,
.rf-facts__v.rf-facts__v .elementor-heading-title,
.rf-act__name.rf-act__name .elementor-heading-title,
.rf-act__meta.rf-act__meta .elementor-heading-title,
.rf-ticket__wave.rf-ticket__wave .elementor-heading-title,
.rf-ticket__price.rf-ticket__price .elementor-heading-title {
	font: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	color: inherit;
}


/* Elementor zapisuje do hárku stránky `--n-accordion-title-font-size`
   s desatinnou čiarkou (`1,75rem`). Je to neplatná hodnota, prehliadač
   celú deklaráciu zahodí a nadpis otázky spadne na predvolených 16 px.
   Táto hodnota je poistka pre akordeón, ktorý si veľkosť neurčí sám. */
.e-n-accordion {
	--n-accordion-title-font-size: 1.5rem;
}


/* =========================================================================
   Neexistujúca adresa
   Šablóna „Stránka sa nenašla“ (Elementor → Šablóny). Nesie hlavičku aj
   pätičku ako zvyšok webu, takže tu stačí vysadiť obsah a stlmiť ho.
   ========================================================================= */

.rf-404 {
	position: relative;
	text-align: center;
	background:
		radial-gradient(80% 60% at 50% 30%, rgba(25, 122, 229, .1), transparent 62%),
		linear-gradient(180deg, var(--rf-deep), var(--rf-night) 68%);
}

.rf-404__nadpis.rf-404__nadpis .elementor-heading-title {
	font-family: "Big Shoulders Display", Impact, sans-serif;
	font-weight: 800;
	font-size: clamp(2.5rem, 6vw, 4.75rem);
	line-height: .9;
	letter-spacing: .01em;
	text-transform: uppercase;
	color: var(--rf-ice);
}

.rf-404 .rf-404__text.rf-404__text {
	color: var(--rf-ice-quiet);
	font-size: 1.0625rem;
	line-height: 1.7;
}

/* Šírku riadku držíme na odseku, nie na obale widgetu: obal má Elementor
   zviazaný vlastným `max-width` v hárku stránky, ktorý sa načíta neskôr.
   Riadok dlhší než zhruba šesťdesiat znakov sa zle číta. */
.rf-404 .rf-404__text p {
	max-width: 54ch;
	margin-inline: auto;
}

/* Číslo chyby patrí k veci, ale nie do nadpisu — návštevníka zaujíma, kam
   ísť ďalej, nie kód odpovede. */
.rf-404::before {
	content: "404";
	display: block;
	position: absolute;
	left: 50%;
	top: clamp(48px, 12vh, 120px);
	transform: translateX(-50%);
	font-family: "Big Shoulders Display", Impact, sans-serif;
	font-weight: 800;
	font-size: clamp(9rem, 26vw, 20rem);
	line-height: 1;
	color: var(--rf-steel-900);
	opacity: .5;
	pointer-events: none;
	user-select: none;
}


/* =========================================================================
   Detail interpreta — dno stránky
   Kým interpret nemá fotku ani text, je jeho stránka len meno na prázdnej
   ploche. Tento pás dá stránke koniec a dve cesty späť; keď fotka
   a životopis pribudnú, ostane pod nimi.
   ========================================================================= */

.rf-interpret__pata {
	border-top: 1px solid var(--rf-steel-700);
	margin-top: var(--rf-6, 40px);
}

.rf-interpret__pata .rf-interpret__akcia.rf-interpret__akcia {
	color: var(--rf-ice-quiet);
	font-size: .9375rem;
	letter-spacing: .01em;
}


/* =========================================================================
   Namŕzanie stránky
   Čím nižšie človek zíde, tým hustejšie mrznú okraje obrazovky. Kryštáliky
   sú kresba v SVG (šum cez prah), nie fotka — je to pár stoviek bajtov
   a pri každom rozlíšení ostáva ostrá. Stred zostáva čistý, inak by sa
   nedal čítať text.
   ========================================================================= */

.rf-namraza {
	position: fixed;
	inset: 0;
	z-index: 45;
	pointer-events: none;
	opacity: calc(var(--rf-mraz, 0) * .34);
	mix-blend-mode: screen;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.09 0.022' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.80 0 0 0 0 0.90 0 0 0 0 1 0 0 0 5.5 -3.2'/%3E%3C/filter%3E%3Crect width='620' height='620' filter='url(%23m)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.022 0.09' numOctaves='3' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.74 0 0 0 0 0.86 0 0 0 0 1 0 0 0 5 -3.1'/%3E%3C/filter%3E%3Crect width='620' height='620' filter='url(%23m)'/%3E%3C/svg%3E");
	background-size: 620px 620px, 380px 380px;
	background-position: 0 0, 120px 60px;
	-webkit-mask-image: radial-gradient(104% 78% at 50% 46%, transparent 42%, #000 98%);
	mask-image: radial-gradient(104% 78% at 50% 46%, transparent 42%, #000 98%);
	transition: opacity .2s linear;
}

/* Studený lem po obvode. Sám osebe nič neznamená, ale spolu s kryštálikmi
   drží pocit, že sa obraz zatvára. */
.rf-namraza::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(120, 190, 255, .16), transparent 22%),
		linear-gradient(0deg, rgba(120, 190, 255, .12), transparent 18%),
		linear-gradient(90deg, rgba(120, 190, 255, .1), transparent 14%),
		linear-gradient(270deg, rgba(120, 190, 255, .1), transparent 14%);
}

@media (prefers-reduced-motion: reduce) {
	.rf-namraza { display: none; }
}

/* -------------------------------------------------------------------------
   Košík v hlavičke ([rf_kosik], inc/woocommerce.php)
   Ikona s počtom kusov. Plocha 44 × 44 px ako hamburger, aby sa dala
   trafiť palcom. Počet sa ukáže, až keď je v košíku aspoň jeden kus.
   ------------------------------------------------------------------------- */
.rf-kosik {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	color: var(--rf-ice);
	text-decoration: none;
}

.rf-kosik:hover,
.rf-kosik:focus-visible { color: var(--rf-blue-hot); }

.rf-kosik svg {
	width: 26px;
	height: 26px;
}

.rf-kosik__pocet {
	position: absolute;
	top: 3px;
	right: 0;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	background: var(--rf-blue-fill);
	color: #fff;
	font: 700 11px/18px Inter, system-ui, sans-serif;
	text-align: center;
}

.rf-kosik__pocet[hidden] { display: none; }

/* Náhľad košíka pod ikonou ([rf_kosik]). Len pre myš a klávesnicu — na
   dotyku by „hover“ znamenal prvý ťuk naprázdno. Horné odsadenie je most
   medzi ikonou a doskou, aby náhľad nezmizol cestou kurzora nadol. */
.rf-kosik-obal {
	position: relative;
	display: inline-flex;
}

.rf-kosik__nahlad {
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 60;
	width: min(340px, calc(100vw - 32px));
	padding-top: 26px;
}

@media (hover: hover) and (pointer: fine) {
	.rf-kosik-obal:hover .rf-kosik__nahlad,
	.rf-kosik-obal:focus-within .rf-kosik__nahlad {
		display: block;
		animation: rf-nahlad .18s ease-out;
	}
}

@keyframes rf-nahlad {
	from { opacity: 0; transform: translateY(-4px); }
}

@media (prefers-reduced-motion: reduce) {
	.rf-kosik__nahlad { animation: none !important; }
}

/* Prázdny košík nemá čo ukázať a na košíku aj v pokladni je obsah priamo
   na stránke. */
.rf-kosik-obal:has(.rf-kosik__pocet[hidden]) .rf-kosik__nahlad,
.woocommerce-cart .rf-kosik__nahlad,
.woocommerce-checkout .rf-kosik__nahlad {
	display: none !important;
}

.rf-kosik__doska {
	background: var(--rf-steel-900);
	border: 1px solid var(--rf-steel-700);
	border-top: 2px solid var(--rf-blue);
	box-shadow: 0 22px 48px rgba(0, 0, 0, .55);
	padding: 6px 20px 20px;
	text-align: left;
	font-family: Inter, system-ui, sans-serif;
}

.rf-kosik__doska .rf-nahlad__zoznam {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rf-kosik__doska .rf-nahlad__polozka {
	position: relative;
	display: block;
	margin: 0;
	padding: 14px 40px 14px 0;
	border-bottom: 1px solid var(--rf-steel-700);
}

.rf-kosik__doska .rf-nahlad__nazov {
	display: block;
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1.1;
	text-transform: uppercase;
	color: var(--rf-ice);
}

.rf-kosik__doska .rf-nahlad__pocet {
	display: block;
	margin-top: 4px;
	font-size: .875rem;
	color: var(--rf-ice-quiet);
}

.rf-kosik__doska .rf-nahlad__odober {
	position: absolute;
	top: 50%;
	right: -8px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--rf-ice-quiet);
	text-decoration: none;
}

.rf-kosik__doska .rf-nahlad__odober:hover,
.rf-kosik__doska .rf-nahlad__odober:focus-visible { color: var(--rf-blue-hot); }

.rf-kosik__doska .rf-nahlad__spolu {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin: 16px 0;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--rf-label);
}

.rf-kosik__doska .rf-nahlad__spolu .amount {
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 800;
	font-size: 1.75rem;
	letter-spacing: 0;
	color: var(--rf-ice);
}

.rf-kosik__doska a.rf-nahlad__pokladna {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 20px;
	background: var(--rf-blue-fill);
	border: 1px solid rgba(160, 205, 255, .5);
	color: #fff;
	font-family: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;
	font-weight: 700;
	font-size: 1.15rem;
	letter-spacing: .02em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s ease, color .18s ease;
}

.rf-kosik__doska a.rf-nahlad__pokladna:hover,
.rf-kosik__doska a.rf-nahlad__pokladna:focus-visible {
	background: var(--rf-blue-hot);
	color: var(--rf-night);
}

/* Účet v hlavičke ([rf_ucet], inc/woocommerce.php) — tá istá ikona
   44 × 44 px ako košík. Popis pre čítačky je podľa prihlásenia; prepína
   sa triedou `logged-in` na <body>, nie v PHP, aby ho nezamrazila žiadna
   cache hlavičky. */
.rf-ucet {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	color: var(--rf-ice);
	text-decoration: none;
}

.rf-ucet:hover,
.rf-ucet:focus-visible { color: var(--rf-blue-hot); }

.rf-ucet svg {
	width: 26px;
	height: 26px;
}

.rf-ucet__text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.logged-in .rf-ucet__text--von,
body:not(.logged-in) .rf-ucet__text--dnu { display: none; }

/* Hlavička delí prvky cez space-between — košík by visel osamote medzi
   menu a tlačidlom. Automatické okraje rozdelia voľné miesto len na dve
   medzery: menu ostane v strede a ikony sa priložia k tlačidlu. Účet
   a košík stoja tesne pri sebe ako jedna skupina. */
.rf-header .rf-header__nav { margin-left: auto; }
.rf-header .rf-header__kosik {
	margin-left: auto;
	margin-right: -12px;
}
.rf-header .rf-header__ucet {
	margin-left: auto;
	margin-right: -20px;
}
.rf-header .rf-header__ucet + .rf-header__kosik { margin-left: 0; }

/* Od tabletu nadol je menu hamburger a tlačidlo je skryté: účet a košík
   idú pred hamburger, ikony vpravo vedľa seba. */
@media (max-width: 1024px) {
	.rf-header .rf-header__nav {
		order: 3;
		margin-left: 0;
	}
	.rf-header .rf-header__ucet,
	.rf-header .rf-header__kosik {
		order: 2;
	}
	.rf-header .rf-header__kosik {
		margin-right: -16px;
	}
}