/* ═══════════════════════════════════════════════════════════════════
   Conductor · Design-B slice — Titanium Electric Inc
   Scope: [data-design="b"]  /  root class: .dq-design
   All keyframes prefixed b-*   All selectors scoped under .dq-design
   ═══════════════════════════════════════════════════════════════════ */

/* ── Design-B custom property exposure ── */
[data-design="b"] {
  --design-b-primary: #C46A2C;

  /* Color tokens (Conductor palette) */
  --b-panel-bg:    #0E1116;
  --b-panel-bg-2:  #151A22;
  --b-panel-bg-3:  #1D2430;
  --b-graphite:    #2A3340;
  --b-ink-primary: #F2EFE8;
  --b-ink-secondary: #9AA3B2;
  --b-ink-tertiary:  #5B6573;
  --b-copper:      #C46A2C;
  --b-copper-glow: #E0903F;
  --b-phosphor:    #4FE3A1;
  --b-hot:         #E63946;
  --b-wire-black:  #1A1F27;
  --b-wire-red:    #E63946;
  --b-wire-blue:   #5C9EE6;
  --b-wire-white:  #E8E5DC;
  --b-wire-green:  #4FE3A1;

  /* Typography */
  --b-font-display:  "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;
  --b-font-headline: "Inter", -apple-system, system-ui, sans-serif;
  --b-font-body:     "Inter", -apple-system, system-ui, sans-serif;

  /* Spacing */
  --b-gap-trace:   4px;
  --b-gap-knock:   8px;
  --b-gap-conduit: 16px;
  --b-gap-circuit: 24px;
  --b-gap-bus:     40px;
  --b-gap-service: 64px;
  --b-gap-main:    96px;

  /* Radius */
  --b-r-flush:    0;
  --b-r-junction: 2px;
  --b-r-drum:     6px;
  --b-r-cap:      999px;

  /* Motion */
  --b-dur-tick:    120ms;
  --b-dur-energize: 240ms;
  --b-dur-trace:   600ms;
  --b-dur-sweep:   2400ms;
  --b-dur-cycle-a: 18000ms;
  --b-dur-cycle-b: 14000ms;
  --b-dur-cycle-c: 11000ms;
  --b-ease-energize: cubic-bezier(.2,0,0,1);
  --b-ease-trace:    cubic-bezier(.4,0,.2,1);
  --b-ease-relay:    cubic-bezier(.3,1.4,.5,1);
  --b-ease-hum:      cubic-bezier(.45,.05,.55,.95);

  /* Elevation */
  --b-elev-edge:    inset 0 0 0 1px var(--b-graphite);
  --b-elev-lift:    0 1px 0 var(--b-graphite), 0 8px 22px -12px rgba(0,0,0,.65);
  --b-elev-energize: 0 0 0 1px var(--b-copper), 0 0 24px -2px color-mix(in oklab, var(--b-copper-glow), transparent 65%);

  /* Page defaults */
  background: var(--b-panel-bg);
  color: var(--b-ink-primary);
  font-family: var(--b-font-body);
  font-size: 17px;
  line-height: 1.55;
}

/* ── Reset essentials ── */
.dq-design[data-design="b"] *,
.dq-design[data-design="b"] *::before,
.dq-design[data-design="b"] *::after {
  box-sizing: border-box;
}

.dq-design[data-design="b"] h1,
.dq-design[data-design="b"] h2,
.dq-design[data-design="b"] h3,
.dq-design[data-design="b"] p,
.dq-design[data-design="b"] ul,
.dq-design[data-design="b"] ol,
.dq-design[data-design="b"] dl,
.dq-design[data-design="b"] dd {
  margin: 0;
}

.dq-design[data-design="b"] ul,
.dq-design[data-design="b"] ol {
  list-style: none;
  padding: 0;
}

/* ═══════════════════════════════════════════════════════════════════
   E1 — Animated minimalist header
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: color-mix(in oklab, var(--b-panel-bg), transparent 8%);
  backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--b-gap-conduit) clamp(16px, 4vw, 40px);
  min-height: 64px;
  position: relative;
  z-index: 1;
}

/* Logo — exactly ONE text child outside drawer */
.dq-design[data-design="b"] .b-logo {
  display: inline-flex;
  align-items: baseline;
  gap: var(--b-gap-knock);
  font-family: var(--b-font-display);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.005em;
  color: var(--b-ink-primary);
  text-decoration: none;
}

.dq-design[data-design="b"] .b-logo__sep {
  color: var(--b-graphite);
}

.dq-design[data-design="b"] .b-logo__lic {
  color: var(--b-ink-tertiary);
  font-size: 12px;
  letter-spacing: 0.08em;
}

/* Atmospheric busbar sweep — single animation layer behind bar */
.dq-design[data-design="b"] .b-busbar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.dq-design[data-design="b"] .b-busbar__rule {
  position: absolute;
  inset: 0;
  background: var(--b-graphite);
}

