/* ==========================================================================
   ANIMÁCIE

   Zásada: striedmo. Prvky sa pri prvom zobrazení jemne zdvihnú a
   objavia — nič neposkakuje, nič sa neotáča, nič sa neopakuje.

   Skryté sú LEN vtedy, keď beží skript a keď návštevník animácie
   nemá vypnuté. Bez JavaScriptu je obsah normálne viditeľný —
   preto sa počiatočný stav pridáva triedou, nie predvolene.
   ========================================================================== */

.pc-reveal {
	opacity: 0;
	transform: translateY(16px);
	transition:
		opacity 0.55s var(--pc-ease),
		transform 0.55s var(--pc-ease);
	/* Oznamuje prehliadaču, čo sa bude meniť — plynulejšie na mobile. */
	will-change: opacity, transform;
}

.pc-reveal.is-visible {
	opacity: 1;
	transform: none;
	will-change: auto;
}

/*
 * Položky v mriežke sa objavujú s malým odstupom za sebou. Odstup drží
 * premenná, ktorú nastaví skript podľa poradia v riadku — a je zastropovaný,
 * aby posledná karta nečakala pol sekundy.
 */
.pc-reveal {
	transition-delay: var(--pc-reveal-delay, 0s);
}

/* ---- Hlavička ---------------------------------------------------------- */

/*
 * Po odrolovaní dostane hlavička jemný tieň — oddelí sa od obsahu,
 * ktorý pod ňou prechádza.
 */
.pc-header {
	transition: box-shadow var(--pc-duration) var(--pc-ease);
}

.pc-header.is-scrolled {
	box-shadow: 0 1px 12px rgba(0, 0, 0, 0.08);
}

/* ---- Odkazy a tlačidlá ------------------------------------------------- */

/*
 * Podčiarknutie odkazov v texte sa vysúva zľava namiesto skokového
 * zapnutia. Týka sa len obsahových odkazov, nie navigácie.
 */
.pc-simple .wp-block-post-content a,
.pc-post__content a {
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 100% 1px;
	text-decoration: none;
	transition: background-size 0.25s var(--pc-ease);
}

.pc-simple .wp-block-post-content a:hover,
.pc-post__content a:hover {
	background-size: 0 1px;
	background-position: 100% 100%;
}

/* ==========================================================================
   VYPNUTÉ ANIMÁCIE

   Keď má návštevník v systéme nastavené obmedzenie pohybu, nespúšťa sa
   nič — obsah je rovno na mieste. Skript triedu `pc-reveal` v takom
   prípade ani nepridá, toto je poistka.
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	.pc-reveal,
	.pc-reveal.is-visible {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.pc-simple .wp-block-post-content a,
	.pc-post__content a {
		transition: none;
	}
}
