/*
 * Crevyro homepage scroll motion
 * Progressive, reversible scroll choreography with natural document scrolling.
 * The page remains fully usable when JavaScript is unavailable or motion is reduced.
 */

:root{
  --mcv2-motion-ease:cubic-bezier(.16,1,.3,1);
  --mcv2-motion-gutter:clamp(22px,7vw,110px);
}

#landing-view.acx-homepage{
  --mcv2-hero-image-y:0px;
  --mcv2-hero-image-scale:1.04;
  --mcv2-hero-copy-y:0px;
  --mcv2-hero-copy-opacity:1;
  --mcv2-hero-chat-y:0px;
  --mcv2-hero-chat-scale:1;
  --mcv2-hero-chat-opacity:1;
  --mcv2-hero-meta-y:0px;
  --mcv2-hero-orb-y:0px;
  --mcv2-platform-x:0px;
  --mcv2-platform-progress:0;
  overflow:clip;
}

/* Replace the earlier generic reveal once the richer motion layer is ready. */
.mcv2-motion-ready .mcv2-reveal{
  opacity:1!important;
  transform:none;
  transition:none!important;
}

.mcv2-scroll-reveal{
  --mcv2-reveal-x:0px;
  --mcv2-reveal-y:54px;
  --mcv2-reveal-scale:.975;
  --mcv2-reveal-rotate:0deg;
  --mcv2-reveal-delay:0ms;
}
.mcv2-motion-ready .mcv2-scroll-reveal{
  opacity:0;
  transform:translate3d(var(--mcv2-reveal-x),var(--mcv2-reveal-y),0)
    scale(var(--mcv2-reveal-scale)) rotate(var(--mcv2-reveal-rotate));
  transition:
    opacity .82s var(--mcv2-motion-ease) var(--mcv2-reveal-delay),
    transform .95s var(--mcv2-motion-ease) var(--mcv2-reveal-delay);
  will-change:opacity,transform;
}
.mcv2-motion-ready .mcv2-scroll-reveal.is-inview{
  opacity:1;
  transform:translate3d(0,0,0) scale(1) rotate(0);
}
.mcv2-scroll-reveal.from-left{--mcv2-reveal-x:-72px;--mcv2-reveal-y:18px;--mcv2-reveal-rotate:-1.5deg}
.mcv2-scroll-reveal.from-right{--mcv2-reveal-x:72px;--mcv2-reveal-y:18px;--mcv2-reveal-rotate:1.5deg}
.mcv2-scroll-reveal.scale-in{--mcv2-reveal-y:28px;--mcv2-reveal-scale:.9}

