/* Saint Paul Fence Install & Repair — Design A — styles.css
   Design system: Mortise & Meadow, remapped [data-design="a"] -> [data-design="a"].dq-design
   Trade: fencing — unique animated hero (line-run/post-set), estimator funnel (EST-1..8) */

[data-design="a"] {
  /* ─── Color — handmade-paper field (canonical / daylit) ─────────────────── */
  --design-a-primary: #5C6A38; /* willow-moss — primary structural ink */
  --mm-paper:       #E9DEC6;
  --mm-paper-deep:  #E0D3B4;
  --mm-panel:       #D7C7A2;
  --mm-surface:     #F1E8D2;
  --mm-surface-2:   #F8F1E0;
  --mm-oak:         #2A2017;
  --mm-oak-2:       #4A3725;
  --mm-bark:        #715A3E;
  --mm-faint:       #9C875F;
  --mm-border:      #C8B488;
  --mm-border-soft: #D8C8A0;
  --mm-rule:        #B29A6B;
  --mm-fumed:       #221A12;
  --mm-fumed-deep:  #19130C;

  --mm-moss:        #5C6A38;
  --mm-moss-deep:   #44512A;
  --mm-moss-glow:   #7A8A4E;
  --mm-ochre:       #B5832A;
  --mm-ochre-deep:  #936818;
  --mm-ochre-glow:  #DCA948;
  --mm-oxblood:     #8E3A22;
  --mm-oxblood-deep:#6C2914;
  --mm-oxblood-glow:#B05433;
  --mm-patina:      #2F6A5B;
  --mm-patina-deep: #1F4E42;

  --mm-success:     #6A7A3C;
  --mm-warn:        #B5832A;
  --mm-critical:    #9A3318;

  /* ─── Typography ──────────────────────────────────────────────────────── */
  --mm-font-display: "Goudy Old Style", "Goudy Bookletter 1911", "Sorts Mill Goudy", "Hoefler Text", "Iowan Old Style", Georgia, serif;
  --mm-font-body:    "Iowan Old Style", "Charter", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --mm-font-stamp:   "Saira Semi Condensed", "Oswald", "Trade Gothic Condensed", "Futura", "Arial Narrow", system-ui, sans-serif;
  --mm-font-mono:    "Space Mono", "IBM Plex Mono", ui-monospace, "Courier New", monospace;

  --mm-text-meta:    clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --mm-text-cap:     clamp(0.875rem, 0.84rem + 0.2vw, 0.9375rem);
  --mm-text-body:    clamp(1rem, 0.96rem + 0.3vw, 1.1875rem);
  --mm-text-lead:    clamp(1.125rem, 1.04rem + 0.5vw, 1.375rem);
  --mm-text-h3:      clamp(1.375rem, 1.2rem + 0.9vw, 1.875rem);
  --mm-text-h2:      clamp(1.875rem, 1.5rem + 1.9vw, 3.125rem);
  --mm-text-h1:      clamp(2.375rem, 1.6rem + 3.8vw, 4.5rem);

  --mm-leading-body:     1.62;
  --mm-leading-tight:    1.1;
  --mm-tracking-display: 0.004em;
  --mm-tracking-stamp:   0.16em;

  /* ─── Spacing (4px base) ──────────────────────────────────────────────── */
  --mm-hair:    4px;
  --mm-tight:   8px;
  --mm-gap:     16px;
  --mm-pad:     24px;
  --mm-stile:   40px;
  --mm-rail:    64px;
  --mm-section: clamp(80px, 6vw + 40px, 96px);
  --mm-bay:     clamp(96px, 9vw, 128px);

  /* ─── Motion ──────────────────────────────────────────────────────────── */
  --mm-ease-seat:  cubic-bezier(0.2, 0.85, 0.2, 1);
  --mm-ease-press: cubic-bezier(0.4, 0, 0.2, 1);
  --mm-ease-gouge: cubic-bezier(0.62, 0, 0.36, 1);
  --mm-ease-warm:  cubic-bezier(0.45, 0, 0.2, 1);
  --mm-dur-tap:    150ms;
  --mm-dur-warm:   240ms;
  --mm-dur-settle: 520ms;
  --mm-cyc-header:  30s;
  --mm-cyc-sky:     26s;
  --mm-cyc-cta:     5s;
  --mm-cyc-pointer: 5.5s;
  --mm-cyc-line:    9s;
  --mm-cyc-mote:    20s;
  --mm-cyc-pattern: 24s;

  /* ─── Radius ──────────────────────────────────────────────────────────── */
  --mm-r-peg:   3px;
  --mm-r-card:  4px;
  --mm-r-frame: 2px;
  --mm-r-pill:  9999px;

  /* ─── Shadow / Elevation ──────────────────────────────────────────────── */
  --mm-shadow-plate: 0 8px 22px rgba(42, 32, 24, 0.13);
  --mm-shadow-lift:  0 14px 34px rgba(42, 32, 24, 0.20);
  --mm-impress: inset 0 2px 0 rgba(255, 250, 235, 0.55), inset 0 -3px 4px rgba(42, 32, 24, 0.18);
  --mm-focus-ring:  0 0 0 3px rgba(92, 106, 56, 0.55);
}

