:root {
  --barva-primarna: #1a2744;
  --barva-primarna-svetla: #263a68;
  --barva-akcent: #e8a123;
  --barva-akcent-tmava: #c4881a;
  --barva-pozadi: #f4f2ee;
  --barva-povrch: #ffffff;
  --barva-text: #1e1e1e;
  --barva-text-sekundarni: #5a5956;
  --barva-ohraniceni: #d8d3cb;
  --barva-vrstva-svetla: #eceae5;
  --pismo-nadpis: Georgia, 'Times New Roman', serif;
  --pismo-text: system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --mezera-xs: 0.375rem;
  --mezera-s: 0.75rem;
  --mezera-m: 1.5rem;
  --mezera-l: 2.75rem;
  --mezera-xl: 4.5rem;
  --mezera-xxl: 7rem;
  --polomer: 3px;
  --polomer-vetsi: 7px;
  --stin-jemny: 0 1px 6px rgba(26,39,68,0.07);
  --stin-karta: 0 3px 18px rgba(26,39,68,0.11);
  --sirka-max: 1160px;
  --sirka-text: 780px;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--pismo-text);
  background-color: var(--barva-pozadi);
  color: var(--barva-text);
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}

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

a {
  color: var(--barva-primarna);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

a:hover {
  color: var(--barva-akcent-tmava);
}

a:focus-visible {
  outline: 2px solid var(--barva-akcent);
  outline-offset: 3px;
  border-radius: var(--polomer);
}

h1, h2, h3, h4 {
  font-family: var(--pismo-nadpis);
  line-height: 1.22;
  color: var(--barva-primarna);
}

h1 { font-size: clamp(1.75rem, 4vw, 2.8rem); font-weight: 700; }
h2 { font-size: clamp(1.35rem, 3vw, 2.1rem); font-weight: 700; }
h3 { font-size: clamp(1.05rem, 2vw, 1.4rem); font-weight: 600; }
h4 { font-size: 1rem; font-weight: 600; }

p { margin-bottom: var(--mezera-m); }
p:last-child { margin-bottom: 0; }

ul, ol { padding-left: 1.5rem; }

strong { font-weight: 600; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}


/* ─── Layout wrappers ──────────────────────── */

.vnitrek {
  max-width: var(--sirka-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--mezera-m);
  padding-right: var(--mezera-m);
}

.vnitrek-uzky {
  max-width: var(--sirka-text);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--mezera-m);
  padding-right: var(--mezera-m);
}


/* ─── Navigation ────────────────────────────── */

