/* Vygenerováno z design/tema (skin 1420); needitovat ručně. */
:root {
  --bw-barva-drevo-stredni: #574633;
  --bw-barva-drevo-svetle: #806348;
  --bw-barva-drevo-tmave: #2B201C;
  --bw-barva-kov-stredni: #4C443B;
  --bw-barva-kov-svetly: #8A8378;
  --bw-barva-kov-tmavy: #2E2C29;
  --bw-barva-krev-svetla: #A13426;
  --bw-barva-krev-tmava: #450E09;
  --bw-barva-krev-zaklad: #7A1D14;
  --bw-barva-linka-na-pergamenu: #2A1D1438;
  --bw-barva-logo-hlina: #493A2C;
  --bw-barva-logo-kalich: #B63C32;
  --bw-barva-logo-len: #DDD7C9;
  --bw-barva-logo-rumelka: #A74735;
  --bw-barva-logo-rumelka-svetla: #C8654F;
  --bw-barva-logo-tmavy: #211C17;
  --bw-barva-mapa-brod: #F4EFDD;
  --bw-barva-mapa-cesta: #E9DCAB;
  --bw-barva-mapa-cesta-hlavni: #C8773A;
  --bw-barva-mapa-cesta-obrys: #4B3920;
  --bw-barva-mapa-les: #34521F;
  --bw-barva-mapa-les-stin: #1C3212;
  --bw-barva-mapa-louka: #8B9A47;
  --bw-barva-mapa-mokrad: #748A4E;
  --bw-barva-mapa-papir: #C8BD88;
  --bw-barva-mapa-pesina: #DCCF9E;
  --bw-barva-mapa-pole: #A6A653;
  --bw-barva-mapa-sidlo-strecha: #9B3E2A;
  --bw-barva-mapa-sidlo-zed: #EADFC0;
  --bw-barva-mapa-skala: #8E866C;
  --bw-barva-mapa-voda: #2F5F92;
  --bw-barva-mapa-voda-hrana: #162D47;
  --bw-barva-mapa-vrstevnice: #3A4019;
  --bw-barva-pergamen-hrana: #A68360;
  --bw-barva-pergamen-svetly: #ECD9C0;
  --bw-barva-pergamen-tmavy: #BE9E7A;
  --bw-barva-pergamen-zaklad: #E0C7AA;
  --bw-barva-podklad-nejtmavsi: #0E0C09;
  --bw-barva-podklad-panel: #26201B;
  --bw-barva-podklad-tmavy: #1B1917;
  --bw-barva-podklad-zvyseny: #352B23;
  --bw-barva-stav-dobre: #7C9A45;
  --bw-barva-stav-neaktivni: #6B6257;
  --bw-barva-stav-ohrozeni: #E05A42;
  --bw-barva-stav-pozor: #D8BF92;
  --bw-barva-text-na-krvi: #F1E4CC;
  --bw-barva-text-na-pergamenu: #2A1D14;
  --bw-barva-text-na-pergamenu-tlumeny: #5A4632;
  --bw-barva-text-na-tmavem: #E6D9BF;
  --bw-barva-text-na-tmavem-tlumeny: #B9AB92;
  --bw-barva-text-nadpis-zlaty: #D8BF92;
  --bw-barva-zavoj-hero-do: #0E0C0900;
  --bw-barva-zavoj-hero-od: #0E0C09D9;
  --bw-barva-zlato-ram: #B08D57;
  --bw-barva-zlato-ram-tenky: #B08D5773;
  --bw-barva-zlato-stin: #6E5532;
  --bw-barva-zlato-svetlo: #D8BF92;
  --bw-ikony-cesta: none;
  --bw-ikony-styl: malované, světlé na tmavém, obrys 2 px tmavý, světlo zleva shora;
  --bw-kontrast-text-min: 4.5;
  --bw-kontrast-velky-text-min: 3.0;
  --bw-mezera-blok: 48px;
  --bw-mezera-l: 16px;
  --bw-mezera-m: 12px;
  --bw-mezera-s: 8px;
  --bw-mezera-sekce: 64px;
  --bw-mezera-xl: 24px;
  --bw-mezera-xs: 4px;
  --bw-mezera-xxl: 32px;
  --bw-ozdoba-pecet: none;
  --bw-ozdoba-predel: none;
  --bw-ozdoba-stuha: none;
  --bw-ozdoba-znak: none;
  --bw-pismo-cjk: "Noto Serif SC", "Noto Sans SC", serif;
  --bw-pismo-kniha: Alegreya, serif;
  --bw-pismo-nadpis: Grenze, serif;
  --bw-pismo-text: "Alegreya Sans", sans-serif;
  --bw-pohyb-najeti: 90ms;
  --bw-pohyb-otevreni: 180ms;
  --bw-pohyb-stisk: 60ms;
  --bw-pohyb-zavreni: 120ms;
  --bw-radek-cjk: 1.6;
  --bw-radek-nadpis: 1.15;
  --bw-radek-text: 1.35;
  --bw-radius-vse: 0px;
  --bw-ram-list: none;
  --bw-ram-lista-dolni: none;
  --bw-ram-lista-horni: none;
  --bw-ram-panel: none;
  --bw-serie-copyright-rok: 2026;
  --bw-serie-studio: RIGELIO Studio;
  --bw-styl-textu-cislice: tnum;
  --bw-styl-textu-nadpis-proklad: 0.06em;
  --bw-styl-textu-nadpis-verzalky: uppercase;
  --bw-text-rezerva-preklad: 1.4;
  --bw-tlacitko-deska: none;
  --bw-tlacitko-primarni: none;
  --bw-tlacitko-rozkaz: none;
  --bw-tlacitko-zalozka: none;
  --bw-velikost-cil-min: 48px;
  --bw-velikost-fokus-obrys: 3px;
  --bw-velikost-nadpis1: 48px;
  --bw-velikost-nadpis2: 36px;
  --bw-velikost-nadpis3: 28px;
  --bw-velikost-popisek: 20px;
  --bw-velikost-text: 22px;
  --bw-velikost-titul: 72px;
  --bw-velikost-udaj: 24px;
}

