/*
Theme Name: ReBalance
Theme URI: https://re-balance.cz/
Author: ReBalance
Description: Jednoduchý dvojjazyčný (CS/EN) landing theme pro ReBalance. Bez pluginů, bez buildu, bez JavaScriptu. Barvy a ilustrace jsou převzaté z aplikace ReBalance, aby web a produkt vypadaly jako jedna věc.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rebalance
Tags: one-column, custom-menu, translation-ready, responsive
*/

/* ═══ Reset ═══════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, ul, ol, li, figure, figcaption, blockquote, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img, svg, video { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }

/* ═══ Tokeny ══════════════════════════════════════════════════════════════
   Odvozené z `web/pwa/src/styles/tokens.css`. Když se mění paleta aplikace,
   mění se i tady — web nesmí vypadat jako jiný produkt.
   ═════════════════════════════════════════════════════════════════════════ */

:root {
	--ground:    #f2f8f9;
	--panel:     #ffffff;
	--stage:     #e7f1f4;
	--ink:       #0b2830;
	--ink-soft:  #46666f;
	--ink-faint: #6b8a94;
	--rule:      #d2e2e7;

	--teal:  #0a5e70;
	--azure: #38bdf8;
	--pink:  #e91e8c;

	--ok:   #26968b;
	--wip:  #b45309;
	--plan: #5b6ee1;

	/*
	 * Dva gradienty, ne jeden.
	 *
	 * `--grad` končí v azurové (#38bdf8). Ta má na světlém podkladu kontrast
	 * 2,1 : 1 — jako dekorace (čárky u odrážek, rámečky) je to v pořádku,
	 * jako TEXT ne. Nadpis v ní na konci doslova bledne a bílé písmo na
	 * tlačítku přestává být čitelné.
	 *
	 * `--grad-ink` je proto samostatný, tmavší: zachovává přechod, ale drží
	 * kontrast. Používá se všude, kde gradient nese písmeno nebo je pod ním
	 * text — nadpisy, tlačítka, velká čísla.
	 */
	--grad: linear-gradient(100deg, var(--teal) 10%, var(--azure));
	--grad-ink: linear-gradient(100deg, #0a5e70, #0d7a92);

	--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
	--mono: ui-monospace, "Cascadia Mono", Consolas, "SF Mono", monospace;

	--r-sm: 10px;
	--r:    14px;
	--r-lg: 20px;
	--r-pill: 999px;

	--shadow:    0 2px 10px rgba(11, 40, 48, 0.06);
	--shadow-lg: 0 14px 40px rgba(11, 40, 48, 0.10);

	--head-h: 64px;
}

@media (prefers-color-scheme: dark) {
	:root {
		--ground:    #061417;
		--panel:     #0c2126;
		--stage:     #0f2a31;
		--ink:       #dcedf2;
		--ink-soft:  #a6c3ca;
		--ink-faint: #7fa1ab;
		--rule:      #1b3a42;

		--teal:  #38bdf8;
		--azure: #7dd3fc;
		--pink:  #f472b6;

		--ok:   #5eead4;
		--wip:  #fbbf24;
		--plan: #a5b4fc;

		/* V tmavém režimu je to obráceně: text na gradientu je tmavý,
		   takže gradient musí naopak zesvětlat. */
		--grad-ink: linear-gradient(100deg, #38bdf8, #7dd3fc);

		--shadow:    0 2px 10px rgba(0, 0, 0, 0.45);
		--shadow-lg: 0 14px 40px rgba(0, 0, 0, 0.55);
	}
}

/* ═══ Základ ══════════════════════════════════════════════════════════════ */

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--head-h) + 16px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	background: var(--ground);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

a { color: var(--teal); }
@media (prefers-color-scheme: dark) { a { color: var(--azure); } }

:focus-visible {
	outline: 3px solid var(--pink);
	outline-offset: 3px;
	border-radius: 4px;
}

.wrap { max-width: 1060px; margin: 0 auto; padding: 0 20px; }
.wrap--narrow { max-width: 680px; }

.skiplink {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: var(--panel);
	padding: 12px 20px;
	border-radius: 0 0 var(--r) 0;
}
.skiplink:focus { left: 0; }

/* ═══ Hlavička ════════════════════════════════════════════════════════════ */

.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	/* Neprůhledné pozadí je záložní hodnota — `color-mix` je novější než
	   nejstarší prohlížeče, které ještě chodí, a bez fallbacku by lišta
	   zprůhlednila docela. */
	background: var(--ground);
	background: color-mix(in srgb, var(--ground) 88%, transparent);
	backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--rule);
}
@supports not (backdrop-filter: blur(1px)) { .site-header { background: var(--ground); } }