.navigace {
  background-color: var(--barva-primarna);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

.navigace-obal {
  max-width: var(--sirka-max);
  margin: 0 auto;
  padding: 0 var(--mezera-m);
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 4rem;
  position: relative;
}

.navigace-znacka {
  font-family: var(--pismo-nadpis);
  font-size: 1.22rem;
  font-weight: 700;
  color: #ffffff;
  text-decoration: none;
  letter-spacing: -0.01em;
  flex-shrink: 0;
}

.navigace-znacka .akcent-znacky {
  color: var(--barva-akcent);
}

.nav-toggle-vstup {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

.navigace-prepinac {
  display: none;
  background: none;
  border: 1px solid rgba(255,255,255,0.3);
  cursor: pointer;
  padding: 0.4rem 0.55rem;
  border-radius: var(--polomer);
  color: #ffffff;
  line-height: 0;
}

.navigace-prepinac:focus-visible {
  outline: 2px solid var(--barva-akcent);
  outline-offset: 2px;
}

.navigace-menu {
  display: flex;
  align-items: center;
  gap: var(--mezera-l);
  list-style: none;
  padding: 0;
  margin: 0;
}

.navigace-odkaz {
  color: rgba(255,255,255,0.82);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 0.3rem 0;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.navigace-odkaz:hover,
.navigace-odkaz[aria-current="page"] {
  color: var(--barva-akcent);
  border-bottom-color: var(--barva-akcent);
}

.navigace-odkaz:focus-visible {
  outline: 2px solid var(--barva-akcent);
  outline-offset: 3px;
  border-radius: 2px;
}


/* ─── Buttons ────────────────────────────────── */

.tlacitko-amber {
  display: inline-block;
  background-color: var(--barva-akcent);
  color: var(--barva-primarna);
  font-family: var(--pismo-text);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  padding: 0.7rem 1.65rem;
  border-radius: var(--polomer);
  border: 2px solid var(--barva-akcent);
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
  text-align: center;
  white-space: nowrap;
  line-height: 1.4;
}

.tlacitko-amber:hover {
  background-color: var(--barva-akcent-tmava);
  border-color: var(--barva-akcent-tmava);
  color: var(--barva-primarna);
}

.tlacitko-amber:focus-visible {
  outline: 3px solid var(--barva-primarna);
  outline-offset: 3px;
}

.tlacitko-obrys {
  display: inline-block;
  background-color: transparent;
  color: var(--barva-primarna);
  font-family: var(--pismo-text);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.7rem 1.65rem;
  border-radius: var(--polomer);
  border: 2px solid var(--barva-primarna);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
  text-align: center;
  white-space: nowrap;
  line-height: 1.4;
}

.tlacitko-obrys:hover {
  background-color: var(--barva-primarna);
  color: #ffffff;
}

.tlacitko-obrys:focus-visible {
  outline: 3px solid var(--barva-akcent);
  outline-offset: 3px;
}

.tlacitko-obrys-bile {
  display: inline-block;
  background-color: transparent;
  color: rgba(255,255,255,0.92);
  font-family: var(--pismo-text);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.7rem 1.65rem;
  border-radius: var(--polomer);
  border: 2px solid rgba(255,255,255,0.45);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
  text-align: center;
  white-space: nowrap;
  line-height: 1.4;
}

.tlacitko-obrys-bile:hover {
  background-color: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.75);
  color: #ffffff;
}

.tlacitko-obrys-bile:focus-visible {
  outline: 3px solid var(--barva-akcent);
  outline-offset: 3px;
}

.tlacitko-obrys-tmave {
  display: inline-block;
  background-color: transparent;
  color: var(--barva-primarna);
  font-family: var(--pismo-text);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.65rem 1.5rem;
  border-radius: var(--polomer);
  border: 2px solid rgba(26,39,68,0.4);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
  text-align: center;
  white-space: nowrap;
  line-height: 1.4;
}

.tlacitko-obrys-tmave:hover {
  background-color: var(--barva-primarna);
  border-color: var(--barva-primarna);
  color: #ffffff;
}

.tlacitko-obrys-tmave:focus-visible {
  outline: 3px solid var(--barva-akcent);
  outline-offset: 3px;
}


/* ─── Hero banner ────────────────────────────── */

.uvodni-banner {
  background-color: var(--barva-primarna);
  color: #ffffff;
  padding: var(--mezera-xxl) 0 var(--mezera-xl);
  position: relative;
  overflow: hidden;
}

.uvodni-banner::after {
  content: '';
  position: absolute;
  bottom: -120px;
  right: -100px;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  background-color: rgba(232,161,35,0.06);
  pointer-events: none;
}

.uvodni-mrize {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mezera-xl);
  align-items: center;
}

.uvodni-text h1 {
  color: #ffffff;
  margin-bottom: var(--mezera-m);
}

.uvodni-text .akcent-h1 {
  color: var(--barva-akcent);
}

.uvodni-perex {
  color: rgba(255,255,255,0.8);
  font-size: 1.05rem;
  margin-bottom: var(--mezera-l);
  max-width: 520px;
}

.uvodni-akce {
  display: flex;
  gap: var(--mezera-m);
  flex-wrap: wrap;
  align-items: center;
}

.uvodni-vizual {
  display: flex;
  justify-content: center;
  align-items: center;
}

.uvodni-vizual img {
  max-height: 360px;
  width: 100%;
  object-fit: contain;
}


/* ─── Section containers ─────────────────────── */

.sekce-bezna {
  padding: var(--mezera-xl) 0;
}

.sekce-bila {
  background-color: var(--barva-povrch);
  padding: var(--mezera-xl) 0;
}

.sekce-vrstva {
  background-color: var(--barva-vrstva-svetla);
  padding: var(--mezera-xl) 0;
}

.sekce-tmava {
  background-color: var(--barva-primarna);
  padding: var(--mezera-xl) 0;
  color: #ffffff;
}

.sekce-tmava h2,
.sekce-tmava h3,
.sekce-tmava p {
  color: #ffffff;
}

.sekce-tmava a:not(.tlacitko-amber):not(.tlacitko-obrys-bile) {
  color: var(--barva-akcent);
}

.sekce-hlavicka {
  margin-bottom: var(--mezera-l);
}

.sekce-nazev {
  margin-bottom: var(--mezera-s);
}

.sekce-popis {
  color: var(--barva-text-sekundarni);
  font-size: 1.05rem;
  max-width: 640px;
}

.sekce-hlavicka-stred {
  text-align: center;
}

.sekce-hlavicka-stred .sekce-popis {
  margin-left: auto;
  margin-right: auto;
}

.sekce-tmava .sekce-popis {
  color: rgba(255,255,255,0.72);
}


/* ─── Grid layouts ───────────────────────────── */

.mrize-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mezera-m);
}