/* Společný základ webu série Bohemia Wars: černá lišta se zlatou kapitálou, malovaný obraz, pergamen se starou mapou,
   krvavě červené nadpisy. Paletu a obraz dílu doplňuje tema.css v adresáři dílu. Bez JavaScriptu. */
@font-face {
  font-family: "Alegreya";
  src: url("/pisma/alegreya-var.woff2?v=6899b8e90e") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Grenze";
  src: url("/pisma/grenze-var.woff2?v=75b83570a2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Barvy a písma jsou role sdíleného tématu (design/tema/vystup/tema-<díl>.css, sestavení ho předřadí).
     Tady jen zkratky a průsvitné odvozeniny. */
  --zlato-tenke: var(--bw-barva-zlato-ram-tenky);
  --linka: var(--bw-barva-linka-na-pergamenu);
  --zavoj: color-mix(in srgb, var(--bw-barva-pergamen-svetly) 55%, transparent);
  --sirka: 75rem;
  --okraj: clamp(1rem, 4vw, 3rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-text-na-pergamenu);
  font-family: var(--bw-pismo-kniha);
  font-size: 1.0625rem;
  line-height: 1.6;
  font-variant-numeric: oldstyle-nums proportional-nums;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { font-family: var(--bw-pismo-nadpis); line-height: var(--bw-radek-nadpis); text-wrap: balance; font-weight: 600; }
p { text-wrap: pretty; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--bw-barva-zlato-svetlo); outline-offset: 3px; }
.pergamen :focus-visible { outline-color: var(--bw-barva-krev-zaklad); }

.skryte {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.preskocit {
  position: absolute; left: 1rem; top: -4rem; z-index: 10;
  padding: 0.6rem 1rem; background: var(--bw-barva-zlato-ram); color: var(--bw-barva-podklad-nejtmavsi); font-weight: 700;
}
.preskocit:focus { top: 0.5rem; }

/* ---------- lišta ---------- */
.lista {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  padding: 0.85rem var(--okraj);
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-zlato-ram);
  border-bottom: 1px solid var(--zlato-tenke);
  box-shadow: 0 3px 0 color-mix(in srgb, var(--bw-barva-krev-zaklad) 55%, transparent);
  position: relative;
  z-index: 2;
}
.znak { flex: none; display: block; text-decoration: none; }
.znak img { height: 1.55rem; width: auto; }
.znak-text { font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.menu { flex: 1; min-width: 0; }
.menu ul {
  display: flex; justify-content: center; align-items: center;
  margin: 0; padding: 0; list-style: none;
}
.menu li { display: flex; align-items: center; }
/* Oddělovač mezi položkami: malý kosočtverec v červeni. Kříž ne, ten nesli křižáci. */
.menu li + li::before {
  content: "";
  flex: none;
  width: 0.32rem; height: 0.32rem;
  margin: 0 1rem;
  background: var(--bw-barva-krev-svetla);
  transform: rotate(45deg);
}
.menu a {
  display: block;
  padding: 0.35rem 0;
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--bw-barva-zlato-ram);
  white-space: nowrap;
}
.menu a:hover { color: var(--bw-barva-zlato-svetlo); }
.menu a[aria-current="page"] {
  color: var(--bw-barva-zlato-svetlo);
  text-decoration: underline 1px;
  text-underline-offset: 0.45em;
}
.jazyk { flex: none; display: flex; align-items: center; gap: 0; font-size: 0.9rem; letter-spacing: 0.08em; }
.jazyk > * + * { border-left: 1px solid var(--zlato-tenke); }
.jazyk a { color: var(--bw-barva-zlato-ram); text-decoration: none; }
.jazyk a, .jazyk [aria-current] { display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; min-height: 2.75rem; }
.jazyk a:hover { color: var(--bw-barva-zlato-svetlo); text-decoration: underline 1px; text-underline-offset: 0.3em; }
.jazyk [aria-current] { color: var(--bw-barva-text-na-tmavem); }

/* ---------- tlačítka: hranatá, s vnitřní linkou jako rám ---------- */
.tlacitko {
  display: inline-block;
  padding: 0.85rem 1.55rem 0.8rem;
  font-weight: 700;
  font-size: 0.95rem;
  line-height: 1.2;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
}
.tlacitko-plne {
  background: var(--bw-barva-zlato-ram);
  color: var(--bw-barva-podklad-nejtmavsi);
  box-shadow: inset 0 0 0 3px var(--bw-barva-zlato-ram), inset 0 0 0 4px color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 60%, transparent);
}
.tlacitko-plne:hover { background: var(--bw-barva-zlato-svetlo); box-shadow: inset 0 0 0 3px var(--bw-barva-zlato-svetlo), inset 0 0 0 4px color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 60%, transparent); }
.tlacitko-obrys {
  background: color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 55%, transparent);
  color: var(--bw-barva-zlato-svetlo);
  box-shadow: inset 0 0 0 1px var(--bw-barva-zlato-ram), inset 0 0 0 4px color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 0%, transparent), inset 0 0 0 5px var(--zlato-tenke);
}
.tlacitko-obrys:hover { background: color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 85%, transparent); }
.tlacitko-cervene {
  background: var(--bw-barva-krev-zaklad);
  color: var(--bw-barva-zlato-svetlo);
  box-shadow: inset 0 0 0 1px var(--bw-barva-zlato-ram), inset 0 0 0 3px var(--bw-barva-krev-zaklad), inset 0 0 0 4px var(--zlato-tenke);
}
.tlacitko-cervene:hover { background: var(--bw-barva-krev-svetla); box-shadow: inset 0 0 0 1px var(--bw-barva-zlato-ram), inset 0 0 0 3px var(--bw-barva-krev-svetla), inset 0 0 0 4px var(--zlato-tenke); }
.lista-vyzva { flex: none; padding: 0.6rem 1.1rem 0.55rem; font-size: 0.85rem; }