.site-header__inner {
	min-height: var(--head-h);
	display: flex;
	align-items: center;
	gap: 16px;
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: inherit;
	flex: none;
}
.brand__name { font-weight: 800; letter-spacing: -0.02em; font-size: 18px; }
.logo-mark { border-radius: 22%; }

.site-header__side {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 10px;
	flex: none;
}

/* ── Navigace (bez JS: <details>) ───────────────────────────────────────── */

.nav { position: relative; }
.nav__toggle {
	list-style: none;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	cursor: pointer;
	border-radius: var(--r-sm);
}
.nav__toggle::-webkit-details-marker { display: none; }
.nav__bars, .nav__bars::before, .nav__bars::after {
	display: block;
	width: 20px;
	height: 2px;
	border-radius: 2px;
	background: var(--ink);
}
.nav__bars { position: relative; }
.nav__bars::before, .nav__bars::after { content: ""; position: absolute; left: 0; }
.nav__bars::before { top: -6px; }
.nav__bars::after  { top: 6px; }

.nav__panel {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	min-width: 210px;
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: var(--r);
	box-shadow: var(--shadow-lg);
	padding: 8px;
}
.nav__list a {
	display: block;
	padding: 9px 12px;
	border-radius: var(--r-sm);
	text-decoration: none;
	color: var(--ink-soft);
	font-size: 15px;
	font-weight: 600;
}
.nav__list a:hover { background: var(--stage); color: var(--ink); }

/* ── Přepínač jazyků ────────────────────────────────────────────────────── */

.langsw {
	display: inline-flex;
	border: 1px solid var(--rule);
	border-radius: var(--r-pill);
	overflow: hidden;
	background: var(--panel);
}
.langsw__item {
	padding: 6px 11px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: var(--ink-faint);
	min-height: 32px;
	display: grid;
	place-items: center;
}
.langsw__item.is-active { background: var(--stage); color: var(--ink); }

/* ═══ Tlačítka ════════════════════════════════════════════════════════════ */

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 46px;
	padding: 12px 24px;
	border-radius: var(--r-pill);
	background: var(--grad-ink);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	border: 1px solid transparent;
}
.btn:hover, .btn:focus-visible { filter: brightness(1.08); }
.btn--sm { min-height: 38px; padding: 8px 16px; font-size: 14px; }
.btn--ghost {
	background: transparent;
	color: var(--ink);
	border-color: var(--rule);
}
.btn--ghost:hover { background: var(--panel); filter: none; }

@media (prefers-color-scheme: dark) {
	.btn { color: #04171c; }
}

.cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.cta-row--center { justify-content: center; }
.cta-note { margin-top: 12px; font-size: 13.5px; color: var(--ink-faint); }

/* ═══ Hero ════════════════════════════════════════════════════════════════ */

.hero { padding: 72px 0 60px; }
/* Sloupce v poměru, ne `auto` — s `auto` zůstávalo vedle malé ilustrace
   prázdné pole a text se roztahoval přes celou šířku. */
.hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 40px;
	align-items: center;
}
.hero__art { display: grid; place-items: center; }

.eyebrow {
	font-family: var(--mono);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ink-faint);
	margin-bottom: 14px;
}

/*
 * Nadpis je plnobarevný, gradient nese jen zvýrazněné slovo v `<em>`.
 * Celý nadpis v gradientu vypadal na konci vybledle a hůř se četl —
 * takhle si značku drží a zároveň je ostrý.
 */
