/* Spletni mehanik — skupni slog podstrani.
   Iste barve in tipografija kot naslovnica, brez njenega junaka. */

:root{
  --ink:#0F1113;
  --panel:#16191C;
  --panel-2:#1B1F23;
  --rule:#262B31;
  --fg:#E8ECEF;
  --muted:#8A949E;
  --besedilo:#B9C2CA;
  --accent:#F2622B;
  --signal:#3ED9AE;
  --red:#FF5F56;
  --mono:"Consolas","DejaVu Sans Mono","SFMono-Regular",Menlo,monospace;
  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --sirina:1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--fg);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-text-size-adjust:100%;
}
img{max-width:100%;height:auto;}
a{color:#FF8A57;text-decoration:none;}
a:hover{text-decoration:underline;}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px;}

.preskoci{position:absolute;left:-9999px;}
.preskoci:focus{left:1rem;top:1rem;z-index:10;background:var(--accent);color:#12080a;padding:.6rem 1rem;}

/* ── glava ─────────────────────────────────────────────────────────────── */
.glava{
  position:sticky;top:0;z-index:20;
  background:rgba(15,17,19,.94);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--rule);
}
.glava .vrsta{
  max-width:var(--sirina);margin:0 auto;
  display:flex;align-items:center;gap:1.2rem;
  padding:.7rem 1.2rem;
}
.znak{display:flex;align-items:center;gap:.7rem;color:var(--fg);}
.znak:hover{text-decoration:none;}
.znak b{font-size:1rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;}
.znak small{display:block;font:400 .56rem/1 var(--mono);letter-spacing:.16em;color:var(--muted);text-transform:uppercase;margin-top:.25rem;}
.meni{margin-left:auto;display:flex;flex-wrap:wrap;gap:.2rem 1.1rem;align-items:center;}
.meni a{font:400 .82rem/1 var(--sans);color:var(--besedilo);padding:.4rem 0;}
.meni a:hover,.meni a[aria-current]{color:var(--fg);text-decoration:none;}
.meni .gumb{
  background:var(--accent);color:#12080a;font-weight:700;
  padding:.6rem .95rem;border-radius:3px;font-size:.78rem;
  letter-spacing:.08em;text-transform:uppercase;font-family:var(--mono);
}
.meni .gumb:hover{filter:brightness(1.1);}

/* ── drobtine ──────────────────────────────────────────────────────────── */
.drobtine{
  max-width:var(--sirina);margin:0 auto;padding:1rem 1.2rem 0;
  font:400 .72rem/1.5 var(--mono);color:var(--muted);
}
.drobtine a{color:var(--muted);}
.drobtine span{margin:0 .4rem;}

/* ── vsebina ───────────────────────────────────────────────────────────── */
main{max-width:var(--sirina);margin:0 auto;padding:1.5rem 1.2rem 4rem;}
.naslovni{border-bottom:1px solid var(--rule);padding-bottom:2rem;margin-bottom:2.5rem;}
h1{
  margin:.6rem 0 0;
  font-size:clamp(1.7rem,4vw,2.9rem);
  font-weight:800;line-height:1.08;letter-spacing:-.015em;
  text-transform:uppercase;text-wrap:balance;
}
.uvod{margin:1.1rem 0 0;max-width:66ch;font-size:1.08rem;color:var(--besedilo);}
.oznaka{
  display:inline-block;font:400 .66rem/1 var(--mono);
  letter-spacing:.2em;text-transform:uppercase;color:var(--accent);
}
h2{
  margin:2.8rem 0 .9rem;
  font-size:clamp(1.25rem,2.4vw,1.7rem);
  font-weight:700;line-height:1.2;letter-spacing:-.01em;
  text-wrap:balance;
}
h3{margin:1.8rem 0 .6rem;font-size:1.06rem;font-weight:700;}
p{margin:0 0 1rem;max-width:70ch;color:var(--besedilo);}
main ul,main ol{max-width:70ch;color:var(--besedilo);padding-left:1.3rem;}
main li{margin:.4rem 0;}
strong{color:var(--fg);}
code{font-family:var(--mono);font-size:.88em;background:var(--panel-2);padding:.12em .4em;border-radius:3px;color:var(--signal);}

