/* ==========================================================================
   PRE KOHO JE VZDELÁVANIE VHODNÉ

   Dvojriadkový nadpis so schodom (druhý riadok odsadený doprava),
   odrážky v dvoch stĺpcoch a pod nimi dvojica oblúkových fotiek.
   Dizajn: 1728 × 1129 px — nadpis na 420/665 px, odrážky na 145
   a 883 px, fotky 769 × 513 od 114 px.
   ========================================================================== */

.shs-fit {
	padding-block: calc(var(--shs-space-96) + var(--shs-space-24))
		calc(var(--shs-space-96) + var(--shs-space-24));
	color: var(--shs-brand);
	background: var(--shs-mist);
}

.shs-fit__inner {
	padding-inline: calc(var(--shs-gutter) + var(--shs-inset));
}

/*
 * Schod v nadpise: tenší rez začína v ~pätine šírky, silnejší o kus
 * ďalej — percentá sú prepočty z návrhu (420 a 665 px z 1728).
 */
.shs-fit__title .shs-section-title__soft {
	padding-inline-start: 16%;
}

.shs-fit__title .shs-section-title__strong {
	padding-inline-start: 30.3%;
}

.shs-fit__intro {
	margin-top: var(--shs-space-64);
	font-size: var(--shs-fs-lead);
	font-weight: var(--shs-weight-light);
	line-height: var(--shs-lh-loose);
}

/* ---- Odrážky ------------------------------------------------------------ */

/*
 * Jeden zoznam, dva stĺpce: `columns` ho rozdelí rovným dielom bez
 * toho, aby redaktor delil obsah ručne.
 */
.shs-fit__list {
	columns: 2;
	column-gap: var(--shs-space-96);
	margin: var(--shs-space-48) 0 0;
	padding-inline-start: var(--shs-space-31);
	font-size: var(--shs-fs-lead);
	font-weight: var(--shs-weight-light);
	line-height: 1.66;
}

.shs-fit__list li {
	break-inside: avoid;
}

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

/* ---- Fotky -------------------------------------------------------------- */

.shs-fit__photos {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--shs-space-31);
	margin-top: var(--shs-space-96);
}

.shs-fit__media {
	margin: 0;
	aspect-ratio: 714 / 416;
	background: var(--shs-cream);
}

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

@media (max-width: 900px) {
	.shs-fit {
		padding-block: var(--shs-space-64);
	}

	.shs-fit__inner {
		padding-inline: var(--shs-gutter);
	}

	/* Schody na úzkom okne nemajú kam ustupovať. */
	.shs-fit__title .shs-section-title__soft,
	.shs-fit__title .shs-section-title__strong {
		padding-inline-start: 0;
	}

	.shs-fit__intro {
		margin-top: var(--shs-space-32);
	}

	.shs-fit__list {
		columns: 1;
		margin-top: var(--shs-space-24);
	}

	.shs-fit__photos {
		grid-template-columns: minmax(0, 1fr);
		row-gap: var(--shs-space-24);
		margin-top: var(--shs-space-48);
	}
}
