/* v3 redizajn — home stranica + navigacija (učitava se preko <link precedence>
   iz komponenti u components/home/ i SiteHeader-a). Paleta i osnovne promenljive
   dolaze iz obi_pal_v215.css (:root). Sve novo je pod .v3-* prefiksom; jedina
   globalna izmena su nav-link pravila (aktivna stavka podvučena teal). */

/* ---------- navigacija ---------- */
.nav-link{border-bottom:2px solid transparent;padding:8px 0}
.nav-link:hover{color:var(--text);border-color:rgba(24,199,184,.45)}
.nav-link.active{color:var(--text);border-color:var(--teal)}

/* ♡ Sačuvano — ikonica sa brojem u nav-actions */
.v3-saved{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--gold);border-radius:999px;padding:9px 13px;text-decoration:none;font-weight:900;font-size:14px;line-height:1}
.v3-saved svg{width:16px;height:16px;flex:none}
.v3-saved:hover{border-color:rgba(215,180,106,.6);box-shadow:0 0 0 3px rgba(215,180,106,.12)}
.v3-saved.active{background:rgba(215,180,106,.16);border-color:rgba(215,180,106,.55)}

/* ---------- hero ---------- */
.v3-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:stretch;padding:48px 0 10px}
.v3-hero-copy{display:flex;flex-direction:column;justify-content:center;gap:16px;min-width:0}
.v3-hero-copy h1{font-size:clamp(36px,4.6vw,58px);line-height:1.04;margin:2px 0 0;letter-spacing:-.01em}
.v3-hero-sub{color:var(--muted);font-size:18px;line-height:1.6;margin:0;max-width:54ch}

.v3-search{margin-top:10px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,rgba(17,38,34,.92),rgba(9,23,21,.78));padding:18px;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:12px;align-items:end;box-shadow:var(--shadow)}
.v3-search label{display:grid;gap:6px;color:var(--muted);font-size:13px;font-weight:700;min-width:0}
.v3-search select{width:100%;border:1px solid var(--line);border-radius:12px;background:#0f211f;color:var(--text);padding:11px 12px}
.v3-search select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(24,199,184,.14)}
.v3-search .btn.primary{border-radius:12px;padding:12px 22px;white-space:nowrap}

.v3-hero-media{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);min-height:440px;background:#10201e;box-shadow:var(--shadow)}
.v3-hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.06) contrast(1.04)}
.v3-hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,19,18,.06) 40%,rgba(7,19,18,.72)),linear-gradient(20deg,rgba(24,199,184,.10),transparent 45%)}
.v3-hero-caption{position:absolute;left:18px;bottom:15px;z-index:2;color:var(--text);font-weight:800;font-size:13px;letter-spacing:.03em}

/* hero video rotator (HeroVideo.tsx) */
.v3-hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.06) contrast(1.04)}
.v3-hero-video-link{position:absolute;inset:0;z-index:1}
.v3-hero-video .v3-hero-caption{pointer-events:none}
.v3-hero-dots{position:absolute;right:16px;bottom:15px;z-index:2;display:flex;gap:8px}
.v3-hero-dots button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.45);cursor:pointer;transition:background .2s}
.v3-hero-dots button:hover{background:rgba(255,255,255,.75)}
.v3-hero-dots button.active{background:#fff}

/* ---------- traka poverenja ---------- */
.v3-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0 6px;padding:20px 24px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04)}
.v3-trust-item{display:grid;gap:3px;align-content:center}
.v3-trust-num{font-size:27px;font-weight:950;color:var(--text);line-height:1}
.v3-trust-label{color:var(--muted);font-size:13px}
.v3-trust-updated{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;font-weight:700}
.v3-dot{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px rgba(24,199,184,.16);flex:none}

/* ---------- sekcije ---------- */
.v3-section{padding:34px 0 6px}
.v3-section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:8px}
.v3-section-head h2{font-size:30px;margin:4px 0 6px}
.v3-section-head .sub{margin:0}

