:root {
  --modr-tmava: #1e3a5f;
  --modr-stred: #2a5082;
  --modr-svetla: #3d6fa0;
  --zlata: #d4a843;
  --zlata-svetla: #e8c068;
  --zlata-bg: #fef3d8;
  --krem: #f4f2ed;
  --krem-tmava: #eae7e0;
  --bila: #ffffff;
  --text-tmava: #1a1a1a;
  --text-stred: #3d4551;
  --text-svetla: #5a6474;
  --text-jemna: #8b96a3;
  --ohraniceni: #ddd8d0;
  --povrch-alt: #f0eee8;
  --paticka-bg: #111a28;

  --pismo-titulek: Georgia, 'Times New Roman', 'Palatino Linotype', serif;
  --pismo-text: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;

  --vel-xs: 0.75rem;
  --vel-sm: 0.875rem;
  --vel-zak: 1rem;
  --vel-str: 1.125rem;
  --vel-vel: 1.375rem;
  --vel-h4: 1.5rem;
  --vel-h3: 1.875rem;
  --vel-h2: 2.25rem;
  --vel-h1: 3rem;
  --vel-hrdina: 3.625rem;

  --pros-1: 0.25rem;
  --pros-2: 0.5rem;
  --pros-3: 0.75rem;
  --pros-4: 1rem;
  --pros-5: 1.25rem;
  --pros-6: 1.5rem;
  --pros-8: 2rem;
  --pros-10: 2.5rem;
  --pros-12: 3rem;
  --pros-16: 4rem;
  --pros-20: 5rem;
  --pros-24: 6rem;

  --polomer-sm: 3px;
  --polomer: 6px;
  --polomer-lg: 12px;
  --polomer-xl: 20px;

  --stin-sm: 0 1px 4px rgba(30,58,95,0.10);
  --stin: 0 3px 12px rgba(30,58,95,0.13);
  --stin-lg: 0 8px 28px rgba(30,58,95,0.18);

  --max-sirka: 1160px;
  --vysoka-nav: 68px;
  --prechod: 0.18s ease;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--pismo-text);
  font-size: var(--vel-zak);
  line-height: 1.65;
  color: var(--text-tmava);
  background-color: var(--krem);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: var(--modr-stred);
  text-decoration: underline;
  transition: color var(--prechod);
}

a:hover {
  color: var(--zlata);
}

a:focus-visible {
  outline: 2px solid var(--zlata);
  outline-offset: 3px;
  border-radius: var(--polomer-sm);
}

ul, ol {
  list-style: none;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--pismo-titulek);
  line-height: 1.25;
  color: var(--modr-tmava);
}

p {
  line-height: 1.7;
}

.obal {
  width: 100%;
  max-width: var(--max-sirka);
  margin-inline: auto;
  padding-inline: var(--pros-6);
}

.obal--uzky {
  max-width: 800px;
}

.obal--stredni {
  max-width: 980px;
}

.navigace {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: var(--modr-tmava);
  height: var(--vysoka-nav);
  border-bottom: 2px solid var(--zlata);
}

.navigace__vnitrni {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.navigace__logo {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-vel);
  font-weight: 700;
  color: var(--bila);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: var(--pros-3);
  letter-spacing: -0.01em;
  flex-shrink: 0;
}

.navigace__logo:hover {
  color: var(--zlata-svetla);
}

.navigace__logo-ozdoba {
  display: block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}

.navigace__seznam {
  display: flex;
  align-items: center;
  gap: var(--pros-1);
}

.navigace__odkaz {
  display: block;
  padding: var(--pros-2) var(--pros-4);
  font-size: var(--vel-sm);
  font-weight: 500;
  color: rgba(255,255,255,0.82);
  text-decoration: none;
  border-radius: var(--polomer);
  transition: background-color var(--prechod), color var(--prechod);
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.navigace__odkaz:hover,
.navigace__odkaz:focus-visible {
  background-color: rgba(255,255,255,0.10);
  color: var(--bila);
}

.navigace__odkaz--aktivni {
  color: var(--zlata-svetla);
  background-color: rgba(212,168,67,0.14);
}

.navigace__odkaz--aktivni:hover {
  color: var(--zlata-svetla);
  background-color: rgba(212,168,67,0.2);
}

.hrdina {
  background-color: var(--modr-tmava);
  padding-block: var(--pros-24) var(--pros-20);
  position: relative;
  overflow: hidden;
}

.hrdina__pozadi {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 70% 50%, rgba(42,80,130,0.6) 0%, transparent 65%);
  pointer-events: none;
}

