.cinema{position:relative;background:#080d18;isolation:isolate}
.cinema__sticky{position:relative;min-height:700px;overflow:clip}
.cinema__visual{display:contents}
.cinema__mobile-nav{display:none}
.cinema__atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 76% 48%,#10255355,transparent 53%)}
.cinema__aura{position:absolute;width:70vw;height:70vw;max-width:1050px;max-height:1050px;left:var(--orb-x,73.5%);top:48%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#184ca926,transparent 65%)}
.cinema__scene{position:absolute;inset:0;pointer-events:none;container-type:size;--logo-pixels:min(64cqh,32cqw,600px)}
.cinema__scene canvas{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0}
.cinema__scene[data-renderer="webgl"] canvas{opacity:1}
.cinema__poster{position:absolute;inset:0;overflow:hidden}
.cinema__poster img{position:absolute;max-width:none;width:calc(var(--logo-pixels) * 3.9344262295);height:auto;left:73.5%;top:48%;transform:translate(-50%,-50%)}
.cinema__scene[data-renderer="webgl"] .cinema__poster{visibility:hidden}
.cinema__stage{position:relative;min-height:700px;display:flex;align-items:center;padding-block:70px 115px;pointer-events:none}
.cinema__panel{position:relative;width:52%;pointer-events:auto}
.cinema__panel:not(:first-child){display:none}
.cinema__eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:26px;font-size:12px;letter-spacing:.08em}
.cinema h1,.cinema h2{font-size:clamp(38px,4.3vw,66px);line-height:1.13;letter-spacing:-.03em;font-weight:600}
.cinema__description{font-size:18px;line-height:1.75;max-width:480px;margin-top:26px;color:#d0dceb;text-wrap:pretty}
.cinema__actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;margin-top:30px}
.cinema__signature{display:flex;align-items:center;gap:14px;font-size:14px;color:#b4c8e3;margin-top:30px}
.cinema__signature::before{content:"";width:24px;height:1px;background:#84b4eb;flex-shrink:0}
.cinema__disciplines{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:28px;font-size:14px;color:#d5eaff}
.cinema__disciplines span::before{content:"+";margin-right:8px;color:#8acbff}
.cinema__rail{position:absolute;bottom:18px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:4;font-size:12px;letter-spacing:.06em}
.cinema__rail .scroll-cue{font-size:12px}
.cinema__location{font-size:12px;color:#b9cce6}
.cinema__chapters{display:none;gap:22px}
.cinema__chapters button{color:#b9cbe4;background:none;border:0;border-bottom:2px solid transparent;padding:12px 2px;font-size:12px;letter-spacing:.035em;min-height:48px;min-width:44px;transition:color .2s,border-color .2s}
.cinema__chapters button span{color:#a9c6ed;margin-right:8px}
.cinema__chapters button[aria-current="step"]{color:#fff;border-color:#8fcbff}
.cinema__progress{display:block;height:48px;position:absolute;bottom:0;left:0;right:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,rgba(7,10,18,0.3) 100%);box-shadow:0 8px 20px rgba(0,0,0,0.25)}.cinema__progress::after{content:'';position:absolute;bottom:0;left:4%;right:4%;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.07) 20%,rgba(148,163,184,0.14) 50%,rgba(255,255,255,0.07) 80%,transparent 100%)}
.cinema__progress span{display:none !important}
:is(.cinema--enhanced,html[data-motion="full"] .cinema){height:470svh}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__sticky{position:sticky;top:90px;height:calc(100svh - 90px);min-height:0}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__stage{height:100%;min-height:0;display:block;padding:0}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel{display:block;position:absolute;top:46%;left:0;transform:translateY(-50%);visibility:hidden;pointer-events:none}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel:nth-child(2){left:auto;right:0;width:46%}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel.is-active{visibility:visible;pointer-events:auto;animation:panel-arrive .38s var(--sw-ease) both}
@keyframes panel-arrive{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__chapters{display:flex}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__progress{display:block}
.method-mark{position:relative;width:100%;height:100%;overflow:clip}
.method-mark__scene{position:absolute;inset:0 0 48px;display:flex;align-items:center;justify-content:center}
.method-mark img{width:70%;filter:drop-shadow(0 0 28px #1c68ed25);transition:opacity .35s ease}
.method-mark__scene canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .4s ease;pointer-events:none}
.method-mark__scene[data-renderer="webgl"] canvas{opacity:1}
.method-mark__scene[data-renderer="webgl"] :is(img,.method-mark__orbit){opacity:0}
.method-mark__orbit{position:absolute;inset:14% 2%;border:1px solid #588fbc50;border-radius:50%;transform:rotate(-25deg) scaleY(.78)}
.method-mark__caption{position:absolute;inset:auto 0 3%;display:flex;flex-direction:column;align-items:center;gap:10px}
.method-mark__label{font-size:12px;letter-spacing:.1em;color:#b9d8fa}
.method-mark__pause{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;padding:3px 12px;border:1px solid #6689b345;border-radius:999px;background:#101b2b;color:#cbdcf3;font-size:11px;line-height:1.4;transition:background .2s,border-color .2s}
.method-mark__pause:hover{background:#172b44;border-color:#87c8ff99}
.method-mark__pause i{width:8px;height:9px;border-inline:2px solid currentColor}
.method-mark__pause[aria-pressed="true"] i{width:0;height:0;border:5px solid transparent;border-right:0;border-left:7px solid currentColor}
@media(min-width:1700px){.cinema__stage{width:min(calc(100% - var(--sw-margin)*2),1520px)}.cinema h1,.cinema h2{font-size:78px}.cinema__description{max-width:520px}}
@media(max-width:1100px){
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__sticky{top:80px;height:calc(100svh - 80px)}
.cinema h1,.cinema h2{font-size:clamp(36px,4.2vw,47px)}.cinema__description{font-size:17px;max-width:390px}.cinema__eyebrow{font-size:12px}
.cinema__actions{gap:8px 18px}.cinema__signature{font-size:13px}.cinema__chapters{gap:16px}.cinema__location{display:none}
.method-mark__pause{min-height:44px}
.method-mark__scene{bottom:72px}
}
@media(max-width:900px){
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__sticky{top:74px;height:calc(100svh - 74px)}
.cinema__panel{width:53%}.cinema h1,.cinema h2{font-size:36px}.cinema__description{font-size:16px}.cinema__eyebrow{font-size:12px}
.cinema__signature{display:none}.cinema__rail .scroll-cue{font-size:12px}.cinema__chapters{gap:12px}
}
@media(max-width:700px){
.cinema{--mobile-scene-height:clamp(130px,32svh,290px)}
.cinema__sticky{min-height:0;overflow:visible}
:is(.cinema--enhanced,html[data-motion="full"] .cinema){height:auto}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__sticky{position:relative;top:auto;height:auto;overflow:visible}
.cinema__visual{display:block;position:relative;height:calc(var(--mobile-scene-height) + 52px);z-index:3;background:#080d18;isolation:isolate}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__visual{position:sticky;top:74px}
.cinema__visual::after{content:"";position:absolute;inset:auto 0 -14px;height:14px;background:linear-gradient(#080d18,transparent);pointer-events:none}
.cinema__stage,:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__stage{height:auto;min-height:0;display:block;padding-block:0 14px}
.cinema .cinema__panel,:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel,:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel:nth-child(2){position:relative;display:flex;flex-direction:column;justify-content:flex-start;min-height:0;padding-block:20px 24px;top:auto;left:auto;right:auto;width:100%;transform:none;visibility:visible;pointer-events:auto}
.cinema .cinema__panel:first-child{padding-top:12px}
.cinema .cinema__panel:not(:first-child){border-top:1px solid #8db5e529}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel.is-active{animation:none}
.cinema h1,.cinema h2{font-size:clamp(28px,8vw,42px);line-height:1.15}.cinema__eyebrow{font-size:11px;letter-spacing:.04em;margin-bottom:14px}
.cinema__description{font-size:15px;line-height:1.6;max-width:440px;margin-top:16px}
.cinema__actions{margin-top:18px;gap:10px;flex-wrap:nowrap}.cinema__actions .button{min-height:48px;padding:10px;gap:8px;font-size:13px}.cinema__actions .text-link{font-size:13px;gap:6px;flex-shrink:0}
.cinema__disciplines{margin-top:18px;font-size:13px;gap:10px 16px}
.cinema__scene{bottom:auto;height:var(--mobile-scene-height);--logo-pixels:min(76cqh,65cqw)}.cinema__poster img{left:50%;top:50%}
.cinema__atmosphere{background:radial-gradient(ellipse at 50% 20%,#10255355,transparent 53%)}
.cinema__aura{left:50%;top:calc(var(--mobile-scene-height) / 2);width:130vw;height:130vw}
.cinema__rail,.cinema__progress,:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__progress{display:none}
.cinema__mobile-nav{position:absolute;bottom:0;left:0;right:0;height:52px;display:block}
.cinema__mobile-track{height:2px;background:#8baacf25;border-radius:2px;overflow:hidden}
.cinema__mobile-track span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#3b82f6,#69d3ff)}
.cinema__mobile-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;height:50px}
.cinema__mobile-caption>span{font-size:10px;letter-spacing:.1em;color:#9ebde0;white-space:nowrap}
.cinema__mobile-caption a{display:flex;align-items:center;gap:10px;min-height:44px;font-size:12px;color:#d9ebff}
.cinema__mobile-caption a>span{font-size:20px;color:#70caff}
[data-motion="static"] .cinema__mobile-track,[data-motion="static"] [data-mobile-chapter],html:not([data-motion]) .cinema__mobile-track,html:not([data-motion]) [data-mobile-chapter]{visibility:hidden}
.method-mark{max-width:340px;margin:auto}.method-mark img{width:65%}.method-mark__orbit{inset:5% 0}.method-mark__label{bottom:0}
}
@media(max-width:360px){.cinema h1,.cinema h2{font-size:28px}.cinema__eyebrow{letter-spacing:0}.cinema__actions{gap:4px 12px}.cinema__chapters{gap:0}}
@media(max-width:700px) and (max-height:650px){
.cinema__eyebrow{margin-bottom:10px}
.cinema__description{font-size:14px;line-height:1.5;margin-top:12px}
.cinema__actions,.cinema__disciplines{margin-top:12px}
.cinema__actions .button{line-height:1.4;padding-block:8px}
}
@media(min-width:701px) and (max-height:500px){
.cinema h1,.cinema h2{font-size:28px}
.cinema__eyebrow{font-size:10px;margin-bottom:10px}
.cinema__description{font-size:14px;line-height:1.5;margin-top:12px}
.cinema__actions,.cinema__disciplines{margin-top:12px}
.cinema__signature{display:none}
.cinema__actions .button{min-height:44px;padding:8px 12px;font-size:13px;gap:8px}
.cinema__actions .text-link{font-size:13px;gap:6px}
:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel{top:41%}
}
@media(prefers-reduced-motion:reduce){.cinema__scene canvas{transition:none}:is(.cinema--enhanced,html[data-motion="full"] .cinema) .cinema__panel.is-active{animation:none}}
