/* ============================================================
   Elvis Media — design tokens
   Koncept: "Zatvarač". Sve boje izvedene iz logotipa.
   ============================================================ */

:root {
  /* ---- Ink (podloge) --------------------------------------
     Tamna paleta je namjerna odluka, ne stil: fotografija i
     video se čitaju točnije na tamnoj podlozi jer je okolni
     luminancni kontekst niži. Sve podloge su hladno-plave,
     izvedene iz podloge logotipa (#242938). */
  --ink-900: #0b0d14;   /* stranica */
  --ink-850: #0f111a;   /* alternirajuća sekcija */
  --ink-800: #141724;   /* kartica */
  --ink-700: #1c2030;   /* podignuta ploha */
  --ink-600: #262b3d;   /* hover ploha */

  /* ---- Linije ---- */
  --line:        rgb(255 255 255 / 0.08);
  --line-mid:    rgb(255 255 255 / 0.14);
  --line-strong: rgb(255 255 255 / 0.24);

  /* ---- Tekst ---- */
  --text:   #f3f4f8;
  --text-2: #a3a9bd;
  --text-3: #676e85;

  /* ---- Flare (gradijent iz logotipa) ---- */
  --flare-1: #ff9a2e;   /* narančasta */
  --flare-2: #f5325b;   /* crveno-roza */
  --flare-3: #c51fa0;   /* magenta */
  --flare: linear-gradient(100deg, var(--flare-1) 0%, var(--flare-2) 52%, var(--flare-3) 100%);
  --flare-soft: linear-gradient(100deg,
                  rgb(255 154 46 / 0.16) 0%,
                  rgb(245 50 91 / 0.16) 52%,
                  rgb(197 31 160 / 0.16) 100%);

  /* ---- Tipografija ----
     Trackanje je vezano uz veličinu, nikad jedna vrijednost za sve:
     veliki tekst se steže, sitni se otvara. */
  --font-display: "Inter Tight", "Inter", system-ui, -apple-system, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --step--1: clamp(0.8125rem, 0.79rem + 0.11vw, 0.875rem);
  --step-0:  clamp(0.9375rem, 0.91rem + 0.14vw, 1.0625rem);
  --step-1:  clamp(1.125rem, 1.06rem + 0.32vw, 1.375rem);
  --step-2:  clamp(1.375rem, 1.24rem + 0.66vw, 1.875rem);
  --step-3:  clamp(1.75rem, 1.47rem + 1.4vw, 2.75rem);
  --step-4:  clamp(2.25rem, 1.6rem + 3.2vw, 4.5rem);
  --step-5:  clamp(2.75rem, 1.3rem + 7.2vw, 7.5rem);

  /* ---- Ritam ---- */
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --measure: 62ch;
  --shell: 82.5rem;          /* 1320px */
  --section-y: clamp(5rem, 11vh, 9.5rem);
  --radius:    14px;
  --radius-lg: 20px;

  /* ---- Kretanje ----
     Nema ease-in nigdje: kasni baš u trenutku koji korisnik gleda. */
  --ease-out:    cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-shutter: cubic-bezier(0.16, 0.84, 0.24, 1);

  --dur-press: 120ms;
  --dur-tip:   150ms;
  --dur-menu:  220ms;
  --dur-sheet: 380ms;
  --dur-expose: 760ms;       /* ekspozicija je pripovjedna, smije biti duža */

  /* ---- Slojevi ---- */
  --z-hud: 40;
  --z-nav: 50;
  --z-menu: 60;
}

/* Na telefonu su razmaci među sekcijama predugi: 11vh gore i dolje znači
   gotovo pola ekrana prazno između dvije cjeline. */
@media (max-width: 44rem) {
  :root {
    --section-y: clamp(3.25rem, 8vh, 5rem);
    --gutter: clamp(1.125rem, 5vw, 1.5rem);
  }
}

/* Manje prozirnosti kad korisnik to traži: materijal postaje čvrst. */
@media (prefers-reduced-transparency: reduce) {
  :root { --glass-bg: var(--ink-800); --glass-blur: none; }
}