.hrdina__vnitrni {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: var(--pros-12);
  align-items: center;
  position: relative;
  z-index: 1;
}

.hrdina__znaceni {
  display: inline-flex;
  align-items: center;
  gap: var(--pros-3);
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--zlata);
  margin-bottom: var(--pros-5);
}

.hrdina__znaceni-cara {
  display: block;
  width: 28px;
  height: 1.5px;
  background-color: var(--zlata);
}

.hrdina__titulek {
  font-size: var(--vel-hrdina);
  color: var(--bila);
  line-height: 1.1;
  margin-bottom: var(--pros-6);
}

.hrdina__titulek-akcent {
  color: var(--zlata);
}

.hrdina__popis {
  font-size: var(--vel-str);
  color: rgba(255,255,255,0.78);
  line-height: 1.72;
  max-width: 540px;
  margin-bottom: var(--pros-8);
}

.hrdina__akce {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pros-4);
  align-items: center;
}

.hrdina__vizual {
  display: flex;
  align-items: center;
  justify-content: center;
}

.tlacitko {
  display: inline-flex;
  align-items: center;
  gap: var(--pros-2);
  padding: 0.7rem var(--pros-6);
  border: 2px solid transparent;
  border-radius: var(--polomer);
  font-size: var(--vel-sm);
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background-color var(--prechod), border-color var(--prechod), color var(--prechod), box-shadow var(--prechod);
  letter-spacing: 0.02em;
}

.tlacitko:focus-visible {
  outline: 2px solid var(--zlata);
  outline-offset: 3px;
}

.tlacitko--zlate {
  background-color: var(--zlata);
  border-color: var(--zlata);
  color: var(--modr-tmava);
}

.tlacitko--zlate:hover {
  background-color: var(--zlata-svetla);
  border-color: var(--zlata-svetla);
  color: var(--modr-tmava);
  box-shadow: 0 4px 14px rgba(212,168,67,0.35);
}

.tlacitko--obrys-bila {
  background-color: transparent;
  border-color: rgba(255,255,255,0.38);
  color: rgba(255,255,255,0.90);
}

.tlacitko--obrys-bila:hover {
  border-color: rgba(255,255,255,0.75);
  background-color: rgba(255,255,255,0.08);
  color: var(--bila);
}

.tlacitko--navy {
  background-color: var(--modr-tmava);
  border-color: var(--modr-tmava);
  color: var(--bila);
}

.tlacitko--navy:hover {
  background-color: var(--modr-stred);
  border-color: var(--modr-stred);
  color: var(--bila);
}

.tlacitko--obrys-navy {
  background-color: transparent;
  border-color: var(--modr-tmava);
  color: var(--modr-tmava);
}

.tlacitko--obrys-navy:hover {
  background-color: var(--modr-tmava);
  border-color: var(--modr-tmava);
  color: var(--bila);
}

.sekce {
  padding-block: var(--pros-20);
}

.sekce--bila {
  background-color: var(--bila);
}

.sekce--krem {
  background-color: var(--krem);
}

.sekce--alt {
  background-color: var(--povrch-alt);
}

.sekce--navy {
  background-color: var(--modr-tmava);
}

.sekce--navy h2,
.sekce--navy h3,
.sekce--navy h4 {
  color: var(--bila);
}

.sekce--navy p {
  color: rgba(255,255,255,0.78);
}

.sekce__znacka {
  display: inline-block;
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--zlata);
  margin-bottom: var(--pros-3);
}

.sekce--navy .sekce__znacka {
  color: var(--zlata-svetla);
}

.sekce__titulek {
  font-size: var(--vel-h2);
  line-height: 1.22;
  margin-bottom: var(--pros-4);
}

