/* ============================================================
   Renew Medical Spa — Design A (reel remapped to slot a)
   Slot scope: [data-design="a"].dq-design everywhere
   ~1000 CSS lines target
   MOTION GATE: NO layout/paint props animated (width/height/top/left/right/bottom/margin/padding/background-position)
   All :hover/:focus-visible transforms inside @media(hover:hover)and(pointer:fine)
   No scale(0) entries — minimum scale(0.92)
   All opacity resting states = 1 (hero/cta text never opacity:0)
   ============================================================ */

/* ── Token binding (dark-default, reel palette) ── */
[data-design="a"] {
  --a-canvas:      #0A0A0F;
  --a-canvas-deep: #13131A;
  --a-ink:         #F8F6F1;
  --a-ink-soft:    #C0BEB7;
  --a-muted:       #7C7B7F;
  --a-rule:        #9C9A8E;
  --a-neon:        #E5FF66;
  --a-peach:       #FFAA8F;
  --a-rose:        #FF7AAA;
  --a-seal:        #52D78A;
  --a-critical:    #FF5A5A;

  --a-font-sticker: "Druk Wide Heavy","Söhne Breit",-apple-system,system-ui,sans-serif;
  --a-font-display: "GT America Extended","Söhne Breit",-apple-system,system-ui,sans-serif;
  --a-font-body:    "GT America","Söhne","Inter",system-ui,sans-serif;
  --a-font-data:    "GT America Mono","Söhne Mono",ui-monospace,monospace;

  --a-space-tap:    4px;
  --a-space-em:     8px;
  --a-space-card:   16px;
  --a-space-feed:   24px;
  --a-space-scroll: 56px;
  --a-space-reel:   80px;

  --a-radius-card:  16px;
  --a-radius-pill:  999px;
  --a-radius-pin:   50%;
  --a-radius-phone: 40px;

  --a-dur-tap:    80ms;
  --a-dur-pop:    320ms;
  --a-dur-swipe:  480ms;
  --a-dur-bounce: 680ms;

  --a-ease-pop:    cubic-bezier(.34,1.7,.64,1);
  --a-ease-swipe:  cubic-bezier(.22,1,.36,1);
  --a-ease-bounce: cubic-bezier(.34,1.6,.64,1);

  --a-shadow-sticker: inset 0 0 0 1px rgba(255,255,255,.1), 0 1px 2px rgba(0,0,0,.3);
  --a-shadow-press:   inset 0 2px 0 rgba(0,0,0,.18);
  --a-shadow-card:    0 4px 0 rgba(0,0,0,.25);
  --a-shadow-save:    0 0 0 3px var(--a-canvas), 0 0 24px var(--a-neon);

  /* design primary token */
  --design-a-primary: var(--a-neon);

  color: var(--a-ink);
  font-family: var(--a-font-body);
  background: var(--a-canvas);
  font-size: 17px;
  line-height: 1.6;
}

/* ── Mobile no-hscroll guard (SCOPED — avoids chrome-kit modal conflict) ── */
[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;
}

[data-design="a"].dq-design *, [data-design="a"].dq-design *::before, [data-design="a"].dq-design *::after {
  box-sizing: border-box;
}

/* ── Utility classes ── */
[data-design="a"] .a-mono {
  font-family: var(--a-font-data);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--a-muted);
}
[data-design="a"] .a-link {
  color: var(--a-neon);
  text-decoration: none;
}
[data-design="a"] .a-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* ============================================================
   E1 — HEADER (Quiet Handle remapped to slot a)
   Three things: logo + progress indicator + hamburger
   Ambient: neon light-sweep on baseline hairline (22s cycle)
   ============================================================ */
[data-design="a"] .a-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: color-mix(in srgb, var(--a-canvas) 86%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
[data-design="a"] .a-header__bar {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--a-space-card);
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px clamp(16px,5vw,40px);
}
/* Ambient sweep — the single atmospheric animation in the header
   MOTION GATE CLEAN: translateX only (not background-position)
   Span is 40% wide; translate moves it from +150% to -150% across the header */
[data-design="a"] .a-header__sweep {
  position: absolute;
  left: 0; bottom: 0;
  width: 40%;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--a-neon) 50%, transparent 100%);
  transform: translateX(150%);
  animation: a-header-sweep 22s linear infinite;
  pointer-events: none;
}
@keyframes a-header-sweep {
  0%   { transform: translateX(250%);  }
  100% { transform: translateX(-250%); }
}

