/* Portland HVAC Pros · design-a · Conductor remapped → [data-design="a"].dq-design
   All selectors scoped to [data-design="a"]. Zero [data-design="a"] selectors.
   Keyframes prefixed a-* to avoid collision.
   ~12–16 thermal color tokens. */

/* ═══════════════════════════════════════════════════
   DESIGN TOKENS — scoped to the design-a root
   --design-a-primary exposed on the [data-design="a"].dq-design block
═══════════════════════════════════════════════════ */
[data-design="a"] {
  /* Thermal spine — cool→warm, 0=cold/1=warm, driven by dial+scroll */
  --thermal-temp: 0.15;
  --thermal-bg:   color-mix(in oklab,
                    hsl(195 48% 18%) calc(100% - var(--thermal-temp) * 100%),
                    hsl(28  52% 22%) calc(var(--thermal-temp) * 100%));
  --thermal-accent: color-mix(in oklab,
                    hsl(195 62% 44%) calc(100% - var(--thermal-temp) * 100%),
                    hsl(32  68% 52%) calc(var(--thermal-temp) * 100%));

  /* Conductor palette — remapped */
  --panel-bg:      #0E1116;
  --panel-bg-2:    #151A22;
  --panel-bg-3:    #1D2430;
  --graphite:      #2A3340;
  --ink-primary:   #F2EFE8;
  --ink-secondary: #9AA3B2;
  --ink-tertiary:  #5B6573;
  --copper:        #C46A2C;
  --copper-glow:   #E0903F;
  --phosphor:      #4FE3A1;
  --hot:           #E63946;
  --wire-black:    #1A1F27;
  --wire-red:      #E63946;
  --wire-blue:     #5C9EE6;
  --wire-white:    #E8E5DC;
  --wire-green:    #4FE3A1;

  /* Thermal mapped aliases */
  --cool-tone:  hsl(195 62% 44%);
  --warm-tone:  #E0903F;

  /* --design-a-primary (required exposed token) */
  --design-a-primary: var(--copper);

  /* Typography */
  --font-display:  "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;
  --font-headline: "Inter", -apple-system, system-ui, sans-serif;
  --font-body:     "Inter", -apple-system, system-ui, sans-serif;

  /* Spacing */
  --gap-trace:   4px;
  --gap-knock:   8px;
  --gap-conduit: 16px;
  --gap-circuit: 24px;
  --gap-bus:     40px;
  --gap-service: 80px;
  --gap-main:    96px;

  /* Motion */
  --dur-tick:     120ms;
  --dur-energize: 240ms;
  --dur-trace:    600ms;
  --dur-sweep:    2400ms;
  --dur-cycle-a:  18000ms;
  --dur-cycle-b:  14000ms;
  --dur-cycle-c:  11000ms;
  --ease-energize: cubic-bezier(.2,0,0,1);
  --ease-trace:    cubic-bezier(.4,0,.2,1);
  --ease-relay:    cubic-bezier(.3,1.4,.5,1);
  --ease-hum:      cubic-bezier(.45,.05,.55,.95);

  /* Radius */
  --r-flush:    0px;
  --r-junction: 2px;
  --r-drum:     6px;
  --r-cap:      999px;

  /* Elevation */
  --elev-edge:     inset 0 0 0 1px var(--graphite);
  --elev-lift:     0 1px 0 var(--graphite), 0 8px 22px -12px rgba(0,0,0,.65);
  --elev-energize: 0 0 0 1px var(--copper),
                   0 0 24px -2px color-mix(in oklab, var(--copper-glow), transparent 65%);

  /* Base */
  background: var(--panel-bg);
  color: var(--ink-primary);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* ═══════════════════════════════════════════════════
   E1 — ANIMATED MINIMALIST HEADER (H-1/2/3)
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-header {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in oklab, var(--panel-bg), transparent 8%);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--graphite);
}
[data-design="a"] .rf-header__bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--gap-conduit) clamp(16px, 4vw, 40px);
  min-height: 64px;
}
[data-design="a"] .rf-logo {
  display: inline-flex; align-items: baseline; gap: var(--gap-knock);
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(13px, 2vw, 15px); letter-spacing: -0.005em;
  color: var(--ink-primary); text-decoration: none;
  white-space: nowrap;
}
/* Busbar sweep — thermal teal→copper toned (H-3: ≥18s) */
[data-design="a"] .rf-busbar {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  overflow: hidden; pointer-events: none;
}
[data-design="a"] .rf-busbar__rule {
  position: absolute; inset: 0; background: var(--graphite);
}
[data-design="a"] .rf-busbar__current {
  position: absolute; top: 0; height: 1px; width: 22%;
  background: linear-gradient(90deg,
    transparent 0%,
    color-mix(in oklab, var(--thermal-accent), transparent 55%) 30%,
    var(--thermal-accent) 50%,
    color-mix(in oklab, var(--thermal-accent), transparent 55%) 70%,
    transparent 100%);
  filter: drop-shadow(0 0 6px color-mix(in oklab, var(--thermal-accent), transparent 40%));
  animation: a-busbar-sweep var(--dur-cycle-a) linear infinite;
}
@keyframes a-busbar-sweep {
  0%   { transform: translateX(-30%); opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateX(560%); opacity: 0; }
}
[data-design="a"] .rf-switch {
  background: transparent; border: 1px solid var(--graphite);
  border-radius: var(--r-junction); padding: 10px 12px;
  color: var(--ink-primary); cursor: pointer; min-width: 44px; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  transition: border-color var(--dur-energize) var(--ease-energize),
              color var(--dur-energize) var(--ease-energize);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-switch:hover {
    border-color: var(--thermal-accent); color: var(--thermal-accent);
  }
}
[data-design="a"] .rf-switch:focus-visible {
  border-color: var(--copper); color: var(--copper); outline: none;
}
/* Drawer */
[data-design="a"] .rf-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(380px, 88vw);
  background: var(--panel-bg-2);
  border-left: 1px solid var(--copper);
  padding: var(--gap-service) var(--gap-circuit);
  z-index: 50;
  overflow-y: auto;
}
[data-design="a"] .rf-drawer__close {
  position: absolute; top: 16px; right: 16px;
  background: transparent; border: 1px solid var(--graphite);
  border-radius: var(--r-junction); padding: 8px; color: var(--ink-primary);
  cursor: pointer; min-width: 44px; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
}
[data-design="a"] .rf-nav {
  display: flex; flex-direction: column; gap: var(--gap-conduit);
  font-family: var(--font-display); text-transform: uppercase;
  letter-spacing: 0.12em; font-size: 14px;
  margin-top: var(--gap-bus);
}
[data-design="a"] .rf-nav a {
  color: var(--ink-primary); text-decoration: none; padding: 6px 0;
  border-bottom: 1px solid transparent; min-height: 44px;
  display: flex; align-items: center;
  transition: border-color var(--dur-energize) var(--ease-energize);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-nav a:hover { border-bottom-color: var(--copper); }
}
[data-design="a"] .rf-drawer__ctas {
  display: flex; flex-direction: column; gap: var(--gap-conduit);
  margin-top: var(--gap-bus);
}
[data-design="a"] .rf-drawer__phone {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--panel-bg-3); border: 1px solid var(--graphite);
  border-radius: var(--r-junction); padding: 14px 16px;
  text-decoration: none; color: var(--ink-primary);
  min-height: 64px; justify-content: center;
  transition: border-color var(--dur-energize) var(--ease-energize);
}
[data-design="a"] .rf-drawer__phone-label {
  font-family: var(--font-display); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-secondary);
}
[data-design="a"] .rf-drawer__phone-num {
  font-family: var(--font-display); font-size: 18px;
  font-weight: 600; color: var(--ink-primary); letter-spacing: 0.04em;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-drawer__phone:hover { border-color: var(--copper); }
}
[data-design="a"] .rf-drawer__quote {
  display: flex; align-items: center; justify-content: center;
  background: var(--copper); color: #0E1116;
  font-family: var(--font-headline); font-weight: 600; font-size: 15px;
  padding: 14px 22px; border-radius: var(--r-junction); text-decoration: none;
  min-height: 48px;
}
[data-design="a"] .rf-drawer__backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 49;
}