.mrize-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--mezera-l);
}

.mrize-2-3 {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: var(--mezera-xl);
  align-items: start;
}


/* ─── Info cards ─────────────────────────────── */

.info-karta {
  background-color: var(--barva-povrch);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer-vetsi);
  padding: var(--mezera-l) var(--mezera-m);
  box-shadow: var(--stin-jemny);
}

.karta-ikonka {
  width: 46px;
  height: 46px;
  background-color: var(--barva-akcent);
  border-radius: var(--polomer);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--mezera-m);
  flex-shrink: 0;
}

.karta-ikonka svg {
  display: block;
}

.karta-titulek {
  font-family: var(--pismo-nadpis);
  font-size: 1.08rem;
  font-weight: 700;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-s);
}

.karta-text {
  color: var(--barva-text-sekundarni);
  font-size: 0.95rem;
  line-height: 1.66;
  margin-bottom: 0;
}


/* ─── Split / two-column sections ───────────── */

.rozdelene-bloky {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mezera-xl);
  align-items: center;
}

.rozdelene-bloky-obracene {
  direction: rtl;
}

.rozdelene-bloky-obracene > * {
  direction: ltr;
}

.blok-textu h2,
.blok-textu h3 {
  margin-bottom: var(--mezera-m);
}

.blok-textu p {
  color: var(--barva-text-sekundarni);
}

.blok-textu p:last-of-type {
  margin-bottom: var(--mezera-l);
}

.blok-obrazku img {
  border-radius: var(--polomer-vetsi);
  box-shadow: var(--stin-karta);
  width: 100%;
}


/* ─── Numbered feature list ──────────────────── */

.ocislovany-seznam {
  list-style: none;
  padding: 0;
  margin: 0;
}

.cislovana-polozka {
  display: flex;
  gap: var(--mezera-m);
  padding: var(--mezera-m) 0;
  border-bottom: 1px solid var(--barva-ohraniceni);
}

.cislovana-polozka:first-child {
  border-top: 1px solid var(--barva-ohraniceni);
}

.polozka-cislo {
  font-family: var(--pismo-nadpis);
  font-size: 1.9rem;
  font-weight: 700;
  color: var(--barva-akcent);
  line-height: 1;
  min-width: 2.4rem;
  flex-shrink: 0;
  padding-top: 0.15rem;
}

.polozka-obsah h3 {
  font-size: 1.05rem;
  margin-bottom: var(--mezera-xs);
}

.polozka-obsah p {
  color: var(--barva-text-sekundarni);
  font-size: 0.93rem;
  margin-bottom: 0;
}


/* ─── Step / process list ────────────────────── */

.kroky-postup {
  display: flex;
  flex-direction: column;
  gap: var(--mezera-m);
  list-style: none;
  padding: 0;
  margin: 0;
}

.krok-polozka {
  display: flex;
  gap: var(--mezera-m);
  background-color: var(--barva-povrch);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer-vetsi);
  padding: var(--mezera-m);
  box-shadow: var(--stin-jemny);
}

.krok-badge {
  width: 2.2rem;
  height: 2.2rem;
  min-width: 2.2rem;
  background-color: var(--barva-primarna);
  color: #ffffff;
  font-family: var(--pismo-nadpis);
  font-size: 0.85rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.15rem;
}

.krok-detail h3 {
  font-size: 1rem;
  margin-bottom: var(--mezera-xs);
}

.krok-detail p {
  font-size: 0.9rem;
  color: var(--barva-text-sekundarni);
  margin-bottom: 0;
}


/* ─── FAQ ────────────────────────────────────── */

.faq-polozky {
  list-style: none;
  padding: 0;
  margin: 0;
}

.faq-zaznam {
  border-top: 1px solid var(--barva-ohraniceni);
  padding: var(--mezera-m) 0;
}

.faq-zaznam:last-child {
  border-bottom: 1px solid var(--barva-ohraniceni);
}

