/* Keep phone content readable without waiting for reveal effects or GPU masks. */
@media (max-width:860px) {
 .grain,.film-grain { display:none; }
 .hero h1.hero-title,.hero h1.hero-title .w {
  color:#eee8df;-webkit-text-fill-color:#eee8df;background:none;
  -webkit-background-clip:border-box;background-clip:border-box;
  filter:none;animation:none;opacity:1;transform:none;text-shadow:none;
 }
 .reveal { opacity:1!important;filter:none!important;transform:none!important;transition:none!important; }
 .hero-ui.live-instrument,.spot-simple .spot-zoom .frame { -webkit-mask-image:none;mask-image:none; }
 .hero-film video { display:none; }
 .hero-film { background:#0b0907 url('../media/hero-video/hero-standin-poster.jpg') center/cover no-repeat; }
 .inside-photo img { opacity:.24;filter:none; }
 /* Native swiping keeps every tile still while its photograph loads. */
 .reels { -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - 48px),transparent 100%); }
 .reel { overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin; }
 .reel-track { animation:none;transform:none; }
 .reels .hw { flex:0 0 180px;scroll-snap-align:start; }
 .reels .hw[aria-hidden="true"] { display:none; }
 .reels .hw-art { isolation:auto;aspect-ratio:auto;height:142px; }
 .reels .hw-art::after { display:none; }
 .reels .hw-art img { position:relative;z-index:3;display:block;width:100%;height:116px;max-height:none;object-fit:contain;opacity:1;filter:none; }
 /* Use the phone's full width for the camera, with copy directly underneath. */
 .story-final { --mobile-stage-width:min(calc(100vw + 48px),calc(48svh * 4 / 3));--mobile-stage-height:calc(var(--mobile-stage-width) * .75);--mobile-camera-clearance:calc(var(--mobile-stage-height) * .35); }
 .story-final .story-stage { inset:64px 0 auto;height:var(--mobile-stage-height);justify-content:center; }
 .story-final .cinema-stage { width:var(--mobile-stage-width);max-width:none;flex-shrink:0;overflow:visible;-webkit-mask-image:none;mask-image:none; }
 .story-final .story-copy,.story-final[data-step="3"] .story-copy { top:calc(64px + var(--mobile-stage-height) + var(--mobile-camera-clearance) + 10px);left:28px;right:24px; }
 .story-final .story-scroll-progress { top:calc(64px + var(--mobile-stage-height) + var(--mobile-camera-clearance) + 12px);height:200px; }
 .story-final .story-card > p:not(.num):not(.eyebrow):not(.story-hint) { font-size:13px;line-height:1.5; }
}
@media (max-width:860px) and (max-height:740px) {
 .story-final { --mobile-stage-width:min(calc(100vw + 32px),calc(40svh * 4 / 3)); }
 .story-final .story-stage { top:52px; }
 .story-final .story-copy,.story-final[data-step="3"] .story-copy { top:calc(52px + var(--mobile-stage-height) + var(--mobile-camera-clearance) + 10px); }
 .story-final .story-scroll-progress { top:calc(52px + var(--mobile-stage-height) + var(--mobile-camera-clearance) + 12px);height:180px; }
 .story-final .story-card > p:not(.num):not(.eyebrow):not(.story-hint) { font-size:12px;line-height:1.4; }
}
@media (max-width:860px) {
 .hero-titlebox { position:relative;z-index:4; }
 .reel { scrollbar-width:none; }
 .reel::-webkit-scrollbar { display:none; }
 .reels::after { content:'Swipe to explore the synths →';font:10px var(--mono);color:var(--muted);letter-spacing:.03em; }
}

