/* Razločno – pogovor v tiskanem okvirju
   Barve: črnilo #2c2c96, noč #1c1c5f, medenina #c08c59, citrona #c3c322, papir #f5f5fa, sivka #e2e2f3, besedilo #1b1b2d */
:root{
  --crnilo:#2c2c96;
  --noc:#1c1c5f;
  --medenina:#c08c59;
  --medenina-temna:#7a4f22;
  --citrona:#c3c322;
  --papir:#f5f5fa;
  --sivka:#e2e2f3;
  --besedilo:#1b1b2d;
  --naslov:'Kurale', Georgia, serif;
  --tekst:'PT Sans', 'Trebuchet MS', sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--papir);color:var(--besedilo);font-family:var(--tekst);font-size:18px;line-height:1.62;padding-bottom:104px}
img{max-width:100%;height:auto;display:block}
a{color:var(--crnilo)}
a:focus-visible,summary:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--medenina);outline-offset:3px}
h1,h2,h3{font-family:var(--naslov);font-weight:400;line-height:1.15;margin:0 0 .6em;color:var(--noc)}
h1{font-size:clamp(2rem,3.4vw,3rem)}
h2{font-size:clamp(1.75rem,2.6vw,2.4rem)}
h3{font-size:1.5rem}
p{margin:0 0 1em}
small{font-size:.9rem}

/* ---------- glava ---------- */
.glava{background:var(--papir);border-bottom:5px solid var(--crnilo);box-shadow:0 3px 0 var(--papir),0 5px 0 var(--crnilo)}
.glava-in{max-width:1240px;margin:0 auto;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.znak{font-family:var(--naslov);font-size:2rem;color:var(--noc);text-decoration:none;letter-spacing:.01em}

/* ---------- gumbi ---------- */
.gumb{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-family:var(--tekst);font-weight:700;color:var(--besedilo);background:var(--citrona);border:4px double var(--noc);line-height:1.2;transition:background-color .15s}
.gumb:hover{background:#d4d43a}
.gumb-glava{min-height:52px;padding:8px 20px;font-size:18px}
.gumb-glavni{min-height:84px;min-width:320px;padding:14px 30px;font-size:23px}

/* ---------- tiskani okvir z rezalnimi znamkami ---------- */
.tisk{position:relative;border:7px double var(--crnilo);background:var(--papir)}
.tisk::before{content:"";position:absolute;inset:-20px;pointer-events:none;
  background:
    linear-gradient(var(--medenina),var(--medenina)) left top/30px 3px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) left top/3px 30px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) right top/30px 3px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) right top/3px 30px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) left bottom/30px 3px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) left bottom/3px 30px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) right bottom/30px 3px no-repeat,
    linear-gradient(var(--medenina),var(--medenina)) right bottom/3px 30px no-repeat}

/* ---------- iniciale na robu (podpisni element) ---------- */
.ini{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;font-family:var(--naslov);font-size:1.45rem;line-height:1;border:5px double var(--crnilo)}
.ini-vpr{background:var(--crnilo);color:var(--papir);border-color:var(--papir);outline:2px solid var(--crnilo)}
.ini-odg{background:var(--papir);color:var(--crnilo)}
.ini-svetel.ini-vpr{background:var(--citrona);color:var(--noc);border-color:var(--noc);outline-color:var(--citrona)}
.ini-svetel.ini-odg{background:transparent;color:var(--papir);border-color:var(--papir)}

.izmenjava{margin:0 0 2rem}
.vpr,.odg{display:grid;grid-template-columns:84px minmax(0,1fr);align-items:start;margin:0 0 1.1rem}
.vpr strong{font-size:1.18rem;line-height:1.45;color:var(--noc);padding-top:.35rem}
.odg > div > p:last-child{margin-bottom:0}
.odg > span:last-child{padding-top:.35rem}

/* ---------- uvod ---------- */
.uvod{padding:44px 28px 64px}
.tisk-uvod{max-width:1200px;margin:0 auto;padding:36px 40px 30px;display:grid;
  grid-template-columns:150px minmax(0,1fr) minmax(0,440px);
  grid-template-areas:"okraj besedilo foto" "okraj izmenjava foto";gap:20px 40px}
