/* Mobile is a distinct reading experience: compact, focused and horizontally explorable. */
@media (max-width:640px){
  :root{--mobile-gap:14px}
  .container{width:min(calc(100% - 28px),var(--container))}
  .section{padding-block:3.5rem}
  .section-kicker{gap:.65rem;font-size:.58rem;letter-spacing:.14em}
  .section-kicker span{width:27px;height:27px}

  /* Hero: one-screen promise, supporting details stay concise. */
  .hero-care{min-height:760px}
  .hero-care-inner{min-height:690px}
  .hero-care-copy{padding:5rem 0 2rem}
  .hero-care h1{font-size:clamp(3.25rem,15vw,3.7rem);margin:1rem 0 1.25rem}
  .hero-care-copy>p{font-size:.94rem;line-height:1.6}
  .button-row{gap:.8rem;margin-top:1.4rem}
  .button-row .button{min-height:48px}
  .play-link i{width:42px;height:42px}
  .care-promises{display:flex;overflow-x:auto;gap:.65rem;margin-top:1.5rem;padding:.9rem 0 .25rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .care-promises::-webkit-scrollbar{display:none}
  .care-promises>div{flex:0 0 72%;padding:.8rem;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(7,24,48,.58);scroll-snap-align:start}

  /* 01: compress the demo into a focused conversation card. */
  .interaction-heading{gap:1rem;margin:1.2rem 0 1.7rem}
  .interaction-heading h2{font-size:3.15rem}
  .interaction-heading>div:last-child>p{margin:.25rem 0 0}
  .human-first{margin-top:1rem}
  .conversation-stage{min-height:0;grid-template-rows:430px auto;border-radius:22px}
  .conversation-context{display:none}
  .conversation-main{grid-row:1;min-height:430px;padding:1.1rem}
  .conversation-orbit{transform:scale(.72)}
  .speech{max-width:88%;padding:1rem}
  .understanding-flow{grid-row:2;position:relative;display:flex;align-items:center;overflow-x:auto;gap:.7rem;height:auto;padding:.85rem;scroll-padding-inline:.85rem;scroll-snap-type:x mandatory;scrollbar-width:none;background:linear-gradient(135deg,#edf5ff,#f8fbff)}
  .understanding-flow::-webkit-scrollbar{display:none}
  .understanding-flow>b{display:none}
  .understanding-flow>div{position:relative;flex:0 0 78%;min-height:104px;padding:1rem;display:grid;grid-template-columns:34px 42px 1fr;align-items:center;gap:.65rem;text-align:left;border:1px solid #d6e5f6;border-radius:15px;background:#fff;box-shadow:0 9px 26px rgba(30,64,110,.07);scroll-snap-align:start}
  .understanding-flow>div:not(:last-child)::after{content:'→';position:absolute;right:-.64rem;top:50%;z-index:2;width:1.25rem;height:1.25rem;display:grid;place-items:center;transform:translateY(-50%);border-radius:50%;background:#2563eb;color:#fff;font-size:.62rem;box-shadow:0 4px 12px rgba(37,99,235,.25)}
  .understanding-flow>div>span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #bfd7f3;border-radius:50%;color:#2563eb;font-size:.55rem;font-weight:850}
  .understanding-flow>div>i{display:grid;place-items:center;width:40px;height:40px;margin:0;border-radius:12px;background:#e5f0ff;color:#2563eb;font-style:normal}
  .understanding-flow p{margin:0;display:grid}
  .understanding-flow strong{font-size:.82rem}
  .understanding-flow small{display:block;color:#72839a;font-size:.67rem;line-height:1.4}

  /* 02: keep the intelligence story, remove diagram whitespace. */
  .ci-header{gap:1rem;margin-bottom:1.5rem}
  .ci-header h2{font-size:3rem;margin:1rem 0}
  .ci-header>div:last-child>p{margin-top:0}
  .ci-system{display:block;border-radius:22px;padding:1rem}
  .ci-core{min-height:330px;margin-bottom:1rem}
  .ci-core-grid{transform:scale(.72)}
  .ci-pulse.pulse-b{display:none}
  .ci-senses,.ci-actions{display:flex;overflow-x:auto;gap:.65rem;padding:0 0 .25rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .ci-senses::-webkit-scrollbar,.ci-actions::-webkit-scrollbar{display:none}
  .ci-column-title{flex:0 0 100%}
  .ci-senses article,.ci-actions article{flex:0 0 82%;min-height:112px;scroll-snap-align:start}
  .ci-footer{grid-template-columns:repeat(3,1fr);gap:.4rem;margin-top:1rem}
  .ci-footer>div{padding:.8rem .35rem;text-align:center}
  .ci-footer>a{grid-column:1/-1;justify-content:center;padding:.9rem}

  /* 03: editorial product becomes one compact object, cards become a carousel. */
  .x1-editorial-reveal{grid-template-columns:1fr;grid-template-rows:auto 470px auto;border-radius:24px}
  .x1-reveal-title{padding:2rem 1.4rem}
  .x1-reveal-title .product-tag{margin-top:1.5rem}
  .x1-reveal-title h2{font-size:3.5rem;margin:.8rem 0 1.2rem}
  .x1-reveal-number,.x1-reveal-meta{display:none}
  .x1-reveal-canvas{grid-column:1;min-height:470px;clip-path:none}
  .reveal-bot{transform:translateY(45px) scale(.83)}
  .reveal-circle.rc-one{width:370px;height:370px}
  .reveal-circle.rc-two{width:280px;height:280px}
  .reveal-note{padding:.6rem .7rem}
  .rn-private{right:2%;top:22%}
  .rn-listen{left:2%;top:12%}
  .rn-ready{left:3%;bottom:6%}
  .x1-reveal-bottom{grid-column:1;display:block;padding:1rem}
  .x1-reveal-bottom>div:first-child{display:none}
  .reveal-price{justify-content:space-between;gap:.75rem}
  .reveal-price .button{min-height:44px;padding:.65rem 1rem}
  .spec-rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .spec-rail::-webkit-scrollbar{display:none}
  .spec-rail>div{flex:0 0 44%;padding:1rem;scroll-snap-align:start}
  .ownership-grid.ownership-cards-v2{display:flex;overflow-x:auto;gap:.75rem;margin-top:1rem;padding-bottom:.35rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .ownership-grid.ownership-cards-v2::-webkit-scrollbar{display:none}
  .ownership-cards-v2 article{flex:0 0 84%;min-height:300px;scroll-snap-align:start}

  /* 04: one strong story + swipeable benefits; dashboard is condensed. */
  .elder-heading{gap:1rem;margin:1.2rem 0 1.8rem}
  .elder-heading h2{font-size:3.15rem}
  .elder-feature{border-radius:22px}
  .elder-photo{min-height:330px}
  .elder-feature-copy{padding:1.5rem}
  .elder-feature-copy h3{font-size:2rem;margin:.7rem 0}
  .care-checks{gap:.55rem;margin-top:1.2rem}
  .care-benefits{display:flex;overflow-x:auto;gap:.75rem;padding-bottom:.35rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .care-benefits::-webkit-scrollbar{display:none}
  .care-benefits article{flex:0 0 84%;min-height:340px;scroll-snap-align:start}
  .family-connection{gap:1.5rem;margin-top:2.5rem;padding:1.5rem;border-radius:22px}
  .family-connection h3{font-size:2.45rem;margin:1rem 0}
  .family-dashboard{padding:.9rem}
  .dash-greeting{padding:1rem 0}
  .dash-events>div{padding:.65rem}

  /* 05: remove decorative logo mileage, keep social proof. */
  .proof-head{display:block}
  .proof-head>p{margin:1rem 0 0}
  .logo-cloud{display:flex;overflow:hidden;gap:1.4rem;margin:1.5rem 0;padding-block:1rem}
  .logo-cloud span{flex:0 0 auto}
  .logo-cloud span:nth-child(n+4){display:none}
  .proof-section blockquote{margin:2.5rem auto 2rem}
  .proof-section blockquote>p{font-size:1.8rem}
  .proof-stats{grid-template-columns:1fr 1fr}
  .proof-stats>div{padding:1rem}

  /* 06: ecosystem cards swipe instead of a four-card vertical wall. */
  .ecosystem-section{padding-block:3.5rem}
  .eco-v2-head{gap:1rem;margin-bottom:1.7rem}
  .eco-v2-head h2{font-size:3.15rem;margin:1rem 0 0}
  .eco-hub{display:flex;overflow-x:auto;gap:.75rem;padding:1rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .eco-hub::-webkit-scrollbar{display:none}
  .eco-node{flex:0 0 84%;min-height:220px;scroll-snap-align:center}
  .eco-v2-foot{padding:1rem;margin-top:.75rem}

  /* 07: CTA remains decisive without two full-screen cards. */
  .cta-choice>.container{padding-block:3.5rem}
  .cta-choice-top{padding-bottom:1rem}
  .cta-choice-main{gap:1.7rem;padding-block:2rem}
  .cta-choice-copy h2{font-size:3.25rem;margin:1rem 0}
  .cta-choice-cards{display:flex;overflow-x:auto;gap:.75rem;padding-bottom:.35rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .cta-choice-cards::-webkit-scrollbar{display:none}
  .choice-card{flex:0 0 86%;min-height:330px;padding:1.35rem;scroll-snap-align:center}
  .choice-icon{width:50px;height:50px;margin:.8rem 0 1.2rem}
  .choice-card h3{font-size:1.45rem}
  .cta-choice-bottom{padding-top:1rem}
}