/* =========================================================
   site.css — vizuál mikroregionfrenstatsko.cz (vlny, sekce v4, podstránky).
   Tokeny palety jsou ve style.css.
   ========================================================= */

/* ---------- Fonty (self-hosted, latin + latin-ext) ---------- */
@font-face {
  font-family: "Crimson Pro";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/crimson-pro-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Crimson Pro";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/crimson-pro-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("../fonts/jost-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("../fonts/jost-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Page tokeny (jen v4) ---------- */
:root {
  --edge-h: clamp(56px, 7vw, 120px);   /* výška vlnové hrany — 4K strop 120px */
  --wave-gap: clamp(1.5rem, 3vw, 2.5rem);   /* vzduch mezi vlnou a obsahem — jednotně napříč webem */
  --radius: 14px;
  --radius-pill: 999px;
  --shadow-card: 0 18px 40px -18px rgba(18, 41, 31, .45);
  --shadow-tile: 0 0 0 1px var(--line), 0 18px 36px -26px rgba(18, 41, 31, .45);   /* karty aktualit a dlaždice zpráv */
  --shadow-tile-hover: 0 0 0 1px var(--line), 0 24px 44px -24px rgba(18, 41, 31, .5);
}


/* ---------- Základ (body je ve style.css) ---------- */
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ---------- Kicker (nadtitulek s linkou) ---------- */
.kicker {
  display: flex;
  align-items: center;
  gap: .9rem;
  margin: 0 0 1.25rem;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--forest-600);
}
.kicker::before {
  content: "";
  flex: none;
  width: 28px;
  height: 2px;
  background: var(--red-500);
}
.kicker--light { color: var(--white); }   /* .92 alfa na fotce hera = 4,2:1 (F-02) */

/* ---------- Tlačítka ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  min-height: var(--tap-min);   /* tap target 44 px (v4 měl 43) */
  padding: .95rem 1.7rem;
  border: 0;
  border-radius: var(--radius-pill);
  font: 500 .8rem/1 var(--font-sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s, color .2s, box-shadow .2s, transform .2s;
}
.btn:hover { transform: translateY(-1px); }
.btn__icon { flex: none; width: 16px; height: 16px; }
.btn__arrow { flex: none; width: 22px; height: 11px; transition: transform .2s; }
.btn:hover .btn__arrow { transform: translateX(3px); }

.btn--amber { background: var(--color-cta); color: var(--forest-900); box-shadow: 0 10px 24px -12px rgba(201, 125, 16, .8); }   /* tmavý text: bílá na amber = 2,4:1 (WCAG 1.4.3) */
.btn--amber:hover { background: var(--amber-400); }   /* ne amber-600 — tam má i tmavý text jen 4,3:1 */
.btn--green { background: var(--forest-700); color: var(--white); }
.btn--green:hover { background: var(--brand-green); }
.btn--ghost-light { color: var(--white); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7); }
.btn--ghost-light:hover { background: rgba(255, 255, 255, .12); }

/* =========================================================
   VLNOVÁ HRANA (.edge) — hlava / pata sekcí
   SVG přes celou šířku, pevná výška (4K pravidlo), symbol se natáhne
   (preserveAspectRatio="none" na <symbol>).
   .edge--in   = uvnitř sekce u spodku, fill = barva NÁSLEDUJÍCÍ sekce
   ========================================================= */
.edge {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: var(--edge-h);
  overflow: hidden;
  pointer-events: none;
}
.edge--in { bottom: -1px; z-index: 1; }

/* .edge--head / --foot = hrany pásu, vyčnívají ven do sousedních sekcí.
   fill = barva pásu; pata je symbol otočený o 180° (plocha nahoře, stuha dole). */
.edge--head { top: calc(1px - var(--edge-h)); }
.edge--foot { bottom: calc(1px - var(--edge-h)); transform: rotate(180deg); }


/* Vrstvy hrany ve spritu — dřív inline style= na <path>, CSP ho nepustí.
   Pravidla dokumentu se aplikují i na klon v <use>, proměnné se dědí z <use>. */
.edge__haze   { fill: var(--edge-haze, transparent); }
.edge__mat    { fill: var(--edge-mat, transparent); }
.edge__ribbon { fill: var(--edge-ribbon, transparent); }
.edge__fill   { fill: var(--edge-fill, transparent); }

/* ---------- Nadpis sekce ---------- */
.v4-h2 {
  margin: 0 0 1.25rem;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(2.2rem, 3.6vw, 3.25rem);
  line-height: 1.05;
  letter-spacing: -.005em;
  color: var(--color-heading);
}
.v4-h2--light { color: var(--cream-bg); }


/* =========================================================
   HERO — panorama, pata = krémová vlna se zelenou stuhou
   ========================================================= */