h1 {
	font-size: clamp(34px, 5.6vw, 56px);
	font-weight: 800;
	letter-spacing: -0.035em;
	line-height: 1.06;
	text-wrap: balance;
	color: var(--ink);
}
h1 em {
	font-style: normal;
	background: var(--grad-ink);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.lead {
	margin-top: 22px;
	font-size: clamp(16.5px, 2.1vw, 19px);
	color: var(--ink-soft);
	max-width: 44ch;
	text-wrap: pretty;
}

/*
 * Tři nosná tvrzení pod hero.
 *
 * Původně to byl `flex` s mezerou 28 px a tři dvojice popisek/hodnota se
 * slily do jedné dlouhé řádky, kterou nešlo přečíst jako tři věci. Teď je to
 * mřížka s dělicími linkami a hodnota se láme pod popisek — každé tvrzení
 * má svůj sloupec a je vidět, kde končí.
 */
.facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid var(--rule);
}
.facts__item { padding-right: 24px; }
.facts__item + .facts__item {
	padding-left: 24px;
	border-left: 1px solid var(--rule);
}
.facts__item dt {
	font-family: var(--mono);
	font-size: 10.5px;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--ink-faint);
	margin-bottom: 6px;
}
.facts__item dd {
	font-size: 16px;
	font-weight: 650;
	line-height: 1.35;
	letter-spacing: -0.01em;
	text-wrap: pretty;
}

.art--hero { filter: drop-shadow(0 18px 34px rgba(11, 114, 133, 0.18)); }

/* ═══ Sekce ═══════════════════════════════════════════════════════════════ */

.section { padding: 64px 0; }
.section--tint { background: var(--stage); }
.section--cta { background: var(--stage); text-align: center; }

.label {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-faint);
	margin-bottom: 10px;
}

h2 {
	font-size: clamp(24px, 3.4vw, 34px);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.15;
	text-wrap: balance;
	margin-bottom: 14px;
}

h3 { font-size: 17px; font-weight: 700; letter-spacing: -0.015em; line-height: 1.3; }

.intro { font-size: 16.5px; color: var(--ink-soft); max-width: 66ch; text-wrap: pretty; }
.section--cta .intro { margin-inline: auto; }

.src {
	font-family: var(--mono);
	font-size: 11.5px;
	color: var(--ink-faint);
	border-top: 1px solid var(--rule);
	padding-top: 10px;
	margin-top: auto;
}
.src--wide { margin-top: 24px; border: 0; padding: 0; }

/* Odkaz na studii má být k dispozici, ne k přečtení — tečkovaná linka ho
   odliší od textu, aniž by si řekla o pozornost dřív než samotné číslo. */
