/* ===== variables.css ===== */
/* ============================================
   Charter Oak Chimney — Design Tokens
   "FROM HEARTH TO SKY" (Concept A, owner-selected)
   A cinematic vertical journey: the site lives in
   warm near-black coal, climbs the flue, and breaks
   into Connecticut sky. One ember action color.
   Display: Anton. Body: Schibsted Grotesk.
   Labels: Spline Sans Mono.
   ============================================ */

:root {
  /* ── Dark world (default environment) ── */
  --coal: #14110d;         /* scene base: warm near-black */
  --coal-2: #0e0c09;       /* deeper: inside the flue */
  --slate-scene: #1c2126;  /* evidence room */
  --ash: #f2eee6;          /* text on dark */
  --ash-dim: rgba(242, 238, 230, 0.72);
  --ash-faint: rgba(242, 238, 230, 0.55);

  /* ── Light world (above the roofline) ── */
  --sky: #edefe9;
  --sky-2: #e3e6dd;
  --white: #ffffff;
  --ink: #1b1814;          /* text on light */
  --ink-dim: rgba(27, 24, 20, 0.7);

  /* ── Rules / drafting marks ── */
  --line: rgba(242, 238, 230, 0.16);
  --line-strong: rgba(242, 238, 230, 0.34);
  --ink-line: rgba(27, 24, 20, 0.18);
  --ink-line-strong: rgba(27, 24, 20, 0.34);

  /* ── Action: ember (CTA — AA on white text) ── */
  --ember: #c24312;        /* buttons/links-as-action; white text 4.9:1 */
  --ember-deep: #a33409;   /* hover/press */
  --ember-bright: #e4571b; /* glow/accents on dark only, never text-on */
  --ember-rgb: 194, 67, 18;

  /* ── Amber: drafting highlight on dark ── */
  --amber: #e8a857;

  /* ── Semantic (forms/status, light surfaces) ── */
  --ok: #2f6b4f;
  --ok-tint: #e8f1ec;
  --warn: #8f6a1c;
  --warn-tint: #f6efdd;
  --err: #a63a2a;
  --err-tint: #f7e8e5;

  /* ── Typography ── */
  --font-display: 'Anton', 'Arial Narrow', Impact, sans-serif;
  --font-body: 'Schibsted Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Spline Sans Mono', ui-monospace, 'Cascadia Mono', monospace;

  --fs-hero: clamp(3rem, 8.5vw, 8.5rem);
  --fs-h2: clamp(2.2rem, 5.5vw, 4.6rem);
  --fs-h3: clamp(1.5rem, 2.6vw, 2.2rem);
  --fs-lead: 1.1875rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-label: 0.8125rem;

  --lh-display: 0.95;
  --lh-heading: 1.0;
  --lh-body: 1.6;

  --track-display: 0.015em;
  --track-label: 0.14em;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ── Spacing (8px grid) ── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* ── Layout ── */
  --container: 1280px;
  --container-sm: 640px;
  --container-md: 768px;
  --container-lg: 1024px;
  --measure: 68ch;
  --header-height: 76px;
  --gutter: clamp(18px, 4vw, 48px);

  /* ── Shape: cinematic poster language — square ── */
  --radius-xs: 0px;
  --radius-img: 0px;

  /* ── Elevation ── */
  --shadow-lift: 0 18px 50px rgba(0, 0, 0, 0.45);
  --shadow-lift-light: 0 12px 32px rgba(27, 24, 20, 0.14);

  /* ── Signature: flue path ── */
  --flue-w: 2px;
  --flue-color: var(--line-strong);
  --flue-tick: var(--ember-bright);

  /* ── Motion ── */
  --ease-settle: cubic-bezier(0.22, 1, 0.36, 1);
  --t-fast: 140ms;
  --t-base: 260ms;
  --t-reveal: 620ms;

  /* ── Z-Index ── */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 500;
  --z-header: 900;
  --z-overlay: 1000;
  --z-modal: 1100;
  --z-toast: 1200;

  /* ============================================
     COMPATIBILITY ALIASES — token names used by
     scheduling.css, promo.css, service/home css and
     legacy inspection.html resolve into the A-world.
     ============================================ */
  --paper: var(--sky);
  --paper-2: var(--sky-2);
  --paper-3: #d8dbd1;
  --soot: var(--ink);
  --soot-80: #37322b;
  --soot-60: #5b554c;
  --soot-40: #8b8478;
  --rule: var(--ink-line);
  --rule-strong: var(--ink-line-strong);
  --rule-on-dark: var(--line);
  --kiln: var(--ember);
  --kiln-deep: var(--ember-deep);
  --kiln-tint: #f6e3d8;
  --kiln-rgb: var(--ember-rgb);
  --spruce: var(--slate-scene);
  --spruce-deep: var(--coal-2);
  --slate: #46505a;
  --color-primary: var(--ink);
  --color-primary-light: #37322b;
  --color-primary-dark: var(--coal-2);
  --color-primary-rgb: 27, 24, 20;
  --color-forest: var(--slate-scene);
  --color-charcoal: var(--coal);
  --color-charcoal-light: var(--slate-scene);
  --color-gray-700: #37322b;
  --color-gray-600: #5b554c;
  --color-gray-500: #5b554c;
  --color-gray-400: #8b8478;
  --color-gray-300: #b5aea1;
  --color-gray-200: #d8dbd1;
  --color-gray-100: var(--sky-2);
  --color-ivory: var(--sky);
  --color-paper: var(--sky-2);
  --color-beige: var(--sky-2);
  --color-beige-dark: #d8dbd1;
  --color-cream: var(--sky-2);
  --color-white: var(--white);
  --color-gold: var(--ember);
  --color-gold-light: var(--ember-bright);
  --color-gold-dark: var(--ember-deep);
  --color-gold-rgb: var(--ember-rgb);
  --color-brick: var(--ember-deep);
  --color-brick-light: var(--ember);
  --color-brick-dark: #7c2a08;
  --color-brick-rgb: 163, 52, 9;
  --color-success: var(--ok);
  --color-success-light: var(--ok-tint);
  --color-warning: var(--warn);
  --color-warning-light: var(--warn-tint);
  --color-danger: var(--err);
  --color-danger-light: var(--err-tint);
  --color-info: #46505a;
  --font-serif: 'Newsreader', Georgia, serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-3xl: 2.25rem;
  --text-4xl: 3rem;
  --text-5xl: 3.75rem;
  --text-6xl: 4.5rem;
  --leading-tight: 0.98;
  --leading-snug: 1.15;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;
  --tracking-tight: 0.01em;
  --tracking-tighter: 0.015em;
  --tracking-normal: 0;
  --tracking-wide: 0.06em;
  --tracking-wider: 0.14em;
  --container-xl: 1280px;
  --container-2xl: 1280px;
  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;
  --radius-xl: 0px;
  --radius-2xl: 0px;
  --radius-full: 9999px;
  --hairline: var(--ink-line);
  --hairline-strong: var(--ink-line-strong);
  --border-light: 1px solid var(--ink-line);
  --border-medium: 1px solid var(--ink-line-strong);
  --border-warm: 1px solid var(--sky-2);
  --shadow-xs: none;
  --shadow-sm: none;
  --shadow-md: var(--shadow-lift-light);
  --shadow-lg: var(--shadow-lift-light);
  --shadow-xl: var(--shadow-lift);
  --shadow-warm: none;
  --shadow-card: none;
  --shadow-card-hover: var(--shadow-lift-light);
  --ease-out-expo: var(--ease-settle);
  --ease-out-quint: var(--ease-settle);
  --ease-out-back: var(--ease-settle);
  --ease-in-out-soft: var(--ease-settle);
  --transition-fast: var(--t-fast) var(--ease-settle);
  --transition-base: var(--t-base) var(--ease-settle);
  --transition-slow: var(--t-reveal) var(--ease-settle);
  --transition-spring: var(--t-base) var(--ease-settle);
}

/* ===== fonts.css ===== */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/newsreader-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/newsreader-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/schibsted-grotesk-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Spline Sans Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('../fonts/spline-sans-mono-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Anton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/anton-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== base.css ===== */
/* ============================================
   Charter Oak Chimney — Base Styles
   "FROM HEARTH TO SKY": reset, typography,
   drafting labels, world switching.
   Light (sky) is the default body — reading and
   conversion surfaces. Marketing scenes opt into
   the dark world with body.scene-dark.
   ============================================ */

/* ── Reset ── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--weight-regular);
  line-height: var(--lh-body);
  color: var(--ink);
  background-color: var(--sky);
  overflow-x: hidden;
}

/* The dark world — hearth scenes */
body.scene-dark {
  color: var(--ash);
  background-color: var(--coal);
}

/* ── Selection ── */
::selection {
  background-color: rgba(var(--ember-rgb), 0.25);
}

/* ── Typography ── */
h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  line-height: var(--lh-heading);
  letter-spacing: var(--track-display);
  text-wrap: balance;
}
h1 { font-size: var(--fs-hero); line-height: var(--lh-display); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
h4, h5, h6 {
  font-family: var(--font-body);
  font-weight: var(--weight-semibold);
  line-height: 1.2;
}
h4 { font-size: var(--fs-lead); }
h5, h6 { font-size: var(--fs-body); }

p {
  line-height: var(--lh-body);
  text-wrap: pretty;
  max-width: var(--measure);
}
body:not(.scene-dark) p { color: var(--ink-dim); }
body.scene-dark p { color: var(--ash-dim); }

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--t-fast) var(--ease-settle);
}
/* Buttons and the skip link own their hover colors: on dark scenes the amber
   link hover used to land on ember buttons (amber on ember-deep = 3.3:1).
   :where() keeps these rules at their original a:hover specificity. */
a:where(:not(.btn, .skip-link)):hover { color: var(--ember-deep); }
body.scene-dark a:where(:not(.btn, .skip-link)):hover { color: var(--amber); }

strong, b { font-weight: var(--weight-semibold); }

/* Amber accent inside display headings (dark scenes) */
.accent-word, .hero-title .accent, em.accent { font-style: normal; }
body.scene-dark .accent-word,
body.scene-dark .hero-title .accent,
body.scene-dark em.accent { color: var(--amber); }
body:not(.scene-dark) .accent-word,
body:not(.scene-dark) em.accent,
.band-sky .accent-word, .band-sky em.accent,
.band-sky-2 .accent-word, .band-sky-2 em.accent { color: var(--ember); }
/* Outlined ghost word (dark scenes). Fill stays dim-but-legible (AA on coal)
   so the word reads for low-vision users; the stroke carries the outline look. */