.sekce__podtitulek {
  font-size: var(--vel-str);
  color: var(--text-svetla);
  line-height: 1.72;
  max-width: 640px;
}

.sekce--navy .sekce__podtitulek {
  color: rgba(255,255,255,0.70);
}

.sekce__hlava {
  margin-bottom: var(--pros-12);
}

.sekce__hlava--centrum {
  text-align: center;
  margin-inline: auto;
}

.sekce__hlava--centrum .sekce__podtitulek {
  margin-inline: auto;
}

.vlastnosti-mrizka {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pros-6);
}

.vlastnost-karta {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8);
  transition: box-shadow var(--prechod), transform var(--prechod);
}

.vlastnost-karta:hover {
  box-shadow: var(--stin-lg);
  transform: translateY(-3px);
}

.vlastnost-karta__ikona {
  width: 52px;
  height: 52px;
  background-color: var(--krem-tmava);
  border-radius: var(--polomer-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--pros-5);
  color: var(--modr-tmava);
}

.vlastnost-karta__nazev {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-3);
}

.vlastnost-karta__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.68;
}

.kroky-panel {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  overflow: hidden;
}

.krok-item {
  padding: var(--pros-8);
  border-right: 1px solid var(--ohraniceni);
  position: relative;
}

.krok-item:last-child {
  border-right: none;
}

.krok-item__cislo {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-h1);
  font-weight: 700;
  color: var(--modr-tmava);
  opacity: 0.10;
  line-height: 1;
  margin-bottom: var(--pros-4);
}

.krok-item__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-3);
}

.krok-item__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.65;
}

.krok-item--zvyrazneny {
  background-color: var(--modr-tmava);
}

.krok-item--zvyrazneny .krok-item__cislo {
  color: var(--zlata);
  opacity: 0.4;
}

.krok-item--zvyrazneny .krok-item__titulek {
  color: var(--bila);
}

.krok-item--zvyrazneny .krok-item__text {
  color: rgba(255,255,255,0.70);
}

.oblasti-mrizka {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pros-6);
}

.oblast-polozka {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8) var(--pros-8) var(--pros-8) var(--pros-6);
  display: flex;
  gap: var(--pros-5);
  align-items: flex-start;
  transition: box-shadow var(--prechod);
  border-left: 4px solid var(--modr-svetla);
}

.oblast-polozka:hover {
  box-shadow: var(--stin);
}

.oblast-polozka:nth-child(2) {
  border-left-color: var(--zlata);
}

.oblast-polozka:nth-child(3) {
  border-left-color: var(--modr-stred);
}

.oblast-polozka:nth-child(4) {
  border-left-color: var(--modr-tmava);
}

.oblast-polozka__cislo {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-h3);
  font-weight: 700;
  color: var(--modr-tmava);
  opacity: 0.18;
  line-height: 1;
  flex-shrink: 0;
  min-width: 40px;
}

.oblast-polozka__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-2);
}

.oblast-polozka__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.65;
}

.vyzva-pruh {
  background-color: var(--modr-tmava);
  padding-block: var(--pros-16);
  text-align: center;
}

.vyzva-pruh__titulek {
  font-size: var(--vel-h2);
  color: var(--bila);
  margin-bottom: var(--pros-4);
}

.vyzva-pruh__text {
  font-size: var(--vel-str);
  color: rgba(255,255,255,0.72);
  margin-bottom: var(--pros-8);
  max-width: 560px;
  margin-inline: auto;
  margin-bottom: var(--pros-8);
}

.vyzva-pruh__akce {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pros-4);
  justify-content: center;
}

.stranka-hlavicka {
  background-color: var(--modr-tmava);
  padding-block: var(--pros-16) var(--pros-12);
  position: relative;
  overflow: hidden;
}

.stranka-hlavicka::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 40%;
  height: 100%;
  background: linear-gradient(270deg, rgba(42,80,130,0.4) 0%, transparent 100%);
  pointer-events: none;
}

.stranka-hlavicka__znacka {
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--zlata);
  margin-bottom: var(--pros-4);
  display: block;
}