[data-design="a"].dq-design { background: var(--mm-paper); color: var(--mm-oak); font-family: var(--mm-font-body); }
[data-design="a"].dq-design * { box-sizing: border-box; }

/* ═══════════════════════ HEADER ═══════════════════════ */
[data-design="a"] .mm-header { position: sticky; top: 0; z-index: 60;
  background: var(--mm-fumed); color: var(--mm-paper); overflow: clip; }
[data-design="a"] .mm-header__bar { position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between; gap: var(--mm-gap);
  max-width: 1320px; margin-inline: auto; padding: var(--mm-tight) clamp(16px, 4vw, 40px); }
[data-design="a"] .mm-logo { display: inline-block; text-decoration: none;
  font-family: var(--mm-font-display); font-weight: 700; letter-spacing: var(--mm-tracking-display);
  font-size: clamp(0.95rem, 0.8rem + 0.8vw, 1.35rem); color: var(--mm-paper);
  background: var(--mm-fumed-deep); padding: 6px 16px; border-radius: var(--mm-r-peg);
  box-shadow: var(--mm-impress); max-width: 62vw; }
[data-design="a"] .mm-logo__mark { display: inline-block; }
[data-design="a"] .mm-header__light { position: absolute; inset: 0; z-index: 1;
  color: var(--mm-moss-glow); pointer-events: none; }
[data-design="a"] .mm-header__pool { position: absolute; top: -40%; width: 220px; height: 220px;
  border-radius: 50%; filter: blur(20px); opacity: .22; mix-blend-mode: screen; }
[data-design="a"] .mm-header__pool--a { left: 18%;
  background: radial-gradient(circle, var(--mm-ochre-glow) 0%, transparent 68%);
  animation: mma-pool-a var(--mm-cyc-header) var(--mm-ease-warm) infinite alternate; }
[data-design="a"] .mm-header__pool--b { left: 52%;
  background: radial-gradient(circle, var(--mm-moss-glow) 0%, transparent 70%);
  animation: mma-pool-b calc(var(--mm-cyc-header) * 1.18) var(--mm-ease-warm) infinite alternate; }
@keyframes mma-pool-a { from { transform: translateX(-26px); opacity: .14; } to { transform: translateX(22px); opacity: .30; } }
@keyframes mma-pool-b { from { transform: translateX(20px); opacity: .12; } to { transform: translateX(-24px); opacity: .26; } }
[data-design="a"] .mm-header__bough { position: absolute; right: clamp(70px, 16vw, 220px);
  top: 50%; width: 120px; height: 60px; transform: translateY(-50%); color: var(--mm-moss); opacity: .34;
  transform-origin: 6px 50px; animation: mma-bough-stir 17s var(--mm-ease-warm) infinite alternate; }
@keyframes mma-bough-stir { from { transform: translateY(-50%) rotate(-1.4deg); } to { transform: translateY(-50%) rotate(1.6deg); } }
[data-design="a"] .mm-burger { display: inline-flex; flex-direction: column; gap: 5px;
  width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent;
  border: 0; cursor: pointer; border-radius: var(--mm-r-peg); flex: 0 0 auto; }
[data-design="a"] .mm-burger__bar { display: block; width: 24px; height: 2px;
  background: var(--mm-paper); transition: transform var(--mm-dur-warm) var(--mm-ease-seat), opacity var(--mm-dur-tap) linear; }
[data-design="a"] .mm-burger[aria-expanded="true"] .mm-burger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
[data-design="a"] .mm-burger[aria-expanded="true"] .mm-burger__bar:nth-child(2) { opacity: 0; }
[data-design="a"] .mm-burger[aria-expanded="true"] .mm-burger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
[data-design="a"] .mm-burger:focus-visible { box-shadow: var(--mm-focus-ring); outline: none; }

/* drawer */
[data-design="a"] .mm-drawer { position: fixed; inset: 0; z-index: 70;
  background: color-mix(in oklab, var(--mm-fumed-deep), transparent 5%); }
[data-design="a"] .mm-drawer[hidden] { display: none; }
[data-design="a"] .mm-drawer__panel { max-width: 1200px; margin-inline: auto; min-height: 100%;
  display: flex; flex-direction: column; gap: var(--mm-gap); justify-content: center;
  padding: clamp(48px, 12vh, 120px) clamp(24px, 8vw, 80px); transform: translateY(-14px); opacity: 0; }
