/* ============================================================================
   Cedar & Blade - the site's own tokens. SITE LANE.
   Direction: warm editorial pushed dark. Brass on near-black, the palette classic
   barber signage has used for a century. See DIRECTION.md.
   ============================================================================ */

@font-face {
  font-family: "Bodoni Moda"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: local("Bodoni Moda"), url("fonts/BodoniModa-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: local("Geist"), url("fonts/Geist-latin.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: local("JetBrains Mono"), url("fonts/JetBrainsMono-latin.woff2") format("woff2");
}

:root {
  color-scheme: dark;

  /* Warm near-black, the colour of painted shopfront wood. Never #000: pure black
     has no depth and every surface laid on it reads as a sticker. Every neutral
     below carries the same warm hue, which is craft rule R5. */
  --ink-000: #14100C;
  --ink-050: #1C1712;
  --ink-100: #262019;
  --ink-200: #3A3128;
  --ink-300: #54483A;

  --fg-hi:  #F5EFE4;   /* bone, not white */
  --fg:     #D6CDBE;
  --fg-mid: #9A8F7D;
  --fg-low: #6E6455;

  /* Brass. ONE accent hue, two steps. Gold leaf on dark glass is the trade's own
     signage, so this is a citation rather than a preference. */
  --accent:     #C8973F;
  --accent-dim: #8A6526;
  --pos: #6E9B62;
  --neg: #B5564A;

  --font-display: "Bodoni Moda", "Didot", Georgia, serif;
  --font-ui:      "Geist", "Avenir Next", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, Menlo, monospace;

  --t-xs:   11px;
  --t-sm:   13px;
  --t-base: 17px;      /* one step up from the default: this page is read on a phone, outdoors */
  --t-md:   21px;
  --t-lg:   26px;
  --t-xl:   32px;
  --t-2xl:  40px;
  --t-3xl:  53px;
  --d-head: clamp(1.75rem, 1.10rem + 2.6vw, 3.25rem);
  --d-hero: clamp(2.5rem, 1.35rem + 4.2vw, 5.25rem);
  /* Capped at 5.25rem, down from 8.5rem, 2026-09-27. At 8.5rem the headline filled the
     whole viewport and pushed the call button below the fold. NN/g measured 80.3% of
     viewing time above the fold, so a hero that big costs the one action the page is for. */

  --track-display: -0.04em;   /* a didone at display size needs the letters closed up */
  --track-tight:   -0.015em;
  --track-normal:  0;
  --track-wide:    0.14em;    /* wide, for the small caps labels; barber signage sets them open */

  --lh-display: 0.92;
  --lh-tight:   1.12;
  --lh-snug:    1.30;
  --lh-body:    1.6;

  --measure:        62ch;
  --measure-narrow: 40ch;

  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 24px;  --s-6: 32px;  --s-7: 48px;  --s-8: 64px;  --s-9: 96px;

  --r-sm: 2px;  --r-md: 8px;  --r-lg: 18px; --r-full: 999px;

  /* Shadows carry the page hue, never rgba(0,0,0) (craft R6). */
  --lift-1: 0 1px 2px rgba(8, 5, 2, 0.5);
  --lift-2: 0 10px 34px rgba(8, 5, 2, 0.55);

  --ease:      cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --fast:  120ms;
  --slow:  240ms;
}