/* ---------- obraz na titulní stránce ---------- */
.hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: clamp(32rem, min(76vh, 41.667vw), 48rem); /* na širokých obrazovkách celý obraz 2,4 : 1 */
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-text-na-tmavem);
  overflow: hidden;
  border-bottom: 1px solid var(--zlato-tenke);
}
.hero-obraz, .hero-obraz img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-obraz img { object-fit: cover; object-position: var(--hero-ohnisko, 62% 50%); }
.hero::after {
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 94%, transparent) 0%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 78%, transparent) 28%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 20%, transparent) 55%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 0%, transparent) 70%),
    linear-gradient(0deg, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 55%, transparent) 0%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 0%, transparent) 22%);
}
.hero-obsah {
  position: relative; z-index: 1;
  width: min(100%, 38rem);
  padding: 3rem var(--okraj) 3.5rem clamp(1rem, 6vw, 6rem);
}
.hero-logo { margin: 0; }
.hero-logo img { width: min(100%, 31rem); }
.nahradni { display: block; color: var(--bw-barva-zlato-ram); font-size: clamp(2.6rem, 6vw, 4.4rem); letter-spacing: 0.04em; text-transform: uppercase; line-height: 1; }
.nahradni .rok { display: block; font-size: 0.45em; margin-top: 0.4rem; color: var(--bw-barva-zlato-svetlo); }
.motto {
  margin: 1.7rem 0 0;
  padding-top: 1.1rem;
  max-width: 30rem;
  border-top: 1px solid var(--zlato-tenke);
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.45;
  text-transform: uppercase;
  color: var(--bw-barva-text-na-tmavem);
}
.motto span { display: block; }
.hero-veta { margin: 0.9rem 0 0; max-width: 30rem; font-size: 1.1rem; color: var(--bw-barva-text-na-tmavem); }
.hero-popisek {
  position: absolute; right: var(--okraj); bottom: 0.6rem; z-index: 1;
  margin: 0; font-size: 0.8rem; color: color-mix(in srgb, var(--bw-barva-text-na-tmavem) 75%, transparent);
}
.tlacitka { display: flex; flex-wrap: wrap; gap: 0.9rem; margin: 2rem 0 0; }

/* ---------- pergamen se starou mapou ---------- */
.pergamen {
  background-color: var(--bw-barva-pergamen-zaklad);
  background-image: linear-gradient(var(--zavoj), var(--zavoj)), url("/obrazy/pergamen-mapa-dlazba-1100.webp?v=82496e8b89");
  background-image: linear-gradient(var(--zavoj), var(--zavoj)),
    image-set(url("/obrazy/pergamen-mapa-dlazba-1100.avif?v=272275cae5") type("image/avif"), url("/obrazy/pergamen-mapa-dlazba-1100.webp?v=82496e8b89") type("image/webp"));
  background-size: auto, 1100px auto;
  color: var(--bw-barva-text-na-pergamenu);
}
.pergamen a:where(:not(.tlacitko)) { color: var(--bw-barva-krev-zaklad); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.pergamen a:where(:not(.tlacitko):hover) { color: var(--bw-barva-text-na-pergamenu); }

.pas { padding: clamp(2rem, 5vw, 3.5rem) var(--okraj) clamp(2.5rem, 6vw, 4.5rem); }
.pas > * { max-width: var(--sirka); margin-inline: auto; }

.dlazdice {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2.5vw, 2rem);
  margin: 0 auto; padding: 0; list-style: none;
}
.dlazdice a {
  display: flex; flex-direction: column; height: 100%;
  padding: 0.45rem;
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-text-na-tmavem);
  text-decoration: none;
  outline: 1px solid var(--zlato-tenke);
  outline-offset: -0.3rem;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--bw-barva-text-na-pergamenu) 60%, transparent), 0 0.6rem 1.2rem -0.6rem color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 55%, transparent);
}
.dlazdice img { width: 100%; aspect-ratio: 1.7; object-fit: cover; }
.dlazdice-nadpis {
  display: block;
  margin: 0.15rem 0.3rem 0;
  padding: 0.75rem 0.5rem 0.45rem;
  border-top: 1px solid var(--zlato-tenke);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  color: var(--bw-barva-zlato-ram);
}
.dlazdice-text { display: block; padding: 0 0.8rem 0.85rem; font-size: 0.98rem; line-height: 1.45; text-align: center; }
.dlazdice a:hover .dlazdice-nadpis { color: var(--bw-barva-zlato-svetlo); }
.dlazdice a:hover img { filter: brightness(1.08) saturate(1.05); }
.pergamen .dlazdice a:focus-visible { outline: 2px solid var(--bw-barva-krev-zaklad); outline-offset: 3px; }

.uvod { max-width: 46rem !important; margin-top: clamp(2.5rem, 6vw, 4rem); text-align: center; }
.hacek { margin: 0 0 1rem; font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 700; line-height: 1.15; color: var(--bw-barva-krev-zaklad); text-wrap: balance; }
.uvod .hlavni { margin: 0; font-size: 1.2rem; }

.pilire {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: 1.5rem clamp(1.5rem, 4vw, 3rem);
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
  padding-top: 2rem;
  border-top: 1px solid var(--linka);
}
.pilir h2 { margin: 0.2rem 0 0.6rem; font-size: 1.4rem; color: var(--bw-barva-text-na-pergamenu); }
.pilir p { margin: 0; }
.pilir-okraj { color: var(--bw-barva-krev-zaklad); font-weight: 600; }
.pilir .cislo { font-variant-numeric: lining-nums; margin-right: 0.35rem; }