.v4-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: clamp(520px, 64vh, 760px);   /* FullHD: karty musí být vidět nad ohybem */
  overflow: hidden;
  background: var(--forest-900);
  isolation: isolate;

  /* hrana paty */
  --edge-haze:   rgba(223, 240, 230, .30);
  --edge-mat:    var(--cream-bg);
  --edge-ribbon: var(--brand-green);
  --edge-fill:   var(--cream-bg);
}
.v4-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 55%;
}
.v4-hero__shade {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(18, 41, 31, .74) 0%, rgba(18, 41, 31, .46) 36%, rgba(18, 41, 31, 0) 66%),
    linear-gradient(180deg, rgba(18, 41, 31, .28) 0%, rgba(18, 41, 31, 0) 28%);
}
.v4-hero__content {
  width: 100%;
  padding-top: clamp(2.5rem, 4.5vw, 4rem);
  padding-bottom: calc(var(--edge-h) + 8.5rem);   /* mezera tlačítka → karty = edge-h + 8.5rem − přesah karet */
  color: var(--white);
}
.v4-hero__title {
  margin: 0 0 1.5rem;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(2.8rem, 5.4vw, 5rem);
  line-height: 1.02;
  letter-spacing: -.01em;
  color: inherit;   /* bílá z .v4-hero__content; globální h1 má --color-heading */
  text-shadow: 0 2px 24px rgba(0, 0, 0, .18);
}
.v4-hero__accent { color: var(--forest-200); }
.v4-hero__squiggle {
  display: inline-block;
  width: .7em;
  height: .15em;
  margin-left: .2em;
  vertical-align: middle;
  color: var(--amber-400);
}
.v4-hero__lead {
  max-width: 34rem;
  margin: 0 0 2.25rem;
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  color: rgba(255, 255, 255, .9);
}
.v4-hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* =========================================================
   ROZCESTNÍK — karty přesahují patu hera
   ========================================================= */
.v4-intro {
  position: relative;
  z-index: 2;
  padding-bottom: var(--wave-gap);   /* hřeben vlny pásu má vlastní vzduch nad sebou */
}
.v4-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 2vw, 2rem);
  margin-top: calc(-1 * clamp(8rem, 13vw, 11rem));
}

.v4-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: clamp(300px, 22vw, 330px);   /* obdélník ~4:3 — na FullHD celá karta nad ohybem */
  overflow: hidden;
  border-radius: var(--radius);
  color: var(--white);
  text-decoration: none;
  background: var(--forest-800);
  box-shadow: var(--shadow-card);
  isolation: isolate;
  transition: transform .3s, box-shadow .3s;
}
.v4-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  /* F-02: pod textem karty závoj ≥ 70 % (kontrast 4,5:1 i na světlé fotce) */
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--forest-900) 0%, transparent) 20%,
    color-mix(in srgb, var(--forest-900) 70%, transparent) 50%,
    color-mix(in srgb, var(--forest-900) 92%, transparent) 100%);
}
.v4-card__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}
.v4-card__icon {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(250, 246, 238, .94);
  color: var(--forest-700);
  box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .5);
}
.v4-card__icon svg { width: 24px; height: 24px; }
.v4-card__body {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: 1.75rem;
}
.v4-card__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.6rem, 2vw, 1.9rem);
  line-height: 1.1;
}
.v4-card__text {
  font-size: .95rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, .82);
}
.v4-card__more {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: .85rem;
  font-size: .74rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--amber-400);
}
.v4-card__more svg { width: 22px; height: 11px; transition: transform .2s; }

.v4-card:hover, .v4-card:focus-visible { color: var(--white); transform: translateY(-4px); box-shadow: 0 26px 48px -20px rgba(18, 41, 31, .55); }
.v4-card:hover .v4-card__img, .v4-card:focus-visible .v4-card__img { transform: scale(1.05); }
.v4-card:hover .v4-card__more svg, .v4-card:focus-visible .v4-card__more svg { transform: translateX(4px); }

/* ---------- Pás statistik ---------- */
.v4-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: var(--wave-gap) 0 0;   /* stejný rytmus jako přechody u vln */
}
.v4-stats__item {
  display: flex;
  flex-direction: column-reverse;   /* číslo nad popiskem, v DOM dt → dd */
  align-items: center;
  gap: .6rem;
  padding: .5rem 1.5rem;
  text-align: center;
}
.v4-stats__item + .v4-stats__item { border-left: 1px solid var(--line); }
.v4-stats__num {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(2.6rem, 4vw, 3.5rem);
  line-height: 1;
  color: var(--forest-700);
}
.v4-stats__num small {
  font-size: .42em;
  color: var(--forest-700);   /* forest-500 na krému = 3,8:1 */
}
.v4-stats__label {
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

/* =========================================================
   ZELENÝ PÁS — hlava + pata se stuhou, uprostřed mapa
   ========================================================= */
.v4-band {
  position: relative;
  margin-block: var(--edge-h);          /* místo pro vyčnívající hrany */
  background: var(--forest-700);
  color: var(--cream-bg);
  isolation: isolate;

  --edge-haze:   rgba(185, 220, 199, .28);
  --edge-mat:    transparent;
  --edge-ribbon: var(--brand-green);
  --edge-fill:   var(--forest-700);
}
/* lesní textura — ke krajům se vytrácí, aby nebyl vidět šev s hranou */
.v4-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("../img/v4/forest-texture.webp") center / cover;
  opacity: .16;
  mix-blend-mode: luminosity;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 78%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 22%, #000 78%, transparent 100%);
}