.dq-design[data-design="b"] .b-busbar__current {
  position: absolute;
  top: 0;
  height: 1px;
  width: 22%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in oklab, var(--b-copper), transparent 60%) 30%,
    var(--b-copper-glow) 50%,
    color-mix(in oklab, var(--b-copper), transparent 60%) 70%,
    transparent 100%
  );
  filter: drop-shadow(0 0 6px color-mix(in oklab, var(--b-copper-glow), transparent 45%));
  animation: b-busbar-sweep var(--b-dur-cycle-a) linear infinite;
}

@keyframes b-busbar-sweep {
  0%   { transform: translateX(-30%); opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateX(560%); opacity: 0; }
}

/* Hamburger switch */
.dq-design[data-design="b"] .b-switch {
  background: transparent;
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-junction);
  padding: 10px 12px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--b-ink-primary);
  cursor: pointer;
  transition:
    border-color var(--b-dur-energize) var(--b-ease-energize),
    color var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-switch:hover,
.dq-design[data-design="b"] .b-switch:focus-visible {
  border-color: var(--b-copper);
  color: var(--b-copper);
  outline: none;
}

/* Drawer — slide from right, focus-trapped */
.dq-design[data-design="b"] .b-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(380px, 88vw);
  background: var(--b-panel-bg-2);
  border-left: 1px solid var(--b-copper);
  transform: translateX(100%);
  transition: transform var(--b-dur-trace) var(--b-ease-trace);
  padding: var(--b-gap-service) var(--b-gap-circuit);
  z-index: 200;
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-bus);
  overflow-y: auto;
}

.dq-design[data-design="b"] .b-drawer[hidden] {
  display: none;
}

.dq-design[data-design="b"] .b-drawer[data-open="true"] {
  display: flex;
  transform: translateX(0);
}

.dq-design[data-design="b"] .b-drawer__close {
  align-self: flex-end;
  background: transparent;
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-junction);
  padding: 10px 12px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--b-ink-secondary);
  cursor: pointer;
}

.dq-design[data-design="b"] .b-drawer__close:hover,
.dq-design[data-design="b"] .b-drawer__close:focus-visible {
  border-color: var(--b-copper);
  color: var(--b-copper);
  outline: none;
}

.dq-design[data-design="b"] .b-nav {
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-conduit);
  font-family: var(--b-font-display);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 14px;
}