.opomba{
  border-left:3px solid var(--accent);
  background:var(--panel);
  padding:1rem 1.2rem;margin:1.6rem 0;border-radius:0 4px 4px 0;
}
.opomba p{margin:0;max-width:none;}

table{border-collapse:collapse;width:100%;margin:1.4rem 0;font-size:.92rem;}
.tabela-okvir{overflow-x:auto;}
th,td{border:1px solid var(--rule);padding:.6rem .8rem;text-align:left;vertical-align:top;}
th{background:var(--panel-2);color:var(--fg);font-weight:700;}
td{color:var(--besedilo);}

/* ── kartice storitev ──────────────────────────────────────────────────── */
.kartice{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin:1.6rem 0;}
.kartica{background:var(--panel);border:1px solid var(--rule);border-radius:6px;padding:1.2rem 1.3rem;}
.kartica h3{margin:0 0 .4rem;font-size:1rem;}
.kartica h3 a{color:var(--fg);}
.kartica p{margin:0;font-size:.92rem;}
.kartica .sig{display:block;font:400 .66rem/1 var(--mono);color:var(--accent);margin-bottom:.7rem;}

/* ── koraki ────────────────────────────────────────────────────────────── */
.koraki{counter-reset:korak;list-style:none;padding:0;margin:1.4rem 0;}
.koraki li{
  counter-increment:korak;position:relative;
  padding:0 0 0 3rem;margin:0 0 1.1rem;
}
.koraki li::before{
  content:"0" counter(korak);
  position:absolute;left:0;top:.05rem;
  font:700 .85rem/1.5 var(--mono);color:var(--accent);
  font-variant-numeric:tabular-nums;
}
.koraki b{display:block;color:var(--fg);}

/* ── cene ──────────────────────────────────────────────────────────────── */
.cene{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem;margin:1.6rem 0;}
.cena{background:var(--panel);border:1px solid var(--rule);border-radius:6px;padding:1.4rem;}
.cena h3{margin:0 0 .3rem;font-size:1.05rem;}
.cena .znesek{font:700 1.5rem/1.2 var(--mono);color:var(--signal);display:block;margin:.4rem 0 .8rem;}
.cena ul{margin:0;padding-left:1.1rem;font-size:.92rem;}

/* ── vprašanja ─────────────────────────────────────────────────────────── */
.faq{margin:1.6rem 0;border-top:1px solid var(--rule);}
.faq details{border-bottom:1px solid var(--rule);}
.faq summary{
  cursor:pointer;padding:1rem 0;font-weight:700;color:var(--fg);
  list-style:none;display:flex;justify-content:space-between;gap:1rem;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--accent);font-family:var(--mono);}
.faq details[open] summary::after{content:"–";}
.faq details p{padding:0 0 1rem;margin:0;}

/* ── obrazec v urejevalniški plošči (enak kot na naslovnici) ───────────── */
.plosca{
  margin:1.6rem 0 0;
  max-width:34rem;
  border:1px solid var(--rule);
  border-radius:6px;
  background:var(--panel);
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.45);
}
.plosca .zavihki{
  display:flex;
  background:var(--panel-2);
  border-bottom:1px solid var(--rule);
}
.plosca .zavihek{
  padding:.85rem 1rem;
  font:400 .66rem/1 var(--mono);
  color:var(--muted);
  border-right:1px solid var(--rule);
}
.plosca .zavihek.on{
  color:var(--fg);
  background:var(--panel);
  box-shadow:inset 0 2px 0 var(--accent);
}
.plosca form{
  padding:1.3rem 1.2rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
  font-family:var(--mono);
}
.plosca .komentar{
  margin:0;
  max-width:none;
  font:400 .68rem/1.7 var(--mono);
  color:#5C6673;
}
.plosca .komentar a{color:var(--accent);}
.plosca label{
  display:flex;
  flex-direction:column;
  gap:.4rem;
  font:400 .68rem/1 var(--mono);
  color:var(--muted);
}
.plosca input,
.plosca textarea,
.plosca select{
  background:var(--panel-2);
  border:1px solid var(--rule);
  color:var(--fg);
  font:400 .82rem/1.45 var(--mono);
  padding:.7rem .75rem;
  width:100%;
  box-sizing:border-box;
  border-radius:2px;
}
.plosca input:focus,
.plosca textarea:focus,
.plosca select:focus{border-color:var(--signal);outline:none;}
.plosca textarea{resize:vertical;min-height:7rem;}
.plosca button{
  margin-top:.2rem;
  border:0;
  border-radius:2px;
  background:var(--accent);
  color:#12080a;
  font:700 .74rem/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:1rem;
  cursor:pointer;
}
.plosca button:hover{filter:brightness(1.1);}
.plosca .izpis{
  margin:0;
  max-width:none;
  font:400 .68rem/1.7 var(--mono);
  color:var(--signal);
  white-space:pre-wrap;
  word-break:break-word;
}
.plosca .izpis.napaka{color:var(--red);}
.plosca footer{
  border-top:1px solid var(--rule);
  padding:.8rem 1.2rem;
  font:400 .64rem/1.6 var(--mono);
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.5rem;
}
.plosca footer .ok{color:var(--signal);}