.stranka-hlavicka__titulek {
  font-size: var(--vel-h1);
  color: var(--bila);
  line-height: 1.15;
  margin-bottom: var(--pros-5);
  max-width: 700px;
  position: relative;
  z-index: 1;
}

.stranka-hlavicka__popis {
  font-size: var(--vel-str);
  color: rgba(255,255,255,0.73);
  max-width: 600px;
  line-height: 1.72;
  position: relative;
  z-index: 1;
}

.alternace-sekce {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pros-12);
  align-items: center;
  padding-block: var(--pros-16);
  border-bottom: 1px solid var(--ohraniceni);
}

.alternace-sekce:last-child {
  border-bottom: none;
}

.alternace-sekce--obracena {
  direction: rtl;
}

.alternace-sekce--obracena > * {
  direction: ltr;
}

.alternace-sekce__vizual {
  display: flex;
  align-items: center;
  justify-content: center;
}

.alternace-sekce__znacka {
  display: inline-block;
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--zlata);
  margin-bottom: var(--pros-3);
}

.alternace-sekce__titulek {
  font-size: var(--vel-h3);
  margin-bottom: var(--pros-4);
}

.alternace-sekce__text {
  font-size: var(--vel-str);
  color: var(--text-stred);
  line-height: 1.75;
  margin-bottom: var(--pros-5);
}

.alternace-sekce__seznam {
  display: flex;
  flex-direction: column;
  gap: var(--pros-3);
}

.alternace-sekce__bod {
  display: flex;
  align-items: flex-start;
  gap: var(--pros-3);
  font-size: var(--vel-sm);
  color: var(--text-stred);
}

.alternace-sekce__bod-tecka {
  display: block;
  width: 7px;
  height: 7px;
  background-color: var(--zlata);
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 7px;
}

.pristup-kroky {
  display: flex;
  flex-direction: column;
  gap: 0;
  counter-reset: pristup-pocitadlo;
}

.pristup-krok {
  display: flex;
  gap: var(--pros-6);
  padding-block: var(--pros-6);
  border-bottom: 1px solid var(--ohraniceni);
  counter-increment: pristup-pocitadlo;
}

.pristup-krok:last-child {
  border-bottom: none;
}

.pristup-krok__cislo {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  background-color: var(--modr-tmava);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--pismo-titulek);
  font-size: var(--vel-vel);
  font-weight: 700;
  color: var(--zlata);
}

.pristup-krok__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-2);
}

.pristup-krok__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.65;
}

.technicke-karty {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pros-6);
}

.technicka-karta {
  padding: var(--pros-8);
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  border-top: 3px solid var(--modr-tmava);
}

.technicka-karta:nth-child(2) {
  border-top-color: var(--zlata);
}

.technicka-karta:nth-child(3) {
  border-top-color: var(--modr-svetla);
}

.technicka-karta__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-3);
}

.technicka-karta__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.68;
}

.faq-sek {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background-color: var(--ohraniceni);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  overflow: hidden;
}

.faq-polozka {
  background-color: var(--bila);
}

.faq-vstup {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.faq-otazka {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pros-4);
  padding: var(--pros-5) var(--pros-6);
  cursor: pointer;
  font-family: var(--pismo-titulek);
  font-size: var(--vel-vel);
  font-weight: 400;
  color: var(--modr-tmava);
  user-select: none;
  transition: background-color var(--prechod);
}

.faq-otazka:hover {
  background-color: var(--krem);
}

.faq-sipka {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  transition: transform var(--prechod);
  color: var(--text-svetla);
}

.faq-vstup:checked + .faq-otazka .faq-sipka {
  transform: rotate(180deg);
}

.faq-vstup:checked + .faq-otazka {
  background-color: var(--krem);
}

.faq-odpoved {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.38s ease;
}

.faq-vstup:checked ~ .faq-odpoved {
  max-height: 500px;
}

.faq-odpoved__vnitrni {
  padding: var(--pros-4) var(--pros-6) var(--pros-6);
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.72;
  border-top: 1px solid var(--ohraniceni);
}