.kronika-pas {
  padding: clamp(2.5rem, 6vw, 4.5rem) var(--okraj);
  background: var(--bw-barva-podklad-tmavy);
  color: var(--bw-barva-text-na-tmavem);
  border-block: 1px solid var(--zlato-tenke);
}
.kronika { max-width: 44rem; margin: 0 auto; text-align: center; }
.kronika blockquote { margin: 0; }
.kronika blockquote p { margin: 0; font-size: clamp(1.3rem, 2.6vw, 1.75rem); line-height: 1.4; }
.kronika blockquote p::before { content: "„"; color: var(--bw-barva-krev-svetla); }
.kronika blockquote p::after { content: "“"; color: var(--bw-barva-krev-svetla); }
:lang(en) .kronika blockquote p::before { content: "“"; }
:lang(en) .kronika blockquote p::after { content: "”"; }
.kronika figcaption { margin-top: 1rem; color: var(--bw-barva-zlato-ram); letter-spacing: 0.04em; }

.stav-pas { padding: 1.6rem var(--okraj); }
.stav { max-width: 46rem; margin: 0 auto; text-align: center; color: var(--bw-barva-text-na-pergamenu-tlumeny); }

/* ---------- blok série a pata ---------- */
.serie { padding: clamp(2rem, 5vw, 3rem) var(--okraj); background: var(--bw-barva-podklad-nejtmavsi); color: var(--bw-barva-text-na-tmavem); border-top: 3px solid var(--bw-barva-krev-zaklad); }
.serie-vnitrek { max-width: 46rem; margin: 0 auto; }
.serie h2 { margin: 0 0 0.5rem; font-size: 1.25rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--bw-barva-zlato-ram); }
.serie p { margin: 0; }
.sagy { margin: 1rem 0 0; padding: 0; list-style: none; }
.saga { padding: 0.45rem 0; border-top: 1px solid color-mix(in srgb, var(--bw-barva-zlato-ram) 20%, transparent); }
.saga-rok { display: inline-block; min-width: 3.4rem; color: var(--bw-barva-zlato-ram); font-weight: 700; font-variant-numeric: lining-nums; }
.saga a { color: var(--bw-barva-zlato-svetlo); }
.saga a[aria-current] { text-decoration: none; }
.saga-stav, .saga-plan { margin-left: 0.6rem; color: var(--bw-barva-text-na-tmavem-tlumeny); }

.pata {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 2rem;
  padding: 1.5rem var(--okraj);
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-text-na-tmavem-tlumeny);
  font-size: 0.92rem;
  border-top: 1px solid var(--zlato-tenke);
}
.pata p { margin: 0; }

/* ---------- podstránky ---------- */
.zahlavi {
  position: relative;
  display: grid;
  align-items: end;
  min-height: clamp(15rem, 30vw, 25rem);
  background: var(--bw-barva-podklad-nejtmavsi);
  color: var(--bw-barva-text-na-tmavem);
  overflow: hidden;
  border-bottom: 1px solid var(--zlato-tenke);
}
.zahlavi-obraz, .zahlavi-obraz img { position: absolute; inset: 0; width: 100%; height: 100%; }
.zahlavi-obraz img { object-fit: cover; }
.zahlavi::after {
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(0deg, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 90%, transparent) 0%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 45%, transparent) 45%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 5%, transparent) 100%),
    linear-gradient(90deg, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 55%, transparent) 0%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 0%, transparent) 60%);
}
.zahlavi-text { position: relative; z-index: 1; width: min(100%, 52rem); padding: 2rem var(--okraj) 1.8rem clamp(1rem, 6vw, 6rem); }
.zahlavi h1 {
  margin: 0;
  font-size: clamp(2.1rem, 5vw, 3.5rem);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bw-barva-zlato-ram);
}
.perex { margin: 0.7rem 0 0; max-width: 40rem; font-size: clamp(1.05rem, 1.6vw, 1.25rem); color: var(--bw-barva-text-na-tmavem); }

.obsah-stranky { padding: clamp(2rem, 5vw, 4rem) var(--okraj) clamp(3rem, 7vw, 5rem); overflow-x: clip; }
.sloupec { max-width: 42rem; margin: 0 auto; }
.oddil + .oddil { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.oddil h2 {
  margin: 0 0 1rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--linka);
  font-size: clamp(1.5rem, 2.6vw, 1.85rem);
  color: var(--bw-barva-krev-zaklad);
}
.oddil > p { margin: 0 0 1rem; }

.seznam { margin: 1.25rem 0 0; padding: 0; list-style: none; }
.seznam li { padding: 0.85rem 0; border-top: 1px solid var(--linka); }
.seznam li:last-child { border-bottom: 1px solid var(--linka); }
.seznam h3 { margin: 0 0 0.25rem; font-size: 1.15rem; color: var(--bw-barva-text-na-pergamenu); }
.seznam p { margin: 0; }
.seznam .meta, .zprava .meta { color: var(--bw-barva-krev-zaklad); font-weight: 700; font-variant-numeric: lining-nums tabular-nums; }
@media (min-width: 46rem) {
  .seznam-meta li { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); column-gap: 1.5rem; }
  .seznam-meta li > * { grid-column: 2; }
  .seznam-meta li > .meta { grid-column: 1; grid-row: 1 / span 2; }
}

.galerie {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
  gap: 1.75rem 1.5rem;
  margin: 1.5rem calc(50% - min(35rem, 50vw - var(--okraj))) 0;
  padding: 0; list-style: none;
}
.galerie figure { margin: 0; }
.galerie img { width: 100%; aspect-ratio: 1.6; object-fit: cover; }
.galerie a { display: block; padding: 0.4rem; background: var(--bw-barva-podklad-nejtmavsi); outline: 1px solid var(--zlato-tenke); outline-offset: -0.25rem; }
.galerie figcaption { margin-top: 0.55rem; font-size: 0.95rem; line-height: 1.45; color: var(--bw-barva-text-na-pergamenu-tlumeny); }
.poznamka { margin: 2.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--linka); font-size: 0.95rem; color: var(--bw-barva-text-na-pergamenu-tlumeny); }