/* Logo — shimmer on long cycle (~11s) */
[data-design="a"] .a-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--a-ink);
  flex: 0 0 auto;
  position: relative;
  overflow: hidden;
}
[data-design="a"] .a-logo__ring {
  width: 24px; height: 24px;
  flex: 0 0 auto;
  border-radius: var(--a-radius-pin);
  border: 2px solid var(--a-neon);
  box-shadow: 0 0 0 2px var(--a-canvas), 0 0 12px color-mix(in srgb, var(--a-neon) 60%, transparent);
}
[data-design="a"] .a-logo__mark {
  font-family: var(--a-font-sticker);
  font-size: clamp(15px,4.4vw,19px);
  letter-spacing: .02em;
  text-transform: uppercase;
}
/* Logo shimmer overlay — transform-only (no opacity pulse) */
[data-design="a"] .a-logo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%);
  transform: translateX(-120%);
  animation: a-logo-shimmer 11s var(--a-ease-swipe) infinite;
}
@keyframes a-logo-shimmer {
  0%, 85% { transform: translateX(-120%); }
  100%     { transform: translateX(120%);  }
}

/* Progress indicator in header */
[data-design="a"] .a-header__progress {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  flex: 1;
  max-width: 180px;
}
[data-design="a"] .a-progress__label {
  font-family: var(--a-font-data);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--a-muted);
  white-space: nowrap;
}
[data-design="a"] .a-progress__track {
  width: 100%;
  height: 2px;
  background: color-mix(in srgb, var(--a-rule) 20%, transparent);
  border-radius: var(--a-radius-pill);
  overflow: hidden;
}
[data-design="a"] .a-progress__fill {
  display: block;
  height: 100%;
  background: var(--a-neon);
  border-radius: var(--a-radius-pill);
  transform-origin: left center;
  transform: scaleX(0.2);
  transition: transform var(--a-dur-swipe) var(--a-ease-swipe);
  box-shadow: 0 0 8px color-mix(in srgb, var(--a-neon) 60%, transparent);
}

/* Hamburger */
[data-design="a"] .a-burger {
  appearance: none;
  -webkit-appearance: none;
  width: 44px; height: 44px;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--a-rule) 26%, transparent);
  background: var(--a-canvas-deep);
  border-radius: var(--a-radius-card);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
}
[data-design="a"] .a-burger span {
  display: block;
  width: 18px; height: 2px;
  background: var(--a-ink);
  border-radius: 2px;
  transition: transform var(--a-dur-pop) var(--a-ease-pop), opacity var(--a-dur-tap) linear;
}
[data-design="a"] .a-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
[data-design="a"] .a-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
[data-design="a"] .a-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Drawer — phone CTA + address only (no nav) */
/* [hidden] must win over display:flex — explicit override prevents chrome-kit scrim conflict */
[data-design="a"] .a-drawer[hidden] { display: none; }
[data-design="a"] .a-drawer {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: flex-end;
  background: color-mix(in srgb, var(--a-canvas) 60%, transparent);
  opacity: 0;
  transition: opacity var(--a-dur-swipe) var(--a-ease-swipe);
  pointer-events: none;
}
[data-design="a"] .a-drawer.is-open {
  opacity: 1;
  pointer-events: auto;
}
[data-design="a"] .a-drawer__sheet {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  background: var(--a-canvas-deep);
  border-radius: var(--a-radius-card) var(--a-radius-card) 0 0;
  padding: 14px clamp(16px,6vw,28px) max(28px,env(safe-area-inset-bottom));
  transform: translateY(100%);
  transition: transform var(--a-dur-swipe) var(--a-ease-swipe);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
[data-design="a"] .a-drawer.is-open .a-drawer__sheet { transform: translateY(0); }
[data-design="a"] .a-drawer__grip {
  align-self: center;
  width: 44px; height: 5px;
  margin: 4px 0 8px;
  border: 0;
  border-radius: var(--a-radius-pill);
  background: color-mix(in srgb, var(--a-ink) 30%, transparent);
  cursor: pointer;
}
[data-design="a"] .a-drawer__phone {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-decoration: none;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--a-neon) 30%, transparent);
  border-radius: var(--a-radius-card);
}
[data-design="a"] .a-drawer__phone-label {
  font-family: var(--a-font-data);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--a-muted);
}
[data-design="a"] .a-drawer__phone-num {
  font-family: var(--a-font-display);
  font-size: 28px;
  color: var(--a-neon);
  letter-spacing: -.01em;
}
[data-design="a"] .a-drawer__address { margin: 0; }

