/* ============================================================
   DESIGN A — Pictogram Standard, remapped + tuned for construction
   Al Stone Remodeling & Design · blueprint-reveal hero
   All selectors scoped [data-design="a"]. Keyframes ps-* (co-load safe).
   ============================================================ */

[data-design="a"] {
  /* Construction-tuned token system (drafting / weathered-wood / blueprint).
     ~14 trade-rooted tokens. Signal stays a restrained brick-red CTA accent. */
  --design-a-primary: #B24A2E;        /* the ONE accent — CTA fill, funnel progress, weathered brick */

  --ps-paper: #F1EDE4;                /* warm drafting-paper base */
  --ps-sheet: #FBF9F4;                /* raised surface (cards, drawer, funnel) */
  --ps-ink: #1E1B17;                  /* primary text + all hairline rules (warm near-black) */
  --ps-ink-2: #5C564C;               /* secondary — captions, descriptions */
  --ps-muted: #938C7E;               /* tertiary hints */
  --ps-rule: #1E1B17;               /* hairline — always 1px */
  --ps-rule-soft: rgba(30,27,23,0.16);
  --ps-signal: var(--design-a-primary);
  --ps-signal-ink: #FBF9F4;
  --ps-blueprint: #2F5D74;           /* drafted blue — backdrop linework + status only, never a heading/CTA */
  --ps-critical: #9E2B17;
  --ps-success: #3B6B43;

  --ps-font-display: 'Inter', 'Helvetica Neue', 'Univers', system-ui, sans-serif;
  --ps-font-mono: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, monospace;

  --ps-tick: 4px;  --ps-half-rule: 8px;  --ps-rule-step: 16px;
  --ps-bay: 24px;  --ps-channel: 32px;   --ps-frame: 48px;
  --ps-section: 96px;  --ps-grid-gutter: 24px;

  --ps-dur-tick: 180ms;  --ps-dur-snap: 360ms;
  --ps-ease-snap: cubic-bezier(0.2,0.8,0.2,1);
  --ps-ease-rule: cubic-bezier(0.4,0.0,0.6,1);
  --ps-ease-press: cubic-bezier(0.4,0.0,1,1);

  background: var(--ps-paper);
  color: var(--ps-ink);
  font-family: var(--ps-font-display);
  -webkit-font-smoothing: antialiased;
}
[data-design="a"].dq-design { display: block; }

/* shared type helpers */
[data-design="a"] .ps-meta {
  font: 500 11px/1.2 var(--ps-font-display);
  letter-spacing: 0.10em; text-transform: uppercase; color: var(--ps-ink-2);
  margin: 0 0 12px;
}
[data-design="a"] .ps-display-l {
  font: 500 clamp(28px, 4vw, 40px)/1.12 var(--ps-font-display);
  letter-spacing: -0.012em; color: var(--ps-ink); margin: 0;
}

/* ---------- ELEMENT 1 — header ---------- */
[data-design="a"] .ps-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--ps-paper);
  border-bottom: 1px solid var(--ps-rule);
  box-sizing: border-box;
}
[data-design="a"] .ps-header__bar {
  position: relative;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px clamp(16px, 4vw, 32px);
  max-width: 1320px; margin-inline: auto;
}
[data-design="a"] .ps-logo {
  text-decoration: none; color: var(--ps-ink);
  font-family: var(--ps-font-display); font-weight: 500;
  letter-spacing: -0.012em; font-size: clamp(15px, 1.8vw, 19px); line-height: 1.1;
}
[data-design="a"] .ps-logo__mark { display: inline-block; }