[data-design="a"] .mm-drawer.is-open .mm-drawer__panel { animation: mma-drawer-in var(--mm-dur-settle) var(--mm-ease-seat) forwards; }
@keyframes mma-drawer-in { to { transform: translateY(0); opacity: 1; } }
[data-design="a"] .mm-navlink { font-family: var(--mm-font-display); font-weight: 700;
  font-size: clamp(1.4rem, 1rem + 2.4vw, 2.4rem); color: var(--mm-paper); text-decoration: none; width: max-content; padding: 4px 0; }
[data-design="a"] .mm-navlink::after { content: ""; display: block; height: 3px;
  background: var(--mm-moss-glow); transform: scaleX(0); transform-origin: left;
  transition: transform var(--mm-dur-warm) var(--mm-ease-gouge); }
[data-design="a"] .mm-navlink:focus-visible::after { transform: scaleX(1); }
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .mm-navlink:hover::after { transform: scaleX(1); }
  [data-design="a"] .mm-logo:hover { transform: translateY(-1px); }
}

/* ═══════════════════════ STAMP (button) ═══════════════════════ */
[data-design="a"] .mm-stamp { position: relative; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--mm-tight);
  font-family: var(--mm-font-display); font-weight: 700; font-size: var(--mm-text-lead);
  letter-spacing: var(--mm-tracking-display); text-decoration: none;
  color: var(--mm-surface-2); background: var(--mm-oxblood);
  padding: 14px 26px; min-height: 56px; min-width: 44px; border: 0; cursor: pointer; border-radius: var(--mm-r-card);
  box-shadow: var(--mm-impress), var(--mm-shadow-plate);
  transition: transform var(--mm-dur-tap) var(--mm-ease-press),
    background-color var(--mm-dur-warm) var(--mm-ease-warm),
    box-shadow var(--mm-dur-tap) var(--mm-ease-press); }
[data-design="a"] .mm-stamp__halo { position: absolute; inset: -2px; z-index: -1;
  border-radius: inherit; box-shadow: 0 0 0 0 rgba(220, 169, 72, 0);
  animation: mma-lantern var(--mm-cyc-cta) var(--mm-ease-warm) infinite; }
@keyframes mma-lantern {
  0%, 100% { box-shadow: 0 0 12px 0 rgba(220, 169, 72, .22); }
  50%      { box-shadow: 0 0 24px 5px rgba(220, 169, 72, .42); }
}
[data-design="a"] .mm-stamp:focus-visible { outline: none; box-shadow: var(--mm-focus-ring), var(--mm-impress); }
[data-design="a"] .mm-stamp:active { transform: translateY(2px) scale(.985);
  background: var(--mm-oxblood-deep);
  box-shadow: inset 0 3px 5px rgba(42, 32, 24, .34), inset 0 1px 0 rgba(255, 250, 235, .25); }
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .mm-stamp:hover { transform: translateY(-1px); background: var(--mm-oxblood-glow); }
}
[data-design="a"] .mm-stamp--drawer { background: var(--mm-ochre); color: var(--mm-fumed-deep); font-size: var(--mm-text-h3); width: max-content; }
[data-design="a"] .mm-stamp--drawer:active { background: var(--mm-ochre-deep); }
[data-design="a"] .mm-stamp--drawer-alt { background: var(--mm-moss); color: var(--mm-paper); font-size: var(--mm-text-lead); }
[data-design="a"] .mm-stamp--drawer-alt:active { background: var(--mm-moss-deep); }
[data-design="a"] .mm-stamp--submit,
[data-design="a"] .mm-stamp--repeat,
[data-design="a"] .mm-stamp--contact,
[data-design="a"] .mm-stamp--footer { width: max-content; }

/* ═══════════════════════ HERO ═══════════════════════ */
[data-design="a"] .mm-hero { position: relative; isolation: isolate;
  min-height: 92svh; display: flex; align-items: flex-end; overflow: clip; background: var(--mm-fumed-deep); }
[data-design="a"] .mm-hero__media { position: absolute; inset: 0; z-index: 0; }

/* golden-hour warm-shift — alive on first paint, no photo dependency */
[data-design="a"] .mm-hero__warm { position: absolute; inset: 0; mix-blend-mode: soft-light;
  background: linear-gradient(180deg, rgba(92,106,56,.34) 0%, rgba(181,131,42,.26) 54%, rgba(142,58,34,.36) 100%);
  animation: mma-warmshift var(--mm-cyc-sky) var(--mm-ease-warm) infinite alternate; }
@keyframes mma-warmshift { from { opacity: .6; filter: hue-rotate(-6deg); } to { opacity: .95; filter: hue-rotate(7deg); } }
[data-design="a"] .mm-hero__lamp { position: absolute; top: 14%; right: 15%;
  width: clamp(140px, 22vw, 300px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(220,169,72,.82) 0%, rgba(220,169,72,.26) 44%, transparent 70%);
  animation: mma-lampglow 12s var(--mm-ease-warm) infinite alternate; }
