/* VizArchs — design tokens
   Spec section 5.1 — the only place colors / type / spacing scales are defined. */

:root {
  /* Color — brand */
  --green-primary: #8abd45;
  --green-hover:   #9ccb5b;
  --green-deep:    #6e9a32;

  /* Color — neutrals */
  --ink:           #3a3a3a;
  --bg-base:       #0f0f0f;
  --bg-elev-1:     #1a1a1a;
  --bg-elev-2:     #242424;
  --paper:         #f6f5f1;
  --paper-elev:    #efece4;

  /* Color — text */
  --text-on-dark:        #ededeb;
  --text-on-light:       #1a1a1a;
  --text-muted-dark:     #8a8a86;
  --text-muted-light:    #6a6a66;
  --text-on-green:       #0f0f0f;

  /* Color — borders / dividers */
  --line-on-dark:  rgba(255, 255, 255, 0.08);
  --line-on-light: rgba(0, 0, 0, 0.08);

  /* Type families */
  --font-display: "Montserrat", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, sans-serif;

  /* Type scale (modular 1.25, fluid via clamp) */
  --fs-hero:    clamp(2.75rem, 6vw + 1rem, 6rem);
  --fs-h1:      clamp(2.25rem, 4vw + 1rem, 4.5rem);
  --fs-h2:      clamp(1.75rem, 2.5vw + 1rem, 3rem);
  --fs-h3:      clamp(1.25rem, 1vw + 1rem, 1.75rem);
  --fs-body-lg: 1.125rem;
  --fs-body:    1.0625rem;
  --fs-small:   0.875rem;
  --fs-xs:      0.75rem;

  /* Tracking */
  --tracking-tight:   -0.02em;
  --tracking-snug:    -0.015em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-eyebrow: 0.16em;

  /* Line heights */
  --lh-display: 1.05;
  --lh-heading: 1.15;
  --lh-body:    1.6;
  --lh-prose:   1.75;

  /* Spacing scale */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.5rem;
  --sp-6:  2rem;
  --sp-8:  3rem;
  --sp-10: 4rem;
  --sp-12: 6rem;
  --sp-16: 8rem;
  --sp-20: 12rem;

  /* Section vertical rhythm */
  --section-y: clamp(4.5rem, 8vw, 7.5rem);

  /* Layout */
  --max-w:     1440px;
  --gutter:    clamp(1.25rem, 4vw, 3rem);
  --content-w: min(72ch, 100%);

  /* Header heights */
  --header-h:        96px;
  --header-h-mobile: 64px;

  /* Radii — minimal use */
  --r-sm:   2px;
  --r-md:   4px;
  --r-full: 999px;

  /* Motion */
  --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out:    cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:       180ms;
  --dur-base:       320ms;
  --dur-slow:       600ms;
  --dur-reveal:     900ms;

  /* Z-index */
  --z-header:    50;
  --z-preloader: 100;
  --z-lightbox:  90;
  --z-drawer:    80;

  /* Background texture — inlined so no extra request.
     Used to give solid surfaces depth without competing with content. */
  --texture-noise: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.06 0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>");
  --texture-grid:
    linear-gradient(to right, rgba(0, 0, 0, 0.025) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0, 0, 0, 0.025) 1px, transparent 1px);
}