/* Elk Run Homes — design tokens
   Palette sampled from the client brand site (elkrunhomes.com).
   Display type: Fraunces. UI + body type: Urbanist. */

:root {
  /* ---------- Surfaces and ink ---------- */
  --c-ink: #1E241F;
  --c-forest: #2F3E34;
  --c-forest-deep: #232E27;
  --c-forest-night: #18211B;
  --c-olive: #3E4236;
  --c-moss: #5F6360;
  --c-bark: #6B4F3A;
  --c-bone: #E9E4DA;
  --c-cream: #FCF8ED;
  --c-white: #FFFFFF;

  /* ---------- Accent ---------- */
  --c-brass: #C4A468;
  --c-brass-deep: #A88748;
  --c-brass-glow: rgba(196, 164, 104, .16);

  /* ---------- Semantic ---------- */
  --bg-page: var(--c-cream);
  --bg-raised: var(--c-white);
  --bg-muted: var(--c-bone);
  --bg-dark: var(--c-forest);
  --text-strong: var(--c-ink);
  --text-body: #4A4F48;
  --text-muted: var(--c-moss);
  --text-on-dark: #EDE9DF;
  --text-on-dark-muted: rgba(237, 233, 223, .70);
  --line: rgba(30, 36, 31, .13);
  --line-strong: rgba(30, 36, 31, .22);
  --line-on-dark: rgba(233, 228, 218, .16);
  --line-on-dark-strong: rgba(233, 228, 218, .3);

  /* ---------- Type families ---------- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-text: "Urbanist", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* ---------- Type scale ---------- */
  --fs-display: clamp(3rem, 1.15rem + 6.4vw, 6.25rem);
  --fs-h1: clamp(2.6rem, 1.4rem + 4.6vw, 4.85rem);
  --fs-h2: clamp(2.05rem, 1.35rem + 2.9vw, 3.5rem);
  --fs-h3: clamp(1.32rem, 1.1rem + .9vw, 1.85rem);
  --fs-h4: clamp(1.08rem, 1rem + .4vw, 1.3rem);
  --fs-lede: clamp(1.08rem, 1rem + .48vw, 1.3rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-micro: 0.8125rem;
  --fs-eyebrow: 0.75rem;

  --lh-tight: 1.04;
  --lh-heading: 1.12;
  --lh-body: 1.72;

  --ls-caps: 0.18em;

  /* ---------- Space ---------- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2.25rem;
  --space-xl: 3.5rem;
  --space-2xl: clamp(3.5rem, 6vw, 6rem);
  --space-section: clamp(5rem, 8.5vw, 9.5rem);

  --gutter: clamp(1.25rem, 4vw, 3rem);
  --w-page: 1280px;
  --w-wide: 1440px;
  --w-narrow: 62ch;

  --header-h: 88px;

  /* ---------- Form ---------- */
  --radius-s: 2px;
  --radius-m: 4px;
  --radius-l: 10px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(30, 36, 31, .04), 0 12px 34px -18px rgba(30, 36, 31, .28);
  --shadow-lift: 0 2px 6px rgba(30, 36, 31, .06), 0 28px 60px -26px rgba(30, 36, 31, .38);
  --shadow-menu: 0 30px 70px -32px rgba(12, 18, 13, .7), 0 2px 10px rgba(12, 18, 13, .18);

  /* ---------- Layers ---------- */
  --z-header: 100;
  --z-menu: 95;
  --z-flyout: 120;
  --z-skip: 200;

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(.2, .7, .25, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .5, 1);
  --t-micro: 200ms;
  --t-base: 420ms;
  --t-reveal: 800ms;
  --t-slow: 1200ms;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-micro: 1ms;
    --t-base: 1ms;
    --t-reveal: 1ms;
    --t-slow: 1ms;
  }
}