[data-design="a"] .ps-header__register {
  position: absolute; left: 0; right: 0; bottom: -1px;
  height: 1px; pointer-events: none; overflow: hidden;
}
[data-design="a"] .ps-header__register-rule {
  position: absolute; left: 0; top: 0; height: 1px; width: 28%;
  background: linear-gradient(90deg, transparent 0%, var(--ps-rule) 18%, var(--ps-rule) 82%, transparent 100%);
  transform: translateX(-100%);
  animation: ps-header-register 18s var(--ps-ease-rule) infinite;
}
[data-design="a"] .ps-header__register-tick {
  position: absolute; top: -2px; height: 5px; width: 1px;
  background: var(--ps-rule); transform: translateX(-100vw);
  animation: ps-header-tick 18s var(--ps-ease-rule) infinite;
}
@keyframes ps-header-register {
  0% { transform: translateX(-100%); opacity: 0; }
  10% { opacity: 1; }
  45% { transform: translateX(260%); opacity: 1; }
  55%,100% { transform: translateX(260%); opacity: 0; }
}
@keyframes ps-header-tick {
  0%,9% { transform: translateX(-100vw); opacity: 0; }
  44%,46% { transform: translateX(26vw); opacity: 1; }
  56%,100% { transform: translateX(26vw); opacity: 0; }
}

[data-design="a"] .ps-burger {
  display: inline-flex; flex-direction: column; gap: 5px;
  width: 44px; height: 44px; padding: 14px 9px;
  background: transparent; border: 1px solid var(--ps-rule);
  border-radius: 0; cursor: pointer; align-items: stretch; justify-content: center;
}
[data-design="a"] .ps-burger__line {
  display: block; height: 1px; width: 100%; background: var(--ps-ink);
  transition: transform var(--ps-dur-tick) var(--ps-ease-snap);
}
[data-design="a"] .ps-burger[aria-expanded="true"] .ps-burger__line:nth-child(1) { transform: translateY(3px) rotate(45deg); }
[data-design="a"] .ps-burger[aria-expanded="true"] .ps-burger__line:nth-child(2) { transform: translateY(-3px) rotate(-45deg); }
[data-design="a"] .ps-burger:focus-visible { outline: 2px solid var(--ps-blueprint); outline-offset: 2px; }

[data-design="a"] .ps-drawer {
  position: fixed; inset: 0 0 0 auto; width: min(420px, 92vw); z-index: 60;
  background: var(--ps-sheet);
  border-left: 1px solid var(--ps-rule);
  padding: 84px 32px 32px;
  transform: translateX(100%);
  transition: transform 320ms var(--ps-ease-snap);
}
[data-design="a"] .ps-drawer[data-open="true"] { transform: translateX(0); }
[data-design="a"] .ps-drawer__nav { display: flex; flex-direction: column; gap: 20px; }
[data-design="a"] .ps-drawer__nav a {
  display: inline-block; position: relative; text-decoration: none; color: var(--ps-ink);
  font-size: 22px; font-weight: 500; letter-spacing: -0.005em; padding-block: 4px; min-height: 44px;
}
[data-design="a"] .ps-drawer__nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 1px; background: var(--ps-ink);
  transition: right var(--ps-dur-tick) var(--ps-ease-snap);
}
[data-design="a"] .ps-drawer__nav a:hover::after,
[data-design="a"] .ps-drawer__nav a:focus-visible::after { right: 0; }
[data-design="a"] .ps-drawer__phone { color: var(--ps-signal); font-family: var(--ps-font-mono); font-size: 18px; }
[data-design="a"] .ps-drawer-backdrop {
  position: fixed; inset: 0; z-index: 55; background: rgba(30,27,23,0.32);
  opacity: 0; pointer-events: none; transition: opacity 320ms var(--ps-ease-rule);
}
[data-design="a"] .ps-drawer-backdrop[data-open="true"] { opacity: 1; pointer-events: auto; }