.ghost-word {
  color: var(--ash-faint);
  -webkit-text-stroke: 1.5px var(--line-strong);
}

/* Prose links (body copy) */
.prose a {
  color: var(--ember-deep);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.prose a:hover { color: var(--ember-deep); }

/* ── Images ── */
img { max-width: 100%; height: auto; display: block; }

/* ── Lists ── */
ul, ol { list-style: none; }

/* ── Forms ── */
button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}
button { cursor: pointer; border: none; background: none; }
input, select, textarea { outline: none; }

/* Accessible focus ring */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--ember-bright);
  outline-offset: 3px;
}

/* Skip link */
.skip-link {
  position: absolute;
  top: -52px;
  left: var(--space-4);
  z-index: calc(var(--z-header) + 10);
  background-color: var(--ember);
  color: #fff;
  padding: var(--space-3) var(--space-5);
  font-size: var(--fs-small);
  font-weight: var(--weight-semibold);
  transition: top var(--t-fast) var(--ease-settle);
}
.skip-link:focus { top: var(--space-4); color: #fff; }

/* ── Utility ── */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.text-center { text-align: center; }

/* ── Drafting eyebrow: mono label with an ember tick ── */
.section-label {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: var(--weight-medium);
  text-transform: uppercase;
  letter-spacing: var(--track-label);
  margin-bottom: var(--space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
}
body:not(.scene-dark) .section-label { color: var(--ink-dim); }
body.scene-dark .section-label,
.band-sky .section-label { color: inherit; }
body.scene-dark .section-label { color: var(--ash-dim); }
.band-sky .section-label { color: var(--ink-dim); }
.section-label::before {
  content: '';
  width: 14px;
  height: 2px;
  background-color: var(--ember-bright);
  flex: none;
}
.band-sky .section-label::before { background-color: var(--ember); }

.section-title {
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  font-size: var(--fs-h2);
  letter-spacing: var(--track-display);
  line-height: var(--lh-heading);
  margin-bottom: var(--space-4);
}

.section-desc {
  font-size: var(--fs-lead);
  max-width: 620px;
  line-height: 1.55;
}

.section-header { margin-bottom: var(--space-10); }
.section-header.centered { text-align: center; }
.section-header.centered .section-label { justify-content: center; }
.section-header.centered .section-desc { margin-left: auto; margin-right: auto; }

/* Legacy divider used by not-yet-touched pages */
.divider {
  width: 40px;
  height: 2px;
  background-color: var(--ember);
  margin: var(--space-4) 0;
}
.divider.centered { margin-left: auto; margin-right: auto; }

/* ── Reveal (one-time, minimal) ── */
@media (prefers-reduced-motion: no-preference) {
  .reveal, .reveal-left, .reveal-right, .reveal-scale {
    opacity: 0;
    transform: translateY(16px);
    transition:
      opacity var(--t-reveal) var(--ease-settle),
      transform var(--t-reveal) var(--ease-settle);
  }
  .reveal.visible, .reveal-left.visible, .reveal-right.visible, .reveal-scale.visible {
    opacity: 1;
    transform: translateY(0);
  }
  .reveal-delay-1 { transition-delay: 0.05s; }
  .reveal-delay-2 { transition-delay: 0.10s; }
  .reveal-delay-3 { transition-delay: 0.15s; }
  .reveal-delay-4 { transition-delay: 0.20s; }
  .reveal-delay-5 { transition-delay: 0.25s; }
  .reveal-delay-6 { transition-delay: 0.30s; }
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal, .reveal-left, .reveal-right, .reveal-scale {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ── Inline safety note (real content, not demo copy) ── */
.safety-note-inline { color: var(--ink-dim); font-size: var(--fs-small); margin-top: var(--space-4); }
body.scene-dark .safety-note-inline { color: var(--ash-dim); }
.band-sky .safety-note-inline, .band-sky-2 .safety-note-inline { color: var(--ink-dim); }

/* ===== fieldreport.css ===== */
/* ============================================
   Charter Oak Chimney — "FROM HEARTH TO SKY"
   Component system (Concept A, owner-selected).
   Same class contract as the previous system so
   every page keeps working; the world changed:
   coal cinema scenes, amber drafting marks, one
   ember action color, sky breaks for conversion.
   Dark pages: body.scene-dark. Light pages: default.
   ============================================ */

/* ══════════════ Buttons ══════════════ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 28px;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--weight-semibold);
  line-height: 1.2;
  text-align: center;
  border: 1px solid transparent;
  transition: background-color var(--t-fast) var(--ease-settle),
              border-color var(--t-fast) var(--ease-settle),
              color var(--t-fast) var(--ease-settle),
              transform var(--t-fast) var(--ease-settle);
  cursor: pointer;
}
.btn:active { transform: scale(0.98); }

.btn-primary { background-color: var(--ember); color: #fff; }

.btn-dark { background-color: var(--ink); color: var(--sky); }

/* outline adapts to world */
.btn-outline { background-color: transparent; }
body:not(.scene-dark) .btn-outline,
.band-sky .btn-outline {
  border-color: var(--ink-line-strong);
  color: var(--ink);
}
body.scene-dark .btn-outline {
  border-color: var(--line-strong);
  color: var(--ash);
}
/* explicit variants kept for markup that names them */
.btn-on-dark { background: transparent; border-color: var(--line-strong); color: var(--ash); }
.btn-paper { background-color: var(--sky); color: var(--ink); }

/* Button hovers only where a real pointer hovers: on touch the first tap
   applies :hover and leaves it stuck (e.g. a darker submit after a failed
   validation). Touch gets press feedback from .btn:active instead. */
@media (hover: hover) and (pointer: fine) {
  .btn-primary:hover { background-color: var(--ember-deep); color: #fff; }
  .btn-dark:hover { background-color: #37322b; color: var(--sky); }
  body:not(.scene-dark) .btn-outline:hover,
  .band-sky .btn-outline:hover { border-color: var(--ink); color: var(--ink); }
  body.scene-dark .btn-outline:hover { border-color: var(--ash); color: var(--ash); }
  .btn-on-dark:hover { border-color: var(--ash); color: var(--ash); }
  .btn-paper:hover { background-color: var(--white); color: var(--ink); }
}

/* Controls feel like controls on a phone: no gray tap flash over the
   designed press state, no 300 ms double-tap wait, no text selection or
   callout on long-press. Content text stays selectable. */
.btn, .sticky-cta-mobile a, .date-picker-day, .time-window, .form-details-summary, .consent-check, .nav-toggle {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
}

.btn-lg { min-height: 56px; padding: 0 32px; font-size: var(--fs-lead); }
.btn-sm { min-height: 42px; padding: 0 18px; font-size: var(--fs-small); }
.btn .btn-icon, .btn > svg { width: 18px; height: 18px; flex: none; }

.cta-pair { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.cta-note { margin-top: var(--space-3); font-size: var(--fs-small); }
body:not(.scene-dark) .cta-note { color: var(--ink-dim); }
body.scene-dark .cta-note { color: var(--ash-dim); }
.band-sky .cta-note { color: var(--ink-dim); }

/* ══════════════ Header ══════════════ */
#site-header {
  position: sticky;
  top: 0;
  z-index: var(--z-header);
  border-bottom: 1px solid transparent;
  transition: background-color var(--t-base) var(--ease-settle),
              border-color var(--t-base) var(--ease-settle);
}
body:not(.scene-dark) #site-header { background-color: var(--sky); }
body:not(.scene-dark) #site-header.scrolled { border-bottom-color: var(--ink-line); }
body.scene-dark #site-header { background-color: rgba(14, 12, 9, 0.92); backdrop-filter: blur(8px); }
body.scene-dark #site-header.scrolled { border-bottom-color: var(--line); }
/* transparent over the hero until scroll (homepage). Stays position:fixed in
   BOTH states — flipping fixed→sticky on first scroll pushed <main> down by the
   header height (a real 0.09 layout shift for users). */
body.scene-dark #site-header.hdr-clear {
  position: fixed;
  left: 0; right: 0;
}
body.scene-dark #site-header.hdr-clear:not(.scrolled) {
  background-color: transparent;
  backdrop-filter: none;
}

.header-inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
}

.logo { display: inline-flex; align-items: center; gap: 12px; flex: none; }
.logo-img { width: 40px; height: 40px; object-fit: contain; }
.logo-text { line-height: 1.05; }
.logo-name {
  display: block;
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  font-size: 1.05rem;
  letter-spacing: 0.05em;
}
.logo-sub {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
}
body:not(.scene-dark) .logo-name { color: var(--ink); }
body:not(.scene-dark) .logo-sub { color: var(--ink-dim); }
body.scene-dark .logo-name { color: var(--ash); }
body.scene-dark .logo-sub { color: var(--ash-dim); }

#main-nav { display: flex; align-items: center; gap: var(--space-6); }
#main-nav > a, .nav-dropdown-trigger {
  font-size: var(--fs-small);
  font-weight: var(--weight-medium);
  padding: var(--space-2) 0;
  border-bottom: 2px solid transparent;
}
body:not(.scene-dark) #main-nav > a,
body:not(.scene-dark) .nav-dropdown-trigger { color: var(--ink-dim); }
body:not(.scene-dark) #main-nav > a:hover,
body:not(.scene-dark) #main-nav > a[aria-current="page"],
body:not(.scene-dark) .nav-dropdown-trigger:hover { color: var(--ink); border-bottom-color: var(--ember); }
body.scene-dark #main-nav > a,
body.scene-dark .nav-dropdown-trigger { color: var(--ash-dim); }
body.scene-dark #main-nav > a:hover,
body.scene-dark #main-nav > a[aria-current="page"],
body.scene-dark .nav-dropdown-trigger:hover { color: var(--ash); border-bottom-color: var(--ember-bright); }

.nav-dropdown { position: relative; }
.nav-dropdown-trigger::after {
  content: '';
  display: inline-block;
  width: 7px; height: 7px;
  margin-left: 8px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}
.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  min-width: 480px;
  background-color: var(--coal-2);
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-lift);
  padding: var(--space-5);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 var(--space-6);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--t-fast) var(--ease-settle),
              transform var(--t-fast) var(--ease-settle),
              visibility var(--t-fast);
}
body:not(.scene-dark) .nav-dropdown-menu {
  background-color: var(--sky);
  border-color: var(--ink-line-strong);
  box-shadow: var(--shadow-lift-light);
}
.nav-dropdown:hover .nav-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu a {
  font-size: var(--fs-small);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--line);
}
body:not(.scene-dark) .nav-dropdown-menu a { color: var(--ink-dim); border-bottom-color: var(--ink-line); }
body:not(.scene-dark) .nav-dropdown-menu a:hover { color: var(--ember); }
body.scene-dark .nav-dropdown-menu a { color: var(--ash-dim); }
body.scene-dark .nav-dropdown-menu a:hover { color: var(--amber); }
.nav-dropdown-menu a:last-child,
.nav-dropdown-menu a:nth-last-child(2) { border-bottom: none; }
.nav-dropdown-group-label {
  grid-column: 1 / -1;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: var(--track-label);
  padding-bottom: var(--space-2);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
body:not(.scene-dark) .nav-dropdown-group-label { color: var(--ink-dim); }
body.scene-dark .nav-dropdown-group-label { color: var(--ash-dim); }
.nav-dropdown-group-label::before {
  content: '';
  width: 10px; height: 2px;
  background-color: var(--ember-bright);
}
.nav-dropdown-group-label:not(:first-child) { padding-top: var(--space-4); }

.header-cta { display: flex; align-items: center; gap: var(--space-4); flex: none; }
.header-call {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-small);
  font-weight: var(--weight-semibold);
  font-variant-numeric: tabular-nums;
}
body:not(.scene-dark) .header-call { color: var(--ink); }
body:not(.scene-dark) .header-call:hover { color: var(--ember); }
body.scene-dark .header-call { color: var(--ash); }
body.scene-dark .header-call:hover { color: var(--amber); }
.header-call-icon { width: 16px; height: 16px; }