/* ═══════════════════════════════════════════════════
   HERO — HERO-1/2/3 + thermal backdrop
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-hero {
  position: relative; overflow: hidden;
  min-height: clamp(520px, 75vh, 820px);
  display: flex; align-items: center;
  padding: clamp(80px, 10vw, 120px) clamp(16px, 5vw, 80px);
  background: var(--panel-bg);
}
/* E3 — thermal backdrop: ONE animated layer, arrival + sustained ambient */
[data-design="a"] .rf-hero__backdrop {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  overflow: hidden;
}
[data-design="a"] .rf-thermal-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  opacity: 0.92;
}
[data-design="a"] .rf-hero__content {
  position: relative; z-index: 1;
  max-width: 640px;
  display: flex; flex-direction: column; gap: var(--gap-circuit);
}
[data-design="a"] .rf-eyebrow {
  font-family: var(--font-display); font-size: 13px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-secondary); margin: 0;
}
[data-design="a"] .rf-hero__headline {
  font-family: var(--font-headline);
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 700; letter-spacing: -0.015em; line-height: 1.1;
  color: var(--ink-primary); margin: 0;
  /* opacity:1 at first paint — NEVER gated */
}
[data-design="a"] .rf-hero__subtitle {
  font-size: clamp(16px, 2vw, 19px); color: var(--ink-secondary);
  margin: 0; line-height: 1.5;
  /* opacity:1 at first paint — NEVER gated */
}
/* E5 — comfort-dial mount: bare centring container ONLY */
[data-design="a"] .rf-dial-mount {
  width: clamp(120px, 22vw, 180px);
  height: clamp(120px, 22vw, 180px);
  /* --cd-* thermal palette vars for the canonical component */
  --cd-cold:    hsl(195 62% 44%);
  --cd-warm:    #E0903F;
  --cd-bg:      transparent;
  --cd-face:    var(--panel-bg-3);
  --cd-ring:    var(--graphite);
  --cd-needle:  var(--copper);
  --cd-text:    var(--ink-primary);
}

