
:root {

  --de-blue: #1920BB;
  --de-blue-deep: #12178F;
  --tint: #E9EAFB;

  --ink: #16183A;
  --ink-muted: #4B4E6D;

  --paper: #FFFFFF;
  --paper-2: #F4F4F8;

  --rule: #D9DAE6;
  --control-border: #767A99;

  --on-blue: #FFFFFF;
  --on-blue-muted: #CDD0F7;
  --on-blue-rule: rgba(255, 255, 255, 0.28);

  --on-ink: #FFFFFF;
  --on-ink-muted: #CDD0F7;

  --error: #B42318;
  --error-ground: #FDF1F0;
  --success: #1D6B3F;

  --focus: #1920BB;
  --focus-on-dark: #FFFFFF;

  --plate-ecogen: #121625;
  --plate-caseclicks: #FFFFFF;
  --plate-roofrev: #17222C;


  --font-sans: "Libre Franklin", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Fira Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --step--1: 0.9375rem;
  --step-0: clamp(1.0625rem, 1.035rem + 0.12vw, 1.125rem);
  --step-1: clamp(1.1875rem, 1.1rem + 0.35vw, 1.4375rem);
  --step-2: clamp(1.375rem, 1.25rem + 0.5vw, 1.75rem);
  --step-3: clamp(1.75rem, 1.5rem + 1.1vw, 2.5rem);
  --step-4: clamp(2.125rem, 1.7rem + 1.9vw, 3.5rem);
  --step-5: clamp(2.5rem, 1.8rem + 3.2vw, 4.75rem);

  --leading-tight: 1.04;
  --leading-head: 1.12;
  --leading-sub: 1.28;
  --leading-lead: 1.45;
  --leading-body: 1.58;

  --tracking-display: -0.028em;
  --tracking-head: -0.018em;
  --tracking-sub: -0.008em;

  --weight-body: 400;
  --weight-strong: 600;
  --weight-sub: 650;
  --weight-head: 720;
  --weight-display: 780;

  --measure: 64ch;
  --measure-narrow: 46ch;

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

  --section-y: clamp(4rem, 2.8rem + 5.3vw, 8rem);
  --stack-gap: clamp(1.5rem, 1.2rem + 1.3vw, 2.5rem);

  --container: 75rem;
  --page-pad: clamp(1rem, 0.3rem + 3vw, 3rem);
  --gutter: clamp(1rem, 0.6rem + 1.8vw, 2rem);
  --header-h: 4.5rem;

  --radius-control: 6px;
  --radius-plate: 12px;
  --border-width: 1px;
  --border-control: 1.5px;

  --duration-quick: 120ms;
  --duration-state: 180ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  --target-min: 48px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-quick: 0ms;
    --duration-state: 0ms;
  }
}
