/* Kampaň Zuzana Trojčáková — Kostoľany nad Hornádom 2026
   Farby a písma podľa grafiky kampane. Jednotný svetlý vzhľad. */

:root{
  --navy-900:#0A2140;
  --navy:#0F3562;
  --paper:#F5F3EC;
  --paper-2:#EDE9DB;
  --paper-3:#FDFCF8;
  --yellow:#F5C542;
  --gold:#A97A05;
  --ink:#1A1A17;
  --ink-2:#3C3C34;
  --muted:#6A695C;
  --line:#C9C2AE;
  --line-2:#DDD8C8;
  --red:#B4231F;
  --green:#2F6B3C;

  --pad: clamp(36px, 5vw, 80px) clamp(16px, 4vw, 64px);
  --wrap: 1180px;
  --r: 14px;
  --shadow: 0 1px 2px rgba(10,33,64,.06), 0 12px 32px -18px rgba(10,33,64,.4);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto} *{transition:none!important;animation:none!important}}
body{
  margin:0;background:var(--paper-3);color:var(--ink);
  font-family:"Instrument Sans",-apple-system,"Segoe UI",system-ui,sans-serif;
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}

h1,h2,h3,h4{font-family:"Bricolage Grotesque","Instrument Sans",sans-serif;margin:0;text-wrap:balance;letter-spacing:-.02em;font-weight:700}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;width:100%}
.eyebrow{
  font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-bottom:14px;
}
.sec{padding:var(--pad)}
.sec-title{font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.1}
.sec-sub{margin-top:14px;max-width:62ch;color:var(--ink-2);font-size:1.06rem}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;background:var(--navy);
  border-bottom:1px solid rgba(245,243,236,.16);
}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:12px clamp(16px,4vw,64px);
  display:flex;align-items:center;gap:20px;justify-content:space-between}