/* ═══════════════════════════════════════════════════
   E2 — ANIMATED CTA (planning mode)
   breath animation, copper-warm
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-cta {
  display: inline-flex; align-items: center; gap: var(--gap-conduit);
  padding: 14px 22px;
  background: var(--copper); color: #0E1116;
  font-family: var(--font-headline); font-weight: 600;
  font-size: 16px; letter-spacing: -0.005em;
  border-radius: var(--r-junction); text-decoration: none;
  border: none; cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px var(--copper);
  animation: a-cta-breath var(--dur-sweep) var(--ease-hum) infinite;
  transition: transform var(--dur-tick) var(--ease-relay),
              box-shadow var(--dur-energize) var(--ease-energize);
  will-change: transform, box-shadow;
  min-height: 48px; white-space: nowrap;
}
[data-design="a"] .rf-cta__num {
  font-family: var(--font-display); font-size: 12px;
  letter-spacing: 0.1em; opacity: 0.7;
}
[data-design="a"] .rf-cta__arrow {
  display: inline-flex;
  transition: transform var(--dur-energize) var(--ease-energize);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-cta:hover {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10),
                0 0 0 1px var(--copper-glow),
                0 0 28px -2px color-mix(in oklab, var(--copper-glow), transparent 55%);
    outline: none;
  }
  [data-design="a"] .rf-cta:hover .rf-cta__arrow { transform: translateX(3px); }
  [data-design="a"] .rf-cta[data-near="true"] .rf-cta__arrow { transform: translateX(3px); }
}
[data-design="a"] .rf-cta:focus-visible {
  box-shadow: var(--elev-energize); outline: none;
}
[data-design="a"] .rf-cta:active { transform: translateY(1px); }
@keyframes a-cta-breath {
  0%, 100% {
    transform: scale(1.000);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px var(--copper), 0 0 0 0 transparent;
  }
  50% {
    transform: scale(1.012);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 0 1px var(--copper-glow),
                0 0 18px -4px color-mix(in oklab, var(--copper-glow), transparent 70%);
  }
}
[data-design="a"] .rf-cta--done {
  margin-top: var(--gap-circuit);
}

/* ═══════════════════════════════════════════════════
   E6 — POINTER (thermal-flow register)
   isotherm hairline cool→warm + label
   NOT a button. Visibly rendered at all breakpoints.
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-pointer {
  display: flex; align-items: center; gap: var(--gap-bus);
  padding: clamp(24px, 4vw, 40px) clamp(16px, 5vw, 80px);
  opacity: 1; /* NEVER opacity:0 — gate check */
  pointer-events: none;
}
[data-design="a"] .a-pointer__iso {
  flex: 1; display: flex; align-items: center; gap: var(--gap-conduit);
  min-height: 24px; /* bbox height ≥8px guaranteed */
}
[data-design="a"] .a-pointer__line {
  display: block; flex: 1; height: 1px;
  background: linear-gradient(90deg,
    var(--cool-tone) 0%,
    var(--thermal-accent) 100%);
  transform-origin: left;
  animation: a-isotherm-draw var(--dur-sweep) var(--ease-hum) infinite alternate;
}
@keyframes a-isotherm-draw {
  0%   { transform: scaleX(0.72); opacity: 0.45; }
  100% { transform: scaleX(1.00); opacity: 0.85; }
}
[data-design="a"] .a-pointer__label {
  font-family: var(--font-display); font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-tertiary); white-space: nowrap;
}
[data-design="a"] .a-pointer__chev {
  font-size: 20px; color: var(--thermal-accent); opacity: 0.7;
  animation: a-pointer-chev 4s var(--ease-hum) infinite;
}
@keyframes a-pointer-chev {
  0%, 100% { transform: translateX(0);   opacity: 0.45; }
  50%      { transform: translateX(4px); opacity: 0.9; }
}

