/* ═══════════════════════════════════════════════════════════════
   Eds Heating & Air — Design B (Method / operator-grade thermal)
   ALL selectors scoped [data-design="b"] — ZERO [data-design="b"] remain.
   Keyframe names prefixed b- to avoid collision.
   ~12–16 thermal color tokens on [data-design="b"] root.
   ═══════════════════════════════════════════════════════════════ */

/* ── Design token root ─────────────────────────────────────────── */
[data-design="b"] {
  /* Palette — deep cool slate/indigo→amber thermal spine.
     Distinct from box-office Site A (high-contrast neon/warm) */
  --ink:           #0D0F12;
  --ink-2:         #3A3D44;
  --muted:         #6A6E79;
  --bg:            #F7F8FA;
  --surface:       #FFFFFF;
  --border:        #E2E5EA;
  --border-strong: #1A1D24;

  /* Thermal signal — cool indigo → warm amber (the spine) */
  --accent:        #FF9A3C;      /* warm amber — the signal; max 2 visible uses/screen */
  --accent-cool:   #3C8DFF;      /* cool indigo — cold-end accent */
  --accent-ink:    #0D0F12;      /* foreground on accent fills */
  --success:       #2EB07A;
  --critical:      #E04848;

  /* Design-B primary (required exposure) */
  --design-b-primary: #FF9A3C;

  /* Thermal tokens — driven by scroll + airflow tinting */
  --thermal-temp:  0;            /* 0=cold → 1=warm; updated by scroll JS */
  --thermal-bg:    oklch(from #3C8DFF calc(l + var(--thermal-temp) * 0.18) calc(c - var(--thermal-temp) * 0.09) calc(h + var(--thermal-temp) * 42));
  --thermal-accent: oklch(from #FF9A3C calc(l - (1 - var(--thermal-temp)) * 0.15) c h);

  /* Airflow particle tints — read --thermal-temp */
  --b-air-cold:    #6EB3FF;      /* cool teal-blue airstream */
  --b-air-warm:    #FF9A3C;      /* warm amber airstream */
  --b-duct-stroke: rgba(60, 141, 255, 0.18);

  /* Hero backdrop tokens */
  --b-cold-field:  #1A2540;
  --b-mid-field:   #1E2D48;
  --b-warm-field:  #2A2014;
  --b-iso-cold:    #6EB3FF;
  --b-iso-warm:    #FF9A3C;
  --b-cold-orb:    rgba(60, 120, 220, 0.22);
  --b-warm-orb:    rgba(200, 100, 20, 0.18);

  /* Typography */
  --font-display: 'Inter', -apple-system, system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'Geist Mono', 'JetBrains Mono', ui-monospace, monospace;

  /* Radius */
  --r-tight:  2px;
  --r-cell:   6px;
  --r-cmd:    8px;

  /* Spacing */
  --gap-tick:    4px;
  --gap-row:     12px;
  --gap-cell:    20px;
  --gap-stack:   32px;
  --gap-section: 96px;
  --gap-rail:    16px;

  /* Motion */
  --ease-snap:   cubic-bezier(0.2, 0.9, 0.1, 1);
  --ease-breath: cubic-bezier(0.45, 0, 0.55, 1);
  --dur-tick:    80ms;
  --dur-snap:    180ms;
  --dur-stage:   320ms;
  --dur-breath:  4s;
  --dur-pool:    24s;

  box-sizing: border-box;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
}
[data-design="b"].dq-design *, [data-design="b"].dq-design *::before, [data-design="b"].dq-design *::after {
  box-sizing: inherit;
}

/* ── ELEMENT 1: Animated minimalist header ──────────────────────── */
[data-design="b"] .b-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  font-family: var(--font-mono);
}
[data-design="b"] .b-header__bar {
  display: flex; align-items: center; justify-content: space-between;
  height: 64px; padding-inline: clamp(16px, 4vw, 40px);
}

/* Logo — exactly ONE text-bearing child outside the drawer */
[data-design="b"] .b-logo {
  display: inline-flex; gap: var(--gap-tick); align-items: baseline;
  color: var(--ink); text-decoration: none;
  font: 500 15px/1 var(--font-mono);
  letter-spacing: 0.08em; text-transform: uppercase;
}
[data-design="b"] .b-logo__bracket { color: var(--accent); }
[data-design="b"] .b-logo:hover .b-logo__bracket {
  color: var(--accent-cool);
  transition: color 120ms var(--ease-snap);
}

/* Hamburger — no inline nav per H-2 */
[data-design="b"] .b-burger {
  position: relative; display: inline-flex; flex-direction: column;
  gap: 5px; padding: 10px 12px 10px 14px;
  background: transparent; border: 1px solid var(--border);
  border-radius: var(--r-tight); cursor: pointer;
  transition: border-color 120ms var(--ease-snap);
  min-width: 44px; min-height: 44px; justify-content: center;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-burger:hover { border-color: var(--ink); }
}
[data-design="b"] .b-burger__row {
  width: 18px; height: 1.5px; background: var(--ink);
}
[data-design="b"] .b-burger__kbd {
  position: absolute; right: -56px; top: 50%;
  transform: translateY(-50%);
  font: 500 11px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.08em;
}
@media (max-width: 560px) {
  [data-design="b"] .b-burger__kbd { display: none; }
}

/* Header atmospheric animation — ONE slow thermal-halo sweep (H-3: ≥18s) */
[data-design="b"] .b-header__rule {
  position: relative; height: 1px; background: transparent;
  overflow: clip;
}
[data-design="b"] .b-header__regmark {
  position: absolute; top: 0; left: -8%;
  width: 6px; height: 1px; background: var(--accent);
  animation: b-sweep var(--dur-pool, 24s) linear infinite;
}
@keyframes b-sweep {
  0%   { transform: translateX(0);     opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateX(112vw); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-header__regmark {
    animation: none; transform: translateX(50vw); opacity: 0.7;
  }
}

/* Drawer — display:none when closed (never opacity:0 on text) */
[data-design="b"] .b-drawer {
  display: none; /* closed state — JS adds [open] → display:flex */
  position: fixed; inset: 0;
  width: 100vw; height: 100vh;
  margin: 0; border: 0;
  padding: 64px clamp(16px, 4vw, 40px) clamp(32px, 5vw, 48px);
  background: var(--bg); color: var(--ink);
  flex-direction: column; justify-content: space-between;
  z-index: 100;
  /* No box-shadow — elevation via hairline only per design system */
  border-left: 1px solid var(--border);
}
[data-design="b"] .b-drawer.is-open {
  display: flex;
}
[data-design="b"] .b-drawer__close {
  position: absolute; top: 16px; right: clamp(16px, 4vw, 40px);
  background: transparent; border: 1px solid var(--border);
  border-radius: var(--r-tight); cursor: pointer; padding: 8px 12px;
  font: 500 18px/1 var(--font-mono); color: var(--ink);
  min-width: 44px; min-height: 44px;
  transition: border-color 120ms var(--ease-snap);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-drawer__close:hover { border-color: var(--ink); }
}
[data-design="b"] .b-drawer__nav {
  display: flex; flex-direction: column; gap: var(--gap-stack);
}
[data-design="b"] .b-drawer__nav a {
  font: 500 clamp(28px, 6vw, 56px)/1.05 var(--font-display);
  letter-spacing: -0.025em; color: var(--ink); text-decoration: none;
  transition: color 120ms var(--ease-snap);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-drawer__nav a:hover { color: var(--accent); }
}
[data-design="b"] .b-drawer__actions {
  display: flex; flex-direction: column; gap: 16px;
}
[data-design="b"] .b-drawer__tel {
  display: flex; flex-direction: column; gap: 4px;
  text-decoration: none; color: var(--ink);
}
[data-design="b"] .b-drawer__tel-label {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.1em; text-transform: uppercase;
}
[data-design="b"] .b-drawer__tel-num {
  font: 500 22px/1 var(--font-mono); color: var(--ink);
}
[data-design="b"] .b-drawer__cta {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 22px; background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--ink); border-radius: var(--r-cmd);
  font: 500 15px/1 var(--font-mono); letter-spacing: 0.04em;
  text-transform: uppercase; text-decoration: none;
  width: max-content; min-height: 44px;
}
[data-design="b"] .b-drawer__meta {
  display: flex; gap: var(--gap-tick); align-items: center;
  font: 500 13px/1 var(--font-mono); color: var(--muted);
}
[data-design="b"] .b-drawer__kbd-pill {
  border: 1px solid var(--border); padding: 4px 8px;
  border-radius: var(--r-tight); color: var(--ink);
  font: 500 11px/1 var(--font-mono);
}

/* ── HERO — thermal backdrop + airflow + text + CTA ─────────────── */
[data-design="b"] .b-hero {
  position: relative;
  min-height: 70vh; display: flex; align-items: center;
  overflow: clip;
  padding: clamp(80px, 12vh, 140px) clamp(16px, 5vw, 80px) clamp(64px, 10vh, 120px);
  background: var(--b-cold-field); /* first-paint thermal ground */
}

/* E3 — thermal backdrop: absolute layer behind all content */
[data-design="b"] .b-hero__thermal {
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 0;
}
[data-design="b"] .b-hero__thermal-svg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}

