.hero-line{display:block;overflow:clip;padding-bottom:.07em;margin-bottom:-.07em}.hero-line>span{display:inline-block}.scroll-progress{position:fixed;z-index:30;inset:0 0 auto;height:3px;pointer-events:none;background:#244de8;transform:scaleX(var(--progress,0));transform-origin:left}.pointer-halo{display:none;position:fixed;top:0;left:0;width:0;height:0;pointer-events:none;z-index:40}.pointer-halo:after{content:'';position:absolute;width:34px;height:34px;border:1px solid var(--blue);border-radius:50%;transform:translate(-50%,-50%);opacity:0;transition:width .2s,height .2s,opacity .2s}.pointer-halo.visible:after{opacity:.55}.pointer-halo.over-link:after{width:57px;height:57px;background:color-mix(in srgb,var(--blue) 6%,transparent)}.motion-ticker{overflow:hidden;background:var(--blue);color:var(--paper);padding:17px 0;margin-top:30px}.ticker-track{display:flex;width:max-content}.ticker-copy{display:flex;flex-shrink:0;align-items:center;gap:28px;padding-right:28px;font-family:var(--display);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.ticker-copy i{font-family:var(--serif);font-style:normal;font-size:24px;line-height:1}.motion-tilt{transform:perspective(1100px) translateY(var(--parallax,0px)) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s cubic-bezier(.2,.8,.2,1)}.motion-magnetic{transform:translate3d(var(--magnet-x,0px),var(--magnet-y,0px),0);transition:transform .25s cubic-bezier(.16,1,.3,1)}.motion-magnetic:hover{transform:translate3d(var(--magnet-x,0px),calc(var(--magnet-y,0px) - 3px),0)}.footer>div{flex-wrap:wrap;column-gap:20px}.footer #motion-toggle{min-width:80px}.footer #motion-toggle:disabled{cursor:default}.footer button{font-variant-numeric:tabular-nums}
html[data-motion="full"] .ticker-track{animation:ticker-drift 24s linear infinite}html[data-motion="full"] .ticker-copy i{animation:star-turn 9s linear infinite}html[data-motion="full"] .dot{animation:signal-pulse 3s ease-in-out infinite}html[data-motion="full"] .small-star{animation:star-turn 15s linear infinite}html[data-motion="full"] .monitor-body svg path{stroke-dasharray:600;stroke-dashoffset:600;animation:trace-signal 4s cubic-bezier(.2,.7,.4,1) infinite}html[data-motion="full"] .monitor-window{animation:monitor-float 7s ease-in-out infinite}html[data-motion="full"] .prism-art{animation:prism-float 8s ease-in-out infinite}html[data-motion="full"] .beam-out{animation:beam-glow 3.5s ease-in-out infinite}html[data-motion="full"] .beam-two{animation-delay:.3s}html[data-motion="full"] .beam-three{animation-delay:.6s}html[data-motion="full"] .beam-four{animation-delay:.9s}html[data-motion="full"] .voice-card{animation:voice-float 7s ease-in-out infinite}html[data-motion="full"] .voice-orbit{animation:orbit-breathe 9s ease-in-out infinite}html[data-motion="full"] .orbit-two{animation-delay:-4s}html[data-motion="full"] .about-mark i{animation:star-turn 18s linear infinite}html[data-motion="full"] .sculpture-wrap:before{animation:scene-orbit 24s linear infinite}html[data-motion="full"] .scene-coordinate-top{animation:coordinate-drift 6s ease-in-out infinite}
html[data-motion="paused"] *,html[data-motion="paused"] *:before,html[data-motion="paused"] *:after{animation-play-state:paused!important}html[data-motion="paused"] .motion-tilt,html[data-motion="paused"] .motion-magnetic{transform:none;transition:none}html[data-motion="paused"] .pointer-halo{display:none}.text-link span{transition:transform .25s cubic-bezier(.16,1,.3,1)}html[data-motion="full"] .text-link:hover span{transform:translate(3px,-3px)}.credential{transition:background .25s}.credential:hover{background:color-mix(in srgb,var(--blue) 3%,transparent)}.issuer-mark{transition:transform .3s cubic-bezier(.16,1,.3,1)}html[data-motion="full"] .credential:hover .issuer-mark{transform:rotate(-8deg) scale(1.08)}
@keyframes ticker-drift{to{transform:translateX(-50%)}}@keyframes star-turn{to{transform:rotate(360deg)}}@keyframes signal-pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 color-mix(in srgb,var(--blue) 20%,transparent)}50%{opacity:.65;box-shadow:0 0 0 5px transparent}}@keyframes trace-signal{0%{stroke-dashoffset:600;opacity:.25}40%,75%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-600;opacity:.25}}@keyframes monitor-float{0%,100%{transform:perspective(950px) rotateY(-9deg) rotateX(9deg) translateY(0)}50%{transform:perspective(950px) rotateY(-3deg) rotateX(4deg) translateY(-8px)}}@keyframes prism-float{0%,100%{transform:rotate(-15deg) translateY(0)}50%{transform:rotate(-11deg) translateY(-10px)}}@keyframes beam-glow{0%,100%{opacity:.45}50%{opacity:1}}@keyframes voice-float{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(1deg) translateY(-7px)}}@keyframes orbit-breathe{0%,100%{transform:scale(1);opacity:.75}50%{transform:scale(1.12);opacity:.4}}@keyframes scene-orbit{0%{transform:rotate(-30deg) scaleY(.78)}50%{transform:rotate(0deg) scaleY(.9)}100%{transform:rotate(-30deg) scaleY(.78)}}@keyframes coordinate-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.footer #motion-toggle{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:31;min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:25px;background:var(--paper);color:var(--ink);box-shadow:0 4px 18px #00000012;font-size:11px}
@media(min-width:900px){.motion-ticker{margin-top:38px;padding-block:21px}.ticker-copy{font-size:14px;gap:42px;padding-right:42px}.footer>div{column-gap:22px}}
@media(hover:hover) and (pointer:fine){html[data-motion="full"] .pointer-halo{display:block}}
@media(prefers-reduced-motion:reduce){.motion-ticker .ticker-track{animation:none!important}.motion-tilt,.motion-magnetic,.motion-magnetic:hover{transform:none!important;transition:none}.pointer-halo{display:none!important}*,*:before,*:after{animation:none!important;transition:none!important}}