.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 48px; height: 48px;
  align-items: center;
}
.nav-toggle span {
  display: block;
  width: 22px; height: 2px;
  transition: transform var(--t-base) var(--ease-settle), opacity var(--t-base) var(--ease-settle);
}
body:not(.scene-dark) .nav-toggle span { background-color: var(--ink); }
body.scene-dark .nav-toggle span { background-color: var(--ash); }
.nav-toggle.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2) { opacity: 0; }
.nav-toggle.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.55);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--t-base) var(--ease-settle), visibility var(--t-base);
  z-index: calc(var(--z-header) - 1);
}
.nav-overlay.active { opacity: 1; visibility: visible; }
.nav-cta-group { display: none; }

/* ══════════════ Bands (scenes) ══════════════ */
.band { padding: var(--space-24) 0; }
.band-tight { padding: var(--space-16) 0; }

/* dark world scene set */
body.scene-dark .band-alt  { background-color: var(--coal-2); }
body.scene-dark .band-dark { background-color: var(--slate-scene); }
body.scene-dark .band-soot { background-color: var(--coal-2); }

/* the light break — above the roofline */
.band-sky {
  background-color: var(--sky);
  color: var(--ink);
}
.band-sky h1, .band-sky h2, .band-sky h3 { color: var(--ink); }
.band-sky p { color: var(--ink-dim); }
.band-sky-2 { background-color: var(--sky-2); color: var(--ink); }
.band-sky-2 h2, .band-sky-2 h3 { color: var(--ink); }
.band-sky-2 p { color: var(--ink-dim); }

/* light pages: alt + dark panels */
body:not(.scene-dark) .band-alt  { background-color: var(--sky-2); }
body:not(.scene-dark) .band-dark,
body:not(.scene-dark) .band-soot {
  background-color: var(--coal);
  color: var(--ash);
}
body:not(.scene-dark) .band-dark h2, body:not(.scene-dark) .band-dark h3,
body:not(.scene-dark) .band-soot h2, body:not(.scene-dark) .band-soot h3 { color: var(--ash); }
body:not(.scene-dark) .band-dark p,
body:not(.scene-dark) .band-soot p { color: var(--ash-dim); }
body:not(.scene-dark) .band-dark .section-label,
body:not(.scene-dark) .band-soot .section-label { color: var(--ash-dim); }

.section-label--on-dark { color: var(--ash-dim) !important; }
.band-sky .section-label--on-dark,
.band-sky-2 .section-label--on-dark { color: var(--ink-dim) !important; }

/* roofline silhouette divider (dark → sky) */
.roofline-break { display: block; width: 100%; height: auto; }
.roofline-break path { fill: var(--slate-scene); }

/* ══════════════ Flue path (signature) ══════════════ */
.flue-seg {
  position: absolute;
  left: 50%;
  width: var(--flue-w);
  background: var(--line);
  transform: translateX(-50%);
}
.band-sky .flue-seg, .band-sky-2 .flue-seg { background: var(--ink-line-strong); }
.flue-seg i {
  position: absolute;
  inset: 0;
  background: linear-gradient(var(--ember-bright), var(--amber));
  transform-origin: top center;
  transform: scaleY(var(--p, 0));
}

.flue-line { position: relative; width: var(--flue-w); }
.flue-line::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--flue-color);
  transform: scaleY(0);
  transform-origin: top center;
  transition: transform 700ms var(--ease-settle);
}
.flue-line.drawn::before { transform: scaleY(1); }
.band-sky .flue-line::before, .band-sky-2 .flue-line::before { background-color: var(--ink-line-strong); }
@media (prefers-reduced-motion: reduce) {
  .flue-line::before { transform: scaleY(1); }
  .flue-seg i { transform: scaleY(1); }
}

/* Process spine */
.process { position: relative; padding-left: var(--space-10); }
.process > .flue-line { position: absolute; left: 0; top: 6px; bottom: 6px; }
.process-step { position: relative; padding: var(--space-6) 0; }
.process-step + .process-step { border-top: 1px solid var(--line); }
.band-sky .process-step + .process-step,
body:not(.scene-dark) .process-step + .process-step { border-top-color: var(--ink-line); }
body:not(.scene-dark) .band-dark .process-step + .process-step,
body:not(.scene-dark) .band-soot .process-step + .process-step { border-top-color: var(--line); }
.process-step::before {
  content: '';
  position: absolute;
  left: calc(-1 * var(--space-10));
  top: calc(var(--space-6) + 0.55em);
  width: 16px;
  height: var(--flue-w);
  background-color: var(--flue-tick);
}
.process-step-label {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  margin-bottom: var(--space-1);
  display: block;
}
body.scene-dark .process-step-label { color: var(--ash-dim); }
body:not(.scene-dark) .process-step-label { color: var(--ink-dim); }
.process-step h3 { font-size: var(--fs-h3); margin-bottom: var(--space-2); }
.process-step p { font-size: var(--fs-body); }

/* ══════════════ Figures & annotations ══════════════ */
.fig { position: relative; margin: 0; }
.fig img { width: 100%; }
.fig-label {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  padding-top: var(--space-3);
}
body.scene-dark .fig-label { color: var(--ash-dim); }
body:not(.scene-dark) .fig-label { color: var(--ink-dim); }
.fig-label::before {
  content: '';
  width: 10px;
  height: 2px;
  background-color: var(--ember-bright);
  flex: none;
}
.fig-label .fig-tag { margin-left: auto; text-transform: none; letter-spacing: 0.02em; }
body.scene-dark .fig-label .fig-tag { color: var(--ash-faint); }
body:not(.scene-dark) .fig-label .fig-tag { color: var(--soot-60); }
body:not(.scene-dark) .band-dark .fig-label,
body:not(.scene-dark) .band-soot .fig-label { color: var(--ash-dim); }
body:not(.scene-dark) .band-dark .fig-label .fig-tag,
body:not(.scene-dark) .band-soot .fig-label .fig-tag { color: var(--ash-faint); }

.fig-callout {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ash);
  background-color: rgba(14, 12, 9, 0.82);
  border: 1px solid var(--line-strong);
  padding: 5px 10px;
  pointer-events: none;
}
.fig-callout::before {
  content: '';
  width: 8px; height: 8px;
  border: 2px solid var(--ember-bright);
  border-radius: 50%;
  flex: none;
}

/* Roof-pitch mask */
.img-pitch { clip-path: polygon(0 7%, 100% 0, 100% 100%, 0 100%); }

/* ══════════════ Proof / trust row ══════════════ */
.proof-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-5);
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.05em;
}
body.scene-dark .proof-row { color: var(--ash-dim); }
body:not(.scene-dark) .proof-row { color: var(--ink-dim); }
.band-sky .proof-row { color: var(--ink-dim); }
.proof-row > span { display: inline-flex; align-items: center; gap: 8px; }
.proof-row > span::before {
  content: '';
  width: 8px; height: 2px;
  background-color: var(--ember-bright);
  flex: none;
}
.band-sky .proof-row > span::before { background-color: var(--ember); }
.proof-row--on-dark { color: var(--ash-dim) !important; }

/* ══════════════ Report table ══════════════ */
.report-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-body);
}
.report-table th, .report-table td {
  text-align: left;
  padding: var(--space-4) var(--space-4) var(--space-4) 0;
  vertical-align: top;
}
.report-table th {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  font-weight: var(--weight-medium);
  white-space: nowrap;
}
body.scene-dark .report-table { border-top: 1px solid var(--line-strong); }
body.scene-dark .report-table th { color: var(--amber); }
body.scene-dark .report-table td { color: var(--ash-dim); }
body.scene-dark .report-table th, body.scene-dark .report-table td { border-bottom: 1px solid var(--line); }
body:not(.scene-dark) .report-table { border-top: 1px solid var(--ink-line-strong); }
body:not(.scene-dark) .report-table th { color: var(--ink-dim); }
body:not(.scene-dark) .report-table td { color: var(--ink); }
body:not(.scene-dark) .report-table th, body:not(.scene-dark) .report-table td { border-bottom: 1px solid var(--ink-line); }

