/*
 * blog-related.css — blok „Mohlo by se vám také líbit".
 *
 * Vědomě MIMO main.css: ten je zrcadlo mirroru a měří se proti němu
 * parita detailu. Blok v originálu není, takže jeho rozvržení do zrcadla
 * nepatří — stejné rozhodnutí jako u search.css (typ 7).
 *
 * [Jirka 26. 8.] Dlaždice se řídí STEJNÝM standardem jako blog všude
 * jinde: první široká, druhá a třetí úzké — přesně jako upoutávka na
 * homepage. Kolo 0.7.1 tu mělo tři stejné (33,33 %); přepis šířek je
 * proto pryč a blok dědí `.hint-container` z main.css, aby se pravidlo
 * `:first-of-type` uplatnilo i tady. Přepisuje se JEN spodní odsazení —
 * mirrorových 10rem je počítaných na výpis s dalšími řádky pod sebou,
 * tady je pod blokem patička.
 */
.blog-related {
	margin: 4rem 0 2rem;
}

.blog-related > h2 {
	margin-bottom: 3rem;
}

.hint-container.hint-related .hint-box {
	padding-bottom: 4rem;
}

/*
 * Karta programu vložená do textu článku (pipeline `program_card.py`).
 * Markup nese jen třídy — `wp_kses_post()` z obsahu odfiltruje `animation`,
 * `transition` i `<style>`, takže veškerý pohyb musí viset tady.
 *
 * Lehký motion: karta se při nájezdu nadzvedne, fotka se decentně přiblíží,
 * CTA trvale pulzuje (šablonová `.pulse` má iteration-count 1, proto vlastní).
 * Vše se vypíná při `prefers-reduced-motion`.
 */
.article-program-card {
	transition: transform .25s ease, box-shadow .25s ease;
	overflow: hidden;
}

.article-program-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 24px rgba(0, 42, 51, .12);
}

.article-program-card img {
	transition: transform .4s ease;
}

.article-program-card:hover img {
	transform: scale(1.04);
}

@keyframes zaCardPulse {
	0%   { box-shadow: 0 0 0 0 rgba(230, 0, 126, .45); }
	70%  { box-shadow: 0 0 0 12px rgba(230, 0, 126, 0); }
	100% { box-shadow: 0 0 0 0 rgba(230, 0, 126, 0); }
}

.aos-pulse {
	animation: zaCardPulse 2.2s ease-out infinite;
}

.aos-pulse:hover {
	animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
	.article-program-card,
	.article-program-card img,
	.aos-pulse {
		transition: none;
		animation: none;
	}
}