/* ═══════════════════════════════════════════════════
   FUNNEL — #funnel · E5 (INT-1)
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-interactive {
  padding: var(--gap-service) clamp(16px, 4vw, 40px);
  background: var(--panel-bg);
}
[data-design="a"] .rf-funnel {
  max-width: 720px; margin-inline: auto;
  background: var(--panel-bg-2);
  border: 1px solid var(--graphite);
  border-radius: var(--r-junction);
  padding: var(--gap-bus) var(--gap-circuit);
  position: relative;
}
[data-design="a"] .rf-funnel__header {
  margin-bottom: var(--gap-bus);
}
[data-design="a"] .rf-funnel__progress {
  list-style: none; padding: 0; margin: 0;
  display: flex; gap: var(--gap-conduit); flex-wrap: wrap;
  font-family: var(--font-display); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-tertiary);
}
[data-design="a"] .rf-funnel__progress li {
  display: flex; align-items: center; gap: 6px;
}
[data-design="a"] .rf-funnel__progress span {
  display: inline-grid; place-items: center;
  width: 22px; height: 22px;
  border: 1px solid var(--graphite); border-radius: var(--r-cap);
  color: var(--ink-secondary);
}
[data-design="a"] .rf-funnel__progress li.is-active span {
  background: var(--copper); color: #0E1116; border-color: var(--copper);
  box-shadow: 0 0 16px -2px color-mix(in oklab, var(--copper-glow), transparent 55%);
}
[data-design="a"] .rf-funnel__progress li.is-done span {
  background: transparent; color: var(--copper); border-color: var(--copper);
}
[data-design="a"] .rf-funnel__step {
  border: 0; padding: 0; margin: 0;
  animation: a-step-in var(--dur-trace) var(--ease-trace);
}
@keyframes a-step-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
[data-design="a"] .rf-funnel__q {
  font-family: var(--font-headline);
  font-size: clamp(20px, 3vw, 26px);
  letter-spacing: -0.005em; margin: var(--gap-knock) 0 var(--gap-circuit);
  color: var(--ink-primary);
}
[data-design="a"] .rf-funnel__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--gap-conduit);
}
[data-design="a"] .rf-funnel__grid label {
  position: relative; display: flex; align-items: center;
  gap: var(--gap-knock); padding: 14px 16px;
  background: var(--panel-bg-3);
  border: 1px solid var(--graphite); border-radius: var(--r-junction);
  cursor: pointer; color: var(--ink-primary); font-size: 15px;
  min-height: 52px;
  transition: border-color var(--dur-energize) var(--ease-energize),
              background var(--dur-energize) var(--ease-energize);
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-funnel__grid label:hover {
    border-color: color-mix(in oklab, var(--graphite), var(--copper) 40%);
  }
}
[data-design="a"] .rf-funnel__grid label.is-hot::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--hot); border-radius: var(--r-junction) 0 0 var(--r-junction);
}
[data-design="a"] .rf-funnel__grid input { accent-color: var(--copper); }
[data-design="a"] .rf-funnel__grid label:has(input:checked) {
  border-color: var(--copper);
  box-shadow: inset 0 0 0 1px var(--copper),
              0 0 22px -8px color-mix(in oklab, var(--copper-glow), transparent 50%);
}
[data-design="a"] .rf-funnel__actions {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: var(--gap-bus); gap: var(--gap-conduit); flex-wrap: wrap;
}
[data-design="a"] .rf-link {
  background: transparent; border: 0; color: var(--ink-secondary);
  font-family: var(--font-display); font-size: 13px;
  letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer;
  padding: 10px 0; min-height: 44px;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-link:hover { color: var(--copper); }
}
[data-design="a"] .rf-funnel__done {
  text-align: left; padding: var(--gap-circuit) 0;
  animation: a-step-in var(--dur-trace) var(--ease-trace);
}
[data-design="a"] .rf-funnel__done h3 {
  font-family: var(--font-headline); font-size: clamp(22px, 3vw, 28px);
  color: var(--ink-primary); margin: var(--gap-knock) 0;
}
[data-design="a"] .rf-funnel__done-body {
  color: var(--ink-secondary); font-size: 16px; margin-bottom: var(--gap-circuit);
  max-width: 52ch;
}
[data-design="a"] .rf-funnel__done-alt {
  margin-top: var(--gap-conduit); font-size: 14px; color: var(--ink-tertiary);
}
[data-design="a"] .rf-funnel__done-alt a {
  color: var(--copper); text-decoration: underline;
}

/* ═══════════════════════════════════════════════════
   E4 AMBIENT-B — SERVICES (thermal spool)
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-ambient-b {
  display: grid; grid-template-columns: 64px 1fr;
  gap: var(--gap-bus);
  padding: var(--gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--graphite);
}
[data-design="a"] .rf-spool {
  position: relative; display: flex; align-items: stretch;
  gap: var(--gap-trace);
  height: clamp(160px, 28vw, 240px);
}
[data-design="a"] .rf-spool__bar {
  flex: 1 1 0; min-width: 4px; max-width: 8px;
  border-radius: var(--r-junction); opacity: 0.18;
  transition: opacity var(--dur-energize) var(--ease-energize);
  animation: a-spool var(--dur-cycle-b) steps(1,end) infinite;
}
[data-design="a"] .rf-spool__bar[data-c="cool"]  { background: hsl(195 62% 44%); animation-delay: 0s; }
[data-design="a"] .rf-spool__bar[data-c="mid"]   { background: var(--phosphor);  animation-delay: calc(var(--dur-cycle-b) / -4 * 3); }
[data-design="a"] .rf-spool__bar[data-c="warm"]  { background: var(--copper);    animation-delay: calc(var(--dur-cycle-b) / -4 * 2); }
[data-design="a"] .rf-spool__bar[data-c="hot"]   { background: var(--copper-glow); animation-delay: calc(var(--dur-cycle-b) / -4 * 1); }
@keyframes a-spool {
  0%, 18%    { opacity: 1; transform: scaleY(1); }
  20%, 100%  { opacity: 0.18; transform: scaleY(0.96); }
}
[data-design="a"] .rf-spool__label {
  position: absolute; left: 0; bottom: -22px;
  font-family: var(--font-display); font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-tertiary); white-space: nowrap;
}
[data-design="a"] .rf-ambient-b__body h2 {
  font-family: var(--font-headline); font-size: clamp(26px, 3.5vw, 32px);
  letter-spacing: -0.01em; margin: 0 0 var(--gap-circuit);
  color: var(--ink-primary); max-width: 32ch;
}
[data-design="a"] .rf-services {
  list-style: none; padding: 0; margin: 0;
  border-top: 1px solid var(--graphite);
}
[data-design="a"] .rf-service {
  display: flex; align-items: flex-start; gap: var(--gap-circuit);
  padding: var(--gap-circuit) 0;
  border-bottom: 1px solid var(--graphite);
}
[data-design="a"] .rf-service__num {
  font-family: var(--font-display); font-size: 11px;
  letter-spacing: 0.08em; color: var(--ink-tertiary);
  padding-top: 3px; flex-shrink: 0;
}
[data-design="a"] .rf-service__name {
  font-family: var(--font-headline); font-weight: 600;
  font-size: 17px; color: var(--ink-primary);
  display: block; margin-bottom: 4px;
}
[data-design="a"] .rf-service__spec {
  font-size: 15px; color: var(--ink-secondary); line-height: 1.5;
}

/* ═══════════════════════════════════════════════════
   E4 AMBIENT-A — ABOUT (thermal load monitor)
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-ambient-a {
  padding: var(--gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--graphite);
  border-bottom: 1px solid var(--graphite);
  background: var(--panel-bg-2);
}
[data-design="a"] .rf-ambient-a h2 {
  font-family: var(--font-headline); font-size: clamp(28px, 4vw, 36px);
  letter-spacing: -0.01em; margin: 0 0 var(--gap-conduit);
  color: var(--ink-primary); max-width: 32ch;
}
[data-design="a"] .rf-lead {
  font-size: clamp(16px, 2vw, 18px); color: var(--ink-secondary);
  max-width: 62ch; margin: 0 0 var(--gap-circuit); line-height: 1.6;
}
[data-design="a"] .rf-loadmon {
  display: grid; grid-template-rows: repeat(3, 28px);
  gap: var(--gap-trace); margin-block: var(--gap-circuit);
  font-family: var(--font-display); font-size: 11px;
  letter-spacing: 0.08em;
}
[data-design="a"] .rf-loadmon__line {
  position: relative; display: flex; align-items: center;
  gap: var(--gap-conduit); color: var(--ink-tertiary);
}
[data-design="a"] .rf-loadmon__tag {
  flex: 0 0 108px; text-align: right; white-space: nowrap;
}
[data-design="a"] .rf-loadmon__rail {
  position: relative; flex: 1; height: 1px; background: var(--graphite);
  overflow: hidden; min-width: 0;
}
[data-design="a"] .rf-loadmon__pulse {
  position: absolute; left: 0; top: -1px; width: 64px; height: 3px;
  background: linear-gradient(90deg, transparent, var(--cool-tone), transparent);
  filter: drop-shadow(0 0 4px color-mix(in oklab, var(--cool-tone), transparent 55%));
  animation: a-pulse-cool var(--dur-cycle-c) linear infinite;
}
[data-design="a"] .rf-loadmon__line[data-leg="neutral"] .rf-loadmon__pulse {
  background: linear-gradient(90deg, transparent, var(--ink-secondary), transparent);
  filter: none; opacity: 0.5;
  animation: a-pulse-neutral 13s linear infinite;
}
[data-design="a"] .rf-loadmon__line[data-leg="return"] .rf-loadmon__pulse {
  background: linear-gradient(90deg, transparent, var(--copper-glow), transparent);
  filter: drop-shadow(0 0 4px color-mix(in oklab, var(--copper-glow), transparent 55%));
  animation: a-pulse-warm 17s linear infinite;
}
@keyframes a-pulse-cool    { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }
@keyframes a-pulse-neutral { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }
@keyframes a-pulse-warm    { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }
[data-design="a"] .rf-ambient-a[data-paused="true"] .rf-loadmon__pulse {
  animation-play-state: paused;
}
[data-design="a"] .rf-ambient-a__body {
  margin-top: var(--gap-circuit);
}

/* ═══════════════════════════════════════════════════
   SERVICE AREA
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-service-area {
  padding: var(--gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--graphite);
}
[data-design="a"] .rf-service-area h2 {
  font-family: var(--font-headline); font-size: clamp(24px, 3.5vw, 32px);
  letter-spacing: -0.01em; color: var(--ink-primary);
  margin: var(--gap-knock) 0 var(--gap-circuit);
}
[data-design="a"] .rf-area-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-wrap: wrap; gap: var(--gap-knock) var(--gap-circuit);
  font-family: var(--font-display); font-size: 13px;
  letter-spacing: 0.06em; color: var(--ink-secondary);
}
[data-design="a"] .rf-area-list li::before {
  content: "· "; color: var(--thermal-accent); opacity: 0.8;
}

/* ═══════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════ */
[data-design="a"] .rf-footer {
  background: var(--panel-bg-2);
  border-top: 1px solid var(--graphite);
  padding: clamp(40px, 6vw, 64px) clamp(16px, 4vw, 40px);
}
[data-design="a"] .rf-footer__inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--gap-bus);
  max-width: 1200px; margin-inline: auto;
}
[data-design="a"] .rf-footer__brand,
[data-design="a"] .rf-footer__contact,
[data-design="a"] .rf-footer__area,
[data-design="a"] .rf-footer__legal {
  display: flex; flex-direction: column; gap: var(--gap-knock);
}
[data-design="a"] .rf-footer__name {
  font-family: var(--font-display); font-size: 13px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ink-primary); font-weight: 600;
}
[data-design="a"] .rf-footer__addr {
  font-size: 14px; color: var(--ink-tertiary);
}
[data-design="a"] .rf-footer__phone {
  font-family: var(--font-display); font-size: 18px;
  letter-spacing: 0.04em; color: var(--copper);
  text-decoration: none; font-weight: 600; min-height: 44px;
  display: flex; align-items: center;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-footer__phone:hover { color: var(--copper-glow); }
}
[data-design="a"] .rf-footer__fb {
  font-size: 14px; color: var(--ink-secondary); text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .rf-footer__fb:hover { color: var(--copper); }
}
[data-design="a"] .rf-footer__area {
  font-size: 13px; color: var(--ink-tertiary); line-height: 1.7;
}
[data-design="a"] .rf-footer__legal {
  font-size: 13px; color: var(--ink-tertiary);
}
[data-design="a"] .rf-footer__hairline {
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%, var(--thermal-accent) 50%, transparent 100%);
  opacity: 0.3;
  margin-top: clamp(32px, 4vw, 48px);
}