.faq-otazka {
  font-family: var(--pismo-nadpis);
  font-size: 1.03rem;
  font-weight: 600;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-s);
}

.faq-odpoved {
  color: var(--barva-text-sekundarni);
  font-size: 0.95rem;
  margin-bottom: 0;
}


/* ─── Page header ────────────────────────────── */

.stranka-hlavicka {
  background-color: var(--barva-primarna);
  padding: var(--mezera-xl) 0 var(--mezera-l);
  color: #ffffff;
}

.stranka-hlavicka h1 {
  color: #ffffff;
  margin-bottom: var(--mezera-s);
}

.stranka-hlavicka .hlavicka-perex {
  color: rgba(255,255,255,0.75);
  font-size: 1.05rem;
  max-width: 600px;
  margin-bottom: 0;
}


/* ─── Amber accent strip ─────────────────────── */

.pruh-amber {
  background-color: var(--barva-akcent);
  padding: var(--mezera-l) 0;
}

.pruh-amber-obsah {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--mezera-l);
  flex-wrap: wrap;
}

.pruh-amber-text h2 {
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-xs);
}

.pruh-amber-text p {
  color: rgba(26,39,68,0.68);
  margin-bottom: 0;
  font-size: 0.95rem;
}


/* ─── Contact layout ─────────────────────────── */

.kontakt-mrize {
  display: grid;
  grid-template-columns: 1fr 1.65fr;
  gap: var(--mezera-xl);
  align-items: start;
}

.kontakt-skupina {
  margin-bottom: var(--mezera-l);
}

.kontakt-skupina:last-child {
  margin-bottom: 0;
}

.kontakt-skupina-nazev {
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--barva-akcent-tmava);
  margin-bottom: var(--mezera-s);
}

.kontakt-radek {
  display: flex;
  align-items: flex-start;
  gap: var(--mezera-s);
  margin-bottom: var(--mezera-s);
  font-size: 0.94rem;
  color: var(--barva-text-sekundarni);
}

.kontakt-radek svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--barva-primarna);
}

.kontakt-radek a {
  color: var(--barva-primarna);
}

.kontakt-note {
  font-size: 0.88rem;
  color: var(--barva-text-sekundarni);
  background-color: var(--barva-vrstva-svetla);
  border-left: 3px solid var(--barva-akcent);
  padding: var(--mezera-m);
  border-radius: 0 var(--polomer) var(--polomer) 0;
  margin-bottom: 0;
}


/* ─── Form ───────────────────────────────────── */

.formular-obal {
  background-color: var(--barva-povrch);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer-vetsi);
  padding: var(--mezera-l);
  box-shadow: var(--stin-karta);
}

.formular-nadpis {
  font-family: var(--pismo-nadpis);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-l);
}

.pole-skupina {
  margin-bottom: var(--mezera-m);
}

.pole-stitek {
  display: block;
  font-size: 0.87rem;
  font-weight: 600;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-xs);
}

.pole-stitek .povinne {
  color: var(--barva-akcent-tmava);
  margin-left: 2px;
}

.pole-vstup,
.pole-vyber,
.pole-zprava {
  display: block;
  width: 100%;
  font-family: var(--pismo-text);
  font-size: 0.95rem;
  color: var(--barva-text);
  background-color: var(--barva-pozadi);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer);
  padding: 0.65rem 0.9rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}

.pole-vstup:focus,
.pole-vyber:focus,
.pole-zprava:focus {
  border-color: var(--barva-primarna);
  box-shadow: 0 0 0 3px rgba(26,39,68,0.09);
}

.pole-zprava {
  min-height: 130px;
  resize: vertical;
}

.formular-tlacitko {
  width: 100%;
  padding: 0.85rem;
  font-size: 0.95rem;
  font-weight: 700;
  background-color: var(--barva-akcent);
  color: var(--barva-primarna);
  border: 2px solid var(--barva-akcent);
  border-radius: var(--polomer);
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
  font-family: var(--pismo-text);
  margin-top: var(--mezera-s);
}

.formular-tlacitko:hover {
  background-color: var(--barva-akcent-tmava);
  border-color: var(--barva-akcent-tmava);
}

.formular-tlacitko:focus-visible {
  outline: 3px solid var(--barva-primarna);
  outline-offset: 3px;
}

.formular-poznamka {
  font-size: 0.82rem;
  color: var(--barva-text-sekundarni);
  margin-top: var(--mezera-s);
  text-align: center;
  margin-bottom: 0;
}


