/* =========================================================
   coverage.css , strana Coverage (mapa mreze)
   Tamna sekcija unutar svetlog sajta, sve je pod .cov-page.
   ========================================================= */

.cov-page{
  --cov-amber:#F0652B;
  --cov-ink:#191511;
  --cov-card:#231E19;
  background:var(--cov-ink);
  color:#EFEBE2;
}
.cov-page .container{max-width:1340px}

/* ---------- zaglavlje ---------- */
.cov-head{padding:78px 0 26px;text-align:center}
.cov-tag{display:inline-block;font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--cov-amber);font-weight:700;margin-bottom:14px}
.cov-head h1{font-size:clamp(30px,5vw,56px);line-height:1.05;letter-spacing:-.02em;
  color:#fff!important;margin:0;font-weight:700;text-wrap:balance}
.cov-head h1 span{color:var(--cov-amber)!important}
.cov-head p{max-width:66ch;margin:16px auto 0;color:#C7C0B4!important;font-size:17px}

/* ---------- mapa ---------- */
.cov-page .map-shell{position:relative;padding:16px 0 4px}
.cov-page .map-shell svg{width:100%;height:auto;display:block;overflow:visible}
/* kopno je jedna svetlija povrsina, bez ijedne granicne linije */
.cov-page .fx-state{fill:rgba(255,255,255,.062);stroke:none}
/* zone gde tovarimo, jedna tackica po zoni */
.cov-page .fx-dots{fill:var(--cov-amber);opacity:0}
.cov-page .map-shell.on .fx-dots{opacity:1;transition:opacity 1.1s ease-out .1s}

.cov-page .fx-lane{fill:none;stroke:var(--cov-amber);stroke-linecap:round;opacity:0;
  stroke-dasharray:var(--len,1200);stroke-dashoffset:var(--len,1200)}
.cov-page .map-shell.on .fx-lane{
  animation:covDraw 1.5s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay:calc(.35s + var(--i) * .055s);
}
@keyframes covDraw{to{stroke-dashoffset:0;opacity:var(--op)}}

/* zivi sloj: rute koje se pale i gase */
.cov-page .fx-live path{fill:none;stroke:#FF7A45;stroke-linecap:round;stroke-width:1.1;
  filter:drop-shadow(0 0 3px rgba(240,101,43,.55))}
.cov-page .fx-live circle{fill:#FFD8C4}
.cov-page .fx-live .flash{fill:none;stroke:#FFB694;stroke-width:1.6;opacity:0}

.cov-page .fx-dot{fill:var(--cov-amber);stroke:var(--cov-ink);stroke-width:1.5}
/* halo je mek sjaj, ne prsten, da se nigde ne ocrtava linija */
.cov-page .fx-halo{fill:var(--cov-amber);stroke:none;opacity:.16;filter:blur(2.5px)}
.cov-page .map-shell.on .fx-hub .fx-halo{animation:covPing 3.4s ease-out infinite}
.cov-page .fx-hub.is-major .fx-halo{opacity:.45}
.cov-page .map-shell.on .fx-hub.is-major .fx-halo{animation-duration:2.6s}
@keyframes covPing{
  0%{transform:scale(.72);opacity:.5}
  70%{transform:scale(1.5);opacity:0}
  100%{opacity:0}
}
.cov-page .fx-label{fill:#FFF;font-size:12.5px;font-weight:600;paint-order:stroke;
  stroke:rgba(25,21,17,.92);stroke-width:3.2px;stroke-linejoin:round}
.cov-page .fx-label.is-small{font-size:10.5px;font-weight:500;fill:#D9D2C6;stroke-width:2.8px}
.cov-page .fx-label.is-tiny{font-size:9px;font-weight:400;fill:#9A9286;stroke-width:2.4px}
.cov-page .fx-dot.is-tiny{fill:#C4501F;stroke-width:1}
.cov-page .fx-hub{opacity:0;cursor:default}
.cov-page .map-shell.on .fx-hub{
  animation:covPop .6s cubic-bezier(.34,1.56,.64,1) forwards;
  animation-delay:calc(var(--hi,0) * .04s);
}
@keyframes covPop{from{opacity:0}to{opacity:1}}

.cov-page .map-note{text-align:center;color:#8E877B!important;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;margin-top:4px}

/* ---------- brojke ---------- */
.cov-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.09);
  border-radius:18px;overflow:hidden;margin:48px 0 0}
.cov-stat{background:var(--cov-card);padding:26px 24px}
.cov-stat b{display:block;font-size:clamp(28px,4vw,44px);line-height:1;color:#fff;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.cov-stat span{display:block;margin-top:10px;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;color:#9A9286!important}

/* ---------- rute ---------- */
.cov-lanes{padding:70px 0 88px}
.cov-lanes h2{font-size:clamp(23px,3.4vw,34px);margin:0 0 8px;color:#fff!important;font-weight:700}
.cov-lanes h2.second{margin-top:58px}
.cov-lanes .sub{color:#9A9286!important;margin-bottom:26px;max-width:70ch}
.cov-lanes ol{list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:1px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.09);
  border-radius:18px;overflow:hidden}
.cov-lanes li{background:var(--cov-card);padding:13px 20px;display:flex;
  justify-content:space-between;align-items:center;gap:16px;
  transition:background .25s;font-size:15px}
.cov-lanes li:hover{background:#2C2620}
.cov-lanes .rt{font-weight:600;color:#fff!important}
.cov-lanes .rt em{font-style:normal;color:var(--cov-amber)!important;margin:0 6px}
.cov-lanes .rc{color:#9A9286!important;font-size:14px;white-space:nowrap;
  font-variant-numeric:tabular-nums}

/* ---------- poziv ---------- */
.cov-cta{border-top:1px solid rgba(255,255,255,.09);padding:58px 0 84px;text-align:center}
.cov-cta h2{font-size:clamp(23px,3.4vw,36px);color:#fff!important;margin:0;font-weight:700}
.cov-cta p{color:#9A9286!important;max-width:56ch;margin:14px auto 26px}
.cov-btn{display:inline-flex;align-items:center;gap:10px;background:var(--cov-amber);
  color:#fff!important;text-decoration:none;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;font-size:14px;padding:16px 34px;border-radius:50px;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.cov-btn:hover{transform:translateY(-2px);box-shadow:0 18px 40px -18px rgba(240,101,43,.8);
  color:#fff!important}

@media (max-width:767px){
  .cov-head{padding:54px 0 18px}
  .cov-lanes{padding:52px 0 66px}
}
@media (prefers-reduced-motion:reduce){
  .cov-page *,.cov-page *::before,.cov-page *::after{animation:none!important;transition:none!important}
  .cov-page .fx-lane{opacity:var(--op);stroke-dashoffset:0}
  .cov-page .fx-hub,.cov-page .fx-dots{opacity:1}
}
