/* ═══════════════════════════════════════════════════════════════
   Biroplast Solutions — V2 ZAPOSLITEV (samostojna stran).
   Predpona razredov "zap-".

   POMEMBNO: v1 je imel na tem mestu dve "odprti" delovni mesti
   (Serviser, Prodajni svetovalec) — v1 SAM jih je označil
   `ph-l PLACEHOLDER — spodnja mesta so primer postavitve`, torej NISO
   resnično trenutno odprta delovna mesta, ampak zgolj primer, kako bi
   bila prikazana. Objava izmišljenih razpisov bi zavajala iskalce
   zaposlitve, zato NISO prenesena — glej dnevnik. Stran namesto tega
   v ospredje postavi "samoiniciativno prijavo" (edina postavka v v1,
   ki ni bila označena kot primer). ═══════════════════════════════ */

.zap-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(165deg, var(--navy-mid), var(--navy) 55%, var(--navy-deep));
  color:#fff; padding:calc(var(--sp-7) + 30px) 0 var(--sp-7);
}
.zap-hero .wrap{ position:relative; z-index:2; max-width:720px; }
.zap-hero h1{ font-size:clamp(36px,4.6vw,56px); margin:2px 0 var(--sp-3); }
.zap-hero .lead{ max-width:560px; color:var(--muted-on-navy); margin-bottom:var(--sp-4); }
.zap-hero-cta{ display:flex; gap:var(--sp-2); flex-wrap:wrap; }
.zap-hero .circuit-field{ z-index:0; }
.zap-hero-bp{ width:600px; height:600px; right:-200px; bottom:-260px; opacity:.09; color:var(--lime); z-index:0; }
.zap-hero .glow-blue{ width:460px; height:460px; right:6%; top:-160px; opacity:.4; z-index:0; }
.zap-hero .glow-green{ width:380px; height:380px; left:2%; bottom:-190px; opacity:.32; z-index:0; }
@media (max-width:600px){ .zap-hero{ padding:calc(var(--sp-6) + 20px) 0 var(--sp-6); } }

/* ── zakaj pri nas — 4 kartice ─────────────────────────────── */
.zap-zakaj{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-3); }
.zap-kartica{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--sp-3); }
.zap-kartica h3{ font-size:16.5px; margin:var(--sp-2) 0 6px; }
.zap-kartica p{ color:var(--muted); font-size:14px; line-height:1.5; }
@media (max-width:900px){ .zap-zakaj{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .zap-zakaj{ grid-template-columns:1fr; } }

/* ── samoiniciativna prijava ───────────────────────────────── */
.zap-prijava{ max-width:640px; margin:0 auto; text-align:center; }
.zap-prijava .lead{ margin-bottom:var(--sp-3); }

/* ── zaključni CTA (".cta-band" podvojen namerno) ─────────────── */
.cta-band{
  position:relative; overflow:hidden; border-radius:var(--r-xl);
  background:linear-gradient(160deg, var(--navy-mid), var(--navy) 65%, var(--navy-deep));
  padding:var(--sp-7) var(--sp-5); text-align:center; color:#fff;
}
.cta-band::before{
  content:''; position:absolute; top:0; left:8%; right:8%; height:2px;
  background:linear-gradient(90deg, transparent, rgba(23,185,236,.55), rgba(171,208,57,.5), transparent);
}
.cta-band h2{ margin-bottom:var(--sp-2); font-size:clamp(30px, 3.2vw, 44px); }
.cta-band .lead{ margin:0 auto var(--sp-4); color:var(--muted-on-navy); }
.cta-btns{ display:flex; gap:var(--sp-2); justify-content:center; flex-wrap:wrap; }
@media (max-width:760px){ .cta-band{ padding:var(--sp-6) var(--sp-3); } }