.upozorneni-panel {
  background-color: var(--zlata-bg);
  border: 1.5px solid var(--zlata);
  border-radius: var(--polomer-lg);
  padding: var(--pros-6) var(--pros-8);
  display: flex;
  gap: var(--pros-5);
  align-items: flex-start;
}

.upozorneni-panel__ikona {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  color: var(--zlata);
  margin-top: 1px;
}

.upozorneni-panel__titulek {
  font-size: var(--vel-vel);
  color: var(--modr-tmava);
  margin-bottom: var(--pros-2);
}

.upozorneni-panel__text {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.68;
}

.platforma-popis {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: var(--pros-12);
  align-items: start;
}

.platforma-popis__obsah h3 {
  font-size: var(--vel-vel);
  margin-top: var(--pros-6);
  margin-bottom: var(--pros-2);
}

.platforma-popis__obsah h3:first-child {
  margin-top: 0;
}

.platforma-popis__obsah p {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.72;
  margin-bottom: var(--pros-4);
}

.platforma-popis__bocni {
  background-color: var(--modr-tmava);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8);
  color: var(--bila);
  position: sticky;
  top: calc(var(--vysoka-nav) + var(--pros-6));
}

.platforma-popis__bocni h4 {
  color: var(--zlata-svetla);
  font-size: var(--vel-sm);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: var(--pros-4);
}

.platforma-popis__bocni ul {
  display: flex;
  flex-direction: column;
  gap: var(--pros-3);
}

.platforma-popis__bocni li {
  font-size: var(--vel-sm);
  color: rgba(255,255,255,0.80);
  padding-left: var(--pros-5);
  position: relative;
  line-height: 1.55;
}

.platforma-popis__bocni li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  background-color: var(--zlata);
  border-radius: 50%;
}

.stranky-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--pros-5);
}

.stranka-karta {
  display: block;
  padding: var(--pros-6);
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  text-decoration: none;
  transition: box-shadow var(--prechod), border-color var(--prechod), transform var(--prechod);
}

.stranka-karta:hover {
  box-shadow: var(--stin);
  border-color: var(--modr-svetla);
  transform: translateY(-2px);
}

.stranka-karta__titulek {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-vel);
  color: var(--modr-tmava);
  margin-bottom: var(--pros-2);
}

.stranka-karta__popis {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.6;
}

.stranka-karta__sipka {
  display: inline-block;
  margin-top: var(--pros-3);
  font-size: var(--vel-sm);
  color: var(--modr-stred);
  font-weight: 600;
}

.kontakt-obal {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: var(--pros-12);
  align-items: start;
}

.formular-obal {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8);
}

.formular-obal__titulek {
  font-size: var(--vel-h3);
  margin-bottom: var(--pros-6);
  padding-bottom: var(--pros-4);
  border-bottom: 1px solid var(--ohraniceni);
}

.formular {
  display: flex;
  flex-direction: column;
  gap: var(--pros-5);
}

.formular__rada {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pros-5);
}

.formular__pole {
  display: flex;
  flex-direction: column;
  gap: var(--pros-2);
}

.formular__stitek {
  font-size: var(--vel-sm);
  font-weight: 600;
  color: var(--modr-tmava);
  letter-spacing: 0.02em;
}

.formular__vstup,
.formular__vyber,
.formular__textarea {
  padding: 0.65rem var(--pros-4);
  border: 1.5px solid var(--ohraniceni);
  border-radius: var(--polomer);
  background-color: var(--bila);
  color: var(--text-tmava);
  font-size: var(--vel-zak);
  transition: border-color var(--prechod), box-shadow var(--prechod);
  width: 100%;
}

.formular__vstup:focus,
.formular__vyber:focus,
.formular__textarea:focus {
  outline: none;
  border-color: var(--modr-stred);
  box-shadow: 0 0 0 3px rgba(42,80,130,0.12);
}

.formular__vstup::placeholder,
.formular__textarea::placeholder {
  color: var(--text-jemna);
}

.formular__textarea {
  resize: vertical;
  min-height: 130px;
}

.formular__vyber {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235a6474' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 2.5rem;
  cursor: pointer;
}