@keyframes mma-lampglow { from { opacity: .6; transform: scale(.97); } to { opacity: 1; transform: scale(1.04); } }
[data-design="a"] .mm-hero__motes { position: absolute; inset: 0; opacity: .55;
  background-image:
    radial-gradient(2px 2px at 22% 32%, rgba(220,169,72,.9), transparent),
    radial-gradient(2px 2px at 68% 48%, rgba(255,250,235,.7), transparent),
    radial-gradient(2px 2px at 42% 78%, rgba(220,169,72,.7), transparent),
    radial-gradient(2px 2px at 83% 24%, rgba(255,250,235,.6), transparent);
  background-repeat: no-repeat;
  animation: mma-mote var(--mm-cyc-mote) linear infinite; }
@keyframes mma-mote { from { transform: translate3d(0,0,0); } to { transform: translate3d(-16px,-24px,0); } }

/* the unique animated hero — fence line-run reveal (post-set + rail + picket fill) */
[data-design="a"] .mm-hero__line { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 46%;
  min-height: 200px; color: var(--design-a-primary); opacity: .9; }
[data-design="a"] .mm-line__rail-top,
[data-design="a"] .mm-line__rail-bot { stroke: var(--mm-ochre-glow); stroke-width: 3; stroke-linecap: round;
  transform: scaleX(0); transform-origin: 0% 50%;
  animation: mma-rail-draw 2.6s var(--mm-ease-gouge) forwards; }
[data-design="a"] .mm-line__rail-bot { animation-delay: .15s; }
@keyframes mma-rail-draw { to { transform: scaleX(1); } }
[data-design="a"] .mm-line__post { fill: var(--mm-oxblood-deep);
  transform: translateY(-90px); opacity: 0; transform-box: fill-box; transform-origin: 50% 0%;
  animation: mma-post-drive 900ms var(--mm-ease-seat) forwards; }