.nav-brand{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.02rem;text-decoration:none;color:var(--paper)}
.nav-links{display:flex;gap:6px;flex-wrap:wrap}
.nav-links a{
  text-decoration:none;font-size:.95rem;font-weight:500;color:var(--paper);
  padding:8px 12px;border-radius:999px;
}
.nav-links a:hover{background:rgba(245,243,236,.14);color:#fff}
.nav-links a:last-child{background:var(--yellow);color:var(--navy-900);font-weight:700;padding:8px 18px}
.nav-links a:last-child:hover{background:#ffd75e;color:var(--navy-900)}
.nav-toggle{display:none;background:none;border:2px solid rgba(245,243,236,.45);border-radius:10px;
  padding:8px 12px;font:inherit;font-weight:600;cursor:pointer;color:var(--paper)}
@media (max-width:860px){
  .nav-toggle{display:block}
  .nav-links a:last-child{background:var(--yellow)}
  .nav-links{display:none;width:100%;flex-direction:column;gap:2px;padding-top:10px}
  .nav-links.open{display:flex}
  .nav-in{flex-wrap:wrap}
  .nav-links a{padding:12px 14px;border-radius:10px}
}

/* ---------- hero ---------- */
.hero{background:var(--navy);color:var(--paper);padding:var(--pad)}
.hero .eyebrow{
  display:inline-block;background:var(--yellow);color:var(--navy-900);
  padding:8px 16px;border-radius:999px;margin-bottom:22px;letter-spacing:.04em;
  text-transform:none;font-size:.88rem;font-weight:700;
}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero h1{font-size:clamp(2.1rem,5.2vw,3.8rem);line-height:1.04;color:var(--paper)}
.hero-lead{margin-top:20px;font-size:clamp(1.05rem,1.6vw,1.22rem);color:#C9D6E8;max-width:56ch}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-foot{margin-top:26px;font-size:.95rem;font-weight:600;color:var(--yellow);border-top:1px solid rgba(245,243,236,.22);padding-top:16px}
.hero-photo{border-radius:6px;overflow:hidden;aspect-ratio:2/3;background:#fff;border:6px solid var(--yellow);box-shadow:0 24px 60px -30px rgba(0,0,0,.6)}
.hero-photo img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-photo{aspect-ratio:3/2;order:-1}}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font:inherit;font-weight:600;font-size:1.02rem;padding:15px 24px;border-radius:12px;
  text-decoration:none;cursor:pointer;border:2px solid transparent;transition:transform .08s,background .15s;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--yellow);color:var(--navy-900);border-color:var(--yellow)}
.btn-primary:hover{background:#ffd75e}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-ghost:hover{background:var(--navy);color:var(--paper)}
.hero .btn-ghost{color:var(--paper);border-color:rgba(245,243,236,.6)}
.hero .btn-ghost:hover{background:var(--paper);color:var(--navy)}
.btn-light{background:var(--paper);color:var(--navy-900);border-color:var(--paper)}
.btn-block{width:100%}
.btn[disabled]{opacity:.55;cursor:progress}

/* ---------- anketa ---------- */
#anketa{background:var(--paper)}
.anketa-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:920px){.anketa-grid{grid-template-columns:1fr}}
.anketa-intro p{margin-top:14px;color:var(--ink-2)}
.card{background:var(--paper-3);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(20px,3vw,32px);box-shadow:var(--shadow)}
.field{margin-bottom:26px}
.field > label, .field > .lbl{display:block;font-weight:600;margin-bottom:10px;font-size:1.02rem;color:var(--ink)}
.field .hint{font-size:.9rem;color:var(--muted);margin-top:8px;line-height:1.45}
textarea,input[type=text],input[type=email],select{
  width:100%;font:inherit;font-size:17px;padding:14px;border:2px solid var(--line);
  border-radius:10px;background:#fff;color:var(--ink);
}
textarea{resize:vertical;min-height:84px}
textarea:focus,input:focus,select:focus{border-color:var(--navy);outline:none}
.checks{display:grid;gap:8px}
.check{
  display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:2px solid var(--line-2);
  border-radius:10px;cursor:pointer;background:#fff;line-height:1.4;
}
.check:hover{border-color:var(--line)}
.check input{margin:2px 0 0;width:20px;height:20px;accent-color:var(--navy);flex:none}
.check.on{border-color:var(--navy);background:#fff}
.check.off{opacity:.5}
.counter{font-size:.9rem;color:var(--muted);margin-top:10px}
.privacy{font-size:.88rem;color:var(--muted);text-align:center;margin-top:14px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formerr{margin-top:14px;padding:12px 14px;border-radius:10px;background:#fbe9e8;color:var(--red);font-size:.95rem;border:1px solid #f0c9c7}

/* výsledok ankety */
.res h3{font-size:clamp(1.3rem,2.6vw,1.8rem);color:var(--navy);line-height:1.2}
.bars{margin-top:22px;display:flex;flex-direction:column;gap:12px}
.bar-row{display:grid;grid-template-columns:minmax(0,1fr) 54px;gap:12px;align-items:center}
.bar-label{font-size:.97rem}
.bar-track{height:12px;background:var(--paper-2);border-radius:99px;overflow:hidden;margin-top:6px}
.bar-fill{height:100%;background:var(--navy);border-radius:99px;transition:width .6s ease}
.bar-row:nth-child(1) .bar-fill{background:var(--yellow)}
.bar-pct{font-family:"Instrument Sans",monospace;font-variant-numeric:tabular-nums;font-weight:700;text-align:right;color:var(--navy)}
.res-count{margin-top:22px;padding-top:18px;border-top:1px solid var(--line-2);color:var(--ink-2)}
.res-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.btn-small{padding:11px 18px;font-size:.95rem}

/* ---------- stav obce ---------- */
#stav{background:var(--paper-2)}
.badge{
  display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  background:var(--navy-900);color:var(--yellow);padding:6px 12px;border-radius:999px;margin-bottom:16px;
}
.stav-main{
  background:var(--paper-3);border:2px solid var(--line);border-radius:var(--r);
  padding:clamp(20px,3vw,30px);margin-top:26px;display:flex;gap:24px;flex-wrap:wrap;align-items:center;
  border-left:8px solid var(--red);
}
.stav-main.open{border-left-color:var(--green)}
.stav-main h3{font-size:1.4rem;color:var(--navy)}
.stav-flag{
  font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.5rem;letter-spacing:.04em;
  color:var(--red);
}
.stav-main.open .stav-flag{color:var(--green)}
.stav-meta{font-size:.95rem;color:var(--ink-2);margin-top:6px}
.stav-detail{margin-top:8px;font-size:.95rem;color:var(--ink);background:var(--paper-2);padding:10px 14px;border-radius:8px;display:inline-block}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-top:16px}
.tile{background:var(--paper-3);border:1px solid var(--line-2);border-radius:12px;padding:16px 18px}
.tile .t{font-size:.82rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tile .v{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.45rem;color:var(--navy);margin-top:6px;line-height:1.1}
.tile .n{font-size:.88rem;color:var(--ink-2);margin-top:4px}
.stav-note{margin-top:22px;max-width:76ch;font-size:.97rem;color:var(--ink-2);border-left:3px solid var(--gold);padding-left:16px}

/* ---------- program ---------- */
#program{background:var(--paper-3)}
.prog-list{margin-top:34px;display:flex;flex-direction:column;gap:12px}
.prog{background:#fff;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;
  box-shadow:0 1px 2px rgba(10,33,64,.04)}
.prog:hover{border-color:var(--line)}
.prog.open{border-color:var(--navy)}
.prog-head{
  width:100%;display:grid;grid-template-columns:52px minmax(0,1fr) 40px;gap:16px;align-items:start;
  background:none;border:0;color:inherit;font:inherit;text-align:left;padding:20px clamp(16px,2.4vw,26px);cursor:pointer;
}
.prog-head:hover{background:var(--paper)}
.prog-n{
  font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.4rem;color:var(--navy-900);
  background:var(--yellow);width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;
}
.prog-t{display:block;font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.22rem;
  line-height:1.25;color:var(--navy)}
.prog-x{display:block;margin-top:8px;color:var(--ink-2);font-size:1.02rem;line-height:1.5}
.prog-sign{font-size:1.6rem;line-height:1;color:var(--gold);justify-self:end;font-weight:400}
.prog-body{display:none;padding:0 clamp(16px,2.4vw,26px) 24px 84px}
.prog.open .prog-body{display:block}
.prog-body .dl{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:12px}
.prog-body ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:10px}
.prog-body li{color:var(--ink-2);line-height:1.55}
@media (max-width:640px){.prog-body{padding-left:clamp(16px,2.4vw,26px)}}

/* ---------- o mne ---------- */
#o-mne{background:var(--paper-3)}
.ja-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:900px){.ja-grid{grid-template-columns:1fr}}
.ja-photo{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:2/3;background:var(--paper-2)}
.ja-photo img{width:100%;height:100%;object-fit:cover}
.ja-text p{margin-top:18px;color:var(--ink-2);font-size:1.06rem}
.ja-text p:first-child{margin-top:20px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-top:30px}
.fact{background:var(--paper);border:1px solid var(--line-2);border-radius:12px;padding:18px}
.fact .big{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.9rem;color:var(--navy);line-height:1}
.fact .lbl{font-size:.92rem;color:var(--muted);margin-top:6px}

/* ---------- otázky ---------- */
#otazky{background:var(--paper-2)}
.faq{margin-top:28px;display:flex;flex-direction:column;gap:10px}
.qa{background:var(--paper-3);border:1px solid var(--line-2);border-radius:12px;overflow:hidden}
.qa-head{width:100%;display:flex;gap:16px;align-items:center;justify-content:space-between;
  background:none;border:0;font:inherit;text-align:left;padding:18px 20px;cursor:pointer;color:var(--ink)}
.qa-head:hover{background:var(--paper)}
.qa-q{font-weight:600;font-size:1.06rem}
.qa-sign{font-size:1.5rem;color:var(--gold);line-height:1;flex:none}
.qa-body{display:none;padding:0 20px 20px;color:var(--ink-2);line-height:1.6}
.qa.open .qa-body{display:block}

/* ---------- kontakt ---------- */
#kontakt{background:var(--navy-900);color:var(--paper)}
.kon-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(24px,4vw,56px)}
#kontakt h2{font-size:clamp(1.7rem,3.6vw,2.6rem)}
.kon-lead{margin-top:16px;color:#C9D6E8;max-width:46ch}
.kon-list{margin-top:26px;display:flex;flex-direction:column;gap:12px}
.kon-list a,.kon-list span{display:inline-flex;align-items:center;gap:10px;color:var(--paper);text-decoration:none;font-size:1.08rem;font-weight:500}
.kon-list a:hover{color:var(--yellow)}
#kontakt .card{background:rgba(255,255,255,.06);border-color:rgba(245,243,236,.2)}
#kontakt .card h3{color:var(--paper);font-size:1.25rem;margin-bottom:16px}
#kontakt label{color:var(--paper);font-weight:600;display:block;margin-bottom:8px}
#kontakt input,#kontakt textarea{background:rgba(255,255,255,.95);border-color:transparent}
.kon-ok{margin-top:14px;padding:12px 14px;border-radius:10px;background:rgba(245,197,66,.16);color:var(--yellow);font-size:.95rem}

/* ---------- pätka ---------- */
.patka{background:var(--navy-900);color:#9FB2CB;padding:26px clamp(16px,4vw,64px);border-top:1px solid rgba(245,243,236,.14);font-size:.88rem}
.patka .wrap{display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}

.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:99;background:var(--yellow);color:var(--navy-900);padding:12px 18px;border-radius:10px}

/* ---------- stránka Čísla ---------- */
.hero-cisla h1{max-width:16ch}
.cintro{margin-top:22px;max-width:62ch;display:flex;flex-direction:column;gap:14px;color:#C9D6E8}
.cobsah{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.cobsah a{
  text-decoration:none;font-size:.92rem;font-weight:500;color:var(--paper);
  border:1px solid rgba(245,243,236,.4);border-radius:999px;padding:7px 15px;
}
.cobsah a:hover{background:var(--yellow);color:var(--navy-900);border-color:var(--yellow)}
.cblok{border-bottom:1px solid var(--line-2);background:var(--paper-3)}
.cblok:nth-of-type(even){background:var(--paper)}
.cisla-facts{margin-top:28px}
.fact .nt{font-size:.85rem;color:var(--muted);margin-top:6px;line-height:1.4}
.fact-zly .big{color:var(--red)}
.fact-dobry .big{color:var(--green)}
.tablewrap{overflow-x:auto;border:1px solid var(--line-2);border-radius:12px;background:var(--paper-3);margin-top:26px}
.cblok table{border-collapse:collapse;width:100%;min-width:520px;font-size:.97rem}
.cblok th,.cblok td{padding:11px 16px;text-align:left;border-bottom:1px solid var(--line-2);vertical-align:top}
.cblok thead th{font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--paper-2);font-weight:700}
.cblok tbody tr:last-child td{border-bottom:none}
.cblok td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:26px}
.cstlp{background:var(--paper-3);border:1px solid var(--line-2);border-radius:12px;padding:20px 24px;border-left:5px solid var(--line)}
.cstlp.dobry{border-left-color:var(--green)}
.cstlp.zly{border-left-color:var(--red)}
.cstlp h3{font-size:1.05rem;margin-bottom:12px;color:var(--navy)}
.cstlp ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:7px;color:var(--ink-2)}
.cit{margin:26px 0 0;padding:20px 26px;background:var(--navy);color:var(--paper);border-radius:12px;
  font-family:"Bricolage Grotesque",sans-serif;font-size:1.3rem;font-weight:600;line-height:1.35}
.cpozn{margin-top:22px;max-width:76ch;color:var(--ink-2);border-left:3px solid var(--gold);padding-left:16px}
.zdroj{margin-top:20px;font-size:.88rem;color:var(--muted);max-width:80ch;line-height:1.5}
.zdroj strong{color:var(--ink-2)}
.zoznam-zdrojov{margin:26px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
.zoznam-zdrojov a{display:block;background:var(--paper-3);border:1px solid var(--line-2);border-radius:10px;
  padding:14px 18px;text-decoration:none;color:var(--navy);font-weight:500}
.zoznam-zdrojov a:hover{border-color:var(--navy);background:#fff}

/* ---------- výhľad ---------- */
#vyhlad{background:var(--paper-3);border-top:1px solid var(--line-2)}
.vuvod{margin-top:22px;max-width:70ch;display:flex;flex-direction:column;gap:12px;color:var(--ink-2)}
.vtab{margin-top:30px}
#vyhlad table{border-collapse:collapse;width:100%;min-width:700px;font-size:.95rem}
#vyhlad th,#vyhlad td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line-2);vertical-align:top}
#vyhlad thead th{font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);background:var(--paper-2);font-weight:700}
#vyhlad tbody tr:last-child td{border-bottom:none}
#vyhlad tbody tr:hover td{background:var(--paper)}
.vco{font-weight:600;color:var(--ink);width:26%}
.vkolko{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:700;color:var(--navy);width:16%}
.vzdroj{color:var(--ink-2);width:22%}
.vdokaz{color:var(--muted);font-size:.9rem;line-height:1.5}
.vsucet{margin-top:22px;padding:18px 22px;background:var(--navy);color:var(--paper);border-radius:12px;
  font-family:"Bricolage Grotesque",sans-serif;font-size:1.08rem;font-weight:600;line-height:1.45}
.vnie{margin-top:30px;background:var(--paper-2);border-left:5px solid var(--red);border-radius:0 12px 12px 0;padding:22px 26px}
.vnie h3{font-size:1.08rem;color:var(--navy);margin-bottom:14px}
.vnie ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:11px;color:var(--ink-2);line-height:1.55}

/* ---------- návrh obecného webu ---------- */
.funguje{margin:26px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px}
.funguje li{background:var(--paper);border:1px solid var(--line-2);border-left:4px solid var(--green);
  border-radius:0 10px 10px 0;padding:14px 18px;color:var(--ink-2)}
.chyby{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.chyba{background:var(--paper-3);border:1px solid var(--line-2);border-left:4px solid var(--red);
  border-radius:0 12px 12px 0;padding:18px 22px}
.chyba h3{font-size:1.05rem;color:var(--navy);margin-bottom:8px}
.chyba p{color:var(--ink-2);font-size:.95rem;line-height:1.55}

/* maketa */
.mock{margin-top:30px;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px -40px rgba(10,33,64,.65);
  border:1px solid var(--line);background:#fff}
.mock-bar{background:#E3E0D4;padding:10px 14px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line)}
.mock-bar .dot{width:11px;height:11px;border-radius:50%;background:#C4BFAC;display:inline-block}
.mock-url{margin-left:14px;font-size:.8rem;color:var(--muted);background:#fff;border-radius:6px;padding:4px 14px}
.mock-body{padding:clamp(18px,3vw,30px);background:#FDFCF8}
.mock-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  padding-bottom:16px;border-bottom:2px solid var(--navy);margin-bottom:24px}
.mock-head strong{font-family:"Bricolage Grotesque",sans-serif;font-size:1.1rem;color:var(--navy)}
.mock-nav{font-size:.85rem;color:var(--muted)}
.mock-h{font-family:"Bricolage Grotesque",sans-serif;font-size:.92rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold);margin:26px 0 12px}
.mock-h:first-of-type{margin-top:0}
.mtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.mtile{border:1px solid var(--line-2);border-radius:10px;padding:14px 16px;background:#fff;border-top:4px solid var(--red)}
.mtile.ok{border-top-color:var(--green)}
.mtile .mt{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
.mtile .mv{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.2rem;color:var(--navy);margin-top:5px}
.mtile.ok .mv{color:var(--green)}
.mtile .mn{font-size:.83rem;color:var(--ink-2);margin-top:3px}
.mvybs{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:9px}
.mvyb{background:var(--navy);color:var(--paper);border-radius:9px;padding:13px 16px;font-size:.92rem;font-weight:500}
.mock-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:26px;margin-top:6px}
.mrows,.mzvs{display:flex;flex-direction:column;gap:2px}
.mrow{display:flex;gap:14px;padding:11px 0;border-bottom:1px solid var(--line-2);font-size:.92rem}
.mrow .md{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.mzv{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line-2)}
.mzt{font-weight:600;font-size:.94rem;color:var(--navy)}
.mzn{font-size:.8rem;color:var(--green);background:#E7F0E5;border-radius:99px;padding:3px 10px;white-space:nowrap}

/* ---------- návrh obecného webu ---------- */
.ow-banner{position:sticky;top:57px;z-index:40;background:var(--yellow);color:var(--navy-900);
  text-align:center;padding:9px 16px;font-weight:700;font-size:.88rem;letter-spacing:.02em}
.ow-intro{background:var(--paper-3);padding-bottom:0}
.ow-frame{max-width:1180px;margin:32px auto 0;padding:0 clamp(16px,4vw,64px) 60px}
.ow-chrome{background:#E3E0D4;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;
  padding:10px 14px;display:flex;align-items:center;gap:7px}
.ow-chrome span:not(.ow-url){width:11px;height:11px;border-radius:50%;background:#C4BFAC}
.ow-url{margin-left:14px;font-size:.78rem;color:var(--muted);background:#fff;border-radius:6px;padding:4px 14px}
.ow-site{background:#fff;border:1px solid var(--line);border-radius:0 0 12px 12px;
  box-shadow:0 36px 80px -50px rgba(10,33,64,.7);overflow:hidden;font-size:15px}
.ow-util{background:var(--navy-900);color:#B9C9DE;display:flex;gap:20px;flex-wrap:wrap;
  padding:8px clamp(14px,3vw,28px);font-size:.8rem}
.ow-util .ow-open{margin-left:auto;color:var(--yellow);font-weight:600}
.ow-head{background:var(--navy);color:#fff;padding:18px clamp(14px,3vw,28px);
  display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ow-head strong{font-family:"Bricolage Grotesque",sans-serif;font-size:1.12rem}
.ow-nav{display:flex;gap:18px;flex-wrap:wrap;font-size:.86rem;color:#C9D6E8}
.ow-search{margin:0 clamp(14px,3vw,28px);transform:translateY(-16px);background:#fff;
  border:2px solid var(--yellow);border-radius:10px;padding:13px 18px;color:var(--muted);font-size:.9rem;
  box-shadow:0 8px 20px -12px rgba(10,33,64,.4)}
.ow-h{font-family:"Bricolage Grotesque",sans-serif;font-size:.84rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--gold);margin:26px clamp(14px,3vw,28px) 12px;
  display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ow-h a{font-size:.78rem;color:var(--navy);text-decoration:none;letter-spacing:0;text-transform:none;font-weight:600}
.ow-p{margin:0 clamp(14px,3vw,28px) 12px;color:var(--muted);font-size:.86rem}
.ow-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:10px;
  padding:0 clamp(14px,3vw,28px)}
.ow-tiles.one{grid-template-columns:1fr}
.ow-tile{border:1px solid var(--line-2);border-left:4px solid var(--line);border-radius:8px;padding:13px 15px;background:#FDFCF8}
.ow-tile.ok{border-left-color:var(--green)}
.ow-tile.zavrete{border-left-color:var(--red)}
.ow-tile.info{border-left-color:var(--gold)}
.ow-tile.plain{border-left-color:var(--navy)}
.ow-t{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700}
.ow-v{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.1rem;color:var(--navy);margin-top:4px;line-height:1.2}
.ow-tile.ok .ow-v{color:var(--green)}
.ow-tile.zavrete .ow-v{color:var(--red)}
.ow-n{font-size:.8rem;color:var(--ink-2);margin-top:3px;line-height:1.4}
.ow-tasks{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:9px;padding:0 clamp(14px,3vw,28px)}
.ow-task{background:var(--navy);color:#fff;border-radius:9px;padding:14px 16px;text-decoration:none;display:block}
.ow-task:hover{background:#15427a}
.ow-tt{display:block;font-weight:600;font-size:.92rem}
.ow-tn{display:block;font-size:.78rem;color:#AFC2DA;margin-top:3px}
.ow-2col{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:0 28px}
.ow-list{list-style:none;margin:0;padding:0 clamp(14px,3vw,28px)}
.ow-list li{display:flex;gap:13px;padding:11px 0;border-bottom:1px solid var(--line-2)}
.ow-d{color:var(--muted);font-size:.8rem;white-space:nowrap;min-width:62px;font-variant-numeric:tabular-nums;padding-top:2px}
.ow-x{display:flex;flex-direction:column;gap:2px}
.ow-x strong{font-size:.93rem;color:var(--navy);font-weight:600}
.ow-x em{font-style:normal;font-size:.8rem;color:var(--muted)}
.ow-list.odp li strong{font-size:.93rem;color:var(--navy)}
.ow-cta{display:inline-block;margin:12px clamp(14px,3vw,28px) 0;background:var(--yellow);color:var(--navy-900);
  border-radius:8px;padding:10px 16px;text-decoration:none;font-weight:700;font-size:.85rem}
.ow-zvs{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:8px;padding:0 clamp(14px,3vw,28px)}
.ow-zv{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#FDFCF8;
  border:1px solid var(--line-2);border-radius:8px;padding:12px 15px;text-decoration:none}
.ow-zv > span:first-child{font-weight:600;font-size:.92rem;color:var(--navy)}
.ow-badge{font-size:.72rem;color:#1F5A2C;background:#E3EFE1;border-radius:99px;padding:3px 9px;white-space:nowrap}
.ow-obecs{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:9px;padding:0 clamp(14px,3vw,28px)}
.ow-obec{background:#FDFCF8;border:1px solid var(--line-2);border-radius:9px;padding:13px 16px;text-decoration:none;display:block}
.ow-obec strong{display:block;font-size:.92rem;color:var(--navy)}
.ow-obec em{font-style:normal;display:block;font-size:.79rem;color:var(--muted);margin-top:3px}
.ow-foot{margin-top:30px;background:var(--navy-900);color:#B9C9DE;padding:24px clamp(14px,3vw,28px);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;font-size:.85rem}
.ow-foot strong{color:#fff;font-family:"Bricolage Grotesque",sans-serif;font-size:1rem;display:block;margin-bottom:8px}
.ow-foot p{margin:2px 0}
.ow-hod{border-collapse:collapse;font-size:.83rem}
.ow-hod td{padding:4px 18px 4px 0;color:#B9C9DE}
.ow-hod td:first-child{color:#fff;font-weight:600;white-space:nowrap}


/* ================= STRIEDANIE POZADÍ SEKCIÍ =================
   Toto je zámerne na konci súboru, aby to prebilo staršie pravidlá.
   Rytmus: tmavá → svetlá → krémová → svetlá → krémová tmavšia → svetlá → krémová → tmavá */
.hero        { background: var(--navy) }
#program     { background: var(--paper-3) }
#vyhlad      { background: var(--paper);   border-top: 1px solid var(--line-2) }
#anketa      { background: var(--paper-3) }
#stav        { background: var(--paper-2) }
#o-mne       { background: var(--paper-3) }
#otazky      { background: var(--paper) }
#kontakt     { background: var(--navy-900) }

/* ===== prepojenia plán ↔ čísla ===== */
.prog-odkaz, .cplan {
  margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line-2);
  font-size: .94rem; line-height: 1.6; color: var(--ink-2);
}
.prog-odkaz span, .cplan span { color: var(--ink-3, var(--ink-2)); }
.prog-odkaz a, .cplan a {
  color: var(--navy); font-weight: 600;
  text-decoration: underline; text-underline-offset: 3px;
  text-decoration-color: var(--yellow); text-decoration-thickness: 2px;
}
.prog-odkaz a:hover, .cplan a:hover { text-decoration-color: var(--navy) }
.cplan { margin-top: 26px }