.src__link {
	color: inherit;
	text-decoration: underline;
	text-decoration-style: dotted;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
.src__link:hover, .src__link:focus-visible {
	color: var(--teal);
	text-decoration-style: solid;
}
@media (prefers-color-scheme: dark) {
	.src__link:hover, .src__link:focus-visible { color: var(--azure); }
}

/* ═══ Čísla se zdroji ═════════════════════════════════════════════════════ */

.stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: 22px 28px;
	margin-top: 34px;
	padding: 26px 0;
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}
.stat { display: flex; flex-direction: column; gap: 6px; }
.stat__n {
	font-size: clamp(30px, 4.2vw, 40px);
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1.05;
	background: var(--grad-ink);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.stat__k { font-size: 14.5px; color: var(--ink-soft); text-wrap: pretty; }
.stat__src {
	margin-top: auto;
	padding-top: 8px;
	font-family: var(--mono);
	font-size: 11px;
	line-height: 1.5;
	color: var(--ink-faint);
}
.stats-note {
	margin-top: 22px;
	max-width: 62ch;
	font-size: 15.5px;
	color: var(--ink-soft);
	text-wrap: pretty;
}

/* ═══ Mřížky a karty ══════════════════════════════════════════════════════ */

.grid { display: grid; gap: 16px; margin-top: 32px; }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.grid--tight { gap: 14px; }

.card {
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: var(--r-lg);
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.card--tall { min-height: 100%; }
.card p { font-size: 14.5px; color: var(--ink-soft); }
.card--person .role {
	font-family: var(--mono);
	font-size: 11.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-faint);
	margin-top: -6px;
}

.feature {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 18px 20px;
	border-radius: var(--r);
	background: var(--panel);
	border: 1px solid var(--rule);
}
.feature h3 { font-size: 16px; }
.feature p { font-size: 14px; color: var(--ink-soft); }

/* ═══ Telefony ════════════════════════════════════════════════════════════ */

.phones {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 22px;
	margin-top: 36px;
	max-width: 780px;
}
.phone { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.phone__frame {
	width: 100%;
	max-width: 240px;
	/* Poměr ořezaných snímků (786 × 1333) — viz `tools/crop-screens.ps1`.
	   Není to poměr telefonu: z originálu se odřízl chrom prohlížeče. */
	aspect-ratio: 786 / 1333;
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: 28px;
	box-shadow: var(--shadow-lg);
	overflow: hidden;
	display: grid;
	place-items: center;
	padding: 8px;
}
.phone__img { width: 100%; height: 100%; object-fit: cover; border-radius: 22px; }
.phone__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	border-radius: 22px;
	background: var(--stage);
}
.phone figcaption { font-size: 13.5px; color: var(--ink-faint); text-align: center; }

/* ═══ Citace ══════════════════════════════════════════════════════════════ */

.quote {
	margin-top: 34px;
	max-width: 62ch;
	background: var(--stage);
	border-left: 3px solid var(--azure);
	border-radius: 0 var(--r) var(--r) 0;
	padding: 20px 22px;
}
.section--tint .quote { background: var(--panel); }
.quote b { display: block; font-size: 15.5px; margin-bottom: 6px; }
.quote em { font-size: 15.5px; color: var(--ink-soft); }

/* ═══ Přístup do ukázky ═══════════════════════════════════════════════════ */

.access {
	margin-top: 30px;
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: var(--r-lg);
	padding: 28px;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 28px;
	align-items: center;
}
.access__creds,
.access__form { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.access__creds .btn { align-self: flex-start; margin-top: 8px; }
.access__h { font-size: 19px; font-weight: 700; letter-spacing: -0.02em; }
.access__p { font-size: 15px; color: var(--ink-soft); max-width: 52ch; }

/* ── Formulář před ukázkou ──────────────────────────────────────────────── */

.signup { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }

/* Návnada na roboty. `display: none` nestačí — část robotů skrytá pole
   přeskakuje. Tohle je z toku dokumentu venku, ale pro robota vyplnitelné. */
.signup__trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.signup__row { display: flex; flex-direction: column; gap: 6px; }
.signup__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--ink-faint);
}
.signup__input {
	min-height: 46px;
	padding: 11px 14px;
	border: 1px solid var(--rule);
	border-radius: var(--r-sm);
	background: var(--ground);
	font-size: 16px; /* Pod 16 px iOS při zaostření stránku přiblíží. */
	max-width: 340px;
}
.signup__input:focus-visible { border-color: var(--teal); }

.signup__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	color: var(--ink-soft);
	max-width: 46ch;
	cursor: pointer;
}
.signup__consent input {
	flex: none;
	width: 20px;
	height: 20px;
	margin-top: 2px;
	accent-color: var(--teal);
}

.signup .btn { align-self: flex-start; }
.signup__note { font-size: 12.5px; line-height: 1.55; color: var(--ink-faint); max-width: 54ch; }

.kv { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.kv__k {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--ink-faint);
	min-width: 74px;
}
.kv__v { font-family: var(--mono); font-size: 15px; font-weight: 600; word-break: break-all; }

.tips { margin-top: 28px; display: flex; flex-direction: column; gap: 10px; max-width: 74ch; }
.tips li { font-size: 15px; color: var(--ink-soft); padding-left: 26px; position: relative; }
.tips li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 12px;
	height: 2px;
	border-radius: 2px;
	background: var(--grad);
}
.tips strong { color: var(--ink); font-weight: 650; }

/* ═══ Stav ════════════════════════════════════════════════════════════════ */

.status {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 14px;
	margin-top: 32px;
}
.status__item {
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: var(--r);
	padding: 18px 20px;
}
.status dt { font-size: 15px; font-weight: 700; margin-bottom: 3px; }
.status dd { font-size: 14px; color: var(--ink-soft); }

.pill {
	display: inline-block;
	font-family: var(--mono);
	font-size: 10.5px;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	padding: 2px 10px;
	border-radius: var(--r-pill);
	border: 1px solid currentColor;
	margin-bottom: 9px;
}
.pill--ok   { color: var(--ok); }
.pill--wip  { color: var(--wip); }
.pill--plan { color: var(--plan); }