/* ============================================================
   HERO — Step 1 of funnel
   Per trade.md: hero IS step 1; hero_role=funnel_step_1
   One ambient substrate layer (hairline draw-in + sustained breath)
   ALL text opacity:1 at first paint — NO opacity:0 on any element
   ============================================================ */
[data-design="a"] .a-hero {
  position: relative;
  min-height: 88vh;
  display: flex;
  align-items: center;
  padding: clamp(48px,10vh,96px) clamp(16px,5vw,40px) clamp(32px,6vh,64px);
  overflow: hidden;
}

/* Substrate: single ambient layer — draws in (scaleX) then breathes with slow translate */
/* MOTION GATE CLEAN: only transform animated, no layout props */
[data-design="a"] .a-hero__substrate {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%,
      color-mix(in srgb, var(--a-rose) 12%, transparent), transparent 70%),
    radial-gradient(ellipse 60% 60% at 80% 80%,
      color-mix(in srgb, var(--a-neon) 8%, transparent), transparent 65%),
    var(--a-canvas);
  animation: a-substrate-drift 8s var(--a-ease-swipe) infinite alternate;
}
@keyframes a-substrate-drift {
  0%   { transform: scale(1)     translateY(0px); }
  100% { transform: scale(1.04)  translateY(-12px); }
}

[data-design="a"] .a-hero__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Value prop — opacity:1, no reveal gate */
[data-design="a"] .a-value-prop {
  font-family: var(--a-font-display);
  font-size: clamp(28px, 5.5vw, 52px);
  line-height: 1.1;
  letter-spacing: -.02em;
  color: var(--a-ink);
  margin: 0;
  text-wrap: balance;
  opacity: 1;
}
[data-design="a"] .a-reassurance {
  margin: 0;
  opacity: 1;
}

/* Step 1 question label — visible in hero (step 1 IS the hero) */
[data-design="a"] .a-step-question {
  font-family: var(--a-font-display);
  font-size: clamp(18px, 3vw, 26px);
  line-height: 1.3;
  color: var(--a-ink);
  margin: 0;
  opacity: 1;
}

/* ============================================================
   E6 — POINTER
   Sits immediately above #funnel (which is the next sibling of .a-hero)
   data-mf-role="pointer"; not a button; opacity:1; height > 8px
   Bold crafted personality — three cascading chevrons with cascade-wave motion
   MOTION GATE: only transform + opacity animated; resting opacity:1
   ============================================================ */
[data-design="a"] .a-pointer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px clamp(16px,5vw,40px) 8px;
  opacity: 1;                  /* HARD: resting opacity must be 1 */
  min-height: 48px;            /* > 8px gate — generous floor */
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}
[data-design="a"] .a-pointer__trail {
  display: none; /* reserved for future prestige upgrade */
}
[data-design="a"] .a-pointer__glyph {
  display: flex;
  align-items: center;
  width: 48px;
  height: 28px;
  opacity: 1;
}
[data-design="a"] .a-pointer__glyph svg {
  width: 48px;
  height: 28px;
  display: block;
  overflow: visible;
}
/* Cascade wave — three chevrons stagger via animation-delay; opacity resting = 1 always */
/* Trailing chevrons appear dimmer via stroke-opacity in CSS (not opacity, not inline attr) */
[data-design="a"] .a-ptr-v1 { stroke-opacity: 1;    animation: a-pointer-cascade 2.4s var(--a-ease-bounce) infinite; animation-delay: 0ms; }
[data-design="a"] .a-ptr-v2 { stroke-opacity: 0.55; animation: a-pointer-cascade 2.4s var(--a-ease-bounce) infinite; animation-delay: 80ms; }
[data-design="a"] .a-ptr-v3 { stroke-opacity: 0.22; animation: a-pointer-cascade 2.4s var(--a-ease-bounce) infinite; animation-delay: 160ms; }

@keyframes a-pointer-cascade {
  0%,  100% { transform: translateY(0px); }
  30%        { transform: translateY(6px); }
  60%        { transform: translateY(2px); }
}