[data-design="a"] .mm-line__post:nth-child(1) { animation-delay: .05s; }
[data-design="a"] .mm-line__post:nth-child(2) { animation-delay: .32s; }
[data-design="a"] .mm-line__post:nth-child(3) { animation-delay: .59s; }
[data-design="a"] .mm-line__post:nth-child(4) { animation-delay: .86s; }
[data-design="a"] .mm-line__post:nth-child(5) { animation-delay: 1.13s; }
[data-design="a"] .mm-line__post:nth-child(6) { animation-delay: 1.40s; }
@keyframes mma-post-drive { from { transform: translateY(-90px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
[data-design="a"] .mm-line__picket { fill: var(--design-a-primary);
  opacity: 0; transform: scaleY(.4); transform-box: fill-box; transform-origin: 50% 100%;
  animation: mma-picket-fill 480ms var(--mm-ease-seat) forwards; }
@keyframes mma-picket-fill { to { opacity: .82; transform: scaleY(1); } }
[data-design="a"] .mm-line__pickets rect:nth-child(1)  { animation-delay: 1.55s; }
[data-design="a"] .mm-line__pickets rect:nth-child(2)  { animation-delay: 1.60s; }
[data-design="a"] .mm-line__pickets rect:nth-child(3)  { animation-delay: 1.65s; }
[data-design="a"] .mm-line__pickets rect:nth-child(4)  { animation-delay: 1.70s; }
[data-design="a"] .mm-line__pickets rect:nth-child(5)  { animation-delay: 1.80s; }
[data-design="a"] .mm-line__pickets rect:nth-child(6)  { animation-delay: 1.85s; }
[data-design="a"] .mm-line__pickets rect:nth-child(7)  { animation-delay: 1.90s; }
[data-design="a"] .mm-line__pickets rect:nth-child(8)  { animation-delay: 1.95s; }
[data-design="a"] .mm-line__pickets rect:nth-child(9)  { animation-delay: 2.05s; }
[data-design="a"] .mm-line__pickets rect:nth-child(10) { animation-delay: 2.10s; }
[data-design="a"] .mm-line__pickets rect:nth-child(11) { animation-delay: 2.15s; }
[data-design="a"] .mm-line__pickets rect:nth-child(12) { animation-delay: 2.20s; }
[data-design="a"] .mm-line__pickets rect:nth-child(13) { animation-delay: 2.30s; }
[data-design="a"] .mm-line__pickets rect:nth-child(14) { animation-delay: 2.35s; }
[data-design="a"] .mm-line__pickets rect:nth-child(15) { animation-delay: 2.40s; }
[data-design="a"] .mm-line__pickets rect:nth-child(16) { animation-delay: 2.45s; }
[data-design="a"] .mm-line__pickets rect:nth-child(17) { animation-delay: 2.55s; }
[data-design="a"] .mm-line__pickets rect:nth-child(18) { animation-delay: 2.60s; }
[data-design="a"] .mm-line__pickets rect:nth-child(19) { animation-delay: 2.65s; }
[data-design="a"] .mm-line__pickets rect:nth-child(20) { animation-delay: 2.70s; }
[data-design="a"] .mm-line__pickets rect:nth-child(21) { animation-delay: 2.80s; }
[data-design="a"] .mm-line__pickets rect:nth-child(22) { animation-delay: 2.85s; }
[data-design="a"] .mm-line__pickets rect:nth-child(23) { animation-delay: 2.90s; }
[data-design="a"] .mm-line__pickets rect:nth-child(24) { animation-delay: 2.95s; }
/* sustained ambient sway after the reveal settles — keeps the layer perceptibly alive at rest */
[data-design="a"] .mm-line__posts { transform-box: fill-box; transform-origin: 50% 100%;
  animation: mma-line-sway var(--mm-cyc-line) var(--mm-ease-warm) infinite alternate; animation-delay: 3.2s; }
[data-design="a"] .mm-line__pickets { transform-box: fill-box; transform-origin: 50% 100%;
  animation: mma-line-sway var(--mm-cyc-line) var(--mm-ease-warm) infinite alternate; animation-delay: 3.35s; }
@keyframes mma-line-sway { from { transform: skewX(-0.4deg); } to { transform: skewX(0.5deg); } }

[data-design="a"] .mm-hero::after { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(0deg, rgba(20,18,14,.66) 0%, rgba(20,18,14,.14) 44%, transparent 66%); }
[data-design="a"] .mm-hero__plate { position: relative; z-index: 2; isolation: isolate;
  max-width: 560px; margin: 0 clamp(16px, 5vw, 64px) clamp(40px, 7vh, 80px);
  color: var(--mm-paper); display: grid; gap: var(--mm-gap); opacity: 1;
  padding: var(--mm-pad); border: 1px solid color-mix(in oklab, var(--mm-moss-glow), transparent 55%);
  border-radius: var(--mm-r-frame); background: rgba(20,18,14,.28); }
[data-design="a"] .mm-frame__peg { position: absolute; width: 10px; height: 10px;
  border: 2px solid var(--mm-moss-glow); background: transparent; }
[data-design="a"] .mm-frame__peg--tl { top: -5px; left: -5px; border-right: 0; border-bottom: 0; }
[data-design="a"] .mm-frame__peg--br { bottom: -5px; right: -5px; border-left: 0; border-top: 0; }
[data-design="a"] .mm-hero__name { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h1); line-height: var(--mm-leading-tight); letter-spacing: var(--mm-tracking-display);
  margin: 0; text-wrap: balance; color: var(--mm-paper); opacity: 1; text-shadow: 0 2px 16px rgba(20,18,14,.55); }
[data-design="a"] .mm-hero__essence { font-family: var(--mm-font-body); font-size: var(--mm-text-lead);
  margin: 0; max-width: 44ch; text-wrap: pretty; color: var(--mm-paper); opacity: 1; }
[data-design="a"] .mm-hero__coords { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  font-size: var(--mm-text-cap); color: var(--mm-ochre-glow); margin: 0; text-transform: uppercase; opacity: 1; }
[data-design="a"] .mm-hero__season { margin: 0; }
[data-design="a"] .mm-tag { display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp); text-transform: uppercase;
  font-size: var(--mm-text-meta); padding: 5px 12px; border-radius: var(--mm-r-peg); opacity: 1; }
[data-design="a"] .mm-tag--season { background: var(--mm-ochre); color: var(--mm-fumed-deep); }
[data-design="a"] .mm-stamp--hero { width: max-content; }
@media (max-width: 640px) {
  [data-design="a"] .mm-hero__plate { margin-inline: 16px; max-width: none; }
}

/* ═══════════════════════ POINTER (E6) ═══════════════════════ */
[data-design="a"] .mm-pointer { display: grid; justify-items: center; gap: var(--mm-tight);
  padding-block: var(--mm-rail); background: var(--mm-paper); cursor: pointer; opacity: 1; min-height: 8px; }
[data-design="a"] .mm-pointer__lamp { width: 60px; height: 90px; overflow: visible; }
[data-design="a"] .mm-pointer__chain { stroke: var(--mm-rule); stroke-width: 2; stroke-linecap: round; }
[data-design="a"] .mm-pointer__post { fill: var(--mm-oxblood-deep); }
[data-design="a"] .mm-pointer__base { fill: var(--mm-bark); }
[data-design="a"] .mm-pointer__rail { stroke: var(--mm-ochre-glow); stroke-width: 3; stroke-linecap: round; }
[data-design="a"] .mm-pointer__body { transform-origin: 30px 26px;
  animation: mma-post-lower var(--mm-cyc-pointer) var(--mm-ease-warm) infinite; }
@keyframes mma-post-lower {
  0%   { transform: translateY(-8px) rotate(-1.5deg); }
  55%  { transform: translateY(5px)  rotate(1deg); }
  100% { transform: translateY(10px) rotate(0deg); }
}
[data-design="a"] .mm-pointer__label { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); opacity: 1; }
@media (max-width: 560px) {
  [data-design="a"] .mm-pointer { padding-block: var(--mm-stile); }
}