/* ═══════════════════════════════════════════════════
   SCROLL-LINKED THERMAL WARMING (TRIAD-2)
   --thermal-temp driven by JS scroll position
   Visual mood reads cool at hero, warm at funnel
═══════════════════════════════════════════════════ */
/* Thermal-temp drives background tints across sections */
[data-design="a"] .rf-interactive {
  background: color-mix(in oklab, var(--panel-bg), var(--thermal-bg) calc(var(--thermal-temp) * 18%));
}
[data-design="a"] .rf-ambient-a {
  background: color-mix(in oklab, var(--panel-bg-2), var(--thermal-bg) calc(var(--thermal-temp) * 12%));
}

/* ═══════════════════════════════════════════════════
   REDUCED MOTION
═══════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .rf-busbar__current { animation: none; transform: translateX(180%); opacity: 0.5; }
  [data-design="a"] .rf-cta { animation: none; }
  [data-design="a"] .a-pointer__line { animation: none; transform: scaleX(1); opacity: 0.6; }
  [data-design="a"] .a-pointer__chev { animation: none; }
  [data-design="a"] .rf-spool__bar { animation: none; opacity: 0.5; }
  [data-design="a"] .rf-loadmon__pulse { animation-play-state: paused; opacity: 0.4; }
  [data-design="a"] .rf-funnel__step,
  [data-design="a"] .rf-funnel__done { animation: none; }
  [data-design="a"] .rf-drawer { transition: none; }
}

/* ═══════════════════════════════════════════════════
   MOBILE — NO H-SCROLL (mandatory block at bottom)
   Scoped to .dq-design per hard contract
═══════════════════════════════════════════════════ */
[data-design="a"].dq-design, [data-design="a"] .dq-design {
  max-width: 100%; overflow-x: clip;
}
[data-design="a"].dq-design * { min-width: 0; }
[data-design="a"].dq-design img,
[data-design="a"].dq-design svg:not([data-keep-size]) {
  max-width: 100%; height: auto;
}