/* ---------- HERO + ELEMENT 3 (blueprint-reveal backdrop) ---------- */
[data-design="a"] .ps-hero {
  position: relative; overflow: hidden;
  padding: clamp(64px, 11vw, 132px) clamp(16px, 4vw, 32px) clamp(56px, 8vw, 96px);
  background: var(--ps-paper);
}
[data-design="a"] .ps-hero__backdrop { position: absolute; inset: 0; pointer-events: none; }
[data-design="a"] .ps-hero__grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(var(--ps-rule-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--ps-rule-soft) 1px, transparent 1px);
  background-size: 32px 32px;
  -webkit-mask-image: radial-gradient(115% 95% at 78% 18%, #000 38%, transparent 78%);
          mask-image: radial-gradient(115% 95% at 78% 18%, #000 38%, transparent 78%);
  opacity: 0; transform: scale(1.02);
  animation: ps-hero-grid-in 1.5s var(--ps-ease-rule) forwards;
}
[data-design="a"] .ps-hero__plan {
  position: absolute; top: 50%; right: clamp(-40px, 2vw, 56px);
  width: clamp(320px, 46vw, 560px); height: auto;
  transform: translateY(-50%);
  color: var(--ps-blueprint); opacity: 0.92;
}
[data-design="a"] .ps-hero__plan g [stroke] { vector-effect: non-scaling-stroke; }
/* blueprint draw-in: linework completes within ~2s of first paint (>=80px traversal) */
[data-design="a"] .ps-hero__plan path,
[data-design="a"] .ps-hero__plan rect,
[data-design="a"] .ps-hero__plan circle {
  stroke-dasharray: 1400; stroke-dashoffset: 1400;
  animation: ps-plan-draw 1.9s var(--ps-ease-snap) forwards;
}
[data-design="a"] .ps-hero__plan .ps-plan__fixtures * { animation-delay: 0.5s; }
[data-design="a"] .ps-hero__plan .ps-plan__dims *,
[data-design="a"] .ps-hero__plan .ps-plan__door * { animation-delay: 0.9s; }
/* at-rest breath after arrival (cycle > 3s, low amplitude) */
[data-design="a"] .ps-hero__plan {
  animation: ps-plan-breath 9s ease-in-out 2.2s infinite;
}
@keyframes ps-hero-grid-in {
  to { opacity: 0.7; transform: scale(1); }
}
@keyframes ps-plan-draw {
  to { stroke-dashoffset: 0; }
}
@keyframes ps-plan-breath {
  0%,100% { opacity: 0.82; }
  50% { opacity: 1; }
}

[data-design="a"] .ps-hero__inner { position: relative; max-width: 1320px; margin-inline: auto; }
[data-design="a"] .ps-hero__kicker { margin-bottom: 18px; }
[data-design="a"] .ps-hero__head {
  font: 500 clamp(34px, 6.2vw, 64px)/1.04 var(--ps-font-display);
  letter-spacing: -0.018em; color: var(--ps-ink);
  margin: 0 0 20px; max-width: 16ch; opacity: 1; /* opacity:1 at first paint — never reveal-gated */
}
[data-design="a"] .ps-hero__sub {
  font: 400 clamp(17px, 2.1vw, 20px)/1.5 var(--ps-font-display);
  color: var(--ps-ink-2); margin: 0 0 14px; max-width: 46ch;
}
[data-design="a"] .ps-hero__proof {
  font: 500 13px/1.5 var(--ps-font-mono); letter-spacing: 0.01em;
  color: var(--ps-ink-2); margin: 0 0 36px; max-width: 52ch;
}
[data-design="a"] .ps-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; }

/* ---------- ELEMENT 2 — CTA ---------- */
[data-design="a"] .ps-cta {
  position: relative; display: inline-flex; align-items: center; gap: 14px;
  min-height: 48px; padding: 15px 26px; box-sizing: border-box;
  background: var(--ps-signal); color: var(--ps-signal-ink);
  font-family: var(--ps-font-display); font-size: 15px; font-weight: 500; letter-spacing: 0.01em;
  text-decoration: none; border: 1px solid var(--ps-signal); border-radius: 0;
  cursor: pointer; overflow: hidden;
  transition: background-color var(--ps-dur-tick) var(--ps-ease-press),
              transform var(--ps-dur-tick) var(--ps-ease-press);
}
[data-design="a"] .ps-cta__arrow { display: inline-flex; transition: transform var(--ps-dur-tick) var(--ps-ease-snap); transform: translateX(-4px); }
[data-design="a"] .ps-cta:hover .ps-cta__arrow,
[data-design="a"] .ps-cta:focus-visible .ps-cta__arrow { transform: translateX(0); }
[data-design="a"] .ps-cta:hover { background: color-mix(in oklab, var(--ps-signal), black 8%); }
[data-design="a"] .ps-cta:active { transform: translateY(1px); background: color-mix(in oklab, var(--ps-signal), black 14%); }
[data-design="a"] .ps-cta:focus-visible { outline: 2px solid var(--ps-blueprint); outline-offset: 3px; }
[data-design="a"] .ps-cta__register {
  position: absolute; left: 0; bottom: 0; height: 1px; width: 30%;
  background: var(--ps-signal-ink); opacity: 0.7; transform: translateX(-100%);
  animation: ps-cta-breath 4.8s var(--ps-ease-rule) infinite;
}
@keyframes ps-cta-breath {
  0% { transform: translateX(-100%); opacity: 0; }
  20% { opacity: 0.8; }
  60% { transform: translateX(330%); opacity: 0.8; }
  70%,100% { transform: translateX(330%); opacity: 0; }
}
[data-design="a"] .ps-chip {
  display: inline-flex; align-items: center; min-height: 36px; padding: 8px 14px;
  font: 500 12px/1.2 var(--ps-font-mono); letter-spacing: 0.04em; color: var(--ps-ink);
  border: 1px solid var(--ps-rule); border-radius: 0; background: var(--ps-sheet);
}