/* ══════════════ Check list ══════════════ */
.check-list { }
.check-item {
  display: flex;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  align-items: baseline;
}
body.scene-dark .check-list { border-top: 1px solid var(--line-strong); }
body.scene-dark .check-item { border-bottom: 1px solid var(--line); }
body:not(.scene-dark) .check-list { border-top: 1px solid var(--ink-line-strong); }
body:not(.scene-dark) .check-item { border-bottom: 1px solid var(--ink-line); }
body:not(.scene-dark) .band-dark .check-list,
body:not(.scene-dark) .band-soot .check-list { border-top-color: var(--line-strong); }
body:not(.scene-dark) .band-dark .check-item,
body:not(.scene-dark) .band-soot .check-item { border-bottom-color: var(--line); }
.check-item::before {
  content: '';
  flex: none;
  width: 12px; height: 7px;
  border-left: 2px solid var(--ember-bright);
  border-bottom: 2px solid var(--ember-bright);
  transform: rotate(-45deg) translateY(-2px);
}
body.scene-dark .check-item .check-text { color: var(--ash); }
body:not(.scene-dark) .check-item .check-text { color: var(--ink); }
body:not(.scene-dark) .band-dark .check-item .check-text,
body:not(.scene-dark) .band-soot .check-item .check-text { color: var(--ash); }
.check-item .check-sub { display: block; font-size: var(--fs-small); }
body.scene-dark .check-item .check-sub { color: var(--ash-dim); }
body:not(.scene-dark) .check-item .check-sub { color: var(--ink-dim); }
body:not(.scene-dark) .band-dark .check-item .check-sub,
body:not(.scene-dark) .band-soot .check-item .check-sub { color: var(--ash-dim); }

/* ══════════════ FAQ ══════════════ */
.faq-list { max-width: 780px; margin: 0 auto; }
body.scene-dark .faq-list { border-top: 1px solid var(--line-strong); }
body:not(.scene-dark) .faq-list { border-top: 1px solid var(--ink-line-strong); }
.faq-item { }
body.scene-dark .faq-item { border-bottom: 1px solid var(--line); }
body:not(.scene-dark) .faq-item { border-bottom: 1px solid var(--ink-line); }
.faq-q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  width: 100%;
  padding: var(--space-5) 0;
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  font-weight: var(--weight-medium);
  text-align: left;
  cursor: pointer;
}
body.scene-dark .faq-q { color: var(--ash); }
body.scene-dark .faq-q:hover { color: var(--amber); }
body:not(.scene-dark) .faq-q { color: var(--ink); }
body:not(.scene-dark) .faq-q:hover { color: var(--ember); }
.faq-icon {
  flex: none;
  font-family: var(--font-mono);
  font-size: var(--fs-lead);
  font-weight: 400;
  transition: transform var(--t-base) var(--ease-settle);
}
.faq-item.active .faq-icon { transform: rotate(45deg); color: var(--ember-bright); }
.faq-a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--t-base) var(--ease-settle);
}
.faq-item.active .faq-a { grid-template-rows: 1fr; }
.faq-a > * { overflow: hidden; min-height: 0; }
.faq-a p {
  padding-bottom: 0;
  font-size: var(--fs-body);
  transition: padding-bottom var(--t-base) var(--ease-settle);
}
.faq-item.active .faq-a p { padding-bottom: var(--space-5); }

/* ══════════════ Forms (light surfaces) ══════════════ */
.form-label {
  display: block;
  font-size: var(--fs-small);
  font-weight: var(--weight-medium);
  color: var(--ink);
  margin-bottom: var(--space-2);
}
.form-label .required { color: var(--ember); }
.form-input, .form-select, .form-textarea {
  width: 100%;
  min-height: 48px;
  padding: var(--space-3) var(--space-4);
  background-color: var(--white);
  border: 1px solid var(--ink-line-strong);
  font-size: var(--fs-body);
  color: var(--ink);
  transition: border-color var(--t-fast) var(--ease-settle),
              box-shadow var(--t-fast) var(--ease-settle);
}
.form-textarea { min-height: 110px; resize: vertical; }
/* Placeholder = example text: lighter than a typed value, still AA on white
   (ink-40 was 3.7:1; this mix is ~5.1:1; fallback ink-60 is 7.4:1). */
.form-input::placeholder, .form-textarea::placeholder {
  color: var(--ink-60);
  color: color-mix(in srgb, var(--ink-60) 85%, var(--white));
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  border-color: var(--ember);
  box-shadow: 0 0 0 3px rgba(var(--ember-rgb), 0.16);
}
.form-input.error, .form-select.error, .form-textarea.error { border-color: var(--err); }
.form-error { color: var(--err); font-size: var(--fs-small); margin-top: var(--space-1); min-height: 1.2em; }
.form-group { margin-bottom: var(--space-5); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.form-helper {
  display: flex;
  gap: var(--space-2);
  align-items: flex-start;
  font-size: var(--fs-small);
  color: var(--ink-dim);
  margin-top: var(--space-2);
}

/* ══════════════ Sticky CTA bars ══════════════ */
.sticky-cta-desktop { display: none; }
.sticky-cta-mobile {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-sticky);
  display: none;
  grid-template-columns: 1fr 1.7fr;
  gap: 10px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  transform: translateY(100%);
  visibility: hidden;
}
body.scene-dark .sticky-cta-mobile {
  background-color: rgba(14, 12, 9, 0.96);
  border-top: 1px solid var(--line-strong);
}
body:not(.scene-dark) .sticky-cta-mobile {
  background-color: var(--sky);
  border-top: 1px solid var(--ink-line-strong);
  box-shadow: var(--shadow-lift-light);
}
@media (prefers-reduced-motion: no-preference) {
  .sticky-cta-mobile { transition: transform var(--t-base) var(--ease-settle), visibility var(--t-base); }
}
.sticky-cta-mobile.visible { transform: translateY(0); visibility: visible; }
.sticky-cta-mobile .btn { min-height: 48px; padding: 0 12px; font-size: 0.95rem; }

/* ══════════════ Footer ══════════════ */
footer.fr-footer {
  background-color: var(--coal-2);
  color: var(--ash-dim);
}
.fr-footer .footer-grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--space-20) var(--gutter) var(--space-12);
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--space-10);
}
.fr-footer .logo-name { color: var(--ash); }
.fr-footer .logo-sub { color: var(--ash-dim); }
.fr-footer h4 {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: var(--weight-medium);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--ash-dim);
  margin-bottom: var(--space-4);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.fr-footer h4::before { content: ''; width: 10px; height: 2px; background-color: var(--ember-bright); }
.fr-footer .footer-links { display: flex; flex-direction: column; gap: var(--space-2); }
.fr-footer .footer-links a { color: var(--ash-dim); font-size: var(--fs-small); }
.fr-footer .footer-links a:hover { color: var(--ash); }
.fr-footer .footer-desc { color: var(--ash-dim); font-size: var(--fs-small); margin: var(--space-4) 0; max-width: 34ch; }
.fr-footer .footer-call a {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: var(--fs-h3);
  letter-spacing: 0.03em;
  color: var(--ash);
  font-variant-numeric: tabular-nums;
}
.fr-footer .footer-call a:hover { color: var(--amber); }
.fr-footer .footer-contact a { color: var(--ash-dim); font-size: var(--fs-small); }
.fr-footer .footer-tagline {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ash-dim);
  margin-top: var(--space-4);
}
.fr-footer .footer-bottom {
  border-top: 1px solid var(--line);
  padding: var(--space-5) var(--gutter);
  max-width: var(--container);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  font-size: var(--fs-small);
  color: var(--ash-dim);
}
.fr-footer .footer-bottom a { color: var(--ash-dim); }
.fr-footer .footer-bottom a:hover { color: var(--ash); }
.fr-footer .footer-bottom p { color: inherit; font-size: inherit; }

/* ══════════════ Responsive ══════════════ */
@media (max-width: 1023px) {
  .band { padding: var(--space-20) 0; }
  .fr-footer .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .band { padding: var(--space-16) 0; }
  .band-tight { padding: var(--space-12) 0; }

  #main-nav {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: min(340px, 88vw);
    background-color: var(--coal-2);
    border-left: 1px solid var(--line-strong);
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding: calc(var(--header-height) + var(--space-6)) var(--space-6) var(--space-8);
    transform: translateX(100%);
    visibility: hidden; /* closed drawer: unfocusable + no phantom overflow width */
    transition: transform var(--t-base) var(--ease-settle),
                visibility var(--t-base);
    overflow-y: auto;
    z-index: var(--z-header);
  }
  body:not(.scene-dark) #main-nav { background-color: var(--sky); border-left-color: var(--ink-line-strong); }
  #main-nav.open { transform: translateX(0); visibility: visible; }
  /* The toggle (its open state draws an ×) stays above the drawer: it is the
     menu's visible close control. */
  .nav-toggle { position: relative; z-index: calc(var(--z-header) + 1); }
  #main-nav > a, .nav-dropdown-trigger {
    width: 100%;
    padding: var(--space-4) 0;
    font-size: var(--fs-lead);
  }
  body.scene-dark #main-nav > a,
  body.scene-dark .nav-dropdown-trigger { color: var(--ash); border-bottom: 1px solid var(--line); }
  body:not(.scene-dark) #main-nav > a,
  body:not(.scene-dark) .nav-dropdown-trigger { color: var(--ink); border-bottom: 1px solid var(--ink-line); }
  .nav-dropdown { width: 100%; }
  .nav-dropdown-trigger { display: flex; justify-content: space-between; align-items: center; }
  .nav-dropdown-trigger::after { margin-left: auto; }
  .nav-dropdown-menu {
    position: static;
    transform: none;
    min-width: 0;
    width: 100%;
    display: none;
    grid-template-columns: 1fr;
    border: none;
    box-shadow: none;
    background: none;
    padding: 0 0 var(--space-3) var(--space-4);
    opacity: 1;
    visibility: visible;
  }
  .nav-dropdown.nav-dropdown-open .nav-dropdown-menu { display: grid; }
  .nav-cta-group {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    width: 100%;
    margin-top: var(--space-6);
  }
  .nav-cta-group a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    font-weight: var(--weight-semibold);
  }
  body.scene-dark .nav-cta-group .nav-cta-call { border: 1px solid var(--line-strong); color: var(--ash); }
  body:not(.scene-dark) .nav-cta-group .nav-cta-call { border: 1px solid var(--ink-line-strong); color: var(--ink); }
  .nav-cta-group .nav-cta-schedule { background-color: var(--ember); color: #fff; }
  .nav-toggle { display: flex; }
  .header-cta .btn { display: none; }
  .header-call .header-call-text { display: none; }
  .header-call {
    width: 48px; height: 48px;
    justify-content: center;
  }
  body.scene-dark .header-call { border: 1px solid var(--line-strong); }
  body:not(.scene-dark) .header-call { border: 1px solid var(--ink-line-strong); }
  .header-call-icon { width: 18px; height: 18px; }

  .sticky-cta-mobile { display: grid; }
  .form-row { grid-template-columns: 1fr; }

  .fr-footer .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
    padding: var(--space-16) var(--gutter) var(--space-10);
  }
  .fr-footer .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    padding-bottom: calc(var(--space-5) + 84px);
  }
  .process { padding-left: var(--space-8); }
  .process-step::before { left: calc(-1 * var(--space-8)); }
  .fig-callout { display: none; }
}

