/* Fit the introductory copy, whole FM visual and controls in the available viewport.
   Very small windows and enlarged text retain natural scrolling, never clipping. */
.site-v3.elements-study .hero{padding:0 0 28px}
.site-v3.elements-study .hero-layout{min-height:calc(100svh - 80px);padding-block:16px;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-content:center;align-items:center}
.site-v3.elements-study .hero-copy{width:100%;max-width:900px;margin:0 auto}
.site-v3.elements-study .hero h1{font-size:clamp(32px,5.2vh,62px);line-height:1.06;margin:12px 0}
.site-v3.elements-study .hero-copy>p{font-size:15px;line-height:1.5;max-width:740px;margin-inline:auto}
.site-v3.elements-study .hero-copy>.alpha3-note{font-size:12px;line-height:1.5;margin-top:8px}
.site-v3.elements-study .hero .actions{margin-top:14px;gap:10px}
.site-v3.elements-study .hero-meta{margin-top:12px;gap:6px 16px;font-size:11px}
.site-v3.elements-study .hero .actions .btn{min-height:42px;font-size:12px;padding:10px 15px}
.site-v3.elements-study .hero .pill{padding:5px 12px;font-size:11px}
.hero-visual{min-width:0;width:100%;align-self:center}
.elements-study .hero-visual .assembly-scene{width:min(calc(100% - 32px),var(--fitted-scene-width,900px));margin:76px auto 84px}
.elements-study .hero-visual .assembly-stage{margin:0;padding:0}
.elements-study .hero-visual .assembly-controls{margin:0;min-height:36px;gap:16px;flex-wrap:wrap}
.site-v3.elements-study .routes-wrap{margin-top:28px}
@media(min-width:1000px) and (max-height:900px){
 .site-v3.elements-study .hero-layout{grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:32px}
 .site-v3.elements-study .hero-copy{text-align:left;max-width:520px}
 .site-v3.elements-study .hero h1{font-size:clamp(32px,3.7vw,50px)}
 .site-v3.elements-study .hero .actions,.site-v3.elements-study .hero-meta{justify-content:flex-start}
}
@media(max-width:800px){
 .site-v3.elements-study .hero-layout{min-height:calc(100svh - 66px);padding-block:12px;gap:10px}
 .site-v3.elements-study .hero h1{font-size:clamp(28px,4.5vh,44px);margin:10px 0}
 .site-v3.elements-study .hero-copy>p{font-size:14px;line-height:1.45}
 .site-v3.elements-study .hero-copy>.alpha3-note{font-size:11px;margin-top:6px}
 .site-v3.elements-study .hero .actions{margin-top:10px;gap:8px}
 .site-v3.elements-study .hero .actions .btn{min-height:40px;font-size:11px;padding:8px 11px}
 .site-v3.elements-study .hero-meta{margin-top:9px;font-size:10px;gap:3px 10px}
 .elements-study .hero-visual .assembly-scene{margin-top:20px;margin-bottom:38px}
 .elements-study .hero-visual .assembly-controls{gap:10px}
 .elements-study .hero-visual .assembly-controls .btn{font-size:10px;padding:7px 10px}
 .elements-study .hero-visual .assembly-themes{font-size:10px}
}
@media(max-width:800px) and (max-height:650px){
 .site-v3.elements-study .hero-layout{padding-block:8px;gap:6px}
 .site-v3.elements-study .hero h1{font-size:27px;margin:7px 0}
 .site-v3.elements-study .hero-copy>p{font-size:13px;line-height:1.4}
 .site-v3.elements-study .hero .pill{font-size:10px;padding:3px 9px}
 .site-v3.elements-study .hero-meta{margin-top:6px}
}
@media(min-width:650px) and (max-width:999px) and (max-height:550px){
 .elements-study .site-header{height:66px}
 .site-v3.elements-study .hero-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;min-height:calc(100svh - 66px);padding-block:8px}
 .site-v3.elements-study .hero h1{font-size:26px;margin:7px 0}
 .site-v3.elements-study .hero-copy>p{font-size:12px;line-height:1.4}
 .site-v3.elements-study .hero-copy>.alpha3-note{font-size:11px;margin-top:5px}
 .site-v3.elements-study .hero .actions{margin-top:8px}
 .site-v3.elements-study .hero .actions .btn{min-height:36px;padding:7px 10px;font-size:11px}
 .site-v3.elements-study .hero-meta{margin-top:6px;font-size:10px;gap:2px 10px}
 .site-v3.elements-study .hero .pill{padding:3px 9px;font-size:10px}
 .elements-study .hero-visual .assembly-scene{margin-top:20px;margin-bottom:38px}
 .elements-study .is-assembling .assembly-stage{animation-name:single-window-mobile}
 .elements-study .is-assembling .ui-piece{--depth:0px!important;--dx:0px!important;--dy:12px!important}
 .elements-study .merge-window-1{--layer-y:30px;--layer-angle:12deg}
 .elements-study .merge-window-2{--layer-y:16px;--layer-angle:12deg}
 .elements-study .merge-window-3{--layer-y:2px;--layer-angle:12deg}
}