/*
 * Rozvržení jednotlivých šablon.
 *
 * Komponenty používané napříč šablonami patří do components.css; tady je jen
 * to, co je vázané na konkrétní stránku.
 */

/* ------------------------------------------------------------ výpis §7.3 */

.rs-list {
	display: block;
}

.rs-item {
	border-bottom: 1px solid var(--rs-line-soft);
}

.rs-item__link {
	display: flex;
	gap: 13px;
	padding: 13px var(--rs-gutter);
}

.rs-item__thumb {
	display: block;
	flex-shrink: 0;
	width: 104px;
	height: 74px;
}

.rs-item__thumb .rs-ph {
	width: 100%;
	height: 100%;
}

.rs-item__body {
	display: block;
	flex-grow: 1;
	min-width: 0;
}

.rs-item__cat {
	display: block;
	margin-bottom: 5px;
	font-family: var(--rs-font-display);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	/*
	 * --rs-red-light, ne --rs-red.
	 *
	 * Specifikace si tu odporuje a stojí za to to mít zapsané: §2 povoluje
	 * --rs-red na "drobné verzálkové labely rubrik" s tím, že tam stačí 3:1,
	 * ale §15 žádá 4,5:1 pro všechen text pod 24 px bez tučného řezu. Tenhle
	 * label má 10 px a 400 -- do výjimky §2 se vejde, do §15 ne. Změřeno:
	 * --rs-red dává 3,30:1.
	 *
	 * Rozhodl jsem podle §15, protože "Hotovo, když" je akceptační brána.
	 * --rs-red-light dává 5,43:1, zůstává v paletě a pořád je to červená.
	 */
	color: var(--rs-red-light);
}

.rs-item__title {
	display: block;
	margin-bottom: 6px;
	font-family: var(--rs-font-display);
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;
	color: var(--rs-text);
}

.rs-item__meta {
	display: block;
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 0.5px;
	color: var(--rs-muted);
}

/* ------------------------------------------------------- vizitka autora */

.rs-authorbox {
	display: flex;
	gap: 12px;
	/* Bez životopisu je v boxu jen počet článků a u flex-start plaval nahoře. */
	align-items: center;
	margin: 0 var(--rs-gutter) 6px;
	padding: 14px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
}

.rs-authorbox__img {
	flex-shrink: 0;
	border-radius: 50%;
}

.rs-authorbox__body {
	min-width: 0;
}

.rs-authorbox__bio {
	margin-bottom: 6px;
	font-family: var(--rs-font-body);
	font-size: 15px;
	line-height: 1.5;
	color: var(--rs-text-body);
}

.rs-authorbox__count {
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

/* ------------------------------------------------------------- perex výpisu */

.rs-lede {
	padding: 0 var(--rs-gutter) 14px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--rs-muted);
}

.rs-archive__desc {
	padding: 0 var(--rs-gutter) 14px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--rs-muted);
}

/* -------------------------------------------------------- prázdný stav §10 */

.rs-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 40px var(--rs-gutter);
	text-align: center;
}

.rs-empty__text {
	font-size: 17px;
	color: var(--rs-muted);
}

.rs-empty__actions {
	display: flex;
	justify-content: center;
	padding: 0 var(--rs-gutter) 24px;
}

/* ------------------------------------------------------------ stránkování */

.rs-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 20px var(--rs-gutter) 24px;
}

.rs-pagination a,
.rs-pagination .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--rs-tap);
	height: var(--rs-tap);
	padding: 0 12px;
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
	background: var(--rs-surface);
	font-family: var(--rs-font-display);
	font-size: 13px;
	letter-spacing: 0.6px;
	color: var(--rs-text);
}

.rs-pagination .current {
	background: var(--rs-red);
	border-color: var(--rs-red);
	color: #FFFFFF;
}

.rs-pagination .dots {
	display: inline-flex;
	align-items: center;
	height: var(--rs-tap);
	color: var(--rs-muted);
}

/* ---------------------------------------------------------------- stránka */

/*
 * Stránka složená v SiteOrigin, ale s textem -- typicky "O nás".
 *
 * Titulka žádné odsazení nechce: její widgety (rs-widget-a/b/d) si gutter
 * řeší samy a fotky mají být přes celou šířku. Textový widget ale ne, a na
 * "O nás" tekl text až k okraji displeje.
 *
 * Odsazení proto dostává jen editorový widget, ne celý obsah stránky.
 */
.rs-page--panels .so-widget-sow-editor,
.rs-page--panels .so-panel.widget_text > .textwidget,
.rs-page--panels .so-panel.widget_custom_html > .textwidget,
/* Nadpis widgetu leží vedle .textwidget, ne v něm -- "Redakce" na "O nás"
   proto zůstávala nalepená na okraji, i když text pod ní už odsazený byl. */
.rs-page--panels .so-panel > h1,
.rs-page--panels .so-panel > h2,
.rs-page--panels .so-panel > h3,
.rs-page--panels .so-panel > .rs-widget__title {
	padding-left: var(--rs-gutter);
	padding-right: var(--rs-gutter);
}

/*
 * Titulka je výjimka: její widgety jsou rs-widget-a/b/d a ty si gutter řeší
 * samy. Kdyby dostaly ještě tenhle, fotky by přestaly být přes celou šířku.
 */
.rs-page--panels .rs-widget-a,
.rs-page--panels .rs-widget-b,
.rs-page--panels .rs-widget-d {
	padding-left: 0;
	padding-right: 0;
}