@media (max-width: 480px) {
  .cta-pair { flex-direction: column; align-items: stretch; }
  .cta-pair .btn { width: 100%; }
  .btn { white-space: normal; }
}

/* Grid/flex children must be allowed to shrink (390px overflow guard) */
.svc-two > *, .see-grid > *, .paths-grid > *,
.hero-grid > *, .process-wrap > * { min-width: 0; }

/* Report tables stack on narrow screens */
@media (max-width: 640px) {
  .report-table th { white-space: normal; }
  .report-table tr { display: block; padding: var(--space-3) 0; }
  body.scene-dark .report-table tr { border-bottom: 1px solid var(--line); }
  body:not(.scene-dark) .report-table tr { border-bottom: 1px solid var(--ink-line); }
  .report-table th, .report-table td {
    display: block;
    border-bottom: none;
    padding: 0 0 var(--space-1);
  }
}

/* ══════════════ Sky bands inside dark pages: full override set ══════════════ */
body.scene-dark .band-sky h1, body.scene-dark .band-sky h2, body.scene-dark .band-sky h3,
body.scene-dark .band-sky-2 h1, body.scene-dark .band-sky-2 h2, body.scene-dark .band-sky-2 h3 { color: var(--ink); }
body.scene-dark .band-sky p, body.scene-dark .band-sky-2 p { color: var(--ink-dim); }
body.scene-dark .band-sky .section-label, body.scene-dark .band-sky-2 .section-label,
body.scene-dark .band-sky .process-step-label, body.scene-dark .band-sky-2 .process-step-label,
body.scene-dark .band-sky .cta-note, body.scene-dark .band-sky-2 .cta-note,
body.scene-dark .band-sky .proof-row, body.scene-dark .band-sky-2 .proof-row { color: var(--ink-dim); }
body.scene-dark .band-sky .section-label::before, body.scene-dark .band-sky-2 .section-label::before,
body.scene-dark .band-sky .proof-row > span::before, body.scene-dark .band-sky-2 .proof-row > span::before { background-color: var(--ember); }
body.scene-dark .band-sky .faq-q, body.scene-dark .band-sky-2 .faq-q { color: var(--ink); }
body.scene-dark .band-sky .faq-q:hover, body.scene-dark .band-sky-2 .faq-q:hover { color: var(--ember); }
body.scene-dark .band-sky .faq-list, body.scene-dark .band-sky-2 .faq-list { border-top-color: var(--ink-line-strong); }
body.scene-dark .band-sky .faq-item, body.scene-dark .band-sky-2 .faq-item { border-bottom-color: var(--ink-line); }
body.scene-dark .band-sky .process-step + .process-step,
body.scene-dark .band-sky-2 .process-step + .process-step { border-top-color: var(--ink-line); }
body.scene-dark .band-sky .flue-line::before, body.scene-dark .band-sky-2 .flue-line::before { background-color: var(--ink-line-strong); }
/* any leftover btn-on-dark that lands on a sky band stays legible */
.band-sky .btn-on-dark, .band-sky-2 .btn-on-dark {
  border-color: var(--ink-line-strong);
  color: var(--ink);
}
.band-sky .btn-on-dark:hover, .band-sky-2 .btn-on-dark:hover { border-color: var(--ink); color: var(--ink); }

/* specificity guards: sky-band buttons on dark pages; footer logo on light pages */
body.scene-dark .band-sky .btn-outline,
body.scene-dark .band-sky-2 .btn-outline {
  border-color: var(--ink-line-strong);
  color: var(--ink);
}
body.scene-dark .band-sky .btn-outline:hover,
body.scene-dark .band-sky-2 .btn-outline:hover { border-color: var(--ink); color: var(--ink); }
body:not(.scene-dark) .fr-footer .logo-name { color: var(--ash); }
body:not(.scene-dark) .fr-footer .logo-sub { color: var(--ash-dim); }

/* mobile: no header blur — backdrop-filter would make the sticky header the
   containing block for the fixed nav drawer (phantom 340px scrollWidth) */
@media (max-width: 768px) {
  body.scene-dark #site-header {
    backdrop-filter: none;
    background-color: rgba(14, 12, 9, 0.97);
  }
}

/* ══════════════ Launch pass (2026-09) ══════════════ */
/* Services trigger is a real <button> now */
.nav-dropdown-trigger { background: none; border: 0; cursor: pointer; font-family: inherit; text-align: left; }
.nav-dropdown.nav-dropdown-open .nav-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
/* Header phone: number text visible from tablets up; icon-only on phones */
@media (min-width: 769px) and (max-width: 1100px) {
  #main-nav { gap: var(--space-4); }
  #main-nav > a, .nav-dropdown-trigger { font-size: var(--fs-label); }
  .header-call .header-call-text { display: inline; }
}
/* Footer: 14 service links in two columns on desktop; registration line */
.fr-footer .footer-links-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--space-6); }
.fr-footer .footer-trust { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: 0.04em; text-transform: uppercase; color: var(--ash); margin: var(--space-3) 0; }
.fr-footer .footer-grid-minimal { grid-template-columns: 2fr 1fr; }
.fr-footer .footer-grid-ppc { grid-template-columns: 2fr 1fr 1fr; }
@media (max-width: 640px) {
  .fr-footer .footer-links-2col { grid-template-columns: 1fr; }
  .fr-footer .footer-grid-minimal, .fr-footer .footer-grid-ppc { grid-template-columns: 1fr; }
}
/* Sticky bar must never cover the footer's last links (iOS safe area included) */
@media (max-width: 768px) {
  body.has-sticky-mobile .fr-footer { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
  /* Long press on the bar's buttons should tap, not select their text */
  .sticky-cta-mobile .btn { -webkit-user-select: none; user-select: none; }
}
/* Trust proof-row host (renders from config; hidden while empty) */
[data-trust-badges][hidden] { display: none; }

/* 375px phones: logo + phone icon + burger must fit inside one header row */
@media (max-width: 400px) {
  .header-inner { gap: var(--space-3); }
  .header-cta { gap: var(--space-2); }
  .logo { gap: 8px; }
  .logo-sub { letter-spacing: 0.14em; }
}
/* Buttons inside prose keep button colors (the .prose a rule must not recolor them) */
.prose a.btn, .prose a.btn:hover, .post-cta a.btn, .post-cta a.btn:hover { text-decoration: none; }
.prose a.btn-primary, .prose a.btn-primary:hover, .post-cta a.btn-primary, .post-cta a.btn-primary:hover { color: #fff; }

/* ===== service.css ===== */
/* ============================================
   Charter Oak Chimney — Service & city pages
   "FROM HEARTH TO SKY": dark cinematic hero,
   coal content scenes, sky break for FAQ/closing.
   Pages using this set body.scene-dark.
   ============================================ */

/* Breadcrumb */
.crumbs {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--space-5) var(--gutter) 0;
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--ash-dim);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.crumbs a { color: var(--ash-dim); }
.crumbs a:hover { color: var(--amber); }
.crumbs .sep { color: var(--ash-dim); }

/* ── Dark cinematic hero ── */
.svc-hero {
  position: relative;
  padding: clamp(40px, 7vh, 90px) 0 clamp(48px, 8vh, 100px);
  overflow: hidden;
}
.svc-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.svc-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.38;
}
.svc-hero-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(14,12,9,0.75) 0%, rgba(14,12,9,0.35) 45%, rgba(14,12,9,0.92) 100%);
}
.svc-hero-grid {
  position: relative;
  z-index: 1;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(30px, 5vw, 70px);
  align-items: center;
}
.svc-hero h1 {
  font-size: var(--fs-h2);
  margin: var(--space-4) 0 var(--space-5);
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.5);
}
.svc-hero .lead {
  font-size: var(--fs-lead);
  color: var(--ash-dim);
  max-width: 56ch;
  margin-bottom: var(--space-6);
}
.svc-hero .objection {
  border-left: 2px solid var(--ember-bright);
  padding: var(--space-2) 0 var(--space-2) var(--space-5);
  margin-bottom: var(--space-8);
  font-size: var(--fs-body);
  color: var(--ash);
  max-width: 52ch;
}
.svc-hero .cta-pair { margin-bottom: var(--space-3); }
/* Supporting copy that now follows the CTAs (objection callout on service
   pages, the second local paragraph on town pages) — the action comes first. */
.svc-hero .cta-note + .objection { margin-top: var(--space-6); margin-bottom: 0; }
.svc-hero .cta-note + .svc-hero-more { margin-top: var(--space-6); margin-bottom: 0; }
.svc-hero .proof-row {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
}
.svc-hero .fig-frame {
  aspect-ratio: 4 / 3.4;
  overflow: hidden;
  clip-path: polygon(0 6%, 100% 0, 100% 100%, 0 100%);
}
.svc-hero .fig-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Price strip (verified $69 only) */
.price-strip {
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  background-color: var(--coal-2);
}
.price-strip .container {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-6);
  padding-top: var(--space-5);
  padding-bottom: var(--space-5);
}
.price-strip .amount {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: var(--fs-h3);
  letter-spacing: 0.02em;
  color: var(--amber);
}
.price-strip .terms {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ash-dim);
}

/* Two-column content rows */
.svc-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px, 6vw, 90px);
  align-items: center;
}
.svc-two h2 { margin-bottom: var(--space-4); }
.svc-two .section-desc { margin-bottom: var(--space-6); }

/* Symptom rows */
.symptom-list { border-top: 1px solid var(--line-strong); }
.symptom-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-2);
  border-bottom: 1px solid var(--line);
  align-items: baseline;
}
.symptom-row strong { display: block; font-weight: var(--weight-semibold); color: var(--ash); margin-bottom: 2px; }
.symptom-row span { font-size: var(--fs-small); color: var(--ash-dim); }
.symptom-row .points-to {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--amber);
  white-space: nowrap;
}
/* sky-world variants */
.band-sky .symptom-list, .band-sky-2 .symptom-list { border-top-color: var(--ink-line-strong); }
.band-sky .symptom-row, .band-sky-2 .symptom-row { border-bottom-color: var(--ink-line); }
.band-sky .symptom-row strong, .band-sky-2 .symptom-row strong { color: var(--ink); }
.band-sky .symptom-row span, .band-sky-2 .symptom-row span { color: var(--ink-dim); }
.band-sky .symptom-row .points-to, .band-sky-2 .symptom-row .points-to { color: var(--ember); }

