@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300&display=swap");

:root {
  --bg: #ffffff;
  --text: #111111;
  --text-soft: #555555;
  --text-meta: #777777;
  --surface: rgba(255, 255, 255, 0.92);
  --surface-strong: rgba(255, 255, 255, 0.96);
  --shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.04);
  --container: min(1280px, calc(100vw - 80px));
  --container-wide: min(1480px, calc(100vw - 64px));
  --section-gap: 144px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --header-height: 88px;
  --header-height-scrolled: 68px;
  --radius-soft: 28px;

  --font-sans: "General Sans", "Satoshi", "Neue Montreal", "Avenir Next", "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  --font-light: "General Sans", "Satoshi", "Segoe UI Light", "Avenir Next", "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  --font-serif: "Editorial New", "Iowan Old Style", "Times New Roman", serif;

  --type-nav-weight: 300;
  --type-nav-letter-spacing: 0.14em;

  --fs-hero: clamp(22px, 3.1vw, 40px);
  --fs-display: clamp(18px, 1.8vw, 24px);
  --fs-h1: clamp(16px, 1.5vw, 20px);
  --fs-h2: clamp(15px, 1.3vw, 18px);
  --fs-h3: 14px;
  --fs-body: 16px;
  --fs-small: 14px;
  --lh-tight: 1.14;
  --lh-copy: 1.58;
}

/* Final client batch: shared page grey from Projects page */
:root {
  --page-grey: #bfc0c2;
  --page-start-space: 72px;
}