/* ============================================================
   PRAVNE STRANE — Tajne Investiranja '26
   Tokeni i tipografija preuzeti iz index.html (Figma frame "LP").
   Jedan fajl za sve tri strane:
   uslovi-koriscenja.html, uslovi-kupovine.html, politika-privatnosti.html
   ============================================================ */
:root{
  --bg:              #051800;
  --zelena:          #269100;
  --zelena-tamna:    #247b05;
  --kartica:         #0b2305;
  --kutija-ikone:    #102e08;
  --ivica:           #113707;
  --traka:           #162d0d;
  --tekst:           #ffffff;
  --tekst-priguseno: rgba(255,255,255,.7);

  --sirina:   1248px;
  --radius:     12px;
  --radius-sm:   4px;
}

*,*::before,*::after{box-sizing:border-box}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }
body{
  margin:0;
  background:var(--bg);
  color:var(--tekst);
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:18px;
  line-height:26px;
  font-feature-settings:"lnum" 1,"pnum" 1;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.container{
  width:100%;
  max-width:var(--sirina);
  margin-inline:auto;
  padding-inline:24px;
}

.h-sekcija{
  font-size:36px; line-height:normal; letter-spacing:-0.72px;
  font-weight:700; text-transform:uppercase; margin:0;
}
.telo{ font-size:18px; line-height:26px; color:var(--tekst-priguseno); margin:0 }

/* Dugmad */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:16px 10px; border-radius:var(--radius-sm);
  font-size:16px; font-weight:700; line-height:normal;
  text-align:center;
  transition:background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn:active{ transform:translateY(1px) }
.btn--puni{ background:var(--zelena); color:#fff }
.btn--puni:hover{ background:#2ea800 }
.btn--linija{ border:1px solid var(--zelena); color:#fff; padding:12px 10px }
.btn--linija:hover{ background:var(--zelena) }

/* ============================================================
   NAV — isti kao na landingu
   ============================================================ */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(5,24,0,.86);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .2s ease;
}
.nav.je-skrolovan{ border-bottom-color:var(--ivica) }
.nav__unutra{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; height:90px;
}
.nav__linkovi{
  display:flex; align-items:center; gap:40px;
  font-size:16px; font-weight:500; letter-spacing:-0.32px;
  text-transform:uppercase; color:var(--zelena);
}
.nav__linkovi a{ transition:opacity .18s ease }
.nav__linkovi a:hover{ opacity:.72 }
.nav__linkovi a[aria-current="page"]{ color:#fff }
.nav .btn--linija{ width:183px; flex:none }

/* Logo */
.logo{ display:flex; align-items:center; width:183px; flex:none }
.logo__slika{ width:100%; height:auto; display:block }

/* ============================================================
   ZAGLAVLJE STRANE
   ============================================================ */
.pravno-vrh{ position:relative; padding-top:80px; padding-bottom:56px; overflow:hidden }
.pravno-vrh__dekor{
  position:absolute; inset:-40% -20% auto; height:760px; pointer-events:none;
  background:
    radial-gradient(38% 46% at 26% 50%, rgba(24,86,4,.34) 0%, rgba(5,24,0,0) 68%),
    radial-gradient(30% 40% at 74% 40%, rgba(24,86,4,.28) 0%, rgba(5,24,0,0) 66%);
  filter:blur(2px);
}
.pravno-vrh__sadrzaj{ position:relative }
.nadnaslov{
  display:inline-flex; align-items:center; gap:10px;
  font-size:14px; line-height:20px; letter-spacing:.6px;
  text-transform:uppercase; color:var(--zelena);
  margin-bottom:20px;
}
.nadnaslov::before{
  content:""; width:8px; height:8px; border-radius:2px;
  background:var(--zelena); flex:none;
}
.pravno-vrh h1{
  font-size:44px; line-height:48px; letter-spacing:-0.88px;
  font-weight:700; text-transform:uppercase; margin:0;
  max-width:760px;
}
.pravno-vrh__meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px;
  margin-top:24px;
  font-size:15px; line-height:22px; color:var(--tekst-priguseno);
}
.pravno-vrh__meta span{ display:flex; align-items:center; gap:8px }
.pravno-vrh__meta i{
  width:5px; height:5px; border-radius:50%; background:var(--zelena);
  display:block; flex:none; font-style:normal;
}

/* ============================================================
   GRID: bočna navigacija + telo dokumenta
   ============================================================ */
.pravno-grid{
  display:grid; grid-template-columns:286px 1fr;
  gap:80px;
  padding-bottom:120px;
  align-items:start;
}

.bok{ position:sticky; top:114px; display:flex; flex-direction:column; gap:32px }
.bok__naslov{
  font-size:13px; line-height:16px; letter-spacing:.8px;
  text-transform:uppercase; color:var(--tekst-priguseno);
  margin:0 0 14px;
}
.bok__lista{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px }
.bok__lista a{
  display:block; padding:9px 14px; border-radius:var(--radius-sm);
  font-size:15px; line-height:21px; color:var(--tekst-priguseno);
  border-left:2px solid transparent;
  transition:color .18s ease, background-color .18s ease, border-color .18s ease;
}
.bok__lista a:hover{ color:#fff; background:var(--kartica) }
.bok__lista a[aria-current="page"],
.bok__lista a.je-aktivan{
  color:#fff; background:var(--kartica); border-left-color:var(--zelena);
}
.bok__kutija{
  background:var(--kartica); border:1px solid var(--ivica);
  border-radius:var(--radius); padding:20px;
}
.bok__kutija p{ margin:0; font-size:15px; line-height:22px; color:var(--tekst-priguseno) }
.bok__kutija a{ color:var(--zelena) }
.bok__kutija a:hover{ text-decoration:underline }

/* ============================================================
   TELO DOKUMENTA
   ============================================================ */
.dokument{ max-width:760px; min-width:0 }
.dokument__uvod{
  font-size:20px; line-height:30px; color:var(--tekst-priguseno);
  margin:0 0 48px; padding-bottom:40px;
  border-bottom:1px solid var(--ivica);
}
.dokument section{ margin-bottom:56px; scroll-margin-top:120px }
.dokument section:last-of-type{ margin-bottom:0 }

.dokument h2{
  font-size:22px; line-height:28px; letter-spacing:-0.3px;
  font-weight:700; text-transform:uppercase; margin:0 0 20px;
  display:flex; gap:14px; align-items:baseline;
}
.dokument h2 .broj{
  color:var(--zelena); font-size:14px; line-height:28px;
  letter-spacing:.5px; flex:none; min-width:26px;
}
.dokument h3{
  font-size:17px; line-height:24px; font-weight:700;
  margin:32px 0 12px; color:#fff;
}
.dokument p{ font-size:17px; line-height:27px; color:var(--tekst-priguseno); margin:0 0 16px }
.dokument p:last-child{ margin-bottom:0 }
.dokument strong{ color:#fff; font-weight:700 }
.dokument a:not(.btn){ color:var(--zelena); text-decoration:underline; text-underline-offset:3px }
.dokument a:not(.btn):hover{ color:#3cb80a }

.dokument ul, .dokument ol{
  margin:0 0 16px; padding:0; list-style:none;
  display:flex; flex-direction:column; gap:10px;
}
.dokument li{
  position:relative; padding-left:26px;
  font-size:17px; line-height:27px; color:var(--tekst-priguseno);
}
.dokument ul > li::before{
  content:""; position:absolute; left:2px; top:11px;
  width:6px; height:6px; border-radius:2px; background:var(--zelena);
}
.dokument ol{ counter-reset:st }
.dokument ol > li{ counter-increment:st }
.dokument ol > li::before{
  content:counter(st) "."; position:absolute; left:0; top:0;
  color:var(--zelena); font-weight:700; font-size:15px; line-height:27px;
}

/* Kartica sa podacima organizatora */
.podaci{
  background:var(--kartica); border:1px solid var(--ivica);
  border-radius:var(--radius); padding:28px; margin:0 0 24px;
}
.podaci dl{ margin:0; display:grid; grid-template-columns:180px 1fr; gap:12px 20px }
.podaci dt{
  font-size:13px; line-height:24px; letter-spacing:.6px;
  text-transform:uppercase; color:var(--tekst-priguseno);
}
.podaci dd{ margin:0; font-size:17px; line-height:24px; color:#fff; min-width:0; overflow-wrap:anywhere }
.podaci dd a{ color:var(--zelena) }

/* Isticanje (odricanje od odgovornosti, upozorenja) */
.istaknuto{
  background:var(--kutija-ikone); border:1px solid var(--ivica);
  border-left:3px solid var(--zelena);
  border-radius:var(--radius-sm); padding:24px; margin:0 0 20px;
}
.istaknuto p:last-child{ margin-bottom:0 }
.istaknuto strong{ color:#fff }

/* Tabela cena po etapama */
.tabela{ width:100%; overflow-x:auto; margin:0 0 20px }
.tabela table{ width:100%; min-width:460px; border-collapse:collapse; font-size:16px }
.tabela th, .tabela td{
  text-align:left; padding:14px 16px;
  border-bottom:1px solid var(--ivica);
}
.tabela th{
  font-size:13px; letter-spacing:.6px; text-transform:uppercase;
  color:var(--tekst-priguseno); font-weight:700;
}
.tabela td{ color:var(--tekst-priguseno) }
.tabela td:first-child{ color:#fff; font-weight:700 }
.tabela tbody tr:last-child td{ border-bottom:0 }


/* ============================================================
   FOOTER — isti kao na landingu, plus pravni linkovi
   ============================================================ */
.futer{ background:#fff; color:var(--bg); margin-top:0 }
.futer__unutra{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px 40px; min-height:114px; flex-wrap:wrap; padding-block:24px;
}
.futer__linkovi{
  display:flex; align-items:center; gap:28px; flex-wrap:wrap;
  font-size:13px; line-height:18px; text-transform:uppercase; letter-spacing:.4px;
}
.futer__linkovi a{ color:var(--bg); opacity:.65; transition:opacity .18s ease }
.futer__linkovi a:hover{ opacity:1; text-decoration:underline }
.futer__copy{ font-size:12px; line-height:15px; text-transform:uppercase }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1180px){
  .pravno-grid{ grid-template-columns:250px 1fr; gap:56px }
  .pravno-vrh h1{ font-size:38px; line-height:43px }
}
@media (max-width:900px){
  .nav__linkovi{ display:none }
  .nav__unutra{ height:76px }
  .nav .btn--linija{ width:auto; padding-inline:20px }
  .pravno-grid{ grid-template-columns:1fr; gap:40px; padding-bottom:96px }
  .bok{ position:static }
  .bok__lista{ flex-direction:row; flex-wrap:wrap; gap:8px }
  .bok__lista a{ border-left:0; border:1px solid var(--ivica); padding:8px 14px }
  .bok__lista a[aria-current="page"],
  .bok__lista a.je-aktivan{ border-color:var(--zelena) }
  .bok__toc{ display:none }
  .dokument{ max-width:none }
}
@media (max-width:560px){
  body{ font-size:17px }
  .pravno-vrh{ padding-top:56px; padding-bottom:40px }
  .pravno-vrh h1{ font-size:30px; line-height:35px; letter-spacing:-0.5px }
  .dokument__uvod{ font-size:18px; line-height:27px; margin-bottom:40px; padding-bottom:32px }
  .dokument h2{ font-size:20px; line-height:26px; flex-direction:column; gap:6px }
  .dokument h2 .broj{ line-height:18px }
  .podaci{ padding:20px }
  .podaci dl{ grid-template-columns:1fr; gap:4px }
  .podaci dt{ margin-top:12px }
  .podaci dl > dt:first-child{ margin-top:0 }
  .futer__unutra{ flex-direction:column; text-align:center; padding-block:32px }
  .futer__linkovi{ justify-content:center; gap:20px }
}
@media (max-width:380px){
  .container{ padding-inline:16px }
  .nav__unutra{ gap:12px; height:68px }
  .logo{ transform:scale(.8); transform-origin:left center }
  .nav .btn--linija{ padding-inline:12px; font-size:13px }
  .pravno-vrh h1{ font-size:26px; line-height:31px }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto }
  *{ transition-duration:.01ms !important }
}