@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#263748;background:#f4f6f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--accent:#5c82bb;--accent-soft:#456a9d;--ambient-color:#d9e8f4aa;--mono:'Manrope',sans-serif;--journey-progress:0}
*{box-sizing:border-box}
html{min-width:320px;scroll-behavior:smooth;scroll-padding-top:5vh;background:#f4f6f5}
body{margin:0;min-width:320px;min-height:100%;overflow-x:clip;background:#f4f6f5;color:#263748}
button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.experience{position:relative;isolation:isolate;min-height:100svh;overflow:clip;background:linear-gradient(145deg,#f8f8f5,#eef3f5 58%,#f5f4ef);--accent:#5c82bb}
.experience::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.12' d='M0 0h180v180H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.experience::after{content:"";position:fixed;inset:18px;z-index:8;pointer-events:none;border:1px solid rgba(55,82,110,.12);mask-image:linear-gradient(to bottom,#000,transparent 22%,transparent 78%,#000)}
.ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 70% 48%,var(--ambient-color),transparent 48%),radial-gradient(ellipse at 48% 100%,rgba(222,207,176,.28),transparent 50%);transition:background .8s}
.subject-scene{position:fixed;z-index:2;inset:0;width:100%;height:100%;opacity:0;transition:opacity .8s;pointer-events:none}.subject-scene.is-ready{opacity:1}.subject-scene.is-fallback{opacity:0}
.scene-fallback{position:fixed;z-index:2;top:46%;left:67%;width:min(44vw,520px);aspect-ratio:1;display:grid;place-items:center;transform:translate(-50%,-50%);opacity:0;pointer-events:none}.scene-fallback.is-visible{opacity:.72}.scene-fallback.is-hidden{display:none}.scene-fallback>span:last-child{font:400 clamp(130px,18vw,240px)/1 Georgia,serif;color:var(--accent);text-shadow:0 10px 35px #476d9a33}
.fallback-ring,.fallback-ring::before,.fallback-ring::after{position:absolute;width:70%;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--accent) 52%,#fff);border-radius:50%;transform:rotateX(68deg) rotateZ(-25deg);box-shadow:0 0 30px color-mix(in srgb,var(--accent) 13%,transparent)}.fallback-ring::before,.fallback-ring::after{content:"";inset:11%;width:auto;transform:rotateZ(65deg)}.fallback-ring::after{inset:22%;transform:rotateZ(-66deg)}
.noise-transition{position:fixed;z-index:6;inset:-15%;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 56% 46%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 63%);filter:url(#radialNoise) blur(20px);transform:scale(.6);transition:opacity .45s,transform .9s cubic-bezier(.2,.7,.2,1)}.noise-transition.is-active{opacity:.34;transform:scale(1.25)}.scene-vignette{position:fixed;z-index:3;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(247,248,245,.34),transparent 32%,transparent 70%,rgba(247,248,245,.22)),linear-gradient(0deg,rgba(244,246,243,.18),transparent 25%,transparent 74%,rgba(244,246,243,.18))}
#page-content{position:relative;z-index:2}.hero-section{position:relative;height:135svh;min-height:900px;touch-action:pan-y}.hero-pin{position:sticky;z-index:4;top:0;height:100svh;min-height:640px;overflow:hidden}
.topbar{position:absolute;z-index:5;top:0;left:0;right:0;height:102px;padding:0 5.15%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(55,82,110,.13);transition:opacity .3s,transform .4s;opacity:calc(1 - var(--journey-progress)*1.45);transform:translateY(calc(var(--journey-progress)*-24px))}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{height:28px;width:25px;display:flex;align-items:flex-end;justify-content:center;gap:3px;transform:skew(-24deg)}.brand-mark i{display:block;width:5px;border-radius:2px;background:#4d6682;box-shadow:0 0 12px rgba(80,111,146,.15)}.brand-mark i:nth-child(1){height:14px}.brand-mark i:nth-child(2){height:23px}.brand-mark i:nth-child(3){height:18px}.brand-words{display:grid;gap:1px;letter-spacing:.14em}.brand-words strong{font:700 13px var(--mono);color:#293a4c}.brand-words small{font:600 10px var(--mono);letter-spacing:.23em;color:#627386}.top-note,.top-link{font:600 11px var(--mono);letter-spacing:.12em;color:#586a7c}.top-note{display:flex;align-items:center;gap:10px}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 44%,transparent)}.top-link i{font-style:normal;color:var(--accent);padding:0 8px}
.hero-copy{position:absolute;z-index:3;left:8%;top:25.5%;width:min(480px,40vw);opacity:calc(1 - var(--journey-progress)*1.4);transform:translateY(calc(var(--journey-progress)*-42px));transition:opacity .18s linear}.hero-copy::before{content:"";position:absolute;z-index:-1;inset:-28px -42px -28px -24px;background:radial-gradient(ellipse at 34% 50%,rgba(248,249,246,.98),rgba(248,249,246,.89) 57%,transparent);pointer-events:none}
.eyebrow{margin:0;display:flex;align-items:center;gap:12px;color:#627386;font:600 11px var(--mono);letter-spacing:.17em}.eyebrow-line{width:30px;height:2px;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 28%,transparent)}.subject-overline{margin:40px 0 10px;color:var(--accent);font:700 12px var(--mono);letter-spacing:.14em}.hero-copy h1{max-width:580px;margin:0 0 11px;font:700 clamp(48px,6.2vw,88px)/.98 Manrope,sans-serif;letter-spacing:-.068em;color:#263748}.editorial{margin:20px 0 7px;color:#344b61;font:600 clamp(20px,2vw,27px)/1.35 Manrope,sans-serif;letter-spacing:-.03em}.description{max-width:420px;margin:0;color:#526579;font-size:16px;line-height:1.75}
.stage-caption{position:absolute;z-index:3;right:10.8%;top:28%;display:flex;align-items:center;gap:13px;color:#65778a;font:600 10px var(--mono);letter-spacing:.14em;transition:opacity .25s;opacity:calc(1 - var(--journey-progress)*1.6)}.caption-rule{width:31px;height:2px;background:rgba(83,112,144,.48)}.scene-counter{position:absolute;z-index:3;right:7%;bottom:26%;display:flex;align-items:center;gap:11px;color:#65778a;font:600 12px var(--mono);letter-spacing:.13em;opacity:calc(1 - var(--journey-progress)*1.7)}.scene-counter #subject-count{color:var(--accent);font-size:15px}.scene-counter i{width:24px;height:2px;background:#9cabb8}
.hero-controls{position:absolute;z-index:5;bottom:11.1%;left:50%;display:flex;align-items:center;gap:25px;transform:translateX(-50%);opacity:calc(1 - var(--journey-progress)*1.85);transition:opacity .2s}.hero-controls.single-subject{display:none}.hero-controls[hidden],.drag-hint[hidden]{display:none}.round-control{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(60,83,108,.26);border-radius:50%;background:rgba(255,255,255,.66);color:#48627c;font-size:17px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}.round-control:hover{background:var(--accent);border-color:var(--accent);color:#fff}.subject-menu{display:flex;align-items:center;gap:17px}.subject-choice{position:relative;padding:8px 0;display:flex;align-items:center;gap:7px;border:0;background:none;color:#647487;cursor:pointer;transition:color .25s}.subject-choice:disabled,.round-control:disabled{opacity:0;pointer-events:none}.choice-index{font:600 9px var(--mono);letter-spacing:.05em;opacity:.75}.choice-name{font:600 11px var(--mono);letter-spacing:.045em}.choice-dot{position:absolute;left:50%;bottom:-5px;width:4px;height:4px;border-radius:50%;background:var(--accent);opacity:0;transform:translateX(-50%) scale(.5);transition:opacity .2s,transform .2s}.subject-choice:hover,.subject-choice.is-selected{color:#283c53}.subject-choice.is-selected .choice-index{color:var(--accent);opacity:1}.subject-choice.is-selected .choice-dot{opacity:1;transform:translateX(-50%) scale(1);box-shadow:0 0 10px var(--accent)}
.scroll-cue{position:absolute;z-index:4;left:8%;bottom:10.7%;display:flex;align-items:center;gap:12px;color:#586c81;font:600 11px var(--mono);letter-spacing:.045em;opacity:calc(1 - var(--journey-progress)*1.2);transition:opacity .2s}.scroll-cue i{font:400 20px sans-serif;color:var(--accent);font-style:normal;animation:nudge 1.6s ease-in-out infinite}@keyframes nudge{0%,100%{transform:translateY(-2px);opacity:.65}50%{transform:translateY(4px);opacity:1}}.drag-hint{position:absolute;z-index:4;right:8%;bottom:4%;margin:0;display:flex;align-items:center;gap:9px;color:#748496;font:600 10px var(--mono);letter-spacing:.12em;white-space:nowrap;opacity:calc(1 - var(--journey-progress)*1.7)}.drag-icon{color:var(--accent);font:400 17px sans-serif}.corner-mark{position:absolute;width:13px;height:13px;border-color:rgba(74,101,132,.45);border-style:solid;opacity:.7}.corner-mark-a{left:4%;top:17%;border-width:1px 0 0 1px}.corner-mark-b{right:4%;top:17%;border-width:1px 1px 0 0}
.teacher-journey{position:relative;z-index:3;margin-top:-59svh;padding:clamp(130px,13vh,162px) max(8%,calc((100vw - 1250px)/2)) 0;background:linear-gradient(180deg,rgba(248,249,246,.08),rgba(246,248,246,.88) 11%,#f8f9f6 29%,#f8f9f6 100%);min-height:100vh}.journey-heading{max-width:760px;margin:0 auto clamp(44px,7vh,74px);text-align:center;transform:translateY(calc((1 - var(--journey-progress))*32px));opacity:calc(.78 + var(--journey-progress)*.22)}.journey-heading .eyebrow{justify-content:center;color:#64778b}.journey-heading h2{margin:24px 0 14px;font:600 clamp(38px,5.1vw,66px)/1.08 Manrope,sans-serif;letter-spacing:-.055em;color:#2b4055}.journey-heading h2 span{color:var(--accent);transition:color .5s}.journey-intro{max-width:600px;margin:0 auto;color:#617387;font-size:16px;line-height:1.8}
.teacher-profiles{display:grid;gap:clamp(82px,12vh,142px);max-width:1340px;margin:0 auto}.teacher-profile{position:relative;display:grid;grid-template-columns:minmax(300px,.92fr) minmax(360px,1.08fr);align-items:center;gap:clamp(58px,9vw,150px);min-height:500px;opacity:0;transform:translateY(36px);transition:opacity .75s ease,transform .9s cubic-bezier(.2,.7,.2,1);scroll-margin-top:12vh;content-visibility:visible;contain-intrinsic-size:auto 650px}.teacher-profile.is-visible{opacity:1;transform:none}.profile-reverse .profile-portrait{order:2}.profile-reverse .profile-copy{order:1}
.profile-portrait{position:relative;justify-self:center;width:min(100%,490px);height:clamp(380px,43vw,500px);overflow:hidden;background:linear-gradient(145deg,#e6edf2,#dbe4e8);border:1px solid rgba(72,98,126,.18);border-radius:8px;box-shadow:0 28px 80px rgba(51,72,93,.14)}.profile-portrait::before{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 72%,rgba(33,49,67,.12)),linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,transparent),transparent 55%)}.profile-portrait::after{content:"";position:absolute;left:50%;top:46%;width:74%;aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:50%;opacity:.33;pointer-events:none}.profile-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 28%;filter:saturate(.78) contrast(1.02)}.portrait-number{position:absolute;z-index:2;right:20px;bottom:17px;color:#fff;text-shadow:0 1px 8px #182838;font:600 11px var(--mono);letter-spacing:.12em}
.profile-copy{position:relative;max-width:620px;padding:28px 0}.profile-overline{margin:0 0 16px;color:var(--accent);font:700 11px var(--mono);letter-spacing:.14em}.profile-copy h3{margin:0;color:#2b4055;font:700 clamp(40px,4.7vw,64px)/1.04 Manrope,sans-serif;letter-spacing:-.055em}.profile-introduction{max-width:560px;margin:19px 0 29px;color:#50657a;font-size:17px;line-height:1.78}.profile-approach{padding:20px 0 22px;border-top:1px solid rgba(72,98,126,.18)}.profile-approach h4,.profile-fact h4{margin:0 0 10px;color:#718396;font:700 10px var(--mono);letter-spacing:.13em;text-transform:uppercase}.profile-approach p,.profile-fact p{margin:0;color:#41576d;font-size:15px;line-height:1.8}
.profile-facts{display:grid;grid-template-columns:1fr 1fr;gap:23px 30px;padding:21px 0 24px;border-top:1px solid rgba(72,98,126,.17);border-bottom:1px solid rgba(72,98,126,.17)}.profile-fact ul{display:flex;flex-wrap:wrap;gap:7px 15px;list-style:none;margin:0;padding:0}.profile-fact li{color:#41576d;font-size:14px;line-height:1.7}
.profile-contact{padding-top:22px}.contact-phone{margin:0 0 12px;color:#2b4055;font:700 17px var(--mono);letter-spacing:.035em}.contact-actions{display:flex;flex-wrap:wrap;gap:11px}.contact-button{min-height:48px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(60,83,108,.26);border-radius:4px;background:rgba(255,255,255,.58);color:#344d67;text-decoration:none;font:600 12px var(--mono);letter-spacing:.01em;transition:background .2s,border-color .2s,color .2s,opacity .2s}.contact-button:hover{border-color:var(--accent);background:var(--accent);color:white}.contact-button[aria-disabled=true]{border-style:dashed;color:#8190a0;background:#f4f6f4;cursor:default;opacity:1}.contact-icon{color:var(--accent);font-size:15px}.contact-button:hover .contact-icon{color:white}.contact-unavailable{margin:11px 0 0;color:#718296;font-size:13px}.profile-stamp{margin:26px 0 0;color:#8290a0;font:600 9px var(--mono);letter-spacing:.13em}.empty-profiles{padding:60px 0;color:#596d82;text-align:center}
.page-footer{position:relative;z-index:2;max-width:1340px;margin:clamp(100px,14vh,155px) auto 0;padding:22px 0 max(28px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;border-top:1px solid rgba(72,98,126,.18);color:#687b8f;font:600 10px var(--mono);letter-spacing:.12em}.page-footer a{text-decoration:none}.page-footer a span{padding-left:7px;color:var(--accent)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:1100px) and (min-width:701px){.hero-copy{left:6%;width:40vw}.teacher-journey{padding-inline:6%}.teacher-profile{grid-template-columns:minmax(260px,.9fr) minmax(330px,1.1fr);gap:5vw}.profile-portrait{height:clamp(390px,56vw,580px)}.profile-copy h3{font-size:clamp(36px,4.8vw,54px)}.profile-facts{gap:18px 20px}}
@media(max-width:900px) and (min-width:701px){.hero-copy{width:min(40vw,360px)}.scroll-cue{bottom:19%}}
@media(max-height:760px) and (min-width:701px){.hero-section{min-height:900px}.hero-pin{min-height:560px}.topbar{height:76px}.hero-copy{top:21%}.subject-overline{margin-top:26px}.scroll-cue{bottom:9%}.teacher-journey{padding-top:170px}.teacher-profile{min-height:490px}.profile-portrait{height:min(62svh,510px)}}
@media(max-width:700px){html{scroll-padding-top:2vh}.experience::after{inset:9px;border-color:rgba(72,98,126,.09)}.hero-section{height:137svh;min-height:900px;touch-action:pan-y}.hero-pin{min-height:600px}.topbar{height:72px;padding:0 6%;border-bottom-color:rgba(55,82,110,.12)}.brand{gap:9px}.brand-mark{transform:scale(.86) skew(-24deg);transform-origin:left center}.brand-words strong{font-size:11px}.brand-words small{font-size:9px}.top-note{max-width:130px;font-size:9px;letter-spacing:.045em;line-height:1.4;text-align:center}.status-dot{width:6px;height:6px;flex:none}.top-link{font-size:8px;letter-spacing:.045em;white-space:nowrap}.top-link i{padding:0 3px}.hero-copy{top:auto;bottom:clamp(150px,20vh,190px);left:8%;width:84%}.hero-copy::before{inset:-19px -20px -18px -14px;background:radial-gradient(ellipse at 30% 52%,rgba(248,249,246,.98),rgba(248,249,246,.91) 62%,transparent)}.hero-copy .eyebrow{font-size:10px}.subject-overline{margin:20px 0 8px;font-size:10px}.hero-copy h1{max-width:100%;font-size:clamp(43px,12.6vw,62px);letter-spacing:-.075em}.editorial{margin:10px 0 4px;font-size:19px}.description{max-width:340px;font-size:14px;line-height:1.62}.stage-caption{top:11%;right:8%;max-width:190px;font-size:9px;letter-spacing:.06em;text-align:right;line-height:1.7}.caption-rule{width:18px;flex:none}.scene-counter{right:7%;top:43%;bottom:auto;font-size:10px;gap:7px}.scene-counter i{width:15px}.scene-counter #subject-count{font-size:12px}.scroll-cue{left:8%;bottom:8.4%;gap:8px;max-width:84%;font-size:10px;line-height:1.4}.scroll-cue i{font-size:18px}.drag-hint{right:7%;bottom:3.3%;font-size:8px;letter-spacing:.04em}.drag-icon{font-size:15px}.corner-mark-a,.corner-mark-b{top:8%}.teacher-journey{margin-top:-50svh;padding:15vh 7% 0;background:linear-gradient(180deg,rgba(248,249,246,.12),rgba(248,249,246,.94) 12%,#f8f9f6 30%,#f8f9f6)}.journey-heading{margin-bottom:50px}.journey-heading .eyebrow{font-size:9px;letter-spacing:.09em}.journey-heading h2{margin:18px 0 12px;font-size:clamp(34px,9vw,46px)}.journey-intro{max-width:380px;font-size:14px;line-height:1.72}.teacher-profiles{gap:75px}.teacher-profile{grid-template-columns:1fr;gap:20px;min-height:0;scroll-margin-top:9vh;content-visibility:visible;contain-intrinsic-size:auto}.profile-reverse .profile-portrait,.profile-reverse .profile-copy{order:initial}.profile-portrait{justify-self:stretch;width:100%;height:clamp(260px,72vw,370px);max-height:370px}.profile-portrait img{object-position:center 28%}.profile-copy{padding:4px 0 0}.profile-overline{margin-bottom:10px;font-size:10px}.profile-copy h3{font-size:clamp(38px,10vw,50px)}.profile-introduction{margin:13px 0 20px;font-size:15px;line-height:1.72}.profile-approach{padding:15px 0 17px}.profile-approach h4,.profile-fact h4{font-size:9px}.profile-approach p,.profile-fact p{font-size:14px;line-height:1.75}.profile-facts{gap:16px 13px;padding:17px 0 19px}.profile-fact li{font-size:13px}.profile-contact{padding-top:16px}.contact-phone{font-size:16px}.contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.contact-button{min-height:48px;padding:0 8px;gap:6px;font-size:10px;text-align:center}.contact-icon{font-size:13px}.contact-unavailable{font-size:12px}.profile-stamp{margin-top:20px;font-size:8px}.page-footer{margin-top:95px;padding-top:17px;font-size:8px}.scene-fallback{top:37%;left:54%;width:min(88vw,420px)}}
@media(max-width:380px){.top-note{max-width:106px;font-size:8px}.brand{gap:6px}.brand-mark{width:22px}.brand-words strong{font-size:10px}.brand-words small{font-size:8px}.top-link{font-size:7px}.hero-copy h1{font-size:41px}.scroll-cue{font-size:9px}.profile-facts{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.noise-transition{display:none}.scroll-cue i{animation:none}.teacher-profile{opacity:1;transform:none}}