/* ---------- ELEMENT 6 — pointer (drafted dimension line, NOT a button) ---------- */
[data-design="a"] .ps-pointer {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding: 8px clamp(16px, 4vw, 32px) 40px;
  background: var(--ps-paper);
}
[data-design="a"] .ps-pointer__label {
  font: 500 11px/1 var(--ps-font-display); letter-spacing: 0.10em; text-transform: uppercase; color: var(--ps-ink-2);
}
[data-design="a"] .ps-pointer__dim { display: flex; flex-direction: column; align-items: center; width: 1px; }
[data-design="a"] .ps-pointer__cap { width: 11px; height: 1px; background: var(--ps-ink); }
[data-design="a"] .ps-pointer__rule {
  width: 1px; height: 0; background: var(--ps-ink); transform-origin: top;
  animation: ps-pointer-extend 1.6s var(--ps-ease-snap) 0.3s forwards;
}
[data-design="a"] .ps-pointer__tick {
  width: 7px; height: 1px; background: var(--ps-signal); opacity: 0;
  animation: ps-pointer-anchor 0.4s var(--ps-ease-snap) 1.9s forwards;
}
@keyframes ps-pointer-extend { to { height: 44px; } }
@keyframes ps-pointer-anchor { to { opacity: 1; } }

/* ---------- ELEMENT 5 — funnel ---------- */
[data-design="a"] .ps-interactive {
  padding: var(--ps-section) clamp(16px, 4vw, 32px);
  background: var(--ps-paper); box-sizing: border-box;
}
[data-design="a"] .ps-funnel {
  max-width: 720px; margin-inline: auto;
  background: var(--ps-sheet); border: 1px solid var(--ps-rule);
  padding: clamp(24px, 4vw, 48px);
}
[data-design="a"] .ps-funnel__head { margin-bottom: var(--ps-frame); }
[data-design="a"] .ps-funnel__lede {
  font: 400 16px/1.55 var(--ps-font-display); color: var(--ps-ink-2);
  margin: 12px 0 24px; max-width: 54ch;
}
[data-design="a"] .ps-funnel__channel {
  position: relative; height: 1px; width: 100%; background: var(--ps-rule-soft); overflow: hidden;
}
[data-design="a"] .ps-funnel__channel-fill {
  position: absolute; left: 0; top: 0; bottom: 0; background: var(--ps-signal);
  transition: width var(--ps-dur-snap) var(--ps-ease-snap);
}
[data-design="a"] .ps-funnel__step {
  display: none; border: 0; padding: 0; margin: 0;
  opacity: 0; transform: translateY(8px);
  transition: opacity var(--ps-dur-snap) var(--ps-ease-snap),
              transform var(--ps-dur-snap) var(--ps-ease-snap);
}
[data-design="a"] .ps-funnel__step[data-active="true"] { display: block; opacity: 1; transform: translateY(0); }
[data-design="a"] .ps-funnel__legend {
  font: 500 clamp(20px,2.6vw,24px)/1.2 var(--ps-font-display);
  letter-spacing: -0.005em; color: var(--ps-ink); margin: 0 0 24px; padding: 0;
}
[data-design="a"] .ps-funnel__choices { display: grid; gap: 8px; }
[data-design="a"] .ps-choice {
  display: flex; align-items: center; gap: 14px; min-height: 48px; padding: 13px 16px;
  border: 1px solid var(--ps-rule); cursor: pointer;
  font: 400 15px/1.3 var(--ps-font-display); color: var(--ps-ink);
  transition: background var(--ps-dur-tick) var(--ps-ease-snap), border-color var(--ps-dur-tick) var(--ps-ease-snap);
}
[data-design="a"] .ps-choice input { accent-color: var(--ps-signal); margin: 0; width: 16px; height: 16px; flex: none; }
[data-design="a"] .ps-choice:hover { background: var(--ps-paper); }
[data-design="a"] .ps-choice:has(input:checked) { border-color: var(--ps-signal); box-shadow: inset 0 0 0 1px var(--ps-signal); }
[data-design="a"] .ps-choice:focus-within { outline: 2px solid var(--ps-blueprint); outline-offset: 2px; }