/* Related services strip */
.related-strip { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.related-strip a {
  border: 1px solid var(--line-strong);
  padding: var(--space-3) var(--space-5);
  font-size: var(--fs-small);
  font-weight: var(--weight-medium);
  color: var(--ash);
  transition: border-color var(--t-fast) var(--ease-settle), color var(--t-fast) var(--ease-settle);
}
.related-strip a:hover { border-color: var(--amber); color: var(--amber); }
.band-sky .related-strip a, .band-sky-2 .related-strip a {
  border-color: var(--ink-line-strong);
  color: var(--ink);
}
.band-sky .related-strip a:hover, .band-sky-2 .related-strip a:hover { border-color: var(--ember); color: var(--ember); }

/* Closing */
.svc-closing { text-align: center; }
.svc-closing .section-label { justify-content: center; }
.svc-closing .cta-pair { justify-content: center; }

/* Areas grid reuse on light service-areas page comes from home.css */

/* ── Light-world overrides (default body, no .scene-dark) ──
   FAQ / Before & After / Service Areas / blog reuse the hero and
   breadcrumbs on the sky ground; recolor the dark-scene defaults. */
body:not(.scene-dark) .crumbs,
body:not(.scene-dark) .crumbs a,
body:not(.scene-dark) .crumbs .sep { color: var(--ink-dim); }
body:not(.scene-dark) .crumbs a:hover { color: var(--ember); }
body:not(.scene-dark) .svc-hero h1 { text-shadow: none; }
body:not(.scene-dark) .svc-hero .lead { color: var(--ink-dim); }
body:not(.scene-dark) .svc-hero .objection {
  color: var(--ink);
  border-left-color: var(--ember);
}

@media (max-width: 1023px) {
  .svc-hero-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .svc-two { grid-template-columns: 1fr; gap: var(--space-8); }
}
@media (max-width: 640px) {
  .svc-hero { padding: var(--space-8) 0 var(--space-12); }
  .symptom-row { grid-template-columns: 1fr; gap: var(--space-1); }
}

/* ══════════════ PPC conversion-system components ══════════════ */

/* Symptom navigation — prominent chips under the hero (repair, leak) */
.symptom-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-6);
}
.symptom-nav a {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--line-strong);
  color: var(--ash);
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  transition: border-color var(--t-fast) var(--ease-settle), color var(--t-fast) var(--ease-settle);
}
.symptom-nav a:hover { border-color: var(--amber); color: var(--amber); }
body:not(.scene-dark) .symptom-nav a,
.band-sky .symptom-nav a, .band-sky-2 .symptom-nav a { border-color: var(--ink-line-strong); color: var(--ink); }
body:not(.scene-dark) .symptom-nav a:hover,
.band-sky .symptom-nav a:hover, .band-sky-2 .symptom-nav a:hover { border-color: var(--ember); color: var(--ember); }

/* Intent paths — "which situation is yours" cards (liner, oil/gas, leak) */
.intent-paths {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-4);
}
.intent-path {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-6);
  border: 1px solid var(--line-strong);
  color: var(--ash);
  transition: border-color var(--t-fast) var(--ease-settle);
}
.intent-path:hover { border-color: var(--amber); color: var(--ash); }
.intent-path .k {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--amber);
}
.intent-path h3 { font-size: var(--fs-h3); margin: 0; }
.intent-path p { font-size: var(--fs-small); color: var(--ash-dim); margin: 0; }
.intent-path .go {
  margin-top: auto;
  font-weight: var(--weight-semibold);
  color: var(--amber);
  font-size: var(--fs-small);
}
.band-sky .intent-path, .band-sky-2 .intent-path, body:not(.scene-dark) .intent-path { border-color: var(--ink-line-strong); color: var(--ink); }
.band-sky .intent-path:hover, .band-sky-2 .intent-path:hover, body:not(.scene-dark) .intent-path:hover { border-color: var(--ember); }
.band-sky .intent-path .k, .band-sky-2 .intent-path .k, .band-sky .intent-path .go, .band-sky-2 .intent-path .go,
body:not(.scene-dark) .intent-path .k, body:not(.scene-dark) .intent-path .go { color: var(--ember); }
.band-sky .intent-path p, .band-sky-2 .intent-path p, body:not(.scene-dark) .intent-path p { color: var(--ink-dim); }

/* Leak source map — inline SVG diagram (no photographs) */
.leak-map { display: grid; grid-template-columns: minmax(260px, 440px) 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.leak-map svg { width: 100%; height: auto; display: block; }
.leak-map .lm-line { stroke: var(--line-strong); stroke-width: 1.6; fill: none; }
.leak-map .lm-faint { stroke: var(--line); stroke-width: 1.2; fill: none; }
.leak-map .lm-fill { fill: rgba(242, 238, 230, 0.03); }
.leak-map .lm-hl { stroke: var(--amber); stroke-width: 2.2; fill: none; }
.leak-map .lm-water { stroke: var(--ember-bright); stroke-width: 2; fill: none; stroke-dasharray: 4 5; }
.leak-map .lm-tag { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; fill: var(--amber); }
.leak-sources { counter-reset: src; border-top: 1px solid var(--line-strong); }
.leak-source {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--line);
  align-items: start;
}
.leak-source .n { font-family: var(--font-display); font-size: var(--fs-h3); line-height: 1; color: var(--amber); }
.leak-source strong { display: block; color: var(--ash); margin-bottom: 2px; }
.leak-source span { font-size: var(--fs-small); color: var(--ash-dim); }

/* Trust row (data-driven; hidden until real values exist) */
.trust-row { margin-top: var(--space-4); }
.trust-rating { font-weight: var(--weight-semibold); }

/* Price range component (data-driven; hidden until approved pricing exists) */
.price-range {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-5);
  padding: var(--space-4) 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  margin: var(--space-6) 0;
}
.price-range-label { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-label); text-transform: uppercase; color: var(--ash-dim); }
.price-range-amount { font-family: var(--font-display); text-transform: uppercase; font-size: var(--fs-h3); color: var(--amber); }
.price-range-note { font-size: var(--fs-small); color: var(--ash-dim); }
.band-sky .price-range, .band-sky-2 .price-range, body:not(.scene-dark) .price-range { border-color: var(--ink-line-strong); }
.band-sky .price-range-label, .band-sky .price-range-note, body:not(.scene-dark) .price-range-label, body:not(.scene-dark) .price-range-note { color: var(--ink-dim); }
.band-sky .price-range-amount, .band-sky-2 .price-range-amount, body:not(.scene-dark) .price-range-amount { color: var(--ember); }

/* Reviews (data-driven; hidden until real reviews exist) */
.reviews-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-4); }
.review-card { border: 1px solid var(--ink-line-strong); padding: var(--space-5); background-color: var(--white); }
.review-card p { color: var(--ink); font-size: var(--fs-body); margin: var(--space-2) 0 var(--space-3); }
.review-rating, .review-by { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-dim); }
.reviews-source-link { color: var(--ember); font-weight: var(--weight-semibold); text-decoration: underline; text-underline-offset: 3px; }

/* Level comparison table emphasis */
.report-table td strong { display: block; }

@media (max-width: 1023px) {
  .leak-map { grid-template-columns: 1fr; }
  .leak-map svg { max-width: 420px; margin: 0 auto; }
}

/* Leak page: small reference figures beside sources 01-04 */
.leak-source .leak-fig { margin-top: 12px; max-width: 280px; }
.leak-source .leak-fig img { width: 100%; height: auto; display: block; }
.leak-source .leak-fig .fig-caption { color: var(--ash-dim); }

/* Related strip on light (non scene-dark) pages, e.g. blog articles */
body:not(.scene-dark) .related-strip a { border-color: var(--ink-line-strong); color: var(--ink); }
body:not(.scene-dark) .related-strip a:hover { border-color: var(--ember); color: var(--ember); }

/* ===== home.css ===== */
/* ============================================
   Charter Oak Chimney — Homepage
   "FROM HEARTH TO SKY" scene sequence:
   FIRE → INSIDE THE SYSTEM → EVIDENCE →
   ROOFLINE BREAK (services/areas, light) → BOOK.
   ============================================ */

/* ══════════════ SCENE 01 — FIRE (video hero) ══════════════ */
#hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.hero-media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-media .hv-mob { display: none; }
.hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(14,12,9,0.55) 0%, rgba(14,12,9,0.05) 26%,
    rgba(14,12,9,0) 45%, rgba(14,12,9,0.62) 72%, rgba(14,12,9,0.94) 100%);
}
.hero-grid {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: calc(var(--header-height) + var(--space-8)) var(--gutter) clamp(28px, 5vh, 56px);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: var(--space-6);
}
.hero-copy .section-label { margin-bottom: var(--space-6); color: var(--ash-dim); }
.hero-title {
  font-size: var(--fs-hero);
  line-height: var(--lh-display);
  margin: 0 0 22px -0.03em;
  white-space: nowrap;
  text-shadow: 0 2px 28px rgba(0, 0, 0, 0.55);
}
.hero-title .line { display: block; overflow: hidden; }
.hero-title .line span { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .hero-title .line span {
    transform: translateY(110%);
    animation: heroRise 700ms var(--ease-settle) forwards;
  }
  .hero-title .line:nth-child(2) span { animation-delay: 130ms; }
  .hero-sub, .hero-ctas, .hero-note, .hero-proof {
    opacity: 0;
    animation: heroFade 620ms var(--ease-settle) forwards;
  }
  .hero-sub { animation-delay: 300ms; }
  .hero-ctas { animation-delay: 420ms; }
  .hero-note { animation-delay: 520ms; }
  .hero-proof { animation-delay: 600ms; }
  @keyframes heroRise { to { transform: translateY(0); } }
  @keyframes heroFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
}
.hero-sub {
  color: var(--ash-dim);
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.5);
  max-width: 48ch;
  font-size: clamp(1.0625rem, 1.4vw, 1.1875rem);
  margin-bottom: 28px;
}
.hero-ctas { margin-bottom: 12px; }
.hero-note { margin-top: 0; color: var(--ash-dim); font-size: var(--fs-small); }
.hero-proof {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
}

