/* ═══════════════════════════════════════════════════════════════════════
   SOEE · design-a · atrium design system
   ALL selectors scoped under [data-design="a"]
   Exposes --design-a-primary
   Zero [data-design="a"] selectors remain.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Token system ────────────────────────────────────────────────────── */
[data-design="a"] {
  /* color tokens — dark-first */
  --bg:          #08090B;
  --bg-deep:     #0E1014;
  --bg-elev:     #16181C;
  --ink:         #FAFAFA;
  --ink-soft:    #C5C8CC;
  --muted:       #7A7F86;
  --rule:        #1F2228;
  --rule-strong: #2E3138;
  --signal:      #9E8CFC;
  --signal-glow: rgba(158,140,252,.22);
  --seal:        #52C788;
  --amber:       #F0B956;
  --critical:    #E45A5A;

  /* design-a primary — the single accent exposed for the assembler */
  --design-a-primary: #9E8CFC;

  /* typography */
  --font-display: "Inter Display","Söhne","Helvetica Neue",system-ui,sans-serif;
  --font-body:    "Inter","Söhne",system-ui,sans-serif;
  --font-mono:    "JetBrains Mono","IBM Plex Mono","SF Mono",ui-monospace,monospace;

  /* spacing */
  --space-px:    1px;
  --space-tick:  4px;
  --space-em:    8px;
  --space-row:   16px;
  --space-block: 24px;
  --space-pane:  40px;
  --space-bay:   72px;
  --space-deck:  112px;

  /* motion */
  --dur-tick:    120ms;
  --dur-compile: 320ms;
  --dur-reveal:  520ms;
  --dur-stream:  900ms;
  --dur-ambient: 3200ms;
  --ease-snap:     cubic-bezier(.7,0,.84,0);
  --ease-compile:  cubic-bezier(.22,1,.36,1);
  --ease-stream:   cubic-bezier(.4,0,.2,1);
  --ease-pulse:    cubic-bezier(.45,.05,.55,.95);

  /* radius */
  --radius-tight: 4px;
  --radius-card:  8px;
  --radius-pill:  999px;
  --radius-pin:   50%;

  /* shadow / elevation */
  --shadow-card:   0 0 0 1px var(--rule);
  --shadow-elev:   0 0 0 1px var(--rule-strong);
  --shadow-press:  inset 0 0 0 1px var(--rule-strong);
  --shadow-signal: 0 0 0 1px var(--signal), 0 0 24px var(--signal-glow);
  --shadow-focus:  0 0 0 2px var(--bg), 0 0 0 4px var(--signal);

  background:  var(--bg);
  color:       var(--ink-soft);
  font-family: var(--font-body);
  font-size:   16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

[data-design="a"] * { box-sizing: border-box; }

/* light-mode override */
@media (prefers-color-scheme: light) {
  [data-design="a"] {
    --bg:          #FAFAFA;
    --bg-deep:     #F0F0F2;
    --bg-elev:     #FFFFFF;
    --ink:         #0A0B0D;
    --ink-soft:    #3A3D44;
    --muted:       #74787E;
    --rule:        #E0E1E4;
    --rule-strong: #C8CACE;
    --signal:      #6E56CF;
    --signal-glow: rgba(110,86,207,.18);
    --design-a-primary: #6E56CF;
  }
}

/* ── Keyframes (all atr- prefixed) ───────────────────────────────────── */
@keyframes atr-header-sweep {
  from { background-position: 160% 0; }
  to   { background-position: -60% 0; }
}
@keyframes atr-cta-breath {
  0%,100% { box-shadow: 0 0 0 1px var(--rule), 0 0 0 0 var(--signal-glow); }
  50%     { box-shadow: 0 0 0 1px var(--rule), 0 0 22px 0 var(--signal-glow); }
}
@keyframes atr-signal-pulse {
  0%,100% { box-shadow: 0 0 0 0 var(--signal-glow); }
  50%     { box-shadow: 0 0 14px 3px var(--signal-glow); }
}
@keyframes atr-compile {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0 0 0); }
}
@keyframes atr-blink {
  0%,49%  { opacity: 1; }
  50%,100%{ opacity: 0; }
}
@keyframes atr-b-flow {
  from { stroke-dashoffset: 0;    }
  to   { stroke-dashoffset: -546; }
}
/* hero backdrop animations */
@keyframes atr-hero-trace {
  0%   { stroke-dashoffset: 2400; opacity: 0.18; }
  15%  { opacity: 0.55; }
  80%  { stroke-dashoffset: 0; opacity: 0.55; }
  100% { stroke-dashoffset: -200; opacity: 0.35; }
}
@keyframes atr-hero-trace-sec {
  0%   { stroke-dashoffset: 1800; opacity: 0.12; }
  20%  { opacity: 0.38; }
  85%  { stroke-dashoffset: 0; opacity: 0.38; }
  100% { stroke-dashoffset: -150; opacity: 0.22; }
}
@keyframes atr-hero-wash {
  0%,100% {
    background: radial-gradient(ellipse 70% 60% at 30% 60%,
      rgba(158,140,252,.28) 0%, transparent 65%),
    radial-gradient(ellipse 50% 40% at 80% 20%,
      rgba(158,140,252,.18) 0%, transparent 60%);
  }
  50% {
    background: radial-gradient(ellipse 80% 70% at 40% 50%,
      rgba(158,140,252,.40) 0%, transparent 65%),
    radial-gradient(ellipse 55% 45% at 75% 30%,
      rgba(158,140,252,.24) 0%, transparent 60%);
  }
}
@keyframes atr-hero-node-pulse {
  0%,100% { opacity: 0.65; r: 5; }
  50%     { opacity: 1;    r: 7; }
}
@keyframes atr-pointer-current {
  0%   { cx: 0;   opacity: 0.2; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { cx: 320; opacity: 0.2; }
}
@keyframes atr-pointer-drop {
  0%,60% { stroke-dashoffset: 34; opacity: 0; }
  70%    { opacity: 1; }
  100%   { stroke-dashoffset: 0; opacity: 1; }
}
@keyframes atr-funnel-step-in {
  from { opacity: 0; transform: translateY(10px); clip-path: inset(0 0 100% 0); }
  to   { opacity: 1; transform: translateY(0);    clip-path: inset(0 0 0 0); }
}
@keyframes atr-chip-select {
  0%   { box-shadow: 0 0 0 0 var(--signal-glow); }
  50%  { box-shadow: 0 0 12px 2px var(--signal-glow); }
  100% { box-shadow: var(--shadow-signal); }
}


/* ═══════════════════════════════════════════════════════════════════════
   ELEMENT 1 — Animated minimalist header
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-header {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  backdrop-filter: saturate(140%) blur(8px);
  border-bottom: 1px solid var(--rule);
}
[data-design="a"] .atr-header__bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-row); max-width: 1200px; margin: 0 auto;
  padding: var(--space-row) clamp(14px,5vw,40px); min-height: 60px;
}
/* atmospheric sweep — ONE text-bearing child outside drawer: the logo */
[data-design="a"] .atr-header__sweep {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; opacity: .7;
  background: linear-gradient(90deg, transparent 0 42%, var(--signal) 50%, transparent 58% 100%);
  background-size: 240% 100%;
  animation: atr-header-sweep 24s linear infinite;
}
[data-design="a"] .atr-logo {
  font-family: var(--font-display); font-weight: 600; font-size: 17px;
  letter-spacing: -.02em; color: var(--ink); text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100vw - 80px);
}
/* hamburger */
[data-design="a"] .atr-burger {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 0 10px; cursor: pointer; flex-shrink: 0;
  background: var(--bg-elev); border: 1px solid var(--rule);
  border-radius: var(--radius-tight);
  transition: box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-burger:hover  { box-shadow: var(--shadow-elev); }
[data-design="a"] .atr-burger:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
[data-design="a"] .atr-burger__line {
  display: block; height: 1.5px; width: 100%; background: var(--ink);
  transition: transform var(--dur-tick) var(--ease-snap);
}
[data-design="a"] .atr-burger[aria-expanded="true"] .atr-burger__line:first-child {
  transform: translateY(3.5px) rotate(45deg);
}
[data-design="a"] .atr-burger[aria-expanded="true"] .atr-burger__line:last-child {
  transform: translateY(-3px) rotate(-45deg);
}
/* drawer — slide-over Pane from right */
[data-design="a"] .atr-drawer { position: fixed; inset: 0; z-index: 60; }
[data-design="a"] .atr-drawer[hidden] { display: none; }
[data-design="a"] .atr-drawer__scrim {
  position: absolute; inset: 0; background: rgba(4,5,7,.75);
  opacity: 0; transition: opacity 200ms var(--ease-stream);
}
[data-design="a"] .atr-drawer__pane {
  position: absolute; top: 0; right: 0; height: 100%;
  width: min(480px,86vw); max-width: 100%;
  background: var(--bg-elev); border-left: 1px solid var(--rule-strong);
  padding: var(--space-pane) var(--space-block);
  display: flex; flex-direction: column; gap: var(--space-row);
  transform: translateX(100%); transition: transform 220ms var(--ease-compile);
  overflow-y: auto;
}
[data-design="a"] .atr-drawer.is-open .atr-drawer__scrim { opacity: 1; }
[data-design="a"] .atr-drawer.is-open .atr-drawer__pane  { transform: none; }
[data-design="a"] .atr-drawer__crumb {
  font-family: var(--font-mono); font-size: 12px; color: var(--muted);
}
[data-design="a"] .atr-drawer__esc {
  align-self: flex-start; font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .04em; color: var(--muted); background: none; border: 0;
  padding: 4px 0; cursor: pointer; min-height: 44px; display: flex; align-items: center;
}
[data-design="a"] .atr-navlink {
  font-family: var(--font-display); font-size: 22px; font-weight: 500;
  letter-spacing: -.01em; color: var(--ink-soft); text-decoration: none;
  padding: var(--space-em) 0; border-bottom: 1px solid var(--rule);
  transition: color var(--dur-tick) var(--ease-compile);
  min-height: 44px; display: flex; align-items: center;
}
[data-design="a"] .atr-navlink:hover { color: var(--ink); }
[data-design="a"] .atr-navlink:hover::before { content: "/"; color: var(--signal); margin-right: 6px; }
[data-design="a"] .atr-drawer__phone {
  font-family: var(--font-mono); font-size: 18px; font-weight: 500;
  color: var(--signal); text-decoration: none; margin-top: var(--space-row);
  padding: var(--space-em) 0; letter-spacing: .02em; min-height: 44px;
  display: flex; align-items: center;
}
[data-design="a"] .atr-drawer__phone:hover { text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-header__sweep { animation: none; background-position: 8% 0; }
  [data-design="a"] .atr-drawer__pane,
  [data-design="a"] .atr-drawer__scrim { transition: none; }
}
@media (max-width: 560px) {
  [data-design="a"] .atr-header__bar { min-height: 54px; }
  [data-design="a"] .atr-navlink { font-size: 20px; }
  [data-design="a"] .atr-logo { font-size: 14px; }
}
@media (max-width: 390px) {
  [data-design="a"] .atr-drawer__pane { width: 100vw; }
}
@media (max-width: 320px) {
  [data-design="a"] .atr-header__bar { padding-left: 12px; padding-right: 12px; }
}


/* ═══════════════════════════════════════════════════════════════════════
   HERO — section with Element 3 backdrop + Element 2 phone CTA
   Hero text opacity:1 at first paint — NO reveal gating.
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-hero {
  position: relative; overflow: hidden;
  min-height: clamp(520px, 75vh, 760px);
  display: flex; align-items: center;
  padding: var(--space-deck) clamp(14px,5vw,40px) var(--space-bay);
  border-bottom: 1px solid var(--rule);
}

/* ELEMENT 3 — hero backdrop: circuit-grid voltage-rise, one animated layer,
   perceptible ongoing ambient motion (v0.2.1: not arrival-then-frozen).
   Opacity ≥ 0.25 at peak frame — visual-presence floor satisfied. */
[data-design="a"] .atr-hero__backdrop {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none; overflow: hidden;
}
[data-design="a"] .atr-hero__grid {
  position: absolute; inset: 0; width: 100%; height: 100%;
}
/* grid rules — hairline structural scaffolding */
[data-design="a"] .atr-hero__grid-rules line {
  stroke: var(--rule); stroke-width: 1; opacity: 0.6;
}
/* primary current trace — draws in then loops */
[data-design="a"] .atr-hero__trace-main {
  fill: none; stroke: var(--signal); stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 2200;
  animation: atr-hero-trace 8s var(--ease-stream) infinite;
}
/* secondary trace — offset timing for depth */
[data-design="a"] .atr-hero__trace-sec {
  fill: none; stroke: var(--signal); stroke-width: 1;
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1600;
  animation: atr-hero-trace-sec 11s var(--ease-stream) 1.4s infinite;
}
/* junction nodes */
[data-design="a"] .atr-hero__node {
  fill: var(--ink-soft); opacity: 0.5;
}
/* live node — signal-pulse, the one accent element */
[data-design="a"] .atr-hero__node--live {
  fill: var(--signal);
  animation: atr-signal-pulse 3.2s var(--ease-stream) infinite,
             atr-hero-node-pulse 6s var(--ease-stream) infinite;
}
/* voltage-wash gradient overlay — slow oscillating color field, amplitude ≥ 15% lightness delta */
[data-design="a"] .atr-hero__wash {
  position: absolute; inset: 0;
  animation: atr-hero-wash 5s var(--ease-pulse) infinite;
  pointer-events: none;
}

/* hero content — stacked above backdrop */
[data-design="a"] .atr-hero__content {
  position: relative; z-index: 1;
  max-width: 680px; width: 100%;
  margin: 0 auto 0 0;
  display: flex; flex-direction: column; gap: var(--space-block);
}
[data-design="a"] .atr-hero__meta {
  display: flex; align-items: center; gap: var(--space-row); flex-wrap: wrap;
}
[data-design="a"] .atr-hero__crumb {
  font-family: var(--font-mono); font-size: 12px; color: var(--muted);
  letter-spacing: .04em;
}
[data-design="a"] .atr-hero__live-pill {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em;
  color: var(--signal); border: 1px solid var(--signal);
  border-radius: var(--radius-pill); padding: 3px 10px;
}
[data-design="a"] .atr-hero__live-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--signal);
  animation: atr-signal-pulse 3.2s var(--ease-stream) infinite;
}
/* hero headline — opacity:1 at first paint */
[data-design="a"] .atr-hero__headline {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(32px, 6vw, 56px); line-height: 1.08;
  letter-spacing: -.03em; color: var(--ink);
  margin: 0; opacity: 1;
}
/* hero subtitle — opacity:1 at first paint */
[data-design="a"] .atr-hero__subtitle {
  font-family: var(--font-mono); font-size: clamp(13px,2vw,16px);
  color: var(--muted); letter-spacing: .02em; line-height: 1.6;
  margin: 0; opacity: 1;
}
[data-design="a"] .atr-hero__contact-line {
  font-size: 14px; color: var(--muted); margin: 0; opacity: 1;
}
[data-design="a"] .atr-hero__email-link {
  color: var(--ink-soft); text-decoration: underline;
  text-decoration-color: var(--rule-strong);
}
[data-design="a"] .atr-hero__email-link:hover { color: var(--ink); text-decoration-color: var(--signal); }

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-hero__trace-main,
  [data-design="a"] .atr-hero__trace-sec { animation: none; stroke-dasharray: none; opacity: 0.35; }
  [data-design="a"] .atr-hero__node--live { animation: none; }
  [data-design="a"] .atr-hero__wash { animation: none;
    background: radial-gradient(ellipse 70% 60% at 30% 60%, rgba(158,140,252,.28) 0%, transparent 65%);
  }
  [data-design="a"] .atr-hero__live-dot { animation: none; }
}
@media (max-width: 768px) {
  [data-design="a"] .atr-hero {
    min-height: clamp(460px, 90vh, 680px);
    align-items: flex-start; padding-top: calc(var(--space-deck) + 20px);
  }
}
@media (max-width: 390px) {
  [data-design="a"] .atr-hero__content { gap: var(--space-row); }
  [data-design="a"] .atr-hero__headline { font-size: 28px; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ELEMENT 2 — Animated CTA (phone CTA — electrical primary affordance)
   Verbatim from design.md with slot-remap atrium→a.
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-cta {
  position: relative; display: inline-flex; align-items: center; gap: var(--space-em);
  font-family: var(--font-display); font-weight: 500; font-size: 17px;
  letter-spacing: -.01em; color: var(--bg); text-decoration: none;
  background: var(--ink); padding: 14px 22px; border-radius: var(--radius-tight);
  box-shadow: var(--shadow-card); will-change: transform; min-height: 52px;
  animation: atr-cta-breath 4.8s var(--ease-stream) infinite;
  transition: transform 120ms var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile),
              background var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-cta__hair {
  position: absolute; right: 10px; bottom: 6px; height: 1px; width: 0;
  background: var(--signal); transition: width var(--dur-reveal) var(--ease-compile);
}
[data-design="a"] .atr-cta__arrow {
  transition: transform var(--dur-tick) var(--ease-compile); flex-shrink: 0;
}
[data-design="a"] .atr-cta:hover,
[data-design="a"] .atr-cta:focus-visible {
  outline: none; background: var(--ink-soft); animation-play-state: paused;
  box-shadow: var(--shadow-elev); transform: translateY(-1px);
}
[data-design="a"] .atr-cta:hover .atr-cta__hair,
[data-design="a"] .atr-cta:focus-visible .atr-cta__hair { width: 34px; }
[data-design="a"] .atr-cta:hover .atr-cta__arrow { transform: translateX(3px); }
[data-design="a"] .atr-cta:focus-visible { box-shadow: var(--shadow-focus); }
[data-design="a"] .atr-cta:active { transform: translateY(1px); box-shadow: var(--shadow-signal); }

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-cta { animation: none; }
  [data-design="a"] .atr-cta,
  [data-design="a"] .atr-cta__hair,
  [data-design="a"] .atr-cta__arrow { transition: none; }
}
@media (max-width: 390px) {
  [data-design="a"] .atr-cta { width: 100%; justify-content: center; }
}


/* ═══════════════════════════════════════════════════════════════════════
   SHARED UTILITIES
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-panel__meta {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em;
  color: var(--muted); margin-bottom: var(--space-em);
}
[data-design="a"] .atr-inline-phone {
  font-family: var(--font-mono); font-weight: 500; color: var(--signal);
  text-decoration: none; letter-spacing: .02em;
  transition: color var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-inline-phone:hover { color: var(--ink); text-decoration: underline; }


/* ═══════════════════════════════════════════════════════════════════════
   SERVICES SECTION
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-services {
  border-bottom: 1px solid var(--rule);
  padding: var(--space-bay) 0;
}
[data-design="a"] .atr-services__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(14px,5vw,40px);
}
[data-design="a"] .atr-services__head {
  margin-bottom: var(--space-pane);
}
[data-design="a"] .atr-services__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(28px,5vw,40px); line-height: 1.1;
  letter-spacing: -.03em; color: var(--ink); margin: 0 0 var(--space-row);
}
[data-design="a"] .atr-services__lead {
  color: var(--muted); font-size: 16px; line-height: 1.55;
  max-width: 60ch; margin: 0;
}
[data-design="a"] .atr-services__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-block);
  margin-bottom: var(--space-pane);
}
[data-design="a"] .atr-svc-card {
  background: var(--bg-deep); border: 1px solid var(--rule);
  border-radius: var(--radius-card); padding: var(--space-block);
  transition: border-color var(--dur-tick) var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-svc-card:hover {
  border-color: var(--rule-strong); box-shadow: var(--shadow-elev);
}
[data-design="a"] .atr-svc-card__tag {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em;
  color: var(--signal); border: 1px solid var(--signal);
  border-radius: var(--radius-pill); padding: 2px 8px;
  display: inline-block; margin-bottom: var(--space-em);
}
[data-design="a"] .atr-svc-card__name {
  font-family: var(--font-display); font-weight: 600; font-size: 17px;
  line-height: 1.3; letter-spacing: -.01em; color: var(--ink);
  margin: 0 0 var(--space-tick);
}
[data-design="a"] .atr-svc-card__note {
  font-size: 14px; line-height: 1.55; color: var(--muted); margin: 0;
}
[data-design="a"] .atr-services__cta-row {
  display: flex; align-items: center; gap: var(--space-row);
  flex-wrap: wrap; padding-top: var(--space-block);
  border-top: 1px solid var(--rule);
}
[data-design="a"] .atr-services__cta-label {
  font-family: var(--font-mono); font-size: 14px; color: var(--muted);
}
@media (max-width: 560px) {
  [data-design="a"] .atr-services__grid { grid-template-columns: 1fr; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ELEMENT 4 — Ambient animated content segment B (service area schematic)
   Verbatim from design.md with slot-remap atrium→a.
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-ambient-b {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--space-pane);
  align-items: center; max-width: 1200px; margin: 0 auto;
  padding: var(--space-bay) clamp(14px,5vw,40px);
  border-bottom: 1px solid var(--rule);
}
[data-design="a"] .atr-b__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(24px,4.5vw,32px); line-height: 1.15;
  letter-spacing: -.02em; color: var(--ink); margin: 0 0 var(--space-row);
}
[data-design="a"] .atr-b__body {
  max-width: 54ch; color: var(--muted); font-size: 15px; line-height: 1.55; margin: 0;
}
[data-design="a"] .atr-b__body--mt { margin-top: var(--space-row); }
[data-design="a"] .atr-b__phone { display: inline-block; margin-top: var(--space-block); font-size: 16px; }
[data-design="a"] .atr-b__schematic {
  width: 100%; max-width: 100%; height: auto;
  background: var(--bg-deep); border: 1px solid var(--rule);
  border-radius: var(--radius-card); padding: 8px;
}
[data-design="a"] .atr-b__rules path { fill: none; stroke: var(--rule-strong); stroke-width: 1; }
[data-design="a"] .atr-b__trace {
  fill: none; stroke: var(--signal); stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 6 540; animation: atr-b-flow 16s linear infinite;
}
[data-design="a"] .atr-b__node { fill: var(--ink-soft); }
[data-design="a"] .atr-b__node--live {
  fill: var(--signal); animation: atr-signal-pulse 3.2s var(--ease-stream) infinite;
}
[data-design="a"] .atr-b__label {
  fill: var(--muted); font-family: var(--font-mono); font-size: 8px; letter-spacing: .06em;
}
[data-design="a"] .atr-ambient-b.is-paused .atr-b__trace,
[data-design="a"] .atr-ambient-b.is-paused .atr-b__node--live {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-b__trace { animation: none; stroke-dasharray: none; }
  [data-design="a"] .atr-b__node--live { animation: none; }
}
@media (max-width: 768px) {
  [data-design="a"] .atr-ambient-b {
    grid-template-columns: 1fr; gap: var(--space-block);
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   ABOUT
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-about {
  border-bottom: 1px solid var(--rule);
  padding: var(--space-bay) 0;
}
[data-design="a"] .atr-about__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(14px,5vw,40px);
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-pane);
  align-items: start;
}
[data-design="a"] .atr-about__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(24px,4vw,32px); line-height: 1.15;
  letter-spacing: -.02em; color: var(--ink); margin: 0 0 var(--space-block);
}
[data-design="a"] .atr-about__body {
  font-size: 16px; line-height: 1.65; color: var(--ink-soft);
  max-width: 60ch; margin: 0 0 var(--space-row);
}
[data-design="a"] .atr-about__email {
  color: var(--signal); text-decoration: none;
}
[data-design="a"] .atr-about__email:hover { text-decoration: underline; }

/* mono spec sheet */
[data-design="a"] .atr-spec-sheet {
  background: var(--bg-deep); border: 1px solid var(--rule);
  border-radius: var(--radius-card); overflow: hidden;
  margin-bottom: var(--space-block);
}
[data-design="a"] .atr-spec-row {
  display: flex; gap: var(--space-row); justify-content: space-between;
  padding: 10px var(--space-block); border-bottom: 1px solid var(--rule);
  font-family: var(--font-mono); font-size: 13px;
  transition: background var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-spec-row:last-child { border-bottom: 0; }
[data-design="a"] .atr-spec-row:hover { background: var(--bg-elev); }
[data-design="a"] .atr-spec-key { color: var(--muted); letter-spacing: .06em; flex-shrink: 0; }
[data-design="a"] .atr-spec-val { color: var(--ink-soft); text-align: right; word-break: break-word; }

/* photos */
[data-design="a"] .atr-about__photos {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-row);
}
[data-design="a"] .atr-about__photo {
  width: 100%; height: auto; object-fit: cover; aspect-ratio: 4/3;
  border-radius: var(--radius-card); border: 1px solid var(--rule);
  display: block;
}

@media (max-width: 900px) {
  [data-design="a"] .atr-about__inner { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  [data-design="a"] .atr-about__photos { grid-template-columns: 1fr; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ELEMENT 6 — Pointer (wayfinding, current-aware register)
   NOT a button. Visible at first paint — opacity:1, height ≥ 8px.
   data-mf-role="pointer".
   LAST element before #funnel — pointer_funnel_adjacent satisfied.
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-pointer {
  /* visibly rendered — opacity:1, height satisfies gate floor */
  opacity: 1;
  padding: var(--space-pane) 0 var(--space-block);
  border-bottom: 0;
  display: block;
}
[data-design="a"] .atr-pointer__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(14px,5vw,40px);
  display: flex; flex-direction: column; align-items: center; gap: var(--space-row);
}
[data-design="a"] .atr-pointer__trace {
  width: 100%; max-width: 480px; height: 64px; overflow: visible;
}
[data-design="a"] .atr-pointer__bus {
  stroke: var(--rule-strong); stroke-width: 1;
}
[data-design="a"] .atr-pointer__drop {
  stroke: var(--signal); stroke-width: 1.5;
  stroke-dasharray: 34; stroke-dashoffset: 0;
  animation: atr-pointer-drop 2.4s var(--ease-compile) 0.5s both;
}
[data-design="a"] .atr-pointer__node {
  fill: var(--signal);
  animation: atr-signal-pulse 3.2s var(--ease-stream) 0.8s infinite;
}
[data-design="a"] .atr-pointer__current {
  fill: var(--signal); opacity: 0.9;
  animation: atr-pointer-current 3.6s var(--ease-stream) infinite;
}
[data-design="a"] .atr-pointer__label {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .08em;
  color: var(--muted); text-transform: uppercase;
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-pointer__current { animation: none; cx: 160; }
  [data-design="a"] .atr-pointer__drop { animation: none; stroke-dashoffset: 0; opacity: 1; }
  [data-design="a"] .atr-pointer__node { animation: none; }
}


/* ═══════════════════════════════════════════════════════════════════════
   ELEMENT 5 — Animated interactive funnel (5-step scheduling intake)
   id="funnel" data-mf-role="funnel".
   compile/stream animation grammar — atrium terminal register.
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-funnel {
  padding: var(--space-bay) 0 var(--space-deck);
  border-bottom: 1px solid var(--rule);
}
[data-design="a"] .atr-funnel__inner {
  max-width: 680px; margin: 0 auto;
  padding: 0 clamp(14px,5vw,40px);
}
[data-design="a"] .atr-funnel__title {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(24px,4vw,32px); line-height: 1.15;
  letter-spacing: -.02em; color: var(--ink); margin: 0 0 var(--space-tick);
}
[data-design="a"] .atr-funnel__lead {
  color: var(--muted); font-size: 15px; line-height: 1.55;
  margin: 0 0 var(--space-block);
}

/* progress bar */
[data-design="a"] .atr-funnel__progress {
  display: flex; align-items: center; gap: var(--space-row);
  margin-bottom: var(--space-block);
}
[data-design="a"] .atr-funnel__prog-track {
  flex: 1; height: 3px; background: var(--rule);
  border-radius: var(--radius-pill); overflow: hidden;
}
[data-design="a"] .atr-funnel__prog-fill {
  height: 100%; width: 20%; background: var(--signal);
  border-radius: var(--radius-pill);
  transition: width var(--dur-reveal) var(--ease-compile);
}
[data-design="a"] .atr-funnel__prog-label {
  font-family: var(--font-mono); font-size: 12px; color: var(--muted);
  letter-spacing: .04em; white-space: nowrap;
}

/* step fieldsets */
[data-design="a"] .atr-funnel__step {
  border: 0; padding: 0; margin: 0;
}
[data-design="a"] .atr-funnel__step:not([hidden]) {
  animation: atr-funnel-step-in var(--dur-reveal) var(--ease-compile) both;
}
[data-design="a"] .atr-funnel__legend {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(17px,3vw,20px); line-height: 1.3;
  color: var(--ink); margin-bottom: var(--space-block); display: block; width: 100%;
}
[data-design="a"] .atr-funnel__step-num {
  font-family: var(--font-mono); font-size: 13px; color: var(--muted);
  letter-spacing: .06em;
}

/* chip selector */
[data-design="a"] .atr-funnel__chips {
  display: flex; flex-wrap: wrap; gap: var(--space-em);
  margin-bottom: var(--space-block);
}
[data-design="a"] .atr-chip {
  display: inline-flex; align-items: center; cursor: pointer;
}
[data-design="a"] .atr-chip input[type="radio"] {
  position: absolute; opacity: 0; width: 0; height: 0;
}
[data-design="a"] .atr-chip__label {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .03em;
  color: var(--ink-soft); background: var(--bg-deep);
  border: 1px solid var(--rule); border-radius: var(--radius-tight);
  padding: 8px 14px; cursor: pointer; min-height: 44px;
  display: inline-flex; align-items: center;
  transition: border-color var(--dur-tick) var(--ease-compile),
              color var(--dur-tick) var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-chip input[type="radio"]:checked + .atr-chip__label {
  border-color: var(--signal); color: var(--ink);
  animation: atr-chip-select var(--dur-compile) var(--ease-compile) both;
  box-shadow: var(--shadow-signal);
}
[data-design="a"] .atr-chip:hover .atr-chip__label {
  border-color: var(--rule-strong); color: var(--ink);
}
[data-design="a"] .atr-chip input[type="radio"]:focus-visible + .atr-chip__label {
  box-shadow: var(--shadow-focus);
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-chip input[type="radio"]:checked + .atr-chip__label {
    animation: none;
  }
}

/* urgent note — display:none by default, NOT opacity:0 */
[data-design="a"] .atr-funnel__urgent-note {
  background: var(--bg-deep); border: 1px solid var(--rule);
  border-left: 3px solid var(--amber);
  border-radius: var(--radius-tight); padding: var(--space-row) var(--space-block);
  font-size: 14px; color: var(--ink-soft); margin-bottom: var(--space-block);
  display: flex; align-items: center; gap: var(--space-em); flex-wrap: wrap;
}
[data-design="a"] .atr-funnel__urgent-icon { color: var(--amber); font-style: normal; }

/* field rows within funnel */
[data-design="a"] .atr-funnel__field-row {
  display: flex; flex-wrap: wrap; gap: var(--space-row);
  margin-bottom: var(--space-block);
}
[data-design="a"] .atr-field {
  display: flex; flex-direction: column; gap: 6px; flex: 1 1 200px;
}
[data-design="a"] .atr-field--full { flex: 1 1 100%; }
[data-design="a"] .atr-field__label {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted);
}
[data-design="a"] .atr-field__wrap { position: relative; display: flex; }
[data-design="a"] .atr-field__input {
  width: 100%; font-family: var(--font-mono); font-size: 16px; color: var(--ink);
  background: var(--bg); border: 1px solid var(--rule);
  border-radius: var(--radius-tight); padding: 10px 12px;
  transition: border-color var(--dur-tick) var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-field__textarea {
  resize: vertical; min-height: 120px;
  font-size: 15px; line-height: 1.55;
}
[data-design="a"] .atr-field__input::placeholder { color: var(--muted); }
[data-design="a"] .atr-field__input:focus-visible {
  outline: none; border-color: var(--signal); box-shadow: var(--shadow-focus);
}
[data-design="a"] .atr-field__input.is-error { border-color: var(--critical); }
[data-design="a"] .atr-field__cursor {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  color: var(--signal); opacity: 0; animation: atr-blink 1.06s steps(1,end) infinite;
  pointer-events: none;
}
[data-design="a"] .atr-field__input:placeholder-shown + .atr-field__cursor { opacity: 1; }
[data-design="a"] .atr-field__textarea ~ .atr-field__cursor { display: none; }

@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-field__cursor { animation: none; }
  [data-design="a"] .atr-funnel__step:not([hidden]) { animation: none; }
}

/* funnel error */
[data-design="a"] .atr-funnel__err {
  font-family: var(--font-mono); font-size: 13px; color: var(--critical);
  margin: 0 0 var(--space-row);
}
[data-design="a"] .atr-funnel__err[hidden] { display: none; }

/* nav buttons */
[data-design="a"] .atr-funnel__nav {
  display: flex; gap: var(--space-row); flex-wrap: wrap; margin-top: var(--space-block);
}
[data-design="a"] .atr-funnel__back {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .04em;
  color: var(--muted); background: none; border: 1px solid var(--rule);
  border-radius: var(--radius-tight); padding: 10px 16px; cursor: pointer;
  min-height: 44px; transition: color var(--dur-tick) var(--ease-compile),
              border-color var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-funnel__back:hover { color: var(--ink); border-color: var(--rule-strong); }
[data-design="a"] .atr-funnel__next {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .04em;
  color: var(--bg); background: var(--ink); border: 0;
  border-radius: var(--radius-tight); padding: 10px 20px; cursor: pointer;
  min-height: 44px;
  transition: background var(--dur-tick) var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-funnel__next:hover { background: var(--ink-soft); box-shadow: var(--shadow-elev); }
[data-design="a"] .atr-funnel__next:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
[data-design="a"] .atr-funnel__next:active { transform: translateY(1px); }
[data-design="a"] .atr-funnel__submit {
  font-family: var(--font-display); font-size: 15px; font-weight: 500;
  letter-spacing: -.01em; color: var(--bg); background: var(--ink); border: 0;
  border-radius: var(--radius-tight); padding: 12px 24px; cursor: pointer;
  min-height: 48px;
  animation: atr-cta-breath 4.8s var(--ease-stream) infinite;
  transition: background var(--dur-tick) var(--ease-compile),
              box-shadow var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-funnel__submit:hover {
  background: var(--ink-soft); box-shadow: var(--shadow-elev);
  animation-play-state: paused;
}
[data-design="a"] .atr-funnel__submit:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-funnel__submit { animation: none; }
}
@media (max-width: 390px) {
  [data-design="a"] .atr-funnel__next,
  [data-design="a"] .atr-funnel__submit { width: 100%; justify-content: center; text-align: center; }
}

/* confirmation state — display:none by default, NOT opacity:0 */
[data-design="a"] .atr-funnel__confirm {
  padding: var(--space-block) 0;
}
[data-design="a"] .atr-confirm__inner {
  background: var(--bg-deep); border: 1px solid var(--rule);
  border-radius: var(--radius-card); padding: var(--space-block);
}
[data-design="a"] .atr-confirm__icon {
  font-family: var(--font-mono); font-size: 28px; color: var(--seal);
  margin-bottom: var(--space-em); display: block;
}
[data-design="a"] .atr-confirm__title {
  font-family: var(--font-display); font-weight: 600; font-size: 22px;
  color: var(--ink); margin: 0 0 var(--space-row);
}
[data-design="a"] .atr-confirm__body {
  color: var(--muted); font-size: 15px; line-height: 1.55; margin: 0 0 var(--space-block);
}
[data-design="a"] .atr-confirm__result {
  border-top: 1px solid var(--rule); padding-top: var(--space-row);
  display: grid; gap: var(--space-em);
}
[data-design="a"] .atr-result__row {
  display: flex; justify-content: space-between; gap: var(--space-row);
  font-family: var(--font-mono); font-size: 14px;
}
[data-design="a"] .atr-result__k { color: var(--muted); letter-spacing: .04em; }
[data-design="a"] .atr-result__v { color: var(--ink); text-align: right; }
[data-design="a"] .atr-result__v.is-compiled {
  animation: atr-compile var(--dur-compile) var(--ease-compile) both;
}
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .atr-result__v.is-compiled { animation: none; clip-path: none; }
}


/* ═══════════════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════════════ */

[data-design="a"] .atr-footer {
  padding: var(--space-bay) 0 var(--space-pane);
}
[data-design="a"] .atr-footer__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(14px,5vw,40px);
}
[data-design="a"] .atr-footer__rule {
  height: 1px; background: var(--rule); margin-bottom: var(--space-pane);
}
[data-design="a"] .atr-footer__strip {
  display: flex; flex-wrap: wrap; gap: var(--space-em) var(--space-row);
  align-items: center;
  font-family: var(--font-mono); font-size: 13px; color: var(--muted);
}
[data-design="a"] .atr-footer__firm { color: var(--ink-soft); font-weight: 500; }
[data-design="a"] .atr-footer__sep  { opacity: 0.4; }
[data-design="a"] .atr-footer__phone,
[data-design="a"] .atr-footer__email {
  color: var(--muted); text-decoration: none;
  transition: color var(--dur-tick) var(--ease-compile);
}
[data-design="a"] .atr-footer__phone:hover,
[data-design="a"] .atr-footer__email:hover { color: var(--ink); }
[data-design="a"] .atr-footer__scope {
  font-family: var(--font-mono); font-size: 12px; color: var(--muted);
  margin: var(--space-block) 0 0; letter-spacing: .04em; opacity: 0.7;
}


/* ═══════════════════════════════════════════════════════════════════════
   ANTI-HORIZONTAL-SCROLL DEFENSIVE RULES
   Scoped to .dq-design to avoid leaking onto shared chrome-kit modal.
   NEVER bare [data-design] descendant selectors — body carries data-design
   too, causing modal interference.
   ═══════════════════════════════════════════════════════════════════════ */

[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;
}

/* 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; }