.formular__nota {
  font-size: var(--vel-xs);
  color: var(--text-jemna);
  line-height: 1.55;
}

.kontakt-info-panel {
  background-color: var(--modr-tmava);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8);
  color: var(--bila);
}

.kontakt-info-panel__titulek {
  font-size: var(--vel-vel);
  color: var(--bila);
  margin-bottom: var(--pros-6);
  padding-bottom: var(--pros-4);
  border-bottom: 1px solid rgba(255,255,255,0.14);
}

.kontakt-polozka {
  display: flex;
  align-items: flex-start;
  gap: var(--pros-4);
  margin-bottom: var(--pros-5);
}

.kontakt-polozka:last-child {
  margin-bottom: 0;
}

.kontakt-polozka__znacka {
  width: 38px;
  height: 38px;
  background-color: rgba(212,168,67,0.18);
  border-radius: var(--polomer);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--zlata);
}

.kontakt-polozka__nadpis {
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--zlata-svetla);
  margin-bottom: var(--pros-1);
}

.kontakt-polozka__hodnota {
  font-size: var(--vel-sm);
  color: rgba(255,255,255,0.83);
  line-height: 1.55;
}

.kontakt-polozka__hodnota a {
  color: rgba(255,255,255,0.83);
  text-decoration: underline;
}

.kontakt-polozka__hodnota a:hover {
  color: var(--zlata-svetla);
}

.zpracovani-kroky {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pros-6);
}

.zpracovani-krok {
  text-align: center;
  padding: var(--pros-6);
}

.zpracovani-krok__cislo {
  width: 56px;
  height: 56px;
  background-color: var(--modr-tmava);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--pros-4);
  font-family: var(--pismo-titulek);
  font-size: var(--vel-vel);
  font-weight: 700;
  color: var(--zlata);
}

.zpracovani-krok__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-2);
}

.zpracovani-krok__text {
  font-size: var(--vel-sm);
  color: var(--text-svetla);
  line-height: 1.65;
}

.pravni-layout {
  display: grid;
  grid-template-columns: 1fr 260px;
  gap: var(--pros-12);
  align-items: start;
}

.pravni-telo {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-10);
}

.pravni-telo h2 {
  font-size: var(--vel-h3);
  margin-top: var(--pros-10);
  margin-bottom: var(--pros-4);
  padding-top: var(--pros-6);
  border-top: 1px solid var(--ohraniceni);
}

.pravni-telo h2:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.pravni-telo h3 {
  font-size: var(--vel-vel);
  margin-top: var(--pros-6);
  margin-bottom: var(--pros-3);
}

.pravni-telo p {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.75;
  margin-bottom: var(--pros-4);
}

.pravni-telo ul {
  list-style: disc;
  padding-left: var(--pros-6);
  margin-bottom: var(--pros-4);
}

.pravni-telo ul li {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.7;
  margin-bottom: var(--pros-2);
}

.pravni-nav {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-6);
  position: sticky;
  top: calc(var(--vysoka-nav) + var(--pros-6));
}

.pravni-nav__nadpis {
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-svetla);
  margin-bottom: var(--pros-4);
}

.pravni-nav__seznam {
  display: flex;
  flex-direction: column;
  gap: var(--pros-2);
  margin-bottom: var(--pros-6);
  padding-bottom: var(--pros-5);
  border-bottom: 1px solid var(--ohraniceni);
}

.pravni-nav__odkaz {
  font-size: var(--vel-sm);
  color: var(--modr-stred);
  text-decoration: none;
  padding: var(--pros-2) var(--pros-3);
  border-radius: var(--polomer);
  transition: background-color var(--prechod);
  display: block;
}

.pravni-nav__odkaz:hover {
  background-color: var(--krem);
}

.pravni-nav__stranky {
  display: flex;
  flex-direction: column;
  gap: var(--pros-2);
}

.paticka {
  background-color: var(--paticka-bg);
  color: rgba(255,255,255,0.72);
  padding-top: var(--pros-16);
}

