@charset "UTF-8";
:root{--bg:#101113;--surface:#191b1f;--text:#f3f3ee;--muted:#aaaeb8;--line:#34373e;--blue:#7194ff;--electric:#2f5cff;--font:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.6}::selection{background:var(--electric);color:white}a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:7px}button{font:inherit}h1,h2,h3,p{margin:0}h2{font-size:clamp(2.5rem,5.3vw,5.5rem);letter-spacing:-.055em;line-height:1.07;font-weight:500}.wrap{width:min(1440px,calc(100% - 112px));margin:auto}.header{height:100px;padding:0 56px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5;background:var(--bg)}.brand{font-weight:800;font-size:2rem;letter-spacing:-.11em;line-height:1}.brand span{font-size:.8rem;letter-spacing:0;color:var(--blue);vertical-align:top;margin-left:5px}.header nav{display:flex;gap:34px}.header nav a,.nav-contact{font-size:.9rem}.header nav a{color:#c5c7ce}.header a:hover,.text-link:hover,.footer a:hover{color:var(--blue)}.nav-contact span{margin-left:14px}.hero{padding-top:38px}.hero-top{display:flex;justify-content:space-between;align-items:center}.eyebrow,.location,.section-label,.small-label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}.location{color:var(--muted)}h1{font-size:clamp(6rem,17.5vw,17rem);line-height:.82;letter-spacing:-.07em;font-weight:600;padding-top:64px;padding-bottom:44px}h1>span{display:block}.last-name{padding-left:24%}.name-dot{color:var(--electric)}.hero-bottom{display:grid;grid-template-columns:1.1fr 1fr .7fr;align-items:center;gap:35px;padding:8px 0 40px}.hero-intro p{font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.5;letter-spacing:-.025em}.hero-intro p span{color:var(--muted)}.text-link{display:inline-flex;gap:45px;margin-top:24px;font-size:.9rem;border-bottom:1px solid var(--line);padding-bottom:7px}.hero-aside{justify-self:end}.hero-aside p{font-size:1rem;margin:10px 0;color:#d9dbe1}.small-label{color:var(--muted)}.hero-object{width:190px;height:190px;position:relative;justify-self:center;perspective:650px}.orbit{position:absolute;inset:24px;border:1px solid var(--blue);border-radius:50%;transform-style:preserve-3d}.o1{transform:rotateY(65deg) rotateZ(-25deg)}.o2{transform:rotateY(-65deg) rotateZ(25deg)}.o3{transform:rotateX(65deg)}.orbit-core{position:absolute;inset:0;display:grid;place-items:center;font-size:1.8rem;color:var(--blue);letter-spacing:-.08em}.object-label{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:.65rem;white-space:nowrap;letter-spacing:.11em;color:var(--muted)}.section{padding:85px 0;border-top:1px solid var(--line);scroll-margin-top:20px}.section-label{display:flex;justify-content:space-between;gap:24px;color:var(--muted);margin-bottom:40px}.about{display:grid;grid-template-columns:1fr 2.35fr;gap:32px}.about .section-label{padding-top:10px}.muted{color:var(--muted)}.about-columns{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:36px;color:#c0c3cc}.about-columns p{max-width:34em}.interest-tags,.project-tags{display:flex;flex-wrap:wrap;gap:10px}.interest-tags{margin-top:32px}.interest-tags span{border:1px solid var(--line);border-radius:30px;padding:7px 16px;font-size:.85rem}.work h2{margin-bottom:48px}.project{border-top:1px solid var(--line)}.project:last-child{border-bottom:1px solid var(--line)}.project summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:65px 1fr 44px;align-items:center;gap:18px;padding:32px 0}.project summary::-webkit-details-marker{display:none}.project-index{align-self:start;padding-top:6px;color:var(--muted);font-size:.85rem}.project-category{font-size:.74rem;letter-spacing:.11em;color:var(--blue)}h3{font-size:clamp(1.6rem,3vw,2.75rem);font-weight:500;letter-spacing:-.035em;line-height:1.25;margin:7px 0}.project summary p{color:var(--muted)}.project-toggle{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;position:relative;transition:background .25s,transform .3s}.project-toggle:before,.project-toggle:after{content:"";position:absolute;background:var(--text);height:1px;width:12px;left:13px;top:19px}.project-toggle:after{transform:rotate(90deg)}details[open] .project-toggle{background:var(--electric);transform:rotate(45deg);border-color:var(--electric)}.project-body{display:grid;grid-template-columns:1fr 1.8fr;gap:60px;padding:0 65px 36px 83px}.project-body p{color:#c0c3cc;margin-top:8px}.project-tags{margin-top:20px}.project-tags span{font-size:.78rem;color:var(--muted);padding-right:12px}.footer{border-top:1px solid var(--line);padding-top:30px;padding-bottom:30px;display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--muted)}.footer p span{margin:0 10px}.skip-link{position:fixed;left:20px;top:-100px;background:white;color:black;padding:12px;z-index:99}.skip-link:focus{top:12px}
@media(min-width:1600px){h1{font-size:17rem}}@media(max-width:900px){.wrap{width:calc(100% - 56px)}.header{padding:0 28px;height:84px}.header nav{gap:20px}.about{grid-template-columns:1fr}.hero-bottom{grid-template-columns:1fr 1fr}.hero-aside{display:none}.section{padding:65px 0}.project-body{gap:30px;padding-left:0;padding-right:0}.about .section-label{margin-bottom:0}}@media(max-width:600px){.wrap{width:calc(100% - 40px)}.header{padding:0 20px;height:74px}.header nav{gap:18px}.header nav a{font-size:.8rem}.header nav a:last-child{display:none}.nav-contact{font-size:.8rem}.nav-contact span{margin-left:3px}.brand{font-size:1.7rem}.hero{padding-top:24px}.hero-top{align-items:start}.eyebrow{font-size:.68rem;max-width:160px}.location{font-size:.65rem;max-width:110px;text-align:right}h1{font-size:22vw;padding-top:48px;padding-bottom:30px}.last-name{padding-left:8%}.hero-bottom{grid-template-columns:1fr 120px;gap:10px;padding-bottom:30px}.hero-object{width:120px;height:150px}.orbit{inset:26px 3px}.object-label{display:none}.hero-intro p{font-size:1rem}.text-link{gap:20px;font-size:.8rem;margin-top:18px}.section{padding:50px 0}.section-label{font-size:.68rem;margin-bottom:24px}.section-label span:last-child:not(:first-child){display:none}.about-columns{grid-template-columns:1fr;gap:20px;margin-top:25px}.interest-tags{gap:8px}.interest-tags span{font-size:.78rem;padding:6px 12px}.project summary{grid-template-columns:25px 1fr 32px;gap:10px;padding:25px 0}.project-toggle{width:32px;height:32px}.project-toggle:before,.project-toggle:after{top:15px;left:9px}.project summary p{font-size:.9rem}.project-body{grid-template-columns:1fr;gap:18px;padding-left:35px;padding-bottom:28px;font-size:.95rem}.footer{flex-wrap:wrap;gap:20px}.footer p{font-size:.7rem}.footer>a:last-child{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* Experience and the closing invitation */
.experience-layout{display:grid;grid-template-columns:1fr 1.05fr;gap:80px}.experience-intro p{color:var(--muted);margin-top:24px}.experience-intro h2{font-size:clamp(2.4rem,4.7vw,4.5rem)}.role{padding:0 0 27px 30px;border-left:1px solid var(--line);position:relative}.role:before{content:"";position:absolute;left:-4px;top:9px;width:7px;height:7px;background:var(--blue);border-radius:50%}.role:last-child{padding-bottom:0}.role-date{color:var(--muted);font-size:.75rem;letter-spacing:.08em}.role h3{font-size:1.35rem;letter-spacing:-.025em;margin:8px 0 4px}.role .employer{color:var(--text);font-size:.9rem;margin-bottom:9px}.role p{color:var(--muted);font-size:.95rem;max-width:40em}.beyond-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.beyond h2{font-size:clamp(2.4rem,4.6vw,4.4rem)}.beyond-intro{margin-top:24px;max-width:26em;color:var(--muted)}.beyond-list article{margin-bottom:28px}.beyond-list h3{font-size:1.2rem;letter-spacing:-.02em;margin:0 0 10px}.beyond-list p{color:var(--muted)}.toolkit{display:flex;gap:40px;align-items:baseline;border-top:1px solid var(--line);padding-top:30px;margin-top:45px}.toolkit>div{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:1.1rem}.contact{background:var(--electric);padding:65px 0 60px;scroll-margin-top:0}.contact .section-label,.contact .small-label{color:#e5eaff}.contact h2{font-size:clamp(3rem,8.4vw,8.5rem);letter-spacing:-.06em;line-height:1.08}.contact h2 a{border-bottom:3px solid #ffffff80;display:inline-block;transition:border-color .2s}.contact h2 a:hover{border-color:white}.contact h2 a span{display:inline-block;font-size:.65em;margin-left:.15em;transition:transform .3s}.contact h2 a:hover span{transform:translate(8px,-8px)}.contact-bottom{margin-top:50px;display:flex;justify-content:space-between;gap:40px;align-items:start}.contact-bottom p{color:#e5eaff}.contact-links{display:flex;gap:24px;align-items:center;flex-wrap:wrap;position:relative}.contact-links a,.contact-links button{font-size:.9rem;min-height:44px;display:inline-flex;align-items:center;gap:14px}.contact-links button{background:none;color:white;border:0;padding:0;cursor:pointer}.contact-links a:hover,.contact-links button:hover{text-decoration:underline;text-underline-offset:5px}.copy-status{position:absolute;top:100%;right:0;font-size:.8rem}.footer-controls{display:flex;align-items:center;gap:28px}.footer-controls button{border:0;background:none;color:var(--muted);font-size:.75rem;padding:8px 0;cursor:pointer}.footer-controls button:hover{color:white}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:var(--blue);z-index:20;pointer-events:none}
/* Motion is progressive enhancement: every section is readable without scripts. */
@keyframes enter{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}@keyframes orbitOne{from{transform:rotateY(65deg) rotateZ(-25deg)}to{transform:rotateY(425deg) rotateZ(335deg)}}@keyframes orbitTwo{from{transform:rotateY(-65deg) rotateZ(25deg)}to{transform:rotateY(295deg) rotateZ(-335deg)}}@keyframes orbitThree{from{transform:rotateX(65deg) rotateZ(0)}to{transform:rotateX(425deg) rotateZ(360deg)}}
.motion-enabled .hero h1>span{animation:enter .9s cubic-bezier(.16,1,.3,1) both}.motion-enabled .hero h1>span:nth-child(2){animation-delay:.12s}.motion-enabled .hero-bottom{animation:enter .9s .2s both}.motion-enabled .o1{animation:orbitOne 15s linear infinite}.motion-enabled .o2{animation:orbitTwo 18s linear infinite}.motion-enabled .o3{animation:orbitThree 21s linear infinite}.motion-enabled .reveal{transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}.motion-enabled .reveal.pending{opacity:0;transform:translateY(25px)}.motion-enabled details[open] .project-body{animation:enter .35s ease both}.project summary:hover h3{color:var(--blue)}.project summary h3{transition:color .25s}.hero-object{transition:transform .5s ease-out}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused .reveal.pending{opacity:1;transform:none}.motion-paused{scroll-behavior:auto}.motion-paused .hero h1>span,.motion-paused .hero-bottom{animation:none;opacity:1;transform:none}
@media(max-width:900px){.experience-layout,.beyond-grid{grid-template-columns:1fr;gap:40px}.contact-bottom{flex-direction:column;gap:24px}.toolkit{flex-direction:column;gap:16px}.experience-intro h2,.beyond h2{font-size:clamp(2.5rem,5.3vw,5.5rem)}}@media(max-width:600px){.contact{padding:45px 0}.contact h2{font-size:clamp(2.9rem,10vw,4rem)}.contact-bottom{margin-top:30px}.contact-bottom p{font-size:.95rem}.contact-links{gap:22px}.toolkit{margin-top:15px}.toolkit>div{font-size:1rem;gap:12px 20px}.footer-controls{width:100%;justify-content:space-between}.hero-top .eyebrow,.hero-top .location,.project-category,.section-label,.role-date,.small-label{font-size:.75rem}.hero-intro .text-link{font-size:.875rem}.header nav a,.nav-contact{font-size:.875rem}.header nav{gap:14px}.header nav a{padding:12px 0}.hero{overflow:clip}.contact h2 a span{margin-left:.08em}}
@media(prefers-reduced-motion:reduce){.motion-enabled .reveal.pending{opacity:1;transform:none}.hero-object{transform:none!important}}
