/* ── MOBILE VERTICAL SNAP SCROLL ─────────────────────────────────── */
/* Pure CSS snap + lightweight JS for animations                      */
/* Desktop: completely hidden. Mobile (≤768px): replaces all content  */

.mv-wrap, .mv-dots { display:none; }

@media(max-width:768px),(max-width:1024px) and (max-height:500px){

  /* Hide all desktop content */
  #mc-desktop-content, footer, .disclaimer, .sticky-cta, .scroll-cue,
  .mc-carousel, .m-slide-wrap, .m-slide-nav { display:none !important; }

  /* ── SNAP CONTAINER ── */
  .mv-wrap {
    display:block;
    position:fixed;
    top:62px; left:0; right:0; bottom:0;
    overflow-y:auto;
    overflow-x:hidden;
    scroll-snap-type:y mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    z-index:50;
    background:var(--bg);
  }
  .mv-wrap::-webkit-scrollbar { display:none; }

  /* ── EACH SECTION ── */
  .mv-sec {
    scroll-snap-align:start;
    min-height:calc(100dvh - 62px - 36px);
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:24px 20px;
    box-sizing:border-box;
    position:relative;
  }
  /* FAQ needs internal scroll — use proximity snap */
  .mv-sec--faq {
    scroll-snap-align:start;
    min-height:auto;
    padding-bottom:40px;
  }

  /* ── DOT NAV (bottom bar) ── */
  .mv-dots {
    display:flex;
    position:fixed;
    bottom:0; left:0; right:0;
    height:36px;
    align-items:center;
    justify-content:center;
    gap:16px;
    z-index:200;
    background:rgba(10,20,32,.92);
    backdrop-filter:blur(12px);
    border-top:1px solid rgba(255,255,255,.06);
  }
  .mv-dot {
    width:7px; height:7px;
    border-radius:50%;
    background:rgba(255,255,255,.18);
    border:none;
    padding:0;
    cursor:pointer;
    transition:all .3s ease;
    position:relative;
  }
  .mv-dot.active {
    background:var(--cyan);
    box-shadow:0 0 6px rgba(0,212,255,.35);
    width:20px;
    border-radius:4px;
  }

  /* ── TYPOGRAPHY ── */
  .mv-label {
    font-family:var(--mono);
    font-size:9px;
    letter-spacing:.22em;
    color:var(--cyan);
    text-transform:uppercase;
    margin-bottom:12px;
    opacity:0;
  }
  .mv-title {
    font-family:var(--disp);
    font-size:clamp(28px, 8vw, 38px);
    font-weight:800;
    line-height:1.06;
    letter-spacing:-.02em;
    color:var(--text);
    margin:0 0 14px;
    opacity:0;
  }
  .mv-sub {
    font-size:15px;
    color:var(--text2);
    line-height:1.65;
    margin-bottom:24px;
    max-width:420px;
    opacity:0;
  }

  /* ── ANIMATIONS ── */
  @keyframes mv-up {
    from { transform:translateY(30px); opacity:0; }
    to { transform:translateY(0); opacity:1; }
  }
  .mv-sec.in-view .mv-label { animation:mv-up .5s ease .05s both; }
  .mv-sec.in-view .mv-title { animation:mv-up .5s ease .15s both; }
  .mv-sec.in-view .mv-sub   { animation:mv-up .5s ease .25s both; }
  .mv-sec.in-view .mv-anim  { animation:mv-up .5s ease .35s both; }
  .mv-sec.in-view .mv-anim2 { animation:mv-up .5s ease .45s both; }

  /* ── HERO STATS ── */
  .mv-stats {
    display:flex;
    gap:24px;
    margin-bottom:24px;
    opacity:0;
  }
  .mv-sec.in-view .mv-stats { animation:mv-up .5s ease .3s both; }
  .mv-stat-val {
    font-family:var(--disp);
    font-size:26px;
    font-weight:800;
    line-height:1;
  }
  .mv-stat-lbl {
    font-family:var(--mono);
    font-size:8px;
    letter-spacing:.12em;
    color:var(--text3);
    text-transform:uppercase;
    margin-top:4px;
  }

  /* ── CTA ── */
  .mv-ctas {
    display:flex;
    gap:10px;
    opacity:0;
  }
  .mv-sec.in-view .mv-ctas { animation:mv-up .5s ease .4s both; }
  .mv-btn {
    font-family:var(--mono);
    font-size:12px;
    font-weight:700;
    letter-spacing:.06em;
    padding:13px 26px;
    border-radius:8px;
    text-decoration:none;
    border:none;
    cursor:pointer;
    transition:all .15s;
  }
  .mv-btn--pri { background:var(--cyan); color:#0a1420; }
  .mv-btn--pri:active { transform:scale(.97); }
  .mv-btn--gho { background:transparent; border:1px solid var(--border); color:var(--text2); }

  /* ── PIPELINE STEPS ── */
  .mv-steps { display:flex; flex-direction:column; gap:0; opacity:0; }
  .mv-sec.in-view .mv-steps { animation:mv-up .5s ease .3s both; }
  .mv-step {
    display:grid;
    grid-template-columns:32px 1fr;
    gap:10px 12px;
    padding:12px 0;
    border-bottom:1px solid rgba(255,255,255,.05);
  }
  .mv-step:last-child { border-bottom:none; }
  .mv-step-n {
    font-family:var(--mono);
    font-size:20px;
    font-weight:800;
    color:rgba(0,212,255,.25);
    line-height:1;
    grid-row:span 2;
    display:flex;
    align-items:center;
  }
  .mv-step-t { font-size:14px; font-weight:700; color:var(--text); }
  .mv-step-d { font-size:12px; color:var(--text3); line-height:1.4; grid-column:2; }

  .mv-link {
    font-family:var(--mono);
    font-size:11px;
    color:var(--cyan);
    text-decoration:none;
    letter-spacing:.06em;
    margin-top:12px;
    display:inline-block;
    opacity:0;
  }
  .mv-sec.in-view .mv-link { animation:mv-up .5s ease .45s both; }

  /* ── AGENTS ── */
  .mv-agents { display:flex; flex-direction:column; gap:10px; opacity:0; }
  .mv-sec.in-view .mv-agents { animation:mv-up .5s ease .3s both; }
  .mv-agent {
    display:flex;
    align-items:center;
    gap:14px;
    padding:12px 16px;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:12px;
  }
  .mv-agent-ic {
    width:40px; height:40px;
    border-radius:10px;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--mono);
    font-size:15px;
    font-weight:800;
    flex-shrink:0;
  }
  .mv-agent-nm { font-size:14px; font-weight:700; color:var(--text); }
  .mv-agent-sub { font-size:11px; color:var(--text3); margin-top:2px; }

  /* Consensus bar */
  .mv-bar-wrap {
    margin-top:16px;
    opacity:0;
  }
  .mv-sec.in-view .mv-bar-wrap { animation:mv-up .5s ease .45s both; }
  .mv-bar {
    height:32px;
    background:rgba(255,255,255,.04);
    border-radius:8px;
    overflow:hidden;
    position:relative;
  }
  .mv-bar-fill {
    height:100%;
    width:0%;
    background:linear-gradient(90deg, var(--cyan), #00e676);
    border-radius:8px;
    transition:width 1.2s cubic-bezier(.25,.46,.45,.94);
  }
  .mv-sec.in-view .mv-bar-fill { width:71%; }
  .mv-bar-lbl {
    position:absolute;
    left:12px; top:50%;
    transform:translateY(-50%);
    font-family:var(--mono);
    font-size:11px;
    font-weight:700;
    color:#fff;
    letter-spacing:.04em;
  }

  /* ── COMPARE ── */
  .mv-cmp { opacity:0; }
  .mv-sec.in-view .mv-cmp { animation:mv-up .5s ease .3s both; }
  .mv-cmp-row {
    display:grid;
    grid-template-columns:1fr 64px 64px;
    gap:6px;
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.05);
    font-size:13px;
    color:var(--text2);
    align-items:center;
  }
  .mv-cmp-row:last-child { border-bottom:none; }
  .mv-cmp-hd {
    font-family:var(--mono);
    font-size:8px;
    letter-spacing:.1em;
    color:var(--text3);
    text-transform:uppercase;
    border-bottom:1px solid var(--border);
    padding-bottom:8px;
  }
  .mv-cmp-hd span:nth-child(2),
  .mv-cmp-hd span:nth-child(3) { font-size:9px; letter-spacing:.08em; }
  .mv-cmp-row span:nth-child(2),
  .mv-cmp-row span:nth-child(3) { text-align:center; font-size:16px; }
  .mv-g { color:var(--green); }
  .mv-r { color:var(--red); }
  .mv-a { color:var(--amber); }

  /* ── PRICING ── */
  .mv-plans { display:flex; flex-direction:column; gap:12px; opacity:0; }
  .mv-sec.in-view .mv-plans { animation:mv-up .5s ease .3s both; }
  .mv-plan {
    padding:18px;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.07);
    border-radius:12px;
    position:relative;
  }
  .mv-plan--pop {
    border-color:rgba(0,212,255,.3);
    background:rgba(0,212,255,.04);
  }
  .mv-plan-badge {
    position:absolute;
    top:-9px; right:14px;
    font-family:var(--mono);
    font-size:8px;
    letter-spacing:.12em;
    padding:3px 10px;
    border-radius:4px;
    background:var(--cyan);
    color:#0a1420;
    font-weight:700;
  }
  .mv-plan-nm { font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:var(--text3); text-transform:uppercase; margin-bottom:4px; }
  .mv-plan-pr { font-family:var(--disp); font-size:36px; font-weight:800; color:var(--text); line-height:1; margin-bottom:6px; }
  .mv-plan-pr span { font-size:14px; color:var(--text3); font-weight:400; }
  .mv-plan-desc { font-size:13px; color:var(--text2); line-height:1.5; }

  /* ── FAQ ── */
  .mv-faq { display:flex; flex-direction:column; gap:6px; opacity:0; }
  .mv-sec.in-view .mv-faq { animation:mv-up .5s ease .3s both; }
  .mv-faq-q {
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    overflow:hidden;
  }
  .mv-faq-q summary {
    padding:14px 16px;
    font-size:14px;
    font-weight:600;
    color:var(--text);
    cursor:pointer;
    list-style:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
  }
  .mv-faq-q summary::after {
    content:'+';
    font-family:var(--mono);
    font-size:18px;
    color:var(--text3);
    transition:transform .25s;
    flex-shrink:0;
    margin-left:12px;
  }
  .mv-faq-q[open] summary::after { transform:rotate(45deg); color:var(--cyan); }
  .mv-faq-q p {
    padding:0 16px 14px;
    font-size:13px;
    color:var(--text2);
    line-height:1.65;
    margin:0;
  }

  /* ── MINI CTA at bottom of sections ── */
  .mv-mini-cta {
    margin-top:auto;
    padding-top:16px;
    opacity:0;
  }
  .mv-sec.in-view .mv-mini-cta { animation:mv-up .5s ease .5s both; }

  /* ── SCROLL HINT on hero ── */
  .mv-scroll-hint {
    position:absolute;
    bottom:16px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    opacity:0;
    animation:mv-up .5s ease 1s both;
  }
  .mv-scroll-hint span {
    font-family:var(--mono);
    font-size:8px;
    letter-spacing:.2em;
    color:var(--text3);
    text-transform:uppercase;
  }
  .mv-scroll-arrow {
    width:16px; height:16px;
    border-right:2px solid var(--text3);
    border-bottom:2px solid var(--text3);
    transform:rotate(45deg);
    animation:mv-bob 1.5s ease-in-out infinite;
  }
  @keyframes mv-bob {
    0%,100% { transform:rotate(45deg) translateY(0); }
    50% { transform:rotate(45deg) translateY(4px); }
  }

  /* ── Color helpers ── */
  .c-green { color:var(--green); }
  .c-cyan { color:var(--cyan); }
  .c-amber { color:var(--amber); }
}

/* ── LANDSCAPE ── */
@media(max-width:1024px) and (max-height:500px){
  .mv-wrap { top:50px; }
  .mv-sec { min-height:calc(100dvh - 50px - 36px); padding:14px 20px; }
  .mv-title { font-size:24px !important; margin-bottom:8px; }
  .mv-sub { font-size:13px; margin-bottom:14px; }
  .mv-stat-val { font-size:22px; }
  .mv-stats { gap:16px; margin-bottom:14px; }
  .mv-btn { padding:10px 20px; font-size:11px; }
  .mv-step { padding:6px 0; }
  .mv-agent { padding:8px 12px; }
  .mv-agent-ic { width:32px; height:32px; font-size:13px; }
  .mv-plan { padding:12px; }
  .mv-plan-pr { font-size:28px; }
  .mv-dots { height:28px; gap:12px; }
  .mv-dot { width:6px; height:6px; }
  .mv-dot.active { width:16px; }
  .mv-scroll-hint { display:none; }
}
