/* Crestway design tokens. Colours are sampled from the logo artwork. */
@font-face { font-family: "Gabarito"; src: url("/assets/fonts/gabarito-latin-wght-normal.woff2") format("woff2"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible"; src: url("/assets/fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible"; src: url("/assets/fonts/atkinson-hyperlegible-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible"; src: url("/assets/fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  /* Colour */
  --navy: #04195c;    /* deep shadow of the logo background. Text on light, dark sections. */
  --royal: #0a4fd0;   /* primary brand blue. Signs, rails, links. */
  --bright: #177efd;  /* mid swoop. Fills and large type only, 3.8:1 on white. */
  --sky: #7fdcfc;     /* top-right glow. Accents on navy and royal. */
  --ice: #dceeff;     /* tint of the C. Quiet fills and zones. */
  --frost: #f3f8ff;   /* page background. */
  --white: #ffffff;
  --steel: #4a5d8f;   /* secondary text on light. */
  --paper: #fdfdfb;   /* receipt paper only. */

  /* Type */
  --font-display: "Gabarito", "Trebuchet MS", system-ui, sans-serif;
  --font-body: "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif;
  --font-receipt: ui-monospace, Consolas, "Courier New", monospace;
  --text-sm: .9375rem;
  --text-base: 1.125rem;
  --text-lg: 1.375rem;
  --text-xl: clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem);
  --text-2xl: clamp(2.25rem, 1.6rem + 3vw, 4rem);
  --text-hero: clamp(3.5rem, 1.4rem + 8.6vw, 8.5rem);

  /* Space */
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6.5rem;
  --gutter: max(20px, env(safe-area-inset-left, 0px));
  --page: 76rem;

  /* Shape. Pill comes from the round ends of the C, sign from store signage, ticket from shelf labels. */
  --r-pill: 999px;
  --r-sign: 14px;
  --r-ticket: 5px;
}