/* Scroll stays native; the phone is sticky only inside the video track. */
.studio-intro .work-tab>span[aria-hidden="true"]{display:none}
.studio-intro .work-tab{justify-content:center;gap:0;min-width:112px}
.reels-track{position:relative;height:var(--reels-track-height,450svh)}
.reels-stage{
 position:sticky;top:var(--reels-sticky-top,130px);height:var(--reels-stage-height,calc(100svh - 130px));
 min-height:0;padding:22px 0 28px;grid-template-columns:1fr auto 1fr;gap:7%;
}
.reels-stage .reel-card{
 grid-column:2;grid-row:1;justify-self:center;
 width:auto;height:min(64svh,calc(var(--reels-stage-height,calc(100svh - 130px)) - 58px),560px);
 max-width:100%;aspect-ratio:9/16;cursor:pointer;
 transition:translate 1150ms cubic-bezier(.16,1,.3,1),opacity 700ms ease;
}
.reels-story-ready .reel-card{translate:min(38vw,440px) 0;opacity:0}
.reels-story-ready.is-reel-entered .reel-card{translate:0 0;opacity:1}
.reel-card:focus-visible{outline:2px solid #fff;outline-offset:6px}
.reel-card .reel-preview{position:absolute;inset:0;opacity:0;border-radius:0;pointer-events:none}
.reel-card .reel-preview.is-active{opacity:1}
.reel-card .reel-preview.is-exiting{opacity:1}
.reel-progress{z-index:3;pointer-events:none}
.reels-stage .reel-details{grid-column:3;grid-row:1;align-self:end;justify-self:start;margin:0 0 26px;padding:0;max-width:100%}
.reels-stage .reel-details h3{overflow-wrap:anywhere}
.reel-status{position:absolute;inset:0;z-index:4;display:grid;place-items:center;padding:24px;background:#111d;color:#fff;text-align:center;font:14px/1.5 Arial,sans-serif}
.reel-status[hidden]{display:none}
.reels-stage .reel-display-word{left:0;top:50%;width:100%;box-sizing:border-box;padding:.12em .025em;translate:0 -50%;transform:none!important;will-change:auto;display:flex;justify-content:center;gap:.015em;font-size:clamp(150px,24vw,440px);line-height:1.05;letter-spacing:0;font-kerning:none;font-variant-ligatures:none;text-align:center;z-index:0}
.reel-display-word>span{display:block;flex:0 0 auto;letter-spacing:0;line-height:inherit}
.reels-stage .reel-display-word::after{content:none;display:none}
.reels-stage .reel-card,.reels-stage .reel-details{z-index:1}

/* The moving droplet is separate from the quiet, clickable section anchors. */
.section-dots{color:#171715}
.section-dots[data-ink="light"]{color:#fff}
.section-droplet{position:absolute;inset:0;overflow:visible;width:100%;height:100%;pointer-events:none;fill:currentColor}
.section-dots.is-liquid-nav a[aria-current="location"]>span{width:5px;height:5px;opacity:.55;transform:none}
.section-dots.is-liquid-nav a>span{opacity:.55;transition:none}
.section-dots.is-loop-turn{transform-origin:50% 50%;transform-style:preserve-3d;will-change:transform;pointer-events:none}
.section-dots.is-loop-turn,.section-dots.is-loop-turn .section-droplet{backface-visibility:visible}
.section-dots.is-loop-turn a>span{transition:none}

@media(max-width:760px){
 .studio-intro .work-tab{min-width:100px}
 .reels-stage{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:8px;padding:14px 0 22px}
 .reels-stage .reel-card{
  grid-column:1;grid-row:1;
  height:min(54svh,calc(var(--reels-stage-height,calc(100svh - 130px)) - 94px),440px);
  width:auto;max-width:100%;align-self:center;
 }
 .reels-stage .reel-details{grid-column:1;grid-row:2;display:block;justify-self:center;align-self:end;margin:0;text-align:center}
 .reels-stage .reel-details h3{font-size:23px;margin:0;line-height:1.1}
 .reels-stage .reel-format{display:none}
 .reels-stage .reel-display-word{font-size:18vw;top:45%}
}
@media(prefers-reduced-motion:reduce){
 .reels-story-ready .reel-card{translate:none;opacity:1;transition:none}
 .section-dots.is-liquid-nav a>span{transition:none}
}