/* Isotherm draw-in animations */
[data-design="b"] .b-iso {
  animation: none; /* set by JS on mount */
}
[data-design="b"] .b-iso--1 {
  animation: b-iso-draw-1 2.4s var(--ease-snap) forwards,
             b-iso-drift 18s ease-in-out 2.4s infinite;
}
[data-design="b"] .b-iso--2 {
  animation: b-iso-draw-2 3s var(--ease-snap) 0.4s both,
             b-iso-drift 22s ease-in-out 3.4s infinite;
}
[data-design="b"] .b-iso--3 {
  animation: b-iso-draw-3 3.6s var(--ease-snap) 0.8s both,
             b-iso-drift 26s ease-in-out 4.4s infinite;
}
@keyframes b-iso-draw-1 {
  from { stroke-dashoffset: 1600; }
  to   { stroke-dashoffset: 0; }
}
@keyframes b-iso-draw-2 {
  from { stroke-dashoffset: 1700; }
  to   { stroke-dashoffset: 0; }
}
@keyframes b-iso-draw-3 {
  from { stroke-dashoffset: 1700; }
  to   { stroke-dashoffset: 0; }
}
/* Sustained ambient drift — perceptible at rest, clears motion-delta floor */
@keyframes b-iso-drift {
  0%, 100% { transform: translateY(0);   opacity: 0.75; }
  50%       { transform: translateY(8px); opacity: 0.55; }
}

