:root {

  --black: #000000;
  --near-black: #151515;
  --white: #ffffff;
  --beige: #f4f3ed;
  --stone: #e4e1d8;
  --stone-dark: #b9b5a9;
  --grey: #6b6964;
  --ink: #4a4945;
  --timber: #8a5a2b;
  --google-gold: #fbbc04;


  --color-paper: var(--white);
  --color-surface: var(--white);
  --color-surface-tint: var(--beige);
  --color-section-tint: var(--white);
  --color-calc-bg: var(--beige);
  --color-ink: var(--ink);
  --color-ink-soft: var(--grey);
  --color-heading: var(--black);
  --color-eyebrow: var(--grey);
  --color-link: var(--black);
  --color-link-hover: var(--grey);
  --color-line: var(--stone);
  --color-line-strong: var(--stone-dark);
  --color-cta: var(--black);
  --color-cta-hover: #2b2b2b;
  --color-on-cta: var(--white);
  --color-accent: var(--near-black);
  --color-accent-strong: var(--near-black);
  --color-on-accent: var(--white);
  --color-dark: var(--black);
  --color-dark-line: #2e2e2e;
  --color-on-dark: var(--white);
  --color-on-dark-soft: #c9c7c0;
  --color-cta-band: var(--white);
  --color-footer-bg: var(--white);
  --color-offer-bg: var(--white);
  --color-header-bg: var(--white);
  --color-star: var(--google-gold);
  --color-focus: var(--near-black);
  --color-success: #2f7d4f;
  --color-danger: #b42318;
  --hero-overlay: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.25) 100%);


  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body: "Helvetica Neue", Helvetica, Arial, sans-serif;

  --weight-display: 300;
  --weight-subhead: 300;
  --weight-label: 500;
  --leading-tight: 1.15;
  --leading-body: 1.65;
  --tracking-display: 0.01em;
  --tracking-eyebrow: 0.14em;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1.0625rem;
  --text-lg: 1.1875rem;
  --text-xl: 1.375rem;
  --text-2xl: clamp(1.5rem, 1.2rem + 1vw, 1.875rem);
  --text-3xl: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem);
  --text-4xl: clamp(2rem, 1.4rem + 2.2vw, 3.125rem);
  --text-5xl: clamp(2.25rem, 1.4rem + 3vw, 3.75rem);
  --text-h1: var(--text-4xl);
  --text-h2: var(--text-3xl);
  --text-h3: var(--text-xl);


  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3.5rem;
  --space-9: 5rem;
  --section-y: clamp(5rem, 3.5rem + 5vw, 8.5rem);
  --photo-band-h: clamp(320px, 55vw, 680px);
  --hero-y: clamp(4.5rem, 3rem + 7vw, 9rem);
  --gutter: 16px;
  --container: 1200px;
  --container-narrow: 820px;


  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 4px;
  --radius-xl: 6px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --shadow-md: 0 8px 24px rgba(0,0,0,.08);


  --control-height: 50px;
  --btn-radius: 0;
  --btn-pad-x: 1.5rem;
  --btn-font: var(--font-display);
  --btn-weight: 400;
  --btn-transform: uppercase;
  --btn-tracking: 0.08em;
  --header-height: 68px;
  --logo-height: 34px;
}

@media (min-width: 720px) {
  :root { --gutter: 24px; }
}