/* Štirinožci — generated site (build_site.py). Warm Authority palette. */
:root{--prim:#2A5C82;--acc:#E89E3A;--bg:#F9F7F2;--green:#4A7A5D;--ink:#24323f;--mut:#5f6b76}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.65}
a{color:var(--prim)}img{max-width:100%;height:auto}
.container{max-width:1040px;margin:0 auto;padding:0 20px}
.site-header{background:#fff;border-bottom:1px solid #e7e0d5;position:sticky;top:0;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px}
.logo{font-weight:700;font-size:20px;color:var(--prim);text-decoration:none}
.logo-sub{color:var(--mut);font-size:13px}
nav.topnav ul{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}
nav.topnav a{display:block;padding:8px 12px;text-decoration:none;border-radius:8px;color:var(--ink)}
nav.topnav a:hover{background:var(--bg)}
main{padding:28px 0 56px}
h1{font-size:clamp(28px,4vw,40px);line-height:1.15;margin:.2em 0}
h2{font-size:24px;margin-top:1.4em}
.hero{background:linear-gradient(135deg,#eaf2f8,#fdf3e3);border-radius:18px;padding:36px 28px;margin-bottom:32px}
.lead{font-size:18px;color:#33404c;max-width:720px}
.btn{display:inline-block;background:var(--acc);color:#fff;font-weight:700;padding:13px 24px;
  border-radius:10px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{filter:brightness(1.06)}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:28px;align-items:center}
.hero-img{width:100%;height:auto;border-radius:14px;box-shadow:0 6px 24px rgba(36,50,63,.18);display:block}
@media(max-width:760px){.hero-grid{grid-template-columns:1fr}}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin:18px 0}
.card{background:#fff;border:1px solid #e7e0d5;border-radius:14px;padding:20px;display:flex;flex-direction:column}
.card h3{margin:.1em 0 .3em;font-size:19px}
.card .meta{color:var(--mut);font-size:13px;margin-bottom:8px}
.card>p,.card>.card-text{flex:1;margin:.3em 0}
.card-text p{margin:.3em 0}
.card-text ul{margin:.3em 0;padding-left:20px}
.card .btn{margin-top:12px;align-self:flex-start}
.article{max-width:760px}
.article .viri{background:#f0f4f8;border-left:4px solid var(--prim);padding:12px 16px;border-radius:8px;font-size:14px}
.article img.hero{width:100%;border-radius:14px;margin:8px 0 16px;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.page-section{background:#fff;border:1px solid #e7e0d5;border-radius:14px;padding:20px 24px;margin:18px 0}
.page-section h2{margin-top:0}
.page-figure{margin:14px 0}
.page-figure img{width:100%;border-radius:12px;display:block;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.faq dt{font-weight:700;font-size:18px;margin-top:1.4em}
.faq dd{margin:.3em 0 0}
.faq dd p{margin:.5em 0 0}
.faq dd .mut{font-size:14px}
.preview-banner{background:#7a1f1f;color:#fff;text-align:center;padding:10px;font-weight:700}
.site-footer{background:#24323f;color:#dce4ea;padding:28px 0;margin-top:32px}
.site-footer a{color:#ffd9a0}.site-footer .mut{color:#9fb2c0}
address{font-style:normal;color:#dce4ea}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
/* Hamburger meni (mobile) — skrčeno v gumb, razvleče padajoči meni */
.nav-toggle{display:none;flex-direction:column;background:none;border:0;cursor:pointer;padding:10px 8px;border-radius:8px;align-items:center;gap:6px;min-height:44px}
.nav-toggle-bar{display:block;width:22px;height:2.5px;background:var(--ink);border-radius:2px;margin:4.5px 0;transition:transform .18s,opacity .18s}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media(max-width:640px){
  .nav-toggle{display:flex}
  nav.topnav{position:relative}
  nav.topnav ul{display:none;position:absolute;top:calc(100% + 6px);right:0;left:auto;min-width:240px;z-index:30;background:#fff;
    border:1px solid #e7e0d5;border-radius:12px;box-shadow:0 10px 30px rgba(36,50,63,.14);padding:8px;flex-direction:column;gap:2px}
  nav.topnav.open ul{display:flex}
  nav.topnav a{padding:12px 14px;font-size:16px}
}
/* ── Domača stran: pet grafično ločenih sekcij (naloga t_b8016b56) ─────── */
/* Vsaka sekcija je okvirček, podoben uvodnemu nagovoru (.hero). */
.home-box{background:#fff;border:1px solid #e7e0d5;border-radius:18px;
  padding:30px 28px;margin:0 0 26px;box-shadow:0 2px 10px rgba(36,50,63,.05)}
.home-box h2{margin-top:0;font-size:25px}
.home-box .lead{margin:.2em 0 0}
.home-box .cards{margin-bottom:0}
.home-box .cards .card{box-shadow:none}
.home-more{margin:18px 0 0}
/* Kviz: dinamične značke — vsebnik polni top-pasme.js (GET /api/top-pasme) */
.kviz-badges{margin:18px 0 2px}
.kviz-badges .grp{margin:0 0 16px}
.kviz-badges .grp h3{margin:0 0 10px;font-size:15px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--mut);font-weight:700}
.kviz-badges .badge{display:flex;align-items:center;gap:12px;background:var(--bg);
  border:1px solid #e7e0d5;border-radius:12px;padding:8px 14px 8px 8px;margin:0 0 8px;
  text-decoration:none;color:var(--ink);transition:border-color .15s,background .15s}
.kviz-badges .badge:hover{border-color:var(--prim);background:#fff}
.kviz-badges .badge img,.kviz-badges .badge .badge-emoji{width:44px;height:44px;
  border-radius:10px;object-fit:cover;flex:0 0 44px;display:flex;align-items:center;
  justify-content:center;font-size:22px;background:#eaf2f8;margin:0}
.kviz-badges .badge span{font-weight:600}
.kviz-badges .badge .st{margin-left:auto;color:var(--acc);font-weight:700}
.kviz-badges .mut{margin:10px 0 0;color:var(--mut);font-size:14px}
/* Prednosti (trust) v uvodnem nagovoru — humanizirano besedilo (t_0cfc0a48) */
.home-trust{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}
.home-trust li{position:relative;padding-left:26px;font-size:16px;color:#33404c}
.home-trust li::before{content:"✓";position:absolute;left:0;top:0;color:var(--green);font-weight:700}
.home-link{display:inline-block;margin:6px 0 0 14px;color:var(--mut);font-weight:600}
.home-link a{color:var(--prim);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.home-link a:hover{filter:brightness(.9)}
/* Kviz: koraki "Kako deluje" (humanizirano besedilo t_0cfc0a48) */
.home-steps-title{margin:16px 0 6px;font-size:15px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--mut);font-weight:700}
.home-steps{margin:0 0 6px;padding-left:22px}
.home-steps li{margin:4px 0}
/* Dovoli prelom dolgih besed/URL-jev (npr. "Vir:" povezave v FAQ) — brez
   tega dolg URL razširi stran in povzroči vodoravno drsenje na mobilnem. */
.faq dd,.faq dd p{overflow-wrap:anywhere}
.card p,.article p,.page-section p{overflow-wrap:break-word}
@media(max-width:760px){.home-box{padding:22px 18px}.home-box h2{font-size:22px}
  .home-link{display:block;margin:10px 0 0}}