.dq-design[data-design="b"] .b-nav a {
  color: var(--b-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(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-nav a:hover,
.dq-design[data-design="b"] .b-nav a:focus-visible {
  border-bottom-color: var(--b-copper);
  outline: none;
}

.dq-design[data-design="b"] .b-drawer__ctas {
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-conduit);
}

.dq-design[data-design="b"] .b-drawer__phone {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  background: var(--b-copper);
  color: #0E1116;
  font-family: var(--b-font-display);
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  border-radius: var(--b-r-junction);
  transition: background var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-drawer__phone:hover {
  background: var(--b-copper-glow);
}

.dq-design[data-design="b"] .b-drawer__schedule {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid var(--b-copper);
  color: var(--b-copper);
  font-family: var(--b-font-display);
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: var(--b-r-junction);
  transition:
    background var(--b-dur-energize) var(--b-ease-energize),
    color var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-drawer__schedule:hover {
  background: var(--b-copper);
  color: #0E1116;
}

/* ═══════════════════════════════════════════════════════════════════
   Hero — E3 backdrop substrate + text + E2 phone CTA
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-hero {
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  padding: var(--b-gap-main) clamp(16px, 5vw, 80px);
  overflow: hidden;
}

/* E3: Backdrop — positioned behind text via z-index */
.dq-design[data-design="b"] .b-hero__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

/* SVG grid — fills backdrop, clipped to hero */
.dq-design[data-design="b"] .b-hero__grid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Phasor arc — sustained ambient rotation (arrival + continuous) */
.dq-design[data-design="b"] .b-phasor-arc {
  transform-origin: 1100px 320px;
  stroke-dashoffset: 0;
  animation:
    b-phasor-arrive 1.8s var(--b-ease-trace) forwards,
    b-phasor-sweep 12s linear 1.8s infinite;
}

@keyframes b-phasor-arrive {
  from { stroke-dashoffset: 300; opacity: 0; }
  to   { stroke-dashoffset: 0;   opacity: 0.55; }
}

@keyframes b-phasor-sweep {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Voltage trace — draws in, then breathes */
.dq-design[data-design="b"] .b-voltage-trace {
  stroke-dashoffset: 1600;
  animation:
    b-trace-draw 2.2s var(--b-ease-trace) 0.4s forwards,
    b-trace-breath 7s var(--b-ease-hum) 2.6s infinite;
}

@keyframes b-trace-draw {
  from { stroke-dashoffset: 1600; opacity: 0; }
  to   { stroke-dashoffset: 0;    opacity: 0.4; }
}

@keyframes b-trace-breath {
  0%, 100% { opacity: 0.4; }
  50%      { opacity: 0.65; }
}

/* Node pulses — staggered, coprime cycles */
.dq-design[data-design="b"] .b-node {
  animation: b-node-pulse 5s var(--b-ease-hum) infinite;
}

.dq-design[data-design="b"] .b-node--1 { animation-duration: 5s;  animation-delay: 0s; }
.dq-design[data-design="b"] .b-node--2 { animation-duration: 7s;  animation-delay: 1.2s; }
.dq-design[data-design="b"] .b-node--3 { animation-duration: 11s; animation-delay: 0.6s; }
.dq-design[data-design="b"] .b-node--4 { animation-duration: 9s;  animation-delay: 2.4s; }

@keyframes b-node-pulse {
  0%, 100% { opacity: 0.7; r: 4px; }
  50%      { opacity: 0.2; r: 2px; }
}

/* Gradient wash — visible color field sustaining ambient presence */
.dq-design[data-design="b"] .b-hero__wash {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 50%,
      color-mix(in oklab, var(--b-copper), transparent 82%) 0%,
      transparent 70%),
    linear-gradient(180deg, var(--b-panel-bg) 0%, var(--b-panel-bg-2) 100%);
  animation: b-wash-breathe 9s var(--b-ease-hum) infinite;
}

@keyframes b-wash-breathe {
  0%, 100% { opacity: 0.75; }
  50%      { opacity: 1; }
}

/* Hero content — above backdrop, opacity:1 at first paint */
.dq-design[data-design="b"] .b-hero__content {
  position: relative;
  z-index: 1;
  max-width: 680px;
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-conduit);
}

.dq-design[data-design="b"] .b-hero__eyebrow {
  font-family: var(--b-font-display);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--b-copper);
  opacity: 1;
  margin: 0;
}

.dq-design[data-design="b"] .b-hero__h1 {
  font-family: var(--b-font-headline);
  font-size: clamp(32px, 5.5vw, 56px);
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.1;
  color: var(--b-ink-primary);
  max-width: 22ch;
  opacity: 1;
}

.dq-design[data-design="b"] .b-hero__subtitle {
  font-size: clamp(16px, 2vw, 19px);
  color: var(--b-ink-secondary);
  max-width: 52ch;
  line-height: 1.6;
  opacity: 1;
}

.dq-design[data-design="b"] .b-hero__proof {
  font-family: var(--b-font-display);
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--b-ink-tertiary);
  opacity: 1;
}

/* E2 — Phone CTA — hero-visible, ≥44px tap target */
.dq-design[data-design="b"] .b-cta {
  display: inline-flex;
  align-items: center;
  gap: var(--b-gap-conduit);
  padding: 14px 22px;
  min-height: 48px;
  background: var(--b-copper);
  color: #0E1116;
  font-family: var(--b-font-headline);
  font-weight: 700;
  font-size: 17px;
  letter-spacing: -0.005em;
  border-radius: var(--b-r-junction);
  text-decoration: none;
  border: none;
  cursor: pointer;
  position: relative;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px var(--b-copper);
  animation: b-cta-breath var(--b-dur-sweep) var(--b-ease-hum) infinite;
  transition:
    transform var(--b-dur-tick) var(--b-ease-relay),
    box-shadow var(--b-dur-energize) var(--b-ease-energize);
  will-change: transform, box-shadow;
  align-self: flex-start;
}

.dq-design[data-design="b"] .b-cta__num {
  font-family: var(--b-font-display);
  font-size: 12px;
  letter-spacing: 0.1em;
  opacity: 0.7;
}

.dq-design[data-design="b"] .b-cta__arrow {
  display: inline-flex;
  transition: transform var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-cta:hover,
.dq-design[data-design="b"] .b-cta:focus-visible,
.dq-design[data-design="b"] .b-cta[data-near="true"] {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 0 1px var(--b-copper-glow),
    0 0 28px -2px color-mix(in oklab, var(--b-copper-glow), transparent 55%);
  outline: none;
}

.dq-design[data-design="b"] .b-cta:hover .b-cta__arrow,
.dq-design[data-design="b"] .b-cta[data-near="true"] .b-cta__arrow {
  transform: translateX(3px);
}

.dq-design[data-design="b"] .b-cta:active {
  transform: translateY(1px);
}

@keyframes b-cta-breath {
  0%, 100% {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px var(--b-copper), 0 0 0 0 transparent;
  }
  50% {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 0 1px var(--b-copper-glow), 0 0 18px -4px color-mix(in oklab, var(--b-copper-glow), transparent 70%);
  }
}

/* Funnel-internal CTA variant (no breath animation — in form context) */
.dq-design[data-design="b"] .b-cta--funnel {
  animation: none;
  font-size: 16px;
}

/* ═══════════════════════════════════════════════════════════════════
   Shared section atoms
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-eyebrow {
  font-family: var(--b-font-display);
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--b-ink-secondary);
  margin: 0 0 var(--b-gap-knock);
}

.dq-design[data-design="b"] .b-lead {
  font-size: clamp(16px, 2vw, 19px);
  color: var(--b-ink-secondary);
  max-width: 56ch;
  margin: 0 0 var(--b-gap-bus);
  line-height: 1.6;
}

/* ═══════════════════════════════════════════════════════════════════
   E4 — Services section (wiring-color ambient spool sidebar)
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-services {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: var(--b-gap-bus);
  padding: var(--b-gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-spool {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: var(--b-gap-trace);
  height: clamp(160px, 28vw, 260px);
}

.dq-design[data-design="b"] .b-spool__bar {
  flex: 1 1 0;
  min-width: 4px;
  max-width: 8px;
  border-radius: var(--b-r-junction);
  opacity: 0.18;
  transition: opacity var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-spool__bar[data-c="black"] { background: var(--b-wire-black); border: 1px solid var(--b-graphite); }
.dq-design[data-design="b"] .b-spool__bar[data-c="red"]   { background: var(--b-wire-red); }
.dq-design[data-design="b"] .b-spool__bar[data-c="blue"]  { background: var(--b-wire-blue); }
.dq-design[data-design="b"] .b-spool__bar[data-c="white"] { background: var(--b-wire-white); }
.dq-design[data-design="b"] .b-spool__bar[data-c="green"] { background: var(--b-wire-green); }

.dq-design[data-design="b"] .b-spool .b-spool__bar {
  animation: b-spool var(--b-dur-cycle-b) steps(1, end) infinite;
}
.dq-design[data-design="b"] .b-spool .b-spool__bar[data-c="black"] { animation-delay: 0s; }
.dq-design[data-design="b"] .b-spool .b-spool__bar[data-c="red"]   { animation-delay: calc(var(--b-dur-cycle-b) / -5 * 4); }
.dq-design[data-design="b"] .b-spool .b-spool__bar[data-c="blue"]  { animation-delay: calc(var(--b-dur-cycle-b) / -5 * 3); }
.dq-design[data-design="b"] .b-spool .b-spool__bar[data-c="white"] { animation-delay: calc(var(--b-dur-cycle-b) / -5 * 2); }
.dq-design[data-design="b"] .b-spool .b-spool__bar[data-c="green"] { animation-delay: calc(var(--b-dur-cycle-b) / -5 * 1); }

@keyframes b-spool {
  0%, 18% { opacity: 1;    transform: scaleY(1); }
  20%, 100%{ opacity: 0.18; transform: scaleY(0.96); }
}

.dq-design[data-design="b"] .b-spool__label {
  position: absolute;
  left: 0;
  bottom: -22px;
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--b-ink-tertiary);
  white-space: nowrap;
}

.dq-design[data-design="b"] .b-services__body h2 {
  font-family: var(--b-font-headline);
  font-size: clamp(26px, 3.5vw, 36px);
  letter-spacing: -0.01em;
  margin: 0 0 var(--b-gap-conduit);
  color: var(--b-ink-primary);
  max-width: 32ch;
}

/* Numbered service index */
.dq-design[data-design="b"] .b-service-index {
  display: flex;
  flex-direction: column;
  margin: 0 0 var(--b-gap-bus);
  border-top: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-service-row {
  display: grid;
  grid-template-columns: 48px 1fr auto auto;
  align-items: center;
  gap: var(--b-gap-conduit);
  padding: var(--b-gap-conduit) 0;
  border-bottom: 1px solid var(--b-graphite);
  transition: background var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-service-row:hover {
  background: color-mix(in oklab, var(--b-panel-bg-3), transparent 40%);
}

.dq-design[data-design="b"] .b-service-row__num {
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--b-ink-tertiary);
}

.dq-design[data-design="b"] .b-service-row__name {
  font-family: var(--b-font-headline);
  font-weight: 600;
  font-size: 16px;
  color: var(--b-ink-primary);
}

.dq-design[data-design="b"] .b-service-row__spec {
  font-size: 14px;
  color: var(--b-ink-secondary);
  max-width: 38ch;
}

.dq-design[data-design="b"] .b-service-row__chev {
  color: var(--b-copper);
  font-size: 18px;
  opacity: 0.6;
}

.dq-design[data-design="b"] .b-inline-phone {
  font-size: 16px;
  color: var(--b-ink-secondary);
  margin-top: var(--b-gap-bus);
}

.dq-design[data-design="b"] .b-inline-phone a {
  color: var(--b-copper);
  text-decoration: none;
  font-weight: 600;
}

.dq-design[data-design="b"] .b-inline-phone a:hover {
  color: var(--b-copper-glow);
  text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════
   Service Area — E3 load monitor (segment A)
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-service-area {
  padding: var(--b-gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--b-graphite);
  border-bottom: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-loadmon {
  display: grid;
  grid-template-rows: repeat(3, 28px);
  gap: var(--b-gap-trace);
  margin-block: var(--b-gap-circuit);
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.08em;
}

.dq-design[data-design="b"] .b-loadmon__line {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--b-gap-conduit);
  color: var(--b-ink-tertiary);
}

.dq-design[data-design="b"] .b-loadmon__tag {
  flex: 0 0 96px;
  text-align: right;
  white-space: nowrap;
}

.dq-design[data-design="b"] .b-loadmon__rail {
  position: relative;
  flex: 1;
  height: 1px;
  background: var(--b-graphite);
  overflow: hidden;
  min-width: 0;
}

.dq-design[data-design="b"] .b-loadmon__pulse {
  position: absolute;
  left: 0;
  top: -1px;
  width: 64px;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--b-copper-glow), transparent);
  filter: drop-shadow(0 0 4px color-mix(in oklab, var(--b-copper-glow), transparent 60%));
  animation: b-pulse-l1 var(--b-dur-cycle-c) linear infinite;
}

.dq-design[data-design="b"] .b-loadmon__line[data-leg="N"]  .b-loadmon__pulse {
  background: linear-gradient(90deg, transparent, var(--b-ink-primary), transparent);
  filter: none;
  opacity: 0.6;
  animation: b-pulse-n 13s linear infinite;
}

.dq-design[data-design="b"] .b-loadmon__line[data-leg="L2"] .b-loadmon__pulse {
  background: linear-gradient(90deg, transparent, var(--b-wire-red), transparent);
  filter: drop-shadow(0 0 4px color-mix(in oklab, var(--b-wire-red), transparent 60%));
  animation: b-pulse-l2 17s linear infinite;
}

@keyframes b-pulse-l1 { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }
@keyframes b-pulse-n  { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }
@keyframes b-pulse-l2 { from { transform: translateX(-10%); } to { transform: translateX(120vw); } }

.dq-design[data-design="b"] .b-service-area__body h2 {
  font-family: var(--b-font-headline);
  font-size: clamp(26px, 3.5vw, 36px);
  letter-spacing: -0.01em;
  margin: 0 0 var(--b-gap-conduit);
  color: var(--b-ink-primary);
  max-width: 32ch;
}

.dq-design[data-design="b"] .b-area-list {
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-knock);
  margin: 0 0 var(--b-gap-bus);
}

.dq-design[data-design="b"] .b-area-list li {
  font-family: var(--b-font-display);
  font-size: 14px;
  letter-spacing: 0.06em;
  color: var(--b-ink-secondary);
  padding-left: var(--b-gap-conduit);
  position: relative;
}

.dq-design[data-design="b"] .b-area-list li::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--b-copper);
}

