:root{--p-night:#15091f;--p-plum:#321743;--p-cream:#fff9f1;--p-paper:#f1e4d0;--p-pink:#f34e9a;--p-gold:#f5b942;--p-blue:#50aee8;--p-ink:#241537}.professorPage{overflow-x:hidden;background:var(--p-night)}.professorPage main{background:var(--p-night)}.professorPage a:focus-visible,.professorPage button:focus-visible,.professorPage figure[tabindex]:focus-visible{outline:4px solid var(--p-blue);outline-offset:6px}
.professorHero{position:relative;min-height:900px;padding:clamp(80px,8vw,125px) clamp(24px,7vw,112px);display:grid;grid-template-columns:minmax(0,.66fr) minmax(570px,1.34fr);gap:clamp(35px,5vw,80px);align-items:center;overflow:hidden;color:var(--p-cream);background:radial-gradient(circle at 78% 42%,rgba(243,78,154,.27),transparent 29%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),var(--p-night);background-size:auto,38px 38px,38px 38px,auto}.professorHero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:18px;border-block:5px solid #08030c;background:repeating-linear-gradient(90deg,var(--p-pink) 0 44px,var(--p-gold) 44px 88px,var(--p-blue) 88px 132px)}.heroCopy{position:relative;z-index:3}.roomPlate{width:fit-content;margin:0 0 28px;padding:10px 13px;color:var(--p-ink);background:var(--p-gold);box-shadow:7px 7px 0 var(--p-pink);font:900 10px/1 monospace;letter-spacing:.14em;text-transform:uppercase;transform:rotate(-1deg)}.heroCopy h1{margin:0;font:700 clamp(68px,8.6vw,132px)/.79 Georgia,serif;letter-spacing:-.075em}.heroCopy h1 em{display:block;margin-top:18px;color:var(--p-pink);font-size:.74em;font-weight:400}.heroCopy>p:last-child{max-width:650px;margin:38px 0 0;color:#dfd4e4;font-size:clamp(19px,1.7vw,24px);line-height:1.58}.heroProfessor{position:relative;z-index:2;min-height:690px;margin:0;display:grid;place-items:center;isolation:isolate;outline:none}.heroProfessor:before{content:"";position:absolute;z-index:-1;width:min(47vw,650px);height:min(47vw,650px);border:4px dashed var(--p-blue);border-radius:50%;background:conic-gradient(from 30deg,rgba(243,78,154,.34),rgba(245,185,66,.08),rgba(80,174,232,.35),rgba(243,78,154,.34));box-shadow:0 0 65px rgba(80,174,232,.25);animation:professor-spin 25s linear infinite}.heroProfessor img{position:relative;z-index:2;width:100%;height:690px;object-fit:contain;filter:drop-shadow(16px 20px 0 rgba(0,0,0,.38));transition:transform .35s cubic-bezier(.16,.9,.25,1.3),filter .3s ease}.heroProfessor figcaption{position:absolute;z-index:5;left:2%;bottom:5%;padding:13px 16px;border:5px solid #08030c;color:var(--p-ink);background:var(--p-gold);box-shadow:9px 9px 0 var(--p-pink);font:900 9px/1 monospace;letter-spacing:.13em;transform:rotate(-2deg)}.heroOrbit{position:absolute;z-index:4;inset:0;pointer-events:none}.heroOrbit i{position:absolute;left:50%;top:50%;font-style:normal;font-size:clamp(30px,3vw,50px);opacity:0;filter:drop-shadow(0 0 8px #fff) drop-shadow(0 0 15px var(--p-pink));transform:translate(-50%,-50%) scale(.2)}.heroOrbit i:nth-child(1){--x:-46%;--y:-42%}.heroOrbit i:nth-child(2){--x:44%;--y:-42%}.heroOrbit i:nth-child(3){--x:-48%;--y:34%}.heroOrbit i:nth-child(4){--x:47%;--y:35%}.heroOrbit i:nth-child(5){--x:0%;--y:-49%}.heroOrbit i:nth-child(6){--x:0%;--y:46%}.heroProfessor:hover img,.heroProfessor:focus-visible img{transform:scale(1.055) rotate(-1deg);filter:drop-shadow(0 0 24px #fff) drop-shadow(0 0 48px var(--p-pink))}.heroProfessor:hover .heroOrbit i,.heroProfessor:focus-visible .heroOrbit i{animation:hero-pop .72s cubic-bezier(.16,.9,.25,1.3) both}
.professorDoes>header p,.licenseCopy>p,.learningExit>div>p{margin:0 0 15px;font:900 10px/1 monospace;letter-spacing:.15em;text-transform:uppercase}.professorDoes h2,.licenseBoundary h2,.learningExit h2{margin:0;font:700 clamp(49px,6vw,86px)/.88 Georgia,serif;letter-spacing:-.06em}.licenseCopy>span{display:block;margin-top:28px;font-size:18px;line-height:1.68}
.professorDoes{padding:clamp(90px,10vw,150px) clamp(24px,7vw,112px);color:var(--p-cream);background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),#241130;background-size:34px 34px}.professorDoes>header{max-width:1200px;margin-bottom:58px}.professorDoes>header p{color:var(--p-gold)}.doesConsole{border:9px solid #08030c;background:#4a295b;box-shadow:18px 22px 0 rgba(0,0,0,.35)}.doesControls{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:12px;border-bottom:8px solid #08030c}.doesControl{position:relative;min-height:105px;padding:17px 62px 17px 80px;display:flex;align-items:center;border:4px solid #08030c;border-left:11px solid var(--p-pink);color:var(--p-cream);background:#170a20;font:700 21px/1.12 Georgia,serif;text-align:left;cursor:pointer;transition:transform .2s cubic-bezier(.16,.9,.25,1.3),background .2s ease,box-shadow .2s ease}.doesControl:nth-child(even){border-left-color:var(--p-gold)}.doesControl:nth-child(3){border-left-color:var(--p-blue)}.doesControl>i{position:absolute;left:23px;font:900 36px/1 Georgia,serif;color:var(--p-gold)}.doesControl span{display:grid;gap:5px}.doesControl strong{font:inherit}.doesControl small{color:#d8cadd;font:700 12px/1.25 monospace;letter-spacing:.03em}.doesControl>b{position:absolute;right:17px;bottom:13px;color:#9d8ca7;font:900 9px/1 monospace}.doesControl:hover,.doesControl:focus-visible,.doesControl.active{z-index:2;background:#69397d;transform:translateY(-7px) rotate(.2deg);box-shadow:10px 10px 0 var(--p-pink)}.doesControl:nth-child(even):hover,.doesControl:nth-child(even):focus-visible,.doesControl:nth-child(even).active{box-shadow:10px 10px 0 var(--p-gold)}.doesControlStop{grid-column:1/-1;border-left-color:var(--p-pink);background:#351324}.doesControlStop>i{color:var(--p-pink)}.doesControlStop:hover,.doesControlStop:focus-visible,.doesControlStop.active{background:#6b203f;box-shadow:10px 10px 0 var(--p-pink)}.doesStage{position:relative;min-height:760px;margin:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 48%,rgba(80,174,232,.3),transparent 28%),#100617}.doesStage:before{content:"";position:absolute;width:min(72%,760px);aspect-ratio:1;border:3px dashed var(--p-blue);border-radius:50%;animation:professor-spin 20s linear infinite}.doesStage img{position:relative;z-index:2;width:100%;height:690px;object-fit:contain;filter:drop-shadow(13px 17px 0 rgba(0,0,0,.34))}.doesStage figcaption{position:absolute;z-index:5;left:24px;right:24px;bottom:22px;padding:16px;border:5px solid #08030c;color:var(--p-ink);background:var(--p-gold);box-shadow:9px 9px 0 var(--p-pink);font:900 10px/1 monospace;letter-spacing:.13em;text-align:center}.doesStage.changing img{animation:stage-arrive .5s cubic-bezier(.16,.9,.25,1.25)}.stageBurst{position:absolute;z-index:4;inset:0;pointer-events:none}.stageBurst i{position:absolute;left:50%;top:50%;font-style:normal;font-size:40px;opacity:0}.stageBurst i:nth-child(1){--sx:-220px;--sy:-210px}.stageBurst i:nth-child(2){--sx:220px;--sy:-210px}.stageBurst i:nth-child(3){--sx:-245px;--sy:170px}.stageBurst i:nth-child(4){--sx:245px;--sy:175px}.stageBurst i:nth-child(5){--sx:0px;--sy:-270px}.stageBurst i:nth-child(6){--sx:0px;--sy:255px}.doesStage.changing .stageBurst i{animation:stage-pop .78s cubic-bezier(.16,.9,.25,1.3) both}
.licenseBoundary{padding:clamp(90px,9vw,140px) clamp(24px,7vw,112px);display:grid;grid-template-columns:minmax(390px,.72fr) minmax(590px,1.28fr);gap:clamp(55px,8vw,120px);align-items:center;color:var(--p-ink);border-block:9px solid #08030c;background:var(--p-gold)}.licenseCopy>a{display:inline-block;margin-top:32px;color:var(--p-ink);font-weight:900;text-decoration-thickness:4px;text-underline-offset:7px}.licenseBoundary figure{position:relative;min-height:570px;margin:0;display:grid;place-items:center;border:9px solid #08030c;background:#23102e;box-shadow:16px 19px 0 var(--p-pink)}.licenseBoundary figure img{width:100%;height:550px;object-fit:contain}.licenseBoundary figcaption{position:absolute;left:20px;right:20px;bottom:20px;padding:13px;display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;border:4px solid #08030c;background:var(--p-cream);font:900 8px/1 monospace;letter-spacing:.11em;text-align:center}.licenseBoundary figcaption b{padding:8px;color:var(--p-cream);background:var(--p-ink)}
.learningExit{padding:clamp(85px,9vw,135px) clamp(24px,7vw,112px);display:grid;grid-template-columns:minmax(450px,.85fr) minmax(480px,1.15fr);gap:clamp(55px,8vw,120px);align-items:center;color:var(--p-cream);background:radial-gradient(circle at 25% 50%,rgba(80,174,232,.28),transparent 25%),#21102c}.learningExit figure{position:relative;min-height:560px;margin:0;display:grid;place-items:center}.learningExit figure img{position:relative;z-index:2;width:100%;height:550px;object-fit:contain;filter:drop-shadow(13px 17px 0 rgba(0,0,0,.3))}.exitSpark{position:absolute;color:var(--p-gold);font-size:42px;letter-spacing:.7em;transform:rotate(-8deg)}.learningExit>div>p{color:var(--p-gold)}.learningExit a{min-height:190px;margin-top:36px;padding:30px;display:flex;flex-direction:column;justify-content:space-between;border:8px solid #08030c;color:var(--p-cream);background:var(--p-pink);box-shadow:14px 16px 0 var(--p-gold);text-decoration:none;transform:rotate(1deg);transition:transform .25s cubic-bezier(.16,.9,.25,1.3)}.learningExit a:hover,.learningExit a:focus-visible{transform:rotate(-2deg) scale(1.04)}.learningExit a span{font:700 31px/1 Georgia,serif}.learningExit a b{color:var(--p-ink);font:900 10px/1 monospace;letter-spacing:.12em}
@keyframes professor-spin{to{transform:rotate(1turn)}}@keyframes hero-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}65%{opacity:1}100%{opacity:1;left:calc(50% + var(--x));top:calc(50% + var(--y));transform:translate(-50%,-50%) scale(1)}}@keyframes stage-arrive{0%{opacity:.15;transform:translateY(20px) scale(.85) rotate(-2deg)}100%{opacity:1;transform:none}}@keyframes stage-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}60%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--sx)),calc(-50% + var(--sy))) scale(1)}}
@media(max-width:1100px){.professorHero,.licenseBoundary,.learningExit{grid-template-columns:1fr}.heroProfessor{min-height:620px}.licenseBoundary figure{order:2}}
@media(max-width:700px){.professorHero,.professorDoes,.licenseBoundary,.learningExit{padding-left:20px;padding-right:20px}.professorHero{min-height:auto;padding-top:80px}.heroCopy h1{font-size:clamp(66px,21vw,96px)}.heroProfessor{min-height:480px}.heroProfessor img{height:470px}.heroProfessor:before{width:420px;height:420px}.professorDoes h2,.licenseBoundary h2,.learningExit h2{font-size:clamp(47px,14vw,68px)}.doesControls{grid-template-columns:1fr;padding:13px}.doesControlStop{grid-column:auto}.doesControl{padding-left:70px;font-size:18px}.doesStage{min-height:540px}.doesStage img{height:490px}.licenseBoundary figure{min-height:450px}.licenseBoundary figure img{height:430px}.licenseBoundary figcaption{grid-template-columns:1fr}.learningExit figure{min-height:430px}.learningExit figure img{height:420px}}
@media(prefers-reduced-motion:reduce){.heroProfessor:before,.doesStage:before,.heroProfessor:hover .heroOrbit i,.heroProfessor:focus-visible .heroOrbit i,.doesStage.changing img,.doesStage.changing .stageBurst i{animation:none}.heroProfessor img,.doesControl,.learningExit a{transition:none}.heroOrbit i,.stageBurst i{display:none}}