/* ─── Info box ───────────────────────────────── */

.info-box {
  background-color: var(--barva-vrstva-svetla);
  border-left: 3px solid var(--barva-akcent);
  border-radius: 0 var(--polomer) var(--polomer) 0;
  padding: var(--mezera-m);
  margin-bottom: var(--mezera-l);
}

.info-box p {
  margin-bottom: 0;
  font-size: 0.94rem;
  color: var(--barva-text-sekundarni);
}


/* ─── Link cards (internal navigation) ──────── */

.odkaz-mrize {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mezera-m);
  list-style: none;
  padding: 0;
  margin: 0;
}

.odkaz-karta {
  background-color: var(--barva-povrch);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer-vetsi);
  padding: var(--mezera-m);
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.2s;
}

.odkaz-karta:hover {
  box-shadow: var(--stin-karta);
}

.odkaz-karta-titulek {
  font-family: var(--pismo-nadpis);
  font-size: 1rem;
  font-weight: 700;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-xs);
}

.odkaz-karta-popis {
  font-size: 0.88rem;
  color: var(--barva-text-sekundarni);
  margin-bottom: var(--mezera-s);
  flex-grow: 1;
  line-height: 1.55;
}

.odkaz-karta-link {
  font-weight: 600;
  font-size: 0.88rem;
  text-decoration: none;
  color: var(--barva-primarna);
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.odkaz-karta-link::after {
  content: '→';
}

.odkaz-karta-link:hover {
  color: var(--barva-akcent-tmava);
}


/* ─── Legal / document pages ─────────────────── */

.dokument-obsah {
  padding: var(--mezera-xl) 0;
}

.dokument-meta {
  font-size: 0.85rem;
  color: var(--barva-text-sekundarni);
  margin-bottom: var(--mezera-l);
  padding-bottom: var(--mezera-m);
  border-bottom: 1px solid var(--barva-ohraniceni);
}

.dokument-obsah h2 {
  font-size: 1.28rem;
  margin-top: var(--mezera-l);
  margin-bottom: var(--mezera-s);
  padding-top: var(--mezera-m);
  border-top: 1px solid var(--barva-ohraniceni);
}

.dokument-obsah h2:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.dokument-obsah h3 {
  font-size: 1.03rem;
  margin-top: var(--mezera-m);
  margin-bottom: var(--mezera-xs);
}

.dokument-obsah p,
.dokument-obsah li {
  color: var(--barva-text-sekundarni);
  font-size: 0.95rem;
}

.dokument-obsah ul {
  margin-bottom: var(--mezera-m);
}

.dokument-obsah ul li {
  margin-bottom: var(--mezera-xs);
}

.dokument-nav {
  margin-top: var(--mezera-xl);
  padding-top: var(--mezera-m);
  border-top: 1px solid var(--barva-ohraniceni);
}

.dokument-nav-titulek {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--barva-text-sekundarni);
  margin-bottom: var(--mezera-s);
}

.dokument-nav-seznam {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mezera-m);
  list-style: none;
  padding: 0;
  margin: 0;
}

.dokument-nav-odkaz {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--barva-primarna);
  text-decoration: none;
  padding: 0.35rem 0.8rem;
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer);
  transition: background-color 0.2s, border-color 0.2s;
}

.dokument-nav-odkaz:hover {
  background-color: var(--barva-primarna);
  border-color: var(--barva-primarna);
  color: #ffffff;
}


/* ─── Terminology / Extra page ───────────────── */

.terminy-mrize {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--mezera-m);
}

.termin-zaznam {
  background-color: var(--barva-povrch);
  border: 1px solid var(--barva-ohraniceni);
  border-radius: var(--polomer-vetsi);
  padding: var(--mezera-m);
}

.termin-pojem {
  font-family: var(--pismo-nadpis);
  font-size: 1rem;
  font-weight: 700;
  color: var(--barva-primarna);
  margin-bottom: var(--mezera-xs);
}

.termin-vyklad {
  font-size: 0.9rem;
  color: var(--barva-text-sekundarni);
  margin-bottom: 0;
  line-height: 1.6;
}


/* ─── Feature detail blocks ──────────────────── */

.funkce-blok {
  padding: var(--mezera-xl) 0;
  border-bottom: 1px solid var(--barva-ohraniceni);
}

.funkce-blok:last-child {
  border-bottom: none;
}

.funkce-oznaceni {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--barva-akcent-tmava);
  margin-bottom: var(--mezera-s);
}