.v4-region {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  padding-block: clamp(2.5rem, 5vw, 4.5rem);
}
.v4-region__lead {
  max-width: 34rem;
  margin: 0 0 1.75rem;
  color: rgba(250, 246, 238, .82);
}
.v4-region__list {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0 0 2.25rem;
  padding: 0;
  list-style: none;
}
.v4-region__list a {
  display: inline-flex;   /* tap target 44 px (v4 měl 35) */
  align-items: center;
  min-height: var(--tap-min);
  padding: .4rem .9rem;
  border-radius: var(--radius-pill);
  box-shadow: inset 0 0 0 1px rgba(250, 246, 238, .28);
  font-size: .85rem;
  color: var(--cream-bg);
  text-decoration: none;
  transition: background-color .2s, box-shadow .2s;
}
.v4-region__list a:hover { color: var(--cream-bg); background: rgba(250, 246, 238, .1); box-shadow: inset 0 0 0 1px rgba(250, 246, 238, .6); }

/* ---------- Mapa (obrys okresu = map.webp s průhledností) ---------- */
.map {
  position: relative;
  margin: 0;
  container-type: inline-size;
  filter: drop-shadow(0 24px 30px rgba(10, 25, 18, .45));
}
.map__base { width: 100%; height: auto; }

.map__place {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 0;
  height: 0;
  color: var(--cream-bg);
  text-decoration: none;
}
.map__dot {
  position: absolute;
  left: 0;
  top: 0;
  width: 14px;
  height: 14px;
  border: 3px solid var(--cream-bg);
  border-radius: 50%;
  background: var(--forest-500);
  box-shadow: 0 0 0 5px rgba(250, 246, 238, .22);
  transform: translate(-50%, -50%);
  transition: transform .2s, box-shadow .2s;
}
.map__name {
  position: absolute;
  left: 0;
  bottom: 12px;
  font-size: clamp(.72rem, 2.3cqw, .95rem);
  font-weight: 500;
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .55);
  transform: translateX(-50%);
}
.map__place--below .map__name { top: 12px; bottom: auto; }

.map__place--main .map__dot {
  width: 22px;
  height: 22px;
  border-width: 4px;
  background: var(--amber-500);
  box-shadow: 0 0 0 7px rgba(232, 149, 31, .28);
}
.map__place--main .map__name {
  top: 18px;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.05rem, 3.6cqw, 1.5rem);
  line-height: 1.05;
}

/* Piny obcí — souřadnice středu tečky v % mapy (dřív inline style=). */
.map__place--verovice { --x: 11.2%; --y: 50.1%; }
.map__place--bordovice { --x: 29%; --y: 45.1%; }
.map__place--lichnov { --x: 36.7%; --y: 28.7%; }
.map__place--ticha { --x: 57.6%; --y: 20.3%; }
.map__place--kuncice-pod-ondrejnikem { --x: 79.3%; --y: 45.2%; }
.map__place--trojanovice { --x: 68.2%; --y: 71%; }
.map__place--frenstat-pod-radhostem { --x: 52.1%; --y: 39.8%; }

/* =========================================================
   SEKCE + HLAVIČKY SEKCÍ
   ========================================================= */
.v4-section { padding-block: clamp(3.5rem, 7vw, 6rem); }
#obce { padding-block: var(--wave-gap); }   /* nad obcemi pata vlny pásu, pod nimi hned stuha */
.v4-section--news { padding-block: var(--wave-gap); }   /* nad oddělovač, pod hlava patičky — vzduch nesou vlny */

.v4-head { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.v4-head .v4-h2 { margin-bottom: 0; }
.v4-head--center { text-align: center; }
.v4-head--center .kicker { justify-content: center; }
.v4-head__squiggle {
  display: block;
  width: 54px;
  height: 11px;
  margin: 1.1rem auto 0;
  color: var(--brand-green);
}

/* =========================================================
   OBCE — bento mřížka
   ========================================================= */
.v4-villages {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: clamp(200px, 17vw, 260px);
  gap: clamp(.75rem, 1.4vw, 1.25rem);
}
.v4-village {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border-radius: var(--radius);
  color: var(--white);
  text-decoration: none;
  background: var(--forest-800);
  isolation: isolate;
  transition: transform .3s, box-shadow .3s;
}
.v4-village--main { grid-column: span 2; grid-row: span 2; }
.v4-village--wide { grid-column: span 2; }
.v4-village img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}
.v4-village::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  /* F-02: závoj od horní hrany ≥ 55 % — text dlaždice sahá na mobilu vysoko */
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--forest-900) 55%, transparent) 0%,
    color-mix(in srgb, var(--forest-900) 65%, transparent) 50%,
    color-mix(in srgb, var(--forest-900) 92%, transparent) 100%);
}
/* Velká dlaždice má text jen dole → světlejší závoj nahoře. V jednom sloupci (≤ 600 px)
   je stejně malá jako ostatní a text sahá vysoko → závoj jako ostatní (F-02). */