[data-design="a"] .ps-field { display: grid; gap: 6px; margin-bottom: 16px; }
[data-design="a"] .ps-field label {
  font: 500 13px/1.2 var(--ps-font-display); letter-spacing: 0.02em; color: var(--ps-ink);
}
[data-design="a"] .ps-field__opt { color: var(--ps-ink-2); font-weight: 400; }
[data-design="a"] .ps-field input,
[data-design="a"] .ps-field textarea {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  background: var(--ps-sheet); border: 0; box-shadow: inset 0 0 0 1px var(--ps-rule); border-radius: 0;
  font: 400 15px/1.4 var(--ps-font-display); color: var(--ps-ink);
  transition: box-shadow var(--ps-dur-tick) var(--ps-ease-snap);
}
[data-design="a"] .ps-field textarea { resize: vertical; }
[data-design="a"] .ps-field input:focus-visible,
[data-design="a"] .ps-field textarea:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 1px var(--ps-signal), 0 0 0 2px color-mix(in oklab, var(--ps-signal), transparent 70%);
}

[data-design="a"] .ps-specimen { border: 1px solid var(--ps-rule); padding: 20px; background: var(--ps-paper); margin-top: 20px; }
[data-design="a"] .ps-specimen__lede {
  font: 500 13px/1.4 var(--ps-font-display); letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--ps-ink-2); margin: 0 0 16px;
}
[data-design="a"] .ps-specimen__list {
  display: grid; grid-template-columns: 1fr 1.8fr; gap: 6px 16px; margin: 0;
  font-family: var(--ps-font-mono); font-size: 13px; color: var(--ps-ink);
}
[data-design="a"] .ps-specimen__list dt { color: var(--ps-ink-2); letter-spacing: 0.04em; text-transform: uppercase; font-size: 11px; align-self: center; }
[data-design="a"] .ps-specimen__list dd { margin: 0; }

[data-design="a"] .ps-funnel__nav {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px;
  margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--ps-rule);
}
[data-design="a"] .ps-btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
  padding: 12px 22px; border-radius: 0; cursor: pointer;
  font: 500 14px/1 var(--ps-font-display); letter-spacing: 0.01em;
  transition: background var(--ps-dur-tick), transform var(--ps-dur-tick), border-color var(--ps-dur-tick);
}
[data-design="a"] .ps-btn--primary { background: var(--ps-signal); color: var(--ps-signal-ink); border: 1px solid var(--ps-signal); }
[data-design="a"] .ps-btn--primary:hover { background: color-mix(in oklab, var(--ps-signal), black 8%); }
[data-design="a"] .ps-btn--primary:active { transform: translateY(1px); background: color-mix(in oklab, var(--ps-signal), black 14%); }
[data-design="a"] .ps-btn--primary:disabled { opacity: 0.55; cursor: default; transform: none; }
[data-design="a"] .ps-btn--ghost { background: transparent; color: var(--ps-ink); border: 1px solid var(--ps-rule); }
[data-design="a"] .ps-btn--ghost:hover { background: var(--ps-paper); }
[data-design="a"] .ps-btn:focus-visible { outline: 2px solid var(--ps-blueprint); outline-offset: 2px; }
[data-design="a"] .ps-funnel[data-state="submitted"] .ps-funnel__form { opacity: 0.5; pointer-events: none; }
[data-design="a"] .ps-funnel__after {
  max-width: 720px; margin: 24px auto 0; font: 400 14px/1.6 var(--ps-font-display); color: var(--ps-ink-2);
}
[data-design="a"] .ps-funnel__after a { color: var(--ps-signal); }