/* vertical rail: HEARTH → SKY + rising ember */
.hero-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding-bottom: 6px;
}
.hero-rail .v {
  writing-mode: vertical-rl;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ash-dim);
}
.hero-rail .stub {
  position: relative;
  width: var(--flue-w);
  height: 92px;
  background: var(--line-strong);
  overflow: hidden;
}
@media (prefers-reduced-motion: no-preference) {
  .hero-rail .stub::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -8px;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--ember-bright);
    box-shadow: 0 0 12px 2px rgba(228, 87, 27, 0.75);
    animation: emberUp 3.2s ease-in-out infinite;
  }
  @keyframes emberUp {
    0% { bottom: -8px; opacity: 0; }
    12% { opacity: 1; }
    78% { opacity: 1; }
    100% { bottom: 100%; opacity: 0; }
  }
}

/* ══════════════ SCENE 02 — INSIDE THE SYSTEM ══════════════ */
.s2-head { max-width: var(--container); margin: 0 auto clamp(40px, 6vh, 70px); padding: 0 var(--gutter); }
.s2-head h2 em { font-style: normal; }
.s2-wrap {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(300px, 460px) 1fr;
  gap: clamp(30px, 6vw, 90px);
  align-items: start;
}
.s2-steps { padding: 6vh 0 16vh; }
.anat-step {
  min-height: 44vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: var(--flue-w) solid var(--line);
  padding-left: 26px;
  transition: border-color 300ms ease;
}
.anat-step h3 { color: var(--ash-dim); transition: color 300ms ease; }
.anat-step.on { border-left-color: var(--ember-bright); }
.anat-step.on h3 { color: var(--ash); }
.anat-step .k { color: var(--ash-dim); margin-bottom: 10px; }
.anat-step h3 { margin-bottom: 12px; }
.anat-step p { color: var(--ash-dim); font-size: var(--fs-body); max-width: 40ch; margin-bottom: 14px; }
.anat-step a {
  font-weight: var(--weight-semibold);
  color: var(--amber);
  border-bottom: 1px solid rgba(232, 168, 87, 0.4);
  padding-bottom: 2px;
}
.anat-step a:hover { color: var(--ember-bright); border-color: var(--ember-bright); }
.s2-fig {
  position: sticky;
  top: 8vh;
  height: 84vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.s2-fig svg { height: 100%; width: auto; max-width: 100%; }

/* cutaway linework */
.cw-line  { stroke: var(--line-strong); stroke-width: 1.6; fill: none; }
.cw-faint { stroke: var(--line); stroke-width: 1.2; fill: none; }
.cw-hatch { stroke: var(--line); stroke-width: 1; }
.cw-fill  { fill: rgba(242, 238, 230, 0.03); }
.cw-comp .hl { stroke: var(--amber); stroke-width: 2.4; fill: none; opacity: 0; transition: opacity 260ms ease; }
.cw-comp .tag { opacity: 0; transition: opacity 260ms ease; }
.cw-comp .tag text {
  font-family: var(--font-mono);
  font-size: 12.5px;
  letter-spacing: 0.12em;
  fill: var(--amber);
  text-transform: uppercase;
}
.cw-comp .tag line { stroke: var(--amber); stroke-width: 1; }
.cw-comp.on .hl, .cw-comp.on .tag { opacity: 1; }
.cw-flue-track { stroke: var(--line); stroke-width: 2; fill: none; }
.cw-flue-fill {
  stroke: var(--ember-bright);
  stroke-width: 2.5;
  fill: none;
  stroke-dasharray: 1;
  stroke-dashoffset: calc(1 - var(--p, 0));
}
.cw-note {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  fill: var(--ash-dim);
  text-transform: uppercase;
}
@media (prefers-reduced-motion: reduce) {
  .anat-step h3 { color: var(--ash); }
  .cw-comp .hl, .cw-comp .tag { opacity: 1; }
  .cw-flue-fill { stroke-dashoffset: 0; }
}

/* tap mode (mobile + reduced motion) */
.anat-tabs { display: none; }

/* ══════════════ SCENE 03 — EVIDENCE ══════════════ */
.see-grid {
  display: grid;
  grid-template-columns: minmax(320px, 520px) 1fr;
  gap: clamp(36px, 6vw, 90px);
  align-items: center;
}
.s3-lede { font-size: var(--fs-lead); color: var(--ash); max-width: 42ch; margin-bottom: 22px; }
.s3-lede b { color: var(--amber); }

.board { position: relative; min-height: 560px; }
.shot {
  position: absolute;
  background: #fdfcf9;
  padding: 10px 10px 40px;
  box-shadow: var(--shadow-lift);
}
.shot img { width: 100%; height: auto; }
.shot figcaption {
  position: absolute;
  left: 12px; bottom: 10px;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #55504a;
}
.shot-1 { width: 46%; top: 2%; left: 0; transform: rotate(-2.2deg); }
.shot-2 { width: 52%; top: 20%; right: 0; transform: rotate(1.6deg); z-index: 2; }
.shot-3 { width: 42%; bottom: 0; left: 12%; transform: rotate(-1deg); z-index: 3; }
.callout {
  position: absolute;
  z-index: 4;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--amber);
  display: flex;
  align-items: center;
  gap: 8px;
}
.callout::before {
  content: '';
  width: 12px; height: 12px;
  border: 2px solid var(--ember-bright);
  border-radius: 50%;
  flex: none;
}
.callout .lead { width: 46px; height: 1px; background: var(--amber); }
.board-tag {
  position: absolute;
  top: -34px;
  right: 0;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ash-dim);
}

/* ══════════════ ROOFLINE BREAK + ZONES (sky) ══════════════ */
.zones { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.zone {
  display: grid;
  grid-template-columns: 120px minmax(200px, 1.1fr) 2fr auto;
  gap: clamp(18px, 3vw, 44px);
  align-items: center;
  padding: 30px 0;
  border-top: 1px solid var(--ink-line);
}
.zone:last-child { border-bottom: 1px solid var(--ink-line); }
.zone-fig svg { width: 100%; height: auto; }
.zone-fig .zl { stroke: rgba(27, 24, 20, 0.5); stroke-width: 1.6; fill: none; }
.zone-fig .zh { stroke: var(--ember); stroke-width: 2.2; fill: none; }
.zone h3 { line-height: 1; color: var(--ink); }
.zone h3 span {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-dim);
  margin-top: 8px;
}
.zone-links { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.zone-links a {
  font-weight: var(--weight-semibold);
  color: var(--ink);
  border-bottom: 2px solid rgba(27, 24, 20, 0.25);
  padding-bottom: 2px;
  font-size: var(--fs-small);
}
.zone-links a:hover { color: var(--ember); border-color: var(--ember); }
.zone .btn { white-space: nowrap; }

/* ══════════════ AREAS (sky) ══════════════ */
.areas-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-10);
  margin-bottom: var(--space-10);
}
.area-group h3 {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: var(--weight-medium);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--ink-dim);
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--ink-line-strong);
}
.area-group h3::before { content: ''; width: 10px; height: 2px; background-color: var(--ember); }
.area-group ul { columns: 2; column-gap: var(--space-6); }
.area-group li a {
  display: inline-block;
  padding: var(--space-1) 0;
  font-size: var(--fs-body);
  color: var(--ink);
}
.area-group li a:hover { color: var(--ember); }
.area-note { font-size: var(--fs-small); color: var(--ink-dim); margin-bottom: var(--space-6); }

/* ══════════════ SEASONAL (sky-2) ══════════════ */
.season-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); }
.season { border: 1px solid var(--ink-line); padding: var(--space-6); }
.season[data-current="true"] { border-color: var(--ember); background-color: var(--white); }
.season-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--ink-dim);
  margin-bottom: var(--space-3);
}
.season[data-current="true"] .season-tag { color: var(--ember); }
.season[data-current="true"] .season-tag::after {
  content: 'NOW';
  border: 1px solid currentColor;
  padding: 0 5px;
}
.season h3 {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--weight-semibold);
  text-transform: none;
  letter-spacing: 0;
  color: var(--ink);
  margin-bottom: var(--space-2);
}
.season p { font-size: var(--fs-small); }

/* ══════════════ SCENE 05 — BOOK (sky-2) ══════════════ */
#closing { text-align: center; position: relative; }
#closing .flue-seg { top: 0; height: clamp(60px, 9vh, 110px); }
#closing .section-label { justify-content: center; }
.closing-end {
  width: 14px; height: 14px;
  border: 3px solid var(--ember);
  border-radius: 50%;
  margin: 6px auto 26px;
}
#closing h2 em { font-style: normal; color: var(--ember); }
.closing-phone {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: var(--fs-h2);
  letter-spacing: 0.02em;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  margin: var(--space-5) 0 var(--space-8);
}
.closing-phone:hover { color: var(--ember); }
.closing-phone svg { width: 0.6em; height: 0.6em; }
#closing .cta-pair { justify-content: center; }
.safety-note {
  margin: var(--space-10) auto 0;
  max-width: 62ch;
  font-size: var(--fs-small);
  color: var(--ink-dim);
  border-top: 1px solid var(--ink-line);
  padding-top: var(--space-5);
}
.safety-note a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.safety-note a:hover { color: var(--ember); }

/* ══════════════ Responsive ══════════════ */
@media (max-width: 1023px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-rail { display: none; }
  .see-grid { grid-template-columns: 1fr; gap: var(--space-10); }
  .areas-grid { grid-template-columns: 1fr; gap: var(--space-8); }
  .season-grid { grid-template-columns: 1fr 1fr; }
  .zone { grid-template-columns: 84px 1fr; grid-template-rows: auto auto; }
  .zone-links { grid-column: 1 / -1; }
  .zone .btn { grid-column: 1 / -1; justify-self: start; white-space: normal; }
}