@media (min-width: 601px) {
  .v4-village--main::after {
    background: linear-gradient(180deg,
      color-mix(in srgb, var(--forest-900) 0%, transparent) 45%,
      color-mix(in srgb, var(--forest-900) 50%, transparent) 70%,
      color-mix(in srgb, var(--forest-900) 90%, transparent) 100%);
  }
}
.v4-village__body {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: clamp(1.1rem, 1.6vw, 1.5rem);
}
.v4-village__type {
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--forest-200);
}
.v4-village__name {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.35rem, 1.8vw, 1.7rem);
  line-height: 1.1;
}
.v4-village--main .v4-village__name { font-size: clamp(2rem, 3vw, 2.75rem); }
.v4-village__more {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: .45rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--amber-400);
}
.v4-village__more svg { width: 22px; height: 11px; transition: transform .2s; }
/* color: globální a:hover (style.css) by přebarvil bílý název na tmavou → nečitelné na fotce */
.v4-village:hover, .v4-village:focus-visible { color: var(--white); transform: translateY(-3px); box-shadow: var(--shadow-card); }
.v4-village:hover img, .v4-village:focus-visible img { transform: scale(1.05); }
.v4-village:hover .v4-village__more svg, .v4-village:focus-visible .v4-village__more svg { transform: translateX(4px); }

/* =========================================================
   STUHA — samostatný oddělovač (krém → krém)
   ========================================================= */
/* oddělovač dvou krémových sekcí = stejná hrana jako hlava pásu, plocha krémová */
.v4-divider {
  line-height: 0;
  --edge-haze:   rgba(185, 220, 199, .28);
  --edge-mat:    transparent;
  --edge-ribbon: var(--brand-green);
  --edge-fill:   var(--cream-bg);
}
.edge--static { position: relative; }

/* =========================================================
   AKTUALITY
   ========================================================= */
.v4-news {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 2vw, 2rem);
}
.v4-post {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: var(--shadow-tile);
  transition: transform .3s, box-shadow .3s;
}
.v4-post__media, .obec-news__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; }
.v4-post__media img, .obec-news__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.v4-post__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 1.5rem 1.6rem 1.75rem;
}
.v4-post__meta {
  margin: 0 0 .6rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--forest-600);   /* amber-600 na bílé = 3,3:1 */
}
.v4-post__title {
  margin: 0 0 .6rem;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.3rem, 1.6vw, 1.5rem);
  line-height: 1.15;
}
.v4-post__title a {
  /* tap target 44 px i u jednořádkového titulku (F-04: 23–27 px); záporný margin drží layout */
  display: inline-block;
  padding-block: calc((var(--tap-min) - 1.15em) / 2);
  margin-block: calc((1.15em - var(--tap-min)) / 2);
  color: var(--forest-700);
  text-decoration: none;
  transition: color .2s;
}
.v4-post__title a:hover { color: var(--brand-green); }
.v4-post__text { margin: 0 0 1.25rem; font-size: .95rem; color: var(--ink-soft); }
.v4-post__text p { margin: 0; }   /* perex je HTML z article_excerpt_html() */
.v4-post__more {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  min-height: var(--tap-min);
  margin-top: auto;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--forest-600);
}
.v4-post__more svg, .obec-news__go svg { width: 22px; height: 11px; transition: transform .2s; }
/* Zvednutí jen u karty s detailem — karta bez těla není klikací. */
.v4-post:has(.v4-post__more):hover, .v4-post:has(.v4-post__more):focus-within { transform: translateY(-3px); box-shadow: var(--shadow-tile-hover); }
.v4-post:hover .v4-post__media img, .v4-post:focus-within .v4-post__media img { transform: scale(1.05); }
.v4-post:hover .v4-post__more svg, .v4-post:focus-within .v4-post__more svg { transform: translateX(4px); }

/* =========================================================
   ZPRÁVY Z OBCÍ (HP) — dlaždice, proklik na web obce do nového okna
   Spec _docs/specs/2026-10-08-zpravy-z-obci-design.md § 4.2. Text pod
   obrázkem (ne přes fotku — kontrast F-02), hover jen pod (hover: hover).
   ========================================================= */
.v4-head__note { margin: .75rem 0 0; font-size: .95rem; color: var(--ink-soft); }
.obec-news {
  --obec-news-gap: clamp(1rem, 2vw, 2rem);
  container-type: inline-size;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--obec-news-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}
.obec-news__item--lead { grid-column: span 2; }
.v4-section__more { display: flex; justify-content: center; margin: clamp(2rem, 4vw, 3rem) 0 0; }   /* HP → /aktuality */
.obec-news__empty { margin: 0; color: var(--ink-soft); }
.obec-news__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: var(--shadow-tile);
  color: inherit;
  text-decoration: none;
  transition: transform .3s, box-shadow .3s;
}
/* Obrázek všech dlaždic řádku stejně vysoký, i u dlaždic přes víc sloupců (hlavní,
   výplň posledního řádku): výška = 2/3 šířky jednoho sloupce, 100cqw = šířka mřížky.
   Bez container units zůstane 3:2 (.v4-post__media, .obec-news__media výš). */