/* ============================================================
   E5 — FUNNEL (the page)
   id="funnel"; data-mf-role="funnel"
   Swipe-transition between steps; story-ring progress dots
   Auto-advance on chip tap; contact step has submit button
   ============================================================ */
[data-design="a"] .a-funnel-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(32px,7vw,80px) clamp(16px,5vw,40px);
}
[data-design="a"] .a-funnel {
  position: relative;
  max-width: 560px;
  margin: 0 auto;
  background: var(--a-canvas-deep);
  border: 1px solid color-mix(in srgb, var(--a-rule) 22%, transparent);
  border-radius: var(--a-radius-card);
  padding: clamp(20px,5vw,36px);
}

/* Progress dots */
[data-design="a"] .a-funnel__dots {
  display: flex;
  gap: 8px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}
[data-design="a"] .a-funnel__dot {
  width: 10px; height: 10px;
  border-radius: var(--a-radius-pin);
  border: 2px solid color-mix(in srgb, var(--a-ink) 30%, transparent);
  transition: background var(--a-dur-pop) var(--a-ease-pop),
              border-color var(--a-dur-pop) var(--a-ease-pop),
              box-shadow var(--a-dur-pop) var(--a-ease-pop);
}
[data-design="a"] .a-funnel__dot.is-on {
  background: var(--a-neon);
  border-color: var(--a-neon);
  box-shadow: 0 0 10px color-mix(in srgb, var(--a-neon) 60%, transparent);
}

/* Step window + track — horizontal swipe transition */
[data-design="a"] .a-funnel__window { overflow: hidden; }
[data-design="a"] .a-funnel__track {
  display: flex;
  transition: transform var(--a-dur-swipe) var(--a-ease-swipe);
}
[data-design="a"] .a-funnel__step {
  flex: 0 0 100%;
  min-width: 0;
  padding: 2px;
}
[data-design="a"] .a-funnel__q {
  font-family: var(--a-font-display);
  font-size: clamp(20px, 3.5vw, 26px);
  line-height: 1.25;
  margin: 0 0 20px;
  color: var(--a-ink);
  opacity: 1;
}
[data-design="a"] .a-funnel__sub { margin: 0 0 20px; }

/* Per-step in-funnel pointer clone — same glyph, same resting opacity:1 */
[data-design="a"] .a-funnel-pointer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 0;
  opacity: 1;
  min-height: 36px;
}
[data-design="a"] .a-funnel-pointer svg {
  width: 48px; height: 28px;
  display: block;
  overflow: visible;
}

/* Answer chips — E2 (funnel-option buttons) */
[data-design="a"] .a-chips {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
[data-design="a"] .a-chip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
  font-family: var(--a-font-body);
  font-size: 16px;
  line-height: 1.3;
  color: var(--a-ink);
  background: var(--a-canvas);
  border: 1px solid color-mix(in srgb, var(--a-rule) 26%, transparent);
  border-radius: var(--a-radius-card);
  padding: 14px 18px;
  min-height: 56px;  /* ≥56px tap target */
  cursor: pointer;
  transition: border-color var(--a-dur-tap) linear,
              background  var(--a-dur-tap) linear,
              transform   var(--a-dur-tap) var(--a-ease-pop);
  width: 100%;
  opacity: 1;        /* HARD: resting opacity:1 — never reveal-gate chips */
}
[data-design="a"] .a-chip__label {
  font-family: var(--a-font-display);
  font-size: 16px;
  letter-spacing: -.005em;
}
[data-design="a"] .a-chip__sub {
  color: var(--a-muted);
  /* opacity:1 — sub-labels must not be opacity:0 */
}
[data-design="a"] .a-chip.is-picked {
  background: color-mix(in srgb, var(--a-neon) 15%, var(--a-canvas));
  border-color: var(--a-neon);
}
[data-design="a"] .a-chip:active {
  transform: scale(0.98);
}
[data-design="a"] .a-chip:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--a-rose);
}

/* Hover guarded inside @media(hover:hover)and(pointer:fine) — MOTION GATE */
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .a-chip:hover {
    border-color: var(--a-neon);
    transform: translateY(-1px);
  }
  [data-design="a"] .a-drawer__grip:hover {
    background: color-mix(in srgb, var(--a-ink) 45%, transparent);
  }
  [data-design="a"] .a-link:hover {
    text-decoration: underline;
  }
  [data-design="a"] .a-funnel__back:hover {
    color: var(--a-ink);
  }
  [data-design="a"] .a-funnel__send:hover {
    filter: brightness(1.08);
  }
  [data-design="a"] .a-burger:hover {
    border-color: color-mix(in srgb, var(--a-neon) 40%, transparent);
  }
}

