/* ============================================================
   NEOTEHNIKA v2 — TOKENI
   Sve vrednosti su iz DESIGN-SYSTEM.md. Nijedna boja, radijus
   ni font se ne uvodi van ovog fajla.
   ============================================================ */

:root{
  /* ---------- Brend (jedine dozvoljene boje, iz logotipa) ---------- */
  --blue-deep:#002F8F;
  --blue:     #2E55A9;
  --blue-lite:#92A6D1;
  --bronze:   #C1802F;
  --bronze-hi:#E8B573;
  --copper:   #A85C2E;

  /* ---------- Tonovi metala ----------
     Nisu brend boje i ne koriste se ni za tekst ni za površine — samo za
     kružić od 14px uz ime grupe u padajućoj listi „Materijal" (run 7).
     Vrednosti su zatečene: to su tonovi iz mesta-držača assets/img/ph/*.svg
     koje je run 5 sklonio, preseljeni ovde da imaju jedan izvor.
     Hardox je jedini izveden: njegov ton držača (#8E98A8) bio je gotovo
     isti kao crna metalurgija, pa je pomešan sa --bronze 76:24 da se dve
     sive grupe razlikuju — otud topla siva. */
  --m-aluminijum:#C9D2DA;        --m-aluminijum-2:#8A97A6;
  --m-bakar:#D9A07A;             --m-bakar-2:#A85C2E;
  --m-mesing:#DCC47F;            --m-mesing-2:#A8842F;
  --m-bronza:#D8A768;            --m-bronza-2:#8E5A2A;
  --m-kalaj-cink-olovo:#BFC7D2;  --m-kalaj-cink-olovo-2:#6E7A8A;
  --m-crna-metalurgija:#9AA4B2;  --m-crna-metalurgija-2:#39424F;
  --m-prohrom-inox:#DDE4EC;      --m-prohrom-inox-2:#94A1B2;
  --m-hardox:#9A928B;            --m-hardox-2:#2C3542;

  /* ---------- Radijusi ---------- */
  --r-shell:44px;
  --r-card:26px;
  --r-tile:18px;
  --r-xs:8px;          /* run 12: redovi liste, mehurici razgovora */
  --r-pill:999px;

  /* ---------- Staklo ---------- */
  --blur:22px;
  --blur-soft:14px;
  --blur-card:30px;   /* plutajuće kartice na fotografiji — providnije, jače zamućenje */
  /* Run 12: na telefonu pod 4x usporenim procesorom zamućenje od 22 px je
     početnoj dizalo p95 okvira pri skrolu na 50 ms. Manji poluprečnik je
     jeftiniji, a staklo ostaje staklo. */

  /* ---------- Razmak ---------- */
  --s1:4px;  --s2:8px;  --s3:12px; --s4:16px; --s5:20px; --s6:24px;
  --s7:32px; --s8:40px; --s9:56px; --s10:72px; --s11:96px; --s12:128px;

  --gutter:20px;
  --maxw:1440px;
  /* Ritam sekcija je prepolovljen (v2.1). Zaobljeni kontejneri sada nose
     razdvajanje sekcija, pa prazan prostor više ne mora. */
  --sect:clamp(36px,5.5vw,76px);
  --gap-head:20px;    /* blok naslova -> sadržaj  (bilo 32px) */
  --gap-lead:12px;    /* naslov -> uvodni pasus   (bilo 20px) */
  --gap-stack:10px;   /* između složenih staklenih kontejnera (bilo 16px) */
  --shell-inset:12px;
  --bar-h:64px;       /* visina zbijene lepljive trake */
  /* Visina trake u MIROVANJU (run 10). Zavisi od --shell-inset, pa ima dve
     vrednosti; run 8 je svuda računao 155px i zato je prsten na širinama
     ispod 1200 visio 12px niže nego što treba. Mereno. */
  --bar-rest:143px;
  --tabbar-h:71px;    /* mobilna tab traka, bez safe-area umetka */
  --fab:56px;         /* plutajuća dugmad: asistent i nazad na vrh */
  --fab-gap:12px;     /* obavezan razmak plutajuće dugmadi od tab trake */

  /* ---------- Levi rail (run 7: fiksan, prati skrol) ----------
     --rail-w je puna širina: 44px dugme + 2×10px unutrašnjeg razmaka
     + 2×1px ivice. Zbijene varijante su uže, ali rezervacija prostora
     namerno ostaje na punoj meri — gutter koji se menja sa visinom
     prozora pomerao bi ceo sadržaj pri svakoj promeni veličine.
     --rail-x je levi odmak: isti onaj koji je rail imao unutar .shell-a
     (var(--s5) unutar kontejnera koji stoji na var(--shell-inset)).
     --rail-gut je ono što sadržaj van heroja mora da ostavi slobodno. */
  --rail-w:66px;
  --rail-x:calc(var(--shell-inset) + var(--s5));
  --rail-gut:calc(var(--shell-inset) + var(--s5) + var(--rail-w) + 20px);

  /* ---------- Tipografija ---------- */
  --display:'Outfit', 'Segoe UI', system-ui, sans-serif;
  --ui:'Manrope', 'Segoe UI', system-ui, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;

  --fs-display:clamp(2.6rem,7.2vw,6.2rem);
  --fs-h1:clamp(2rem,4.4vw,3.4rem);
  --fs-h2:clamp(1.5rem,2.6vw,2.1rem);
  --fs-h3:clamp(1.05rem,1.6vw,1.25rem);
  --fs-body:1rem;
  --fs-sm:.9rem;
  --fs-xs:.875rem;
  --fs-label:.875rem;

  /* ---------- Kriva ---------- */
  --ease:cubic-bezier(.22,.61,.36,1);
  --fast:.22s; --mid:.42s; --slow:.7s;
}