/* ═══════════════════════ FUNNEL / ESTIMATOR (E5) ═══════════════════════ */
[data-design="a"] .mm-funnel-sec { background: var(--mm-paper-deep); padding-block: var(--mm-section); }
[data-design="a"] .mm-funnel__inner { max-width: 900px; margin-inline: auto; padding-inline: clamp(16px, 5vw, 48px);
  display: grid; gap: var(--mm-stile); }
[data-design="a"] .mm-funnel__title { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h2); letter-spacing: var(--mm-tracking-display); color: var(--mm-oak); margin: 0; }
[data-design="a"] .mm-funnel__sub { font-family: var(--mm-font-body); font-size: var(--mm-text-lead);
  color: var(--mm-bark); margin: 0; max-width: 60ch; }
[data-design="a"] .mm-funnel { display: grid; gap: var(--mm-gap); }
[data-design="a"] .mm-funnel__frame { background: var(--mm-surface); border: 1px solid var(--mm-border);
  border-radius: var(--mm-r-card); padding: var(--mm-pad); box-shadow: var(--mm-shadow-plate);
  display: grid; gap: var(--mm-stile); }

/* readout: gauge + live range */
[data-design="a"] .mm-funnel__readout { display: grid; gap: var(--mm-gap); justify-items: center; text-align: center;
  padding-bottom: var(--mm-stile); border-bottom: 1px solid var(--mm-border-soft); }
[data-design="a"] .mm-gauge { display: grid; justify-items: center; gap: 4px; cursor: pointer; touch-action: none;
  border-radius: var(--mm-r-card); padding: 8px; }
[data-design="a"] .mm-gauge:focus-visible { outline: none; box-shadow: var(--mm-focus-ring); }
[data-design="a"] .mm-gauge__svg { width: clamp(160px, 30vw, 220px); height: auto; }
[data-design="a"] .mm-gauge__track { fill: none; stroke: var(--mm-border); stroke-width: 6; stroke-linecap: round; }
[data-design="a"] .mm-gauge__needle line { stroke: var(--mm-oxblood); stroke-width: 4; stroke-linecap: round;
  transition: transform var(--mm-dur-warm) var(--mm-ease-seat); }
[data-design="a"] .mm-gauge__needle circle { fill: var(--mm-oxblood); }
[data-design="a"] .mm-gauge.is-dragging .mm-gauge__needle line { transition: none; }
[data-design="a"] .mm-gauge__readout { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h3); color: var(--mm-oak); }
[data-design="a"] .mm-gauge__hint { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-faint); }
[data-design="a"] .mm-funnel__range { display: grid; gap: 4px; justify-items: center; }
[data-design="a"] .mm-funnel__range-label { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); }
[data-design="a"] .mm-funnel__range-value { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h2); color: var(--mm-oxblood); }
[data-design="a"] .mm-funnel__range-note { font-size: var(--mm-text-meta); color: var(--mm-faint); max-width: 44ch; }
[data-design="a"] .mm-funnel__progress { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); margin: 0; }

/* steps: exactly ONE visible at a time (EST-8 HARD) */
[data-design="a"] .mm-funnel__steps { position: relative; }
[data-design="a"] .mm-step { border: 0; margin: 0; padding: 0; display: none; visibility: hidden; }
[data-design="a"] .mm-step.is-active { display: grid; gap: var(--mm-gap); visibility: visible;
  animation: mma-step-in var(--mm-dur-settle) var(--mm-ease-seat); }
@keyframes mma-step-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
[data-design="a"] .mm-step__q { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h3); color: var(--mm-oak); margin: 0; padding: 0; }
[data-design="a"] .mm-step__hint { font-family: var(--mm-font-body); font-weight: 400; font-size: var(--mm-text-cap); color: var(--mm-bark); }
[data-design="a"] .mm-step__chips { display: flex; flex-wrap: wrap; gap: 12px; }
[data-design="a"] .mm-chip { font-family: var(--mm-font-stamp); letter-spacing: 0.02em;
  font-size: var(--mm-text-cap); color: var(--mm-oak); background: var(--mm-surface-2);
  border: 1px solid var(--mm-border); border-radius: var(--mm-r-peg); padding: 14px 18px;
  min-height: 56px; min-width: 44px; cursor: pointer;
  transition: transform var(--mm-dur-tap) var(--mm-ease-press), background-color var(--mm-dur-warm) var(--mm-ease-warm),
    border-color var(--mm-dur-warm) var(--mm-ease-warm); }