/* Contact step fields */
[data-design="a"] .a-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 14px;
}
[data-design="a"] .a-field__label {
  font-family: var(--a-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--a-muted);
}
[data-design="a"] .a-field__opt {
  opacity: 1;
  color: var(--a-muted);
}
[data-design="a"] .a-field input {
  width: 100%;
  font-family: var(--a-font-body);
  font-size: 16px;
  color: var(--a-ink);
  background: var(--a-canvas);
  border: 1px solid color-mix(in srgb, var(--a-rule) 26%, transparent);
  border-radius: var(--a-radius-card);
  padding: 14px 16px;
  min-height: 56px;
}
[data-design="a"] .a-field input:focus {
  outline: none;
  border: 2px solid var(--a-neon);
  padding: 13px 15px;
}
[data-design="a"] .a-field input::placeholder { color: var(--a-muted); }

/* Funnel nav */
[data-design="a"] .a-funnel__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
}
[data-design="a"] .a-funnel__back {
  font-family: var(--a-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--a-muted);
  background: none;
  border: 0;
  cursor: pointer;
  padding: 10px 4px;
  min-height: 44px;
  opacity: 1;
}
[data-design="a"] .a-funnel__send {
  font-family: var(--a-font-display);
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--a-canvas);
  background: var(--a-neon);
  border: 0;
  border-radius: var(--a-radius-pill);
  padding: 14px 28px;
  cursor: pointer;
  min-height: 52px;
  opacity: 1;
  animation: a-send-breath 4.5s var(--a-ease-swipe) infinite;
}
@keyframes a-send-breath {
  0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--a-neon) 0%, transparent); }
  50%      { box-shadow: 0 0 20px 2px color-mix(in srgb, var(--a-neon) 50%, transparent); }
}
[data-design="a"] .a-funnel__send.is-saved {
  animation: a-send-bounce var(--a-dur-bounce) var(--a-ease-bounce);
}
@keyframes a-send-bounce {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.18); }
  55%  { transform: scale(0.94); }
  100% { transform: scale(1); }
}
[data-design="a"] .a-funnel__send:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--a-rose);
}

/* Done state */
[data-design="a"] .a-funnel__done {
  margin-top: 20px;
  padding: 20px;
  border-radius: var(--a-radius-card);
  background: color-mix(in srgb, var(--a-seal) 18%, var(--a-canvas));
  border: 1px solid color-mix(in srgb, var(--a-seal) 50%, transparent);
}
[data-design="a"] .a-funnel__done-title {
  font-family: var(--a-font-display);
  font-size: 22px;
  margin: 0 0 8px;
  color: var(--a-ink);
}
[data-design="a"] .a-funnel__done-body {
  font-size: 16px;
  color: var(--a-ink-soft);
  margin: 0;
}
[data-design="a"] .a-funnel.is-done .a-funnel__window,
[data-design="a"] .a-funnel.is-done .a-funnel__dots { display: none; }

/* ============================================================
   SIGNATURE TRIAD-2 — Scroll-driven parallax on hero→funnel handoff
   IntersectionObserver + CSS custom property drive translateY shift
   GPU composited (transform only) — NOT a fade-in-on-scroll
   ============================================================ */
[data-design="a"] .a-hero {
  --a-scroll-y: 0;
  will-change: transform;
}
/* .a-hero__substrate gets a deeper parallax via JS-set --a-parallax-offset */
[data-design="a"] .a-hero__substrate {
  transform: translateY(var(--a-parallax-offset, 0px));
  transition: none; /* driven by scroll, not transition */
}

/* ============================================================
   E4 — REASSURANCE BAR (below funnel, Element 4 ambient)
   Drift scan — different from hero substrate (AMB-1 ≤ 2 segments)
   ============================================================ */
