/* ==========================================================================
   DELT4.ai - design tokens
   Single source of truth for colour, type and space. Mirrors DESIGN.md, which
   is the design system uploaded to Stitch and the basis of the approved designs.
   ========================================================================== */

:root {
  /* --- colour ------------------------------------------------------------ */
  --bg:            #08090C;   /* page ground, near-black        */
  --surface:       #0E1116;   /* cards, panels                  */
  --surface-2:     #141821;   /* raised panels, diagram wells   */
  --line:          rgba(255, 255, 255, 0.08);
  --line-strong:   rgba(255, 255, 255, 0.16);

  --ink:           #F2F4F7;   /* primary text, soft white       */
  --ink-2:         #A7B0BD;   /* secondary text, cool grey      */
  --ink-3:         #8A93A1;   /* tertiary: lifted so it passes 4.5:1 on --bg */

  --accent:        #4D7CFE;   /* the one controlled electric blue (accents, lines, glow) */
  --accent-fill:   #3469FE;   /* button fill: white text on this = 4.57:1, passes AA */
  --accent-fill-h: #4A7BFF;   /* hover */
  --accent-soft:   #9DB2FF;   /* accent text on dark (AA on --bg) */
  --accent-dim:    rgba(77, 124, 254, 0.14);
  --accent-line:   rgba(77, 124, 254, 0.35);

  --ok:            #4ADE80;   /* reserved for verification states only */

  /* --- type -------------------------------------------------------------- */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, monospace;

  --fs-hero:  clamp(2.75rem, 6.4vw, 5.5rem);   /* 44 → 88px */
  --fs-h2:    clamp(1.9rem, 3.6vw, 3.25rem);
  --fs-h3:    clamp(1.0625rem, 1.4vw, 1.3rem);
  --fs-body:  clamp(1rem, 1.05vw, 1.125rem);
  --fs-lead:  clamp(1.0625rem, 1.5vw, 1.3125rem);
  --fs-label: 0.75rem;    /* 12px floor - never smaller */
  --fs-mono:  0.8125rem;

  /* --- space ------------------------------------------------------------- */
  --sp-1: 0.25rem; --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4rem;
  --sp-9: 6rem;    --sp-10: 8rem;

  --wrap: 1320px;
  --gutter: clamp(1rem, 4vw, 2rem);
  --section-y: clamp(4.5rem, 9vw, 10rem);

  /* --- form -------------------------------------------------------------- */
  --radius: 8px;
  --radius-sm: 6px;
  --nav-h: 68px;
}

/* Respect the user's motion preference globally. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