[data-design="a"] .mm-chip.is-picked { background: var(--mm-moss); border-color: var(--mm-moss-deep); color: var(--mm-paper); }
[data-design="a"] .mm-chip--quiet { background: transparent; color: var(--mm-bark); }
[data-design="a"] .mm-chip:focus-visible { outline: none; box-shadow: var(--mm-focus-ring); }
[data-design="a"] .mm-chip:active { transform: translateY(1px) scale(.98); }
@media (hover: hover) and (pointer: fine) {
  [data-design="a"] .mm-chip:hover { border-color: var(--mm-moss); }
}
[data-design="a"] .mm-step__toggle { display: flex; align-items: center; gap: 10px; font-size: var(--mm-text-cap); color: var(--mm-bark); }
[data-design="a"] .mm-step__toggle input { width: 20px; height: 20px; accent-color: var(--mm-moss); }
[data-design="a"] .mm-step__summary { font-size: var(--mm-text-body); color: var(--mm-oak-2); background: var(--mm-paper-deep);
  border-radius: var(--mm-r-peg); padding: var(--mm-pad); margin: 0; }
[data-design="a"] .mm-field-group { display: grid; gap: 6px; }
[data-design="a"] .mm-field-group__label { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); }
[data-design="a"] .mm-field { background: var(--mm-surface-2); border: 1px solid var(--mm-border);
  border-radius: var(--mm-r-peg); padding: 12px 14px; font-size: var(--mm-text-body); color: var(--mm-oak);
  font-family: var(--mm-font-body); min-height: 44px; }
[data-design="a"] .mm-field:focus-visible { outline: none; border-color: var(--mm-moss); box-shadow: var(--mm-focus-ring); }
[data-design="a"] .mm-step__done { display: grid; gap: var(--mm-gap); }
[data-design="a"] .mm-step__done-text { font-size: var(--mm-text-body); color: var(--mm-oak-2); margin: 0; }
[data-design="a"] .mm-funnel__nav { display: flex; justify-content: flex-start; }
[data-design="a"] .mm-funnel__back { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); background: transparent;
  border: 0; cursor: pointer; min-height: 44px; padding: 8px 4px; }
[data-design="a"] .mm-funnel__live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
[data-design="a"] .mm-funnel__below { font-size: var(--mm-text-cap); color: var(--mm-bark); max-width: 70ch; }

/* ═══════════════════════ MATERIALS — Element 4 ambient field ═══════════════════════ */
[data-design="a"] .mm-ambient-b { position: relative; isolation: isolate; overflow: clip;
  background: var(--mm-paper-deep); padding-block: var(--mm-section); }
[data-design="a"] .mm-ambient-b__field { position: absolute; inset: 0; z-index: 0; opacity: .15; pointer-events: none; }
[data-design="a"] .mm-block { width: 132%; height: 100%; }
[data-design="a"] .mm-block__g { transform-box: fill-box;
  animation: mma-blockdrift var(--mm-cyc-pattern) var(--mm-ease-warm) infinite alternate; }
@keyframes mma-blockdrift {
  from { transform: translate3d(0, 0, 0); opacity: .6; }
  to   { transform: translate3d(-24px, 8px, 0); opacity: 1; }
}
[data-design="a"] .mm-ambient-b__inner { position: relative; z-index: 1; max-width: 1100px; margin-inline: auto;
  padding-inline: clamp(16px, 5vw, 48px); display: grid; gap: var(--mm-stile); }
[data-design="a"] .mm-ambient-b__title { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h2); letter-spacing: var(--mm-tracking-display); color: var(--mm-oak); margin: 0; }
[data-design="a"] .mm-materials { display: grid; gap: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-design="a"] .mm-materials__row { background: var(--mm-surface); border: 1px solid var(--mm-border);
  border-radius: var(--mm-r-card); padding: var(--mm-pad); }
[data-design="a"] .mm-materials__name { font-family: var(--mm-font-display); font-size: var(--mm-text-h3); color: var(--mm-oak); margin: 0 0 8px; }
[data-design="a"] .mm-materials__desc { font-size: var(--mm-text-body); color: var(--mm-oak-2); margin: 0; }
@media (max-width: 640px) { [data-design="a"] .mm-materials { grid-template-columns: 1fr; } }

/* ═══════════════════════ PROCESS ═══════════════════════ */
[data-design="a"] .mm-process { background: var(--mm-paper); padding-block: var(--mm-section); }
[data-design="a"] .mm-process__inner { max-width: 1100px; margin-inline: auto; padding-inline: clamp(16px, 5vw, 48px); }
[data-design="a"] .mm-process__title { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h2); color: var(--mm-oak); margin: 0 0 var(--mm-stile); }
[data-design="a"] .mm-process__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
[data-design="a"] .mm-process__step { display: grid; gap: 6px; background: var(--mm-surface);
  border: 1px solid var(--mm-border-soft); border-radius: var(--mm-r-card); padding: var(--mm-pad); }
[data-design="a"] .mm-process__num { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  color: var(--mm-ochre-deep); font-size: var(--mm-text-cap); }
[data-design="a"] .mm-process__text { font-size: var(--mm-text-body); color: var(--mm-oak-2); }

