/* ============================================================
   ŽAR° — noćni briketi · zajednički dizajn sustav
   Paleta: noć / kraft / žar — po uzoru na mockupe
   ============================================================ */
:root{
  --night:#1B1410;
  --night-2:#241A13;
  --kraft:#EDE2CC;
  --kraft-deep:#DCCDAF;
  --char:#261D15;
  --char-soft:#4A3B2E;
  --ember:#E0501F;
  --ember-dark:#B33E15;
  --amber:#F2A93B;
  --ash:#8A7A66;
  --ok:#4E7A3A;
  --paper:#F6EFDF;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--char);
  font-family:'Instrument Sans',sans-serif;font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
a{color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.wrap-narrow{max-width:820px;margin:0 auto;padding:0 22px}

h1{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(38px,5.6vw,62px);line-height:1.02;letter-spacing:-.015em;
}
h1 em{font-style:normal;color:var(--amber)}
h2{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(26px,3.8vw,38px);line-height:1.08;letter-spacing:-.01em;
  margin-bottom:16px;
}
.kicker{
  font-family:'Spline Sans Mono',monospace;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--amber);font-weight:600;margin-bottom:16px;
}

/* ---------- gumb ---------- */
.btn{
  display:inline-block;background:var(--ember);color:#FFF4E6;text-decoration:none;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:17.5px;
  padding:16px 30px;border-radius:12px;border:none;cursor:pointer;
  box-shadow:0 5px 0 var(--ember-dark),0 12px 26px rgba(224,80,31,.35);
  transition:transform .08s ease, box-shadow .08s ease;
}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ember-dark)}
.btn.ghost{background:transparent;color:var(--kraft);border:1px solid #4A3826;box-shadow:none}
.btn.small{font-size:15.5px;padding:12px 22px}

/* ---------- najava + nav ---------- */
.announce{
  background:var(--ember);color:#FFF4E6;text-align:center;
  font-size:13.5px;font-weight:600;padding:8px 14px;
}
.announce b{font-family:'Spline Sans Mono',monospace}
nav.main{
  background:var(--paper);border-bottom:1px solid var(--kraft-deep);
  position:sticky;top:0;z-index:60;
}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:20px}
.logo{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:26px;
  text-decoration:none;letter-spacing:-.01em;color:var(--char);
}
.logo span{color:var(--ember)}
.nav-links{display:flex;gap:26px;font-size:15px;font-weight:600}
.nav-links a{text-decoration:none;color:var(--char-soft)}
.nav-links a:hover{color:var(--ember)}
.nav-cta{
  background:var(--night);color:var(--kraft);text-decoration:none;font-weight:600;
  font-size:14.5px;padding:10px 20px;border-radius:10px;white-space:nowrap;
}

