:root{
  color-scheme: light;

  --pozadi:#F7F8FA;
  --povrch:#FFFFFF;
  --povrch-tlumeny:#F0F3F7;
  --linka:#DFE4EC;
  --linka-silna:#C3CCDA;

  --text:#14181F;
  --text-tlumeny:#5A6472;
  --text-slaby:#8792A3;

  --znacka:#003DA5;
  --znacka-svetla:#1E6BD6;
  --znacka-pozadi:#EBF1FB;

  --kriticka:#B3261E;
  --kriticka-pozadi:#FCECEA;
  --vazna:#B25000;
  --vazna-pozadi:#FDF0E4;
  --stredni:#7A6200;
  --stredni-pozadi:#FBF5DE;
  --dobra:#1B6B3A;
  --dobra-pozadi:#E8F4EC;

  --pismo:'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --pismo-mono:ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, monospace;

  --v0:.8125rem; --v1:.9375rem; --v2:1.0625rem; --v3:1.375rem;
  --v4:1.75rem;  --v5:2.25rem;  --v6:3rem;

  --mezera:5rem;
  --max:1120px;
  --max-text:68ch;
  --radius:10px;
  --stin:0 1px 2px rgba(20,24,31,.05), 0 8px 24px -12px rgba(20,24,31,.12);
}


@font-face{font-family:'Public Sans';
  src:url('../fonty/public-sans-latin-ext-wght-normal.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap;
  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:'Public Sans';
  src:url('../fonty/public-sans-latin-wght-normal.woff2') format('woff2-variations');
  font-weight:100 900;font-style:normal;font-display:swap;
  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;}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}

body{
  margin:0;background:var(--pozadi);color:var(--text);
  font-family:var(--pismo);font-size:var(--v2);line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}

h1,h2,h3,h4{line-height:1.2;margin:0;font-weight:650;letter-spacing:-.02em}
h1{font-size:var(--v6)}
h2{font-size:var(--v5)}
h3{font-size:var(--v3)}
h4{font-size:var(--v2)}
p{margin:0 0 1rem;max-width:var(--max-text)}
ul,ol{margin:0 0 1rem;padding-left:1.25rem;max-width:var(--max-text)}
li{margin-bottom:.4rem}
li::marker{color:var(--text-slaby)}
a{color:var(--znacka);text-underline-offset:.18em}
a:hover{color:var(--znacka-svetla)}
:focus-visible{outline:3px solid var(--znacka-svetla);outline-offset:2px;border-radius:3px}
code{font-family:var(--pismo-mono);font-size:.86em;background:var(--povrch-tlumeny);
     padding:.12em .38em;border-radius:4px;border:1px solid var(--linka);word-break:break-word}
strong{font-weight:650}

.obal{max-width:var(--max);margin-inline:auto;padding-inline:1.5rem}

/* ---------- přeskočit na obsah ---------- */
.preskocit{position:absolute;left:-9999px;top:0;background:var(--znacka);color:#fff;
  padding:.75rem 1.25rem;z-index:100;border-radius:0 0 var(--radius) 0}
.preskocit:focus{left:0}

/* ---------- hlavička ---------- */
.hlavicka{background:var(--povrch);border-bottom:1px solid var(--linka);
  position:sticky;top:0;z-index:50}
.hlavicka__vnitrek{display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:4rem;flex-wrap:wrap}
.znacka-blok{display:flex;align-items:baseline;gap:.6rem;font-weight:650;letter-spacing:-.02em}
.znacka-blok span:first-child{color:var(--znacka)}
.znacka-blok span:last-child{color:var(--text-slaby);font-weight:450;font-size:var(--v1)}
.hlavicka nav{display:flex;gap:.25rem;flex-wrap:wrap}
.hlavicka nav a{font-size:var(--v0);color:var(--text-tlumeny);text-decoration:none;
  padding:.4rem .6rem;border-radius:6px;white-space:nowrap}
.hlavicka nav a:hover{background:var(--povrch-tlumeny);color:var(--text)}

/* ---------- titulní blok ---------- */
.titul{padding:4.5rem 0 3rem;background:var(--povrch);border-bottom:1px solid var(--linka)}
.titul__stitek{display:inline-block;font-size:var(--v0);font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--znacka);background:var(--znacka-pozadi);
  padding:.3rem .7rem;border-radius:999px;margin-bottom:1.25rem}
.titul h1{max-width:20ch;margin-bottom:1.25rem}
.titul__perex{font-size:var(--v3);color:var(--text-tlumeny);max-width:60ch;line-height:1.5}
.titul__meta{display:flex;gap:2rem;flex-wrap:wrap;margin-top:2rem;padding-top:1.5rem;
  border-top:1px solid var(--linka);font-size:var(--v0);color:var(--text-slaby)}
