/* The original mark is the aperture; the landscape stays in one coordinate space. */
.opening { height:auto; min-height:0; color:var(--ink); background:var(--paper) }
.opening-stage { position:relative; height:auto; min-height:100svh; overflow:hidden; isolation:isolate; background:var(--paper) }
.entrance-place,.entrance-veil { position:absolute; inset:0; display:none; width:100%; height:100%; pointer-events:none }
.entrance-place { z-index:0 }
.entrance-place img { width:100%; height:100%; max-width:none; object-fit:cover; object-position:60% center }
.entrance-veil { z-index:2; overflow:hidden }
.opening-grid { position:relative; z-index:3; display:grid; grid-template-columns:1.14fr .86fr; align-items:center; gap:3vw; height:auto; min-height:100svh; padding:116px 5vw 76px; pointer-events:none }
.opening .hero-copy { opacity:1!important; transform:none!important; pointer-events:auto!important; max-width:760px }
.opening .hero-copy h1 { white-space:normal; font-size:clamp(48px,5.6vw,96px); line-height:1.04 }
.opening .hero-lead { max-width:460px; font-size:18px; line-height:1.55 }
.opening .portal-anchor { display:block; width:100%; height:auto; max-width:570px; max-height:none; aspect-ratio:500/460; justify-self:center; background:url('assets/responsive/3dc9ae1be775-960.webp') 60% center/cover; -webkit-mask:url('assets/geai-brand.svg') center/contain no-repeat; mask:url('assets/geai-brand.svg') center/contain no-repeat }
.opening .landscape-message { display:none!important; z-index:4; bottom:12svh; left:6vw; right:6vw; color:var(--white); text-shadow:0 2px 24px #00191080 }
.opening .landscape-message>p:last-child { font-size:clamp(48px,7vw,110px); line-height:1.04; letter-spacing:-.045em; margin:0 }
.opening .scroll-cue { display:none!important; z-index:4; left:5vw; right:auto; bottom:26px; gap:18px; color:var(--green) }
.opening .scroll-cue small { font-size:12px; letter-spacing:.035em }
.opening .scroll-cue span { width:56px; height:1px; background:currentColor; transform-origin:left; transform:scaleX(var(--cue-progress,0)) }
.opening.has-aperture { height:225svh }
.has-aperture .opening-stage { position:sticky; top:0; height:100svh; min-height:0 }
.has-aperture .entrance-place,.has-aperture .entrance-veil { display:block }
.has-aperture .opening-grid { height:100%; min-height:0; opacity:var(--entrance-copy,1); transform:translate3d(0,var(--entrance-shift,0px),0) }
.has-aperture .portal-anchor { visibility:hidden; background-image:none }
.has-aperture .landscape-message { display:block!important; opacity:var(--entrance-caption,0); transform:translate3d(0,var(--caption-shift,16px),0) }
.has-aperture .scroll-cue { display:flex!important; opacity:var(--entrance-copy,1) }
.has-aperture .opening-stage::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(0deg,#052319a8,transparent 72%); opacity:var(--entrance-caption,0) }
.has-aperture.aperture-active .opening-grid,.has-aperture.aperture-active .landscape-message { will-change:transform,opacity }
@media(max-width:760px) {
 .opening .opening-grid { grid-template-columns:1fr; grid-template-rows:auto 1fr; gap:20px; padding:108px 24px 60px; align-items:start }
 .opening .hero-copy h1 { font-size:clamp(36px,9.6vw,60px); line-height:1.05 }
 .opening .hero-copy .eyebrow { margin-bottom:16px; font-size:12px }
 .opening .hero-lead { margin:18px 0 22px; font-size:16px; max-width:460px; line-height:1.5 }
 .opening .portal-anchor { width:min(72vw,34svh); align-self:center; max-width:400px; min-width:150px }
 .opening .scroll-cue { left:24px; bottom:24px }
 .opening .landscape-message { left:24px; right:24px; bottom:12svh }
 .opening .landscape-message>p:last-child { font-size:clamp(42px,12vw,72px) }
 .opening.has-aperture { height:205svh }
 .opening .entrance-place img { object-position:62% center }
}
@media(max-width:760px) and (max-height:740px) {
 .opening .opening-grid { padding-top:90px; padding-bottom:48px; gap:12px }
 .opening .hero-copy .eyebrow { margin-bottom:10px }
 .opening .hero-lead { margin:12px 0 16px }
 .opening .portal-anchor { width:min(64vw,28svh); min-width:140px }
}
@media(max-height:580px) and (orientation:landscape) {
 .opening .opening-grid { grid-template-columns:1.2fr .8fr; grid-template-rows:1fr; align-items:center; padding:80px 5vw 32px }
 .opening .hero-copy h1 { font-size:clamp(28px,4.8vw,48px) }
 .opening .hero-copy .eyebrow { margin-bottom:8px }
 .opening .hero-lead { font-size:16px; line-height:1.35; margin:12px 0 }
 .opening .portal-anchor { width:min(32vw,58svh); min-width:0 }
 .opening .scroll-cue { display:none!important }
}
@media(prefers-reduced-motion:reduce) {
 .opening.has-aperture { height:auto }
 .has-aperture .opening-stage { position:relative; height:auto; min-height:100svh }
 .has-aperture .opening-grid { height:auto; min-height:100svh; opacity:1; transform:none }
 .has-aperture .entrance-place,.has-aperture .entrance-veil,.has-aperture .opening-stage::after,.has-aperture .landscape-message,.has-aperture .scroll-cue { display:none!important }
 .has-aperture .portal-anchor { visibility:visible }
}