/*
 * Pevné výšky z ruky autorů. Vizitky redakce mají <div style="height: 80px">
 * s fotkou 80 × 80 na obtékání -- na mobilu, kde se jméno zalomí pod fotku,
 * to ořezávalo obsah a jednotlivé vizitky lezly přes sebe. Změřeno na "O nás":
 * box 80 px, obsah potřeboval kolem 160.
 *
 * HTML autorů se nepřepisuje, jen se mu nedovolí ořezat vlastní obsah --
 * stejně jako u vizitky šéfredaktora v patičce.
 */
.rs-page__content .textwidget div[style*="height"] {
	height: auto !important;
	min-height: 0;
	overflow: hidden;
}



.rs-page__content {
	padding: 0 var(--rs-gutter);
	color: var(--rs-text-body);
}

/*
 * Stránka skládaná v SiteOrigin Panels si řídí vlastní odsazení, takže gutter
 * z .rs-page__content by se sčítal s tím jejich. Autoři na panely sahají dál
 * a nesmí se jim to rozbít.
 */
.rs-page--panels .rs-page__content {
	padding: 0;
}

.rs-prose p {
	margin: 0 0 16px;
	font-size: 18px;
	line-height: 1.68;
	color: var(--rs-text-body);
}

.rs-prose h2 {
	margin: 26px 0 10px;
	font-size: 21px;
	line-height: 1.25;
}

.rs-prose img {
	height: auto;
	border-radius: var(--rs-radius);
}

/* ------------------------------------------------------------- článek §9 */

/*
 * Odznak rubriky nad titulkem.
 *
 * Nahradil název rubriky v hlavičce. Ta byla kvůli němu na článku jiná než
 * jinde -- a na mobilu se v ní vůbec neobjevila značka.
 */
.rs-article__cat {
	display: inline-flex;
	align-items: center;
	min-height: var(--rs-tap);
	margin-bottom: 8px;
}

/*
 * Pruh průběhu čtení.
 *
 * Drží se u horního okraje. Vlastník 18. 9.: "není sticky to top, takže se po
 * krátkém scrollu skryje a není nic vidět" -- což z ukazatele průběhu dělá
 * ozdobu, kterou čtenář uvidí jen na začátku, tedy přesně tam, kde nic
 * neukazuje.
 *
 * §14.1 zakazuje lepivé lišty nad obsahem. Tohle žádná lišta není: jsou to
 * 3 px vlasové linky, nic nepřekrývají a nejde o reklamu, na kterou to
 * pravidlo míří. Navazuje přesně na červený pruh v hlavičce -- jak čtenář
 * roluje, ta linka se plní.
 *
 * Dráha je průhledná schválně: nahoře stránky se pod ní ukáže červený pruh
 * hlavičky a přechod mezi nimi není vidět.
 */
.rs-progress {
	position: fixed;  /* §14.1 OK: 3px linka průběhu čtení, ne lišta, nic nepřekrývá */
	top: 0;
	left: 0;
	right: 0;
	z-index: 75;
	height: 3px;
	background: transparent;
	pointer-events: none;
}

.rs-progress__bar {
	display: block;
	width: 0;
	height: 3px;
	background: var(--rs-red);
}

/* ------------------------------------------------------------- sdílení */

/*
 * Řádek s autorem: vlevo autor, vpravo sdílení.
 *
 * Tlačítko stálo pod bylinem na vlastním řádku a vlastník to chtěl jinak --
 * má pravdu, na jednom řádku to drží pohromadě a ušetří to svislé místo nad
 * hlavní fotkou.
 *
 * gap drží tlačítko od textu i když se jméno autora zalomí; wrap zajistí, že
 * na úzkém displeji spadne pod autora místo aby ho zmáčklo.
 */
.rs-bylinerow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px 14px;
}

.rs-share {
	padding: 0;
	flex-shrink: 0;
	margin-left: auto;
}

.rs-share__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.rs-article__head {
	padding: 20px var(--rs-gutter) 14px;
}

.rs-article__title {
	margin: 0 0 12px;
	font-weight: 600;
	font-size: 28px;
	line-height: 1.14;
}

.rs-byline {
	display: flex;
	align-items: center;
	gap: 9px;
}

.rs-byline__avatar {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--rs-line);
}

.rs-byline__img {
	display: block;
	width: 34px;
	height: 34px;
}

.rs-byline__name {
	display: block;
	font-family: var(--rs-font-display);
	font-size: 13px;
	letter-spacing: 0.6px;
	color: var(--rs-text);
}

.rs-byline__meta {
	display: block;
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-article__hero .rs-ph {
	height: 208px;
	border-radius: 0;
}

/*
 * Perex je Source Serif 600 a světlejší než tělo: je to shrnutí, ne první
 * odstavec, a spec §9 na tom rozdílu trvá.
 */
.rs-article__lede {
	margin: 18px var(--rs-gutter) 16px;
	font-weight: 600;
	font-size: 19px;
	line-height: 1.5;
	color: var(--rs-text);
}

.rs-article__body {
	padding: 0 var(--rs-gutter);
}

.rs-article__body blockquote {
	margin: 0 0 16px;
	padding: 0 0 0 16px;
	border-left: 3px solid var(--rs-red);
	font-family: var(--rs-font-display);
	font-weight: 400;
	font-size: 21px;
	line-height: 1.35;
	color: var(--rs-text);
}

/* Slot se vkládá doprostřed obsahu, takže si musí gutter odečíst. */
.rs-article__body .rs-ad {
	padding-left: 0;
	padding-right: 0;
}

.rs-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 22px var(--rs-gutter) 0;
}

/* ------------------------------------------- box autora z PublishPress §9 */

