/* Responsive parity: mobile keeps the same story, imagery and scroll choreography as desktop. */
@media (max-width:780px){
  /* Three-act hero: product stage -> statement -> production film. */
  .hero-cinematic{height:300svh;min-height:2200px;padding:0;overflow:visible;background:#f5f3ee}
  .hero-sticky{position:sticky;top:70px;height:calc(100svh - 70px);min-height:610px;display:block;overflow:hidden}
  .hero-copy-new,.hero-media{position:absolute;inset:0;width:100%;height:100%;min-height:0}
  .hero-eyebrow{left:20px;top:22px;max-width:74vw;font-size:6.5px;line-height:1.45}
  .hero-cinematic h1{left:20px;top:60px;width:calc(100% - 40px);font-size:15.4vw;line-height:.88}
  .hero-cinematic h1 span{display:inline;white-space:normal}
  .hero-cinematic .hero-intro{left:auto;right:20px;top:27vh;width:64vw;max-width:290px;font-size:16px;line-height:1.12;text-align:right}
  .hero-actions{left:auto;right:20px;top:39vh;width:auto;margin:0;justify-content:flex-end}
  .hero-actions a{min-width:152px;flex:none;padding:12px 14px;font-size:7px}
  .hero-media{display:block;pointer-events:none}
  .hero-media>video{display:block;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% center}
  .hero-media-shade{display:block}
  .hero-media .hero-product{left:50%;top:39vh;bottom:auto;width:104vw;max-width:560px;height:58vh;object-position:center bottom;transform:translate3d(calc(-50% + var(--hero-progress,0) * 4vw),calc(var(--hero-progress,0) * -2vh),0) scale(calc(1 + var(--hero-progress,0) * .035))!important}
  .hero-media-label{display:flex;right:20px;bottom:54px;font-size:6px}
  .hero-proof-row{display:grid;grid-template-columns:repeat(2,max-content);left:20px;bottom:50px;width:auto;gap:8px 18px}
  .hero-proof-row strong{font-size:11px}.hero-proof-row span{font-size:6px}
  .hero-bottom-line{left:20px;right:20px;bottom:16px;color:#292b27}.hero-bottom-line>span{display:block;font-size:6px}
  .hero-phase-index{display:grid;right:12px}.hero-phase-index i{height:90px}
  .hero-scroll-copy{display:block;left:20px;right:34px;top:47%}
  .hero-scroll-copy p{font-size:18vw;line-height:.82}.hero-scroll-copy p span{margin-left:6vw;white-space:normal}
  .hero-cinematic[data-phase="2"] h1,.hero-cinematic[data-phase="3"] h1,.hero-cinematic[data-phase="2"] .hero-intro,.hero-cinematic[data-phase="3"] .hero-intro,.hero-cinematic[data-phase="2"] .hero-actions,.hero-cinematic[data-phase="3"] .hero-actions{opacity:0;transform:translateY(-24px);filter:blur(7px);pointer-events:none}
  .hero-cinematic[data-phase="2"] .hero-sticky{background:#d8c8e2!important}
  .hero-cinematic[data-phase="3"] .hero-sticky{background:#2f2534!important;color:#f7f2f8}

  /* The kinetic statement remains scroll-led instead of becoming a static poster. */
  .statement-kinetic{height:250svh;min-height:1850px;padding:0!important;overflow:visible}
  .statement-stage{position:sticky;top:70px;height:calc(100svh - 70px);min-height:610px;padding:112px 20px 76px;overflow:hidden}
  .statement-stage>.kicker{top:70px;left:20px}
  .statement-kinetic h2{font-size:clamp(44px,13.8vw,64px)!important;line-height:.9!important}
  .statement-motion-line{width:auto;max-width:100%;white-space:normal;transition:none}
  .statement-line-a{margin-left:0}.statement-line-b{margin-left:5vw}.statement-line-c{margin-left:0}
  .statement-line-d{margin-top:34px;font-size:9px!important;line-height:1.45!important}
  .statement-line-e{margin:12px 0 0;font-size:.43em}
  .statement-orbit{display:block;right:12px;font-size:6px}
  .statement-progress{left:20px;bottom:55px}.statement-progress i{width:82px}
  .statement-kinetic .statement-foot{left:20px;right:20px;bottom:20px}
  .statement-stage:before{width:128vw}.statement-stage:after{background:radial-gradient(circle at calc(20% + var(--statement-progress)*60%) 52%,rgba(154,123,204,.2),transparent 30%),linear-gradient(115deg,transparent 0 57%,rgba(255,255,255,.48) 57.1% 57.35%,transparent 57.5%)}

  /* Five production principles use the same scroll-linked horizontal rail. */
  .proof-stream{height:390svh;min-height:2900px;padding:0;background:#191919}
  .proof-sticky{position:sticky;top:70px;height:calc(100svh - 70px);display:grid;overflow:hidden}
  .proof-heading{position:absolute;left:20px;top:6vh;width:calc(100% - 48px);padding:0;opacity:calc(1 - var(--proof-progress,0) * 3);transform:translate3d(0,calc(var(--proof-progress,0) * -10vh),0);filter:blur(calc(var(--proof-progress,0) * 7px))}
  .proof-heading h2{font-size:15.5vw;line-height:.88}.proof-heading h2 span{margin-left:5vw}.proof-heading>p:last-child{width:88%;font-size:10px;line-height:1.55;margin-top:18px}
  .proof-progress{display:grid;right:10px}.proof-progress i{height:92px}
  .proof-window{position:absolute;inset:0;overflow:hidden;margin:0}
  .proof-track{position:absolute;left:0;top:0;height:100%;display:flex;transform:translate3d(calc(var(--proof-progress,0) * -407vw),0,0)!important;padding:22vh 7vw 5vh 78vw;gap:10px}
  .proof-track article,.proof-track article:nth-child(even){width:82vw;height:70vh;min-height:520px;margin-top:0;grid-template-rows:54% 1fr}
  .proof-track article:nth-child(even){margin-top:7vh}
  .proof-track article>div{padding:16px 17px 18px}.proof-track h3{font-size:29px}.proof-track p{font-size:10px}

  /* Nothing is hidden solely because the viewport is narrow. */
  .system-row,.category-list .system-row{grid-template-columns:32px minmax(0,1fr) minmax(92px,.65fr) 24px}
  .system-row i,.category-list .system-row i{display:block;font-size:7px;line-height:1.35;text-align:right}
  .motion-reel-meta span:nth-child(2),.capacity-stage-meta span:last-child,.hero-bottom-line>span{display:block}
  .capacity-stage>a{display:flex;right:20px;bottom:3vh;width:210px}
  .capacity-stage-number{margin-bottom:17vh}

  /* Desktop card sequences become a complete vertical editorial sequence on touch screens. */
  .business-paths-grid,.desire-grid,.production-reality-grid,.brand-portal-grid{display:grid;grid-template-columns:1fr;overflow:visible;margin-left:0;margin-right:0;padding:0;gap:12px}
  .business-path,.business-path:nth-child(2),.desire-card,.desire-card:nth-child(n),.production-reality-grid article,.production-reality-grid article:nth-child(2),.brand-portal-grid a,.brand-portal-grid a:nth-child(2),.brand-portal-grid a:nth-child(4){width:100%;height:76svh;min-height:590px;max-height:760px;margin:0;flex:none}
  .business-paths-grid,.desire-grid,.production-reality-grid,.brand-portal-grid{margin-top:7vh}
  .desire-grid{margin-left:0;margin-right:0}.brand-portal-grid{margin-right:0;padding-right:0}
  .studio-viewport{overflow:visible;margin-top:7vh}.studio-track{display:grid;grid-template-columns:1fr;gap:12px;width:auto;padding:0 20px;transform:none!important}
  .studio-track figure,.studio-track figure:nth-child(even){width:100%;height:72svh;min-height:560px;margin:0}
  .editorial-grid{display:grid;grid-template-columns:1fr}.editorial-grid a,.editorial-grid a:nth-child(2),.editorial-grid a:nth-child(3){height:72svh;min-height:560px;margin-top:0}
}

@media(max-width:390px){
  .hero-cinematic h1{font-size:14.8vw}.hero-cinematic .hero-intro{font-size:14px;top:25vh}.hero-actions{top:37vh}
  .hero-media .hero-product{top:38vh;height:57vh}.hero-proof-row{gap:7px 12px}
  .statement-kinetic h2{font-size:12.8vw!important}.proof-track article,.proof-track article:nth-child(even){min-height:500px}
}

@media(prefers-reduced-motion:reduce) and (max-width:780px){
  .hero-cinematic,.statement-kinetic,.proof-stream{height:auto;min-height:100svh}
  .hero-sticky,.statement-stage,.proof-sticky{position:relative;top:auto;height:auto;min-height:100svh}
  .proof-window,.proof-track{position:relative;height:auto}.proof-track{display:grid;grid-template-columns:1fr;padding:8vh 20px;transform:none!important}.proof-track article,.proof-track article:nth-child(even){width:100%;margin:0}
}
