/* Final editorial alignment and short-screen composition, using existing media. */
.method-lede p:last-child,.swift-introduction>p>span{max-width:38ch}
.atlas-heading>p,.swift-studies-heading>p:last-child{max-width:40ch}
.atlas-notes p,.swift-direction>div>p{max-width:48ch}
.editorial-index,.swift-index,.contact-index{align-items:baseline;line-height:1.6}
.method-close>span,.swift-close>span{color:var(--copy-ink)}
.swift-study-number,.swift-study-title>span,.method-film figcaption,.film-duration{color:var(--copy-ink)}
.method-principles h3{line-height:1.08}
.contact-link-label,.swift-direction-status{font-size:11px;letter-spacing:.08em}
.contact-invitation>p{max-width:26ch}
.method-footer .footer-nav a{font-size:14px}
.chapter-menu nav{max-height:calc(100svh - var(--bar) - 24px);overflow-y:auto;overscroll-behavior:contain}
.atlas-credit a{min-height:44px;display:inline-flex;align-items:center}
.turn-controls input{height:44px;touch-action:pan-y}
/* Keep a legible static image behind the film during buffering or failure. */
.method-film-slot video{transition:opacity 180ms ease}
.method-film-slot[data-buffering=true] video{opacity:0}

@media(max-width:900px){
 .primary-nav{display:none}
 .method-header .header-tools{margin-left:auto}
}
@media(min-width:761px) and (max-width:1000px){
 .method-process{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:8%}
 .method-principles{grid-template-columns:1fr;gap:0}
 .method-principles li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:16px;padding:20px 0}
 .method-principles li:first-child{padding-top:0;border-top:0}
 .method-principles h3{font-size:30px;margin:0 0 10px}
 .method-principles p{max-width:36ch}
}
@media(max-width:760px){
 .method-header{padding-inline:7%}
 .method-lede p:last-child,.swift-introduction>p>span,.atlas-heading>p{max-width:42ch}
 .swift-introduction h2,.editorial .method-introduction h2{line-height:1.02}
 .swift-record-index,.swift-status,.swift-identity>p,.swift-year-label{font-size:10px;letter-spacing:.06em}
 .contact-index>span:last-child{font-size:10px;max-width:130px}
 .contact-introduction h2{font-size:clamp(40px,10.5vw,76px);line-height:1.04}
 .contact-link-label{font-size:10px}
 .contact-bottom>span{line-height:1.6}
 .atlas-photo-label{font-size:9px;letter-spacing:.04em}
}
@media(max-width:380px){
 .method-header{padding-inline:5%}
 .swift-record-index{flex-wrap:wrap;gap:12px}
 .swift-record-index>span:first-child{max-width:none}
 .swift-status{max-width:none;white-space:nowrap}
 .swift-identity h3{font-size:clamp(52px,16vw,65px)}
}
@media(max-width:480px) and (max-height:600px){
 body[data-motion=on] .stage{height:var(--stage-height);min-height:0}
 body[data-motion=on] .stage .detail-copy{top:38%}
 body[data-motion=on] .stage .detail-copy h2{font-size:28px;margin-bottom:10px}
 body[data-motion=on] .detail-copy .eyebrow{font-size:10px;margin-bottom:10px}
 .detail-facts li{padding:6px 0}
 .detail-facts p{font-size:12px;line-height:1.4}
 body[data-motion=on] .detail-facts li{transform:translateY(calc((1 - var(--reveal,0))*8px))}
}

/* A true landscape stage: headline, vehicle and controls all fit above the fold.
   Keep this breakpoint paired with measure() in c3.js. */
