/* Hero — dopĺňa vizuálny systém pre sekciu postavenú v Elementore.
   -------------------------------------------------------------------------
   Hero už nie je shortcode, ale kontajnery a widgety Elementora. Vizuál
   naďalej riadi rf.css cez triedy rf-hero*, rf-facts*, rf-btn*, rf-marquee*.
   Tento súbor rieši len tri veci, ktoré z toho vyplývajú:

     1. Trieda z poľa „CSS Classes" sedí na OBALE widgetu, nie na texte
        či obrázku vnútri. Vnútro sa preto navádza, aby dedilo.
     2. Widget Elementora má position:relative. Absolútne vrstvy pozadia,
        bežiaci pás a ukazovateľ scrollu by sa tak viazali na svoj widget
        namiesto na hero — obal sa vracia na position:static.
     3. Video na pozadí kontajnera leží na z-indexe 0. Závoj a zrno musia
        byť nad ním, obsah nad nimi — inak by sa video vykreslilo cez text.

   Súbor sa načítava po rf.css aj po vygenerovanom post-44.css, takže pri
   rovnakej špecificite vyhráva. Naopak čokoľvek, čo Samuel nastaví v paneli
   Elementora, má špecificitu o triedu vyššiu a prebije pravidlá odtiaľto —
   presne tak to má byť. */


/* =========================================================================
   1. Obaly dekoratívnych widgetov sa nesmú stať vzťažným rámcom
   ========================================================================= */

/* Aj vnútorný obal widgetu musí byť statický. Inak absolútne vrstvy
   (závoj, zrno) merajú výšku podľa neho — a ten má nula pixelov.
   Odmerané na vykreslenej stránke: závoj mal 390x0 a hero 390x844,
   takže stmavenie videa nerobil závoj, ale filter na videu. */
/* Zdvojené triedy: Elementor dáva `position: relative` priamo na
   `.elementor-element`, čo je rovnaká váha ako jedna naša trieda, a píše
   to za témou. Zmerané — pás sa vešal na widget, nie na hero, a končil
   70 px nad jeho spodnou hranou; medzi ním a ďalšou sekciou tak ostal
   pruh, ktorý vyzeral ako ďalšia linka. */
.rf-hero__vrstvy.rf-hero__vrstvy,
.rf-hero__vrstvy.rf-hero__vrstvy > .elementor-widget-container,
.rf-hero__pas.rf-hero__pas,
.rf-hero__pas.rf-hero__pas > .elementor-widget-container,
.rf-hero__sipka.rf-hero__sipka,
.rf-hero__sipka.rf-hero__sipka > .elementor-widget-container {
	position: static;
}


/* =========================================================================
   2. Poradie vrstiev
   Rozostrený plagát je úplne vzadu (rf.css: .rf-hero__bg, z-index -1),
   nad ním prípadné video z Elementora (z-index 0), nad ním závoj a zrno,
   a celkom hore obsah. Bez tohto by video prekrylo aj zrno aj závoj a hero
   by stratilo zjednotený povrch.
   ========================================================================= */

.rf-hero__over {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}

.e-con.rf-hero__inner {
	z-index: 2;
}


/* =========================================================================
   3. Text vo widgetoch dedí z obalu
   Widget nadpisu si nesie vlastnú farbu a písmo z Elementor Kitu. Trieda
   rf-hero__tag / rf-facts__k / rf-facts__v ale sedí na obale, takže by sa
   neprejavila. Toto pravidlo vráti dedenie; nastavenie z panela ho prebije.
   ========================================================================= */

.rf-hero .elementor-heading-title {
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	margin: 0;
}


/* =========================================================================
   4. Tlačidlá
   rf.css dáva triede rf-btn vlastnú výplň a okraj — to platí pre holý
   odkaz zo starého shortcodu. Vo widgete je obal navyše, takže obal sa
   vyprázdni a vzhľad nesie odkaz vnútri.
   ========================================================================= */

.rf-hero .rf-hero__cta .rf-btn {
	display: inline-flex;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

/* =========================================================================
   5. Odpočet z Elementor Pro
   Widget stavia boxy na rovnakú šírku a rozťahuje ich cez celý stĺpec.
   Odpočet má byť blok štyroch čísel vľavo, nie roztiahnutý pás. Veľkosť
   písma, farby aj medzeru medzi boxmi drží panel Elementora, aby sa dali
   meniť v rozhraní.
   ========================================================================= */

.rf-hero .rf-countdown {
	display: block;
}

.rf-hero .rf-countdown .elementor-countdown-wrapper {
	justify-content: flex-start;
}

.rf-hero .rf-countdown .elementor-countdown-item {
	flex: 0 0 auto;
	min-width: 68px;
	padding: 0;
	background-color: transparent;
}

/* Číslice nesmú pri odpočítavaní poskakovať do šírky. */
.rf-hero .rf-countdown .elementor-countdown-digits {
	font-variant-numeric: tabular-nums;
}

.rf-hero .rf-countdown .elementor-countdown-label {
	margin-top: 6px;
}

/* Odmerané na 390 px: štyri boxy so 68 px minimom presahovali okno.
   Rovnaké riešenie ako v rf.css pre pôvodný odpočet. */
@media (max-width: 430px) {

	.rf-hero .rf-countdown .elementor-countdown-item {
		min-width: 0;
		flex: 1 1 0;
	}
}


/* =========================================================================
   6. Plagát
   Obrázok je vložený adresou (leží v téme, nie v knižnici médií), takže
   nemá atribúty width/height. Bez pomeru strán by hero pri načítaní skočilo.
   941 × 1176 je skutočná veľkosť súboru poster.webp.
   ========================================================================= */

.rf-hero .rf-hero__poster img {
	display: block;
	width: 100%;
	aspect-ratio: 941 / 1176;
}

.rf-hero .rf-hero__logo img {
	display: block;
	width: 100%;
}
