/* ————————————————————————————————————————————————
   BARIKÁDUJ.CZ — sdílený stylesheet vnitřních stránek
   Statické HTML, žádný JS. Fonty self-hostované z /fonts/
   (dokud tam nejsou, jede systémový fallback).
   ———————————————————————————————————————————————— */

@font-face{
  font-family:"Archivo";font-style:normal;font-weight:800;font-display:swap;
  src:url("/fonts/archivo-latin-ext-800.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/ibm-plex-sans-latin-ext-400.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;
  src:url("/fonts/ibm-plex-sans-latin-ext-600.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("/fonts/ibm-plex-mono-latin-ext-500.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --f-display:"Archivo","Archivo Black","Helvetica Neue",Arial,system-ui,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;

  /* tmavá identita (shodná s homepage) */
  --bg:#0A1730;
  --bg2:#0E2145;
  --blue:#1A4FA8;
  --blue-d:#123A7C;
  --red:#C41E22;
  --red-d:#8F1417;
  --ink-on-dark:#F5F7FB;
  --muted-on-dark:#8FA3C4;
  --line-on-dark:rgba(245,247,251,.14);

  /* světlá obsahová plocha */
  --paper:#FFFFFF;
  --paper-2:#F2F5FA;
  --ink:#13233F;
  --muted:#5A6B87;
  --line:#DCE3EE;

  --maxw:1120px;
  --pad:clamp(1.2rem,5vw,4rem);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--f-body);
  background:var(--paper);
  color:var(--ink);
  min-height:100vh;
  display:flex;flex-direction:column;
  overflow-x:hidden;
  line-height:1.65;
}
img{max-width:100%;height:auto}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}

.skip{
  position:absolute;left:-999px;top:0;z-index:10;
  background:var(--red);color:#fff;padding:.5rem 1rem;font-weight:600;
}
.skip:focus{left:0}

/* ——— hlavička ——— */
.site-head{
  background:var(--bg);color:var(--ink-on-dark);
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem 2rem;flex-wrap:wrap;
  padding:1.1rem var(--pad);
}
.brand{
  display:flex;align-items:center;gap:.9rem;
  color:inherit;text-decoration:none;
}
.brand img{height:40px;width:auto}
.brand .word{
  font-family:var(--f-display);font-weight:800;
  letter-spacing:.04em;font-size:1.02rem;white-space:nowrap;
}
.brand .word span{color:var(--muted-on-dark)}
.nav{
  display:flex;align-items:center;flex-wrap:wrap;gap:.4rem 1.5rem;
  font-size:.92rem;
}
.nav a{
  color:var(--muted-on-dark);text-decoration:none;font-weight:600;
  padding:.35rem 0;border-bottom:2px solid transparent;
}
.nav a:hover{color:var(--ink-on-dark)}
.nav a[aria-current="page"]{color:var(--ink-on-dark);border-bottom-color:var(--red)}
.nav a.cta{
  color:#fff;background:var(--red);
  padding:.5rem 1.05rem;border-radius:3px;border-bottom:0;
}
.nav a.cta:hover{background:var(--red-d)}

/* ——— hero pruh stránky ——— */
.page-hero{
  background:
    radial-gradient(900px 480px at 85% 0%, rgba(18,48,94,.6) 0%, transparent 65%),
    var(--bg);
  color:var(--ink-on-dark);
  padding:clamp(2.4rem,6vw,4.5rem) var(--pad) clamp(2.6rem,6vw,4.2rem);
}
.page-hero .in{max-width:var(--maxw);margin:0 auto}
.eyebrow{
  font-family:var(--f-mono);font-weight:500;
  font-size:clamp(.62rem,1.8vw,.76rem);letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted-on-dark);
  display:flex;align-items:center;gap:.8rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--red);flex:none}
.page-hero h1{
  font-family:var(--f-display);font-weight:800;
  font-size:clamp(2rem,5.5vw,3.4rem);line-height:1.05;letter-spacing:-.01em;
  margin:.9rem 0 0;
}
.page-hero .lead{
  margin:1.2rem 0 0;max-width:62ch;
  font-size:1.04rem;color:var(--muted-on-dark);
}
.page-hero .lead strong{color:var(--ink-on-dark);font-weight:600}

/* ——— obsah ——— */
main{flex:1}
.section{padding:clamp(2.2rem,5vw,3.6rem) var(--pad)}
.section.alt{background:var(--paper-2)}
.section > .in{max-width:var(--maxw);margin:0 auto}
.section h2{
  font-family:var(--f-display);font-weight:800;
  font-size:clamp(1.35rem,3.2vw,1.9rem);line-height:1.15;
  margin:0 0 1rem;
}
.section h3{
  font-size:1.06rem;font-weight:600;margin:1.8rem 0 .5rem;
}
.section p{margin:.7rem 0;max-width:72ch}
.section ul,.section ol{margin:.7rem 0 .7rem 1.3rem;max-width:70ch}
.section li{margin:.3rem 0}
.section a{color:var(--blue-d);text-decoration-thickness:1px;text-underline-offset:2px}
.section a:hover{color:var(--red)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,3vw,2.5rem)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2.5vw,1.6rem)}
@media (max-width:840px){.grid-2,.grid-3{grid-template-columns:1fr}}