@supports (height: 1cqw) {
  .obec-news__media { aspect-ratio: auto; height: calc((100cqw - 3 * var(--obec-news-gap)) / 4 * 2 / 3); }
  @media (max-width: 1100px) {
    .obec-news__media { height: calc((100cqw - var(--obec-news-gap)) / 2 * 2 / 3); }
  }
  @media (max-width: 600px) {
    .obec-news__media { height: auto; aspect-ratio: 3 / 2; }
  }
}
.obec-news__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 1.25rem 1.4rem 1.4rem;
}
.obec-news__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .75rem;
  margin-bottom: .6rem;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--forest-600);
}
.obec-news__obec {
  padding: .2rem .6rem;
  border-radius: var(--radius-pill);
  background: var(--forest-700);
  color: var(--white);
  letter-spacing: .08em;
}
/* Bez line-clamp: ořez by na mobilu usekl termín z dlouhých titulků Frenštátu
   a při zvětšených rozestupech (SC 1.4.12, profil A) i kratší titulky. Délku
   drží cron (ZPRAVY_MAX_TITULEK 200 znaků). */
.obec-news__title {
  margin: 0 0 1rem;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: clamp(1.15rem, 1.4vw, 1.3rem);
  line-height: 1.2;
  color: var(--forest-700);
}
.obec-news__item--lead .obec-news__title { font-size: clamp(1.3rem, 1.8vw, 1.6rem); }
.obec-news__go {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  min-height: var(--tap-min);
  margin-top: auto;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--forest-600);
}
/* Klávesnice dostane stejnou odezvu jako myš (jako .v4-card, .v4-village). */
.obec-news__link:focus-visible { transform: translateY(-3px); box-shadow: var(--shadow-tile-hover); }
.obec-news__link:focus-visible .obec-news__media img { transform: scale(1.05); }
.obec-news__link:focus-visible .obec-news__go svg { transform: translateX(4px); }
@media (hover: hover) {
  .obec-news__link:hover { transform: translateY(-3px); box-shadow: var(--shadow-tile-hover); }
  .obec-news__link:hover .obec-news__media img { transform: scale(1.05); }
  .obec-news__link:hover .obec-news__go svg { transform: translateX(4px); }
}
@media (max-width: 1100px) {
  .obec-news { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .obec-news { grid-template-columns: 1fr; }
  .obec-news__item--lead { grid-column: auto; }
}
/* Poslední řádek bez díry: počet dlaždic se mění s cronem, partial ho dává do
   obec-news--nN. 4 sloupce: hlavní zabírá 2, plno je při 3 a 7 dlaždicích. */
@media (min-width: 1101px) {
  .obec-news--n1 .obec-news__item--lead,
  .obec-news--n4 .obec-news__item:last-child { grid-column: 1 / -1; }
  .obec-news--n2 .obec-news__item:last-child,
  .obec-news--n6 .obec-news__item:last-child { grid-column: span 2; }
  .obec-news--n5 .obec-news__item:last-child { grid-column: span 3; }
}
/* 2 sloupce: hlavní má celý řádek, díra zbude při sudém počtu. */
@media (min-width: 601px) and (max-width: 1100px) {
  .obec-news--n2 .obec-news__item:last-child,
  .obec-news--n4 .obec-news__item:last-child,
  .obec-news--n6 .obec-news__item:last-child { grid-column: 1 / -1; }
}


/* ---------- Aktuality: archiv + detail ---------- */
.pager { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 3rem; }
.pager__info { color: var(--ink-soft); }
.article-detail { max-width: 820px; }
.article-detail__meta { margin: 0 0 1.5rem; color: var(--ink-soft); }
.article-detail__media { box-shadow: var(--shadow-card); }   /* na img by stín ořízl overflow:hidden rodiče */
.article-detail__media img { width: 100%; border-radius: var(--radius); }
.article-detail__body { margin-top: 2rem; }
.article-detail__back { margin-top: 3rem; }


/* =========================================================
   PODSTRÁNKY — page-hero (pás s texturou / fotkou + vlna)
   ========================================================= */
.page-hero {
  position: relative;
  min-height: clamp(220px, 22vh, 280px);   /* výšku nese obsah — vysoké okno nesmí tlačit drobečky dolů */
  display: flex;
  align-items: flex-end;
  padding: clamp(1.25rem, 2.5vw, 2rem) 0 calc(var(--edge-h) + 1.5rem);
  color: var(--white);
  background: var(--forest-800) url("../img/v4/forest-texture.webp") center / cover no-repeat;
  overflow: hidden;
  isolation: isolate;   /* fotka (-2) a závoj (-1) pod obsahem, nad pozadím pásu */
  /* barvy hrany pod herem: krém stránky + zelená stuha */
  --edge-haze: rgba(250, 246, 238, .35);
  --edge-mat: var(--cream-bg);
  --edge-ribbon: var(--brand-green);
  --edge-fill: var(--cream-bg);
}
.page-hero--photo { min-height: clamp(320px, 42vh, 520px); }
.page-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero--photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  /* F-02: drobečky nahoře potřebují závoj už od 0 % (.35 = 2,2:1 na světlé obloze) */
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--forest-900) 72%, transparent) 0%,
    color-mix(in srgb, var(--forest-900) 60%, transparent) 45%,
    color-mix(in srgb, var(--forest-900) 85%, transparent) 100%);
}
.page-hero__content { position: relative; z-index: 1; }
.page-hero__title {
  margin: .5rem 0 0;
  color: var(--white);
  font-size: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  line-height: 1.1;
}
.page-hero__perex {
  margin: 1rem 0 0;   /* celá šířka containeru (Petr 2026-10-07) */
  font-size: 1.125rem;
  color: var(--forest-100);
}
/* F-02: oddělovače a aktuální stránka bíle — forest-200/100 na fotce = 2,2–4,4:1;
   aktuální stránku odliší chybějící podtržení (odkazy podtržené jsou). */