/* Format markers and a compact heading / film / caption flow on phones. */
.hero-formats { display:none; }
@media (max-width:860px) {
 .hero-formats { display:flex;justify-content:center;align-items:center;gap:20px;margin:12px 0 18px;color:#c7c2b9; }
 .hero-formats span { display:inline-flex;align-items:center;gap:7px;font:11px var(--mono);letter-spacing:.08em; }
 .hero-formats svg { width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round; }
 .showcase { padding:36px 0 38px; }
 .showcase .showcase-wrap { grid-template-columns:minmax(0,1fr);grid-template-areas:"heading" "video" "caption";gap:16px; }
 .showcase-copy { display:contents; }
 .showcase #showcase-title { grid-area:heading;font-size:clamp(24px,6.4vw,30px);line-height:1.12;margin:0; }
 .showcase-caption { grid-area:caption; }
 .showcase .showcase-intro { max-width:42ch;font-size:13px;line-height:1.5;margin:0; }
}

/* Phone typography: compact supporting copy, natural wraps and intact tap targets. */
@media (max-width:860px) {
 body { font-size:13px;line-height:1.5; }
 main .body-lg,.inside .body-lg,.spot-simple .spot-intro,
 .offer-sub,.built-by-copy,.release-history-heading > p,
 .quick-listen-intro,.trial-copy p,.faq-list details p {
  font-size:13px;line-height:1.5;letter-spacing:0;max-width:60ch;
 }
 main .eyebrow { font-size:10px;line-height:1.4;letter-spacing:.15em;margin-bottom:12px;gap:9px; }
 main .eyebrow::before { width:20px; }
 .quick-listen-heading h2,.inside .statement,.story-final .story-card h2,
 .pages-intro h2,.spot-simple .spot-copy h2,.testimonials-head h2,
 .suite .sec-head h2,.buy .sec-head h2,.release-history-heading h2,
 .built-by-heading h2,.faq .sec-head h2 {
  font-size:clamp(22px,5.8vw,26px);line-height:1.14;font-stretch:120%;
  letter-spacing:-.025em;max-width:none;text-wrap:pretty;
 }
 .showcase #showcase-title { font-size:clamp(22px,5.8vw,26px);font-stretch:120%; }
 .inside .statement,.built-by-heading h2 { font-stretch:110%; }
 .suite .sec-head h2 { white-space:normal; }
 .story-final .story-card > p:not(.num):not(.eyebrow):not(.story-hint) { font-size:13px;line-height:1.45; }
 .story-final .story-card h2 { margin-bottom:12px; }
 .inside,.buy { padding:52px 0; }
 .sec-head,.suite .sec-head,.faq .sec-head { margin-bottom:26px; }
 .sec-head-center .body-lg { margin-top:12px; }
 .inside .body-lg { margin-top:16px; }
 .reels { margin-top:28px; }
 .inside .stats { margin-top:36px;padding-top:26px;gap:24px 18px; }
 .stats b { font-size:30px; }
 .stats span { font-size:11px;line-height:1.4;letter-spacing:.015em; }
 .quick-listen { padding:28px 0 36px; }
 .quick-listen-heading { gap:8px; }
 .quick-listen-heading a { font-size:11px; }
 .quick-listen-intro { margin:12px 0 16px; }
 .quick-listen-note,.suite-note { font-size:11px;line-height:1.45; }
 .sound-preview { padding-block:14px 12px; }
 .sound-preview-top strong { font-size:17px; }
 .sound-wave { height:24px;margin-top:9px; }
 .showcase-placeholder p { font-size:13px;line-height:1.4; }
 .showcase-placeholder p span { font-size:11px; }
 .pages-intro { padding-top:44px; }
 .spot-simple .spot-pin,.pages-intro + .spot-simple .spot-pin { padding:30px 0; }
 .spot-simple .spot-grid,.spot-simple.spot-flip .spot-grid { gap:20px; }
 .spot-simple .spot-intro { margin-top:12px; }
 .spot-tags { margin-top:16px;gap:6px; }
 .spot-tags li { font-size:11px;line-height:1.35;letter-spacing:0;padding:6px 9px; }
 .pages-extras { padding:24px 0 48px; }
 .pages-extras .extra { padding:16px 12px; }
 .pages-extras .extra h4 { font-size:13px;line-height:1.3;letter-spacing:0;margin-bottom:6px; }
 .pages-extras .extra p { font-size:12px;line-height:1.45; }
 .testimonials { padding:44px 0 36px; }
 .testimonials-layout { gap:20px; }
 .testimonials-note { margin-top:12px;line-height:1.45; }
 .testimonials-stage { padding-top:22px; }
 .testimonial-card blockquote { margin-top:20px; }
 .testimonial-card blockquote p { font-size:19px;line-height:1.35; }
 .testimonials-track { height:240px; }
 .testimonials-controls { margin-top:14px; }
 .suite { padding-block:48px; }
 .suite-note { margin-top:18px; }
 .offer-core { gap:20px; }
 .offer-name { font-size:12px;letter-spacing:.12em; }
 .offer .price { font-size:56px;margin:12px 0 8px; }
 .offer .was { font-size:17px; }
 .offer .ticks { margin:18px 0 24px;gap:9px; }
 .offer .ticks li { font-size:12px;line-height:1.45;padding-left:22px; }
 .offer .ticks li::before { width:11px; }
 .trial-strip { padding:20px 18px;gap:14px; }
 .trial-copy h3 { font-size:19px;line-height:1.2;font-stretch:110%; }
 .assure { margin-top:26px;gap:10px 18px;font-size:11px;letter-spacing:0; }
 .release-history-heading { gap:14px; }
 .release-history-heading h2 { margin-top:12px; }
 .is-scroll-story .release-event h3 { font-size:16px;line-height:1.2; }
 .built-by { padding:48px 0; }
 .built-by-heading { margin-bottom:24px; }
 .built-by-heading p { font-size:12px;line-height:1.45;max-width:none;margin-top:10px; }
 .built-by-person figcaption { padding-top:12px; }
 .built-by-person h3 { font-size:20px;font-stretch:120%; }
 .built-by-role { font-size:11px;margin-top:5px; }
 .built-by-process { margin-top:28px;padding-top:24px;gap:14px; }
 .built-by-process h3 { font-size:21px;line-height:1.15;font-stretch:110%; }
 .built-by-copy p+p { margin-top:14px; }
 .faq { padding:40px 0 56px; }
 .faq-list summary { font-size:13px;line-height:1.4;padding:15px 28px 15px 0;min-height:48px; }
 .faq-list details p { padding-bottom:16px; }
 .foot { padding:36px 0 96px; }
 .foot-inner { gap:16px; }
 .foot p { font-size:11px;letter-spacing:.03em; }
}

/* Leave the zoomed instrument intact; keep chapter controls clear of the purchase dock. */
@media(max-width:860px) {
 .story-final .story-copy .story-nav { margin-top:10px;gap:5px; }
 .story-final .story-copy .story-nav button { padding-block:8px; }
 .story-final .story-copy .xy-modes { margin-top:10px; }
}

/* Preserve the six-screen camera travel, but release into the next section
   at the bottom of the final instrument instead of an empty full-height pin. */
@media(max-width:860px) {
 .story-final { --mobile-stage-top:64px;--mobile-outro-height:calc(var(--mobile-stage-top) + var(--mobile-stage-height) + 28px);height:calc(600svh + var(--mobile-outro-height)); }
 .story-final .story-pin { height:var(--mobile-outro-height);overflow:visible; }
 .story-final + .pages-intro { position:relative;z-index:1;background:var(--ink);padding-top:24px; }
}
@media(max-width:860px) and (max-height:740px) {
 .story-final { --mobile-stage-top:52px; }
}

/* Standalone phone copy shares a centered axis; interface rows keep their alignment. */
@media(max-width:860px) {
 .quick-listen-heading,.quick-listen-intro,.quick-listen-note,
 .showcase #showcase-title,.showcase-caption,
 .inside .sec-head,.inside .statement,.inside .body-lg,
 .story-final .story-copy,.sec-head,.spot-simple .spot-copy,
 .pages-extras .extra,.testimonials-head,.suite-note,
 .offer-name,.offer .price,.offer-sub,.trial-copy,
 .release-history-heading,.built-by-person figcaption,.built-by-process { text-align:center; }
 .quick-listen-heading { align-items:center; }
 .showcase .showcase-intro,.inside .body-lg,.spot-simple .spot-intro,
 .testimonials-note,.release-history-heading > p,.offer-sub,.trial-copy p { margin-inline:auto; }
 .sec-head .eyebrow,.inside .eyebrow,.story-final .eyebrow,.story-final .num,
 .spot-simple .eyebrow,.testimonials-head .eyebrow,.release-history-heading .eyebrow,
 .story-final .story-hint,.spot-tags,.offer-name,.offer .price { justify-content:center; }
 .story-final .story-copy,.story-final[data-step="3"] .story-copy { left:24px;right:24px; }
 .story-final .story-copy .story-nav button { text-align:center; }
 .release-history-heading,.built-by-process { grid-template-columns:1fr; }
 .built-by-portraits { grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:420px;margin-inline:auto; }
 .built-by-person img { border-radius:10px; }
 .built-by-person figcaption { padding-top:10px; }
 .built-by-person h3 { font-size:clamp(15px,4.2vw,19px);font-stretch:110%;line-height:1.2; }
 .built-by-role { font-size:10px;line-height:1.4; }
 .built-by-process h3 br { display:none; }
}

/* A quiet boundary between the camera walkthrough and the feature pages. */
.story-final + .pages-intro { position:relative; }
.story-final + .pages-intro::before {
 content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
 width:min(1240px,calc(100% - 48px));height:1px;pointer-events:none;
 background:linear-gradient(90deg,transparent,rgba(238,232,223,.14) 18%,rgba(238,232,223,.14) 82%,transparent);
}

/* Phones use ordinary images and nearby captions, with no pinned camera scene. */
.mobile-feature-guide { display:none; }
@media(max-width:860px) {
 .story-final { height:auto;margin:0;padding:40px 0 32px; }
 .story-final .story-pin,.story-final .story-marks { display:none; }
 .mobile-feature-guide { display:block; }
 .mobile-feature-intro { text-align:center;margin-bottom:24px; }
 .mobile-feature-intro .eyebrow { justify-content:center; }
 .mobile-feature-intro h2 { font:650 clamp(22px,5.8vw,26px)/1.14 var(--display);font-stretch:120%;letter-spacing:-.025em; }
 .mobile-feature-intro > p:last-child { margin:12px auto 0;max-width:38ch;font-size:13px;line-height:1.5;color:var(--paper-2); }
 .mobile-feature-panel { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;align-items:center;margin:0;padding:24px 0; }
 .mobile-feature-panel + .mobile-feature-panel { border-top:1px solid rgba(238,232,223,.08); }
 .mobile-feature-panel picture { display:block;min-width:0; }
 .mobile-feature-panel img { display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;transform:none;clip-path:none;mask:none; }
 .mobile-feature-panel figcaption { min-width:0;text-align:left; }
 .mobile-feature-number { display:block;color:var(--amber);font:10px/1.4 var(--mono);letter-spacing:.1em;margin-bottom:8px; }
 .mobile-feature-panel h3 { font:600 clamp(16px,4.3vw,20px)/1.15 var(--display);letter-spacing:-.025em; }
 .mobile-feature-panel figcaption p { margin-top:9px;font-size:12px;line-height:1.5;color:var(--paper-2); }
}
@media(max-width:360px) {
 .mobile-feature-panel { gap:12px;grid-template-columns:1fr 1fr; }
 .mobile-feature-panel figcaption p { font-size:11px; }
}