/* Mobile overrides */
@media (max-width: 560px) {
  [data-design="a"] .rf-ambient-b {
    grid-template-columns: 40px 1fr;
    gap: var(--gap-circuit);
  }
  [data-design="a"] .rf-spool { height: 140px; }
  [data-design="a"] .rf-spool__label { display: none; }
  [data-design="a"] .rf-loadmon__tag { flex-basis: 80px; font-size: 10px; }
  [data-design="a"] .rf-funnel { padding: var(--gap-circuit) var(--gap-conduit); }
  [data-design="a"] .rf-funnel__progress { gap: 10px; font-size: 10px; }
  [data-design="a"] .rf-footer__inner { grid-template-columns: 1fr; }
  [data-design="a"] .rf-pointer { padding-inline: 16px; gap: var(--gap-circuit); }
}
@media (max-width: 380px) {
  [data-design="a"] .rf-header__bar { padding-inline: 12px; min-height: 56px; }
  [data-design="a"] .rf-hero { padding-inline: 12px; }
  [data-design="a"] .rf-hero__headline { font-size: 28px; }
  [data-design="a"] .rf-funnel__grid { grid-template-columns: 1fr; }
}

/* Phase-3.4 hero visibility floor (forge_assemble) */
[data-design="a"] [data-mf-role="hero"] :is(h1,h2,p,.headline,.subtitle,.proof,[class*="headline"],[class*="subtitle"],[class*="proof"]),
[data-design="a"] [data-mf-role="cta"] { opacity: 1 !important; }