.page-hero .breadcrumb { color: var(--white); }
.page-hero .breadcrumb a { color: var(--white); }
.page-hero .breadcrumb a:hover { color: var(--amber-100); }   /* .breadcrumb a:hover ze style.css = tmavý text na tmavém heru */
.page-hero .breadcrumb [aria-current="page"] { color: var(--white); }
.page-hero .edge--in { position: absolute; left: 0; right: 0; bottom: -1px; }

/* ---------- Tělo podstránky ---------- */
.page-body { padding-block: var(--wave-gap); }   /* nad ním vlna page-hero, pod ním hlava patičky */
.page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
}
.page-toc {
  position: sticky;
  top: calc(var(--header-h) + 1.5rem);
  padding: 1.5rem;
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.page-toc__title { margin: 0 0 .75rem; font-size: 1.125rem; }
.page-toc ul { margin: 0; padding: 0; list-style: none; }
.page-toc a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-min);
  color: var(--forest-600);
  text-decoration: none;
}
.page-toc a:hover { color: var(--forest-700); text-decoration: underline; }

/* ---------- Prose — typografie textových stránek ---------- */
.prose { max-width: 72ch; }
.prose--wide { max-width: none; }   /* stránky s mapou/tabulkami (O mikroregionu, dokumenty) — celá šířka sloupce vedle TOC */
.prose > * + * { margin-top: 1em; }
.prose h2 { margin-top: 2em; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); scroll-margin-top: 1rem; }   /* offset hlavičky už dává scroll-padding-top na html */
.prose h3 { margin-top: 1.6em; font-size: 1.4rem; }
.prose h4 { margin-top: 1.4em; font-size: 1.15rem; font-family: var(--font-sans); }
.prose a { color: var(--forest-600); }
.prose a:hover { color: var(--forest-700); }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li + li { margin-top: .35em; }
.prose blockquote {
  margin-inline: 0;
  padding: 1rem 1.5rem;
  border-left: 4px solid var(--amber-500);
  background: var(--amber-100);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-family: var(--font-serif);
  font-size: 1.2rem;
}
.prose__table { overflow-x: auto; }   /* široká tabulka scrolluje sama, ne stránka */
.prose table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.prose th, .prose td { padding: .6rem .75rem; border-bottom: 1px solid var(--line); text-align: left; }
.prose th { color: var(--forest-700); }
.prose figure { margin: 2em 0; }
.prose figure img { border-radius: var(--radius); }
.prose figcaption { margin-top: .5rem; font-size: .9rem; color: var(--ink-soft); }

