/* Design tokens — colors, fonts, spacing, breakpoints.
   Source of truth: design-spec.md. Do not hardcode these values elsewhere. */

/* Original design font, self-hosted (no external requests), converted to
   woff2 from assets/Document fonts/HelveticaNeue.ttc.
   The design sets both body and headings in normal-width Helvetica Neue
   (Regular 400 / Bold 700). The shipped "LT Pro Extended" OTFs are a much
   wider cut that does not match the reference proportions, so they are not
   used. */
@font-face {
  font-family: "Helvetica Neue";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../media/fonts/hn-400.woff2") format("woff2");
}
@font-face {
  font-family: "Helvetica Neue";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../media/fonts/hn-700.woff2") format("woff2");
}

:root {
  /* Core (named in the XD export) */
  --color-bg-deep:   #00212E; /* primary dark teal background */
  --color-bg-mid:    #003851; /* mid teal-blue */
  --text-on-dark:    #FFFFFF; /* white body/details text */
  --text-on-dark-60: rgba(255,255,255,0.60); /* secondary text (#FFFFFF99) */
  --accent-green:    #4ACDB5; /* green-teal — big + small headlines */
  --accent-mint:     #7EF1DE; /* mint — sub-headlines */

  /* Darks / backgrounds */
  --color-navy-near-black: #040D1D;
  --color-ink:             #051117;
  --color-deep-29:         #001C29;
  --color-slate:           #1B2236;
  --color-teal-muted-a:    #206775;
  --color-teal-muted-b:    #256E7A;

  /* Brights / accents */
  --accent-cyan:        #0CEFD4;
  --accent-cyan-blue-a: #59D6F1;
  --accent-cyan-blue-b: #66DAF3;
  --accent-pale-cyan:   #C8F4FE;
  --accent-pale-blue:   #90D3DF;

  /* Neutrals */
  --color-white:     #FFFFFF;
  --color-off-white: #F7F7F7;
  --color-gray:      #707070;

  /* Overlays / scrims (8-digit hex = color + alpha, NOT new solids) */
  --overlay-scrim-light: rgba(0,33,46,0.33);  /* #00212E55 */
  --overlay-scrim-mid:   rgba(0,33,46,0.57);  /* #00212E91 */
  --overlay-ink-50:      rgba(5,17,23,0.50);  /* #05111780 */
  --surface-glass:       rgba(255,255,255,0.10); /* #FFFFFF1A */

  /* Fonts — the original design font (Helvetica Neue), self-hosted; headings
     are the same family at heavier weights. System fonts are fallbacks. */
  --font-body: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* Motion — shared timing + easing so every page animates as one system.
     Only transform/opacity are ever animated (GPU-friendly, no layout thrash). */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1); /* entrances */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* hover / UI state */
  --ease-spring: cubic-bezier(0.22, 1.2, 0.36, 1); /* gentle overshoot for pops */
  --dur-fast: 160ms; /* hovers, small UI changes */
  --dur-mid:  240ms; /* card lifts */
  --dur-slow: 620ms; /* scroll-reveal + load entrances */
  --dur-xslow: 900ms; /* draw-ins, big entrances */

  /* Spacing scale (build decision — not in spec; consistent 8px rhythm) */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;

  /* Breakpoints (referenced in media queries as literal px values —
     custom properties aren't usable inside @media, kept here for documentation) */
  /* mobile: < 600px, tablet: 600–959px, desktop: >= 960px, wide: >= 1280px */
}