/* ---------------------------------------------------------------------------
   tokens.css — the contract every brand overrides.
   Nothing here is a design decision. These are neutral defaults so a new brand
   file can set six colours and a type pairing and get a coherent site.
   Each mockup's brand.css redefines these on :root and nothing else changes.
   --------------------------------------------------------------------------- */

:root {
  /* --- Colour roles ------------------------------------------------------ */
  --bg:          #ffffff;   /* page ground */
  --bg-alt:      #f5f5f4;   /* alternating section ground */
  --surface:     #ffffff;   /* cards, panels */
  --ink:         #1c1917;   /* primary text */
  --ink-soft:    #44403c;   /* secondary text */
  --ink-mute:    #78716c;   /* captions, meta */
  --line:        #e7e5e4;   /* hairlines, borders */
  --accent:      #1c1917;   /* brand colour */
  --accent-ink:  #ffffff;   /* text on accent */
  --accent-soft: #f5f5f4;   /* accent tint ground */
  --focus:       #2563eb;   /* focus ring — override only for contrast */

  /* --- Type -------------------------------------------------------------- */
  --font-display: ui-serif, Georgia, serif;
  --font-body:    system-ui, -apple-system, "Segoe UI", sans-serif;

  --display-weight: 700;
  --display-tracking: -0.02em;
  --display-leading: 1.05;

  /* Fluid scale, 320px → 1440px viewport. */
  --step--1: clamp(0.83rem, 0.80rem + 0.15vw, 0.92rem);
  --step-0:  clamp(1.00rem, 0.95rem + 0.24vw, 1.13rem);
  --step-1:  clamp(1.20rem, 1.11rem + 0.44vw, 1.44rem);
  --step-2:  clamp(1.44rem, 1.29rem + 0.75vw, 1.85rem);
  --step-3:  clamp(1.73rem, 1.49rem + 1.20vw, 2.37rem);
  --step-4:  clamp(2.07rem, 1.70rem + 1.85vw, 3.04rem);
  --step-5:  clamp(2.49rem, 1.93rem + 2.80vw, 3.89rem);
  --step-6:  clamp(2.99rem, 2.16rem + 4.13vw, 4.98rem);

  /* --- Space ------------------------------------------------------------- */
  --s-3xs: clamp(0.25rem, 0.24rem + 0.06vw, 0.31rem);
  --s-2xs: clamp(0.50rem, 0.48rem + 0.12vw, 0.56rem);
  --s-xs:  clamp(0.75rem, 0.71rem + 0.18vw, 0.88rem);
  --s-s:   clamp(1.00rem, 0.95rem + 0.24vw, 1.13rem);
  --s-m:   clamp(1.50rem, 1.43rem + 0.36vw, 1.69rem);
  --s-l:   clamp(2.00rem, 1.90rem + 0.48vw, 2.25rem);
  --s-xl:  clamp(3.00rem, 2.86rem + 0.71vw, 3.38rem);
  --s-2xl: clamp(4.00rem, 3.81rem + 0.95vw, 4.50rem);
  --s-3xl: clamp(6.00rem, 5.71rem + 1.43vw, 6.75rem);

  /* --- Shape ------------------------------------------------------------- */
  --radius-s:  4px;
  --radius:    10px;
  --radius-l:  20px;
  --radius-pill: 999px;

  --shadow-1: 0 1px 2px rgb(0 0 0 / 0.04), 0 2px 8px rgb(0 0 0 / 0.04);
  --shadow-2: 0 2px 4px rgb(0 0 0 / 0.04), 0 12px 32px rgb(0 0 0 / 0.08);

  /* --- Layout ------------------------------------------------------------ */
  --container:        1200px;
  --container-narrow: 760px;
  --gutter:           var(--s-m);
  --measure:          66ch;
  --section-y:        var(--s-3xl);

  /* --- Motion ------------------------------------------------------------ */
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --dur:  180ms;
}