/* ---------- hero s fotografijom ---------- */
.hero{position:relative;color:var(--kraft);overflow:hidden;background:var(--night)}
.hero .hero-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
}
.hero .hero-shade{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(20,13,9,.92) 0%,rgba(20,13,9,.78) 42%,rgba(20,13,9,.35) 100%);
}
.hero .wrap{position:relative;z-index:2;padding-top:84px;padding-bottom:80px}
.hero p.sub{margin-top:18px;font-size:17.5px;color:#E4D8C0;max-width:520px}
.hero p.sub b{color:#FFF6E4}
.hero-ctas{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap;align-items:center}
.hero-note{margin-top:14px;font-size:13.5px;color:#C9B999}

/* Lekto-style centrirani hero (početna) */
.hero.centered{display:flex;align-items:center;min-height:72vh}
.hero.centered .wrap{width:100%;text-align:center;padding-top:70px;padding-bottom:70px}
.hero.centered .hero-shade{
  background:linear-gradient(180deg,rgba(20,13,9,.66) 0%,rgba(20,13,9,.44) 45%,rgba(20,13,9,.70) 100%);
}
.hero.centered h1{text-shadow:0 2px 24px rgba(15,10,7,.55)}
.hero.centered p.sub{margin-left:auto;margin-right:auto;max-width:560px;text-shadow:0 1px 14px rgba(15,10,7,.6)}
.hero.centered .hero-ctas{justify-content:center}

/* traka gorenja */
.burn{max-width:600px;margin:32px 0 0}
.burn-track{
  height:15px;border-radius:8px;position:relative;
  background:linear-gradient(90deg,#F6B93B 0%,var(--ember) 20%,#A33314 55%,#63301C 82%,#43301F 100%);
  box-shadow:0 0 24px rgba(224,80,31,.45);
  animation:glow 3.5s ease-in-out infinite alternate;
}
@keyframes glow{from{box-shadow:0 0 14px rgba(224,80,31,.3)}to{box-shadow:0 0 30px rgba(224,80,31,.55)}}
.burn-labels{
  display:flex;justify-content:space-between;margin-top:9px;
  font-family:'Spline Sans Mono',monospace;font-size:12.5px;color:#B4A488;
}
.burn-labels b{color:var(--kraft)}
.burn.on-paper .burn-labels{color:var(--ash)}
.burn.on-paper .burn-labels b{color:var(--char)}

/* ---------- USP traka ---------- */
.strip{background:var(--kraft);border-bottom:1px solid var(--kraft-deep)}
.strip-in{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:18px 0;
  font-size:13.5px;font-weight:600;color:var(--char-soft);text-align:center;
}
.strip-in div::before{content:"✓ ";color:var(--ember);font-weight:700}

/* ---------- sekcije ---------- */
section{padding:64px 0}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:30px;flex-wrap:wrap}
.sec-link{font-size:15px;font-weight:600;color:var(--ember);text-decoration:none;white-space:nowrap}

/* ---------- kartice proizvoda ---------- */
.prods{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.prod{
  background:#FFF;border:1px solid var(--kraft-deep);border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;text-decoration:none;
  transition:transform .12s ease, box-shadow .12s ease;
}
.prod:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(38,29,21,.12)}
.prod-img{height:190px;position:relative;overflow:hidden;background:var(--kraft)}
.prod-img img{width:100%;height:100%;object-fit:cover;display:block}
.prod-tag{
  position:absolute;top:14px;left:14px;background:var(--ember);color:#FFF4E6;
  font-family:'Spline Sans Mono',monospace;font-size:10.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;z-index:2;
}
.prod-tag.gold{background:var(--amber);color:var(--night)}
.prod-body{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.prod h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:19px}
.prod .p-sub{font-size:13.5px;color:var(--ash);margin:3px 0 12px}
.prod .p-price{
  margin-top:auto;display:flex;align-items:baseline;gap:10px;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:22px;
}
.prod .p-price s{font-size:.65em;color:var(--ash);font-weight:400}
.prod .p-night{font-family:'Spline Sans Mono',monospace;font-size:12px;color:var(--ember);font-weight:600}

/* ---------- koraci s fotografijama ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.step{
  background:#FFF;border-radius:14px;overflow:hidden;text-align:left;
  border:1px solid var(--kraft-deep);
}
.step .st-img{height:150px;overflow:hidden;position:relative}
.step .st-img img{width:100%;height:100%;object-fit:cover;display:block}
.step .st-body{padding:18px 20px 20px}
.step .n{
  font-family:'Spline Sans Mono',monospace;font-weight:600;font-size:13px;
  color:var(--ember);letter-spacing:.08em;
}
.step h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:18px;margin:6px 0 6px}
.step p{font-size:14.5px;color:var(--char-soft)}

/* ---------- zašto (tamna) ---------- */
.why{background:var(--night);color:var(--kraft)}
.why h2{color:var(--kraft)}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:8px}
.why-card{border-top:3px solid var(--ember);padding-top:16px}
.why-card .ic{font-size:26px}
.why-card h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:17px;margin:8px 0 6px}
.why-card p{font-size:14px;color:#CDBFA6}

/* ---------- jutro (split s fotkom) ---------- */
.morning{background:var(--kraft)}
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:38px;align-items:center}
.split .ph{border-radius:18px;overflow:hidden;border:1px solid var(--kraft-deep)}
.split .ph img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.split p{font-size:17px;color:var(--char-soft);max-width:520px;margin-top:6px}
.split p b{color:var(--char)}
.split .btn{margin-top:22px}

/* ---------- recenzije ---------- */
.rev-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:26px}
.rev-score{
  background:var(--ok);color:#FFF;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:800;font-size:22px;padding:8px 14px;border-radius:10px;
}
.rev-meta{font-size:14.5px;color:var(--char-soft)}
.rev-meta b{color:var(--char)}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.rev{background:#FFF;border:1px solid var(--kraft-deep);border-radius:14px;padding:20px}
.stars{color:var(--amber);letter-spacing:2px;font-size:15px}
.rev p{font-size:14.5px;color:var(--char-soft);margin:10px 0 12px}
.rev .who{font-size:13px;color:var(--ash);font-weight:600}
.rev .who span{font-weight:400}

/* ---------- vodiči ---------- */
.guides{background:var(--paper)}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.guide{
  background:#FFF;border-radius:14px;overflow:hidden;text-decoration:none;
  border:1px solid var(--kraft-deep);display:flex;flex-direction:column;
}
.guide .g-img{height:140px;overflow:hidden}
.guide .g-img img{width:100%;height:100%;object-fit:cover;display:block}
.guide .g-body{padding:18px 20px 20px}
.guide .g-tag{
  font-family:'Spline Sans Mono',monospace;font-size:11px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ember);
}
.guide h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:17.5px;margin:8px 0 6px}
.guide p{font-size:14px;color:var(--char-soft)}