/* ---------- O mikroregionu ---------- */
/* Mapa z homepage má světlé popisky → tmavý panel jako pás #region. */
.map-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem 2rem;
  align-items: center;
  padding: clamp(1.25rem, 3vw, 2rem);
  border-radius: var(--radius);
  background: var(--forest-700);
  color: var(--cream-bg);
}
.prose .map-panel__list { margin: 0; padding: 0; list-style: none; }
.prose .map-panel__list a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-min);
  min-width: var(--tap-min);   /* „Tichá" je užší než 44 px */
  color: var(--cream-bg);
}
.prose .map-panel__list a:hover { color: var(--amber-100); }
.prose .map-panel__list li + li { margin-top: 0; }
.obce-table td { font-variant-numeric: tabular-nums; text-align: right; }
.obce-table thead th + th { text-align: right; }
.obce-table tfoot td:first-child { text-align: left; }
.obce-table th[scope="row"] { font-weight: 500; }
.obce-table th[scope="row"] a { display: inline-flex; align-items: center; min-height: var(--tap-min); min-width: var(--tap-min); }   /* tap target 44 px (audit @375: 22 px) */
.obce-table tfoot td { border-bottom: 0; font-weight: 600; color: var(--forest-700); }
.prose .obce-table__source { margin-top: .5rem; font-size: .9rem; color: var(--ink-soft); }
.doc-list--card {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.prose .doc-list { padding-left: 0; }
.prose .doc-list li + li { margin-top: 0; }
.facts {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: .5rem 1.5rem;
  margin: 0;
}
.facts dt { font-weight: 600; color: var(--forest-700); }
.facts dd { margin: 0; }

/* ---------- Povinně zveřejňované dokumenty ---------- */
.doc-intro { margin-bottom: 2rem; }
.doc-notice {
  margin-bottom: 3.5rem;
  padding: 1.5rem clamp(1.25rem, 3vw, 2rem);
  border-left: 4px solid var(--amber-500);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--amber-100);
}
.doc-notice__title { margin: 0 0 1rem; font-size: 1.35rem; }
.doc-notice p { margin: 0; }
.doc-notice p + p { margin-top: 1rem; }
.doc-group { scroll-margin-top: 1rem; }
.doc-group + .doc-group { margin-top: 3.5rem; }
.doc-group__title { margin: 0 0 1.25rem; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); }
/* Jedna karta na typ, roky = řádky oddělené linkou, rok ve sloupci vlevo. */
.doc-card,
.doc-archive .doc-list {
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.doc-year {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  align-items: start;
}
.doc-year + .doc-year { border-top: 2px solid var(--cream-bg); }
.doc-year__label {
  grid-column: 1;
  margin: 0;
  padding: 1.3rem 0 0 1.25rem;
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--forest-700);
}
.doc-year .doc-list { grid-column: 2; }
.doc-list { margin: 0; padding: 0; list-style: none; }
.doc-list__item { display: flex; align-items: flex-start; gap: 1rem; padding: .75rem 1.25rem; }
.doc-list__item + .doc-list__item { border-top: 1px solid var(--line); }
.doc-list__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 8px;
  background: var(--forest-100);
  color: var(--forest-700);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .04em;
}
.doc-list__main { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.doc-list__name { font-weight: 500; color: var(--forest-700); overflow-wrap: anywhere; }
a.doc-list__name { display: inline-flex; align-items: center; min-height: var(--tap-min); color: var(--forest-600); }
a.doc-list__name:hover { color: var(--forest-700); }
.doc-list__meta { font-size: .9rem; color: var(--ink-soft); }
.doc-archive { margin-top: 3.5rem; scroll-margin-top: 1rem; }
.doc-archive__summary {
  display: flex;
  align-items: center;
  min-height: var(--tap-min);
  cursor: pointer;
  font-weight: 500;
  color: var(--forest-600);
}
.doc-archive .doc-list { margin-top: 1rem; }

/* ---------- Mřížka fotokaret (rozcestníky obcí, projektů) ---------- */
.card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 2.5vw, 2rem);
}
.photo-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  color: var(--ink);
  text-decoration: none;
  transition: transform .2s ease;
}
.photo-card:hover { color: var(--ink); transform: translateY(-4px); }   /* globální a:hover by přebarvil celý text karty */
.photo-card__img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.photo-card__body { flex: 1; display: flex; flex-direction: column; gap: .5rem; padding: 1.25rem 1.5rem 1.5rem; }
.photo-card__tag {
  align-self: flex-start;
  padding: .2rem .7rem;
  border-radius: var(--radius-pill);
  background: var(--forest-100);
  color: var(--forest-700);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.photo-card__title { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 600; color: var(--forest-700); line-height: 1.2; }
.photo-card__text { color: var(--ink-soft); }
.photo-card__more { display: inline-flex; align-items: center; gap: .6rem; margin-top: auto; padding-top: .5rem; color: var(--forest-600); font-weight: 500; }
.photo-card:hover .photo-card__more { color: var(--forest-700); text-decoration: underline; }
/* Široká karta (město): přes celou řadu, fotka vlevo, text vpravo → pod ní 2 × 3 obce. */
.photo-card--featured { position: relative; grid-column: 1 / -1; min-height: clamp(300px, 26vw, 400px); padding-left: 58%; }   /* fotka absolutně — jinak by její poměr stran natáhl kartu do výšky */
.photo-card--featured .photo-card__img { position: absolute; inset: 0 auto 0 0; width: 58%; height: 100%; aspect-ratio: auto; }
.photo-card--featured .photo-card__body { justify-content: center; padding: clamp(1.5rem, 3vw, 2.5rem); }
.photo-card--featured .photo-card__title { font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.4rem); }

/* ---------- Zelený pás s výzvou (podstránky) ---------- */
.band-cta { text-align: center; padding-block: 1rem; }
.band-cta__text { max-width: 52ch; margin: 1rem auto 1.75rem; color: var(--forest-100); }

/* ---------- Detail (obec, projekt) ---------- */
.detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
}
.detail-layout__h2 { margin: 2.5rem 0 1rem; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.detail-layout__side { display: flex; flex-direction: column; gap: 1.5rem; }
.detail-erb { width: 120px; height: auto; }

.fact-card {
  padding: 1.25rem 1.5rem;
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.fact-list { margin: 0; }
.fact-list__row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--line); }
.fact-list__row:last-child { border-bottom: 0; }
.fact-list dt { flex: none; color: var(--ink-soft); }   /* štítek se nezalamuje („E-mail" na 320 px), zalomí se hodnota */
.fact-list dd { margin: 0; font-weight: 500; color: var(--forest-700); text-align: right; text-wrap: balance; font-variant-numeric: tabular-nums; }   /* čísla drží pohromadě nbsp z partialu fact-list */
.fact-list a { display: inline-flex; align-items: center; min-height: var(--tap-min); min-width: var(--tap-min); color: var(--forest-600); }
.fact-list a:hover { color: var(--forest-700); }
.fact-card__source { margin: .5rem 0 0; font-size: .85rem; color: var(--ink-soft); }

