/* ============================================================
   RM — Robimy Marki · Design Tokens
   Wszystkie kolory / typografia / spacing jako zmienne.
   Zero wartości hardkodowanych w komponentach.
   ============================================================ */

:root {
  /* — Paleta z klipu (Legion VPN) — biały marmur + ZŁOTO — */
  /* akcent: złoto (pozłacana figura z klipu); espresso zeszło do skali ink */
  --accent: #9A7736;             /* gilt gold — akcent UI/tekst */
  --accent-2: #C8B4A6;           /* piaskowy taupe */
  --accent-ink: #1A1817;         /* tekst na złocie (ciemny) */
  --accent-soft: rgba(154, 119, 54, 0.12);
  --gold-1: #E4C77E;             /* jasne złoto (gradient) */
  --gold-2: #B08A3E;             /* ciemne złoto (gradient) */
  --gold-3: #8A6B2E;
  --steel: #2C5671;              /* muśnięcie błękitu — tylko liquid glass */
  --gold-grad: linear-gradient(135deg, var(--gold-1) 0%, var(--gold-2) 55%, var(--gold-3) 100%);

  /* — Skala szarości (warm, z klipu) — */
  --ink-900: #1A1817;            /* grafit tekstu */
  --ink-800: #24201E;
  --ink-700: #322C29;
  --ink-600: #46302B;
  --ink-500: #535652;            /* marmur cień */
  --ink-400: #7A736D;
  --ink-300: #A6A19B;            /* marmur mid */
  --ink-200: #C8B4A6;
  --ink-100: #E3DAD1;
  --ink-050: #F4EEE7;            /* kremowe tło (z klipu) */
  --paper:   #F8F5F0;
  --marble:  #FBF9F6;            /* prawie biel marmuru */

  /* — Typografia — */
  --font-display: "Bodoni Moda", Didot, "Times New Roman", serif;
  --font-text: "Instrument Sans", system-ui, sans-serif;
  --fw-display: 700;
  --fw-heavy: 600;
  --fw-med: 500;
  --fw-reg: 400;

  /* płynne skale nagłówków (edytorskie 6–9vw) */
  --fs-mega: clamp(3.2rem, 13vw, 12rem);
  --fs-h1:   clamp(2.6rem, 8.5vw, 8rem);
  --fs-h2:   clamp(2rem, 5.5vw, 4.6rem);
  --fs-h3:   clamp(1.4rem, 2.6vw, 2.2rem);
  --fs-lead: clamp(1.05rem, 1.7vw, 1.5rem);
  --fs-body: clamp(1rem, 1.15vw, 1.15rem);
  --fs-label: 0.72rem;

  --lh-tight: 0.92;
  --lh-snug: 1.05;
  --lh-body: 1.55;
  --tracking-label: 0.18em;

  /* — Spacing (skala 8) — */
  --sp-1: 0.5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2rem;
  --sp-5: 3rem;
  --sp-6: 4rem;
  --sp-7: 6rem;
  --sp-8: 8rem;
  --sp-9: 12rem;

  --gutter: clamp(1.25rem, 5vw, 5rem);
  --maxw: 100rem;

  /* — Radius (minimalny — edytorski = ostry) — */
  --r-sm: 2px;
  --r-md: 6px;
  --r-pill: 100px;

  /* — Ruch — */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.76, 0, 0.24, 1);
  --dur-fast: 0.35s;
  --dur-med: 0.7s;
  --dur-slow: 1.1s;

  --z-cursor: 9999;
  --z-nav: 900;
  --z-preloader: 1000;
}

/* — MOTYW JASNY (domyślny — reguła: strona ma być jasna) — */
:root,
:root[data-theme="light"] {
  --bg: var(--ink-050);
  --bg-elev: var(--marble);
  --bg-elev-2: #FFFFFF;
  --text: var(--ink-900);
  --text-dim: var(--ink-500);
  --text-faint: var(--ink-400);
  --line: rgba(20, 17, 14, 0.14);
  --line-strong: rgba(20, 17, 14, 0.30);
  --glass: rgba(251, 249, 245, 0.55);
  --glass-line: rgba(255, 255, 255, 0.7);
  --marble-shadow: rgba(20, 17, 14, 0.10);
  color-scheme: light;
}

/* — MOTYW CIEMNY (alternatywa) — */
:root[data-theme="dark"] {
  --bg: var(--ink-900);
  --bg-elev: var(--ink-800);
  --bg-elev-2: var(--ink-700);
  --text: var(--ink-050);
  --text-dim: var(--ink-300);
  --text-faint: var(--ink-400);
  --line: rgba(240, 234, 224, 0.12);
  --line-strong: rgba(240, 234, 224, 0.28);
  --glass: rgba(38, 33, 28, 0.5);
  --glass-line: rgba(240, 234, 224, 0.14);
  --marble-shadow: rgba(0, 0, 0, 0.5);
  color-scheme: dark;
}