/*
 * PublishPress Authors připojuje za obsah vlastní box s autorem. Není to nic,
 * co by šablona vyráběla -- plugin ho vkládá filtrem na the_content.
 *
 * Nestylovat ho nejde: změřeno na článku 62220 měl kontrast 1,94:1 (§15 chce
 * 4,5:1) a odkazy 30-32 px vysoké (§14.7 chce 44). Stejný přístup jako
 * u The Events Calendar -- stylujeme výstup pluginu, nepřepisujeme jeho šablony,
 * takže se dál aktualizuje sám.
 *
 * POZOR, otevřená věc pro vlastníka: autora už vypisuje .rs-byline nad článkem,
 * takže se tu jméno objevuje podruhé a nadpis boxu je anglicky "Author".
 * Vypnout box nebo změnit jeho text je redakční rozhodnutí, ne moje -- podle
 * zadání se pro autory nesmí změnit nic. Zatím je tedy jen čitelný.
 */
.pp-multiple-authors-boxes-wrapper {
	margin: 26px 0 0;
	padding: 16px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
}

.pp-multiple-authors-boxes-wrapper .widget-title,
.pp-multiple-authors-boxes-wrapper .box-header-title {
	margin: 0 0 10px;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.pp-multiple-authors-boxes-wrapper,
.pp-multiple-authors-boxes-wrapper p,
.pp-multiple-authors-boxes-wrapper .pp-author-boxes-description,
.pp-multiple-authors-boxes-wrapper .pp-author-boxes-avatar-details {
	font-family: var(--rs-font-body);
	font-size: 15px;
	line-height: 1.5;
	color: var(--rs-text-body);
}

.pp-multiple-authors-boxes-wrapper .pp-author-boxes-name,
.pp-multiple-authors-boxes-wrapper .pp-author-boxes-name a {
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 16px;
	letter-spacing: 0.4px;
	color: var(--rs-text);
}

/* Odkazy v boxu: --rs-red by na tmavém nedal 4,5:1 (§2), proto světlá varianta. */
.pp-multiple-authors-boxes-wrapper a {
	color: var(--rs-red-light);
}

/* Dotykové cíle. Plugin je nechává ve výšce textu, tedy 30-32 px. */
.pp-multiple-authors-boxes-wrapper a,
.pp-multiple-authors-boxes-wrapper .pp-author-boxes-meta a,
.pp-multiple-authors-boxes-wrapper .ppma-author-user_email-profile-data a {
	display: inline-flex;
	align-items: center;
	min-height: var(--rs-tap);
}

.pp-multiple-authors-boxes-wrapper ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Barva jména v boxu. Tohle jediné se musí přebít natvrdo.
 *
 * Plugin si generuje vlastní <style> do stránky a barvu, kterou má uloženou
 * v nastavení, píše jako
 *   .pp-multiple-authors-boxes-wrapper.pp-multiple-authors-layout-boxed
 *   .multiple-authors-target-the-content ... .pp-multiple-authors-boxes-li
 *   { color: rgb(60, 67, 74) !important }
 * To je specificita (0,4,0) plus !important. Na tmavém podkladu šablony
 * vychází #3C434A na --rs-surface jako 1,78:1, tedy hluboko pod 4,5:1 (§15).
 *
 * Změnit to v nastavení pluginu nejde: nastavení je společné pro obě šablony
 * a FlyMag zatím běží v produkci. Proto se to přebíjí tady a jen tady.
 *
 * Atributové selektory místo konkrétních tříd, aby to přežilo přepnutí
 * rozvržení boxu v pluginu (boxed / simple / centered mají jinou třídu).
 * Výsledná specificita (0,5,0) > (0,4,0).
 */
.pp-multiple-authors-boxes-wrapper[class*="pp-multiple-authors-layout-"][class*="multiple-authors-target-"][class*="box-post-id-"] .pp-multiple-authors-boxes-li {
	color: var(--rs-text-body) !important;
}

/*
 * Velikost avataru NEPŘEPISUJEME. Plugin ji tlačí přes !important (80 × 80)
 * a pravidlo, které nic nedělá, je horší než žádné -- příště by někdo hledal,
 * proč se neprojevuje. 80 px je velké, ale není to porušení §15.
 */

/* ---------------------------------------- konec článku: navazující obsah */

.rs-postnav {
	display: grid;
	gap: 8px;
	padding: 26px var(--rs-gutter) 0;
}

.rs-postnav__item {
	display: block;
	padding: 12px 14px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
}

.rs-postnav__dir {
	display: block;
	margin-bottom: 4px;
	font-family: var(--rs-font-display);
	font-size: 10px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-postnav__title {
	display: block;
	font-family: var(--rs-font-display);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.3;
	color: var(--rs-text);
}

.rs-postnav__item--next {
	text-align: right;
}

.rs-related {
	padding-top: 22px;
}

/* --------------------------------------------------------------- diskuse */

.rs-comments {
	padding: 26px var(--rs-gutter) 0;
}

.rs-comments__list {
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}

.rs-comments__list ol {
	margin: 0;
	padding-left: 18px;
	list-style: none;
}

.rs-comments .comment-body {
	padding: 14px 0;
	border-top: 1px solid var(--rs-line-soft);
}

.rs-comments .comment-author {
	display: flex;
	align-items: center;
	gap: 9px;
	font-family: var(--rs-font-display);
	font-size: 14px;
	color: var(--rs-text);
}

.rs-comments .comment-author img {
	border-radius: 50%;
}

.rs-comments .comment-meta,
.rs-comments .comment-metadata {
	margin: 4px 0 8px;
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 0.6px;
	color: var(--rs-muted);
}

.rs-comments p {
	font-family: var(--rs-font-body);
	font-size: 16px;
	line-height: 1.6;
	color: var(--rs-text-body);
}

.rs-comments a {
	color: var(--rs-red-light);
}

/*
 * Odkazy v diskusi jsou samostatné cíle, ne odkazy uvnitř věty, takže na ně
 * platí 44 px (§14.7). Změřeno: datum komentáře vycházelo 16 px a odkaz
 * "přihlásit" 22 px.
 *
 * Automatické měření je nenašlo, protože datum leží v <li> a skript odkazy
 * v běžném textu vyjímá (WCAG 2.5.8). U permalinku komentáře je ta výjimka
 * nesprávná -- je to ovládací prvek, ne slovo ve větě.
 */
.rs-comments .comment-reply-link,
.rs-comments .comment-meta a,
.rs-comments .comment-metadata a,
.rs-comments .comment-respond a,
.rs-comments .comment-awaiting-moderation + a {
	display: inline-flex;
	align-items: center;
	min-height: var(--rs-tap);
}

.rs-comments .comment-respond {
	padding-top: 8px;
}

.rs-comments .comment-reply-title {
	margin: 0 0 12px;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--rs-text);
}

.rs-comments label {
	display: block;
	margin-bottom: 5px;
	font-family: var(--rs-font-display);
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-comments textarea,
.rs-comments input[type="text"],
.rs-comments input[type="email"],
.rs-comments input[type="url"] {
	width: 100%;
	padding: 10px 12px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
	color: var(--rs-text);
	font-family: var(--rs-font-body);
	font-size: 16px;  /* pod 16 px iOS zoomuje */
}

.rs-comments input[type="text"],
.rs-comments input[type="email"],
.rs-comments input[type="url"] {
	min-height: var(--rs-tap);
}

.rs-comments .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 9px;
}

.rs-comments .comment-form-cookies-consent label {
	margin: 0;
	font-family: var(--rs-font-body);
	font-size: 14px;
	text-transform: none;
	letter-spacing: 0;
	color: var(--rs-text-body);
}

.rs-comments input[type="checkbox"] {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	accent-color: var(--rs-red);
}

.rs-comments .form-submit input[type="submit"] {
	min-height: var(--rs-tap);
	padding: 0 18px;
	background: var(--rs-red);
	border: 0;
	border-radius: var(--rs-radius);
	color: #FFFFFF;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	cursor: pointer;
}

@media (min-width: 768px) {
	.rs-postnav {
		grid-template-columns: 1fr 1fr;
	}

	.rs-related__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 24px;
	}

	.rs-related__list .rs-item__link {
		padding-left: 0;
		padding-right: 0;
	}
}