/* ── poziv ─────────────────────────────────────────────────────────────── */
.poziv{
  margin:3rem 0 0;background:var(--panel);border:1px solid var(--rule);
  border-radius:6px;padding:1.6rem 1.6rem 1.8rem;
}
.poziv h2{margin:0 0 .6rem;font-size:1.25rem;}
.poziv p{margin:0 0 1.2rem;}
.poziv .gumb{
  display:inline-block;background:var(--accent);color:#12080a;
  font:700 .8rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  padding:1rem 1.4rem;border-radius:3px;
}
.poziv .gumb:hover{filter:brightness(1.1);text-decoration:none;}

/* ── povezano ──────────────────────────────────────────────────────────── */
.povezano{margin-top:2.5rem;padding-top:1.4rem;border-top:1px solid var(--rule);}
.povezano h2{margin:0 0 .8rem;font-size:1rem;color:var(--muted);font-weight:400;
  font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;}
.povezano ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem;}
.povezano li{margin:0;}
.povezano a{
  display:inline-block;border:1px solid var(--rule);background:var(--panel);
  padding:.5rem .8rem;border-radius:4px;font-size:.88rem;color:var(--besedilo);
}
.povezano a:hover{color:var(--fg);border-color:var(--accent);text-decoration:none;}

/* ── seznam člankov ────────────────────────────────────────────────────── */
.clanki{list-style:none;padding:0;margin:1.5rem 0;}
.clanki li{border-bottom:1px solid var(--rule);padding:1.1rem 0;}
.clanki a{font-size:1.12rem;font-weight:700;color:var(--fg);}
.clanki p{margin:.35rem 0 0;font-size:.95rem;}
.clanki .sig{font:400 .66rem/1 var(--mono);color:var(--accent);letter-spacing:.12em;text-transform:uppercase;}

/* ── članek ────────────────────────────────────────────────────────────── */
.clanek{max-width:none;}
.clanek p,.clanek ul,.clanek ol{max-width:70ch;}
.meta-clanka{font:400 .72rem/1.6 var(--mono);color:var(--muted);margin-top:.8rem;}

/* ── noga ──────────────────────────────────────────────────────────────── */
.noga{border-top:1px solid var(--rule);background:var(--panel);}
.noga .vrsta{
  max-width:var(--sirina);margin:0 auto;padding:2.2rem 1.2rem;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:2rem;
}
.noga h3{margin:0 0 .7rem;font:400 .68rem/1 var(--mono);letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);}
.noga ul{list-style:none;padding:0;margin:0;}
.noga li{margin:.35rem 0;}
.noga a{font-size:.9rem;color:var(--besedilo);}
.noga address{font-style:normal;font:400 .82rem/1.8 var(--mono);color:var(--muted);}
.noga address b{display:block;color:var(--fg);font-family:var(--sans);font-size:.95rem;}
.podnoga{
  border-top:1px solid var(--rule);
  font:400 .72rem/1.6 var(--mono);color:var(--muted);
  padding:1rem 1.2rem;max-width:var(--sirina);margin:0 auto;
  display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between;
}

@media (max-width:760px){
  body{font-size:16px;}
  .glava .vrsta{flex-wrap:wrap;}
  .meni{width:100%;margin-left:0;order:3;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
}