/* ---------- Kontakt: karty vlevo, mapa sídla vpravo ---------- */
.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: start;
}
.contact-grid__cards { display: flex; flex-direction: column; gap: clamp(1.25rem, 2.5vw, 2rem); }
.contact-card__address { font-style: normal; }
.contact-card .fact-list dd { overflow-wrap: anywhere; }   /* dlouhý e-mail na 320 px */

/* ---------- 404 ---------- */
.page-body .error-page { padding-block: 0; text-align: left; }   /* .error-page ze style.css = starý layout skeletonu */
.error-page__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.5rem; }
.btn--ghost { color: var(--forest-700); box-shadow: inset 0 0 0 1px var(--forest-600); }
.btn--ghost:hover { color: var(--forest-700); background: var(--forest-100); }

/* ---------- Povinná publicita dotací (loga poskytovatelů dodá podprojekt 2) ---------- */
.publicity {
  margin-top: 2.5rem;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}
.publicity__line { margin: 0; font-size: .95rem; color: var(--ink-soft); }
.publicity__line + .publicity__line { margin-top: .4rem; }

.gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.gallery-grid__item { display: block; overflow: hidden; border-radius: var(--radius); }
.gallery-grid__item img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .3s ease; }
.gallery-grid__item:hover img { transform: scale(1.04); }

.map--mini { padding: 1rem; background: var(--forest-700); border-radius: var(--radius); filter: none; }
.map__place--muted .map__dot { width: 10px; height: 10px; border-width: 2px; background: var(--forest-500); box-shadow: none; opacity: .75; }

.contact-card {
  padding: 1.25rem 1.5rem;
  background: var(--white);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}
.contact-card__title { margin: 0 0 .75rem; font-size: 1.25rem; }
.contact-card__name { font-weight: 600; color: var(--forest-700); }
.contact-card p { margin: 0 0 .35rem; }
.contact-card a { display: inline-flex; align-items: center; min-height: var(--tap-min); color: var(--forest-600); overflow-wrap: anywhere; }
.contact-card a:hover { color: var(--forest-700); }


/* =========================================================
   RESPONZIVITA (desktop je hlavní; mobil = rozumný fallback)
   Hlavička, menu a patička jsou ve style.css.
   ========================================================= */
@media (max-width: 1100px) {
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .v4-cards { grid-template-columns: 1fr; }
  .v4-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem; }   /* minmax(0): dlouhý popisek nesmí roztáhnout sloupec (reflow 320 px) */
  .v4-stats__label { overflow-wrap: anywhere; }
  /* text hera zasahuje do pravé třetiny, kde vodorovný závoj končí → plošný závoj */
  .v4-hero__shade { background: linear-gradient(180deg, color-mix(in srgb, var(--forest-900) 70%, transparent), color-mix(in srgb, var(--forest-900) 55%, transparent)); }
  .v4-stats__item:nth-child(3) { border-left: 0; }
  .v4-region { grid-template-columns: 1fr; }
  .v4-villages { grid-template-columns: repeat(2, 1fr); }
  .v4-news { grid-template-columns: 1fr; }
  .page-layout { grid-template-columns: 1fr; }
  .page-toc { position: static; order: -1; }
  .contact-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .v4-villages { grid-template-columns: 1fr; }
  .v4-village--main, .v4-village--wide { grid-column: auto; grid-row: auto; }
  .map-panel { grid-template-columns: minmax(0, 1fr); }
  .map-panel__list { columns: 2; column-gap: 1rem; }
  .facts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .facts dd + dt { margin-top: .75rem; }
  .doc-year { grid-template-columns: minmax(0, 1fr); }
  .doc-year__label { padding: .9rem 1rem 0; }
  .doc-year .doc-list { grid-column: 1; }
  .doc-list__item { padding-inline: 1rem; gap: .75rem; }
  .card-grid { grid-template-columns: minmax(0, 1fr); }
  .photo-card--featured { grid-column: auto; min-height: 0; padding-left: 0; }
  .photo-card--featured .photo-card__img { position: static; width: 100%; height: auto; aspect-ratio: 3 / 2; }
  .photo-card--featured .photo-card__body { padding: 1.25rem 1.5rem 1.5rem; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
  .v4-stats__item { padding-inline: .5rem; }
  .btn { white-space: normal; text-align: center; }   /* delší label nepřeteče 320 px */
}

/* Omezený pohyb — bez plynulého scrollu a animací (WCAG 2.3.3). */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Vysoký kontrast (Windows) — box-shadow se nekreslí, obrys dát borderem. */
@media (forced-colors: active) {
  .btn, .nav-toggle, .v4-region__list a { border: 1px solid ButtonText; }
  .obec-news__link { border: 1px solid CanvasText; }
  .site-nav__link.is-active::after { background: Highlight; }
}