/* Design tokens — Vandalai
 * Extracted from Figma "Vandalai design 03" (vMxk0QtmqySXawYXoa1qj0):
 * style-guide frames 2027:616 / 2027:617 and node data of 1:18 (desktop 1920)
 * and 4011:765 (mobile 504). Values are design-exact; do not hand-tune. */
:root {
  /* Orange ramp */
  --orange-50:  #FEF4E8;
  --orange-200: #F7AE5F;
  --orange-300: #F3901E;
  --orange-400: #F97F11;
  --orange-500: #FD7005;
  --orange-600: #C65103;
  --orange-700: #963602;
  --orange-900: #4C0C00;

  /* Neutrals */
  --neutral-50:  #F1F6FB;
  --neutral-300: #A9B0BA;
  --neutral-400: #9097A1;
  --neutral-500: #747B87;
  --neutral-600: #5C626E;
  --neutral-700: #434955;
  --neutral-800: #2A303B;
  --neutral-900: #111722;
  --neutral-950: #000001;
  --ink:         #060609;
  --card-people: #4C4F54;
  --overlay-people: #C9D1DB;
  --menu-glass:  #CBD3DE;

  /* Gradients (style guide + page usage) */
  --grad-process: linear-gradient(180deg, #030303 55%, #38424A 100%);
  --grad-people-overlay: linear-gradient(180deg, rgb(255 255 255 / 0) 33%, #C9D1DB 79%);

  /* Reveal segments: static (design) state opacities over white text */
  --reveal-hero:    rgb(255 255 255 / 0.28);
  --reveal-water:   rgb(255 255 255 / 0.60);
  --reveal-process: rgb(255 255 255 / 0.63);

  /* Typography */
  --font-sans: "Google Sans Flex", "Google Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Desktop type scale (1920 canvas) */
  --text-display: 64px;  --lh-display: 80px;
  --text-body-lg: 36px;  --lh-body-lg: 45px;
  --text-nav:     40px;  --lh-nav:     50px;
  --text-base:    24px;  --lh-base:    30px;
  --text-menu:    20px;  --lh-menu:    25px;
  --text-tiny:    16px;  --lh-tiny:    20px;

  /* Shape */
  --radius-card: 30px;

  /* Layout (1920 canvas) */
  --page-margin: 50px;
}