/* Hero entrance plus scroll-scrubbed parallax. */
.mcv2-motion-ready .mcv2-hero.is-live .mcv2-hero-image{animation:none!important}
.mcv2-motion-ready .mcv2-hero-image{
  transform:translate3d(0,var(--mcv2-hero-image-y),0) scale(var(--mcv2-hero-image-scale))!important;
  transform-origin:center center;
  transition:none!important;
  will-change:transform;
}
.mcv2-motion-ready .mcv2-hero-copy{
  opacity:var(--mcv2-hero-copy-opacity);
  transform:translate3d(0,var(--mcv2-hero-copy-y),0);
  will-change:transform,opacity;
}
.mcv2-motion-ready .mcv2-hero-chat{
  opacity:var(--mcv2-hero-chat-opacity);
  transform:translate3d(0,var(--mcv2-hero-chat-y),0) scale(var(--mcv2-hero-chat-scale));
  transform-origin:center bottom;
  will-change:transform,opacity;
}
.mcv2-motion-ready .mcv2-hero-meta{
  transform:translate3d(-50%,var(--mcv2-hero-meta-y),0);
  will-change:transform;
}
.mcv2-motion-ready .mcv2-hero-copy>.mcv2-mini,
.mcv2-motion-ready .mcv2-hero-copy>h1,
.mcv2-motion-ready .mcv2-hero-copy>.mcv2-lead,
.mcv2-motion-ready .mcv2-hero-copy>.mcv2-hero-cta{
  opacity:0;
  transform:translate3d(0,42px,0);
  transition:opacity .85s var(--mcv2-motion-ease),transform 1s var(--mcv2-motion-ease);
}
.mcv2-motion-ready .mcv2-hero-copy>h1{transform:translate3d(0,66px,0);transition-delay:70ms}
.mcv2-motion-ready .mcv2-hero-copy>.mcv2-lead{transition-delay:150ms}
.mcv2-motion-ready .mcv2-hero-copy>.mcv2-hero-cta{transition-delay:230ms}
.mcv2-motion-ready.mcv2-hero-loaded .mcv2-hero-copy>.mcv2-mini,
.mcv2-motion-ready.mcv2-hero-loaded .mcv2-hero-copy>h1,
.mcv2-motion-ready.mcv2-hero-loaded .mcv2-hero-copy>.mcv2-lead,
.mcv2-motion-ready.mcv2-hero-loaded .mcv2-hero-copy>.mcv2-hero-cta{
  opacity:1;
  transform:none;
}
.mcv2-motion-ready .mcv2-hero::after{
  content:"";
  position:absolute;
  z-index:1;
  right:-12vw;
  bottom:-34vw;
  width:64vw;
  height:64vw;
  border-radius:50%;
  background:radial-gradient(circle,rgba(122,52,232,.25),transparent 68%);
  transform:translate3d(0,var(--mcv2-hero-orb-y),0);
  pointer-events:none;
}

/* Sticky narrative chapters. The copy stays anchored while the demos scrub past it. */
.mcv2-motion-ready .mcv2-yellow{
  --mcv2-story-stage-y:0px;
  --mcv2-story-stage-rotate:0deg;
  --mcv2-story-grid-y:0px;
  isolation:isolate;
  overflow:clip!important;
}
.mcv2-motion-ready .mcv2-yellow::before{
  inset:-48px 0;
  transform:translate3d(0,var(--mcv2-story-grid-y),0);
  will-change:transform;
}
.mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{
  transform:translate3d(0,var(--mcv2-story-stage-y),0) rotate(var(--mcv2-story-stage-rotate));
  transform-origin:center center;
  will-change:transform;
}
.mcv2-motion-ready .mcv2-yellow-copy h2{transform-origin:left center}

/* Image parallax plus a true vertical-to-horizontal scroll story. */
.mcv2-motion-ready .mcv2-audience{padding-bottom:0!important;overflow:visible}
.mcv2-motion-ready .mcv2-audience-image-wrap.is-live img{animation:none!important}
.mcv2-motion-ready .mcv2-audience-image-wrap img{
  transform:translate3d(0,var(--mcv2-audience-image-y,0px),0) scale(var(--mcv2-audience-image-scale,1.08))!important;
  will-change:transform;
}
.mcv2-motion-ready .mcv2-audience .mcv2-audience-image-wrap h2{
  transform:translate3d(0,var(--mcv2-audience-title-y,0px),0);
  will-change:transform;
}
.mcv2-platform-scroll{position:relative;background:var(--mcv2-yellow)}
.mcv2-platform-sticky{position:relative}
.mcv2-platform-viewport{width:100%}
.mcv2-platform-progress{display:none}

/* Blue workspace section: opposing, reversible parallax. */
.mcv2-motion-ready .mcv2-blue{position:relative;isolation:isolate;overflow:hidden}
.mcv2-motion-ready .mcv2-blue::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:58vw;
  aspect-ratio:1;
  right:-16vw;
  top:-22vw;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.2),transparent 67%);
  transform:translate3d(var(--mcv2-blue-glow-x,0px),var(--mcv2-blue-glow-y,0px),0);
  will-change:transform;
}
.mcv2-motion-ready .mcv2-blue-copy{
  transform:translate3d(var(--mcv2-blue-copy-x,0px),var(--mcv2-blue-copy-y,0px),0);
  will-change:transform;
}
.mcv2-motion-ready .mcv2-blue .mcv2-blue-device{
  transform:translate3d(var(--mcv2-blue-device-x,0px),var(--mcv2-blue-device-y,0px),0)
    rotate(var(--mcv2-blue-device-rotate,0deg));
  transform-origin:center center;
  will-change:transform;
}

