/* ==========================================================================
   FIT BY SCIENCE - DESIGN TOKENS
   Locked foundation. Do not introduce ad-hoc values outside this system.
   ========================================================================== */

:root {

  /* ---- Color ---- */
  --obsidian: #0B0D0F;      /* primary dark background */
  --carbon: #15181B;        /* elevated dark surface */
  --bone: #F4F2ED;          /* warm light background / primary light text */
  --stone: #A7A8A5;         /* secondary text */
  --science-blue: #2684FF;  /* signature electric Science Blue */
  --white: #FFFFFF;

  /* semantic aliases */
  --bg-primary: var(--obsidian);
  --bg-elevated: var(--carbon);
  --text-on-dark: var(--bone);
  --text-on-dark-secondary: var(--stone);
  --text-on-light: var(--obsidian);

  /* ---- Typography ---- */
  --font-display: 'Archivo Narrow', sans-serif; /* swap point for future wordmark/type system */
  --font-body: 'Inter', sans-serif;

  /* fluid display scale */
  --text-display-xl: clamp(3.5rem, 8vw, 7.5rem);   /* hero ceiling - may test to 8.5rem contextually */
  --text-display-lg: clamp(2.75rem, 6vw, 5rem);    /* section headlines */
  --text-display-md: clamp(2rem, 4vw, 3rem);       /* sub-headlines */
  --text-display-sm: clamp(1.5rem, 2.5vw, 2rem);   /* small headlines */

  /* body scale */
  --text-body-lg: clamp(1.125rem, 1.5vw, 1.375rem);
  --text-body-md: 1.0625rem;
  --text-body-sm: 0.9375rem;
  --text-label: 0.75rem;

  --lh-display: 1.05;
  --lh-body: 1.65;

  /* ---- Spacing (8px base) ---- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-6: 3rem;
  --space-8: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --space-24: 12rem;

  /* section rhythm */
  --section-padding-y: var(--space-24);
  --section-padding-y-mobile: var(--space-12);

  /* ---- Containers ---- */
  --container-max: 1280px;
  --container-text: 680px;
  --container-wide: 1440px;
  --container-pad: var(--space-6);
  --container-pad-mobile: var(--space-3);

  /* ---- Radius ---- */
  --radius-sm: 2px;
  --radius-md: 4px;

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 200ms;
  --duration-base: 400ms;
  --duration-slow: 700ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}