@media(min-width:481px) and (max-width:1100px) and (max-height:500px){
 .method-header{height:56px;padding-inline:6%}
 .primary-nav{display:none}
 .method-header .header-tools{margin-left:auto}
 .method-header .chapter-menu nav{top:calc(100% + 6px);right:0}
 body[data-motion=on] .stage{height:var(--stage-height);min-height:0}
 body[data-motion=on] .site-header{display:none}
 body[data-motion=on] .encounter-copy{top:12%;left:6%;width:40%}
 body[data-motion=on] .encounter-copy h1{font-size:clamp(32px,5vw,48px);line-height:1.01;margin-bottom:16px}
 body[data-motion=on] .encounter-copy .eyebrow{margin-bottom:14px;font-size:10px}
 body[data-motion=on] .encounter-copy .intro{display:none}
 body[data-motion=on] .encounter-copy .circle-link{min-height:44px}
 body[data-motion=on] .encounter-copy .circle{width:40px;height:40px}
 body[data-motion=on] .orbit-plane{left:30%;width:70%;top:54%;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 97%,transparent),linear-gradient(0deg,transparent,#000 8%,#000 78%,transparent 100%);mask-composite:intersect}
 body[data-motion=on] .orbit-framing{transform:none;mask-image:none}
 body[data-motion=on] .media-shade{background:linear-gradient(90deg,#171717,#171717bb 25%,transparent 47%)}
 body[data-motion=on] .form-word{top:13%;left:35%;font-size:24vw}
 body[data-motion=on] .turn-copy{top:8%;left:6%;width:39%}
 .observation h3{font-size:clamp(28px,4vw,39px);line-height:1.02;margin:8px 0}
 .observation h3 br{display:none}
 .observation p{font-size:12px;line-height:1.5;margin-bottom:0;max-width:32ch}
 .observation p br{display:none}
 .observation-index{font-size:10px}
 body[data-motion=on] .turn-copy .observation-track{margin-top:10px;width:78%;max-width:78%}
 body[data-motion=on] .turn-copy .angle-display{position:relative;top:auto;right:auto;font-size:25px;margin:10px 0 0}
 body[data-motion=on] .turn-copy .turn-controls{width:78%;max-width:78%}
 body[data-motion=on] .turn-controls>div{font-size:9px}
 .quiet-link{display:none}
 body[data-motion=on] .stage .detail-copy{left:51%;top:8%;width:43%}
 body[data-motion=on] .stage .detail-copy h2{font-size:clamp(26px,3.5vw,34px);line-height:1.02;margin-bottom:10px}
 body[data-motion=on] .detail-copy h2 br{display:none}
 body[data-motion=on] .detail-copy h2 em{display:inline}
 body[data-motion=on] .detail-copy .eyebrow{font-size:10px;margin-bottom:10px}
 body[data-motion=on] .detail-copy .intro{display:none}
 .detail-facts{display:block;margin:8px 0 0}
 .detail-facts li{display:flex;gap:10px;padding:6px 0}
 .detail-facts li>span{font-size:10px;min-width:16px;margin:0}
 .detail-facts strong{font-size:13px}
 .detail-facts p{font-size:12px;line-height:1.4;margin:2px 0 0}
 .feature-label,.leader-line,.diagram-caption{display:none}
 .feature-number{display:block}
 body[data-motion=on] .inspection-shade{background:linear-gradient(90deg,transparent 42%,#171717dd 53%,#171717)}
 body[data-motion=on] .scene-bottom{left:6%;right:6%;bottom:4px;padding-bottom:0}
 .chapters{gap:20px}
 .chapters a{font-size:10px;min-height:44px}
 .chapters a:not([aria-current])>span:last-child{display:none}
 .scroll-cue{display:none}
 .reference-viewer{padding:10px 16px}
 .reference-viewer-top{margin-bottom:6px}
 .reference-viewer .reference-print{width:min(100%,calc((100svh - 214px)*1.496));border-width:3px}
 .reference-viewer figcaption{font-size:11px;line-height:1.5;margin-top:8px}
 .reference-navigation{margin-top:8px;padding-top:0}
 .reference-help{display:none}
}
@media(min-width:481px) and (max-width:1100px) and (max-height:360px){
 body[data-motion=on] .detail-copy .eyebrow{display:none}
 .detail-facts li{padding:4px 0}
 body[data-motion=on] .detail-facts li{transform:translateY(calc((1 - var(--reveal,0))*8px))}
 body[data-motion=on] .turn-copy{top:6%}
 .observation h3{font-size:28px;margin:6px 0}
 body[data-motion=on] .turn-copy .angle-display{position:absolute;top:auto;right:-12px;bottom:26px;margin:0;font-size:23px}
 body[data-motion=on] .turn-copy .observation-track{margin-top:7px}
}