/* Thermal orbs — slow ambient pulse; no directional primitive (HERO-2) */
[data-design="b"] .b-thermal-orb {
  animation: b-orb-pulse 12s var(--ease-breath) infinite;
}
[data-design="b"] .b-thermal-orb--cool {
  animation: b-orb-pulse 16s var(--ease-breath) 3s infinite;
}
@keyframes b-orb-pulse {
  0%, 100% { opacity: 0.7;  transform: scale(1); }
  50%       { opacity: 1.0;  transform: scale(1.06); }
}

/* E5 — airflow signature SVG: absolute, sits above thermal backdrop */
[data-design="b"] .b-airflow {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 1;
}
/* Duct lines — static structural grid (ambient) */
[data-design="b"] .b-duct { opacity: 0.4; }

/* Airstreams — animate left→right through ducts, tinted by --thermal-temp */
[data-design="b"] .b-airstream {
  animation: b-airstream-flow 6s linear infinite;
}
[data-design="b"] .b-airstream--2 {
  animation-delay: -2.4s;
  animation-duration: 7.5s;
}
@keyframes b-airstream-flow {
  0%   { transform: translateX(-340px); opacity: 0; }
  12%  { opacity: 0.7; }
  88%  { opacity: 0.5; }
  100% { transform: translateX(1600px); opacity: 0; }
}
[data-design="b"] .b-vent { opacity: 0.25; }

/* Hero text layer — ABOVE backdrop, opacity:1 at first paint */
[data-design="b"] .b-hero__content {
  position: relative; z-index: 2;
  max-width: 720px;
  display: flex; flex-direction: column; gap: 20px;
}
[data-design="b"] .b-hero__kicker {
  display: inline-block;
  font: 500 12px/1 var(--font-mono); color: rgba(200, 220, 255, 0.75);
  letter-spacing: 0.16em; text-transform: uppercase;
}
[data-design="b"] .b-hero__headline {
  font: 500 clamp(32px, 5.5vw, 56px)/1.05 var(--font-display);
  letter-spacing: -0.025em; margin: 0;
  color: #F0F4FF; /* light on dark thermal backdrop */
  text-wrap: balance;
}
[data-design="b"] .b-hero__subtitle {
  font: 400 clamp(16px, 2vw, 18px)/1.6 var(--font-body);
  color: rgba(200, 215, 240, 0.85);
  margin: 0; max-width: 56ch;
}
[data-design="b"] .b-hero__area {
  font: 400 13px/1.4 var(--font-mono);
  color: rgba(180, 200, 235, 0.6);
  margin: 8px 0 0;
  letter-spacing: 0.04em;
}