.paticka__mrizka {
  display: grid;
  grid-template-columns: 280px 1fr 1fr 1fr;
  gap: var(--pros-8);
  padding-bottom: var(--pros-12);
  border-bottom: 1px solid rgba(255,255,255,0.09);
}

.paticka__znacka-odkaz {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-h4);
  font-weight: 700;
  color: var(--bila);
  text-decoration: none;
  display: block;
  margin-bottom: var(--pros-4);
}

.paticka__znacka-odkaz:hover {
  color: var(--zlata-svetla);
}

.paticka__znacka-text {
  font-size: var(--vel-sm);
  line-height: 1.65;
  margin-bottom: var(--pros-5);
  color: rgba(255,255,255,0.58);
}

.paticka__skupina-nazev {
  font-size: var(--vel-xs);
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--zlata-svetla);
  margin-bottom: var(--pros-4);
}

.paticka__skupina-seznam {
  display: flex;
  flex-direction: column;
  gap: var(--pros-2);
}

.paticka__odkaz {
  font-size: var(--vel-sm);
  color: rgba(255,255,255,0.62);
  text-decoration: none;
  transition: color var(--prechod);
  line-height: 1.5;
  display: block;
}

.paticka__odkaz:hover {
  color: var(--zlata-svetla);
}

.paticka__text-radek {
  font-size: var(--vel-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
}

.paticka__spodni {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--pros-5);
  gap: var(--pros-4);
}

.paticka__copyright {
  font-size: var(--vel-xs);
  color: rgba(255,255,255,0.40);
}

.paticka__pravni-odkazy {
  display: flex;
  gap: var(--pros-5);
}

.paticka__pravni-odkaz {
  font-size: var(--vel-xs);
  color: rgba(255,255,255,0.50);
  text-decoration: none;
  transition: color var(--prechod);
}

.paticka__pravni-odkaz:hover {
  color: var(--zlata-svetla);
}

.oddelovac {
  height: 1px;
  background-color: var(--ohraniceni);
  margin-block: var(--pros-10);
}

.text-centrum { text-align: center; }
.text-muted { color: var(--text-svetla); }

.mt-4 { margin-top: var(--pros-4); }
.mt-6 { margin-top: var(--pros-6); }
.mt-8 { margin-top: var(--pros-8); }
.mt-10 { margin-top: var(--pros-10); }
.mb-4 { margin-bottom: var(--pros-4); }
.mb-6 { margin-bottom: var(--pros-6); }
.mb-8 { margin-bottom: var(--pros-8); }

.doplnujici-obsah {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pros-8);
}

.doplnujici-blok {
  background-color: var(--bila);
  border: 1px solid var(--ohraniceni);
  border-radius: var(--polomer-lg);
  padding: var(--pros-8);
}

.doplnujici-blok__titulek {
  font-size: var(--vel-vel);
  margin-bottom: var(--pros-4);
  padding-bottom: var(--pros-3);
  border-bottom: 2px solid var(--zlata);
  display: inline-block;
}

.doplnujici-blok__text {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.72;
}

.doplnujici-blok__text p {
  margin-bottom: var(--pros-3);
}

