:root {
  --color-dark: #3a4148;
  --color-text: #1a1a1a;
  --color-yellow: #f2c84b;
  --color-paper: #f5f4ef;
  --color-projects-band: #f4f5f3;
  --color-muted: #697279;
  --color-line: rgba(58, 65, 72, 0.16);
  --color-photo: #dfe3e0;
  --color-white: #fff;
  --color-hero-mid: #596168;
  --color-header: rgba(58, 65, 72, 0.28);
  --color-nav-panel: rgba(58, 65, 72, 0.95);
  --color-overlay: rgba(20, 24, 27, 0.96);
  --color-on-dark-soft: rgba(255, 255, 255, 0.7);
  --color-on-dark-faint: rgba(255, 255, 255, 0.56);
  --color-on-dark-line: rgba(255, 255, 255, 0.16);
  --color-on-dark-copy: rgba(255, 255, 255, 0.55);
  --color-on-dark-meta: rgba(255, 255, 255, 0.52);
  --color-eyebrow-on-paper: rgba(58, 65, 72, 0.55);
  --color-photo-label: rgba(58, 65, 72, 0.42);
  --color-partner: rgba(58, 65, 72, 0.45);
  --color-cta-copy: rgba(58, 65, 72, 0.7);
  --color-cta-eyebrow: rgba(58, 65, 72, 0.58);
  --color-cta-line: rgba(58, 65, 72, 0.35);
  --color-cta-input: rgba(58, 65, 72, 0.38);
  --color-hero-wash-start: rgba(0, 0, 0, 0.88);
  --color-hero-wash-end: rgba(0, 0, 0, 0.28);
  --color-table-line: #e0e0e0;
  --color-table-head: #f5f5f7;
  --color-table-stripe: #fafafa;

  --dark: var(--color-dark);
  --yellow: var(--color-yellow);
  --paper: var(--color-paper);
  --muted: var(--color-muted);
  --line: var(--color-line);

  --font-body: "Google Sans", Arial, sans-serif;
  --font-heading: Montserrat, Arial, sans-serif;

  --text-eyebrow: 11px;
  --text-nav: 12px;
  --text-nav-mobile: 10px;
  --text-logo: 18px;
  --text-button: 11px;
  --text-label: 12px;
  --text-body: 15px;
  --text-intro: 18px;
  --text-footer: 14px;
  --text-footer-bottom: 11px;
  /* Heading scale: desktop 45 / 35 / 25, slightly smaller on mobile. */
  --text-h1: clamp(36px, 5vw, 45px);
  --text-h2: clamp(28px, 4vw, 35px);
  --text-h3: clamp(22px, 3vw, 25px);
  --text-hero: var(--text-h1);
  --text-hero-mobile: var(--text-h1);
  --text-blog-hero: var(--text-h1);
  --text-article: var(--text-h1);
  --text-h2-card: var(--text-h2);
  --text-card: var(--text-h3);
  --text-solution: var(--text-h2);
  --text-stat: clamp(25px, 4vw, 48px);

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;
  --weight-black: 800;

  --lh-h1: 1.12;
  --lh-h2: 1.15;
  --lh-h3: 1.2;
  --lh-hero: var(--lh-h1);
  --lh-blog-hero: var(--lh-h1);
  --lh-article: var(--lh-h1);
  --lh-card-h2: var(--lh-h2);
  --lh-solution: var(--lh-h2);
  --lh-body: 1.7;
  --lh-intro: 1.8;
  --lh-article-copy: 1.6;
  --lh-check: 1.5;

  --track-heading: -0.045em;
  --track-stat: -0.05em;
  --track-nav: 0.1em;
  --track-logo: 0.08em;
  --track-eyebrow: 0.22em;
  --track-photo: 0.24em;
  --track-meta: 0.14em;
  --track-label: 0.15em;

  --shell: min(1180px, 100% - 40px);
  --space-shell-mobile: 20px;
  --header-h: 88px;
  --header-pad-y: 22px;
  --header-pad-y-mobile: 18px;
  --section-y: 76px;
  --section-y-mobile: 54px;
  --hero-pad-top: 75px;
  --hero-pad-bottom: 56px;
  --hero-full-min: 100svh;
  --hero-half-min: 50vh;
  --blog-hero-pad-top: 72px;
  --blog-hero-pad-bottom: 64px;
  --article-heading-top: 54px;
  --article-heading-bottom: 62px;
  --article-content-y: 70px;
  --project-info-y: 64px;
  --cta-y: 54px;
  --footer-pad-bottom: 28px;
  --footer-grid-y: 42px;
  --grid-gap: 24px;
  --stack-gap: 18px;
  --stack-gap-lg: 30px;
  --space-card-title-top: 0.75em;
  --space-eyebrow-bottom: 3em;
  --space-list-indent: 2rem;
  --space-list-item: 0.5rem;
  --space-table-cell-y: 0.75rem;
  --space-table-cell-x: 1rem;
  --btn-pad-y: 14px;
  --btn-pad-x: 18px;
  --btn-gap: 28px;
  --btn-min-h: 44px;
  --photo-min: 300px;
  --photo-wide: 460px;
  --photo-mobile: 270px;
  --photo-article: 380px;
  --stat-min: 130px;
  --stat-min-mobile: 112px;
}

@media (max-width: 900px) {
  :root { --header-h: 84px; }
}

@media (max-width: 700px) {
  :root { --header-h: 76px; }
}