/* Develp design tokens: B4 Drawing, drafting film.
   Values copied from the Develp design system (claude.ai Design System "Develp", tokens.json, 17 Oct 2026). */
@font-face {
  font-family: "Anek Latin";
  src: url("/assets/fonts/anek-latin-latin-standard-normal.woff2") format("woff2");
  font-weight: 100 800;
  font-stretch: 75% 125%;
  font-display: swap;
}
/* the reading face for Insights articles only (the owner, 2026-10-26: "I like A - source serif - but this is good for the
   articles. let's not use it for the rest of documents"); fontsource-variable 5.3.1, optical size and weight axes, OFL */
@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/source-serif-4-latin-standard-normal.woff2") format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/source-serif-4-latin-standard-italic.woff2") format("woff2");
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Atkinson Hyperlegible Mono";
  src: url("/assets/fonts/atkinson-hyperlegible-mono-latin-wght-normal.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
}
:root {
  /* colour */
  --ground: #ebeded;
  --ground-2: #dfe3e4;
  --paper: #f7f8f8;
  --grid: #c7cdd1;
  --ink: #0e0e0e;
  --ink-2: #34312d;
  --graphite: #5e5952;
  --rule: #c9c5bd;
  --rule-2: #85807a;
  --hatch: #0e0e0e;
  --night: #0e0e0e;
  --white: #ffffff;
  --night-2: #a5a097;
  --night-rule: #4d4943;
  --night-grid: #262d32;
  --link: var(--ink);
  --focus: var(--ink);
  /* type */
  --font-sans: "Anek Latin", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Atkinson Hyperlegible Mono", ui-monospace, Menlo, monospace;
  --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif; /* article text only */
  /* spacing */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px;
  --space-8: 32px; --space-12: 48px; --space-18: 72px;
  --grid-pitch: 24px; --grid-pitch-slide: 30px; --grid-pitch-social: 27px; --grid-pitch-a4: 18px;
  /* radius */
  --radius-0: 0; --radius-full: 9999px;
  /* lines */
  --line-thin: 1px; --line-heavy: 2px; --line-medium: 1.5px;
  --line-slide-thin: 1.5px; --line-slide-heavy: 3px; --line-print: 0.75px;
  /* patterns */
  --hatch-25: repeating-linear-gradient(45deg, #0E0E0E 0 1.414px, transparent 1.414px 5.657px);
  --hatch-25-slide: repeating-linear-gradient(45deg, #0E0E0E 0 2.121px, transparent 2.121px 8.485px);
  --cross-hatch-50: repeating-linear-gradient(45deg, #0E0E0E 0 1.414px, transparent 1.414px 4.95px), repeating-linear-gradient(-45deg, #0E0E0E 0 1.414px, transparent 1.414px 4.95px);
  /* motion */
  --ease-in: cubic-bezier(.5, 0, .75, 0);
  --ease-out: cubic-bezier(.25, 1, .5, 1);
  --ease-fade: cubic-bezier(.65, 0, .35, 1);
}

/* type styles (tokens.json) */
.title-slide { font-family: var(--font-sans); font-size: 136px; line-height: 140px; font-weight: 330; letter-spacing: -0.035em; }
.slide-title { font-family: var(--font-sans); font-size: 84px; line-height: 92px; font-weight: 330; letter-spacing: -0.03em; }
.display { font-family: var(--font-sans); font-size: 76px; line-height: 82px; font-weight: 330; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-sans); font-size: 48px; line-height: 54px; font-weight: 330; letter-spacing: -0.015em; }
.h2 { font-family: var(--font-sans); font-size: 28px; line-height: 34px; font-weight: 520; }
.standfirst { font-family: var(--font-sans); font-size: 19px; line-height: 30px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 27px; font-weight: 400; }
.small { font-family: var(--font-sans); font-size: 15px; line-height: 23px; font-weight: 400; }
.button { font-family: var(--font-sans); font-size: 15px; line-height: 1.3; font-weight: 520; }
.figure-xl { font-family: var(--font-mono); font-size: 96px; line-height: 100px; font-weight: 400; letter-spacing: -0.03em; }
.figure { font-family: var(--font-mono); font-size: 64px; line-height: 68px; font-weight: 400; letter-spacing: -0.02em; }
.figure-m { font-family: var(--font-mono); font-size: 30px; line-height: 34px; font-weight: 400; letter-spacing: -0.02em; }
.figure-s { font-family: var(--font-mono); font-size: 24px; line-height: 32px; font-weight: 400; }
.data { font-family: var(--font-mono); font-size: 13px; line-height: 18px; font-weight: 400; }
.note { font-family: var(--font-mono); font-size: 12px; line-height: 18px; font-weight: 400; }
.label { font-family: var(--font-mono); font-size: 11px; line-height: 14px; font-weight: 400; letter-spacing: 0.08em; }
.print { font-family: var(--font-mono); font-size: 8px; line-height: 10px; font-weight: 400; letter-spacing: 0.06em; }