/* ═══════════════════════ REPEATED CTA ═══════════════════════ */
[data-design="a"] .mm-repeat-cta { background: var(--mm-fumed); padding-block: var(--mm-rail); }
[data-design="a"] .mm-repeat-cta__inner { max-width: 900px; margin-inline: auto; padding-inline: clamp(16px, 5vw, 48px);
  display: grid; gap: var(--mm-gap); justify-items: center; text-align: center; }
[data-design="a"] .mm-repeat-cta__line { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h3); color: var(--mm-paper); margin: 0; }

/* ═══════════════════════ ABOUT / CONTACT ═══════════════════════ */
[data-design="a"] .mm-about { background: var(--mm-paper-deep); padding-block: var(--mm-section); }
[data-design="a"] .mm-about__inner { max-width: 900px; margin-inline: auto; padding-inline: clamp(16px, 5vw, 48px);
  display: grid; gap: var(--mm-gap); }
[data-design="a"] .mm-about__title { font-family: var(--mm-font-display); font-weight: 700;
  font-size: var(--mm-text-h2); color: var(--mm-oak); margin: 0; }
[data-design="a"] .mm-about__text { font-size: var(--mm-text-body); color: var(--mm-oak-2); max-width: 70ch; }
[data-design="a"] .mm-about__areas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
[data-design="a"] .mm-about__areas li { font-family: var(--mm-font-stamp); letter-spacing: var(--mm-tracking-stamp);
  text-transform: uppercase; font-size: var(--mm-text-meta); color: var(--mm-bark); background: var(--mm-surface);
  border: 1px solid var(--mm-border); border-radius: var(--mm-r-peg); padding: 6px 12px; }

/* ═══════════════════════ FOOTER ═══════════════════════ */
[data-design="a"] .mm-footer { background: var(--mm-fumed); padding-block: var(--mm-rail); }
[data-design="a"] .mm-footer__inner { max-width: 900px; margin-inline: auto; padding-inline: clamp(16px, 5vw, 48px);
  display: grid; gap: 12px; justify-items: start; }
[data-design="a"] .mm-footer__name { font-family: var(--mm-font-display); font-weight: 700; font-size: var(--mm-text-h3);
  color: var(--mm-paper); margin: 0; }
[data-design="a"] .mm-footer__loc { font-size: var(--mm-text-cap); color: var(--mm-dusk-muted, #AEB4AC); margin: 0; }
[data-design="a"] .mm-footer__legal { font-size: var(--mm-text-meta); color: var(--mm-faint); margin: 8px 0 0; }

/* ═══════════════════════ Reduced motion ═══════════════════════ */
@media (prefers-reduced-motion: reduce) {
  [data-design="a"] .mm-header__pool--a,
  [data-design="a"] .mm-header__pool--b,
  [data-design="a"] .mm-header__bough,
  [data-design="a"] .mm-hero__warm,
  [data-design="a"] .mm-hero__lamp,
  [data-design="a"] .mm-hero__motes,
  [data-design="a"] .mm-line__rail-top,
  [data-design="a"] .mm-line__rail-bot,
  [data-design="a"] .mm-line__post,
  [data-design="a"] .mm-line__picket,
  [data-design="a"] .mm-line__posts,
  [data-design="a"] .mm-line__pickets,
  [data-design="a"] .mm-pointer__body,
  [data-design="a"] .mm-block__g,
  [data-design="a"] .mm-stamp__halo,
  [data-design="a"] .mm-step.is-active { animation: none; }
  [data-design="a"] .mm-line__rail-top,
  [data-design="a"] .mm-line__rail-bot { transform: scaleX(1); }
  [data-design="a"] .mm-line__post { transform: translateY(0); opacity: 1; }
  [data-design="a"] .mm-line__picket { opacity: .82; transform: scaleY(1); }
  [data-design="a"] .mm-drawer.is-open .mm-drawer__panel { animation: none; transform: none; opacity: 1; }
}

/* ═══════════════════════ Mobile ═══════════════════════ */
@media (max-width: 560px) {
  [data-design="a"] .mm-header__bough { right: 10px; opacity: .24; width: 92px; }
  [data-design="a"] .mm-header__pool { width: 150px; height: 150px; }
  [data-design="a"] .mm-pointer { padding-block: var(--mm-stile); }
}

/* ═══════════════════════ MANDATORY viewport-clip / self-center rules ═══════════════════════ */
[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; }

/* stranded-wrapper autofix (drain 2026-07-03): every fixed max-width column centers — gate content_uncentered_left_stranded */
[data-design="a"] .mm-hero__plate { margin-inline: auto; }
[data-design="a"] .mm-hero__essence { margin-inline: auto; }
[data-design="a"] .mm-funnel__sub { margin-inline: auto; }
[data-design="a"] .mm-funnel__range-note { margin-inline: auto; }
[data-design="a"] .mm-funnel__below { margin-inline: auto; }
[data-design="a"] .mm-about__text { margin-inline: 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; }