.dq-design[data-design="b"] .b-phone-link {
  display: inline-flex;
  align-items: center;
  gap: var(--b-gap-knock);
  color: var(--b-copper);
  text-decoration: none;
  font-size: 15px;
  font-family: var(--b-font-display);
  letter-spacing: 0.04em;
  transition: color var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-phone-link:hover {
  color: var(--b-copper-glow);
}

/* ═══════════════════════════════════════════════════════════════════
   About
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-about {
  padding: var(--b-gap-service) clamp(16px, 4vw, 40px);
  border-top: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-about__inner {
  max-width: 720px;
}

.dq-design[data-design="b"] .b-about h2 {
  font-family: var(--b-font-headline);
  font-size: clamp(26px, 3.5vw, 36px);
  letter-spacing: -0.01em;
  margin: 0 0 var(--b-gap-conduit);
  color: var(--b-ink-primary);
}

.dq-design[data-design="b"] .b-about__bio {
  font-size: 17px;
  color: var(--b-ink-secondary);
  line-height: 1.65;
  max-width: 66ch;
  margin-bottom: var(--b-gap-bus);
}

/* Spec strip — mono UL-label register */
.dq-design[data-design="b"] .b-spec-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0;
  border-top: 1px solid var(--b-graphite);
  border-left: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-spec-strip__item {
  padding: var(--b-gap-conduit);
  border-right: 1px solid var(--b-graphite);
  border-bottom: 1px solid var(--b-graphite);
}

.dq-design[data-design="b"] .b-spec-strip dt {
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--b-ink-tertiary);
  margin-bottom: var(--b-gap-trace);
}