/* Before/after scrollytelling stack. */
.mcv2-motion-ready .mcv2-before-after{position:relative;overflow:clip}
.mcv2-comparison-stack{position:relative}
.mcv2-motion-ready .mcv2-before-card,
.mcv2-motion-ready .mcv2-after-card{
  box-shadow:0 32px 90px rgba(16,24,40,.14);
  transform-origin:center top;
  will-change:transform,opacity;
}

/* FAQ becomes a sticky editorial split with staggered questions. */
.mcv2-motion-ready .mcv2-faq{position:relative}
.mcv2-motion-ready .mcv2-faq-list details[open] p{animation:mcv2FaqAnswerIn .42s var(--mcv2-motion-ease) both}
@keyframes mcv2FaqAnswerIn{
  from{opacity:0;transform:translate3d(0,-10px,0)}
  to{opacity:1;transform:none}
}

/* Footer links and CTA finish the story rather than appearing as a static block. */
.mcv2-motion-ready .mcv2-footer-play{transition:transform .45s var(--mcv2-motion-ease),background .25s ease}
.mcv2-motion-ready .mcv2-footer-play:hover{transform:rotate(-35deg) scale(1.08)}

@media(min-width:981px) and (min-height:720px){
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{
    min-height:145vh!important;
    align-items:start!important;
  }
  .mcv2-motion-ready .mcv2-conversations .mcv2-quote{grid-column:1/-1;grid-row:1}
  .mcv2-motion-ready .mcv2-conversations .mcv2-phone-stage{grid-column:1;grid-row:2}
  .mcv2-motion-ready .mcv2-conversations .mcv2-yellow-copy{grid-column:2;grid-row:2}
  .mcv2-motion-ready .mcv2-expand .mcv2-phone-stage{grid-column:1;grid-row:1}
  .mcv2-motion-ready .mcv2-expand .mcv2-yellow-copy{grid-column:2;grid-row:1}
  .mcv2-motion-ready .mcv2-yellow-copy{
    position:sticky;
    top:24vh;
    align-self:start;
  }
  .mcv2-motion-ready .mcv2-phone-stage{
    position:sticky;
    top:100px;
    align-self:start;
    margin-top:8vh;
  }

  .mcv2-motion-ready .mcv2-platform-scroll{height:265vh}
  .mcv2-motion-ready .mcv2-platform-sticky{
    position:sticky;
    top:0;
    height:100svh;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:112px 0 92px;
    border-top:1px solid rgba(0,0,0,.1);
    border-bottom:1px solid rgba(0,0,0,.1);
  }
  .mcv2-motion-ready .mcv2-platform-viewport{overflow:visible}
  .mcv2-motion-ready .mcv2-platform-list{
    display:flex!important;
    grid-template-columns:none!important;
    width:max-content!important;
    max-width:none!important;
    margin:0!important;
    padding-inline:var(--mcv2-motion-gutter);
    gap:22px!important;
    transform:translate3d(var(--mcv2-platform-x),0,0)!important;
    will-change:transform;
  }
  .mcv2-motion-ready .mcv2-platform-list a{
    flex:0 0 clamp(360px,36vw,500px);
    width:clamp(360px,36vw,500px);
    min-height:350px;
    padding:36px!important;
    align-content:start;
    border-radius:30px!important;
    box-shadow:0 28px 65px rgba(0,0,0,.13)!important;
  }
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(2){background:#090909;color:#fff}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(2) p{color:rgba(255,255,255,.66)}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(3){background:linear-gradient(145deg,#5f49eb,#873bf0);color:#fff}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(3) p{color:rgba(255,255,255,.75)}
  .mcv2-motion-ready .mcv2-platform-list a:hover{transform:translateY(-10px) scale(1.01)!important}
  .mcv2-motion-ready .mcv2-platform-progress{
    position:absolute;
    left:50%;
    bottom:42px;
    display:block;
    width:min(280px,30vw);
    height:4px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(0,0,0,.16);
    transform:translateX(-50%);
  }
  .mcv2-motion-ready .mcv2-platform-progress span{
    display:block;
    width:100%;
    height:100%;
    border-radius:inherit;
    background:#050505;
    transform:scaleX(var(--mcv2-platform-progress));
    transform-origin:left center;
    will-change:transform;
  }

  .mcv2-motion-ready .mcv2-before-title{
    position:relative;
    z-index:4;
    min-height:38vh;
  }
  .mcv2-motion-ready .mcv2-comparison-stack{
    min-height:230vh;
    padding-bottom:34vh;
  }
  .mcv2-motion-ready .mcv2-before-card,
  .mcv2-motion-ready .mcv2-after-card{
    position:sticky;
    top:clamp(22px,5vh,50px);
  }
  .mcv2-motion-ready .mcv2-before-card{
    z-index:2;
    opacity:var(--mcv2-before-opacity,1);
    transform:translate3d(0,var(--mcv2-before-y,0px),0)
      scale(var(--mcv2-before-scale,1)) rotate(var(--mcv2-before-rotate,0deg))!important;
  }
  .mcv2-motion-ready .mcv2-after-card{
    z-index:3;
    margin-top:68vh!important;
    opacity:var(--mcv2-after-opacity,1);
    transform:translate3d(0,var(--mcv2-after-y,0px),0)
      scale(var(--mcv2-after-scale,.94)) rotate(var(--mcv2-after-rotate,0deg))!important;
  }

  .mcv2-motion-ready .mcv2-faq{
    display:grid;
    grid-template-columns:minmax(420px,44%) minmax(0,1fr);
    align-items:start;
    gap:clamp(42px,5vw,78px);
    min-height:105vh;
  }
  .mcv2-motion-ready .mcv2-faq-title h2{
    max-width:100%;
    font-size:clamp(4.4rem,6.5vw,6.6rem)!important;
    line-height:.86!important;
  }
  .mcv2-motion-ready .mcv2-faq-title{position:sticky;top:150px}
  .mcv2-motion-ready .mcv2-faq-list{margin-top:18px}
}

@media(max-width:980px), (max-height:719px){
  .mcv2-motion-ready .mcv2-yellow-copy{position:relative;top:auto}
  .mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{transform:none!important}
  .mcv2-motion-ready .mcv2-platform-scroll{height:auto;padding:48px 0 64px}
  .mcv2-motion-ready .mcv2-platform-sticky{position:relative;height:auto;overflow:visible;padding:0}
  .mcv2-motion-ready .mcv2-platform-viewport{
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .mcv2-motion-ready .mcv2-platform-viewport::-webkit-scrollbar{display:none}
  .mcv2-motion-ready .mcv2-platform-list{
    display:flex!important;
    grid-template-columns:none!important;
    width:max-content!important;
    max-width:none!important;
    margin:0!important;
    padding:0 18px;
    gap:14px!important;
    transform:none!important;
  }
  .mcv2-motion-ready .mcv2-platform-list a{
    flex:0 0 min(82vw,390px);
    width:min(82vw,390px);
    min-height:235px;
    border-radius:24px!important;
    scroll-snap-align:center;
  }
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(2){background:#090909;color:#fff}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(2) p{color:rgba(255,255,255,.66)}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(3){background:linear-gradient(145deg,#5f49eb,#873bf0);color:#fff}
  .mcv2-motion-ready .mcv2-platform-list a:nth-child(3) p{color:rgba(255,255,255,.75)}
  .mcv2-motion-ready .mcv2-comparison-stack{min-height:auto;padding:0}
  .mcv2-motion-ready .mcv2-before-card,
  .mcv2-motion-ready .mcv2-after-card{position:relative;top:auto;transform:none!important;opacity:1!important}
  .mcv2-motion-ready .mcv2-after-card{margin-top:28px!important}
  .mcv2-motion-ready .mcv2-faq{display:block;min-height:0}
  .mcv2-motion-ready .mcv2-faq-title{position:relative;top:auto}
}

@media(max-width:560px){
  .mcv2-motion-ready .mcv2-scroll-reveal{
    --mcv2-reveal-x:0px;
    --mcv2-reveal-y:36px;
    --mcv2-reveal-scale:.98;
    --mcv2-reveal-rotate:0deg;
  }
  .mcv2-motion-ready .mcv2-hero-copy{transform:translate3d(0,var(--mcv2-hero-copy-y),0)}
  .mcv2-motion-ready .mcv2-platform-list a{flex-basis:84vw;width:84vw;padding:25px!important}
}

@media(prefers-reduced-motion:reduce){
  #landing-view.acx-homepage{overflow:hidden}
  .mcv2-motion-ready .mcv2-scroll-reveal,
  .mcv2-motion-ready .mcv2-hero-copy>.mcv2-mini,
  .mcv2-motion-ready .mcv2-hero-copy>h1,
  .mcv2-motion-ready .mcv2-hero-copy>.mcv2-lead,
  .mcv2-motion-ready .mcv2-hero-copy>.mcv2-hero-cta{
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    transition:none!important;
  }
  .mcv2-motion-ready .mcv2-hero-image,
  .mcv2-motion-ready .mcv2-hero-copy,
  .mcv2-motion-ready .mcv2-hero-chat,
  .mcv2-motion-ready .mcv2-hero-meta,
  .mcv2-motion-ready .mcv2-audience-image-wrap img,
  .mcv2-motion-ready .mcv2-audience-image-wrap h2,
  .mcv2-motion-ready .mcv2-blue-copy,
  .mcv2-motion-ready .mcv2-blue-device{transform:none!important;opacity:1!important}
  .mcv2-motion-ready .mcv2-hero-meta{transform:translateX(-50%)!important}
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{min-height:auto!important}
  .mcv2-motion-ready .mcv2-yellow-copy{position:relative!important;top:auto!important}
  .mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{transform:none!important}
  .mcv2-motion-ready .mcv2-platform-scroll{height:auto!important;padding:48px 0 64px}
  .mcv2-motion-ready .mcv2-platform-sticky{position:relative!important;height:auto!important;padding:0!important}
  .mcv2-motion-ready .mcv2-platform-viewport{overflow-x:auto}
  .mcv2-motion-ready .mcv2-platform-list{transform:none!important}
  .mcv2-motion-ready .mcv2-comparison-stack{min-height:auto!important;padding:0!important}
  .mcv2-motion-ready .mcv2-before-card,
  .mcv2-motion-ready .mcv2-after-card{position:relative!important;top:auto!important;transform:none!important;opacity:1!important}
  .mcv2-motion-ready .mcv2-after-card{margin-top:28px!important}
  .mcv2-motion-ready .mcv2-faq{display:block!important;min-height:0!important}
  .mcv2-motion-ready .mcv2-faq-title{position:relative!important;top:auto!important}
  .mcv2-motion-ready .mcv2-faq-list details[open] p{animation:none!important}
}


/* --------------------------------------------------------------------------
   2026-08-07 responsive parity pass
   Keep the same pinned/scrubbed storytelling model on phones and tablets.
   Narrow screens use shorter travel distances and smaller cards, not static
   fallbacks or manually-swiped substitutes.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{
    min-height:145vh!important;
    align-items:start!important;
  }
  .mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{
    position:sticky;
    top:clamp(78px,12vh,112px);
    align-self:start;
    margin-top:clamp(18px,6vh,72px);
    transform:translate3d(0,var(--mcv2-story-stage-y),0) rotate(var(--mcv2-story-stage-rotate))!important;
  }
  .mcv2-motion-ready .mcv2-yellow-copy{
    position:sticky;
    top:clamp(108px,24vh,220px);
    align-self:start;
  }

  .mcv2-motion-ready .mcv2-platform-scroll{height:265vh;padding:0}
  .mcv2-motion-ready .mcv2-platform-sticky{
    position:sticky;
    top:0;
    height:100svh;
    display:flex;
    align-items:center;
    overflow:hidden;
    padding:clamp(76px,11vh,112px) 0 clamp(70px,10vh,92px);
    border-top:1px solid rgba(0,0,0,.1);
    border-bottom:1px solid rgba(0,0,0,.1);
  }
  .mcv2-motion-ready .mcv2-platform-viewport{overflow:hidden!important;touch-action:pan-y}
  .mcv2-motion-ready .mcv2-platform-list{
    display:flex!important;
    grid-template-columns:none!important;
    width:max-content!important;
    max-width:none!important;
    margin:0!important;
    padding-inline:var(--mcv2-motion-gutter)!important;
    gap:clamp(14px,2vw,22px)!important;
    transform:translate3d(var(--mcv2-platform-x),0,0)!important;
    will-change:transform;
  }
  .mcv2-motion-ready .mcv2-platform-list a{
    flex:0 0 clamp(280px,36vw,500px);
    width:clamp(280px,36vw,500px);
    min-height:clamp(255px,34vh,350px);
    padding:clamp(25px,3vw,36px)!important;
    align-content:start;
    border-radius:30px!important;
    scroll-snap-align:none;
    box-shadow:0 28px 65px rgba(0,0,0,.13)!important;
  }
  .mcv2-motion-ready .mcv2-platform-progress{
    position:absolute;
    left:50%;
    bottom:clamp(26px,5vh,42px);
    display:block;
    width:min(280px,44vw);
    height:4px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(0,0,0,.16);
    transform:translateX(-50%);
  }
  .mcv2-motion-ready .mcv2-platform-progress span{
    display:block;width:100%;height:100%;border-radius:inherit;background:#050505;
    transform:scaleX(var(--mcv2-platform-progress));transform-origin:left center;will-change:transform;
  }

  .mcv2-motion-ready .mcv2-comparison-stack{
    min-height:230vh;
    padding-bottom:30vh;
  }
  .mcv2-motion-ready .mcv2-before-card,
  .mcv2-motion-ready .mcv2-after-card{
    position:sticky;
    top:clamp(14px,4vh,50px);
    transform-origin:center top;
  }
  .mcv2-motion-ready .mcv2-before-card{
    z-index:2;
    opacity:var(--mcv2-before-opacity,1)!important;
    transform:translate3d(0,var(--mcv2-before-y,0px),0) scale(var(--mcv2-before-scale,1)) rotate(var(--mcv2-before-rotate,0deg))!important;
  }
  .mcv2-motion-ready .mcv2-after-card{
    z-index:3;
    margin-top:68vh!important;
    opacity:var(--mcv2-after-opacity,1)!important;
    transform:translate3d(0,var(--mcv2-after-y,0px),0) scale(var(--mcv2-after-scale,.94)) rotate(var(--mcv2-after-rotate,0deg))!important;
  }
}

@media (max-width:980px) and (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{
    min-height:158vh!important;
    gap:clamp(34px,7vh,64px)!important;
  }
  .mcv2-motion-ready .mcv2-yellow-copy{
    position:relative!important;
    top:auto!important;
    margin-top:clamp(8vh,12vh,16vh);
  }
  .mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{
    top:clamp(82px,13vh,118px);
    margin-top:0;
  }
  .mcv2-motion-ready .mcv2-platform-scroll{height:235vh!important;padding:0!important}
  .mcv2-motion-ready .mcv2-platform-sticky{height:100svh!important;padding:86px 0 72px!important;overflow:hidden!important}
  .mcv2-motion-ready .mcv2-platform-list{padding-inline:18px!important;gap:14px!important}
  .mcv2-motion-ready .mcv2-platform-list a{
    flex-basis:min(82vw,390px)!important;
    width:min(82vw,390px)!important;
    min-height:min(42vh,310px)!important;
    border-radius:24px!important;
  }
  .mcv2-motion-ready .mcv2-platform-progress{width:min(230px,52vw)}

  .mcv2-motion-ready .mcv2-comparison-stack{min-height:220vh!important;padding-bottom:26vh!important}
  .mcv2-motion-ready .mcv2-before-card,
  .mcv2-motion-ready .mcv2-after-card{position:sticky!important;top:clamp(12px,2.5vh,24px)!important}
  .mcv2-motion-ready .mcv2-after-card{margin-top:64vh!important}

  .mcv2-motion-ready .mcv2-faq{display:block;min-height:115vh}
  .mcv2-motion-ready .mcv2-faq-title{
    position:sticky;
    top:72px;
    z-index:3;
    padding:8px 0 22px;
    background:#050505;
  }
}

@media (max-width:560px) and (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-scroll-reveal.from-left{--mcv2-reveal-x:-30px;--mcv2-reveal-y:24px;--mcv2-reveal-rotate:-1deg}
  .mcv2-motion-ready .mcv2-scroll-reveal.from-right{--mcv2-reveal-x:30px;--mcv2-reveal-y:24px;--mcv2-reveal-rotate:1deg}
  .mcv2-motion-ready .mcv2-scroll-reveal.scale-in{--mcv2-reveal-y:24px;--mcv2-reveal-scale:.94}
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{min-height:150vh!important}
  .mcv2-motion-ready .mcv2-platform-scroll{height:225vh!important}
  .mcv2-motion-ready .mcv2-platform-sticky{padding:78px 0 64px!important}
  .mcv2-motion-ready .mcv2-platform-list a{flex-basis:84vw!important;width:84vw!important;padding:25px!important}
  .mcv2-motion-ready .mcv2-comparison-stack{min-height:210vh!important;padding-bottom:22vh!important}
  .mcv2-motion-ready .mcv2-after-card{margin-top:58vh!important}
}

@media (max-height:719px) and (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-platform-scroll{height:230vh}
  .mcv2-motion-ready .mcv2-platform-sticky{padding-top:72px;padding-bottom:54px}
  .mcv2-motion-ready .mcv2-platform-list a{min-height:min(46vh,280px)}
  .mcv2-motion-ready .mcv2-comparison-stack{min-height:220vh}
}

/* --------------------------------------------------------------------------
   2026-08-07 targeted mobile correction — yellow demo chapters
   The desktop two-column sticky composition cannot be copied literally into a
   one-column phone layout: pinning the phone makes the following copy scroll
   through it. On narrow screens keep the same reveal/parallax language, but let
   each phone and its copy occupy their own document space in sequence.
   -------------------------------------------------------------------------- */
@media (max-width:980px) and (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{
    min-height:auto!important;
    align-items:start!important;
    gap:clamp(38px,7vh,58px)!important;
    overflow:clip!important;
  }

  .mcv2-motion-ready .mcv2-yellow .mcv2-phone-stage{
    position:relative!important;
    top:auto!important;
    align-self:auto!important;
    margin-top:0!important;
    z-index:1;
    transform:translate3d(0,var(--mcv2-story-stage-y),0)
      rotate(var(--mcv2-story-stage-rotate))!important;
  }

  .mcv2-motion-ready .mcv2-yellow-copy{
    position:relative!important;
    top:auto!important;
    align-self:auto!important;
    margin-top:0!important;
    z-index:2;
  }
}

@media (max-width:560px) and (prefers-reduced-motion:no-preference){
  .mcv2-motion-ready .mcv2-conversations,
  .mcv2-motion-ready .mcv2-expand{
    min-height:auto!important;
    gap:40px!important;
  }
}