/* ==========================================================================
   PODKURZY

   Riadky preberajú anatómiu zoznamu otázok (faq.css sa načítava spolu
   s touto sekciou). Tu je len vnútro rozbaleného riadka: fotka vľavo,
   znak, podtitul a text vpravo, pod nimi „Čo sa naučíte", „Pre koho",
   termíny a tlačidlo — podľa wireframu detailu kurzu.
   ========================================================================== */

/* Sekcia stojí na svetlejšej ploche než otázky — #F1F1F1 z návrhu. */
.shs-faq.shs-subcourses {
	background: var(--shs-mist);
}

.shs-subcourse {
	display: grid;
	grid-template-columns: 23.43% minmax(0, 1fr);
	column-gap: 5.5%;
	row-gap: var(--shs-space-42);
	padding-block: var(--shs-space-19) var(--shs-space-42);
}

.shs-subcourse__media {
	margin: 0;
	aspect-ratio: 340 / 420;
	overflow: hidden;
	background: var(--shs-mist);
}

.shs-subcourse__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.shs-subcourse__sign {
	display: block;
	margin-bottom: var(--shs-space-32);
}

.shs-subcourse__lead {
	font-family: var(--shs-font-body);
	font-size: var(--shs-fs-lead);
	font-weight: var(--shs-weight-medium);
	line-height: var(--shs-lh-loose);
	text-transform: none;
}

.shs-subcourse__text {
	display: flex;
	flex-direction: column;
	gap: var(--shs-space-16);
	margin-top: var(--shs-space-24);
	font-size: var(--shs-fs-base);
	font-weight: var(--shs-weight-light);
	line-height: var(--shs-lh-loose);
	text-transform: none;
}

/* Druhý pás ide pod fotku aj text — cez celú šírku riadka. */
.shs-subcourse__wide {
	grid-column: 1 / -1;
	max-width: 980px;
	text-transform: none;
}

.shs-subcourse__heading {
	margin-top: var(--shs-space-42);
	font-family: var(--shs-font-body);
	font-size: var(--shs-fs-lead);
	font-weight: var(--shs-weight-medium);
	line-height: var(--shs-lh-loose);
}

.shs-subcourse__list {
	margin: var(--shs-space-16) 0 0;
	padding-inline-start: var(--shs-space-24);
	font-size: var(--shs-fs-base);
	font-weight: var(--shs-weight-light);
	line-height: 1.9;
}

.shs-subcourse__list li::marker {
	font-size: 0.7em;
}

.shs-subcourse__audience {
	margin-top: var(--shs-space-16);
	font-size: var(--shs-fs-base);
	font-weight: var(--shs-weight-light);
	line-height: var(--shs-lh-loose);
}

.shs-subcourse__meta {
	margin-top: var(--shs-space-32);
	font-size: var(--shs-fs-base);
	font-weight: var(--shs-weight-medium);
}

.shs-subcourse__cta {
	margin-top: var(--shs-space-24);
}

/* ---- Mobil -------------------------------------------------------------- */

@media (max-width: 900px) {
	.shs-subcourse {
		grid-template-columns: minmax(0, 1fr);
		row-gap: var(--shs-space-24);
	}

	.shs-subcourse__media {
		aspect-ratio: 4 / 3;
	}
}

/* ---- Organizačné informácie -------------------------------------------- */

/*
 * Bloky pod sebou, každý s vlastným nadpisom — kurz býva prezenčne aj
 * online a údaje sa líšia. Jeden zlepený riadok sa v nich strácal.
 */
.shs-subcourse__infos {
	display: flex;
	flex-direction: column;
	gap: var(--shs-space-19);
	margin-top: var(--shs-space-12);
}

.shs-subcourse__info-title {
	margin: 0;
	font-size: var(--shs-fs-small);
	font-weight: var(--shs-weight-medium);
	line-height: var(--shs-lh-tight);
}

.shs-subcourse__info-text {
	margin: var(--shs-space-4) 0 0;
	font-size: var(--shs-fs-small);
	font-weight: var(--shs-weight-light);
	line-height: var(--shs-lh-relaxed);
	color: color-mix(in srgb, var(--shs-brand) 75%, transparent);
}