.dq-design[data-design="b"] .b-spec-strip dd {
  font-family: var(--b-font-display);
  font-size: 13px;
  color: var(--b-ink-primary);
  letter-spacing: 0.04em;
}

/* ═══════════════════════════════════════════════════════════════════
   E6 — Pointer (IMMEDIATELY before #funnel)
   Must be visibly rendered: opacity:1, height ≥ 8px
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-pointer {
  padding: var(--b-gap-bus) clamp(16px, 4vw, 40px) var(--b-gap-circuit);
  border-top: 1px solid var(--b-graphite);
  background: var(--b-panel-bg-2);
  opacity: 1;
  min-height: 80px;
  display: flex;
  flex-direction: column;
  gap: var(--b-gap-conduit);
  align-items: flex-start;
}

.dq-design[data-design="b"] .b-pointer__inner {
  display: flex;
  align-items: center;
  gap: var(--b-gap-conduit);
  width: 100%;
  font-family: var(--b-font-display);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--b-ink-secondary);
  font-variant-numeric: tabular-nums;
}

.dq-design[data-design="b"] .b-pointer__label {
  color: var(--b-copper);
  white-space: nowrap;
}

.dq-design[data-design="b"] .b-pointer__bar {
  position: relative;
  flex: 1;
  height: 2px;
  background: currentColor;
  opacity: 0.15;
  border-radius: 1px;
  overflow: hidden;
  min-width: 40px;
}

.dq-design[data-design="b"] .b-pointer__bar-fill {
  position: absolute;
  inset: 0;
  width: var(--b-pointer-progress, 20%);
  background: var(--b-copper);
  opacity: 1;
  transition: width 480ms cubic-bezier(.22,.61,.36,1);
}

.dq-design[data-design="b"] .b-pointer__counter {
  opacity: 0.75;
  white-space: nowrap;
}

.dq-design[data-design="b"] .b-pointer__counter-now {
  display: inline-block;
  min-width: 1ch;
  color: var(--b-copper);
  animation: b-pointer-tick 320ms ease-out;
}

.dq-design[data-design="b"] .b-pointer__chev {
  font-size: 20px;
  color: var(--b-copper);
  opacity: 0.75;
  animation: b-pointer-chev 4s ease-in-out infinite;
}

/* Copper trace SVG line draws in toward funnel */
.dq-design[data-design="b"] .b-pointer__trace {
  display: block;
  opacity: 1;
}

