/* ==========================================================================
   SCALAR — DESIGN TOKENS (v2: Editorial / White / Formal)
   Palette: white & warm off-white, near-black ink, Scalar blue used sparingly.
   Type: Fraunces (editorial display serif) / Inter (body, UI) / Inter tracked-caps (labels)
   ========================================================================== */

:root {
  /* ---- Color: core (white-first) ---- */
  --c-paper:        #ffffff;  /* primary background — pure white */
  --c-paper-alt:     #f6f5f2; /* warm off-white for alternating sections */
  --c-paper-panel:   #ffffff; /* card background on white sections */
  --c-paper-panel-alt: #fbfaf8;
  --c-paper-line:    rgba(11, 18, 36, 0.12); /* hairline dividers on light */

  --c-ink:           #0d1220; /* primary text — soft near-black */
  --c-ink-soft:      #1a2136;
  --c-slate:         #565f78; /* secondary/muted text on light */
  --c-slate-light:   #8891a8;

  /* ---- Color: minimal accent (exact Scalar logo blue) ---- */
  --c-blue:          #194965; /* extracted directly from the client's logo file */
  --c-blue-deep:     #113346;
  --c-blue-tint:     #eef2f4; /* faint wash for small badges/icons bg */

  /* ---- Color: dark punctuation sections (footer / one CTA band only) ---- */
  --c-void:          #0b0e16;
  --c-void-soft:     #12141f;
  --c-void-line:     rgba(255,255,255,0.12);
  --c-void-mist:     #9aa1b4;

  /* ---- Gradients (used minimally, no neon glow) ---- */
  --grad-editorial:  linear-gradient(180deg, var(--c-paper) 0%, var(--c-paper-alt) 100%);

  /* ---- Type families ---- */
  --f-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --f-body:    'Inter', system-ui, sans-serif;
  --f-label:   'Inter', system-ui, sans-serif; /* tracked uppercase, not mono anymore */

  /* ---- Type scale (fluid) ---- */
  --fs-hero:   clamp(2.75rem, 5vw, 4.6rem);
  --fs-h1:     clamp(2.3rem, 4.6vw, 4.2rem);
  --fs-h2:     clamp(1.9rem, 3.4vw, 3.1rem);
  --fs-h3:     clamp(1.3rem, 1.7vw, 1.6rem);
  --fs-lead:   clamp(1.05rem, 1.3vw, 1.3rem);
  --fs-body:   1rem;
  --fs-small:  0.875rem;
  --fs-micro:  0.75rem;

  /* ---- Spacing ---- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --space-3xl: 8.5rem;

  --container: 1280px;
  --container-wide: 1520px;
  --container-narrow: 900px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);

  /* ---- Radius (editorial = squarer, less "app-like") ---- */
  --r-sm: 4px;
  --r-md: 10px;
  --r-lg: 18px;
  --r-pill: 999px;

  /* ---- Motion ---- */
  --ease-signal: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 0.25s;
  --dur-med: 0.55s;
  --dur-slow: 0.9s;

  /* ---- Shadow (soft, paper-like — no neon glow) ---- */
  --shadow-card: 0 24px 48px -28px rgba(13,18,32,0.16);
  --shadow-card-hover: 0 32px 60px -24px rgba(13,18,32,0.22);
  --shadow-btn: 0 14px 30px -12px rgba(31,79,214,0.35);

  --cursor-size: 26px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0.001s;
    --dur-med: 0.001s;
    --dur-slow: 0.001s;
  }
}