/* ═══ Ceník ═══════════════════════════════════════════════════════════════ */

.plan {
	background: var(--panel);
	border: 1px solid var(--rule);
	border-radius: var(--r-lg);
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.plan--now { border-color: var(--teal); box-shadow: var(--shadow); }
.plan .pill { align-self: flex-start; margin: 4px 0 0; }
.plan__price { font-size: 28px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.2; }
.plan__price span { display: block; font-size: 13px; font-weight: 500; color: var(--ink-faint); letter-spacing: 0; }
.plan__items { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.plan__items li { font-size: 14.5px; color: var(--ink-soft); padding-left: 22px; position: relative; }
.plan__items li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 10px;
	height: 2px;
	border-radius: 2px;
	background: var(--grad);
}

/* ═══ Patička ═════════════════════════════════════════════════════════════ */

.site-footer {
	border-top: 1px solid var(--rule);
	padding: 44px 0 56px;
	font-size: 14px;
	color: var(--ink-soft);
	background: var(--ground);
}
.site-footer__grid {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	justify-content: space-between;
	align-items: flex-start;
}
.site-footer__privacy { margin-top: 12px; max-width: 44ch; font-size: 14px; }
.site-footer__links { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.site-footer__menu { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.site-footer__menu a { color: var(--ink-soft); text-decoration: none; }
.site-footer__menu a:hover { text-decoration: underline; }

.disclaimer {
	margin-top: 32px;
	padding: 16px 18px;
	border: 1px solid var(--rule);
	border-radius: var(--r);
	background: var(--panel);
	font-size: 13.5px;
	color: var(--ink-soft);
	max-width: 80ch;
}
.site-footer__legal { margin-top: 20px; font-size: 13px; color: var(--ink-faint); }

/* ═══ Obyčejné stránky (zásady soukromí apod.) ════════════════════════════ */

.page-body { padding: 56px 0 72px; }
.page-body .entry > * + * { margin-top: 16px; }
.page-body .entry h2 { margin-top: 34px; font-size: 24px; }
.page-body .entry h3 { margin-top: 24px; }
.page-body .entry ul { list-style: disc; padding-left: 22px; }
.page-body .entry li + li { margin-top: 6px; }
.page-body .entry img { border-radius: var(--r); }

/* ═══ Responzivita ════════════════════════════════════════════════════════ */

@media (max-width: 760px) {
	.hero { padding: 40px 0 36px; }
	.hero__inner { grid-template-columns: 1fr; gap: 28px; }
	.hero__art { display: none; }
	/* Na úzkém displeji se tři sloupce nevejdou — pod sebe, s linkou nahoře. */
	.facts { grid-template-columns: 1fr; margin-top: 32px; }
	.facts__item { padding-right: 0; }
	.facts__item + .facts__item {
		padding-left: 0;
		border-left: 0;
		border-top: 1px solid var(--rule);
		padding-top: 16px;
		margin-top: 16px;
	}
	.section { padding: 48px 0; }
	.access { grid-template-columns: 1fr; padding: 22px; }
	.access__art { display: none; }
	.brand__name { font-size: 16px; }
	.site-header__side .btn { display: none; }
	.phones { gap: 16px; }
}

/* Od téhle šířky se menu rozbalí do lišty a hamburger zmizí. */
@media (min-width: 900px) {
	.nav { display: contents; }
	.nav__toggle { display: none; }
	.nav__panel {
		display: block;
		position: static;
		background: none;
		border: 0;
		box-shadow: none;
		padding: 0;
		min-width: 0;
	}
	/* Chrome skrývá obsah zavřeného <details> přes tenhle pseudo-element. */
	.nav::details-content { content-visibility: visible; display: contents; }
	.nav__list { display: flex; gap: 2px; }
	.nav__list a { padding: 8px 11px; font-size: 14.5px; }
}

/* ═══ Tisk ════════════════════════════════════════════════════════════════ */

@media print {
	.site-header, .nav, .langsw, .btn, .phones { display: none !important; }
	body { background: #fff; color: #000; }
	.section, .hero { padding: 18px 0; }
}