.dq-design[data-design="b"] .b-pointer__trace-line {
  stroke-dashoffset: 200;
  animation: b-pointer-trace-draw 1.8s var(--b-ease-trace) forwards,
             b-pointer-trace-breath 5s var(--b-ease-hum) 1.8s infinite;
}

@keyframes b-pointer-trace-draw {
  from { stroke-dashoffset: 200; opacity: 0; }
  to   { stroke-dashoffset: 0;   opacity: 1; }
}

@keyframes b-pointer-trace-breath {
  0%, 100% { opacity: 0.7; }
  50%      { opacity: 1; }
}

@keyframes b-pointer-tick {
  0%   { transform: translateY(-6px); opacity: 0; }
  100% { transform: translateY(0);    opacity: 1; }
}

@keyframes b-pointer-chev {
  0%, 100% { transform: translateX(0);   opacity: 0.45; }
  50%      { transform: translateX(4px); opacity: 0.9; }
}

/* ═══════════════════════════════════════════════════════════════════
   E5 — 5-step scheduling funnel
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-funnel-section {
  padding: var(--b-gap-service) clamp(16px, 4vw, 40px);
  background: var(--b-panel-bg);
}

.dq-design[data-design="b"] .b-funnel {
  max-width: 720px;
  margin-inline: auto;
  background: var(--b-panel-bg-2);
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-junction);
  padding: var(--b-gap-bus) var(--b-gap-circuit);
  position: relative;
}

/* Progress breadcrumb */
.dq-design[data-design="b"] .b-funnel__progress {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--b-gap-bus);
  display: flex;
  gap: var(--b-gap-conduit);
  flex-wrap: wrap;
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--b-ink-tertiary);
}

.dq-design[data-design="b"] .b-funnel__progress li {
  display: flex;
  align-items: center;
  gap: 6px;
}

.dq-design[data-design="b"] .b-funnel__progress span {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-cap);
  color: var(--b-ink-secondary);
  font-size: 10px;
}

.dq-design[data-design="b"] .b-funnel__progress li.is-active span {
  background: var(--b-copper);
  color: #0E1116;
  border-color: var(--b-copper);
  box-shadow: 0 0 16px -2px color-mix(in oklab, var(--b-copper-glow), transparent 55%);
}

.dq-design[data-design="b"] .b-funnel__progress li.is-done span {
  background: transparent;
  color: var(--b-copper);
  border-color: var(--b-copper);
}

/* Funnel step */
.dq-design[data-design="b"] .b-funnel__step {
  border: 0;
  padding: 0;
  margin: 0;
  animation: b-step-in var(--b-dur-trace) var(--b-ease-trace);
}

@keyframes b-step-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.dq-design[data-design="b"] .b-funnel__step h3 {
  font-family: var(--b-font-headline);
  font-size: clamp(20px, 3vw, 26px);
  letter-spacing: -0.005em;
  margin: var(--b-gap-knock) 0 var(--b-gap-circuit);
  color: var(--b-ink-primary);
}

/* Funnel option grid */
.dq-design[data-design="b"] .b-funnel__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--b-gap-conduit);
}