@media (max-width: 900px) {
  .hero-media .hv-desk { display: none; }
  .hero-media .hv-mob { display: block; }
  .hero-title { font-size: clamp(2.2rem, 12vw, 4.6rem); white-space: normal; }

  .s2-wrap { grid-template-columns: 1fr; }
  .s2-fig { position: static; height: auto; }
  .s2-fig svg { width: min(86vw, 430px); height: auto; margin: 0 auto; }
  .s2-steps { display: none; }
  .anat-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 26px var(--gutter) 8px;
    max-width: var(--container);
    margin: 0 auto;
  }
  .anat-tabs button {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ash-dim);
    border: 1px solid var(--line);
    padding: 10px 14px;
    min-height: 44px;
  }
  .anat-tabs button[aria-pressed="true"] {
    color: var(--coal-2);
    background: var(--amber);
    border-color: var(--amber);
  }
  .anat-panel {
    max-width: var(--container);
    margin: 0 auto;
    padding: 12px var(--gutter) 8px;
    color: var(--ash-dim);
    min-height: 96px;
  }
  .anat-panel h3 { color: var(--ash); font-size: 1.5rem; margin-bottom: 6px; }
  .anat-panel a { color: var(--amber); font-weight: var(--weight-semibold); }

  .board { min-height: 0; height: auto; display: grid; gap: 14px; }
  .shot { position: static; width: 100% !important; transform: none !important; }
  .callout { display: none; }
  .board-tag { position: static; display: block; margin-bottom: 10px; }
}

@media (min-width: 901px) {
  .anat-panel { display: none; }
}

@media (max-width: 640px) {
  .season-grid { grid-template-columns: 1fr; }
}

/* process grid collapse */
@media (max-width: 900px) {
  #process-grid { grid-template-columns: 1fr !important; }
}

/* ══════════════ Customer-first homepage (moved from funnel.css, 2026-09) ══════════════ */
[hidden] { display: none !important; }
body.home-funnel .hero-offer p { color: #514a40; }
body.home-funnel .hero-offer .offer-price { color: #1b1814; }
.home-funnel #hero { min-height: 650px; align-items: center; }
.home-funnel .hero-grid { padding: calc(var(--header-height) + var(--space-8)) var(--gutter) 72px; grid-template-columns: minmax(0, 1fr) 310px; gap: 64px; align-items: center; }
.home-funnel .hero-shade { background: linear-gradient(90deg, rgba(14,12,9,.96), rgba(14,12,9,.85) 48%, rgba(14,12,9,.35)); }
.home-funnel .hero-title { font-size: clamp(42px, 4.8vw, 70px); white-space: normal; max-width: 15ch; line-height: 1.03; }
.home-funnel .hero-title .accent { color: var(--amber); }
.home-funnel .hero-sub { max-width: 51ch; color: #eee9e1; }
.home-funnel .hero-note { color: #e2dace; }
.home-funnel .hero-ctas .btn { font-size: 16px; }
.hero-offer { padding: 28px; background: #f2eee6; color: #1b1814; border-top: 3px solid var(--ember); }
.hero-offer .offer-price { font: 400 64px/1 var(--font-display); margin: 16px 0; color: #1b1814; }
.hero-offer h2 { font: 600 20px/1.3 var(--font-body); text-transform: none; color: #1b1814; }
.hero-offer p, .hero-offer li { color: #514a40; font-size: 14px; }
.hero-offer ul { list-style: none; padding: 16px 0; margin: 16px 0; border-block: 1px solid #c8c0b3; }
.hero-offer li { margin: 9px 0; }
.hero-offer li::before { content: '\2713'; color: #2f6b4f; margin-right: 10px; }
.hero-offer a { color: #993509; font-weight: 600; text-decoration: underline; font-size: 15px; }
.hero-brandline { margin-top: 22px; font: 500 12px/1.5 var(--font-mono); color: #ddd2c2; letter-spacing: .08em; text-transform: uppercase; }
.home-funnel .hero-proof { margin-top: var(--space-5); }
.home-funnel .section-title { font-family: var(--font-body); font-weight: 600; text-transform: none; letter-spacing: -.035em; font-size: clamp(30px, 3.5vw, 46px); line-height: 1.15; }
.home-funnel .section-desc { max-width: 58ch; }
.home-funnel .band { padding-block: 80px; }
.intent-intro { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-bottom: 32px; }
.intent-intro .section-title { margin-bottom: 0; }
.intent-list { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #bfb9af; }
.intent-item { display: grid; grid-template-columns: 44px 1fr 24px; gap: 16px; padding: 28px 20px; border-bottom: 1px solid #bfb9af; }
.intent-item:nth-child(odd) { border-right: 1px solid #bfb9af; }
.intent-item .num { color: #9b360f; font: 500 13px/1.5 var(--font-mono); }
.intent-item .intent-link { color: #1b1814; text-decoration: none; }
.intent-item .intent-link strong { display: block; font-size: 21px; line-height: 1.3; margin-bottom: 8px; }
.intent-item .intent-link:hover strong { text-decoration: underline; }
.intent-item small { display: block; color: #5b554c; font-size: 15px; }
.intent-item .arrow { color: #9b360f; font-size: 24px; }
.intent-item .learn { display: inline-block; margin-top: 10px; font-size: 14px; color: #923208; text-decoration: underline; }
.intent-help { margin-top: 24px; font-size: 16px; color: #5b554c; }
.intent-help a { color: #923208; text-decoration: underline; font-weight: 600; }
/* process band with image */
.visit-layout { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.visit-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; margin-top: 36px; }
.visit-layout .visit-three { grid-template-columns: 1fr; gap: 22px; margin-top: 28px; }
.visit-three article { border-top: 2px solid #bfb9af; padding-top: 22px; }
.visit-three .num { font: 500 13px var(--font-mono); color: #923208; }
.visit-three h3 { font: 600 22px/1.3 var(--font-body); text-transform: none; margin: 16px 0 12px; }
.visit-three p { color: #5b554c; }
.visit-layout figure, .report-figs figure, .areas-layout figure, .seasonal-layout figure { margin: 0; }
.visit-layout img, .areas-layout img, .seasonal-layout img { width: 100%; height: auto; display: block; }
.fig-caption { padding: 10px 0 0; font: 500 12px/1.5 var(--font-mono); color: #5b554c; letter-spacing: .04em; text-transform: uppercase; }
/* report format section (dark) */
.report-layout { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; }
.report-copy p { color: #d8d1c6; }
.report-copy .section-title { color: #f2eee6; margin-top: 18px; }
.report-format { background: #f2eee6; color: #1b1814; padding: 24px; margin-top: 22px; border-top: 3px solid var(--ember); }
.report-format .k { font: 500 12px/1.5 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: #923208; }
.report-format dl { display: grid; grid-template-columns: 100px 1fr; gap: 12px; font-size: 14px; margin-top: 16px; }
.report-format dt { font-weight: 600; }
.report-format dd { margin: 0; color: #514a40; }
.report-figs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.report-figs img { display: block; width: 100%; height: 290px; object-fit: cover; }
.report-figs figcaption { padding: 10px 0; font: 500 12px/1.5 var(--font-mono); color: #dfd5c5; }
/* services as three cards with images */
.home-funnel .zones h3 { font-family: var(--font-body); text-transform: none; font-size: 24px; font-weight: 600; }
.home-funnel .zones h3 span { font-size: 14px; }
.home-funnel .zone .zone-img { margin: 0 0 18px; }
.home-funnel .zone .zone-img img { width: 100%; height: 200px; object-fit: cover; display: block; }
.home-funnel .zone .zone-desc { color: #5b554c; font-size: 15px; margin-bottom: 14px; }
/* service-area band with image */
.areas-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; align-items: start; }
.areas-layout > div { min-width: 0; }
.county-lines { margin-top: 24px; color: #5b554c; font-size: 14px; line-height: 1.6; }
.county-lines b { color: #1b1814; }
/* anatomy disclosure */
.home-funnel #anatomy { padding-block: 56px; }
.anatomy-disclosure > summary { cursor: pointer; list-style: none; padding-bottom: 18px; }
.anatomy-disclosure > summary::after { content: 'Explore the chimney'; display: inline-block; margin-top: 18px; margin-left: var(--gutter); color: #e8a857; text-decoration: underline; }
.anatomy-disclosure[open] > summary::after { content: 'Close diagram'; }
/* seasonal with image */
.home-funnel #seasonal { padding-block: 40px; }
.home-funnel #seasonal .section-title { font-size: 28px; }
.home-funnel .season h3 { font-family: var(--font-body); text-transform: none; font-size: 18px; }
.seasonal-layout { display: grid; grid-template-columns: 1fr 320px; gap: 40px; align-items: center; }
.home-funnel .area-group h3 { font-family: var(--font-body); text-transform: none; font-weight: 600; font-size: 20px; }
.home-funnel #closing .section-title { max-width: 20ch; margin-inline: auto; }
.home-funnel .band-sky .btn-outline, .home-funnel .band-sky-2 .btn-outline { color: #1b1814; border-color: #817a70; }
@media (max-width: 1023px) {
  .home-funnel .hero-grid { grid-template-columns: 1fr 280px; gap: 28px; }
  .home-funnel .hero-title { font-size: 48px; }
  .report-layout, .visit-layout, .areas-layout, .seasonal-layout { gap: 32px; }
  .areas-layout { grid-template-columns: 1fr; }
  .areas-layout figure { max-width: 320px; }
}
@media (max-width: 1199px) and (min-width: 1024px) {
  .areas-layout { grid-template-columns: 1fr; }
  .areas-layout figure { max-width: 320px; }
}
@media (max-width: 767px) {
  .home-funnel #hero { min-height: 0; }
  .home-funnel .hero-grid { grid-template-columns: 1fr; padding: calc(var(--header-height) + var(--space-6)) var(--gutter) 40px; }
  .home-funnel .hero-title { font-size: clamp(40px, 10vw, 58px); max-width: 16ch; }
  .home-funnel .hero-shade { background: linear-gradient(90deg, rgba(14,12,9,.94), rgba(14,12,9,.73)); }
  .hero-offer { padding: 22px; }
  .hero-offer .offer-price { font-size: 48px; }
  .hero-offer ul { margin: 12px 0; padding: 8px 0; }
  .home-funnel .hero-ctas { flex-direction: column; align-items: stretch; }
  .home-funnel .band { padding-block: 48px; }
  .intent-intro { display: block; }
  .intent-list, .report-layout, .visit-three, .visit-layout, .seasonal-layout { grid-template-columns: 1fr; }
  .intent-item { padding: 22px 0; grid-template-columns: 30px 1fr 20px; gap: 10px; }
  .intent-item:nth-child(odd) { border-right: 0; }
  .intent-item .intent-link strong { font-size: 19px; }
  .report-figs img { height: 210px; }
  .report-format { padding: 20px; }
  .visit-three { gap: 24px; }
}