/* --------------------------------------------------------- fotoreport §8 */

.rs-photo__hero .rs-ph {
	height: 244px;
	border-radius: 0;
}

.rs-photo__caption {
	padding: 8px var(--rs-gutter) 0;
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 0.4px;
	color: var(--rs-muted);
}

.rs-photo__lede {
	margin: 16px var(--rs-gutter) 18px;
	font-size: 18px;
	line-height: 1.55;
	color: var(--rs-text-body);
}

/*
 * Ve fotoreportu si celou šířku sloupce berou fotky, ne text.
 *
 * Tělo článku má max-width 68 znaků (spec §3), což je správně pro čtení, ale
 * galerie do toho spadla taky: změřeno na desktopu, mozaika měla 504 px z 871,
 * které má sloupec k dispozici. Na webu, který je hlavně o fotoreportech, je
 * to ta nejdražší možná ztráta místa.
 *
 * Omezení se proto přesouvá z obalu na jednotlivé textové prvky. Fotky dostanou
 * celý sloupec, odstavce zůstanou čitelně úzké a vystředěné.
 */
.rs-photo .rs-article__body {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

/*
 * Text zarovnaný doleva, ne vystředěný.
 *
 * Vystředění vypadalo rozházeně: nadpis widgetu je přímým potomkem panelu
 * a má celou šířku (751 px, začíná na 120), kdežto odstavce leží uvnitř
 * .textwidget a vystředěných 68 znaků je odsunulo na 183. Nadpis a text pod
 * ním tak nezačínaly na stejné svislici.
 *
 * Doleva je to i správně: pod galerií přes celou šířku se text čte líp, když
 * navazuje na její levou hranu.
 */
.rs-photo .rs-article__body p,
.rs-photo .rs-article__body ul,
.rs-photo .rs-article__body ol,
.rs-photo .rs-article__body blockquote {
	max-width: 68ch;
	margin-left: 0;
	margin-right: auto;
}

/* ------------------------------------------------------ mozaika galerie §8 */

/*
 * Galerie ve fotoreportu. Autoři jich do reportáže dávají několik a prokládají
 * jimi text -- viz inc/gallery.php.
 *
 * MOBIL: dvě dlaždice v řádku, ořez na 4:3.
 * Tři vedle sebe by na 375 px vyšly kolem 120 px a §14.6 nepřipouští fotku
 * v galerii užší než 150. Řádky z PHP se tu ignorují (display: contents),
 * takže se všechny dlaždice poskládají do jedné mřížky.
 */
.rs-mosaic {
	display: grid;
	grid-template-columns: repeat(2, minmax(150px, 1fr));
	gap: 3px;
	margin: 14px 0 18px;
}

.rs-mosaic__row {
	display: contents;
}

.rs-mosaic__tile {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--rs-surface-2);
	overflow: hidden;
}