/* More motion, using the same global pause and reduced-motion controls. */
.motion-spotlight{position:relative;isolation:isolate}
.motion-spotlight:after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--light-x,50%) var(--light-y,50%),#ffffff40,transparent 55%);opacity:0;transition:opacity .3s}
html[data-motion="full"] .motion-spotlight:hover:after{opacity:1}
.project-visual:before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffff12 49%,transparent 63%);transform:translateX(-130%)}
html[data-motion="full"] .project-visual:before{animation:light-sweep 11s cubic-bezier(.3,0,.2,1) infinite}
html[data-motion="full"] .prism-visual:before{animation-delay:-4s}
html[data-motion="full"] .rosehill-visual:before{animation-delay:-7s}
.motion-heading em{background-image:linear-gradient(currentColor,currentColor);background-position:0 100%;background-repeat:no-repeat;background-size:100% 1px}
html[data-motion="full"] .heading-revealed em{animation:ink-draw .65s cubic-bezier(.16,1,.3,1) both}
html[data-motion="full"] .hero-copy h1 em{animation:hero-ink 7s ease-in-out infinite}
html[data-motion="full"] .project:hover .tags span,html[data-motion="full"] .project:focus-within .tags span{animation:tag-arrive .35s cubic-bezier(.16,1,.3,1) backwards}
.project .tags span:nth-child(2){animation-delay:35ms!important}.project .tags span:nth-child(3){animation-delay:70ms!important}.project .tags span:nth-child(4){animation-delay:105ms!important}
.credential{position:relative}.credential:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;pointer-events:none}
html[data-motion="full"] .credential:after{transition:transform .45s cubic-bezier(.16,1,.3,1)}
html[data-motion="full"] .credential:hover:after{transform:scaleX(1)}
.credential-index{transition:translate .3s}
html[data-motion="full"] .credential:hover .credential-index{translate:-6px 0}
.contact{position:relative;isolation:isolate;overflow:hidden}.contact>.shell{position:relative;z-index:1}
.contact:before,.contact:after{content:'';position:absolute;right:-8%;top:-65%;width:clamp(350px,60vw,900px);aspect-ratio:1;border:1px solid #ffffff24;border-radius:50%;pointer-events:none;transform:rotate(-30deg) scaleY(.55)}
.contact:after{right:18%;top:20%;width:clamp(250px,40vw,620px);border-color:#ffffff16;transform:rotate(40deg) scaleY(.6)}
html[data-motion="full"] .contact:before{animation:contact-orbit 21s linear infinite}
html[data-motion="full"] .contact:after{animation:contact-orbit 29s linear infinite reverse}
html[data-motion="full"] .contact h2>span{animation:invite-arrow 4s cubic-bezier(.4,0,.2,1) infinite}
html[data-motion="full"] .pointer-halo.visible:before{content:'';position:absolute;left:-24px;top:-24px;width:48px;height:48px;border:1px dashed var(--blue);border-radius:50%;opacity:.2;animation:star-turn 12s linear infinite;pointer-events:none}
.motion-offscreen,.motion-offscreen *,.motion-offscreen:before,.motion-offscreen:after,.motion-offscreen *:before,.motion-offscreen *:after,.motion-away *,.motion-away *:before,.motion-away *:after{animation-play-state:paused!important}
html[data-motion="paused"] .motion-spotlight:after{opacity:0;transition:none}
html[data-motion="paused"] .credential-index{transition:none}
@keyframes light-sweep{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
@keyframes ink-draw{from{background-size:0 1px}to{background-size:100% 1px}}
@keyframes hero-ink{0%,100%{text-shadow:0 0 0 transparent}50%{text-shadow:0 5px 24px color-mix(in srgb,var(--blue) 18%,transparent)}}
@keyframes tag-arrive{from{translate:0 6px;opacity:.4}to{translate:0 0;opacity:1}}
@keyframes contact-orbit{from{transform:rotate(-30deg) scaleY(.55)}to{transform:rotate(330deg) scaleY(.55)}}
@keyframes invite-arrow{0%,65%,100%{translate:0 0}35%{translate:8px -8px}}
@media(hover:none),(pointer:coarse){.motion-spotlight:after{display:none}}
@media(prefers-reduced-motion:reduce){.credential-index{transition:none}.motion-spotlight:after{display:none}}
/* Navigation and project accents respond to the visitor's current action. */
.header nav a{position:relative}.header nav a:after{content:'';position:absolute;left:0;right:0;bottom:7px;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;pointer-events:none}
html[data-motion="full"] .header nav a:after{transition:transform .3s cubic-bezier(.16,1,.3,1)}
.header nav a:hover:after,.header nav a:focus-visible:after{transform:scaleX(1)}
.project-index{position:relative;padding-bottom:13px;overflow:hidden}.project-index:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--blue),transparent);transform:translateX(-100%);opacity:.5}
html[data-motion="full"] .project:hover .project-index:after,html[data-motion="full"] .project:focus-within .project-index:after{animation:project-signal 1.5s cubic-bezier(.2,.6,.2,1)}
.learning-grid article{position:relative}.learning-number{display:inline-block;transform-origin:bottom left}
html[data-motion="full"] .learning-grid article:hover .learning-number,html[data-motion="full"] .learning-grid article:focus-within .learning-number{animation:number-lift .45s cubic-bezier(.16,1,.3,1)}
@keyframes project-signal{to{transform:translateX(100%)}}
@keyframes number-lift{40%{translate:0 -5px;rotate:-8deg}to{translate:0 0;rotate:0deg}}
/* Menu choreography is driven by the shared animation preference. */
.menu-button span{display:inline-block}
html[data-motion="full"] .menu-button span{transition:rotate .25s cubic-bezier(.16,1,.3,1)}
.menu-button[aria-expanded="true"] span{rotate:45deg}
details summary>span{display:inline-block}
html[data-motion="full"] details summary>span{transition:rotate .25s}
details[open] summary>span{rotate:45deg}
.click-ripple{position:fixed;z-index:100;display:block;width:48px;height:48px;border:1px solid var(--blue);border-radius:50%;background:color-mix(in srgb,var(--blue) 8%,transparent);pointer-events:none;transform:translate(-50%,-50%)}
.click-ripple:after{content:'';position:absolute;inset:8px;border:1px solid var(--blue);border-radius:50%;opacity:.45}
html[data-motion="paused"] .click-ripple{display:none}
@media(prefers-reduced-motion:reduce){.click-ripple{display:none}}