@media (min-width:768px){ :root{ --gutter:36px; --shell-inset:18px; } }
@media (min-width:1200px){ :root{ --gutter:56px; --shell-inset:24px; --bar-rest:155px; } }
@media (max-width:900px){ :root{ --r-shell:24px; --r-card:20px; } }

/* ============================================================
   TEME
   Svetla je podrazumevana i odgovara referenci.
   ============================================================ */
:root,
[data-theme="light"]{
  --bg:      #EEF1F6;
  --bg-2:    #E4E9F1;
  --ink:     #0A111C;
  --ink-2:   #46536A;
  /* run 12: bilo #7A8699 (3,2–3,7:1 na pozadini i staklu) — sada >= 4,5:1 */
  --ink-3:   #4F5B6E;   /* run 12, 2. krug: #5B6678 je nad sjajem sekcija davao 3,9:1 */
  /* Bronza kao BOJA TEKSTA na svetloj temi: --bronze daje ~3:1, ova 4,7:1+ */
  --bronze-ink:#93561C;

  --glass:   rgba(255,255,255,.74);
  --glass-2: rgba(255,255,255,.88);
  --glass-brd:rgba(255,255,255,.62);
  --line:    rgba(10,17,28,.10);
  --line-2:  rgba(10,17,28,.18);

  --sh-card: 0 18px 50px -20px rgba(11,22,44,.32);
  --sh-lift: 0 28px 66px -22px rgba(11,22,44,.44);
  /* Tanka gornja ivica — svako staklo je dobija (stavka 5). */
  --hi-inset: inset 0 1px 0 rgba(255,255,255,.7);
  --sh-sm:   0 2px 10px rgba(0,47,143,.45);   /* run 12: kvaka klizaca */

  --on-accent:#FFFFFF;
}

[data-theme="dark"]{
  --bg:      #05090F;
  --bg-2:    #0A111C;
  --ink:     #EDF1F7;
  --ink-2:   #A9B6CC;
  /* run 12: bilo #6E7F9B (4,2:1 na tamnom staklu) */
  --ink-3:   #8494AE;
  --bronze-ink:#E8B573;   /* tamna: svetla bronza (#C1802F je na tamnom staklu 4,4:1) */

  /* Tamna tema: staklo je providnije (.6) da svetloplavi logotip i beli
     tekst dišu preko fotografije — stavka 19 iz liste doterivanja. */
  --glass:   rgba(16,26,41,.6);
  --glass-2: rgba(16,26,41,.86);
  --glass-brd:rgba(146,166,209,.18);
  --line:    rgba(146,166,209,.15);
  --line-2:  rgba(146,166,209,.28);

  --sh-card: 0 18px 50px -20px rgba(0,0,0,.7);
  --sh-lift: 0 28px 66px -22px rgba(0,0,0,.85);
  --hi-inset: inset 0 1px 0 rgba(255,255,255,.12);
  --sh-sm:   0 2px 10px rgba(0,0,0,.55);

  --on-accent:#FFFFFF;
}

/* Logotip se menja po temi preko dve <img> oznake u markupu, ne preko
   CSS promenljive — tako putanja radi na svakoj dubini foldera. */
.logo--light{ display:none; }
[data-theme="dark"] .logo--light{ display:block; }
[data-theme="dark"] .logo--dark{ display:none; }
@media (max-width:900px){ :root{ --blur:10px; --blur-soft:8px; --blur-card:12px; } }
/* ...a staklo u sadržaju (ne u traci, tab traci i doku) na telefonu nosi
   gušću boju umesto zamućenja — vidi css/style.css, „Run 12 — staklo". */
@media (max-width:900px){
  :root,[data-theme="light"]{ --glass:rgba(255,255,255,.9); }
  [data-theme="dark"]{ --glass:rgba(16,26,41,.9); }
}