.okraj{grid-area:okraj;border-right:3px double var(--crnilo);padding-right:18px}
.oseba{display:flex;flex-direction:column;gap:8px;margin:0 0 1.6rem}
.vloga{font-size:.95rem;line-height:1.35;color:var(--besedilo)}
.uvod-besedilo{grid-area:besedilo}
.uvod-besedilo h1{margin-bottom:.45em}
.perex{font-size:1.1rem;max-width:62ch}
.opomba{font-size:.95rem;margin-top:.7rem;color:#3b3b55}
.uvod-foto{grid-area:foto;margin:0}
.uvod-foto img{width:100%;height:560px;object-fit:cover;object-position:47% 40%;border:6px double var(--crnilo);padding:5px;background:var(--papir)}
.uvod-foto figcaption{font-size:.95rem;line-height:1.45;margin-top:.7rem;color:#3b3b55}
.uvod-izmenjava{grid-area:izmenjava;border-top:3px double var(--crnilo);padding-top:1.4rem;margin:0}

/* ---------- prizori ---------- */
.ozko{max-width:860px;margin:0 auto;padding:0 28px}
.prizori{padding:40px 0 70px}
.uvodnik{font-size:1.1rem;max-width:62ch}
.pogovor{max-width:860px;margin:0 auto;padding:0 28px}
.prizor{padding:2.4rem 0 .6rem;border-top:3px double var(--crnilo)}
.prizor:first-child{border-top:0}
.prizor h3{color:var(--crnilo);margin-left:84px}
.vlozek{margin:0 0 1.8rem}
.vlozek img{width:100%;border:6px double var(--crnilo);padding:5px;background:var(--papir)}
.vlozek figcaption{font-size:.95rem;margin-top:.6rem;color:#3b3b55;padding-left:84px}

/* pas z mislijo (poln barvni pas) */
.misel{background:var(--crnilo);color:var(--papir);margin:2.4rem 0;padding:56px 28px}
.misel blockquote{max-width:960px;margin:0 auto;border-top:7px double var(--medenina);border-bottom:7px double var(--medenina);padding:30px 0}
.misel p{font-family:var(--naslov);font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.25;margin:0 0 1rem}
.misel footer{display:flex;align-items:center;gap:14px;font-size:1rem}

/* ---------- razlaga ---------- */
.razlaga{background:var(--sivka);padding:70px 0}
.ilustracija{max-width:760px;margin:0 auto 3rem;padding:0 28px}
.ilustracija img{width:100%;border:6px double var(--crnilo);padding:6px;background:#fff}
.ilustracija figcaption{font-size:.95rem;margin-top:.6rem;color:#3b3b55}
.vzroki{max-width:1100px;margin:0 auto 3rem;padding:0 28px}
.vzroki-naslov{font-size:clamp(1.6rem,2.4vw,2.1rem);text-align:center;margin-bottom:1.4rem}
.vzroki-mreza{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:7px double var(--crnilo);background:var(--papir)}
.vzrok{padding:28px 30px}
.vzrok:nth-child(odd){border-right:3px double var(--crnilo)}
.vzrok:nth-child(-n+2){border-bottom:3px double var(--crnilo)}
.vzrok h3{font-size:1.3rem;color:var(--crnilo)}
.vzrok p{margin:0}
.razlaga .ozko h3{color:var(--crnilo);margin-left:84px}

/* ---------- številka (poln pas) ---------- */
.stevilka{background:var(--noc);color:var(--papir);padding:70px 28px}
.stevilka-in{max-width:1100px;margin:0 auto}
.stevilka h2{color:var(--papir)}
.stevilka-mreza{display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:48px;align-items:start}
.graf{margin:0;border:7px double var(--citrona);padding:8px;background:var(--papir)}
.graf img{width:100%}
.stevilka .vpr strong{color:var(--papir)}

/* ---------- ponudba ---------- */
.ponudba{padding:80px 28px}
.tisk-ponudba{max-width:1100px;margin:0 auto;padding:44px 48px;display:grid;grid-template-columns:5fr 7fr;gap:0 48px}
.ponudba-glava{grid-column:1;grid-row:1 / span 3;align-self:center}
.cena{display:inline-flex;flex-direction:column;align-items:center;margin-top:1.4rem;padding:18px 28px;border:7px double var(--crnilo);background:var(--sivka)}
.cena-znesek{font-family:var(--naslov);font-size:3.4rem;line-height:1;color:var(--noc)}
.cena-opis{font-size:1rem;font-weight:700;color:var(--besedilo);margin-top:.4rem}
.cena-pojasnilo{font-size:1.125rem;line-height:1.55;margin:1.2rem 0 0;max-width:30ch;padding-top:1rem;border-top:1px solid var(--crnilo)}
.tisk-ponudba .izmenjava,.ponudba-gumb{grid-column:2}
.ponudba-gumb{margin:0;padding-left:84px}

/* ---------- mnenja ---------- */
.mnenja{background:var(--sivka);padding:70px 28px}
.mnenja-in{max-width:1100px;margin:0 auto}
.mnenja-vrsta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:7px double var(--crnilo);border-bottom:7px double var(--crnilo)}
.mnenje{margin:0;padding:30px 26px}
.mnenje + .mnenje{border-left:3px double var(--crnilo)}
.mnenje blockquote{margin:0 0 1rem;font-family:var(--naslov);font-size:1.4rem;line-height:1.35;color:var(--noc)}
.mnenje cite{font-style:normal;font-weight:700;font-size:1rem;color:var(--medenina-temna)}

/* ---------- vprašanja ---------- */
.vprasanja{padding:80px 28px}
.vprasanja-in{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:5fr 7fr;gap:48px}
.vprasanja-seznam{border-top:3px double var(--crnilo)}
.vprasanja details{border-bottom:3px double var(--crnilo);padding:0}
.vprasanja summary{cursor:pointer;list-style:none;font-family:var(--naslov);font-size:1.3rem;color:var(--noc);padding:18px 44px 18px 0;position:relative}
.vprasanja summary::-webkit-details-marker{display:none}
.vprasanja summary::after{content:"+";position:absolute;right:6px;top:12px;font-size:1.8rem;color:var(--crnilo)}
.vprasanja details[open] summary::after{content:"–"}
.vprasanja details p{padding:0 0 18px}

/* ---------- sklep (poln pas) ---------- */
.sklep{background:var(--crnilo);color:var(--papir);padding:70px 28px}
.sklep-in{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:48px;align-items:center}
.sklep-foto{margin:0}
.sklep-foto img{width:100%;border:6px double var(--papir);padding:5px}
.sklep-foto figcaption{font-size:.95rem;margin-top:.6rem;color:#e6e6f4}
.sklep h2{color:var(--papir)}
.sklep .vpr strong{color:var(--papir)}
.sklep .gumb-glavni{margin-top:.6rem;border-color:var(--papir)}

/* ---------- noga ---------- */
.noga{background:var(--noc);color:#e6e6f4;padding:40px 28px 34px;border-top:6px double var(--medenina)}
.noga-in{max-width:1100px;margin:0 auto}
.noga-znak{font-family:var(--naslov);font-size:1.6rem;color:var(--papir);margin-bottom:.4rem}
.noga a{color:#fff}
.noga-povezave{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.95rem}
.noga-mail,.noga-copy{font-size:.95rem}

/* ---------- podstrani ---------- */
.podstran{display:flex;flex-direction:column;min-height:100vh}
.podstran main{flex:1;padding:56px 28px 70px}
.list{max-width:760px;margin:0 auto;padding:40px 44px}
.list h1{font-size:clamp(1.9rem,3vw,2.6rem)}
.list h2{font-size:1.45rem;margin-top:1.6em;color:var(--crnilo)}
.obrazec{display:grid;gap:8px}
.obrazec label{font-weight:700}
.obrazec input,.obrazec textarea{font:inherit;padding:12px 14px;border:3px double var(--crnilo);background:#fff;color:var(--besedilo)}
.obrazec .gumb{margin-top:14px;min-height:64px;font-size:20px;cursor:pointer}
#kontaktDakujeme{margin-top:1rem;padding:18px 20px;border:5px double var(--crnilo);background:var(--sivka);font-weight:700}

/* ---------- pojavno okno in spodnja vrstica (engine) ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(14,14,46,.86);display:none;align-items:center;justify-content:center;z-index:1000;padding:16px}
.modal-overlay.show{display:flex}
.modal{position:relative;width:min(640px,100%);max-height:calc(100vh - 32px);overflow:auto;background:var(--papir);border:8px double var(--crnilo);padding:40px 36px 34px;text-align:center;color:var(--besedilo)}
.modal .close{position:absolute;top:8px;right:10px;width:48px;height:48px;border:0;background:transparent;font-size:2.4rem;line-height:1;color:var(--noc);cursor:pointer}
.modal .badge{display:inline-block;background:var(--noc);color:var(--papir);font-weight:700;padding:6px 16px;margin-bottom:14px;font-size:1rem}
.modal h3{font-family:var(--naslov);font-size:46px;color:var(--crnilo);margin:.1em 0 .25em;white-space:nowrap}
.modal > p{font-size:1.3rem;font-weight:700;margin-bottom:.8rem}
.modal .offer{border-top:3px double var(--crnilo);border-bottom:3px double var(--crnilo);padding:14px 0 4px;margin:0 0 22px}
.modal .offer p{margin:0 0 .6rem;font-size:1.1rem}
.modal .btn{white-space:normal}
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font-weight:700;color:var(--besedilo);background:var(--citrona);border:4px double var(--noc);line-height:1.25}
.btn-cta-xl{width:100%;min-height:86px;font-size:23px;padding:14px 22px}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:900;background:var(--noc);color:var(--papir);display:flex;align-items:center;justify-content:center;gap:22px;padding:12px 20px;border-top:5px double var(--citrona)}
.sticky-cta > span{font-weight:700;font-size:1.05rem}
.sticky-cta .btn{flex:0 0 auto;min-height:62px;padding:10px 26px;font-size:19px;border-color:var(--papir)}

/* ---------- mobil ---------- */
@media (max-width:900px){
  .tisk-uvod{grid-template-columns:minmax(0,1fr);grid-template-areas:"besedilo" "okraj" "foto" "izmenjava";padding:26px 22px 22px}
  .okraj{border-right:0;border-top:3px double var(--crnilo);border-bottom:3px double var(--crnilo);padding:12px 0;display:flex;flex-wrap:wrap;gap:12px 20px}
  .oseba{flex-direction:row;align-items:center;margin:0}
  .uvod-foto img{height:auto;aspect-ratio:4/3}
  .stevilka-mreza,.tisk-ponudba,.vprasanja-in,.sklep-in{grid-template-columns:minmax(0,1fr);gap:28px}
  .ponudba-glava{grid-row:auto}
  .tisk-ponudba .izmenjava,.ponudba-gumb{grid-column:1}
  .vzroki-mreza{grid-template-columns:minmax(0,1fr)}
  .vzrok:nth-child(odd){border-right:0}
  .vzrok:not(:last-child){border-bottom:3px double var(--crnilo)}
  .mnenja-vrsta{grid-template-columns:minmax(0,1fr)}
  .mnenje + .mnenje{border-left:0;border-top:3px double var(--crnilo)}
}
@media (max-width:600px){
  body{padding-bottom:150px;font-size:17.5px}
  .glava-in{padding:10px 16px}
  .znak{font-size:1.6rem}
  .gumb-glava{font-size:18px;min-height:48px;padding:6px 12px}
  .uvod{padding:30px 14px 44px}
  .tisk::before{inset:-10px;background-size:18px 3px,3px 18px,18px 3px,3px 18px,18px 3px,3px 18px,18px 3px,3px 18px}
  .tisk-uvod{padding:20px 16px}
  h1{font-size:2rem}
  .perex{font-size:1.07rem}
  .gumb-glavni{min-width:0;width:100%;font-size:21px;padding:14px 16px}
  .vpr,.odg{grid-template-columns:58px minmax(0,1fr)}
  .ini{width:46px;height:46px;font-size:1.1rem;border-width:4px}
  .prizor h3,.razlaga .ozko h3{margin-left:0}
  .vlozek figcaption{padding-left:0}
  .ozko,.pogovor{padding:0 18px}
  .ilustracija,.vzroki{padding:0 16px}
  .vzrok{padding:22px 18px}
  .stevilka,.mnenja,.vprasanja,.sklep,.ponudba{padding-left:16px;padding-right:16px}
  .tisk-ponudba{padding:26px 18px}
  .ponudba-gumb{padding-left:0}
  .misel{padding:40px 18px}
  .list{padding:26px 18px}
  .podstran main{padding:34px 14px 50px}
  .sticky-cta{flex-direction:column;gap:8px;padding:10px 12px}
  .sticky-cta > span{font-size:1rem;text-align:center}
  .sticky-cta .btn{width:100%;min-height:60px}
  .modal{padding:34px 18px 24px}
  .modal h3{font-size:34px}
  .btn-cta-xl{font-size:20px}
}