/* ---------- ELEMENT 4 — The process (breathing instrument rules) ---------- */
[data-design="a"] .ps-ambient-b { background: var(--ps-paper); padding: var(--ps-section) clamp(16px, 4vw, 32px); box-sizing: border-box; }
[data-design="a"] .ps-ambient-b__frame {
  position: relative; max-width: 980px; margin-inline: auto;
  padding: 48px clamp(20px, 4vw, 48px); background: var(--ps-sheet); border: 1px solid var(--ps-rule);
}
[data-design="a"] .ps-ambient-b__head { margin-bottom: var(--ps-frame); }
[data-design="a"] .ps-standard { list-style: none; padding: 0; margin: 0; }
[data-design="a"] .ps-standard__row {
  position: relative; display: grid; grid-template-columns: 56px 1fr 16px; gap: 16px;
  padding: 20px 0; border-top: 1px solid var(--ps-rule);
}
[data-design="a"] .ps-standard__row:last-child { border-bottom: 1px solid var(--ps-rule); }
[data-design="a"] .ps-standard__code {
  font: 500 11px/1 var(--ps-font-mono); letter-spacing: 0.04em; color: var(--ps-ink-2); padding-top: 4px;
}
[data-design="a"] .ps-standard__title {
  font: 500 18px/1.2 var(--ps-font-display); letter-spacing: -0.005em; color: var(--ps-ink); margin: 0 0 6px;
}
[data-design="a"] .ps-standard__desc {
  font: 400 15px/1.55 var(--ps-font-display); color: var(--ps-ink-2); margin: 0; max-width: 60ch;
}
[data-design="a"] .ps-standard__indicator {
  position: relative; display: block; width: 1px; height: 12px; background: var(--ps-ink);
  align-self: center; transform-origin: center;
  animation: ps-standard-breath 12s var(--ps-ease-rule) infinite;
}
[data-design="a"] .ps-standard__row:nth-child(1) .ps-standard__indicator { animation-delay: 0s; }
[data-design="a"] .ps-standard__row:nth-child(2) .ps-standard__indicator { animation-delay: 1.6s; }
[data-design="a"] .ps-standard__row:nth-child(3) .ps-standard__indicator { animation-delay: 3.2s; }
[data-design="a"] .ps-standard__row:nth-child(4) .ps-standard__indicator { animation-delay: 4.8s; }
[data-design="a"] .ps-standard__row:nth-child(n+3) .ps-standard__indicator { background: var(--ps-blueprint); }
@keyframes ps-standard-breath {
  0%,100% { transform: scaleY(1); opacity: 0.6; }
  50% { transform: scaleY(1.6); opacity: 1; }
}