.dq-design[data-design="b"] .b-funnel__grid label {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--b-gap-knock);
  padding: 14px 16px;
  min-height: 52px;
  background: var(--b-panel-bg-3);
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-junction);
  cursor: pointer;
  color: var(--b-ink-primary);
  font-size: 15px;
  transition:
    border-color var(--b-dur-energize) var(--b-ease-energize),
    background var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-funnel__grid label:hover {
  border-color: color-mix(in oklab, var(--b-graphite), var(--b-copper) 40%);
}

.dq-design[data-design="b"] .b-funnel__grid label.is-hot::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--b-hot);
  border-radius: var(--b-r-junction) 0 0 var(--b-r-junction);
}

.dq-design[data-design="b"] .b-funnel__grid input[type="radio"] {
  accent-color: var(--b-copper);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.dq-design[data-design="b"] .b-funnel__grid label:has(input:checked) {
  border-color: var(--b-copper);
  box-shadow:
    inset 0 0 0 1px var(--b-copper),
    0 0 22px -8px color-mix(in oklab, var(--b-copper-glow), transparent 50%);
}

/* Contact grid — smaller options */
.dq-design[data-design="b"] .b-funnel__grid--contact {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  margin-bottom: var(--b-gap-conduit);
}

/* Lug inputs */
.dq-design[data-design="b"] .b-funnel__lugs {
  display: grid;
  gap: var(--b-gap-conduit);
}

.dq-design[data-design="b"] .b-lug {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--b-ink-secondary);
}

.dq-design[data-design="b"] .b-lug input,
.dq-design[data-design="b"] .b-lug textarea {
  font-family: var(--b-font-body);
  font-size: 16px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--b-ink-primary);
  background: var(--b-panel-bg-3);
  border: 1px solid var(--b-graphite);
  border-radius: var(--b-r-junction);
  padding: 12px 14px;
  outline: none;
  width: 100%;
  transition:
    border-color var(--b-dur-energize) var(--b-ease-energize),
    box-shadow var(--b-dur-energize) var(--b-ease-energize);
  resize: vertical;
}

.dq-design[data-design="b"] .b-lug input:focus,
.dq-design[data-design="b"] .b-lug textarea:focus {
  border-color: var(--b-copper);
  box-shadow: 0 0 0 1px var(--b-copper);
}

/* Funnel actions row */
.dq-design[data-design="b"] .b-funnel__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--b-gap-bus);
  gap: var(--b-gap-conduit);
  flex-wrap: wrap;
}

.dq-design[data-design="b"] .b-link {
  background: transparent;
  border: 0;
  color: var(--b-ink-secondary);
  font-family: var(--b-font-display);
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 8px 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  transition: color var(--b-dur-energize) var(--b-ease-energize);
}

.dq-design[data-design="b"] .b-link:hover,
.dq-design[data-design="b"] .b-link:focus-visible {
  color: var(--b-copper);
  outline: none;
}

/* Emergency hint */
.dq-design[data-design="b"] .b-funnel__emergency-hint {
  margin-top: var(--b-gap-conduit);
  padding: var(--b-gap-conduit);
  background: color-mix(in oklab, var(--b-hot), transparent 88%);
  border: 1px solid color-mix(in oklab, var(--b-hot), transparent 60%);
  border-radius: var(--b-r-junction);
  font-size: 15px;
  color: var(--b-ink-primary);
}

.dq-design[data-design="b"] .b-funnel__emergency-hint[hidden] {
  display: none;
}

.dq-design[data-design="b"] .b-funnel__emergency-hint a {
  color: var(--b-copper);
  text-decoration: none;
  font-weight: 600;
}

/* Confirmation state */
.dq-design[data-design="b"] .b-funnel__done {
  text-align: left;
  padding: var(--b-gap-circuit) 0;
  animation: b-step-in var(--b-dur-trace) var(--b-ease-trace);
}

.dq-design[data-design="b"] .b-funnel__done h3 {
  font-family: var(--b-font-headline);
  font-size: clamp(22px, 3vw, 28px);
  color: var(--b-ink-primary);
  margin: var(--b-gap-knock) 0 var(--b-gap-conduit);
}

.dq-design[data-design="b"] .b-funnel__done p {
  font-size: 16px;
  color: var(--b-ink-secondary);
}

.dq-design[data-design="b"] .b-funnel__done a {
  color: var(--b-copper);
  text-decoration: none;
  font-weight: 600;
}

/* Below-funnel metadata */
.dq-design[data-design="b"] .b-funnel-footer {
  max-width: 720px;
  margin: var(--b-gap-bus) auto 0;
  border-top: 1px solid var(--b-graphite);
  padding-top: var(--b-gap-bus);
}

.dq-design[data-design="b"] .b-funnel-footer__items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--b-gap-circuit);
}

.dq-design[data-design="b"] .b-funnel-footer__items dt {
  font-family: var(--b-font-display);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--b-ink-tertiary);
  margin-bottom: var(--b-gap-trace);
}

.dq-design[data-design="b"] .b-funnel-footer__items dd {
  font-family: var(--b-font-display);
  font-size: 13px;
  color: var(--b-ink-secondary);
  letter-spacing: 0.04em;
}