.kanal { margin: 0 0 2rem; }
.zprava + .zprava { margin-top: 2.5rem; }
.zprava { padding-top: 1rem; border-top: 1px solid var(--linka); }
.zprava .meta { margin: 0 0 0.3rem; }
.zprava h2 { margin: 0 0 0.8rem; font-size: 1.6rem; color: var(--bw-barva-text-na-pergamenu); }

.nenalezeno + .nenalezeno { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--linka); }
.nenalezeno-text { margin: 0 0 0.4rem; font-size: 1.25rem; }

/* ---------- šířky ---------- */
/* ---------- bloky podstránek: rám, Svět s mapou, časový pás, Frakce, Hra ---------- */
/* Rám z ozdoby (dvě linky a kosočtverce v rozích, barvy dosadí build z tématu). */
.ram { border: 14px solid transparent; border-image: url("/ozdoby/ram.svg?v=3627ae96e5") 16 stretch; }
.predel { position: relative; display: block; width: min(22rem, 70%); height: 0.8rem; margin: 0.7rem auto 0.8rem;
  background: linear-gradient(var(--bw-barva-krev-zaklad), var(--bw-barva-krev-zaklad)) left center / calc(50% - 1rem) 1px no-repeat,
    linear-gradient(var(--bw-barva-krev-zaklad), var(--bw-barva-krev-zaklad)) right center / calc(50% - 1rem) 1px no-repeat; }
.predel::after { content: ""; position: absolute; left: 50%; top: 50%; width: 0.55rem; height: 0.55rem; background: var(--bw-barva-krev-zaklad); transform: translate(-50%, -50%) rotate(45deg); }

/* Svět: panel | mapa | Tábor */
.svet { padding: clamp(1.25rem, 3vw, 2.25rem) var(--okraj); background: var(--bw-barva-podklad-nejtmavsi); color: var(--bw-barva-text-na-tmavem); }
.svet-mrizka { display: grid; grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr) minmax(14rem, 17rem); gap: clamp(1rem, 1.8vw, 1.5rem); align-items: start; max-width: 86rem; margin: 0 auto; }
.svet-panel, .svet-bok { background: var(--bw-barva-podklad-tmavy); padding: 1.2rem 1.1rem 1.3rem; }
.svet-panel h2 { margin: 0; font-size: clamp(1.9rem, 2.6vw, 2.4rem); letter-spacing: 0.04em; text-transform: uppercase; color: var(--bw-barva-text-nadpis-zlaty); }
.podnadpis { margin: 0.35rem 0 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--zlato-tenke); font-family: var(--bw-pismo-nadpis); font-size: 1.15rem; letter-spacing: 0.18em; color: var(--bw-barva-zlato-ram); }
.svet-panel p, .svet-bok p { margin: 0 0 0.9rem; line-height: 1.5; }
.svet-odkazy { display: grid; gap: 0.7rem; margin-top: 1.4rem !important; }
.svet-odkazy .tlacitko, .svet-bok .tlacitko { display: block; padding: 0.75rem 0.9rem 0.7rem; font-size: 0.85rem; }
.svet .tlacitko-obrys { color: var(--bw-barva-zlato-svetlo); box-shadow: inset 0 0 0 1px var(--bw-barva-zlato-ram); }
.svet-mapa { margin: 0; background: var(--bw-barva-podklad-panel); }
.mapa-svg { display: block; width: 100%; height: auto; }
.svet-mapa figcaption { padding: 0.75rem 0.35rem 0.1rem; font-size: 0.92rem; line-height: 1.45; color: var(--bw-barva-text-na-tmavem-tlumeny); }
.mapa-legenda { display: flex; flex-wrap: wrap; gap: 0.35rem 1.4rem; margin: 0; padding: 0; list-style: none; color: var(--bw-barva-text-na-tmavem); }
.mapa-legenda li { display: flex; align-items: center; gap: 0.45rem; }
.legenda-znak { flex: none; width: 1.35rem; height: 1.35rem; }
.mapa-poznamka { margin: 0.45rem 0 0; }
.svet-bok img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.svet-bok h2 { margin: 0.9rem 0 0.55rem; font-size: 1.5rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--bw-barva-text-nadpis-zlaty); }

