/* Work Sans, self-hosted: one variable file (latin, wght 400 to 900) covers the weights in use
   (400, 500, 800, 900). Preloaded from index.html. */
@font-face {
  font-family: "Work Sans";
  src: url("../assets/fonts/work-sans-latin-var.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

/* Design tokens. Colors come from the dlivrd Difference brand book (../../DESIGN.md);
   the font is Work Sans, the same as dlivrddifference.org (Jorge's decision). */
:root {
  /* Navy scale */
  --navy: #20205C;
  --navy-800: #1B1B4B;
  --navy-900: #10102D;
  --navy-600: #303088;
  --navy-500: #4A4ABF;

  /* Green. Lime on dark; on light backgrounds #19D908 is for the logo only,
     text uses #108A05 (4.5:1 on white). */
  --lime: #49F839;
  --mint: #A4FA9D;
  --green-on-light: #108A05;

  --gray-200: #E4E6EB;
  --paper: #F4F7F6;          /* soft off-white from dlivrddifference.org, for light blocks next to white */
  --ink-soft: rgb(32 32 92 / .78);
  --white: #FFFFFF;

  /* Text roles */
  --ink: var(--navy);
  --on-dark: var(--white);
  --on-dark-soft: rgb(255 255 255 / .86);

  /* Type */
  --font: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-display: clamp(2.75rem, 0.6rem + 6.4vw, 6rem);   /* 44px at 390, 96px from 1400 */
  --fs-h2: clamp(2.5rem, 0.8rem + 5.2vw, 4.75rem);
  --fs-lede: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --fs-body: 1.0625rem;
  --lh-body: 1.6;
  --track-display: -0.022em;

  /* Shape and space */
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --max: 1240px;
  --section-y: clamp(4.5rem, 9vw, 8.5rem);

  /* Motion */
  --ease-out: cubic-bezier(.22, 1, .36, 1);

  --shadow-card: 0 30px 60px -24px rgb(16 16 45 / .55), 0 8px 20px -8px rgb(16 16 45 / .35);
}