.dq-design[data-design="b"] .b-funnel-footer__items a {
  color: var(--b-copper);
  text-decoration: none;
}

.dq-design[data-design="b"] .b-funnel-footer__items a:hover {
  color: var(--b-copper-glow);
}

/* ═══════════════════════════════════════════════════════════════════
   Footer
   ═══════════════════════════════════════════════════════════════════ */
.dq-design[data-design="b"] .b-footer {
  border-top: 1px solid var(--b-graphite);
  padding: var(--b-gap-bus) clamp(16px, 4vw, 40px);
  background: var(--b-panel-bg);
}

.dq-design[data-design="b"] .b-footer__inner {
  display: flex;
  flex-wrap: wrap;
  gap: var(--b-gap-conduit);
  align-items: baseline;
  justify-content: space-between;
  font-family: var(--b-font-display);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--b-ink-tertiary);
}

.dq-design[data-design="b"] .b-footer__brand {
  display: flex;
  flex-wrap: wrap;
  gap: var(--b-gap-knock);
  align-items: baseline;
}

.dq-design[data-design="b"] .b-footer__brand strong {
  color: var(--b-ink-secondary);
  font-weight: 600;
}

.dq-design[data-design="b"] .b-footer__sep {
  color: var(--b-graphite);
}

.dq-design[data-design="b"] .b-footer__contact {
  display: flex;
  flex-wrap: wrap;
  gap: var(--b-gap-knock);
  align-items: baseline;
}

.dq-design[data-design="b"] .b-footer__contact a {
  color: var(--b-copper);
  text-decoration: none;
}

.dq-design[data-design="b"] .b-footer__contact a:hover {
  color: var(--b-copper-glow);
}

/* ═══════════════════════════════════════════════════════════════════
   Reduced-motion safety
   ═══════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .dq-design[data-design="b"] .b-busbar__current { animation: none; transform: translateX(180%); opacity: 0.5; }
  .dq-design[data-design="b"] .b-phasor-arc      { animation: none; stroke-dashoffset: 0; opacity: 0.45; }
  .dq-design[data-design="b"] .b-voltage-trace   { animation: none; stroke-dashoffset: 0; opacity: 0.35; }
  .dq-design[data-design="b"] .b-node            { animation: none; }
  .dq-design[data-design="b"] .b-hero__wash      { animation: none; }
  .dq-design[data-design="b"] .b-cta             { animation: none; }
  .dq-design[data-design="b"] .b-spool__bar      { animation: none; opacity: 0.6; }
  .dq-design[data-design="b"] .b-loadmon__pulse  { animation-play-state: paused; opacity: 0.4; }
  .dq-design[data-design="b"] .b-funnel__step,
  .dq-design[data-design="b"] .b-funnel__done    { animation: none; }
  .dq-design[data-design="b"] .b-drawer          { transition: none; }
  .dq-design[data-design="b"] .b-pointer__trace-line { animation: none; stroke-dashoffset: 0; opacity: 0.8; }
  .dq-design[data-design="b"] .b-pointer__counter-now { animation: none; }
  .dq-design[data-design="b"] .b-pointer__chev   { animation: none; }
  .dq-design[data-design="b"] .b-pointer__bar-fill { transition: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .dq-design[data-design="b"] .b-services {
    grid-template-columns: 40px 1fr;
    gap: var(--b-gap-circuit);
  }
  .dq-design[data-design="b"] .b-spool {
    height: 140px;
  }
  .dq-design[data-design="b"] .b-service-row {
    grid-template-columns: 36px 1fr auto;
    grid-template-rows: auto auto;
  }
  .dq-design[data-design="b"] .b-service-row__spec {
    grid-column: 2 / 3;
    grid-row: 2;
    font-size: 13px;
  }
  .dq-design[data-design="b"] .b-service-row__chev {
    grid-row: 1;
  }
}

@media (max-width: 560px) {
  .dq-design[data-design="b"] .b-logo__sep,
  .dq-design[data-design="b"] .b-logo__lic { display: none; }
  .dq-design[data-design="b"] .b-funnel { padding: var(--b-gap-circuit) var(--b-gap-conduit); }
  .dq-design[data-design="b"] .b-funnel__progress { gap: 10px; font-size: 10px; }
  .dq-design[data-design="b"] .b-loadmon__tag { flex-basis: 72px; font-size: 10px; }
  .dq-design[data-design="b"] .b-hero { min-height: 100svh; align-items: flex-end; padding-bottom: var(--b-gap-main); }
  .dq-design[data-design="b"] .b-spec-strip { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 380px) {
  .dq-design[data-design="b"] .b-header__bar { padding-inline: 12px; min-height: 56px; }
  .dq-design[data-design="b"] .b-funnel__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════
   Chrome isolation — HARD CONTRACT
   No bare element/img/svg rules; all scoped under .dq-design
   ═══════════════════════════════════════════════════════════════════ */

/* Mobile no-hscroll — appended 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; }