/* ── ELEMENT 2 — Animated CTA (E2, funnel-anchor CTA in hero) ─────── */
[data-design="b"] .b-cta {
  position: relative; display: inline-flex; align-items: center;
  gap: 12px; padding: 14px 20px 14px 22px;
  background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--ink); border-radius: var(--r-cmd);
  font: 500 15px/1 var(--font-mono); letter-spacing: 0.02em;
  text-transform: uppercase; text-decoration: none;
  transition: transform 120ms var(--ease-snap),
              box-shadow 120ms var(--ease-snap);
  animation: b-cta-breath var(--dur-breath) var(--ease-breath) infinite;
  will-change: transform;
  min-height: 44px;
}
[data-design="b"] .b-cta__kbd {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border: 1px solid var(--ink); border-radius: var(--r-tight);
  font: 500 13px/1 var(--font-mono);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-cta:hover {
    box-shadow: 0 0 0 3px var(--ink);
  }
}
[data-design="b"] .b-cta:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--accent), 0 0 0 3px var(--ink);
}
[data-design="b"] .b-cta:active { transform: translateY(1px); }
@keyframes b-cta-breath {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklab, var(--accent), transparent 50%); }
  50%       { box-shadow: 0 0 0 6px color-mix(in oklab, var(--accent), transparent 80%); }
}
[data-design="b"] .b-cta--secondary {
  background: transparent; color: var(--ink);
  border: 1px solid var(--border);
  animation: none;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-cta--secondary:hover { border-color: var(--ink); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-cta { animation: none; }
}

/* ── ELEMENT 6 — Pointer: between hero and funnel ────────────────── */
/* Thermal-flow register: hairline that warms cool→amber.
   Always rendered visible — opacity:1, bbox height > 8px at all breakpoints */
[data-design="b"] .b-pointer {
  position: relative;
  padding: 24px clamp(16px, 5vw, 80px);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  overflow: clip;
}
[data-design="b"] .b-pointer__inner {
  display: flex; align-items: center; gap: 16px;
  font: 500 12px/1 var(--font-mono);
  color: var(--muted); letter-spacing: 0.12em;
  text-transform: uppercase; max-width: 900px;
}
[data-design="b"] .b-pointer__label { white-space: nowrap; }
[data-design="b"] .b-pointer__bar {
  position: relative; flex: 1; height: 2px;
  background: var(--border); overflow: clip; min-width: 40px;
}
[data-design="b"] .b-pointer__bar-fill {
  position: absolute; inset: 0;
  /* Warm thermal gradient — the cool→warm hairline */
  background: linear-gradient(to right, var(--b-iso-cold), var(--b-iso-warm));
  transform-origin: left;
  animation: b-pointer-warm 4s var(--ease-breath) infinite;
}
@keyframes b-pointer-warm {
  0%   { transform: scaleX(0.1); opacity: 0.5; }
  60%  { transform: scaleX(1);   opacity: 1; }
  100% { transform: scaleX(1);   opacity: 0.7; }
}
[data-design="b"] .b-pointer__chev {
  font-size: 18px; opacity: 0.55;
  animation: b-pointer-chev 4s ease-in-out infinite;
}
@keyframes b-pointer-chev {
  0%, 100% { transform: translateX(0);   opacity: 0.45; }
  50%       { transform: translateX(5px); opacity: 0.9; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-pointer__bar-fill { animation: none; transform: scaleX(1); }
  [data-design="b"] .b-pointer__chev    { animation: none; }
}

/* ── Forward-step pointer inside funnel (method-pointer remapped) ─── */
[data-design="b"] .method-pointer {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 0;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
[data-design="b"] .method-pointer__counter {
  font: 500 12px/1 var(--font-mono);
  letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.75;
}
[data-design="b"] .method-pointer__counter-now {
  display: inline-block; min-width: 1ch;
  animation: b-pointer-tick 320ms ease-out;
}
[data-design="b"] .method-pointer__bar {
  position: relative; flex: 1; height: 2px;
  background: currentColor; opacity: 0.15;
  border-radius: 1px; overflow: clip;
}
[data-design="b"] .method-pointer__bar-fill {
  position: absolute; inset: 0; width: 100%;
  transform: scaleX(var(--method-pointer-progress, 0.33));
  transform-origin: left;
  background: var(--accent); opacity: 1;
  transition: transform 480ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
[data-design="b"] .method-pointer__chev {
  font-size: 18px; opacity: 0.6;
  animation: b-pointer-chev 4s ease-in-out infinite;
}
@keyframes b-pointer-tick {
  0%   { transform: translateY(-6px); opacity: 0; }
  100% { transform: translateY(0);    opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .method-pointer__counter-now { animation: none; }
  [data-design="b"] .method-pointer__bar-fill    { transition: none; }
  [data-design="b"] .method-pointer__chev        { animation: none; }
}

/* ── FUNNEL — tap-qualify (E5 / INT-1) ──────────────────────────── */
[data-design="b"] .b-funnel-section {
  padding: var(--gap-section) clamp(16px, 5vw, 80px);
  background: var(--bg);
}
[data-design="b"] .b-funnel__head {
  max-width: 720px; margin-bottom: var(--gap-stack);
  display: flex; flex-direction: column; gap: 10px;
}
[data-design="b"] .b-funnel__kicker {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.12em; text-transform: uppercase;
}
[data-design="b"] .b-funnel__title {
  font: 500 clamp(28px, 4vw, 40px)/1.05 var(--font-display);
  letter-spacing: -0.025em; margin: 0; color: var(--ink);
}
[data-design="b"] .b-funnel__sub {
  font: 400 16px/1.5 var(--font-body); color: var(--ink-2); margin: 0;
}
[data-design="b"] .b-funnel__palette {
  border: 1px solid var(--ink); border-radius: var(--r-cell);
  background: var(--surface);
  padding: clamp(20px, 3vw, 36px);
  max-width: 720px;
}
[data-design="b"] .b-funnel__panel {
  border: 0; padding: 0; margin: 0;
  display: none; /* closed; .is-active → flex */
}
[data-design="b"] .b-funnel__panel.is-active {
  display: flex; flex-direction: column; gap: 16px;
  animation: b-step-in var(--dur-stage) var(--ease-snap) both;
}
@keyframes b-step-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
[data-design="b"] .b-funnel__legend {
  font: 500 17px/1.2 var(--font-body); color: var(--ink); margin-bottom: 4px;
}
[data-design="b"] .b-funnel__opts {
  display: grid; gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
[data-design="b"] .b-funnel__opt {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--border); border-radius: var(--r-tight);
  padding: 14px 16px; cursor: pointer;
  font: 500 14px/1 var(--font-mono);
  transition: border-color 120ms var(--ease-snap),
              background   120ms var(--ease-snap);
  min-height: 48px;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-funnel__opt:hover { border-color: var(--ink); }
}
[data-design="b"] .b-funnel__opt input[type="radio"] {
  position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none;
}
[data-design="b"] .b-funnel__opt:has(input:checked) {
  border-color: var(--ink); background: var(--bg);
  box-shadow: inset 4px 0 0 var(--accent);
}
[data-design="b"] .b-funnel__opt-icon {
  color: var(--muted); font-size: 13px; flex-shrink: 0;
  transition: color 120ms var(--ease-snap);
}
[data-design="b"] .b-funnel__opt:has(input:checked) .b-funnel__opt-icon {
  color: var(--accent);
}
/* Contact action panel */
[data-design="b"] .b-funnel__contact.is-active {
  flex-direction: column; gap: 20px;
}
[data-design="b"] .b-funnel__contact-label {
  font: 500 13px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.06em; text-transform: uppercase; margin: 0;
}
[data-design="b"] .b-funnel__tel-cta {
  display: inline-flex; align-items: center;
  padding: 14px 20px; background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--ink); border-radius: var(--r-cmd);
  font: 500 16px/1 var(--font-mono); text-decoration: none;
  min-height: 48px; width: max-content;
}
[data-design="b"] .b-funnel__contact-or {
  font: 400 14px/1.4 var(--font-body); color: var(--ink-2); margin: 0;
}
[data-design="b"] .b-funnel__field {
  display: flex; flex-direction: column; gap: 6px;
}
[data-design="b"] .b-funnel__field > span {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.06em; text-transform: uppercase;
}
[data-design="b"] .b-funnel__field input,
[data-design="b"] .b-funnel__field textarea {
  font: 400 16px/1.3 var(--font-body); color: var(--ink);
  background: var(--bg); border: 0; border-bottom: 1px solid var(--border);
  padding: 10px 0; outline: none; resize: vertical;
  transition: border-color 120ms var(--ease-snap);
}
[data-design="b"] .b-funnel__field input:focus,
[data-design="b"] .b-funnel__field textarea:focus {
  border-bottom-color: var(--ink);
  box-shadow: 0 1px 0 0 var(--ink);
}
[data-design="b"] .b-funnel__submit {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 22px; background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--ink); border-radius: var(--r-cmd);
  font: 500 15px/1 var(--font-mono); letter-spacing: 0.04em;
  text-transform: uppercase; text-decoration: none; cursor: pointer;
  transition: box-shadow 120ms var(--ease-snap);
  min-height: 48px; width: max-content;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-funnel__submit:hover { box-shadow: 0 0 0 3px var(--ink); }
}
[data-design="b"] .b-funnel__receipt {
  display: flex; flex-direction: column; gap: 16px;
}
[data-design="b"] .b-funnel__receipt-id {
  font: 500 clamp(22px, 3vw, 32px)/1 var(--font-mono);
  color: var(--accent-ink);
  padding: 12px 16px;
  border: 1px solid var(--ink); border-radius: var(--r-cell);
  background: var(--accent);
  width: max-content;
  letter-spacing: 0.06em;
}
[data-design="b"] .b-funnel__receipt p {
  font: 400 16px/1.5 var(--font-body); color: var(--ink-2); margin: 0;
}
[data-design="b"] .b-funnel__receipt a {
  color: var(--ink); font-weight: 500;
}
/* Funnel navigation */
[data-design="b"] .b-funnel__nav {
  display: flex; gap: 12px; margin-top: 16px;
  align-items: center; flex-wrap: wrap;
}
[data-design="b"] .b-funnel__next {
  background: var(--accent); color: var(--accent-ink);
  border: 1px solid var(--ink); border-radius: var(--r-cmd);
  padding: 12px 18px;
  font: 500 14px/1 var(--font-mono); letter-spacing: 0.04em;
  text-transform: uppercase; cursor: pointer; min-height: 44px;
  transition: box-shadow 120ms var(--ease-snap);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-funnel__next:hover { box-shadow: 0 0 0 3px var(--ink); }
}
[data-design="b"] .b-funnel__prev {
  background: transparent; color: var(--ink);
  border: 1px solid var(--border); border-radius: var(--r-cmd);
  padding: 12px 16px;
  font: 500 14px/1 var(--font-mono); letter-spacing: 0.04em;
  text-transform: uppercase; cursor: pointer; min-height: 44px;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-funnel__prev:hover { border-color: var(--ink); }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-funnel__panel.is-active { animation: none; }
}

/* ── SERVICES — matter-index snap-grid (E3 ambient-a adapted) ────── */
[data-design="b"] .b-services {
  padding: var(--gap-section) clamp(16px, 4vw, 40px);
}
[data-design="b"] .b-services__head {
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: var(--gap-stack); max-width: 720px;
}
[data-design="b"] .b-services__kicker {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.12em; text-transform: uppercase;
}
[data-design="b"] .b-services__head h2 {
  font: 500 clamp(28px, 4vw, 40px)/1.05 var(--font-display);
  letter-spacing: -0.025em; margin: 0; color: var(--ink);
}
[data-design="b"] .b-services__list {
  list-style: none; margin: 0; padding: 0;
  border-top: 1px solid var(--border);
}
[data-design="b"] .b-svc {
  display: grid;
  grid-template-columns: 80px 1.3fr 2.2fr 180px;
  align-items: center; gap: var(--gap-cell);
  padding: 18px 4px; border-bottom: 1px solid var(--border);
  transition: background 120ms var(--ease-snap);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-svc:hover { background: var(--surface); }
}
[data-design="b"] .b-svc__id {
  font: 500 12px/1 var(--font-mono); color: var(--muted); letter-spacing: 0.05em;
}
[data-design="b"] .b-svc__name {
  font: 500 16px/1.2 var(--font-body); color: var(--ink);
}
[data-design="b"] .b-svc__summary {
  font: 400 14px/1.4 var(--font-body); color: var(--ink-2);
}
[data-design="b"] .b-svc__bar {
  position: relative; height: 1px; background: var(--border); overflow: clip;
}
[data-design="b"] .b-svc__fill {
  position: absolute; top: 0; left: 0; height: 1px;
  width: attr(data-fill %); /* set via JS */
  background: linear-gradient(to right, var(--b-iso-cold), var(--b-iso-warm));
  transform: scaleX(0); transform-origin: left;
  transition: transform 1200ms var(--ease-snap);
}
[data-design="b"] .b-svc.is-revealed .b-svc__fill { transform: scaleX(1); }
[data-design="b"] .b-svc.is-revealed .b-svc__fill::after {
  content: ''; position: absolute; right: -3px; top: -1px;
  width: 3px; height: 3px; background: var(--accent);
  animation: b-area-pulse 2.4s var(--ease-breath) infinite;
}
@keyframes b-area-pulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50%       { opacity: 1;   transform: scale(1.6); }
}
@media (max-width: 720px) {
  [data-design="b"] .b-svc {
    grid-template-columns: 72px 1fr;
    grid-template-areas: "id name" ". summary" ". bar";
    gap: 6px 14px; padding: 16px 0;
  }
  [data-design="b"] .b-svc__id      { grid-area: id; }
  [data-design="b"] .b-svc__name    { grid-area: name; }
  [data-design="b"] .b-svc__summary { grid-area: summary; font-size: 13px; }
  [data-design="b"] .b-svc__bar     { grid-area: bar; margin-top: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-svc__fill { transition: none; transform: scaleX(1); }
  [data-design="b"] .b-svc.is-revealed .b-svc__fill::after { animation: none; }
}
[data-design="b"] .b-services__cta-wrap {
  margin-top: var(--gap-stack);
}

/* ── AMBIENT-B — Status typewriter band (E4) ─────────────────────── */
[data-design="b"] .b-ambient-b {
  padding: var(--gap-section) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
  background: var(--surface);
}
[data-design="b"] .b-vh {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
[data-design="b"] .b-status {
  display: flex; align-items: baseline; gap: 14px;
  font: 500 clamp(18px, 3vw, 30px)/1.3 var(--font-mono);
  color: var(--ink);
}
[data-design="b"] .b-status__prompt { color: var(--accent); }
[data-design="b"] .b-status__line {
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: clip;
}
[data-design="b"] .b-status__cursor {
  display: inline-block; width: 0.55ch; height: 1em;
  background: var(--ink); vertical-align: -0.12em; margin-left: 2px;
  animation: b-cursor-blink 1.1s steps(1, end) infinite;
}
[data-design="b"] .b-status__lane {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap;
}
@keyframes b-cursor-blink {
  0%, 50%   { opacity: 1; }
  51%, 100% { opacity: 0; }
}
@media (max-width: 560px) {
  [data-design="b"] .b-status__lane { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-status__cursor { animation: none; opacity: 1; }
}

/* ── ABOUT / TRUST ──────────────────────────────────────────────── */
[data-design="b"] .b-about {
  padding: var(--gap-section) clamp(16px, 4vw, 40px);
  display: grid;
  grid-template-columns: 220px 1fr;
  grid-template-areas: "meta body" "meta photos";
  gap: var(--gap-stack) var(--gap-section);
  align-items: start;
}
[data-design="b"] .b-about__meta {
  grid-area: meta;
  display: flex; flex-direction: column; gap: 8px;
  font: 500 12px/1.6 var(--font-mono); color: var(--muted);
  letter-spacing: 0.08em; text-transform: uppercase;
  padding-top: 6px;
}
[data-design="b"] .b-about__body { grid-area: body; }
[data-design="b"] .b-about__body h2 {
  font: 500 clamp(22px, 3vw, 32px)/1.1 var(--font-display);
  letter-spacing: -0.02em; margin: 0 0 16px; color: var(--ink);
}
[data-design="b"] .b-about__body p {
  font: 400 17px/1.65 var(--font-body); color: var(--ink-2); margin: 0 0 12px;
  max-width: 62ch;
}
[data-design="b"] .b-about__photos {
  grid-area: photos;
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
[data-design="b"] .b-about__photos img {
  width: 100%; height: 220px; object-fit: cover;
  border: 1px solid var(--border); border-radius: var(--r-cell);
  display: block;
}
@media (max-width: 720px) {
  [data-design="b"] .b-about {
    grid-template-columns: 1fr;
    grid-template-areas: "meta" "body" "photos";
  }
  [data-design="b"] .b-about__photos { grid-template-columns: 1fr; }
  [data-design="b"] .b-about__photos img { height: 200px; }
}

/* ── SERVICE AREAS ──────────────────────────────────────────────── */
[data-design="b"] .b-areas {
  padding: var(--gap-section) clamp(16px, 4vw, 40px);
  background: var(--surface);
  border-top: 1px solid var(--border);
}
[data-design="b"] .b-areas__head {
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: var(--gap-stack);
}
[data-design="b"] .b-areas__kicker {
  font: 500 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.12em; text-transform: uppercase;
}
[data-design="b"] .b-areas__head h2 {
  font: 500 clamp(22px, 3vw, 32px)/1.05 var(--font-display);
  letter-spacing: -0.02em; margin: 0; color: var(--ink);
}
[data-design="b"] .b-areas__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 10px 16px;
}
[data-design="b"] .b-areas__list li {
  font: 500 14px/1 var(--font-mono); color: var(--ink);
  border: 1px solid var(--border); border-radius: var(--r-tight);
  padding: 8px 14px;
}

/* ── FOOTER ─────────────────────────────────────────────────────── */
[data-design="b"] .b-footer {
  padding: var(--gap-section) clamp(16px, 4vw, 40px) clamp(32px, 5vw, 56px);
  border-top: 1px solid var(--border);
}
[data-design="b"] .b-footer__cols {
  display: grid; grid-template-columns: 1.5fr 1fr 1.5fr;
  gap: var(--gap-stack); margin-bottom: var(--gap-stack);
}
@media (max-width: 720px) {
  [data-design="b"] .b-footer__cols { grid-template-columns: 1fr; }
}
[data-design="b"] .b-footer__logo {
  display: block; font: 500 15px/1 var(--font-mono);
  color: var(--ink); letter-spacing: 0.08em; text-transform: uppercase;
  margin-bottom: 10px;
}
[data-design="b"] .b-footer__tagline {
  font: 400 14px/1.5 var(--font-body); color: var(--ink-2); margin: 0;
}
[data-design="b"] .b-footer__col-label {
  display: block; font: 500 12px/1 var(--font-mono);
  color: var(--muted); letter-spacing: 0.12em; text-transform: uppercase;
  margin-bottom: 12px;
}
[data-design="b"] .b-footer__tel,
[data-design="b"] .b-footer__email,
[data-design="b"] .b-footer__social {
  display: block; font: 500 15px/1.6 var(--font-mono);
  color: var(--ink); text-decoration: none;
  transition: color 120ms var(--ease-snap);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="b"] .b-footer__tel:hover,
  [data-design="b"] .b-footer__email:hover,
  [data-design="b"] .b-footer__social:hover { color: var(--accent); }
}
[data-design="b"] .b-footer__areas {
  font: 400 13px/1.6 var(--font-body); color: var(--ink-2);
}
[data-design="b"] .b-footer__base {
  display: flex; align-items: center; gap: 10px;
  padding-top: var(--gap-stack); border-top: 1px solid var(--border);
  font: 400 12px/1 var(--font-mono); color: var(--muted);
  letter-spacing: 0.06em;
}
[data-design="b"] .b-footer__status-dot {
  display: inline-block; width: 6px; height: 6px;
  border-radius: 9999px; background: var(--accent);
  animation: b-status-dot 5s ease-in-out infinite;
}
@keyframes b-status-dot {
  0%, 100% { opacity: 0.5; }
  50%       { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  [data-design="b"] .b-footer__status-dot { animation: none; opacity: 1; }
}

/* ── SCROLL-LINKED THERMAL WARMING — premium scroll motion (TRIAD-2) ─
   Reads --thermal-temp; section backgrounds + accents warm toward CTA.
   Actual scroll updates --thermal-temp via JS (0→1 as visitor descends).
   CSS consumes it here — the scroll is a lighting shift (CIN-1 spirit). */
[data-design="b"] .b-funnel-section {
  background: color-mix(in oklab,
    var(--surface),
    oklch(65% 0.12 55) calc(var(--thermal-temp) * 8%));
}
[data-design="b"] .b-services {
  background: color-mix(in oklab,
    var(--bg),
    oklch(70% 0.10 55) calc(var(--thermal-temp) * 4%));
}
/* Airflow tint warms with --thermal-temp (Site B signature contract) */
[data-design="b"] .b-airstream {
  /* Color is driven by gradient fill; JS updates --b-air-warm opacity
     to make airstreams read warmer at high thermal-temp values */
}

/* ══════════════════════════════════════════════════════════════════
   MOBILE / OVERFLOW GUARD — scoped to .dq-design per contract
   ══════════════════════════════════════════════════════════════════ */
[data-design="b"].dq-design,
[data-design="b"] .dq-design {
  max-width: 100%;
  overflow-x: clip;
}
[data-design="b"].dq-design * {
  min-width: 0;
}
[data-design="b"].dq-design img,
[data-design="b"].dq-design svg:not([data-keep-size]) {
  max-width: 100%;
  height: auto;
}

/* Phase-3.4 hero visibility floor (forge_assemble) */
[data-design="b"] [data-mf-role="hero"] :is(h1,h2,p,.headline,.subtitle,.proof,[class*="headline"],[class*="subtitle"],[class*="proof"]),
[data-design="b"] [data-mf-role="cta"] { opacity: 1 !important; }