/* Avanza Methods, design tokens.
   Colour values are fixed by the brand guidelines and verified for contrast.
   Every other value here is a project decision recorded in CLAUDE.md section 5.
   No component file may hard code a colour. */

:root {

  /* Brand core */
  --paper:          #F0EFEE;  /* Wispy Clouds */
  --paper-bright:   #FAFAFA;  /* Alabaster White */
  --ink:            #1D3F43;  /* Dark Sea */
  --ink-deep:       #2B3042;  /* Black Iris */
  --accent:         #E2A829;  /* Golden Rod */

  /* Derived, computed for contrast compliance */
  --text-secondary:      #587073;  /* 4.54:1 on paper */
  --text-on-ink:         #F0EFEE;  /* 9.82:1 on ink */
  --text-muted-on-ink:   #9DB2B5;  /* 5.10:1 on ink */
  --rule-light:          #D8D6D3;
  --rule-dark:           #2F565A;

  /* Typefaces. Both self hosted from assets/fonts. */
  --font-display: "Proza Libre", system-ui, sans-serif;
  --font-body:    "Noto Sans", system-ui, sans-serif;

  /* Fluid type scale. Body never drops below 17px, nothing below 14px. */
  --step--1: clamp(0.875rem, 0.85rem + 0.12vw, 0.9375rem);
  --step-0:  clamp(1.0625rem, 1.03rem + 0.18vw, 1.1875rem);
  --step-1:  clamp(1.25rem,  1.16rem + 0.45vw, 1.5rem);
  --step-2:  clamp(1.5rem,   1.30rem + 1.0vw,  2rem);
  --step-3:  clamp(1.875rem, 1.50rem + 1.9vw,  2.75rem);
  --step-4:  clamp(2.25rem,  1.60rem + 3.2vw,  4rem);
  --step-5:  clamp(2.75rem,  1.50rem + 6.2vw,  6.5rem);

  /* Line height, inside the brand ranges */
  --lh-body:    1.6;
  --lh-display: 1.14;
  --lh-tight:   1.25;  /* top of the permitted display range, for multi line */

  /* Measure. Body 62 to 68 characters, display 16 to 24. */
  --measure:         66ch;
  --measure-display: 20ch;

  /* Space, base unit 4px */
  --space-4:   4px;
  --space-8:   8px;
  --space-12:  12px;
  --space-16:  16px;
  --space-24:  24px;
  --space-32:  32px;
  --space-48:  48px;
  --space-64:  64px;
  --space-96:  96px;
  --space-128: 128px;
  --space-192: 192px;

  /* Section rhythm. Owned by the layout layer alone. */
  --section-gap: clamp(96px, 12vh, 176px);

  /* Grid */
  --shell:  1200px;
  --outer:  1440px;
  --gutter: clamp(20px, 5vw, 72px);

  /* Shape. Zero by default, 2px on inputs and buttons, never above 4px. */
  --radius-control: 2px;
  --border: 1px;

  /* Motion */
  --dur-fast: 180ms;
  --dur:      480ms;
  --dur-slow: 760ms;
  --ease:     cubic-bezier(0.22, 1, 0.36, 1);
}