.titul__meta b{display:block;color:var(--text);font-weight:600;font-size:var(--v1);margin-top:.15rem}

/* ---------- skóre ---------- */
.skore{display:grid;grid-template-columns:minmax(220px,280px) 1fr;gap:2.5rem;align-items:start;
  background:var(--povrch);border:1px solid var(--linka);border-radius:var(--radius);
  padding:2rem;box-shadow:var(--stin)}
.skore__cislo{text-align:center}
.skore__hodnota{font-size:4.5rem;line-height:1;font-weight:700;color:var(--kriticka);
  letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.skore__hodnota sup{font-size:1.5rem;font-weight:500;color:var(--text-slaby);
  letter-spacing:0;margin-left:.15rem}
.skore__popis{font-size:var(--v0);color:var(--text-tlumeny);margin-top:.5rem}
.pruhy{display:grid;gap:.9rem}
.pruh__hlava{display:flex;justify-content:space-between;align-items:baseline;
  font-size:var(--v1);margin-bottom:.3rem;gap:1rem}
.pruh__hlava b{font-weight:600}
.pruh__hlava span{color:var(--text-slaby);font-size:var(--v0);font-variant-numeric:tabular-nums}
.pruh__drah{height:9px;background:var(--povrch-tlumeny);border-radius:999px;overflow:hidden}
.pruh__vypln{height:100%;border-radius:999px;background:var(--znacka)}
.pruh__vypln.je-kriticka{background:var(--kriticka)}
.pruh__vypln.je-vazna{background:var(--vazna)}
.pruh__vypln.je-stredni{background:var(--stredni)}
.pruh__vypln.je-dobra{background:var(--dobra)}

/* ---------- sekce ---------- */
.sekce{padding:var(--mezera) 0;border-top:1px solid var(--linka)}
.sekce:first-of-type{border-top:0}
.sekce__hlava{margin-bottom:2.5rem}
.sekce__cislo{font-size:var(--v0);font-weight:600;letter-spacing:.1em;
  color:var(--text-slaby);font-variant-numeric:tabular-nums;display:block;margin-bottom:.6rem}
.sekce__hlava h2{margin-bottom:.75rem}
.sekce__hlava p{font-size:var(--v3);color:var(--text-tlumeny);line-height:1.5;max-width:62ch}

/* ---------- karty nálezů ---------- */
.nalez{background:var(--povrch);border:1px solid var(--linka);border-left:4px solid var(--linka-silna);
  border-radius:var(--radius);padding:1.5rem 1.75rem;margin-bottom:1rem;box-shadow:var(--stin)}
.nalez.je-kriticka{border-left-color:var(--kriticka)}
.nalez.je-vazna{border-left-color:var(--vazna)}
.nalez.je-stredni{border-left-color:var(--stredni)}
.nalez.je-dobra{border-left-color:var(--dobra)}
.nalez__hlava{display:flex;align-items:flex-start;gap:1rem;justify-content:space-between;
  flex-wrap:wrap;margin-bottom:.6rem}
.nalez h3{font-size:var(--v2);font-weight:650}
.nalez p:last-child{margin-bottom:0}
.nalez ul:last-child,.nalez ol:last-child{margin-bottom:0}

.stitek{font-size:.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  padding:.25rem .55rem;border-radius:5px;white-space:nowrap;flex-shrink:0}
.stitek.je-kriticka{color:var(--kriticka);background:var(--kriticka-pozadi)}
.stitek.je-vazna{color:var(--vazna);background:var(--vazna-pozadi)}
.stitek.je-stredni{color:var(--stredni);background:var(--stredni-pozadi)}
.stitek.je-dobra{color:var(--dobra);background:var(--dobra-pozadi)}

/* ---------- tabulky ---------- */
.tabulka-obal{overflow-x:auto;margin:0 0 1.5rem;border:1px solid var(--linka);
  border-radius:var(--radius);background:var(--povrch)}
table{border-collapse:collapse;width:100%;font-size:var(--v1);min-width:min(100%,520px)}
th,td{text-align:left;padding:.7rem 1rem;border-bottom:1px solid var(--linka);vertical-align:top}
thead th{background:var(--povrch-tlumeny);font-size:var(--v0);font-weight:650;
  letter-spacing:.02em;color:var(--text-tlumeny);white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
td.cislo,th.cislo{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.spatne{color:var(--kriticka);font-weight:600}
.dobre{color:var(--dobra);font-weight:600}
.varovne{color:var(--vazna);font-weight:600}

/* ---------- doporučení ---------- */
.doporuceni{background:var(--znacka-pozadi);border:1px solid #CBDCF6;
  border-radius:var(--radius);padding:1.75rem 2rem;margin-top:2rem}
.doporuceni__hlava{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.doporuceni__hlava h3{font-size:var(--v2);color:var(--znacka);font-weight:650}
.doporuceni__ikona{width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--znacka)}
.doporuceni ol{counter-reset:krok;list-style:none;padding-left:0;margin-bottom:0;max-width:none}
.doporuceni ol li{counter-increment:krok;position:relative;padding-left:2.25rem;margin-bottom:.85rem}
.doporuceni ol li::before{content:counter(krok);position:absolute;left:0;top:.05rem;
  width:1.6rem;height:1.6rem;background:var(--znacka);color:#fff;border-radius:50%;
  display:grid;place-items:center;font-size:var(--v0);font-weight:700;
  font-variant-numeric:tabular-nums}
.doporuceni ol li:last-child{margin-bottom:0}
.doporuceni__poznamka{margin-top:1.25rem;padding-top:1rem;border-top:1px solid #CBDCF6;
  font-size:var(--v1);color:var(--text-tlumeny)}
.doporuceni__poznamka p:last-child{margin-bottom:0}
.narocnost{display:inline-block;font-size:var(--v0);font-weight:600;color:var(--znacka);
  background:var(--povrch);border:1px solid #CBDCF6;padding:.15rem .5rem;border-radius:5px;
  margin-left:.4rem;white-space:nowrap}

/* ---------- mřížky ---------- */
.mrizka-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}
.mrizka-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem}

.udaj{background:var(--povrch);border:1px solid var(--linka);border-radius:var(--radius);
  padding:1.25rem 1.5rem;box-shadow:var(--stin)}
.udaj__hodnota{font-size:var(--v5);font-weight:700;line-height:1.1;letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;margin-bottom:.35rem}
.udaj__hodnota.je-kriticka{color:var(--kriticka)}
.udaj__hodnota.je-vazna{color:var(--vazna)}
.udaj__hodnota.je-dobra{color:var(--dobra)}
.udaj__popis{font-size:var(--v0);color:var(--text-tlumeny);line-height:1.45}

/* ---------- citace / ukázka ---------- */
.ukazka{background:var(--povrch-tlumeny);border:1px solid var(--linka);border-radius:var(--radius);
  padding:1.25rem 1.5rem;margin:0 0 1.5rem;font-family:var(--pismo-mono);
  font-size:var(--v0);line-height:1.6;overflow-x:auto;white-space:pre-wrap;word-break:break-word}
.ukazka b{font-family:var(--pismo);font-weight:650}

.srovnani{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}
.srovnani>div{border-radius:var(--radius);padding:1.25rem 1.5rem;border:1px solid var(--linka)}
.srovnani__spatne{background:var(--kriticka-pozadi);border-color:#F3D3CF !important}
.srovnani__dobre{background:var(--dobra-pozadi);border-color:#CCE5D5 !important}
.srovnani h4{font-size:var(--v0);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem}
.srovnani__spatne h4{color:var(--kriticka)}
.srovnani__dobre h4{color:var(--dobra)}
.srovnani p:last-child{margin-bottom:0}
@media (max-width:640px){.srovnani{grid-template-columns:1fr}}

/* ---------- plán ---------- */
.vlna{background:var(--povrch);border:1px solid var(--linka);border-radius:var(--radius);
  padding:1.75rem 2rem;margin-bottom:1rem;box-shadow:var(--stin)}
.vlna__hlava{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;margin-bottom:.35rem}
.vlna__hlava h3{font-size:var(--v3)}
.vlna__cas{font-size:var(--v0);font-weight:600;color:var(--znacka);
  background:var(--znacka-pozadi);padding:.2rem .6rem;border-radius:999px}
.vlna__cil{color:var(--text-tlumeny);font-size:var(--v1);margin-bottom:1.25rem}
.vlna ol{padding-left:1.35rem;margin-bottom:0}
.vlna ol li{margin-bottom:.55rem}

/* ---------- patička ---------- */
.paticka{background:var(--povrch);border-top:1px solid var(--linka);
  padding:3rem 0;margin-top:var(--mezera);font-size:var(--v1);color:var(--text-tlumeny)}
.paticka p{max-width:none}
.paticka__radek{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;
  padding-top:1.5rem;margin-top:1.5rem;border-top:1px solid var(--linka);font-size:var(--v0)}

@media (max-width:820px){
  :root{--mezera:3.5rem;--v6:2.25rem;--v5:1.75rem;--v4:1.5rem;--v3:1.1875rem}
  .skore{grid-template-columns:1fr;gap:2rem;padding:1.5rem}
  .titul{padding:3rem 0 2.5rem}
  .nalez,.doporuceni,.vlna{padding-inline:1.25rem}
  .hlavicka nav{display:none}
}