/*
 * Dvě třídy, stejně jako u .rs-ph .rs-ph__img a ze stejného důvodu: mozaika
 * leží uvnitř .rs-prose a tam platí img { height: auto } pro obrázky v textu.
 * To je (0,1,1) a jednu třídu by přebilo -- změřeno: dlaždice 128 px, fotka
 * v ní 113, takže pod každou fotkou zůstával tmavý pruh.
 */
.rs-mosaic__tile .rs-mosaic__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.rs-mosaic__tile:hover .rs-mosaic__img {
	opacity: 0.88;
}

/*
 * DESKTOP: justified mozaika.
 *
 * Řádek má aspect-ratio rovné součtu poměrů svých fotek a každá dlaždice
 * flex-grow rovný svému poměru. Šířky tím vyjdou úměrné poměrům a všechny
 * fotky v řádku mají stejnou výšku -- přesně to, co dělá Jetpack Tiled
 * Gallery na produkci, jen bez pluginu a bez JavaScriptu.
 *
 * aspect-ratio i flex jsou v inline stylu z PHP, protože obojí závisí na
 * konkrétních fotkách.
 */
@media (min-width: 768px) {
	.rs-mosaic {
		display: block;
		margin: 18px 0 22px;
	}

	.rs-mosaic__row {
		display: flex;
		gap: 3px;
		margin-bottom: 3px;
	}

	.rs-mosaic__tile {
		aspect-ratio: auto;
		min-width: 0;
	}
}

.rs-entities {
	padding: 24px var(--rs-gutter) 0;
}

.rs-entities__label {
	margin-bottom: 10px;
	font-family: var(--rs-font-display);
	font-size: 11px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-entities .rs-tags {
	padding: 0;
}

/*
 * Galerie v těle článku: 2 sloupce pod 600, 3 do 900, 4 nad 900. Nikdy víc
 * než 4 a nikdy dlaždice pod 150 px (spec §12, §14.6).
 */
.rs-prose .wp-block-gallery,
.rs-prose .gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(150px, 1fr));
	gap: 8px;
}

