/* Immersive heroes: particle field and full-bleed institute story. */
.hero{background:radial-gradient(ellipse at 77% 48%,#0b2c3b70,transparent 44%),#040f1c}
.hero-art{inset:-35px -6% 0 41%;isolation:isolate}
.hero-art canvas{position:relative;z-index:2;cursor:grab;touch-action:pan-y;mask-image:none;outline-offset:-30px}
.hero-art canvas:active{cursor:grabbing}
.hero-art canvas:focus-visible{outline:1px dashed #80dcca88;border-radius:50%}
.sphere-halo{position:absolute;width:63%;aspect-ratio:1;left:50%;top:48%;transform:translate(-50%,-50%);background:radial-gradient(circle,#67e7c50a,transparent 62%);border-radius:50%;box-shadow:0 0 90px #268bc408;pointer-events:none;z-index:0}
.art-label{pointer-events:none}.label-one{right:17%;top:10%}.label-two{right:6%;bottom:25%}
.sphere-interface{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:14px;z-index:5;width:90%}
.sphere-interface .scene-caption{position:static;transform:none;font-size:10px;letter-spacing:1px;color:#91b6c8;text-align:center}
.sphere-controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.sphere-controls button{display:flex;align-items:center;gap:8px;color:#cbedea;border:1px solid #9ee9d632;background:#17364960;backdrop-filter:blur(15px);padding:11px 15px;min-height:44px;border-radius:24px;font-size:11px;transition:background .3s,border-color .3s,transform .3s}
.sphere-controls i{font-style:normal;font-size:18px;line-height:1;color:#c5f488}
.sphere-controls button:hover{background:#25556a80;border-color:#bbf0da90;transform:translateY(-2px)}
.sphere-controls button[aria-pressed=true]{background:#bfeeca;color:#092331}
.sphere-controls button[aria-pressed=true] i{color:#174c4f}
.sphere-controls button:disabled{opacity:.35;cursor:default}
.sphere-ripple .sphere-halo{animation:halo-pulse 1.5s ease-out}
@keyframes halo-pulse{0%{box-shadow:0 0 5px #64e9d522}70%{box-shadow:0 0 110px #64e9d530}100%{box-shadow:0 0 90px #268bc408}}
/* The second page is a single image-led hero, followed by the institute story. */
.purpose{padding:0;background:#f4f6f2}
.future-hero{min-height:850px;height:100svh;max-height:1200px;margin:0;border-radius:0;box-shadow:none;transform:none!important;background:#173e4f}
.future-hero .cinema-image{inset:-5%;z-index:-3;transform:scale(var(--image-scale,1.08)) translate(var(--hover-x,0px),var(--hover-y,0px));transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.future-hero .cinema-image>img{object-position:56% 42%}
.future-hero .cinema-shade{z-index:-2;background:linear-gradient(0deg,#04131dee 0%,#04131d80 25%,#092b3940 55%,#0626374d 80%,#05243266 100%),linear-gradient(90deg,#071d3960,transparent 70%);mix-blend-mode:multiply}
.future-hero:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(0deg,#04131deb,transparent 75%)}
.future-grain{position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 90% 15%,#83dace18,transparent 50%);box-shadow:inset 0 0 150px #07263722}
.future-top{position:absolute;top:42px;left:6%;right:6%;display:flex;justify-content:space-between;gap:35px;border-bottom:1px solid #eefaf85c;padding-bottom:23px;color:#f4ffff;z-index:3}
.future-top .eyebrow{font-size:10px;letter-spacing:1.9px;line-height:1.6}
.future-coordinate{position:absolute;top:17%;right:6%;color:#f0fffdd1;font-size:63px;font-weight:300;letter-spacing:-4px;line-height:1}
.future-coordinate>span{font-size:11px;letter-spacing:1px;margin-left:12px;vertical-align:middle;color:#d6e4e0}
.future-hero .cinema-copy{left:6%;right:6%;bottom:110px;transform:translateY(var(--text-drift,0px));pointer-events:none}
.future-hero .cinema-copy a{pointer-events:auto}
.future-hero .cinema-eyebrow{display:flex;align-items:center;gap:12px;font-size:10px;color:#dbf8ec;letter-spacing:2.3px;margin-bottom:25px}
.future-hero .cinema-eyebrow i{width:7px;height:7px;border-radius:50%;background:#cef99f;box-shadow:0 0 20px #daffc9}
.future-hero h2{font-size:clamp(85px,10.4vw,164px);font-weight:450;line-height:1.04;letter-spacing:-.065em;margin:0 0 42px;color:white;text-shadow:0 4px 40px #021d3330;max-width:100%}
.future-hero .image-word{width:fit-content;max-width:100%;display:block;transition:transform 1.1s cubic-bezier(.16,1,.3,1),color 1s,letter-spacing 1s}
.future-hero .image-word:nth-child(2){margin-left:11%;font-family:Georgia,serif;font-weight:400;letter-spacing:-.07em;color:#d5fac0;font-style:italic}
.future-hero:hover .image-word:first-child,.future-hero:focus-visible .image-word:first-child{transform:translateX(8px)}
.future-hero:hover .image-word:nth-child(2),.future-hero:focus-visible .image-word:nth-child(2){transform:translateX(18px);color:#e9ffdd}
.future-base{display:flex;justify-content:space-between;align-items:end;gap:50px;border-top:1px solid #e9fff638;padding-top:27px;color:#d4e6e7}
.future-base>p{max-width:415px;font-size:16px;line-height:1.7}
.future-link{display:flex;align-items:center;gap:28px;color:white;font-size:13px;flex-shrink:0}
.future-link>span:last-child{width:60px;height:60px;display:grid;place-items:center;border:1px solid #effff976;border-radius:50%;font-size:26px;transition:background .3s,transform .3s}
.future-link:hover>span:last-child{background:#c7eead;color:#113c49;transform:rotate(-40deg)}
.future-hero figcaption{left:6%;right:6%;bottom:25px;font-size:9px;letter-spacing:.15px;color:#9eb7c4}
.purpose-story{padding:88px 6% 100px}
.story-manifesto{position:relative;border-bottom:1px solid #244b5326;padding:0 100px 64px 0;color:#183c49}
.story-manifesto>.eyebrow{color:#548694;font-size:10px}
.story-manifesto>p{font-size:clamp(33px,4.3vw,65px);letter-spacing:-.04em;line-height:1.22;margin-top:25px}
.story-manifesto>p em{font-family:Georgia,serif;font-weight:400;color:#3b827d}
.story-mark{position:absolute;right:0;top:32px;font-size:90px;font-weight:200;color:#559493;line-height:1}
.purpose-grid{margin-top:65px}.purpose-story .vision-grid{margin-top:60px}
.is-so .future-hero h2{font-size:clamp(67px,7.6vw,117px);line-height:1.08}
.is-so .future-hero .image-word:nth-child(2){max-width:90%;margin-left:7%;font-size:.84em}
.is-so .future-base>p{max-width:465px}
.is-so .sphere-controls button{font-size:10px}
.service-item summary{display:grid;grid-template-columns:20px minmax(0,1fr) 20px;gap:14px}
.service-item summary h3{width:auto;margin:0;min-width:0}
.service-item summary .plus{margin:0;justify-self:end}
@media(max-width:1100px){
 .hero-art{inset:15px -7% 0 40%}.sphere-interface{bottom:2%}.sphere-controls{gap:6px}.sphere-controls button{font-size:10px;padding:10px 12px}
 .future-hero{min-height:800px}.future-hero h2{font-size:10.5vw}.future-hero .cinema-copy{bottom:104px}
 .future-base>p{font-size:15px;max-width:360px}.future-link{gap:15px}
 .is-so .future-hero h2{font-size:8.5vw}
}
@media(max-width:760px){
 .future-hero{min-height:780px;height:100svh}.future-top{top:30px;gap:28px}.future-top .eyebrow{font-size:9px;letter-spacing:1px}
 .future-top .eyebrow:last-child{max-width:170px;text-align:right}
 .future-coordinate{top:18%;font-size:49px}
 .future-hero h2{font-size:11.2vw;margin-bottom:28px}
 .future-hero .image-word:nth-child(2){margin-left:4%}
 .future-base{gap:25px}.future-base>p{font-size:14px}
 .future-link{font-size:12px;max-width:150px;gap:12px}
 .future-link>span:last-child{width:48px;height:48px;flex-shrink:0}
 .is-so .future-hero h2{font-size:8.8vw}
 .purpose-story{padding:65px 6% 75px}
 .story-manifesto{padding:0 60px 45px 0}.story-mark{font-size:55px;top:50px}.story-manifesto>p{font-size:36px}
}
@media(max-width:600px){
 .hero-art,.is-so .hero-art{position:relative;inset:auto;width:125%;height:410px;margin:0 -13% 7px -12%;order:1}
 .hero-art canvas{height:350px;top:-8px}
 .sphere-halo{top:39%;width:70%}
 .sphere-interface{bottom:0;gap:12px;width:91%}
 .sphere-interface .scene-caption{font-size:9px;letter-spacing:.3px}
 .sphere-controls button,.is-so .sphere-controls button{font-size:10px;padding:9px 12px;gap:6px}
 .label-one{top:8%;right:13%;font-size:7px}.label-two{bottom:28%;right:11%;font-size:7px}
 .hero-layout{margin-top:30px}
 .future-hero,.is-so .future-hero{height:100svh;min-height:760px;border-radius:0}
 .future-hero .cinema-image{inset:-4%}
 .future-hero .cinema-image>img{object-position:55% 35%}
 .future-hero .cinema-copy,.is-so .future-hero .cinema-copy{left:6%;right:6%;bottom:83px}
 .future-hero .cinema-eyebrow{font-size:8px;letter-spacing:1.5px;margin-bottom:20px}
 .future-top{top:30px;padding-bottom:18px}
 .future-top .eyebrow{font-size:8px;letter-spacing:1px}
 .future-top .eyebrow:last-child{max-width:130px}
 .future-coordinate{top:17%;font-size:38px;letter-spacing:-2px}
 .future-coordinate>span{font-size:9px;margin-left:8px}
 .future-hero h2{font-size:clamp(42px,12.4vw,70px);line-height:1.06;letter-spacing:-.06em;margin:0 0 27px}
 .future-hero .image-word:nth-child(2){margin-left:0;letter-spacing:-.07em;font-size:1.01em}
 .future-base{display:flex;align-items:start;flex-direction:column;gap:21px;padding-top:20px}
 .future-base>p{font-size:14px;line-height:1.7;max-width:100%}
 .future-link{max-width:none;gap:23px;font-size:12px}
 .future-link>span:last-child{width:40px;height:40px;font-size:22px}
 .future-hero figcaption{font-size:8px;line-height:1.6;bottom:22px}
 .future-hero:hover .image-word,.future-hero:focus-visible .image-word{transform:none}
 .is-so .future-hero h2{font-size:clamp(31px,9.7vw,53px);line-height:1.1}
 .is-so .future-hero .image-word:nth-child(2){max-width:100%;margin-left:0;font-size:1.06em}
 .is-so .future-base>p{font-size:14px}
 .purpose-story{padding:52px 6% 62px}
 .story-manifesto{padding-right:0;padding-bottom:35px}
 .story-manifesto>p{font-size:32px;margin-top:20px}
 .story-mark{position:static;font-size:44px;display:block;margin-top:20px}
 .purpose-story .purpose-grid{margin-top:37px}
 .purpose-story .vision-grid{margin-top:35px}
 .service-item summary{grid-template-columns:17px minmax(0,1fr) 18px;gap:10px}
}
@media(prefers-reduced-motion:reduce){.sphere-ripple .sphere-halo{animation:none}.future-hero .cinema-image,.future-hero .cinema-copy,.future-hero .image-word{transform:none!important;transition:none!important}}
body.motion-paused .sphere-halo{animation:none!important}

/* Institute history, stated alongside the institutional introduction. */
.purpose-heading .institute-founded{width:fit-content;max-width:100%;margin:24px 0 0;padding:10px 15px;border-left:3px solid #1684bb;border-radius:0 8px 8px 0;background:#e6eff4;color:#185779;font-size:14px;font-weight:600;line-height:1.5;letter-spacing:.02em}