:root{
  --paper:#F3F2EF; --surface:#FFFFFF; --surface-2:#EDECE7;
  --ink:#19212C; --muted:#5D6774; --line:#D7D6D0; --line-strong:#B9B8B1;
  --rail:#A8322D; --blue:#2E4A78;
  --max:1180px; --text:760px;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#12161D; --surface:#1A2028; --surface-2:#222932;
    --ink:#E7E8E4; --muted:#98A2AE; --line:#2A313B; --line-strong:#3B444F;
    --rail:#DE7A68; --blue:#8FAAD6;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
  font-size:18px; line-height:1.68; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.cond{font-family:"Barlow Condensed","Arial Narrow",Helvetica,sans-serif;font-weight:600;text-wrap:balance;letter-spacing:.01em;line-height:1.15}
.mono{font-family:"IBM Plex Mono",ui-monospace,"Courier New",monospace}
a{color:var(--blue)}
a:hover{color:var(--rail)}
:focus-visible{outline:2px solid var(--rail);outline-offset:3px}
img{max-width:100%;height:auto}

/* hlavicka */
.masthead{border-bottom:2px solid var(--ink);background:var(--surface)}
.mast-inner{max-width:var(--max);margin:0 auto;padding:24px 20px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.wordmark{display:flex;align-items:baseline;gap:11px;text-decoration:none;color:inherit}
.wordmark .name{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:clamp(30px,5vw,48px);text-transform:uppercase;letter-spacing:.03em;line-height:.95;margin:0}
.wordmark .dot{width:9px;height:9px;background:var(--rail);border-radius:50%;flex:none;margin-bottom:7px}
.tagline{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--muted);letter-spacing:.09em;text-transform:uppercase;max-width:36ch;line-height:1.6}
nav{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.nav-inner{max-width:var(--max);margin:0 auto;padding:0 20px;display:flex;gap:2px;overflow-x:auto}
nav a{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:13px 14px;white-space:nowrap;border-bottom:3px solid transparent;text-decoration:none}
nav a:hover{color:var(--ink)}
nav a.on{color:var(--ink);border-bottom-color:var(--rail)}

main{max-width:var(--max);margin:0 auto;padding:0 20px 90px}
.uzky{max-width:var(--text)}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--rail);margin:0 0 10px}
.lede{font-size:20px;line-height:1.6;color:var(--muted);max-width:62ch}
hr.rule{height:1px;background:var(--line);border:0;margin:44px 0}

/* clanek */
article h1{font-size:clamp(32px,5vw,48px);margin:0 0 12px}
.meta-radek{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 30px}
article p{max-width:66ch}
article h2{font-size:28px;margin:44px 0 10px;padding-top:6px;border-top:1px solid var(--line)}
article h3{font-size:22px;margin:32px 0 6px}
article ul,article ol{max-width:66ch;padding-left:22px}
article li{margin-bottom:10px}
article blockquote{border-left:3px solid var(--rail);margin:24px 0;padding:2px 0 2px 20px;color:var(--muted)}
article table{border-collapse:collapse;width:100%;font-size:16px}
article td,article th{border-bottom:1px solid var(--line);padding:9px 12px 9px 0;text-align:left;vertical-align:top}
.tableWrap{overflow-x:auto}

/* vypisy */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:900px){.cards{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:2px;padding:22px;display:flex;flex-direction:column;gap:9px;text-decoration:none;color:inherit}
.card:hover{border-color:var(--rail)}
.card .kicker{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.card h3{font-size:21px;margin:0}
.card p{font-size:15.5px;color:var(--muted);margin:0;line-height:1.6}
.arts{display:flex;flex-direction:column}
.art{padding:24px 0;border-bottom:1px solid var(--line)}
.art a{text-decoration:none;color:inherit}
.art a:hover h3{color:var(--rail)}
.art h3{font-size:24px;margin:0 0 6px}
.art p{margin:0;color:var(--muted);font-size:16.5px;max-width:70ch}
.art .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}

/* hero */
.hero{padding:50px 0 40px;max-width:var(--text)}
.hero h1{font-size:clamp(34px,6vw,60px);line-height:1.05;margin:0 0 18px;text-transform:none;font-weight:700}
.hero h1 em{font-style:normal;color:var(--rail)}
.hero p{font-size:19px;color:var(--muted);line-height:1.62}

footer{border-top:2px solid var(--ink);margin-top:60px;padding:22px 0}
.foot-inner{max-width:var(--max);margin:0 auto;padding:0 20px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* fotky v clanku */
article img{display:block;margin:32px auto;max-width:100%;height:auto;border-radius:2px}
article figure{margin:32px 0}
article figcaption{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--muted);text-align:center;margin-top:10px;letter-spacing:.03em}