/* ─── Footer ─────────────────────────────────── */

.paticka {
  background-color: var(--barva-primarna);
  color: rgba(255,255,255,0.72);
}

.paticka-horni {
  padding: var(--mezera-xl) 0 var(--mezera-l);
}

.paticka-mrize {
  display: grid;
  grid-template-columns: 2.2fr 1fr 1fr 1fr;
  gap: var(--mezera-l);
}

.paticka-znacka {
  font-family: var(--pismo-nadpis);
  font-size: 1.18rem;
  font-weight: 700;
  color: #ffffff;
  text-decoration: none;
  display: block;
  margin-bottom: var(--mezera-s);
}

.paticka-znacka .akcent-znacky {
  color: var(--barva-akcent);
}

.paticka-perex {
  font-size: 0.87rem;
  line-height: 1.62;
  color: rgba(255,255,255,0.56);
  margin-bottom: var(--mezera-m);
}

.paticka-kontakt-blok {
  font-size: 0.84rem;
  color: rgba(255,255,255,0.58);
}

.paticka-kontakt-radek {
  margin-bottom: 0.3rem;
}

.paticka-skupina-nazev {
  font-size: 0.73rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.4);
  margin-bottom: var(--mezera-m);
}

.paticka-linky {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--mezera-s);
}

.paticka-odkaz {
  color: rgba(255,255,255,0.66);
  text-decoration: none;
  font-size: 0.87rem;
  transition: color 0.2s;
}

.paticka-odkaz:hover {
  color: var(--barva-akcent);
}

.paticka-odkaz:focus-visible {
  outline: 2px solid var(--barva-akcent);
  outline-offset: 2px;
  border-radius: 2px;
}

.paticka-dolni {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding: var(--mezera-m) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--mezera-m);
  flex-wrap: wrap;
}

.paticka-copyright {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.38);
}

.paticka-dolni-nav {
  display: flex;
  gap: var(--mezera-m);
  list-style: none;
  padding: 0;
  margin: 0;
}


/* ─── Breakpoint: 1100px ─────────────────────── */

@media (max-width: 1100px) {
  .uvodni-mrize {
    grid-template-columns: 1fr;
  }

  .uvodni-vizual {
    display: none;
  }

  .paticka-mrize {
    grid-template-columns: 1fr 1fr;
    gap: var(--mezera-l) var(--mezera-xl);
  }

  .mrize-2-3 {
    grid-template-columns: 1fr 1.5fr;
  }
}


/* ─── Breakpoint: 768px ──────────────────────── */

@media (max-width: 768px) {
  :root {
    --mezera-xl: 3rem;
    --mezera-xxl: 4rem;
    --mezera-l: 2rem;
  }

  .navigace-prepinac {
    display: block;
  }

  .nav-toggle-vstup:checked ~ .navigace-menu {
    display: flex;
  }

  .navigace-menu {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    position: absolute;
    top: 4rem;
    left: 0;
    right: 0;
    background-color: var(--barva-primarna);
    padding: var(--mezera-m);
    box-shadow: 0 8px 24px rgba(0,0,0,0.22);
    z-index: 99;
  }

  .navigace-menu li {
    width: 100%;
  }

  .navigace-odkaz {
    display: block;
    padding: 0.8rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.09);
    font-size: 0.95rem;
  }

  .navigace-odkaz:last-child {
    border-bottom: none;
  }

  .mrize-3 {
    grid-template-columns: 1fr;
  }

  .mrize-2 {
    grid-template-columns: 1fr;
  }

  .mrize-2-3 {
    grid-template-columns: 1fr;
  }

  .rozdelene-bloky {
    grid-template-columns: 1fr;
  }

  .rozdelene-bloky-obracene {
    direction: ltr;
  }

  .kontakt-mrize {
    grid-template-columns: 1fr;
  }

  .paticka-mrize {
    grid-template-columns: 1fr;
    gap: var(--mezera-l);
  }

  .paticka-dolni {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--mezera-s);
  }

  .pruh-amber-obsah {
    flex-direction: column;
    align-items: flex-start;
  }

  .terminy-mrize {
    grid-template-columns: 1fr;
  }

  .odkaz-mrize {
    grid-template-columns: 1fr;
  }

  .dokument-nav-seznam {
    flex-direction: column;
    gap: var(--mezera-s);
  }

  .uvodni-akce {
    flex-direction: column;
    align-items: flex-start;
  }
}