/* Mapa: velikosti písma v jednotkách mapy (šířka 1007), barvy z rolí mapy a pergamenu. */
.m-okoli { fill: color-mix(in srgb, var(--bw-barva-mapa-papir) 70%, var(--bw-barva-drevo-stredni)); }
.m-srafa { stroke: var(--bw-barva-drevo-tmave); stroke-width: 1; opacity: 0.16; }
.m-zeme { fill: color-mix(in srgb, var(--bw-barva-mapa-papir) 55%, var(--bw-barva-pergamen-svetly)); }
.m-lem { fill: none; stroke: var(--bw-barva-krev-zaklad); stroke-width: 28; opacity: 0.13; }
.m-kopce { fill: none; stroke: var(--bw-barva-mapa-vrstevnice); stroke-width: 1.6; stroke-linejoin: round; opacity: 0.5; }
.m-reka { fill: none; stroke: var(--bw-barva-mapa-voda); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.m-reka-hlavni { stroke-width: 3.8; }
.m-hranice-pas { fill: none; stroke: var(--bw-barva-krev-zaklad); stroke-width: 7; opacity: 0.3; }
.m-hranice { fill: none; stroke: var(--bw-barva-krev-tmava); stroke-width: 2; stroke-dasharray: 10 4 2 4; }
.mapa-svg text { paint-order: stroke; stroke-linejoin: round; }
.m-zeme-popisek { font: italic 22px var(--bw-pismo-kniha); letter-spacing: 0.2em; text-transform: uppercase; fill: var(--bw-barva-text-na-pergamenu-tlumeny); }
.m-uvnitr { font-size: 16px; letter-spacing: 0.14em; }
.m-reka-popisek { font: italic 20px var(--bw-pismo-kniha); fill: var(--bw-barva-mapa-voda-hrana); stroke: var(--bw-barva-pergamen-svetly); stroke-width: 4px; }
.m-popisek { font: 600 25px var(--bw-pismo-nadpis); letter-spacing: 0.02em; fill: var(--bw-barva-text-na-pergamenu); stroke: var(--bw-barva-pergamen-svetly); stroke-width: 5px; }
.m-hlavni { font-size: 30px; letter-spacing: 0.08em; text-transform: uppercase; }
.m-popisek-bitva { font: italic 600 22px var(--bw-pismo-kniha); fill: var(--bw-barva-krev-tmava); }
.m-rok { font-style: normal; font-weight: 400; }
.m-popisek-mimo { font-weight: 400; fill: var(--bw-barva-text-na-pergamenu-tlumeny); }
.m-mesto { stroke: var(--bw-barva-pergamen-svetly); stroke-width: 3; }
.m-husitske { fill: var(--bw-barva-krev-zaklad); }
.m-katolicke { fill: var(--bw-barva-podklad-tmavy); }
.m-mimo { fill: none; stroke: var(--bw-barva-text-na-pergamenu-tlumeny); stroke-width: 2.5; }
.m-jadro { fill: var(--bw-barva-pergamen-svetly); }
.m-mece-halo { fill: none; stroke: var(--bw-barva-pergamen-svetly); stroke-width: 7; stroke-linecap: round; }
.m-mece { fill: none; stroke: var(--bw-barva-krev-tmava); stroke-width: 3; stroke-linecap: round; }
.legenda-znak .m-mece { stroke: var(--bw-barva-krev-zaklad); }
.m-vodici { fill: none; stroke: var(--bw-barva-krev-tmava); stroke-width: 1.5; stroke-dasharray: 3 3; }
.m-bod { fill: var(--bw-barva-krev-tmava); }
.m-ruzice-svetla { fill: var(--bw-barva-pergamen-svetly); stroke: var(--bw-barva-text-na-pergamenu); stroke-width: 1.5; stroke-linejoin: round; }
.m-ruzice-tmava { fill: var(--bw-barva-text-na-pergamenu); }
.m-sever { font: 600 24px var(--bw-pismo-nadpis); fill: var(--bw-barva-text-na-pergamenu); }
.m-meritko-tmava { fill: var(--bw-barva-text-na-pergamenu); }
.m-meritko-svetla { fill: var(--bw-barva-pergamen-svetly); }
.m-meritko-ram { fill: none; stroke: var(--bw-barva-text-na-pergamenu); stroke-width: 1.5; }
.m-meritko-text { font: 18px var(--bw-pismo-kniha); fill: var(--bw-barva-text-na-pergamenu); }

/* Časový pás: kosočtverce na lince, rok dílu zvýrazněný */
.osa-pas { display: grid; grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr); gap: 1.5rem; align-items: center;
  padding: 1.5rem max(var(--okraj), calc((100% - 86rem) / 2)) 1.7rem; background: var(--bw-barva-podklad-tmavy); color: var(--bw-barva-text-na-tmavem);
  border-block: 1px solid var(--zlato-tenke); }
.osa-pas h2 { margin: 0; padding-right: 1.5rem; border-right: 1px solid var(--zlato-tenke); font-size: 1.25rem; letter-spacing: 0.1em; text-transform: uppercase; text-align: center; color: var(--bw-barva-zlato-ram); }
.osa-pas-roky { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin: 0; padding: 0; list-style: none; text-align: center; }
.osa-pas-roky::before { content: ""; position: absolute; left: 0; right: 0; top: 2.3rem; border-top: 1px solid var(--zlato-tenke); }
.osa-pas-roky li { position: relative; padding: 0 0.4rem; }
.osa-pas-roky li::after { content: ""; position: absolute; top: 2.3rem; left: 50%; width: 0.6rem; height: 0.6rem; background: var(--bw-barva-podklad-tmavy); border: 1px solid var(--bw-barva-zlato-ram); transform: translate(-50%, -50%) rotate(45deg); }
.osa-pas-rok { display: block; font-family: var(--bw-pismo-nadpis); font-size: 1.55rem; font-weight: 600; line-height: 1.2; color: var(--bw-barva-text-nadpis-zlaty); font-variant-numeric: lining-nums; }
.osa-pas-text { display: block; margin-top: 1.3rem; font-style: italic; font-size: 0.95rem; line-height: 1.35; color: var(--bw-barva-text-na-tmavem-tlumeny); }
.osa-pas-roky .osa-pas-dil::after { width: 0.8rem; height: 0.8rem; background: var(--bw-barva-krev-svetla); border-color: var(--bw-barva-zlato-svetlo); }
.osa-pas-dil .osa-pas-rok { color: var(--bw-barva-text-na-tmavem); }

/* Frakce: nadpis na pergamenu, obraz vpravo vybledlý do pergamenu, karty s pečetí */
.zahlavi-pergamen { position: relative; overflow: hidden; padding: clamp(2.5rem, 6vw, 4.5rem) var(--okraj) clamp(1.25rem, 3vw, 2.25rem); text-align: center; }
.zahlavi-pergamen-obraz { position: absolute; top: 0; right: 0; width: 55%; height: 100%; mix-blend-mode: multiply; opacity: 0.85;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 60%), linear-gradient(0deg, transparent 0%, #000 50%); -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 60%), linear-gradient(0deg, transparent 0%, #000 50%); mask-composite: intersect; }
.zahlavi-pergamen-obraz img { width: 100%; height: 100%; object-fit: cover; filter: sepia(0.3) saturate(0.85); }
.zahlavi-pergamen-text { position: relative; z-index: 1; max-width: 46rem; margin: 0 auto; }
.zahlavi-pergamen h1 { margin: 0; font-size: clamp(2.4rem, 5.5vw, 4rem); letter-spacing: 0.06em; text-transform: uppercase; color: var(--bw-barva-krev-tmava); text-shadow: 0 0 0.9rem var(--bw-barva-pergamen-svetly); }
.podtitul { margin: 0; font-family: var(--bw-pismo-nadpis); font-size: clamp(1.1rem, 1.9vw, 1.4rem); letter-spacing: 0.18em; color: var(--bw-barva-text-na-pergamenu); }
.zahlavi-pergamen .perex { margin: 0.9rem auto 0; color: var(--bw-barva-text-na-pergamenu); }
.karty-pas { padding: clamp(0.75rem, 2vw, 1.5rem) var(--okraj) clamp(1rem, 3vw, 2rem); }
.karty { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.4vw, 2rem); max-width: var(--sirka); margin: 0 auto; padding: 0; list-style: none; }
.karta { display: flex; flex-direction: column; background: var(--bw-barva-pergamen-svetly); text-align: center;
  box-shadow: 0 0.6rem 1.4rem color-mix(in srgb, var(--bw-barva-drevo-tmave) 28%, transparent); }
