/* Spoločný štýl pre podstránky (ochrana údajov, chybová stránka) */
:root{
  --ground:#F4F7F8; --surface:#FFFFFF; --deep:#0E323F;
  --ink:#122129; --ink-2:#41565F; --ink-3:#6E858E;
  --line:#DBE5E9; --line-2:#C6D6DB;
  --brand:#0E5C7A; --brand-2:#1B8AAE; --brand-soft:#E1F0F5;
  --signal:#CE5044;
  --on-deep:#EAF3F6; --on-deep-2:#A9C4CE; --on-brand:#FFFFFF;
  --note-bg:#FBF1DF; --note-line:#E3CFA4; --note-ink:#6B5424;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#0A1317; --surface:#101E24; --deep:#0B1D24;
    --ink:#E7F1F4; --ink-2:#AAC0C8; --ink-3:#7E969E;
    --line:#20353E; --line-2:#2C4650;
    --brand:#4FB4D6; --brand-2:#83D2E8; --brand-soft:#122B35;
    --signal:#EA7E71; --on-brand:#07161C;
    --note-bg:#241C0F; --note-line:#4A3A1C; --note-ink:#E0B978;
  }
}
:root[data-theme="dark"]{
  --ground:#0A1317; --surface:#101E24; --deep:#0B1D24;
  --ink:#E7F1F4; --ink-2:#AAC0C8; --ink-3:#7E969E;
  --line:#20353E; --line-2:#2C4650;
  --brand:#4FB4D6; --brand-2:#83D2E8; --brand-soft:#122B35;
  --signal:#EA7E71; --on-brand:#07161C;
  --note-bg:#241C0F; --note-line:#4A3A1C; --note-ink:#E0B978;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:var(--f-body); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--f-display); margin:0; line-height:1.15; letter-spacing:-.02em; text-wrap:balance}
p{margin:0}
ul,ol{margin:0; padding:0}
a{color:var(--brand)}
:focus-visible{outline:2px solid var(--brand-2); outline-offset:3px; border-radius:4px}
.wrap{max-width:780px; margin:0 auto; padding:0 24px}

/* hlavička */
header.bar{background:var(--surface); border-bottom:1px solid var(--line)}
header.bar .wrap{display:flex; align-items:center; gap:12px; min-height:76px; max-width:1140px}
.brand{display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none;
  font-family:var(--f-display); font-weight:800; font-size:21px; letter-spacing:-.03em}
.brand svg{width:36px; height:36px; flex:none}
.brand small{display:block; font-family:var(--f-mono); font-weight:400; font-size:9.5px;
  letter-spacing:.10em; color:var(--ink-3); text-transform:uppercase; margin-top:2px; white-space:nowrap}
.back{margin-left:auto; font-family:var(--f-display); font-weight:600; font-size:15px; text-decoration:none}

main{padding:56px 0 72px}
.eyebrow{font-family:var(--f-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brand); display:flex; align-items:center; gap:10px}
.eyebrow::before{content:""; width:22px; height:2px; background:var(--brand); flex:none}
h1{font-size:clamp(28px,4vw,40px); font-weight:800; margin:16px 0 10px; letter-spacing:-.03em}
.updated{font-family:var(--f-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3)}

h2{font-size:21px; margin:38px 0 12px}
h3{font-size:17px; margin:22px 0 8px}
main p{color:var(--ink-2); margin-bottom:12px}
main ul{list-style:none; display:grid; gap:9px; margin:0 0 14px}
main ul li{display:flex; gap:12px; color:var(--ink-2)}
main ul li::before{content:""; flex:none; width:7px; height:7px; margin-top:10px;
  background:var(--brand); transform:rotate(45deg); border-radius:2px}
main li b{color:var(--ink); font-weight:600}

.note{display:flex; gap:12px; background:var(--note-bg); border:1px dashed var(--note-line);
  color:var(--note-ink); border-radius:10px; padding:16px 18px; margin:26px 0; font-size:15.5px; align-items:flex-start}
.note svg{width:18px; height:18px; flex:none; margin-top:3px; stroke:currentColor; fill:none;
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.note b{display:block; font-family:var(--f-display); margin-bottom:3px}

.card{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:22px 26px; margin:18px 0}
.card p{margin-bottom:6px}
.card p:last-child{margin-bottom:0}

footer.site{background:var(--deep); color:var(--on-deep-2); padding:34px 0; font-size:14.5px}
footer.site .wrap{display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; max-width:1140px}
footer.site a{color:var(--on-deep)}

/* chybová stránka */
.err{min-height:60vh; display:flex; flex-direction:column; justify-content:center; text-align:left}
.err .code{font-family:var(--f-mono); font-size:13px; letter-spacing:.2em; color:var(--signal)}
.btn{display:inline-flex; align-items:center; gap:9px; margin-top:26px; align-self:flex-start;
  background:var(--brand); color:var(--on-brand); text-decoration:none;
  font-family:var(--f-display); font-weight:600; font-size:15px; padding:13px 22px; border-radius:8px}
.btn:hover{background:var(--brand-2)}

@media (max-width:620px){ body{font-size:16px} main{padding:40px 0 56px} }
@media (prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important} }