.card{
  background:var(--paper);border:1px solid var(--line);border-radius:4px;
  padding:1.3rem 1.4rem;
}
.card h3{margin-top:0}
.card .k{
  font-family:var(--f-mono);font-size:.68rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);display:block;margin-bottom:.55rem;
}

/* výstražný / informační rámeček */
.note{
  border-left:3px solid var(--red);background:var(--paper-2);
  padding:.9rem 1.2rem;margin:1.2rem 0;max-width:72ch;
}
.note.calm{border-left-color:var(--blue)}

/* tabulky */
.tbl-wrap{overflow-x:auto;margin:1rem 0}
table{border-collapse:collapse;width:100%;font-size:.95rem}
caption{text-align:left;font-weight:600;padding-bottom:.5rem}
th,td{border:1px solid var(--line);padding:.55rem .8rem;text-align:left;vertical-align:top}
th{background:var(--paper-2);font-weight:600}
td.mono,th.mono{font-family:var(--f-mono);font-size:.86rem;white-space:nowrap}

/* kroky procesu */
.steps{counter-reset:step;list-style:none;margin:1.2rem 0 0;max-width:72ch}
.steps li{
  counter-increment:step;position:relative;
  padding:0 0 1.1rem 3rem;margin:0;
}
.steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute;left:0;top:.1rem;
  font-family:var(--f-mono);font-weight:500;font-size:.8rem;
  color:var(--red);letter-spacing:.05em;
}
.steps li::after{
  content:"";position:absolute;left:.62rem;top:1.55rem;bottom:.3rem;
  width:2px;background:var(--line);
}
.steps li:last-child::after{display:none}
.steps b{font-weight:600}

/* CTA pruh */
.cta-band{
  background:var(--bg);color:var(--ink-on-dark);
  padding:clamp(2rem,5vw,3rem) var(--pad);
}
.cta-band .in{
  max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  gap:1.2rem 2rem;flex-wrap:wrap;
}
.cta-band h2{
  font-family:var(--f-display);font-weight:800;
  font-size:clamp(1.3rem,3vw,1.8rem);margin:0;
}
.cta-band p{color:var(--muted-on-dark);margin:.4rem 0 0;max-width:56ch}
.btn{
  display:inline-block;background:var(--red);color:#fff;text-decoration:none;
  font-weight:600;padding:.85rem 1.7rem;border-radius:3px;border:0;
  font-size:1rem;font-family:var(--f-body);cursor:pointer;
}
.btn:hover{background:var(--red-d)}
.btn.ghost{
  background:transparent;border:1px solid var(--line-on-dark);color:var(--ink-on-dark);
}
.btn.ghost:hover{border-color:var(--ink-on-dark);background:transparent}

/* ——— formulář ——— */
form.inquiry{max-width:680px}
.f-row{margin:0 0 1.1rem}
.f-2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem}
@media (max-width:560px){.f-2{grid-template-columns:1fr}}
label{display:block;font-weight:600;font-size:.92rem;margin-bottom:.3rem}
label .opt{font-weight:400;color:var(--muted)}
input,select,textarea{
  width:100%;font:inherit;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:3px;
  padding:.6rem .75rem;
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
textarea{min-height:120px;resize:vertical}
.consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem}
.consent input{width:auto;margin-top:.25rem}
.consent label{font-weight:400;margin:0}

/* ——— právní stránky ——— */
.legal{max-width:78ch}
.legal h2{
  font-size:1.15rem;margin:2.2rem 0 .6rem;
  font-family:var(--f-body);font-weight:600;
}
.legal h2 .no{
  display:block;font-family:var(--f-mono);font-weight:500;
  font-size:.7rem;letter-spacing:.16em;color:var(--red);
  text-transform:uppercase;margin-bottom:.15rem;
}
.legal .docmeta{
  font-family:var(--f-mono);font-size:.78rem;color:var(--muted);
  margin:0 0 1.5rem;letter-spacing:.04em;
}
.legal ol.pts{list-style:none;margin-left:0}
.legal ol.pts > li{margin:.55rem 0;padding-left:2.2rem;position:relative}
.legal ol.pts > li > .n{
  position:absolute;left:0;top:.22em;
  font-family:var(--f-mono);font-size:.78rem;color:var(--muted);
}
.legal dl dt{font-weight:600;margin-top:.9rem}
.legal dl dd{margin-left:0}

/* ——— patička ——— */
.site-foot{
  background:var(--bg);color:var(--muted-on-dark);
  border-top:1px solid var(--line-on-dark);
  padding:2rem var(--pad) 1.6rem;
  font-size:.84rem;line-height:1.6;
}
.site-foot .in{
  max-width:var(--maxw);margin:0 auto;
  display:flex;justify-content:space-between;gap:1.4rem 3rem;flex-wrap:wrap;
}
.site-foot b{color:var(--ink-on-dark);font-weight:600}
.site-foot a{color:var(--muted-on-dark)}
.site-foot a:hover{color:var(--ink-on-dark)}
.site-foot .cols{display:flex;gap:1.4rem 3rem;flex-wrap:wrap}
.site-foot ul{list-style:none}
.site-foot .legal-links li{margin:.15rem 0}
.site-foot .bottom{
  max-width:var(--maxw);margin:1.6rem auto 0;padding-top:1rem;
  border-top:1px solid var(--line-on-dark);
  display:flex;justify-content:space-between;gap:.5rem 2rem;flex-wrap:wrap;
  font-size:.78rem;
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}