.karta-obraz { position: relative; }
.karta-obraz img { width: 100%; aspect-ratio: 1.6; object-fit: cover; }
.pecet { position: absolute; left: 0.2rem; bottom: -2.6rem; width: 4.4rem; height: auto; filter: drop-shadow(0 2px 2px color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 45%, transparent)); }
.pecet-vosk { fill: var(--bw-barva-krev-zaklad); stroke: var(--bw-barva-krev-tmava); stroke-width: 2; }
.pecet-stuha { fill: var(--bw-barva-krev-tmava); }
.pecet-kruh { fill: none; stroke: var(--bw-barva-krev-tmava); stroke-width: 2; }
.pecet-svetlo { fill: var(--bw-barva-krev-svetla); }
.pecet-otisk { fill: var(--bw-barva-krev-tmava); }
.karta h2 { margin: 1.3rem 1rem 0 4.4rem; font-size: clamp(1.4rem, 2.1vw, 1.75rem); letter-spacing: 0.05em; text-transform: uppercase; color: var(--bw-barva-krev-zaklad); }
.karta .predel { width: 9rem; margin: 0.5rem auto 0.8rem; }
.karta p { margin: 0 1.1rem 1rem; line-height: 1.5; }
.karta-tlacitko { margin-top: auto !important; padding-bottom: 0.5rem; }
.karta-tlacitko .tlacitko { padding: 0.75rem 1.2rem 0.7rem; font-size: 0.88rem; }
.hratelna { max-width: 46rem; margin: clamp(1.5rem, 3vw, 2.2rem) auto 0; font-style: italic; font-size: 1.1rem; text-align: center; }

/* Hra: červená látka nahoře, postup vlevo přes obraz, vlastnosti, výzva */
.zahlavi-latka { position: relative; padding: clamp(1.6rem, 3.5vw, 2.6rem) var(--okraj) clamp(2.3rem, 4.5vw, 3.3rem); text-align: center;
  background-color: var(--bw-barva-krev-zaklad); color: var(--bw-barva-text-na-krvi);
  background-image: linear-gradient(color-mix(in srgb, var(--bw-barva-krev-tmava) 30%, transparent), color-mix(in srgb, var(--bw-barva-krev-tmava) 0%, transparent)), url("/obrazy/latka-cervena-dlazba-800.webp?v=e981fc13ea");
  background-image: linear-gradient(color-mix(in srgb, var(--bw-barva-krev-tmava) 30%, transparent), color-mix(in srgb, var(--bw-barva-krev-tmava) 0%, transparent)),
    image-set(url("/obrazy/latka-cervena-dlazba-800.avif?v=5512e81f3a") type("image/avif"), url("/obrazy/latka-cervena-dlazba-800.webp?v=e981fc13ea") type("image/webp"));
  background-size: auto, 800px auto; }
.zahlavi-latka::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1.1rem; background: url("/ozdoby/trhlina.svg?v=fcd0b4cab0") left bottom / 30rem 100% repeat-x; }
.zahlavi-latka h1 { margin: 0; font-size: clamp(2.1rem, 5vw, 3.6rem); letter-spacing: 0.06em; text-transform: uppercase; text-shadow: 0 2px 0 var(--bw-barva-krev-tmava); }
.zahlavi-latka .perex { margin: 0.6rem auto 0; color: var(--bw-barva-text-na-krvi); }
.hra-pas { padding: 0 var(--okraj) clamp(2.5rem, 5vw, 4rem); background: var(--bw-barva-podklad-nejtmavsi); color: var(--bw-barva-text-na-tmavem); }
.hra-mrizka { display: grid; grid-template-columns: minmax(18rem, 24rem) minmax(0, 1fr); max-width: 86rem; margin: 0 auto; }
.hra-obraz { grid-column: 2; grid-row: 1; margin: 0 calc(-1 * var(--okraj)) 0 0; }
.hra-obraz picture, .hra-obraz img { width: 100%; height: 100%; }
.hra-obraz img { min-height: 32rem; object-fit: cover; }
.postup { grid-column: 1; grid-row: 1; position: relative; z-index: 1; align-self: start; margin: 1.5rem -2.5rem 1.5rem 0; padding: 1rem 1rem 0.4rem; background: var(--bw-barva-podklad-tmavy); }
.postup h2 { margin: 0 0 0.3rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--zlato-tenke); font-size: 1.3rem; letter-spacing: 0.1em; text-transform: uppercase; text-align: center; color: var(--bw-barva-text-nadpis-zlaty); }
.kroky { margin: 0; padding: 0; list-style: none; }
.krok { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 0.85rem; align-items: start; padding: 0.8rem 0; }
.krok + .krok { border-top: 1px solid var(--zlato-tenke); }
.krok img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; outline: 1px solid var(--zlato-tenke); outline-offset: 2px; }
.krok h3 { margin: 0 0 0.3rem; font-size: 1.2rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--bw-barva-text-nadpis-zlaty); }
.krok p { margin: 0; font-size: 0.95rem; line-height: 1.45; }
.vlastnosti { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 86rem; margin: 0 auto; padding: 1.5rem 0; list-style: none; border-bottom: 1px solid var(--zlato-tenke); }
.vlastnosti li { padding: 0.2rem 1.2rem; text-align: center; }
.vlastnosti li + li { border-left: 1px solid var(--zlato-tenke); }
.ikona { display: block; width: 3rem; height: 3rem; margin: 0 auto 0.5rem; fill: none; stroke: var(--bw-barva-zlato-ram); stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.vlastnosti h3 { margin: 0 0 0.35rem; font-size: 1.25rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bw-barva-text-nadpis-zlaty); }
.vlastnosti p { margin: 0; font-style: italic; font-size: 0.95rem; line-height: 1.45; color: var(--bw-barva-text-na-tmavem-tlumeny); }
.vyzva { display: flex; align-items: center; gap: 1.2rem; max-width: 52rem; margin: 2rem auto 0; }
.vyzva::before, .vyzva::after { content: ""; flex: 1; border-top: 1px solid var(--zlato-tenke); }
.vyzva .tlacitko { padding: 1rem 2.2rem 0.95rem; font-size: 1.05rem; }

