/* FrontEdge v3 · "Build Log", own style: design tokens only.
   Warm stone paper, near-black ink, one heavy grotesk, maroon used sparingly for calls to action and emphasis. */

@font-face { font-family: "Cabinet Grotesk"; src: url("../fonts/cabinet-grotesk-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Cabinet Grotesk"; src: url("../fonts/cabinet-grotesk-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Cabinet Grotesk"; src: url("../fonts/cabinet-grotesk-800.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("../fonts/satoshi-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("../fonts/satoshi-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("../fonts/satoshi-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --color-bg: #EFEBE4;
  --color-surface: #E5E0D6;
  --color-card: #F7F4EF;
  --color-text: #131313;
  --color-muted: #5B5853;
  --color-line: #CFC8BC;
  --color-dark: #131313;
  --color-dark-2: #1C1C1C;
  --color-on-dark: #F3F1EC;
  --color-on-dark-muted: rgba(243, 241, 236, .68);
  --color-on-dark-line: rgba(243, 241, 236, .16);
  --color-accent: #8E1F2C;         /* maroon */
  --color-accent-hover: #6F1621;
  --color-accent-on-dark: #D48A93; /* maroon tint for text on ink */

  --font-display: "Cabinet Grotesk", "Avenir Next", sans-serif;
  --font-body: "Satoshi", "Avenir Next", sans-serif;

  --fs-display: clamp(3.5rem, 8.4vw, 8rem);
  --fs-h1: clamp(2.75rem, 5.6vw, 5.5rem);
  --fs-h2: clamp(2.125rem, 3.8vw, 3.75rem);
  --fs-h3: clamp(1.375rem, 1.9vw, 1.75rem);
  --fs-lead: clamp(1.375rem, 2.6vw, 2.5rem);
  --fs-body: clamp(1rem, .97rem + .15vw, 1.125rem);
  --fs-small: .875rem;
  --fs-label: .75rem;

  --lh-head: .98;
  --lh-body: 1.6;
  --ls-head: -.03em;
  --ls-label: .12em;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: clamp(80px, 9vw, 128px);
  --space-10: clamp(112px, 13vw, 192px);

  --gutter: clamp(16px, 3.4vw, 48px);
  --max: 1440px;
  --header: 76px;
  --radius: 4px;
  --shadow: none;

  --ease: cubic-bezier(.22, 1, .36, 1);
  --dur-fast: 220ms;
  --dur: 450ms;
  --dur-slow: 600ms;
}