@media (min-width: 600px) {
	.rs-prose .wp-block-gallery,
	.rs-prose .gallery { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
}

@media (min-width: 900px) {
	.rs-prose .wp-block-gallery,
	.rs-prose .gallery { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
}

/* --------------------------------------------------------- hero §7.2 */

.rs-hero {
	position: relative;
	display: block;
	height: 322px;
	overflow: hidden;
}

.rs-hero__media,
.rs-hero__media .rs-ph {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

/* Hero bez fotky dostane gradient a teplý vodoznak, ne šedou plochu. */
.rs-ph--hero {
	background: var(--rs-grad-hero-mobile);
}

/*
 * Překryv je povinný. Bez něj není titulek na fotce čitelný (spec §13) a musí
 * sahat dost vysoko, aby pokryl i titulek na tři řádky.
 */
.rs-hero__scrim {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: block;
	padding: 20px var(--rs-gutter) 18px;
	background: var(--rs-grad-scrim-mobile);
}

.rs-hero__title {
	display: block;
	margin: 10px 0;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 27px;
	line-height: 1.16;
	color: var(--rs-text);
}

.rs-hero__meta {
	display: block;
	font-family: var(--rs-font-display);
	font-size: 12px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

/* ------------------------------------------------- mřížka fotoreportů §7.7 */

.rs-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	padding: 0 var(--rs-gutter);
}

.rs-tile__media {
	position: relative;
	display: block;
}

.rs-tile__media .rs-ph {
	height: 122px;
}

.rs-tile__count {
	position: absolute;
	right: 6px;
	bottom: 6px;
	padding: 3px 6px;
	border-radius: 2px;
	background: rgba(13, 13, 15, 0.82);
	font-family: var(--rs-font-display);
	font-size: 10px;
	letter-spacing: 0.8px;
	color: var(--rs-text);
}

.rs-tile__title {
	display: block;
	margin-top: 8px;
	font-family: var(--rs-font-display);
	font-weight: 500;
	font-size: 14px;
	line-height: 1.25;
	color: var(--rs-text);
}

/* Widgety na titulce nesmí mít vlastní odsazení -- gutter řeší jejich obsah. */
.rs-widget-a,
.rs-widget-b,
.rs-widget-d {
	display: block;
}


/* ==========================================================================
   Desktop (spec §11, §12)

   Tyhle přepisy musí být tady a ne v layout.css: pages.css se enqueuuje jako
   poslední, takže mobilní .rs-hero { height: 322px } výš by desktopovou verzi
   v layout.css při stejné specificitě přebilo. Změřeno -- hero zůstávalo 322.
   ========================================================================== */

@media (min-width: 768px) {

/* --- hero --- */

.rs-hero {
	height: 430px;
	border-radius: var(--rs-radius);
}

.rs-ph--hero {
	background: var(--rs-grad-hero-desktop);
}

.rs-hero__scrim {
	padding: 40px 36px 32px;
	background: var(--rs-grad-scrim-desktop);
}

.rs-hero__title {
	font-size: 42px;
	line-height: 1.12;
	max-width: 760px;
}

/* --- horní blok titulky: panely vedle sebe, ne natažený výpis --- */

/*
 * Vlastník, 17. 9.: "ty horní 4 nové články nejsou vizuálně nic moc,
 * 3 panely vedle sebe byly lepší (to, co je teď na produkci)."
 *
 * Měl pravdu a bylo to vidět na první pohled: blok B je mobilní výpis
 * (náhled 104 × 74 vlevo, titulek vpravo) a na 1 320 px se z něj stal řádek
 * s drobnou fotkou a titulkem taženým přes 1 100 px prázdna. Na produkci je
 * nahoře pás fotografických panelů s titulkem v ploše fotky.
 *
 * Značka zůstává stejná jako na mobilu -- mění se jen rozvržení. Panel je
 * malý hero: fotka přes celou plochu, povinný gradient pod textem (§14),
 * rubrika a titulek dole. Je to odklon od §11, který v tomhle místě popisuje
 * kartu s textem POD fotkou; rozhodl o tom vlastník a tohle je ten důvod.
 *
 * Počet sloupců se řídí počtem položek, které si nastavili autoři: čtyři
 * články dají čtyři panely, tři dají tři. Pevná trojka by u čtyř položek
 * nechala jednu osiřelou na druhém řádku.
 *
 * Na mobilu se nic nemění -- tam je výpis §7.3 správně a panely by titulku
 * jen prodloužily.
 */
@media (min-width: 768px) {
	.rs-widget-b .rs-list {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
		gap: 24px;
		padding: 0 var(--rs-gutter);
	}

	.rs-widget-b .rs-item {
		border-bottom: 0;
	}

	.rs-widget-b .rs-item__link {
		display: grid;
		gap: 0;
		padding: 0;
		border-radius: var(--rs-radius);
		overflow: hidden;
	}

	.rs-widget-b .rs-item__thumb,
	.rs-widget-b .rs-item__body {
		grid-area: 1 / 1;
		width: 100%;
	}

	.rs-widget-b .rs-item__thumb {
		height: 230px;
	}

	/*
	 * Gradient není dekorace. Bez něj titulek na světlé fotce zmizí a §14 ho
	 * proto dělá povinným, ne volitelným.
	 */
	.rs-widget-b .rs-item__body {
		align-self: end;
		/*
		 * Horní padding 34, ne 16. Gradient kreslí jen plocha .rs-item__body,
		 * takže musí začínat znatelně nad prvním řádkem titulku -- §14 chce,
		 * aby scrim "sahal dost vysoko, aby pokryl i titulek na tři řádky",
		 * a u třířádkového titulku ležel první řádek v úplně průhledné části.
		 */
		padding: 34px 18px 14px;
		background: var(--rs-grad-scrim-desktop);
	}

	.rs-widget-b .rs-item__title {
		font-size: 19px;
		line-height: 1.25;
	}

	.rs-widget-b .rs-item__meta {
		color: var(--rs-muted-2);
	}
}

/* --- výpis a mřížka --- */

.rs-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	padding: 0;
}

.rs-tile__media .rs-ph {
	height: 158px;
}

.rs-tile__title {
	font-size: 19px;
}

.rs-item__title {
	font-size: 17px;
	line-height: 1.28;
}

.rs-item__thumb {
	width: 132px;
	height: 90px;
}

/* --- článek --- */

/*
 * Délka řádku kolem 68 znaků (spec §3). V osmisloupcovém sloupci to vychází
 * užší než sloupec sám, tak se text vystředí -- vlevo zarovnaný text s prázdnem
 * vpravo vypadá jako chyba rozvržení, i když je délka řádku správně.
 */
.rs-article__body,
.rs-photo__lede,
.rs-article__lede {
	max-width: 68ch;
	margin-left: auto;
	margin-right: auto;
}

.rs-article__hero .rs-ph,
.rs-photo__hero .rs-ph {
	height: 430px;
	border-radius: var(--rs-radius);
}

/* --- galerie --- */

.rs-gallery__slide {
	width: min(420px, calc((100% - 3 * 8px) / 4));
}
}

/* ---------------------------------------------- pravý sloupec §11 */

/*
 * Widgety v pravém sloupci vykresluje sidebar-1, takže jejich značka je z
 * pluginů a z ruky autorů -- stylujeme obal, ne jejich vnitřek.
 */
.rs-rail .rs-widget {
	padding: 18px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
}

.rs-rail .rs-widget__title {
	margin: 0 0 12px;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rs-text);
}

.rs-rail ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.rs-rail li {
	padding: 9px 0;
	border-top: 1px solid var(--rs-line-inset);
}

.rs-rail li:first-child {
	border-top: 0;
	padding-top: 0;
}

.rs-rail a {
	display: block;
	min-height: var(--rs-tap);
	font-family: var(--rs-font-display);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.3;
	color: var(--rs-text);
}

.rs-rail a:hover {
	color: var(--rs-red-light);
}

.rs-rail input[type="search"],
.rs-rail input[type="text"] {
	width: 100%;
	min-height: var(--rs-tap);
	padding: 0 12px;
	background: var(--rs-ground);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
	color: var(--rs-text);
	font-family: var(--rs-font-body);
	font-size: 16px;  /* pod 16 px iOS při fokusu zoomuje */
}

.rs-rail input[type="submit"],
.rs-rail button {
	min-height: var(--rs-tap);
	padding: 0 16px;
	background: var(--rs-red);
	border: 0;
	border-radius: var(--rs-radius);
	color: #FFFFFF;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	cursor: pointer;
}

/*
 * Nic v pravém sloupci nelepí, ani když to plugin chce.
 *
 * Na webu běží q2w3-fixed-widget a drží poslední widget sidebaru
 * (ssp-zone-116260, což je reklamní zóna Seznamu) přilepený při rolování.
 * Změřeno: section.widget_text.rs-widget má position: fixed.
 *
 * Spec §14.1 to zakazuje a označuje za "jedinou největší změnu oproti dnešku";
 * §15 navíc kontroluje, že žádný reklamní prvek není fixed ani sticky. Plugin
 * se nedeaktivuje -- je společný s FlyMagem, který běží v produkci -- jen se
 * mu tady přebije účinek.
 *
 * POZOR, otázka na vlastníka: lepivá zóna se dívá déle a nejspíš i víc vydělá.
 * Tohle je záměrná ztráta, kterou spec chce; pokud ji vlastník nechce, je to
 * jeho rozhodnutí a pravidlo §14.1 je pak potřeba upravit, ne obcházet tady.
 */
.rs-rail .rs-widget,
.rs-rail .fixedwidget,
.rs-rail .q2w3-fixed-widget {
	position: static !important;
	top: auto !important;
	width: auto !important;
}

/*
 * Hledání v pravém sloupci se nevykresluje.
 *
 * Vlastník 18. 9.: "v pravém sloupci vedle contentu nemusí být search, když
 * je v hlavičce." Dvakrát totéž na jedné obrazovce nic nepřidá.
 *
 * Skrývá to styl, ne zásah do widgetů: sidebar-1 si plní autoři a jejich
 * nastavení zůstává, jak je. Až bude chtít vlastník hledání zpátky, je to
 * jedno pravidlo.
 */
.rs-rail .widget_search,
.rs-rail .widget_block_search {
	display: none;
}

/* Reklamní zóny v sloupci nesmí přetéct šířku (spec §14.2). */
.rs-rail .desktop-ads,
.rs-rail .mobile-ads,
.rs-rail iframe {
	max-width: 100%;
	overflow: hidden;
}

/* Prázdná zóna nemá dělat prázdný box s rámečkem. */
.rs-rail .rs-widget:has(.desktop-ads:empty),
.rs-rail .rs-widget:has(.mobile-ads:empty) {
	padding: 0;
	background: none;
	border: 0;
}

/* ------------------------------------------------ prohlížečka fotky §8 */

/*
 * Lupa staví až JavaScript. Bez něj je fotka obyčejný odkaz na svůj soubor,
 * takže se velká verze otevře i tak (§15: stránka musí jít proklikat bez JS).
 */
.rs-gallery__open {
	display: block;
}

.rs-gallery__open:hover .rs-ph__img {
	opacity: 0.9;
}

.rs-lupa {
	position: fixed;  /* §14.1 OK: zvětšená fotka, otevírá ji čtenář kliknutím */
	inset: 0;
	z-index: 70;
	display: flex;
	flex-direction: column;
	/* Neprůhledné. Přes 0,97 prosvítal text stránky a fotka v tom plavala. */
	background: var(--rs-ground);
	padding: 8px var(--rs-gutter) calc(12px + env(safe-area-inset-bottom));
}

.rs-lupa[hidden] {
	display: none;
}

.rs-lupa__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex-shrink: 0;
}