/* ---------- garancija (foto pozadina) ---------- */
.guarantee-sec{position:relative;color:var(--kraft);text-align:center;overflow:hidden;background:var(--night)}
.guarantee-sec .g-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34}
.guarantee-sec .wrap{position:relative;z-index:2}
.guarantee-sec .ic{font-size:40px}
.guarantee-sec h2{color:var(--kraft);margin:12px 0 10px}
.guarantee-sec p{color:#E4D8C0;max-width:540px;margin:0 auto 26px;font-size:16.5px}

/* ---------- newsletter ---------- */
.news{background:var(--ember);color:#FFF4E6}
.news-in{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:center;padding:44px 0}
.news h2{color:#FFF4E6;font-size:clamp(22px,3vw,30px)}
.news p{margin-top:8px;font-size:15px;opacity:.92}
.news-form{display:flex;gap:10px}
.news-form input{
  flex:1;border:none;border-radius:10px;padding:15px 16px;font-size:15px;
  font-family:'Instrument Sans',sans-serif;background:#FFF4E6;color:var(--char);min-width:0;
}
.news-form .btn{background:var(--night);box-shadow:none;padding:14px 24px;font-size:15.5px}

/* ---------- footer ---------- */
footer{background:var(--night);color:#9C8C74;padding:48px 0 40px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
footer .logo{color:var(--kraft);font-size:24px}
footer h4{color:var(--kraft);font-size:14px;margin-bottom:12px;font-weight:600}
footer ul{list-style:none}
footer li{padding:4px 0}
footer a{text-decoration:none}
footer a:hover{color:var(--amber)}
.foot-note{
  border-top:1px solid #3A2C20;margin-top:34px;padding-top:20px;
  font-size:12px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
}

/* ============================================================
   LANDING — prodajna stranica
   ============================================================ */
.pain{background:var(--paper)}
.pain p{max-width:600px;font-size:17px;color:var(--char-soft)}
.pain p + p{margin-top:12px}
.pain .punch{
  margin-top:18px;font-family:'Bricolage Grotesque',sans-serif;font-weight:600;
  font-size:20px;color:var(--char);
}
.how{background:var(--kraft)}
.midcta{background:var(--kraft);text-align:center}
.midcta h2{max-width:640px;margin:0 auto 10px}
.midcta p{color:var(--char-soft);max-width:520px;margin:0 auto 26px}
.midcta .burn{margin:0 auto 30px}

/* usporedba gorenja */
.compare{background:var(--paper)}
.bars{margin-top:26px;display:flex;flex-direction:column;gap:18px;max-width:640px}
.bar-row .lbl{display:flex;justify-content:space-between;font-size:14.5px;margin-bottom:6px}
.bar-row .lbl b{font-family:'Spline Sans Mono',monospace;font-weight:600}
.bar{height:14px;border-radius:7px;background:var(--kraft-deep);overflow:hidden}
.bar i{display:block;height:100%;border-radius:7px}
.b-wood i{width:25%;background:#B08D57}
.b-oak i{width:50%;background:#8A5A2B}
.b-night i{width:100%;background:linear-gradient(90deg,var(--amber),var(--ember))}
.b-night .lbl b{color:var(--ember)}
.compare .note{margin-top:14px;font-size:13.5px;color:var(--ash)}

/* duel: sprinter vs maratonac */
.duel{background:var(--kraft)}
.duel-intro{max-width:620px;font-size:16.5px;color:var(--char-soft)}
.duel-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
.duel-card{background:var(--paper);border:1px solid var(--kraft-deep);border-radius:16px;overflow:hidden}
.duel-card .d-img{height:130px;overflow:hidden}
.duel-card .d-img img{width:100%;height:100%;object-fit:cover;display:block}
.duel-card .d-body{padding:22px}
.duel-card.night-side{background:var(--night);border-color:var(--night);color:var(--kraft)}
.duel-card .d-tag{
  font-family:'Spline Sans Mono',monospace;font-size:11.5px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ash);
}
.duel-card.night-side .d-tag{color:var(--amber)}
.duel-card h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:22px;margin:6px 0 4px}
.duel-card .d-sub{font-size:14px;color:var(--char-soft);margin-bottom:16px}
.duel-card.night-side .d-sub{color:#CDBFA6}
.duel-card ul{list-style:none}
.duel-card ul li{
  padding:8px 0;border-bottom:1px solid var(--kraft-deep);font-size:14.5px;
  display:flex;justify-content:space-between;gap:12px;
}
.duel-card.night-side ul li{border-bottom-color:#3A2C20}
.duel-card ul li b{font-family:'Spline Sans Mono',monospace;font-weight:600;white-space:nowrap}
.duel-card ul li:last-child{border-bottom:none}
.duel-verdict{
  margin-top:22px;text-align:center;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:600;font-size:19px;max-width:560px;margin-left:auto;margin-right:auto;
}
.duel-verdict span{color:var(--ember)}
.first-claim{margin-top:10px;text-align:center;font-size:14px;color:var(--ash)}

/* pepeo — tamna sekcija s fotkom */
.ash-sec{position:relative;color:var(--kraft);overflow:hidden;background:var(--night)}
.ash-sec .a-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28}
.ash-sec .wrap-narrow{position:relative;z-index:2}
.ash-sec h2{color:var(--kraft)}
.ash-sec p{max-width:620px;font-size:17px;color:#E4D8C0}
.ash-sec p b{color:var(--amber)}

/* cijena po noći */
.price{background:var(--kraft)}
.price-big{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(40px,8vw,64px);color:var(--ember);line-height:1;
}
.price-big small{font-size:.4em;font-weight:600;color:var(--char)}
.price p{max-width:600px;font-size:17px;color:var(--char-soft);margin-top:14px}

/* ---------- ponuda: galerija + buybox ---------- */
.offer{background:var(--night);color:var(--kraft);padding:64px 0}
.offer-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:start}
.gallery .g-main{
  border-radius:16px;overflow:hidden;border:1px solid #3A2C20;cursor:zoom-in;
  aspect-ratio:4/3;background:var(--night-2);
}
.gallery .g-main img{width:100%;height:100%;object-fit:cover;display:block}
.g-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px}
.g-thumbs button{
  border:1px solid #3A2C20;border-radius:10px;overflow:hidden;cursor:pointer;
  background:none;padding:0;aspect-ratio:1/1;
}
.g-thumbs button.on{border-color:var(--amber);box-shadow:0 0 0 1px var(--amber)}
.g-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.g-cap{margin-top:10px;font-size:12.5px;color:#9C8C74;font-family:'Spline Sans Mono',monospace}

.buybox .b-title{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:32px;color:var(--kraft)}
.b-priceline{display:flex;align-items:center;gap:14px;margin:12px 0 22px;flex-wrap:wrap}
.b-was{font-size:22px;color:#9C8C74;text-decoration:line-through}
.b-now{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:32px;color:var(--kraft)}
.b-save{
  background:var(--amber);color:var(--night);font-family:'Bricolage Grotesque',sans-serif;
  font-weight:600;font-size:17px;padding:6px 14px;border-radius:6px;
}
.b-size-lbl{font-size:15px;font-weight:600;color:var(--kraft);margin-bottom:10px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:baseline}
.b-size-lbl .deal{
  font-family:'Spline Sans Mono',monospace;font-size:11.5px;font-weight:600;
  color:var(--amber);letter-spacing:.06em;
}
.sizes{display:flex;flex-direction:column;gap:10px}
.size{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  border:1px solid #4A3826;border-radius:12px;padding:16px 18px;cursor:pointer;
  background:transparent;transition:all .12s ease;
}
.size:hover{border-color:var(--amber)}
.size.sel{background:var(--amber);border-color:var(--amber)}
.size .s-name{font-size:15.5px;font-weight:600;color:var(--kraft)}
.size .s-sub{display:block;font-size:12.5px;font-weight:400;color:#9C8C74;margin-top:1px}
.size.sel .s-name{color:var(--night)}
.size.sel .s-sub{color:#5A4526}
.size .s-price{
  font-family:'Spline Sans Mono',monospace;font-weight:600;font-size:15.5px;
  color:var(--amber);white-space:nowrap;text-align:right;
}
.size .s-price s{color:#9C8C74;font-weight:400;margin-left:8px;font-size:.85em}
.size.sel .s-price{color:var(--night)}
.size.sel .s-price s{color:#7A5E2E}
.s-pernight{
  display:block;font-family:'Spline Sans Mono',monospace;font-size:12px;
  color:#9C8C74;margin-top:3px;font-weight:400;
}
.size.sel .s-pernight{color:#5A4526}
.size.best{
  border:2px solid var(--amber);padding:22px 20px;
  background:linear-gradient(135deg,rgba(242,169,59,.10),rgba(224,80,31,.06));
  box-shadow:0 0 34px rgba(242,169,59,.16);position:relative;margin-top:16px;
}
.size.best.sel{background:var(--amber)}
.size.best .b-flag{
  position:absolute;top:-12px;left:18px;background:var(--ember);color:#FFF4E6;
  font-family:'Spline Sans Mono',monospace;font-size:10.5px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;border-radius:999px;
}
.size.best .s-name{font-size:17px}
.size.best .s-price{font-size:19px}
.best-night{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:20px;
  color:var(--amber);display:block;margin-top:4px;
}
.best-night s{font-size:.6em;color:#9C8C74;font-weight:400;margin-left:8px}
.size.best.sel .best-night{color:var(--night)}
.size.best.sel .best-night s{color:#7A5E2E}
.b-cart{width:100%;margin-top:18px;font-size:18px;padding:17px 20px}
.b-vat{margin-top:10px;font-size:12.5px;color:#9C8C74;text-align:center}
.b-alt{margin-top:6px;font-size:13.5px;color:#9C8C74;text-align:center}
.b-alt a{color:var(--amber);font-weight:600}

/* narudžba fallback (dok Stripe nije spojen) */
.order-note{
  display:none;margin-top:14px;background:var(--night-2);border:1px solid var(--amber);
  border-radius:12px;padding:16px 18px;font-size:14.5px;color:#E4D8C0;
}
.order-note.show{display:block}
.order-note a{color:var(--amber);font-weight:600}

.stock{margin-top:18px;font-family:'Spline Sans Mono',monospace;font-size:13px;color:#9C8C74;text-align:center}
.stock b{color:var(--amber)}
.timer{display:flex;gap:10px;justify-content:center;margin-top:14px}
.t-cell{
  background:var(--night);border:1px solid #3A2C20;border-radius:10px;
  padding:10px 0;width:64px;text-align:center;
}
.t-cell b{
  display:block;font-family:'Spline Sans Mono',monospace;font-size:24px;font-weight:600;
  color:var(--amber);font-variant-numeric:tabular-nums;line-height:1;
}
.t-cell span{font-size:10.5px;color:#9C8C74;text-transform:uppercase;letter-spacing:.08em}
.timer-cap{margin-top:8px;font-size:12.5px;color:#9C8C74;text-align:center}
.timer-cap b{color:var(--amber)}
.guarantee{margin-top:22px;font-size:14px;color:#CDBFA6;max-width:420px;margin-left:auto;margin-right:auto;text-align:center}
.guarantee b{color:var(--kraft)}

/* ---------- FAQ ---------- */
.faq{background:var(--paper)}
.faq details{border-bottom:1px solid var(--kraft-deep);padding:16px 0;max-width:680px}
.faq summary{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:600;font-size:17px;
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;
}
.faq summary::after{content:"+";color:var(--ember);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{margin-top:10px;font-size:15px;color:var(--char-soft);max-width:620px}

/* ---------- sticky CTA (landing) ---------- */
.sticky{
  position:fixed;bottom:0;left:0;right:0;z-index:50;
  background:var(--night);border-top:1px solid #3A2C20;
  padding:12px 18px;display:flex;align-items:center;justify-content:center;gap:16px;
}
.sticky .s-txt{color:var(--kraft);font-size:14px;font-weight:600;display:none}
.sticky .btn{font-size:16px;padding:13px 26px;box-shadow:0 4px 0 var(--ember-dark)}
@media(min-width:560px){.sticky .s-txt{display:block}}
body.has-sticky{padding-bottom:76px}

/* ---------- lightbox ---------- */
.lightbox{
  position:fixed;inset:0;z-index:100;background:rgba(15,10,7,.92);
  display:none;align-items:center;justify-content:center;padding:30px;cursor:zoom-out;
}
.lightbox.open{display:flex}
.lightbox img{max-width:100%;max-height:100%;border-radius:12px}

/* ---------- pravna stranica ---------- */
.legal{padding:56px 0}
.legal h1{font-size:clamp(30px,4.5vw,44px);margin-bottom:8px}
.legal h2{font-size:22px;margin:38px 0 10px}
.legal p,.legal li{font-size:15px;color:var(--char-soft);max-width:680px}
.legal ul{padding-left:20px;margin:8px 0}
.legal .muted{color:var(--ash);font-size:13.5px}
.legal .todo{background:#FFF3D6;border:1px solid var(--amber);border-radius:8px;padding:2px 8px;font-family:'Spline Sans Mono',monospace;font-size:13px}

/* ---------- responsive ---------- */
@media(max-width:860px){
  section{padding:48px 0}
  .nav-links{display:none}
  .hero .hero-shade{background:linear-gradient(180deg,rgba(20,13,9,.88) 0%,rgba(20,13,9,.72) 60%,rgba(20,13,9,.55) 100%)}
  .hero .wrap{padding-top:56px;padding-bottom:56px}
  .prods,.rev-grid,.guide-grid,.steps,.duel-grid{grid-template-columns:1fr}
  .why-grid,.strip-in{grid-template-columns:1fr 1fr}
  .split,.news-in,.offer-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .split .ph{order:-1}
}