/* ---------- istaknuti projekti ---------- */
.v3-row-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin:24px 0 12px}
.v3-row-head h3{font-size:19px;margin:0;letter-spacing:.01em}
.v3-more{color:var(--teal);text-decoration:none;font-weight:800;font-size:14px;white-space:nowrap}
.v3-more:hover{text-decoration:underline}

.v3-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.v3-card{display:block;text-decoration:none;color:var(--text);border:1px solid var(--line);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.v3-card:hover{transform:translateY(-3px);border-color:rgba(24,199,184,.55);box-shadow:0 18px 50px rgba(0,0,0,.3)}
.v3-card .card-img{height:172px}
.v3-card-body{padding:14px 16px 16px;display:grid;gap:5px}
.v3-card-title{font-size:17px;font-weight:900;margin:0}
.v3-card-zone{color:var(--muted);font-size:13px}
.v3-card-meta{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:5px}
.v3-card-price{color:var(--gold);font-weight:950}
.v3-card-count{color:var(--muted);font-size:13px}

/* ---------- sniženja ---------- */
.v3-deals{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.v3-deal{display:grid;align-content:start;gap:8px;padding:16px;text-decoration:none;color:var(--text);border:1px solid rgba(215,180,106,.32);border-radius:16px;background:linear-gradient(180deg,rgba(215,180,106,.07),rgba(255,255,255,.02));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.v3-deal:hover{transform:translateY(-3px);border-color:rgba(215,180,106,.6);box-shadow:0 18px 50px rgba(0,0,0,.3)}
.v3-deal-badge{justify-self:start;background:rgba(215,180,106,.16);border:1px solid rgba(215,180,106,.5);color:var(--gold);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.v3-deal-project{color:var(--muted);font-size:13px;margin-top:2px}
.v3-deal-title{font-weight:900;font-size:16px;line-height:1.3}
.v3-deal-prices{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-top:2px}
.v3-deal-old{color:var(--muted);text-decoration:line-through;font-size:14px}
.v3-deal-new{font-size:20px;font-weight:950}
.v3-deal-cta{color:var(--teal);font-weight:800;font-size:14px}

/* ---------- kako funkcioniše ---------- */
.v3-how{display:flex;gap:18px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:18px 22px;background:rgba(255,255,255,.035)}
.v3-step{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.v3-step-num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(24,199,184,.16);color:var(--teal);font-weight:950;flex:none}
.v3-step b{display:block;font-size:15px}
.v3-step small{color:var(--muted);display:block;margin-top:2px}
.v3-step-arrow{color:var(--muted);opacity:.55;font-size:20px;flex:none}

/* ---------- završni CTA ---------- */
.v3-cta{margin:34px 0 44px;border:1px solid rgba(24,199,184,.35);border-radius:16px;padding:38px 28px;text-align:center;background:radial-gradient(circle at 50% -40%,rgba(24,199,184,.18),transparent 62%),linear-gradient(160deg,rgba(17,38,34,.9),rgba(9,23,21,.8));box-shadow:var(--shadow)}
.v3-cta h2{margin:0 0 8px;font-size:28px}
.v3-cta p{color:var(--muted);margin:0 auto 20px;max-width:60ch}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .v3-trust{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .v3-deals{grid-template-columns:repeat(2,1fr)}
  .v3-search{grid-template-columns:1fr 1fr}
  .v3-search .btn.primary{grid-column:1/-1}
}
@media(max-width:860px){
  .v3-hero{grid-template-columns:1fr;padding-top:26px;gap:20px}
  .v3-hero-media{min-height:260px;order:2}
  .v3-search{grid-template-columns:1fr}
  .v3-cards{grid-template-columns:1fr}
  .v3-deals{grid-template-columns:1fr}
  .v3-trust{grid-template-columns:1fr 1fr;padding:16px}
  .v3-trust-num{font-size:22px}
  .v3-how{flex-direction:column;align-items:stretch;gap:14px}
  .v3-step-arrow{display:none}
  .v3-section-head{flex-direction:column;align-items:flex-start}
  .v3-row-head{flex-wrap:wrap}
  .v3-saved span{font-size:13px}
}