/**
 * Soulistka – animace a interakce.
 *
 * Doplňuje animace převzaté z OHIO (slide_up_elements, underline, kurzor),
 * které jsou v soulistka.css. Animuje se jen transform a opacity.
 * Časování: cubic-bezier(.645, .045, .355, 1) = var(--clb-transition-function).
 */

:root {
	--su-ease: cubic-bezier(.645, .045, .355, 1);
	--su-ease-out: cubic-bezier(.22, 1, .36, 1);
	--su-anchor-offset: 0px;
}

/* Posuvník má vždy rezervované místo: žádný posun při zamknutí scrollu (menu, dialogy). */
html {
	scrollbar-gutter: stable;
}

/* Logo má kvůli CLS v HTML rozměry (150×214), výšku řídí CSS (max 66 px). */
.branding img {
	width: auto;
	height: auto;
}

/* Cíle kotev – offset pro fixní hlavičku řídí --su-anchor-offset. */
[id] {
	scroll-margin-top: var(--su-anchor-offset);
}

/* ------------------------------------------------------------------
 * Roztažené řádky (dřív počítal WPBakery JS po načtení = CLS).
 * Šířka viewportu bez posuvníku, vycentrováno na střed kontejneru.
 * ------------------------------------------------------------------ */
.vc_row[data-vc-full-width] {
	/* Stejné hodnoty, jaké WPBakery zapisoval do inline stylu (proto !important). */
	position: relative !important;
	left: calc(50% - (100vw - var(--su-sbw, 0px)) / 2) !important;
	box-sizing: border-box !important;
	width: calc(100vw - var(--su-sbw, 0px)) !important;
	max-width: calc(100vw - var(--su-sbw, 0px)) !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.vc_row[data-vc-full-width]:not([data-vc-stretch-content]) {
	padding-left: calc((100vw - var(--su-sbw, 0px) - 100%) / 2);
	padding-right: calc((100vw - var(--su-sbw, 0px) - 100%) / 2);
}

/* ------------------------------------------------------------------
 * Vlastní kurzor – jen myš, desktop.
 * ------------------------------------------------------------------ */
@media (hover: none), (pointer: coarse) {
	.custom-cursor .circle-cursor {
		display: none !important;
	}
}

/* ------------------------------------------------------------------
 * Hover efekty (CSS, bez JS).
 * ------------------------------------------------------------------ */
.button,
.icon-button,
.hamburger-outer {
	transition-timing-function: var(--su-ease);
}

/* ------------------------------------------------------------------
 * Odhalení při scrollu: [data-reveal] (JS přidá .is-revealed).
 * Bez JS (chybí html.js) je obsah vidět hned.
 * ------------------------------------------------------------------ */
.js [data-reveal] {
	opacity: 0;
	transform: translate3d(0, 2rem, 0);
	transition:
		opacity .8s var(--su-ease-out),
		transform .8s var(--su-ease-out);
}
.js [data-reveal="fade"] {
	transform: none;
}
.js [data-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

/* ------------------------------------------------------------------
 * Fokus z klávesnice – viditelný, myš nic neruší.
 * ------------------------------------------------------------------ */
:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}
[tabindex="-1"]:focus {
	outline: none;
}

/* ------------------------------------------------------------------
 * prefers-reduced-motion: bez pohybu, obsah hned vidět.
 * ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		animation-delay: 0s !important;
		transition-duration: .01ms !important;
		transition-delay: 0s !important;
		scroll-behavior: auto !important;
	}
	.animated-holder > *,
	.js [data-reveal] {
		opacity: 1 !important;
		transform: none !important;
	}
	.custom-cursor .circle-cursor {
		display: none !important;
	}
}

/* Dekorativní běžící text v úvodu: text z data-t přes ::before (čtečky ho ignorují, je aria-hidden). */
.su-hx__track span[data-t]::before {
	content: attr(data-t);
}