.rs-lupa__count {
	font-family: var(--rs-font-display);
	font-size: 12px;
	letter-spacing: 1px;
	color: var(--rs-muted);
	font-variant-numeric: tabular-nums;
}

.rs-lupa__stage {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 0;
	min-height: 0;
	/*
	 * Vodorovný směr si bere švihnutí mezi fotkami (assets/js/gallery.js),
	 * svislý zůstává prohlížeči. Bez toho by iOS bral vodorovné tažení od
	 * kraje jako "zpět" a fotka by se nepřepnula.
	 */
	touch-action: pan-y;
	/* Prst táhne po fotce, ne po jejím výběru. */
	user-select: none;
	-webkit-user-select: none;
}

.rs-lupa__img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.rs-lupa__caption {
	flex-shrink: 0;
	font-family: var(--rs-font-display);
	font-size: 12px;
	letter-spacing: 0.6px;
	line-height: 1.4;
	text-align: center;
	color: var(--rs-muted-2);
}

.rs-lupa__nav {
	display: flex;
	justify-content: center;
	gap: 14px;
	padding-top: 10px;
	flex-shrink: 0;
}

/* ------------------------------------------------- SPOLUPRACUJEME §7.6 */

/*
 * Pás je teď součástí patičky, takže má vlastní horní linku a odstup --
 * dřív se opíral o mezeru za posledním blokem titulky.
 */
.rs-partners {
	margin-top: 32px;
	padding-top: 22px;
	border-top: 1px solid var(--rs-line);
}

.rs-partners__intro {
	padding: 0 var(--rs-gutter) 12px;
	font-size: 14px;
	line-height: 1.45;
	color: var(--rs-muted);
}

/*
 * Vodorovně posuvný pás se zarážkami. Na desktopu se z něj stane mřížka
 * pěti sloupců vedle nadpisu (spec §11).
 */
/*
 * Bez scroll-snap. Se zarážkami se pás hned po načtení posunul o 16 px a první
 * logo sedělo nalepené na levém okraji -- prohlížeč zarovnal na první dlaždici
 * a odsazení tím sežral. U log to nic nepřináší, na rozdíl od galerie fotek.
 */
.rs-partners__strip {
	display: flex;
	gap: 10px;
	margin: 0;
	padding: 0 var(--rs-gutter);
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
}

.rs-partners__strip::-webkit-scrollbar { display: none; }

.rs-partner {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 112px;
	height: 64px;
	padding: 8px;
	/*
	 * Dlaždice je světlá, ne --rs-surface. Loga partnerů jsou cizí značky
	 * kreslené pro světlý podklad -- Obscure Promotion je černé a na tmavé
	 * dlaždici zmizelo úplně. Měnit je nemůžeme, tak se mění podklad.
	 */
	background: var(--rs-text);
	border-radius: var(--rs-radius);
}