@media (max-width: 78rem) {
  .svet-mrizka { grid-template-columns: minmax(14rem, 17rem) minmax(0, 1fr); }
  .svet-bok { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); gap: 0 1.4rem; align-items: start; }
  .svet-bok picture { grid-row: 1 / span 3; }
  .svet-bok h2 { margin-top: 0; }
  .svet-bok .tlacitko { display: inline-block; }
}
@media (max-width: 60rem) {
  .svet-mrizka { grid-template-columns: minmax(0, 1fr); }
  .osa-pas { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .osa-pas h2 { padding: 0 0 0.7rem; border-right: 0; border-bottom: 1px solid var(--zlato-tenke); }
  .osa-pas-roky { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; text-align: left; }
  .osa-pas-roky::before { top: 0.5rem; bottom: 0.5rem; left: 0.3rem; right: auto; border-top: 0; border-left: 1px solid var(--zlato-tenke); }
  .osa-pas-roky li { display: grid; grid-template-columns: 4rem minmax(0, 1fr); align-items: baseline; padding-left: 1.6rem; }
  .osa-pas-roky li::after { top: 0.85rem; left: 0.3rem; }
  .osa-pas-text { margin-top: 0; }
}
@media (max-width: 52rem) {
  .karty { grid-template-columns: minmax(0, 1fr); max-width: 30rem; }
  .hra-mrizka { grid-template-columns: minmax(0, 1fr); }
  .hra-obraz { grid-column: 1; margin: 0 calc(-1 * var(--okraj)); }
  .hra-obraz img { min-height: 0; aspect-ratio: 1.25; }
  .postup { grid-row: 2; margin: -2.5rem 0 0; }
  .vlastnosti { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem 0; }
  .vlastnosti li:nth-child(odd) { border-left: 0; }
}
@media (max-width: 40rem) {
  .ram { border-width: 10px; }
  .svet-bok { display: block; }
  .svet-bok .tlacitko { display: block; }
  .m-popisek { font-size: 34px; }
  .m-hlavni { font-size: 38px; }
  .m-popisek-bitva { font-size: 30px; }
  .m-zeme-popisek { font-size: 27px; letter-spacing: 0.1em; }
  .m-uvnitr, .m-reka-popisek { display: none; }
  .zahlavi-pergamen-obraz { width: 100%; opacity: 0.4; }
  .krok { grid-template-columns: 6.5rem minmax(0, 1fr); gap: 0.7rem; }
  .vyzva .tlacitko { padding-inline: 1.2rem; }
}

@media (max-width: 78rem) {
  .lista-vyzva { display: none; }
}
@media (max-width: 68rem) {
  .lista {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "znak jazyk" "menu menu";
    gap: 0.55rem 1rem;
    padding-bottom: 0.3rem;
  }
  .znak { grid-area: znak; }
  .jazyk { grid-area: jazyk; }
  .menu { grid-area: menu; }
  .menu ul { flex-wrap: wrap; justify-content: center; gap: 0 1.3rem; }
  .menu a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0; font-size: 1rem; letter-spacing: 0.05em; }
  .menu li + li::before { display: none; }
}
@media (max-width: 52rem) {
  .dlazdice { grid-template-columns: minmax(0, 1fr); max-width: 30rem !important; }
}
@media (max-width: 40rem) {
  body { font-size: 1.0625rem; }
  .znak img { height: 1.3rem; }
  .hero { display: block; min-height: 0; }
  .hero-obraz { display: block; position: relative; inset: auto; height: auto; aspect-ratio: 4 / 5; max-height: 36rem; }
  .hero-obraz img { object-position: var(--hero-ohnisko-tel, 50% 30%); }
  .hero::after { display: none; }
  .hero-obraz::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(0deg, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 100%, transparent) 0%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 60%, transparent) 12%, color-mix(in srgb, var(--bw-barva-podklad-nejtmavsi) 0%, transparent) 32%);
  }
  .hero-obsah { margin-top: -2.5rem; padding: 0 1rem 2.6rem; }
  .hero-veta { font-size: 1.02rem; }
  .hero-popisek { right: 1rem; top: 0.5rem; bottom: auto; font-size: 0.72rem; }
  .hero-logo img { width: min(100%, 20rem); }
  .motto { margin-top: 1.2rem; font-size: 1rem; letter-spacing: 0.08em; }
  .tlacitka { margin-top: 1.4rem; }
  .tlacitka .tlacitko { flex: 1 1 9rem; padding-inline: 0.7rem; letter-spacing: 0.06em; }
  .zahlavi { min-height: 13rem; }
  .zahlavi-text { padding: 1.5rem 1rem 1.3rem; }
}
@media (prefers-reduced-motion: no-preference) {
  .dlazdice img, .tlacitko { transition: filter 0.2s ease, background-color 0.2s ease; }
}