/* ---------- Ambient A — services pictogram index ---------- */
[data-design="a"] .ps-ambient-a {
  position: relative; padding: var(--ps-section) clamp(16px, 4vw, 32px);
  max-width: 1320px; margin-inline: auto; box-sizing: border-box;
}
[data-design="a"] .ps-ambient-a__head { margin-bottom: var(--ps-frame); max-width: 56ch; }
[data-design="a"] .ps-index {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--ps-channel) var(--ps-grid-gutter); border-top: 1px solid var(--ps-rule);
}
[data-design="a"] .ps-index__cell {
  position: relative; padding: 24px 0 0;
  display: grid; grid-template-columns: auto 1fr;
  grid-template-areas: "code glyph" "title title" "desc desc";
  column-gap: 16px; row-gap: 8px;
  opacity: 0; transform: translateY(8px);
  transition: opacity var(--ps-dur-snap) var(--ps-ease-snap), transform var(--ps-dur-snap) var(--ps-ease-snap);
}
[data-design="a"] .ps-index__cell[data-registered="true"] { opacity: 1; transform: translateY(0); }
[data-design="a"] .ps-index__cell::before {
  content: ""; position: absolute; top: 0; left: 0; height: 1px; width: 0; background: var(--ps-rule);
  transition: width var(--ps-dur-snap) var(--ps-ease-snap);
}
[data-design="a"] .ps-index__cell[data-registered="true"]::before { width: 100%; }
[data-design="a"] .ps-index__code { grid-area: code; font: 500 11px/1 var(--ps-font-mono); letter-spacing: 0.04em; color: var(--ps-ink-2); }
[data-design="a"] .ps-index__glyph { grid-area: glyph; justify-self: end; color: var(--ps-ink); }
[data-design="a"] .ps-index__glyph svg path,
[data-design="a"] .ps-index__glyph svg circle,
[data-design="a"] .ps-index__glyph svg rect,
[data-design="a"] .ps-index__glyph svg line {
  stroke-dasharray: 200; stroke-dashoffset: 200;
  transition: stroke-dashoffset 700ms var(--ps-ease-snap);
}
[data-design="a"] .ps-index__cell[data-registered="true"] .ps-index__glyph svg path,
[data-design="a"] .ps-index__cell[data-registered="true"] .ps-index__glyph svg circle,
[data-design="a"] .ps-index__cell[data-registered="true"] .ps-index__glyph svg rect,
[data-design="a"] .ps-index__cell[data-registered="true"] .ps-index__glyph svg line { stroke-dashoffset: 0; }
[data-design="a"] .ps-index__title { grid-area: title; font: 500 18px/1.25 var(--ps-font-display); letter-spacing: -0.005em; color: var(--ps-ink); margin: 0; }
[data-design="a"] .ps-index__desc { grid-area: desc; font: 400 14px/1.5 var(--ps-font-display); color: var(--ps-ink-2); margin: 0; max-width: 36ch; }
[data-design="a"] .ps-ambient-a__rule { position: relative; margin-top: var(--ps-frame); height: 1px; background: var(--ps-rule-soft); overflow: hidden; }
[data-design="a"] .ps-ambient-a__rule-tick {
  position: absolute; top: -3px; left: 0; height: 7px; width: 1px; background: var(--ps-rule);
  animation: ps-ambient-a-tick 18s var(--ps-ease-rule) infinite;
}
@keyframes ps-ambient-a-tick { 0% { transform: translateX(0vw); } 100% { transform: translateX(100vw); } }

/* ---------- Client stories ---------- */
[data-design="a"] .ps-stories { padding: var(--ps-section) clamp(16px, 4vw, 32px); max-width: 1320px; margin-inline: auto; box-sizing: border-box; }
[data-design="a"] .ps-stories__head { margin-bottom: var(--ps-frame); max-width: 56ch; }
[data-design="a"] .ps-stories__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--ps-channel); }
[data-design="a"] .ps-quote {
  margin: 0; padding: 28px; background: var(--ps-sheet); border: 1px solid var(--ps-rule);
  border-left: 2px solid var(--ps-signal);
}
[data-design="a"] .ps-quote blockquote {
  margin: 0 0 16px; font: 500 clamp(18px,2.2vw,22px)/1.4 var(--ps-font-display);
  letter-spacing: -0.005em; color: var(--ps-ink);
}
[data-design="a"] .ps-quote figcaption { font: 500 12px/1.4 var(--ps-font-mono); letter-spacing: 0.04em; color: var(--ps-ink-2); }
[data-design="a"] .ps-stories__cta { margin-top: var(--ps-frame); }

/* ---------- Footer ---------- */
[data-design="a"] .ps-footer { background: var(--ps-paper); border-top: 1px solid var(--ps-rule); padding: var(--ps-frame) clamp(16px, 4vw, 32px) var(--ps-bay); }
[data-design="a"] .ps-footer__inner { max-width: 1320px; margin-inline: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--ps-channel); }
[data-design="a"] .ps-footer__name { font: 500 18px/1.2 var(--ps-font-display); letter-spacing: -0.008em; color: var(--ps-ink); margin: 0 0 10px; }
[data-design="a"] .ps-footer__line { font: 400 14px/1.6 var(--ps-font-display); color: var(--ps-ink-2); margin: 0 0 4px; }
[data-design="a"] .ps-footer__line a { color: var(--ps-signal); text-decoration: none; }
[data-design="a"] .ps-footer__line a:hover { text-decoration: underline; }
[data-design="a"] .ps-footer__base { max-width: 1320px; margin: var(--ps-frame) auto 0; padding-top: var(--ps-bay); border-top: 1px solid var(--ps-rule-soft); font: 500 11px/1.4 var(--ps-font-mono); letter-spacing: 0.06em; color: var(--ps-ink-2); }

