/* One complete device scene travels between two measured layout slots. */
.intro-story{--story-header:76px;position:relative;isolation:isolate;background:#fff}
.intro-story .hero{height:calc(100svh - var(--story-header));min-height:560px;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:visible;padding-bottom:14px;background:#fff}
.intro-story .hero-copy{padding-top:clamp(18px,3svh,36px);opacity:var(--hero-copy-opacity,1);z-index:2}
.intro-story .hero h1{font-size:clamp(42px,7svh,76px);line-height:1.1;margin:8px auto 16px}
.intro-story .hero-desc{font-size:var(--body);line-height:1.5}
.intro-story .hero-actions{margin-top:19px;gap:25px}
.intro-story .release{margin-top:14px;font-size:var(--small)}
.intro-story .product-stage{margin:0 auto;width:min(1200px,100%);height:100%;min-height:0;isolation:auto}
.story-device{width:100%}
.story-ready .story-device{position:absolute;left:0;top:0;width:1536px;height:1024px;transform-origin:0 0;z-index:1;pointer-events:none;will-change:transform}
.story-ready .story-device .rendered-scene{width:1536px;height:1024px;aspect-ratio:auto;transform:none;overflow:visible;--scene-scale:1;--scene-left:0px}
.intro-story .practice-showcase{height:calc(100svh - var(--story-header));min-height:560px;border:0;background:transparent;position:relative}
.intro-story .feature-pin{height:100%;min-height:0;padding-block:30px;overflow:visible;position:relative;top:0}
.intro-story .feature-layout{height:100%;min-height:0}
.intro-story .feature-explanation{position:relative;z-index:2}
.intro-story .feature-devices{height:100%;min-height:0;max-width:none;aspect-ratio:auto}
.studio-formats{font-size:var(--small)!important;color:var(--muted);margin-top:16px}
@media(max-width:1100px) and (min-width:761px){.header .nav-wrap{width:calc(100% - 48px);gap:14px}.header .brand{font-size:var(--small)}.header .nav-wrap nav{gap:13px}.header .nav-studio{padding-inline:12px}.header .language-trigger{padding-inline:9px}}
@media(max-width:760px){
 .intro-story{--story-header:110px}
 .intro-story .hero{min-height:580px;padding-bottom:10px}
 .intro-story .hero-copy{padding-top:22px}
 .intro-story .hero h1{font-size:clamp(32px,5svh,44px);line-height:1.18;margin:8px auto 15px}
 .intro-story .hero-desc{max-width:350px;font-size:var(--body)}
 .intro-story .hero-actions{margin-top:18px;gap:17px}
 .intro-story .release{margin-top:12px}
 .intro-story .practice-showcase{min-height:600px}
 .intro-story .feature-pin{padding-block:30px 12px}
 .intro-story .feature-layout{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);align-content:stretch;gap:4px}
 .intro-story .feature-devices{width:100%;height:100%;min-height:200px}
 .intro-story .feature-explanation>h2{font-size:var(--body);margin-bottom:18px}
 .intro-story .showcase-panel h3{font-size:var(--title)}
}
@media(min-width:761px) and (max-height:600px){
 .intro-story .hero{min-height:340px;grid-template-columns:1fr 1.2fr;grid-template-rows:1fr;gap:0;padding-inline:32px}
 .intro-story .hero-copy{width:100%;align-self:center;text-align:left;padding-top:0}
 .intro-story .hero h1{font-size:36px}
 .intro-story .hero-desc{font-size:var(--small)}
 .intro-story .hero-actions{justify-content:flex-start;gap:18px}
 .intro-story .practice-showcase{min-height:360px}
 .intro-story .feature-pin{padding-block:15px}
 .intro-story .feature-explanation>h2{margin-bottom:18px}
 .intro-story .showcase-panel h3{font-size:var(--title);margin-bottom:14px}
 .intro-story .showcase-panel p{font-size:var(--small)}
}
@media(prefers-reduced-motion:reduce){.story-ready .story-device{will-change:auto}.intro-story .hero-copy{opacity:1}}
@media(max-width:760px){.studio-feature,.faq-section,.support-banner{grid-template-columns:minmax(0,1fr)}.studio-feature-copy,.studio-feature-visual,.support-copy{min-width:0}.studio-feature h2,.support-copy h2{overflow-wrap:anywhere}}