.terminologie-tabulka {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.terminologie-radek {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: var(--pros-4);
  padding-block: var(--pros-4);
  border-bottom: 1px solid var(--ohraniceni);
}

.terminologie-radek:last-child {
  border-bottom: none;
}

.terminologie-radek__pojem {
  font-family: var(--pismo-titulek);
  font-size: var(--vel-sm);
  font-weight: 700;
  color: var(--modr-tmava);
}

.terminologie-radek__definice {
  font-size: var(--vel-sm);
  color: var(--text-stred);
  line-height: 1.65;
}

.odkaz-skupina {
  display: flex;
  gap: var(--pros-6);
  justify-content: center;
  flex-wrap: wrap;
}

.odkaz-skupina__polozka {
  font-size: var(--vel-sm);
  color: var(--modr-stred);
  text-decoration: none;
  transition: color var(--prechod);
}

.odkaz-skupina__polozka:hover {
  color: var(--zlata);
}

@media (max-width: 1024px) {
  :root {
    --vel-hrdina: 2.75rem;
    --vel-h1: 2.5rem;
    --vel-h2: 1.875rem;
  }

  .hrdina__vnitrni {
    grid-template-columns: 1fr;
  }

  .hrdina__vizual {
    display: none;
  }

  .vlastnosti-mrizka {
    grid-template-columns: 1fr 1fr;
  }

  .kroky-panel {
    grid-template-columns: 1fr 1fr;
  }

  .krok-item {
    border-right: none;
    border-bottom: 1px solid var(--ohraniceni);
  }

  .krok-item:nth-child(odd) {
    border-right: 1px solid var(--ohraniceni);
  }

  .krok-item:nth-last-child(-n+2):nth-child(odd) {
    border-bottom: none;
  }

  .krok-item:last-child {
    border-bottom: none;
    border-right: none;
  }

  .oblasti-mrizka {
    grid-template-columns: 1fr;
  }

  .alternace-sekce {
    grid-template-columns: 1fr;
  }

  .alternace-sekce--obracena {
    direction: ltr;
  }

  .platforma-popis {
    grid-template-columns: 1fr;
  }

  .platforma-popis__bocni {
    position: static;
  }

  .kontakt-obal {
    grid-template-columns: 1fr;
  }

  .zpracovani-kroky {
    grid-template-columns: 1fr 1fr;
  }

  .paticka__mrizka {
    grid-template-columns: 1fr 1fr;
  }

  .stranky-grid {
    grid-template-columns: 1fr 1fr;
  }

  .pravni-layout {
    grid-template-columns: 1fr;
  }

  .pravni-nav {
    position: static;
  }

  .technicke-karty {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  :root {
    --vel-hrdina: 2.2rem;
    --vel-h1: 2rem;
    --vel-h2: 1.625rem;
    --vel-h3: 1.375rem;
    --pros-20: 3.5rem;
    --pros-24: 4rem;
    --pros-16: 3rem;
    --pros-12: 2.5rem;
  }

  .obal {
    padding-inline: var(--pros-4);
  }

  .navigace__seznam {
    flex-wrap: wrap;
    gap: var(--pros-1);
    padding-block: var(--pros-2);
  }

  .navigace {
    height: auto;
    padding-block: var(--pros-3);
  }

  .navigace__vnitrni {
    flex-wrap: wrap;
    gap: var(--pros-3);
  }

  .navigace__seznam {
    width: 100%;
    border-top: 1px solid rgba(255,255,255,0.10);
    padding-top: var(--pros-2);
  }

  .navigace__odkaz {
    font-size: var(--vel-xs);
    padding: var(--pros-2) var(--pros-3);
  }

  .hrdina {
    padding-block: var(--pros-12);
  }

  .hrdina__titulek {
    font-size: var(--vel-hrdina);
  }

  .hrdina__akce {
    flex-direction: column;
    align-items: flex-start;
  }

  .vlastnosti-mrizka {
    grid-template-columns: 1fr;
  }

  .kroky-panel {
    grid-template-columns: 1fr;
  }

  .krok-item {
    border-right: none;
  }

  .krok-item:nth-child(odd) {
    border-right: none;
  }

  .krok-item:last-child {
    border-bottom: none;
  }

  .oblasti-mrizka {
    grid-template-columns: 1fr;
  }

  .formular__rada {
    grid-template-columns: 1fr;
  }

  .zpracovani-kroky {
    grid-template-columns: 1fr;
  }

  .paticka__mrizka {
    grid-template-columns: 1fr;
  }

  .paticka__spodni {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--pros-3);
  }

  .stranky-grid {
    grid-template-columns: 1fr;
  }

  .technicke-karty {
    grid-template-columns: 1fr;
  }

  .doplnujici-obsah {
    grid-template-columns: 1fr;
  }

  .vyzva-pruh__akce {
    flex-direction: column;
    align-items: center;
  }

  .upozorneni-panel {
    flex-direction: column;
  }

  .faq-otazka {
    font-size: var(--vel-zak);
  }

  .terminologie-radek {
    grid-template-columns: 1fr;
    gap: var(--pros-2);
  }
}