/* ---------- responsive ---------- */
@media (max-width: 960px) {
  [data-design="a"] .ps-index { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  [data-design="a"] .ps-hero__plan { opacity: 0.5; width: 70vw; right: -8vw; }
  [data-design="a"] .ps-footer__inner { grid-template-columns: 1fr; gap: var(--ps-frame); }
}
@media (max-width: 640px) {
  [data-design="a"] .ps-stories__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  [data-design="a"] .ps-header__bar { padding: 14px 16px; }
  [data-design="a"] .ps-index { grid-template-columns: 1fr; gap: 24px; }
  [data-design="a"] .ps-ambient-a,
  [data-design="a"] .ps-stories { padding: 64px 16px; }
  [data-design="a"] .ps-ambient-b,
  [data-design="a"] .ps-interactive { padding: 64px 16px; }
  [data-design="a"] .ps-ambient-b__frame { padding: 32px 20px; }
  [data-design="a"] .ps-standard__row { grid-template-columns: 40px 1fr 12px; gap: 12px; }
  [data-design="a"] .ps-funnel { padding: 24px 20px; }
  [data-design="a"] .ps-specimen__list { grid-template-columns: 1fr; gap: 2px 0; }
  [data-design="a"] .ps-specimen__list dd { margin-bottom: 10px; }
  [data-design="a"] .ps-funnel__nav .ps-btn { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 380px) {
  [data-design="a"] .ps-logo { font-size: 14px; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .ps-header__register-rule,
  [data-design="a"] .ps-header__register-tick { animation: none; opacity: 0.5; }
  [data-design="a"] .ps-header__register-rule { transform: translateX(20%); }
  [data-design="a"] .ps-header__register-tick { transform: translateX(26vw); opacity: 0.8; }
  [data-design="a"] .ps-drawer { transition: none; }
  [data-design="a"] .ps-hero__grid { animation: none; opacity: 0.55; transform: none; }
  [data-design="a"] .ps-hero__plan,
  [data-design="a"] .ps-hero__plan path,
  [data-design="a"] .ps-hero__plan rect,
  [data-design="a"] .ps-hero__plan circle { animation: none; stroke-dashoffset: 0; opacity: 0.9; }
  [data-design="a"] .ps-cta__register { animation: none; opacity: 0.5; transform: translateX(40%); }
  [data-design="a"] .ps-cta__arrow { transition: none; }
  [data-design="a"] .ps-pointer__rule { animation: none; height: 44px; }
  [data-design="a"] .ps-pointer__tick { animation: none; opacity: 1; }
  [data-design="a"] .ps-funnel__step { transition: none; transform: none; }
  [data-design="a"] .ps-funnel__channel-fill { transition: none; }
  [data-design="a"] .ps-btn { transition: none; }
  [data-design="a"] .ps-index__cell { opacity: 1; transform: none; transition: none; }
  [data-design="a"] .ps-index__cell::before { width: 100%; transition: none; }
  [data-design="a"] .ps-index__glyph svg path,
  [data-design="a"] .ps-index__glyph svg circle,
  [data-design="a"] .ps-index__glyph svg rect,
  [data-design="a"] .ps-index__glyph svg line { stroke-dashoffset: 0; transition: none; }
  [data-design="a"] .ps-ambient-a__rule-tick { animation: none; }
  [data-design="a"] .ps-standard__indicator { animation: none; transform: scaleY(1.2); opacity: 0.8; }
}

/* ---------- MANDATORY mobile-safety block (must stay at bottom) ---------- */
[data-design="a"].dq-design,
[data-design="a"] .dq-design { max-width: 100%; overflow-x: clip; }
[data-design="a"] * { min-width: 0; }
[data-design="a"] img,
[data-design="a"] 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; }