.rs-partner img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

@media (min-width: 768px) {
	.rs-partners {
		display: grid;
		grid-template-columns: 210px 1fr;
		gap: 32px;
		align-items: start;
		margin-top: 44px;
		padding: 26px var(--rs-gutter) 0;
		max-width: calc(1320px + 2 * var(--rs-gutter));
		margin-left: auto;
		margin-right: auto;
	}

	.rs-partners__intro {
		padding: 0;
	}

	.rs-partners__strip {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 16px;
		overflow: visible;
		padding: 0;
	}

	.rs-partner {
		width: 100%;
		height: 74px;
	}
}

/* ------------------------------------------------------------- patička */

.rs-footer {
	margin-top: 32px;
	padding: 24px var(--rs-gutter) 28px;
	border-top: 1px solid var(--rs-line);
	background: var(--rs-ground);
}

.rs-footer__widgets {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--rs-line-inset);
}

/*
 * Widgety v patičce jsou z velké části vlastní HTML od autorů (vizitka
 * šéfredaktora, tlačítko Seznamu), takže se stylují jen obalové věci --
 * nadpis, odkazy, obrázky. Do jejich vnitřku se nesahá.
 */
.rs-footer .rs-widget__title,
.rs-footer .widget-title {
	margin: 0 0 10px;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-footer .rs-widget h3 {
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 16px;
	color: var(--rs-text);
}

.rs-footer .rs-widget img {
	max-width: 100%;
	height: auto;
}

/*
 * Vlastní HTML widgety v patičce počítají s tříslopcovou patičkou FlyMagu
 * a mají v sobě pevné výšky. Vizitka šéfredaktora má
 * <div style="height: 80px"> s fotkou na float: left -- na mobilu, kde se
 * sloupce skládají pod sebe, se do 80 px nevejde (potřebuje 146) a jméno
 * zmizelo pod dalším widgetem. Výška se proto pouští volně a float se ukončí.
 *
 * HTML autorů se nepřepisuje, jen se mu nedovolí ořezat vlastní obsah.
 */
.rs-footer .textwidget > div[style*="height"] {
	height: auto !important;
	overflow: hidden;  /* ukončí float fotky */
}

.rs-footer .rs-widget {
	overflow: hidden;
}

/* Prázdná widgetová oblast nemá zabírat mezeru. */
.rs-footer__widgetcol:empty {
	display: none;
}

/*
 * Tlačítko "Přidat na Seznam.cz" přijde s vlastními rozměry a vyšlo 135 × 40.
 * §14.7 nepřipouští cíl pod 44 v žádném rozměru.
 */
.rs-footer .rs-widget a {
	display: inline-flex;
	align-items: center;
	min-height: var(--rs-tap);
}

/* Ikony sociálních sítí od Jetpacku: dotykový cíl 44 (§14.7). */
.rs-footer .jetpack-social-widget-list {
	display: flex;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rs-footer .jetpack-social-widget-item a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--rs-tap);
	min-height: var(--rs-tap);
	color: var(--rs-text);
}

.rs-footer .jetpack-social-widget-item svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}

.rs-footer__social {
	padding-bottom: 22px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--rs-line-inset);
}

.rs-social {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Dvě třídy: .rs-footer a { color: var(--rs-red-light) } je (0,1,1) a jednu
 * třídu by přebilo, takže tlačítka sítí vycházela růžová jako textové odkazy.
 * Jsou to tlačítka, ne odkazy ve větě.
 */
.rs-footer .rs-social__link {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: var(--rs-tap);
	padding: 0 14px 0 12px;
	background: var(--rs-surface);
	border: 1px solid var(--rs-line);
	border-radius: var(--rs-radius);
	color: var(--rs-text);
}

.rs-footer .rs-social__link:hover {
	color: var(--rs-red-light);
	border-color: var(--rs-red-light);
}

.rs-social__name {
	font-family: var(--rs-font-display);
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.rs-footer__cols {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.rs-footer__brand {
	font-family: var(--rs-font-display);
	font-weight: 700;
	font-size: 18px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--rs-text);
	margin-bottom: 8px;
}

.rs-footer__head {
	margin: 0 0 8px;
	font-family: var(--rs-font-display);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rs-muted);
}

.rs-footer__col p,
.rs-footer__address {
	font-family: var(--rs-font-body);
	font-size: 15px;
	line-height: 1.6;
	font-style: normal;
	color: var(--rs-text-body);
}

.rs-footer a {
	color: var(--rs-red-light);
}

.rs-footer__links {
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * Odkazy v patičce jsou samostatné cíle, ne odkazy uvnitř věty, takže na ně
 * pravidlo 44 px platí bez výjimky (§14.7).
 */
.rs-footer__links a,
.rs-footer__address a {
	display: inline-flex;
	align-items: center;
	min-height: var(--rs-tap);
}

@media (min-width: 768px) {
	.rs-footer {
		max-width: calc(1320px + 2 * var(--rs-gutter));
		margin-left: auto;
		margin-right: auto;
		padding: 28px var(--rs-gutter) 40px;
	}

	.rs-footer__widgets {
		flex-direction: row;
		gap: 32px;
	}

	.rs-footer__widgetcol {
		flex: 1 1 0;
		min-width: 0;
	}

	.rs-footer__cols {
		flex-direction: row;
		gap: 32px;
	}

	.rs-footer__col {
		flex: 1 1 0;
		min-width: 0;
	}
}