/* ============================================================
   MANAGED MARKETING — page styles (staging)
   Page-specific only: the Momentum hero reveal (mm-, transplanted
   from the motion-system Momentum prototype), playbook rooms
   numeral, approval band, pricing tiers, win-back panel.
   The approval board reuses shared phase2.css (.p2-board et al.)
   unchanged. Blueprint: web-ventures-service-pages/marketing-blueprint/
   ============================================================ */

/* ---------- hero: Momentum stage slot ---------- */
.svc-hero .mm-stage{margin-top:64px}
@media(max-width:640px){.svc-hero .mm-stage{margin-top:44px}}

/* ---------- Momentum scene (transplanted from momentum.html, mm- prefixed) ----------
   Authored in the END STATE: chips lit, check drawn, APPROVED visible;
   packets/glows/trail transient (opacity 0). js/marketing.js dims only
   when it is actually going to play. */
.mm-stage{position:relative;height:380px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.06);
  background:radial-gradient(600px 380px at 78% 0%, rgba(139,124,246,.14), transparent 60%),radial-gradient(500px 340px at 12% 100%, rgba(120,170,255,.08), transparent 60%),radial-gradient(120% 90% at 50% 0%, #0B0E14 0%, #050607 72%);
  box-shadow:0 34px 80px rgba(0,0,0,.55)}
@media(max-width:640px){.mm-stage{height:320px}}
.mm-wires{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.mm-wires .mm-base{fill:none;stroke:rgba(168,200,255,.12);stroke-width:1.25}
.mm-wires .mm-glowpath{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;opacity:0}
.mm-wires .mm-packet{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;opacity:0;filter:drop-shadow(0 0 5px rgba(168,200,255,.75))}
.mm-wires .mm-trail{fill:none;stroke:var(--accent2);stroke-width:2;stroke-linecap:round;opacity:0}
.mm-chip{position:absolute;z-index:2;width:min(196px,58%);min-height:62px;padding:11px 14px 12px;border-radius:14px;background:linear-gradient(160deg, rgba(168,200,255,.08), rgba(13,16,22,.92));border:1px solid rgba(168,200,255,.45);box-shadow:0 24px 50px rgba(0,0,0,.5)}
.mm-chip-1{left:5%;top:12%}
.mm-chip-2{right:5%;top:41%}
.mm-chip-3{left:8%;top:70%;border-color:rgba(126,226,160,.5)}
.mm-chip-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mm-chip-label{font-family:var(--font-m);font-size:10px;letter-spacing:.18em;color:var(--accent2);text-transform:uppercase}
.mm-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px rgba(168,200,255,.9)}
.mm-chip-3 .mm-dot{background:#7ee2a0;box-shadow:0 0 10px rgba(126,226,160,.8)}
.mm-bars{margin-top:10px;display:flex;flex-direction:column;gap:6px;opacity:1}
.mm-bar{display:block;height:5px;border-radius:99px;background:linear-gradient(90deg, rgba(214,228,255,.75), rgba(168,200,255,.28))}
.mm-bar.mm-b1{width:72%}.mm-bar.mm-b2{width:46%}
.mm-chip-2 .mm-bar.mm-b1{width:58%}.mm-chip-2 .mm-bar.mm-b2{width:76%}
.mm-approve-row{display:flex;align-items:center;gap:8px;margin-top:9px;min-height:20px}
.mm-check{width:20px;height:20px;flex:0 0 auto;overflow:visible}
.mm-check path{fill:none;stroke:#7ee2a0;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgba(126,226,160,.55))}
.mm-approved-tag{font-family:var(--font-m);font-size:9px;letter-spacing:.2em;color:#7ee2a0;text-transform:uppercase;opacity:1}
.mm-replay{position:absolute;right:16px;bottom:16px;z-index:5;font-family:var(--font-m);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--text);background:rgba(5,6,7,.55);border:1px solid var(--line2);border-radius:999px;min-height:44px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.mm-replay:hover,.mm-replay:focus-visible{border-color:var(--accent);background:rgba(168,200,255,.07);outline:none}
@media(prefers-reduced-motion:reduce){.mm-replay{display:none}}

/* ---------- Ch 01 · playbook rooms numeral + approval band ---------- */
.mm-intro{font-size:17px;line-height:1.65;color:var(--body);max-width:62ch;margin-bottom:6px}
.mm-num{font-family:var(--font-m);font-size:15px;letter-spacing:.14em;color:var(--accent);padding-top:6px}
.mm-endorse{margin-top:44px;background:linear-gradient(180deg,#10141d,#0a0d13);border:1px solid var(--line2);border-radius:22px;box-shadow:0 34px 90px rgba(0,0,0,.5);padding:30px 32px}
.mm-endorse p{font-size:19px;line-height:1.6;color:var(--body);max-width:68ch}
.mm-endorse p b{color:#fff;font-weight:600}
@media(max-width:640px){.mm-endorse{padding:24px 22px}.mm-endorse p{font-size:17px}}

/* ---------- Ch 03 · pricing tiers ---------- */
.mm-tiers{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
@media(max-width:820px){.mm-tiers{grid-template-columns:1fr}}
.mm-tier{background:linear-gradient(180deg,#10141d,#0a0d13);border:1px solid var(--line2);border-radius:22px;box-shadow:0 34px 90px rgba(0,0,0,.5);padding:38px 36px;position:relative}
.mm-tier.hot{border-color:rgba(168,200,255,.45)}
.mm-flag{position:absolute;top:-13px;left:32px;background:var(--accent);color:#050607;font-family:var(--font-m);font-size:10px;font-weight:500;letter-spacing:.2em;padding:7px 14px;border-radius:999px;text-transform:uppercase}
.mm-tier h3{font-size:24px;margin-bottom:10px}
.mm-price{font-family:var(--font-m);font-size:46px;line-height:1;color:var(--text);margin:16px 0 14px}
.mm-price span{font-size:16px;color:var(--muted)}
.mm-tier>p{font-size:16px;line-height:1.65;color:var(--body)}
.mm-tier ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.mm-tier li{font-size:15.5px;line-height:1.55;color:var(--body);display:flex;gap:10px}
.mm-tier li::before{content:"—";color:var(--accent);flex:none}
.mm-stamp{font-family:var(--font-m);font-size:12.5px;letter-spacing:.04em;color:var(--muted);margin-top:22px}
.mm-tier-cta{margin-top:28px}

/* ---------- Ch 04 · win-back panel ---------- */
.mm-winback{background:linear-gradient(180deg,#10141d,#0a0d13);border:1px solid var(--line2);border-radius:22px;box-shadow:0 34px 90px rgba(0,0,0,.5);padding:clamp(30px,4vw,48px)}
.mm-winback .eyebrow{margin-bottom:16px}
.mm-winback h3{font-size:clamp(26px,3.4vw,38px);line-height:1.05;letter-spacing:-.02em;max-width:24ch;margin-bottom:16px}
.mm-winback p{font-size:16.5px;line-height:1.7;color:var(--body);max-width:64ch}
.mm-winback p+p{margin-top:12px}
.mm-onetime{display:inline-block;margin-top:20px;font-family:var(--font-m);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(168,200,255,.4);border-radius:999px;padding:8px 16px}
.mm-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}