[data-design="a"] .a-reassurance-bar {
  position: relative;
  border-top: 1px solid color-mix(in srgb, var(--a-rule) 20%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--a-rule) 20%, transparent);
  overflow: hidden;
  padding: 20px clamp(16px,5vw,40px);
}
[data-design="a"] .a-reassurance-bar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px 20px;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
[data-design="a"] .a-trust-item {
  white-space: nowrap;
  opacity: 1;
}
[data-design="a"] .a-trust-sep {
  width: 3px; height: 3px;
  border-radius: var(--a-radius-pin);
  background: var(--a-rule);
  flex: 0 0 auto;
  opacity: 1;
}
/* Scan — transform-only ambient (MOTION GATE CLEAN) */
[data-design="a"] .a-reassurance-bar__scan {
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 60%;
  pointer-events: none;
  background: linear-gradient(180deg,
    transparent,
    color-mix(in srgb, var(--a-neon) 9%, transparent),
    transparent);
  animation: a-bar-scan 14s var(--a-ease-swipe) infinite;
}
@keyframes a-bar-scan {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(280%); }
}

/* ============================================================
   FOOTER
   ============================================================ */
[data-design="a"] .a-footer {
  padding: clamp(32px,6vw,64px) clamp(16px,5vw,40px) max(28px,env(safe-area-inset-bottom));
  border-top: 1px solid color-mix(in srgb, var(--a-rule) 16%, transparent);
}
[data-design="a"] .a-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
[data-design="a"] .a-footer__name {
  font-family: var(--a-font-sticker);
  font-size: 16px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--a-ink);
  margin: 0;
}
[data-design="a"] .a-footer__address,
[data-design="a"] .a-footer__contact,
[data-design="a"] .a-footer__site,
[data-design="a"] .a-footer__legal {
  margin: 0;
}

/* ============================================================
   REDUCED MOTION — all ambient loops off, functionality intact
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .a-header__sweep { animation: none; transform: translateX(0); }
  [data-design="a"] .a-logo::after { animation: none; }
  [data-design="a"] .a-hero__substrate { animation: none; }
  [data-design="a"] .a-ptr-v1,
  [data-design="a"] .a-ptr-v2,
  [data-design="a"] .a-ptr-v3 { animation: none; }
  [data-design="a"] .a-progress__fill { transition: none; }
  [data-design="a"] .a-funnel__track { transition: none; }
  [data-design="a"] .a-funnel__dot { transition: none; }
  [data-design="a"] .a-chip { transition: none; }
  [data-design="a"] .a-funnel__send { animation: none; }
  [data-design="a"] .a-funnel__send.is-saved { animation: none; }
  [data-design="a"] .a-reassurance-bar__scan { animation: none; }
  [data-design="a"] .a-drawer,
  [data-design="a"] .a-drawer__sheet { transition: none; }
}

/* ============================================================
   RESPONSIVE — 320 / 390 / 768 / 1440
   No horizontal scroll under any condition
   ============================================================ */
@media (min-width: 769px) {
  [data-design="a"] .a-hero__inner { max-width: 720px; }
  [data-design="a"] .a-value-prop { font-size: clamp(36px, 4.5vw, 56px); }
  [data-design="a"] .a-chips { flex-direction: row; flex-wrap: wrap; }
  [data-design="a"] .a-chip { flex: 1 1 calc(50% - 5px); }
}
@media (max-width: 768px) {
  [data-design="a"] .a-header__bar { padding: 14px clamp(16px,5vw,28px); }
  [data-design="a"] .a-header__progress { max-width: 140px; }
}
@media (max-width: 560px) {
  [data-design="a"] .a-hero { min-height: 92vh; }
  [data-design="a"] .a-funnel__q { font-size: 19px; }
}
@media (max-width: 390px) {
  [data-design="a"] .a-value-prop { font-size: clamp(24px,8vw,32px); }
  [data-design="a"] .a-funnel__send { font-size: 14px; padding: 13px 20px; }
}
@media (max-width: 320px) {
  [data-design="a"] .a-hero { padding: 36px 14px 28px; }
  [data-design="a"] .a-funnel-wrap { padding: 28px 14px; }
  [data-design="a"] .a-funnel { padding: 16px; }
  [data-design="a"] .a-header__bar { padding: 12px 14px; }
  [data-design="a"] .a-logo__mark { font-size: 14px; }
  [data-design="a"] .a-logo__ring { width: 20px; height: 20px; }
  [data-design="a"] .a-progress__label { font-size: 9px; }
  [data-design="a"] .a-chip { min-height: 52px; }
}

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