@font-face{font-family:Sontera;src:local("Sontera");font-display:swap}@font-face{font-family:"Campus Sans";src:local("Campus Sans");font-display:swap}
:root{--bg:#fff;--ink:#121313;--muted:#5b5f5e;--line:#c9cdcc;--panel:#f0f2f1;--dark:#191b1b;--accent:#247387;--blue:#247387;--mustard:#d1aa32;--brick:#bd655c;--texture-white:url("assets/textures/web/marble-light.jpg");--texture-black:url("assets/textures/web/concrete-black.jpg");--main-dark-background:url("assets/textures/web/black-paper.webp");--title:Sontera,Georgia,"Times New Roman",serif;--head:"Campus Sans","Arial Narrow",Arial,sans-serif;--body:"Microsoft Sans Serif","Segoe UI",Arial,sans-serif;--pad:clamp(20px,4vw,64px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px}a{color:inherit}button{font:inherit}.site-header{height:82px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(170px,1fr) 2fr;align-items:center;padding:0 var(--pad);position:relative;z-index:10}.wordmark{font:700 30px/1 var(--title);letter-spacing:-.04em;text-decoration:none}.wordmark span{color:var(--accent)}.nav{display:flex;justify-content:flex-end;align-items:center;height:100%}.nav a{height:100%;padding:0 clamp(12px,1.6vw,28px);border-left:1px solid var(--line);display:grid;place-items:center;font:700 11px/1 var(--head);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}.nav a:last-child{border-right:1px solid var(--line)}.nav a:hover,.nav a[aria-current="page"]{background:var(--dark);color:var(--bg)}.menu-toggle{display:none;border:0;background:transparent}.page-grid{background-image:linear-gradient(to right,transparent calc(25% - .5px),var(--line) 25%,transparent calc(25% + .5px),transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px),transparent calc(75% - .5px),var(--line) 75%,transparent calc(75% + .5px));background-size:calc(100% - var(--pad)*2) 100%;background-position:center;background-repeat:no-repeat}.hero{min-height:calc(100svh - 82px);padding:clamp(75px,10vw,150px) var(--pad) 50px;display:grid;grid-template-columns:1fr 1fr;align-content:space-between;border-bottom:1px solid var(--line)}.hero-label,.eyebrow{font:700 11px/1 var(--head);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.hero-label{grid-column:1/-1}.hero h1{grid-column:1/-1;font:700 clamp(86px,16vw,245px)/.74 var(--title);letter-spacing:-.075em;margin:7vh 0 10vh}.hero h1 small{display:block;font:700 clamp(18px,2vw,29px)/1.2 var(--head);letter-spacing:.03em;text-transform:uppercase;margin:0 0 25px 5px;color:var(--muted)}.hero-intro{font-size:clamp(21px,2.5vw,35px);line-height:1.25;letter-spacing:-.035em;max-width:620px;margin:0}.hero-meta{align-self:end;justify-self:end;max-width:280px;color:var(--muted);line-height:1.55}.arrow-link,.text-link{display:inline-block;margin-top:25px;font:700 11px/1 var(--head);text-transform:uppercase;letter-spacing:.12em;text-decoration:none;border-bottom:1px solid;padding-bottom:5px}.arrow-link:hover,.text-link:hover{color:var(--accent)}.section{padding:clamp(80px,10vw,150px) var(--pad);border-bottom:1px solid var(--line)}.section-head{display:grid;grid-template-columns:1fr 2fr 1fr;margin-bottom:70px}.section-head h2,.page-title h1{font:700 clamp(57px,8vw,118px)/.86 var(--title);letter-spacing:-.055em;margin:0}.section-head h2{grid-column:2}.section-head p:last-child{align-self:end;color:var(--muted);line-height:1.5}.project-list{border-top:1px solid var(--line)}.project-row{display:grid;grid-template-columns:.5fr 1.4fr 2fr .35fr;gap:20px;align-items:center;min-height:155px;border-bottom:1px solid var(--line);text-decoration:none;transition:.2s}.project-row:hover{background:var(--panel);padding:0 16px}.project-row .num,.project-row .kind,.project-row .open{font:700 10px/1 var(--head);text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.project-row h3{font:700 clamp(27px,3vw,43px)/1 var(--title);letter-spacing:-.035em;margin:0}.project-row p{line-height:1.5;color:var(--muted);max-width:560px}.project-row .open{font-size:20px;color:var(--ink);justify-self:end}.split{display:grid;grid-template-columns:1fr 1fr}.split>*{padding:clamp(45px,7vw,100px) var(--pad)}.split>*+*{border-left:1px solid var(--line)}.split h2{font:700 clamp(48px,6vw,86px)/.9 var(--title);letter-spacing:-.05em;margin:25px 0}.split p{line-height:1.6;max-width:580px}.dark{background:var(--dark);color:var(--bg)}.dark .eyebrow,.dark p{color:#b8b6ae}.dark .arrow-link{border-color:#777}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #555;margin-top:50px}.stat{padding:35px 20px 15px 0}.stat+.stat{border-left:1px solid #555;padding-left:30px}.stat strong{display:block;font:700 clamp(35px,5vw,70px)/1 var(--head);letter-spacing:-.06em}.stat span{display:block;color:#aaa;font-size:13px;margin-top:12px}.site-footer{min-height:330px;background:var(--dark);color:var(--bg);padding:60px var(--pad) 35px;display:flex;flex-direction:column;justify-content:space-between}.site-footer h2{font:700 clamp(47px,7vw,100px)/.9 var(--title);letter-spacing:-.055em;margin:0}.footer-bottom{display:flex;justify-content:space-between;align-items:end;border-top:1px solid #555;padding-top:25px}.footer-links{display:flex;gap:25px}.footer-links a,.footer-bottom p{font:700 10px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:#aaa}.footer-links a:hover{color:white}
.page-title{min-height:58vh;padding:clamp(80px,10vw,145px) var(--pad) 55px;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:end;border-bottom:1px solid var(--line)}.page-title .eyebrow{align-self:start}.page-title h1{grid-column:2}.page-title>p:last-child{line-height:1.55;color:var(--muted);max-width:310px}.case-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.case{min-height:430px;padding:38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column}.case:nth-child(4n+2),.case:nth-child(4n+3){background:var(--panel)}.case .case-top{display:flex;justify-content:space-between;color:var(--muted);font:700 10px/1 var(--head);letter-spacing:.12em;text-transform:uppercase}.case h2{font:700 clamp(38px,4vw,62px)/.95 var(--title);letter-spacing:-.04em;margin:auto 0 20px}.case p{color:var(--muted);line-height:1.55;max-width:530px}.tag-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:20px}.tag-row span{border:1px solid var(--line);padding:7px 9px;font:700 9px/1 var(--head);letter-spacing:.08em;text-transform:uppercase}.story{display:grid;grid-template-columns:1fr 2fr 1fr;gap:30px}.story h2{font:700 clamp(50px,7vw,100px)/.88 var(--title);letter-spacing:-.05em;margin:0;grid-column:1/3}.story-copy{grid-column:2/4;display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:60px}.story-copy p{font-size:18px;line-height:1.65;margin:0}.story-copy p:first-child{font-size:clamp(24px,2.5vw,36px);line-height:1.35;letter-spacing:-.025em}.timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:1fr 2fr 1fr;gap:30px;padding:35px 0;border-bottom:1px solid var(--line)}.timeline-item .year{font:700 12px/1 var(--head);letter-spacing:.12em}.timeline-item h3{font:700 28px/1 var(--title);margin:0}.timeline-item p{line-height:1.55;color:var(--muted);margin:0}.skills-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.skill-group{padding:30px;min-height:270px}.skill-group+.skill-group{border-left:1px solid var(--line)}.skill-group h3{font:700 26px/1 var(--title);margin:0 0 35px}.skill-group ul{list-style:none;padding:0;margin:0;color:var(--muted);line-height:1.9}.contact-page{min-height:calc(100svh - 82px);display:grid;grid-template-columns:1fr 2fr 1fr;padding:clamp(80px,10vw,140px) var(--pad);align-content:space-between}.contact-page h1{grid-column:1/4;font:700 clamp(72px,13vw,190px)/.78 var(--title);letter-spacing:-.07em;margin:8vh 0}.contact-page .contact-intro{grid-column:2;font-size:clamp(20px,2.5vw,34px);line-height:1.3;letter-spacing:-.03em}.contact-page .contact-details{grid-column:3;align-self:end}.contact-details a{display:block;font:700 11px/1 var(--head);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:14px 0;border-bottom:1px solid var(--line)}.contact-details a:hover{color:var(--accent)}.reveal{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:850px){.site-header{grid-template-columns:1fr auto}.menu-toggle{display:block;padding:12px}.menu-toggle span{display:block;width:22px;border-top:2px solid;margin:5px}.nav{position:absolute;top:82px;left:0;right:0;background:var(--bg);height:auto;display:none;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}.nav.open{display:flex}.nav a{height:55px;border-left:0;border-top:1px solid var(--line)}.page-grid{background-image:linear-gradient(to right,transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px))}.hero,.section-head,.page-title{grid-template-columns:1fr 1fr}.hero h1,.hero-label{grid-column:1/-1}.section-head h2,.page-title h1{grid-column:1/-1}.section-head p:last-child,.page-title>p:last-child{grid-column:2}.project-row{grid-template-columns:.35fr 1.3fr .2fr}.project-row p{display:none}.split{grid-template-columns:1fr}.split>*+*{border-left:0;border-top:1px solid var(--line)}.page-title{min-height:50vh}.case-grid{grid-template-columns:1fr}.case{min-height:360px}.case:nth-child(even){background:var(--panel)}.case:nth-child(odd){background:transparent}.story{grid-template-columns:1fr}.story h2,.story-copy{grid-column:1}.story-copy{margin-top:30px}.timeline-item{grid-template-columns:.5fr 1.2fr}.timeline-item p{grid-column:2}.skills-grid{grid-template-columns:1fr 1fr}.skill-group:nth-child(3){border-left:0;border-top:1px solid var(--line)}.skill-group:nth-child(4){border-top:1px solid var(--line)}.contact-page{grid-template-columns:1fr 1fr}.contact-page h1{grid-column:1/3}.contact-page .contact-intro{grid-column:1}.contact-page .contact-details{grid-column:2}}
@media(max-width:520px){.site-header{height:70px}.nav{top:70px}.hero{min-height:calc(100svh - 70px);grid-template-columns:1fr;padding-top:60px}.hero h1{font-size:86px;margin:15vh 0 9vh}.hero-intro,.hero-meta{grid-column:1;justify-self:start}.hero-meta{margin-top:35px}.section{padding:75px 20px}.section-head,.page-title{grid-template-columns:1fr}.section-head h2,.section-head p:last-child,.page-title h1,.page-title>p:last-child{grid-column:1}.section-head p:last-child{margin-top:25px}.project-row{grid-template-columns:.25fr 1fr .15fr;min-height:130px}.project-row .kind{display:none}.stats{grid-template-columns:1fr}.stat+.stat{border-left:0;border-top:1px solid #555;padding-left:0}.footer-bottom{display:block}.footer-links{flex-wrap:wrap;margin-bottom:30px}.page-title{padding:65px 20px 35px}.page-title h1{font-size:58px;margin:60px 0 30px}.case{padding:25px;min-height:330px}.story-copy{grid-template-columns:1fr;gap:25px}.timeline-item{grid-template-columns:1fr}.timeline-item p{grid-column:1}.skills-grid{grid-template-columns:1fr}.skill-group+.skill-group{border-left:0;border-top:1px solid var(--line)}.contact-page{min-height:calc(100svh - 70px);grid-template-columns:1fr;padding:65px 20px}.contact-page h1,.contact-page .contact-intro,.contact-page .contact-details{grid-column:1}.contact-page h1{font-size:72px;margin:12vh 0}.contact-page .contact-details{margin-top:60px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

/* Material system: white marble and black concrete accents over a separate page background. */
.site-header{background:rgba(255,255,255,.95);backdrop-filter:blur(8px)}
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;z-index:-1;top:0;right:var(--pad);bottom:0;width:25%;background-image:linear-gradient(rgba(255,255,255,.36),rgba(255,255,255,.36)),var(--texture-white);background-size:cover;background-position:center;border-left:1px solid var(--line);border-right:1px solid var(--line);opacity:.62}
.hero-meta{color:#404443;background:rgba(255,255,255,.84);padding:14px}
.dark{background-color:var(--dark);background-image:linear-gradient(rgba(20,20,19,.77),rgba(20,20,19,.77)),var(--texture-black);background-size:cover;background-position:center}
.site-footer{background:var(--dark)}
@media(max-width:850px){.hero:before{width:50%}}
@media(max-width:520px){.hero:before{right:20px;width:calc(50% - 20px);opacity:.42}.hero-meta{padding:10px}}

/* Restrained 90s print system: modular grid, halftone fields, geometric marks. */
.page-grid{background-image:linear-gradient(to right,transparent calc(25% - .5px),var(--line) 25%,transparent calc(25% + .5px),transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px),transparent calc(75% - .5px),var(--line) 75%,transparent calc(75% + .5px)),repeating-linear-gradient(to bottom,transparent 0,transparent 191px,rgba(23,23,22,.055) 191px,rgba(23,23,22,.055) 192px);background-size:calc(100% - var(--pad)*2) 100%,100% 192px}
.wordmark{position:relative;justify-self:start}
.wordmark:after{content:"";position:absolute;left:calc(100% + 10px);top:5px;width:18px;height:18px;background-image:radial-gradient(circle,var(--blue) 1.5px,transparent 1.8px);background-size:6px 6px;opacity:.7}
.hero:before{background-image:radial-gradient(circle,rgba(18,19,19,.27) 1px,transparent 1.2px),linear-gradient(rgba(255,255,255,.36),rgba(255,255,255,.36)),var(--texture-white);background-size:8px 8px,cover,cover}
.dark{background-image:radial-gradient(circle,rgba(255,255,255,.16) 1px,transparent 1.2px),linear-gradient(rgba(20,20,19,.78),rgba(20,20,19,.78)),var(--texture-black);background-size:9px 9px,cover,cover;background-blend-mode:soft-light,normal,normal}
.page-title.dark>p:last-child{color:#c2c0b8}
.page-title.dark{background-color:var(--dark);background-image:none}
.hero h1,.page-title h1,.section-head h2,.story h2,.contact-page h1,.site-footer h2{position:relative}
.hero h1,.page-title h1{width:100%}
.hero h1:before{content:"";position:absolute;right:18%;top:-5%;width:58px;height:58px;border:3px solid var(--brick);border-radius:50%;box-shadow:10px 10px 0 rgba(150,99,93,.18)}
.hero h1:after{content:"";position:absolute;right:31%;bottom:5%;width:48px;height:42px;background:var(--mustard);clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(-12deg);opacity:.86}
.page-title h1:before{content:"";position:absolute;right:5%;top:-35px;width:48px;height:48px;border:3px solid var(--blue);transform:rotate(8deg)}
.page-title h1:after{content:"";position:absolute;right:27%;bottom:-28px;width:23px;height:23px;background:var(--brick);border-radius:50%}
.section-head h2:before{content:"";position:absolute;left:-42px;top:3px;width:24px;height:24px;border:2px solid var(--ink);background-image:radial-gradient(circle,var(--ink) 1px,transparent 1.2px);background-size:5px 5px}
.section-head h2:after{content:"";position:absolute;right:3%;top:5px;width:54px;height:13px;background:var(--blue);transform:skewX(-18deg);opacity:.8}
.story h2:after{content:"+";position:absolute;right:2%;top:0;color:var(--mustard);font:400 58px/1 var(--head);transform:rotate(8deg)}
.project-row{position:relative}
.project-row:before{content:"";position:absolute;left:25%;bottom:-1px;width:50%;height:4px;background:transparent;transition:background .2s}
.project-row:hover:before{background-image:repeating-linear-gradient(90deg,var(--brick) 0 8px,transparent 8px 14px)}
.case{position:relative;overflow:hidden;isolation:isolate}
.case>*{position:relative;z-index:1}
.case:nth-child(4n+2),.case:nth-child(4n+3){background-color:var(--panel);background-image:radial-gradient(circle,rgba(23,23,22,.14) 1px,transparent 1.25px);background-size:8px 8px}
.case:nth-child(3n+1):after{content:"";position:absolute;right:34px;top:72px;width:58px;height:58px;border:2px solid var(--blue);border-radius:50%;opacity:.58}
.case:nth-child(3n+2):after{content:"";position:absolute;right:35px;top:75px;width:48px;height:43px;background:var(--mustard);clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(9deg);opacity:.65}
.case:nth-child(3n):after{content:"+";position:absolute;right:34px;top:62px;color:var(--brick);font:400 62px/1 var(--head);transform:rotate(-7deg);opacity:.66}
.timeline-item .year{display:flex;align-items:center;gap:12px}
.timeline-item .year:before{content:"";width:11px;height:11px;background:var(--blue);box-shadow:4px 4px 0 rgba(113,135,138,.24)}
.skill-group{position:relative;overflow:hidden}
.skill-group:nth-child(even){background-image:radial-gradient(circle,rgba(23,23,22,.12) 1px,transparent 1.2px);background-size:9px 9px}
.skill-group h3:after{content:"";display:block;width:34px;height:5px;background:var(--brick);margin-top:12px}
.stat strong{position:relative}
.stat strong:after{content:"";display:inline-block;width:10px;height:10px;background:var(--mustard);margin:0 0 8px 10px;transform:rotate(12deg)}
.site-footer{position:relative;overflow:hidden;isolation:isolate}
.site-footer:before{content:"";position:absolute;z-index:0;right:var(--pad);top:0;bottom:0;width:25%;border-left:1px solid #50504d;border-right:1px solid #50504d;background-image:radial-gradient(circle,rgba(255,255,255,.22) 1px,transparent 1.3px);background-size:9px 9px;opacity:.38}
.site-footer>*{position:relative;z-index:1}
.site-footer h2:after{content:"";position:absolute;right:8%;top:0;width:44px;height:44px;border:3px solid var(--mustard);border-radius:50%}
.contact-page h1:before{content:"";position:absolute;right:8%;top:-15%;width:70px;height:70px;border:3px solid var(--blue);transform:rotate(12deg)}
.contact-page h1:after{content:"";position:absolute;right:25%;bottom:0;width:55px;height:15px;background:var(--brick);transform:skewX(-20deg)}
:where(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:850px){.page-grid{background-image:linear-gradient(to right,transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px)),repeating-linear-gradient(to bottom,transparent 0,transparent 159px,rgba(23,23,22,.05) 159px,rgba(23,23,22,.05) 160px);background-size:calc(100% - var(--pad)*2) 100%,100% 160px}.menu-toggle{display:grid!important;place-items:center;width:58px;height:48px;justify-self:end;position:relative;z-index:11;border:1px solid var(--line);padding:0}.menu-toggle:after{content:"Menu";font:700 9px/1 var(--head);letter-spacing:.08em;text-transform:uppercase}.menu-toggle span,.menu-toggle b{display:none}.hero h1:before{right:6%}.hero h1:after{right:27%}.section-head h2:before{left:auto;right:0;top:-28px}.page-title h1:before{right:1%}.site-footer:before{width:50%}}
@media(max-width:520px){.menu-toggle{display:block!important;width:58px;height:48px;justify-self:end;position:relative;z-index:11;border:1px solid var(--line)}.menu-toggle:after{content:"Menu";font:700 9px/1 var(--head);letter-spacing:.08em;text-transform:uppercase}.menu-toggle span,.menu-toggle b{display:none}.wordmark:after{display:none}.hero h1:before{width:38px;height:38px;right:3%;top:-18%}.hero h1:after{width:31px;height:28px;right:10%;bottom:-4%}.page-title h1:before{width:34px;height:34px;top:-38px;right:2%}.page-title h1:after{width:17px;height:17px;right:35%}.section-head h2:before{display:none}.section-head h2:after{width:38px;right:0}.case:after{transform:scale(.75)!important;transform-origin:top right}.story h2:after{font-size:42px;top:-30px}.site-footer h2:after{width:32px;height:32px;right:0}.contact-page h1:before{width:42px;height:42px;right:0}.contact-page h1:after{width:38px;right:20%}}
@media(forced-colors:active){.page-grid,.case:nth-child(4n+2),.case:nth-child(4n+3),.dark,.hero:before{background-image:none}.hero h1:before,.hero h1:after,.page-title h1:before,.page-title h1:after,.section-head h2:before,.section-head h2:after,.case:after,.story h2:after,.site-footer:before,.site-footer h2:after,.contact-page h1:before,.contact-page h1:after{display:none}}

/* Keep the hero layers stable through the intro handoff: shapes, mascot, then title. */
.hero h1{z-index:auto}
.hero h1:before,.hero h1:after{z-index:0}
.hero h1 small,.hero h1>.kinetic-word{position:relative;z-index:2}
.hero-character{--logo-x:0px;--logo-y:0px;--logo-scroll:0px;position:absolute;z-index:1;top:20%;right:var(--pad);left:auto;width:clamp(230px,24vw,340px);aspect-ratio:916/830;margin:0;overflow:visible;border:0;background:transparent;box-shadow:none;transform:translate3d(var(--logo-x),calc(var(--logo-y) + var(--logo-scroll)),0) rotate(7deg);transform-origin:52% 62%;transition:transform .18s ease-out;will-change:transform;pointer-events:none}
.hero-character img{position:absolute;top:-43.01%;left:-3.38%;display:block;width:109.17%;height:auto;max-width:none;object-fit:contain;filter:saturate(.95) contrast(1.03)}
@media(max-width:1000px){.hero-character{top:21%;width:240px}}
@media(max-width:850px){.hero-character{top:22%;right:var(--pad);width:190px}}
@media(max-width:520px){.hero-character{top:24%;right:28px;width:140px;transform:translate3d(var(--logo-x),calc(var(--logo-y) + var(--logo-scroll)),0) rotate(7deg)}.hero h1:before{display:none}}
@media(prefers-reduced-motion:reduce){.hero-character{transition:none;will-change:auto}}

/* Robot archive - separate frames with room for each photograph to breathe. */
.robot-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.5vw,56px);margin-top:clamp(70px,9vw,125px)}
.robot-gallery-section{padding-top:clamp(32px,4vw,58px);padding-bottom:clamp(55px,7vw,95px)}
.robot-gallery-section .robot-gallery{margin-top:0}
.robot-shot{min-width:0;margin:0;background:transparent}
.robot-shot-image{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--dark)}
.robot-shot-image:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.18) .7px,transparent .9px);background-size:6px 6px;mix-blend-mode:soft-light;pointer-events:none;opacity:.3}
.robot-shot img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.04)}
.robot-shot:nth-child(2) img{object-position:center}
@media(max-width:850px){.robot-gallery{grid-template-columns:1fr 1fr;gap:32px}.robot-shot:first-child{grid-column:1/-1}.robot-shot:first-child .robot-shot-image{aspect-ratio:16/9}}
@media(max-width:520px){.robot-gallery{grid-template-columns:1fr;gap:24px;margin-top:60px}.robot-shot:first-child{grid-column:auto}.robot-shot:first-child .robot-shot-image,.robot-shot-image{aspect-ratio:4/3}}

/* Media archive - concrete work first, then compact role and platform details. */
.media-gallery-section{padding-top:clamp(32px,4vw,58px);padding-bottom:clamp(55px,7vw,95px)}
.media-highlight-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.5vw,56px)}
.media-highlight{display:block;min-width:0;text-decoration:none}
.media-highlight-image{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--dark);border:1px solid var(--line)}
.media-highlight-image:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.18) .7px,transparent .9px);background-size:6px 6px;mix-blend-mode:soft-light;pointer-events:none;opacity:.3}
.media-highlight-image img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.04);transition:transform .35s ease,filter .35s ease}
.media-highlight:hover .media-highlight-image img{transform:scale(1.025);filter:saturate(1) contrast(1.04)}
.media-stats{margin-top:clamp(65px,8vw,105px);border-color:var(--line)}
.media-stats .stat+.stat{border-color:var(--line)}
.media-stats .stat span{color:var(--muted)}
.media-film-list .project-row{min-height:130px}
.media-film-list .project-row .kind{max-width:210px;line-height:1.45}
.film-title{display:grid;grid-template-columns:clamp(110px,12vw,180px) minmax(0,1fr);gap:clamp(14px,2vw,28px);align-items:center;min-width:0}
.film-thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--dark);border:1px solid var(--line)}
.film-thumb:after{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.18) .7px,transparent .9px);background-size:6px 6px;mix-blend-mode:soft-light;pointer-events:none;opacity:.3}
.film-thumb img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.04);transition:transform .3s ease,filter .3s ease}
.media-film-list .project-row:hover .film-thumb img{transform:scale(1.035);filter:saturate(1) contrast(1.04)}
.media-role-grid .case{min-height:470px}
.media-role-grid .case h2{font-size:clamp(36px,3.8vw,58px)}
.card-links{display:flex;flex-wrap:wrap;gap:11px 18px;margin-top:24px}
.card-links a{font:700 9px/1.25 var(--head);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:4px}
.card-links a:hover{color:var(--accent);border-color:var(--accent)}
.media-manifesto h2{max-width:650px}
.media-manifesto p{max-width:620px}
@media(max-width:850px){.media-film-list .project-row{grid-template-columns:.25fr 1fr 1.6fr .2fr}.media-role-grid .case{min-height:390px}}
@media(max-width:850px){.media-highlight-gallery{grid-template-columns:1fr 1fr;gap:32px}.media-highlight:first-child{grid-column:1/-1}.media-highlight:first-child .media-highlight-image{aspect-ratio:16/9}}
@media(max-width:650px){.media-film-list .project-row{grid-template-columns:.25fr 1fr .15fr}.media-film-list .project-row .kind{display:none}}
@media(max-width:520px){.media-stats{margin-top:55px}.media-role-grid .case{min-height:390px}.card-links{gap:10px 14px}}
@media(max-width:520px){.media-highlight-gallery{grid-template-columns:1fr;gap:24px}.media-highlight:first-child{grid-column:auto}}
@media(max-width:520px){.film-title{grid-template-columns:88px minmax(0,1fr);gap:12px}}
@media(prefers-reduced-motion:reduce){.film-thumb img,.media-highlight-image img{transition:none}.media-film-list .project-row:hover .film-thumb img,.media-highlight:hover .media-highlight-image img{transform:none}}

/* Site-wide shape parallax. Each pseudo-element keeps its original rotation or skew. */
:where(.wordmark,.hero h1,.page-title h1,.section-head h2,.story h2,.case,.timeline-item .year,.skill-group h3,.stat strong,.site-footer h2,.contact-page h1){--shape-x:0px;--shape-y:0px;--shape-x-alt:0px;--shape-y-alt:0px;--shape-scale:1}
.wordmark:after,.hero h1:before,.hero h1:after,.page-title h1:before,.page-title h1:after,.section-head h2:before,.section-head h2:after,.story h2:after,.case:after,.timeline-item .year:before,.skill-group h3:after,.stat strong:after,.site-footer h2:after,.contact-page h1:before,.contact-page h1:after{transition:transform .18s ease-out}
.wordmark:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0)}
.hero h1:before{transform:translate3d(var(--shape-x),var(--shape-y),0)}
.hero h1:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(-12deg)}
.page-title h1:before{transform:translate3d(var(--shape-x),var(--shape-y),0) rotate(8deg)}
.page-title h1:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0)}
.section-head h2:before{transform:translate3d(var(--shape-x),var(--shape-y),0)}
.section-head h2:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) skewX(-18deg)}
.story h2:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(8deg)}
.case:nth-child(3n+1):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) scale(var(--shape-scale))}
.case:nth-child(3n+2):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(9deg) scale(var(--shape-scale))}
.case:nth-child(3n):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(-7deg) scale(var(--shape-scale))}
.timeline-item .year:before{transform:translate3d(var(--shape-x),var(--shape-y),0)}
.skill-group h3:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0)}
.stat strong:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(12deg)}
.site-footer h2:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0)}
.contact-page h1:before{transform:translate3d(var(--shape-x),var(--shape-y),0) rotate(12deg)}
.contact-page h1:after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) skewX(-20deg)}
@media(max-width:520px){.case{--shape-scale:.75}.case:nth-child(3n+1):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) scale(var(--shape-scale))!important}.case:nth-child(3n+2):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(9deg) scale(var(--shape-scale))!important}.case:nth-child(3n):after{transform:translate3d(var(--shape-x-alt),var(--shape-y-alt),0) rotate(-7deg) scale(var(--shape-scale))!important}}
@media(prefers-reduced-motion:reduce){:where(.wordmark,.hero h1,.page-title h1,.section-head h2,.story h2,.case,.timeline-item .year,.skill-group h3,.stat strong,.site-footer h2,.contact-page h1){--shape-x:0px!important;--shape-y:0px!important;--shape-x-alt:0px!important;--shape-y-alt:0px!important}.wordmark:after,.hero h1:before,.hero h1:after,.page-title h1:before,.page-title h1:after,.section-head h2:before,.section-head h2:after,.story h2:after,.case:after,.timeline-item .year:before,.skill-group h3:after,.stat strong:after,.site-footer h2:after,.contact-page h1:before,.contact-page h1:after{transition:none}}

/* Ambient motion composes with pointer parallax instead of replacing it. */
@keyframes shape-wiggle-a{0%,100%{translate:0 0}23%{translate:1.5px -1px}51%{translate:-1px 1.5px}77%{translate:1px .5px}}
@keyframes shape-wiggle-b{0%,100%{translate:0 0}28%{translate:-1.5px .75px}56%{translate:1px 1.5px}82%{translate:.5px -1px}}
@keyframes mascot-bob{0%,100%{translate:0 0}50%{translate:0 -4px}}
@media(prefers-reduced-motion:no-preference){
  .wordmark:after,.hero h1:before,.hero h1:after,.page-title h1:before,.page-title h1:after,.section-head h2:before,.section-head h2:after,.story h2:after,.case:after,.timeline-item .year:before,.skill-group h3:after,.stat strong:after,.site-footer h2:after,.contact-page h1:before,.contact-page h1:after{animation:shape-wiggle-a 5.8s ease-in-out infinite}
  .hero h1:after,.page-title h1:before,.section-head h2:after,.case:nth-child(even):after,.story h2:after,.stat strong:after,.contact-page h1:after{animation-name:shape-wiggle-b;animation-duration:6.9s;animation-delay:-2.2s}
  .hero-character{animation:mascot-bob 6.4s ease-in-out infinite;animation-delay:-1.7s}
}

/* Kinetic type: strong entrances that settle, then small tactile responses. */
.kinetic-word{display:inline-block;transform-origin:50% 82%}
.kinetic-display{--kinetic-rise:clamp(18px,.22em,26px);--kinetic-duration:720ms}
.kinetic-section-title{--kinetic-rise:clamp(12px,.16em,18px);--kinetic-duration:580ms}
.kinetic-heading.reveal{transform:none}
.eyebrow,.hero-label{position:relative}
.eyebrow:after,.hero-label:after{content:"";position:absolute;left:0;bottom:-10px;width:34px;height:2px;background:var(--accent);transform-origin:left center}
.project-row:hover{padding:0}
.project-row h3,.project-row .open,.case h2,.timeline-item h3,.skill-group h3{transition:transform .2s cubic-bezier(.22,1,.36,1)}
.project-row .open{transform-origin:center}

@keyframes kinetic-word-slam{
  from{opacity:0;transform:translate3d(var(--kinetic-entry-x),var(--kinetic-rise),0) rotate(var(--kinetic-entry-rotate)) skewX(-4deg)}
  to{opacity:1;transform:none}
}
@keyframes kinetic-item-slam{
  from{opacity:0;transform:translate3d(0,20px,0) skewY(.8deg)}
  to{opacity:1;transform:none}
}
@keyframes kinetic-rule-in{
  from{transform:scaleX(0)}
  to{transform:scaleX(1)}
}

@media(prefers-reduced-motion:no-preference){
  .kinetic-type-ready :is(.kinetic-display,.kinetic-section-title):not(.kinetic-visible) .kinetic-word{opacity:0;transform:translate3d(var(--kinetic-entry-x),var(--kinetic-rise),0) rotate(var(--kinetic-entry-rotate)) skewX(-4deg)}
  .kinetic-type-ready :is(.kinetic-display,.kinetic-section-title).kinetic-visible .kinetic-word{animation:kinetic-word-slam var(--kinetic-duration) cubic-bezier(.22,1,.36,1) var(--kinetic-delay) both}
  .kinetic-type-ready .kinetic-group:not(.kinetic-visible)>.kinetic-item{opacity:0;transform:translate3d(0,20px,0) skewY(.8deg)}
  .kinetic-type-ready .kinetic-group.kinetic-visible>.kinetic-item{animation:kinetic-item-slam 560ms cubic-bezier(.22,1,.36,1) var(--kinetic-item-delay) backwards}

  .kinetic-detail .kinetic-word{transition:transform .2s cubic-bezier(.22,1,.36,1);transition-delay:var(--kinetic-delay)}
  .project-row:is(:hover,:focus-visible) .kinetic-detail .kinetic-word,.case:focus-within .kinetic-detail .kinetic-word{transform:translate3d(.08em,var(--kinetic-hover-y),0) rotate(var(--kinetic-hover-rotate))}
  .project-row:is(:hover,:focus-visible) .open{transform:translate3d(4px,-4px,0) rotate(-7deg)}
  .case:focus-within h2{transform:translateX(5px)}

  :is(.hero-label,.eyebrow).reveal.visible:after,.reveal.visible :is(.hero-label,.eyebrow):after{animation:kinetic-rule-in 520ms cubic-bezier(.22,1,.36,1) 160ms backwards}
}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .case:hover .kinetic-detail .kinetic-word,.timeline-item:hover .kinetic-detail .kinetic-word,.skill-group:hover .kinetic-detail .kinetic-word{transform:translate3d(.08em,var(--kinetic-hover-y),0) rotate(var(--kinetic-hover-rotate))}
  .case:hover h2,.timeline-item:hover h3,.skill-group:hover h3{transform:translateX(5px)}
}

@media(max-width:520px){.kinetic-display{--kinetic-rise:16px}.kinetic-section-title{--kinetic-rise:12px}.media-film-list .project-row{grid-template-columns:30px minmax(0,1fr) 20px;gap:10px}.film-title{grid-template-columns:72px minmax(0,1fr);gap:10px}.media-film-list .project-row h3{font-size:clamp(20px,7vw,27px)}}
@media(prefers-reduced-motion:reduce),(forced-colors:active),print{
  .kinetic-type-ready .kinetic-word,.kinetic-type-ready .kinetic-item{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
  .eyebrow:after,.hero-label:after{transform:none!important;animation:none!important}
}

/* Full-bleed convex-lens shading: fisheye depth without a visible rim. */
body:before,body:after{content:"";position:fixed;pointer-events:none;inset:-2px}
body:before{z-index:1000;background:radial-gradient(ellipse 120% 110% at 50% 49%,transparent 65%,rgba(18,19,19,.016) 80%,rgba(18,19,19,.068) 100%);mix-blend-mode:multiply}
body:after{z-index:999;background:radial-gradient(ellipse 86% 72% at 50% 46%,rgba(255,255,255,.028),transparent 72%);mix-blend-mode:screen}
@media(max-width:520px){body:before{background:radial-gradient(ellipse 126% 112% at 50% 49%,transparent 70%,rgba(18,19,19,.048) 100%)}body:after{background:radial-gradient(ellipse 92% 76% at 50% 45%,rgba(255,255,255,.02),transparent 74%)}}
@media(forced-colors:active){body:before,body:after{display:none}}

/* Dark-only theme - bright ink, restrained texture, and preserved contrast. */
html[data-theme="dark"]{color-scheme:dark;--bg:#111313;--ink:#f3f1e9;--muted:#b5bbb8;--line:#4b5250;--panel:#1b2020;--dark:#090b0b;--accent:#65b7c7;--blue:#65b7c7;--mustard:#e3bd4f;--brick:#dc8177;background:var(--bg)}
html[data-theme="dark"] body{background-color:var(--bg);background-image:linear-gradient(rgba(9,11,11,.34),rgba(9,11,11,.34)),var(--main-dark-background);background-size:cover;background-position:center top;background-repeat:no-repeat;background-attachment:fixed}
html[data-theme="dark"] .site-header{background:rgba(17,19,19,.95)}
html[data-theme="dark"] .nav a:hover,html[data-theme="dark"] .nav a[aria-current="page"]{background:var(--ink);color:var(--bg)}
html[data-theme="dark"] .page-grid{background-image:linear-gradient(to right,transparent calc(25% - .5px),var(--line) 25%,transparent calc(25% + .5px),transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px),transparent calc(75% - .5px),var(--line) 75%,transparent calc(75% + .5px)),repeating-linear-gradient(to bottom,transparent 0,transparent 191px,rgba(255,255,255,.04) 191px,rgba(255,255,255,.04) 192px)}
html[data-theme="dark"] .hero:before{background-image:radial-gradient(circle,rgba(243,241,233,.16) 1px,transparent 1.2px),linear-gradient(rgba(8,10,10,.62),rgba(8,10,10,.62)),var(--texture-black);background-blend-mode:soft-light,normal,normal;opacity:.82}
html[data-theme="dark"] .hero-meta{color:var(--ink);background:rgba(9,11,11,.86);border:1px solid var(--line)}
html[data-theme="dark"] .dark,html[data-theme="dark"] .site-footer{background-color:var(--dark);color:var(--ink)}
html[data-theme="dark"] .dark .eyebrow,html[data-theme="dark"] .dark p,html[data-theme="dark"] .page-title.dark>p:last-child{color:#c5cbc7}
html[data-theme="dark"] .dark .arrow-link{border-color:var(--line)}
html[data-theme="dark"] .stats,html[data-theme="dark"] .stat+.stat,html[data-theme="dark"] .footer-bottom{border-color:var(--line)}
html[data-theme="dark"] .stat span,html[data-theme="dark"] .footer-links a,html[data-theme="dark"] .footer-bottom p{color:var(--muted)}
html[data-theme="dark"] .footer-links a:hover{color:var(--ink)}
html[data-theme="dark"] .site-footer:before{border-color:var(--line)}
html[data-theme="dark"] .case:nth-child(4n+2),html[data-theme="dark"] .case:nth-child(4n+3){background-color:var(--panel);background-image:radial-gradient(circle,rgba(243,241,233,.11) 1px,transparent 1.25px)}
html[data-theme="dark"] .skill-group:nth-child(even){background-image:radial-gradient(circle,rgba(243,241,233,.1) 1px,transparent 1.2px)}
html[data-theme="dark"] body:before{background:radial-gradient(ellipse 120% 110% at 50% 49%,transparent 65%,rgba(0,0,0,.025) 80%,rgba(0,0,0,.11) 100%)}
html[data-theme="dark"] body:after{background:radial-gradient(ellipse 86% 72% at 50% 46%,rgba(255,255,255,.042),transparent 72%)}
@media(max-width:850px){html[data-theme="dark"] .page-grid{background-image:linear-gradient(to right,transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px)),repeating-linear-gradient(to bottom,transparent 0,transparent 159px,rgba(255,255,255,.04) 159px,rgba(255,255,255,.04) 160px)}html[data-theme="dark"] .case:nth-child(even){background-color:var(--panel);background-image:radial-gradient(circle,rgba(243,241,233,.11) 1px,transparent 1.25px)}html[data-theme="dark"] .case:nth-child(odd){background-color:transparent;background-image:none}}
@media(max-width:520px){html[data-theme="dark"] body:before{background:radial-gradient(ellipse 126% 112% at 50% 49%,transparent 70%,rgba(0,0,0,.09) 100%)}html[data-theme="dark"] body:after{background:radial-gradient(ellipse 92% 76% at 50% 45%,rgba(255,255,255,.032),transparent 74%)}}
@media(forced-colors:active){html[data-theme="dark"] .page-grid,html[data-theme="dark"] .case,html[data-theme="dark"] .skill-group,html[data-theme="dark"] .dark,html[data-theme="dark"] .hero:before{background-image:none}html[data-theme="dark"] body:before,html[data-theme="dark"] body:after{display:none}}

/* Edge-only 90s composition: flat geometry and restrained translucent glass. */
body{isolation:isolate}
main,.site-footer{position:relative;z-index:1}
.edge-art{--edge-pink:#df91bc;--edge-violet:#a58cdf;--edge-cyan:#75c8df;--edge-mint:#88dbcb;--edge-yellow:#eadb67;position:fixed;inset:var(--header-height,82px) 0 0;z-index:0;overflow:hidden;pointer-events:none;contain:layout paint;opacity:.68}
html[data-theme="dark"] .edge-art{--edge-pink:#ec9ac7;--edge-violet:#b19aeb;--edge-cyan:#83d0e6;--edge-mint:#96e3d4;--edge-yellow:#f1df72;opacity:.78}
.edge-shape{--shape-x:0px;--shape-y:0px;--edge-rotate:0deg;position:absolute;display:block;transform:translate3d(var(--shape-x),var(--shape-y),0) rotate(var(--edge-rotate));transform-origin:center;transition:transform .18s ease-out;will-change:transform;filter:saturate(.88)}
.edge-shape--triangle{left:-72px;top:16%;width:112px;aspect-ratio:1;background:linear-gradient(150deg,var(--edge-pink),#c977a8);clip-path:polygon(0 0,100% 50%,0 100%);--edge-rotate:-7deg}
.edge-shape--zig{right:-62px;top:18%;width:105px;height:154px;background:linear-gradient(180deg,var(--edge-mint),#67c8b9);clip-path:polygon(4% 0,100% 0,58% 29%,100% 48%,58% 72%,100% 100%,3% 100%,45% 72%,2% 49%,45% 28%);--edge-rotate:4deg}
.edge-shape--orb{left:-50px;top:2%;width:96px;aspect-ratio:1;border-radius:50%;background:linear-gradient(135deg,rgba(241,223,114,.56),rgba(177,154,235,.48) 66%,rgba(117,200,223,.22));border:1px solid rgba(255,255,255,.38);box-shadow:inset 8px 8px 18px rgba(255,248,194,.16),inset -11px -12px 22px rgba(67,47,121,.2);-webkit-backdrop-filter:blur(7px) saturate(1.18);backdrop-filter:blur(7px) saturate(1.18)}
.edge-shape--bars{left:-4px;bottom:12%;width:12px;height:100px;background:var(--edge-violet);box-shadow:26px 14px 0 var(--edge-violet);--edge-rotate:13deg}
.edge-shape--glass-pill{right:-64px;top:45%;width:104px;height:32px;border:1px solid rgba(255,255,255,.38);border-radius:10px;background:linear-gradient(115deg,rgba(223,145,188,.44),rgba(177,154,235,.33) 55%,rgba(117,200,223,.28));box-shadow:inset 6px 6px 14px rgba(255,255,255,.13),inset -8px -8px 16px rgba(85,55,116,.15);-webkit-backdrop-filter:blur(8px) saturate(1.2);backdrop-filter:blur(8px) saturate(1.2);--edge-rotate:-16deg}
.edge-shape--glass-disc{left:-30px;top:66%;width:72px;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.38);background:linear-gradient(140deg,rgba(117,200,223,.42),rgba(136,219,203,.25) 52%,rgba(165,140,223,.32));box-shadow:inset 7px 7px 15px rgba(255,255,255,.13),inset -8px -9px 16px rgba(58,72,132,.16);-webkit-backdrop-filter:blur(7px) saturate(1.18);backdrop-filter:blur(7px) saturate(1.18)}
.edge-shape--glass-diamond{right:-53px;top:62%;width:84px;aspect-ratio:1;border:1px solid rgba(255,255,255,.38);border-radius:15px;background:linear-gradient(145deg,rgba(231,225,255,.38),rgba(165,140,223,.42) 52%,rgba(117,200,223,.26));box-shadow:inset 8px 8px 17px rgba(255,255,255,.14),inset -10px -10px 19px rgba(66,58,133,.17);-webkit-backdrop-filter:blur(9px) saturate(1.2);backdrop-filter:blur(9px) saturate(1.2);--edge-rotate:38deg}

@keyframes edge-float-left{
  0%,100%{translate:0 0;rotate:0deg;scale:1}
  26%{translate:4px -16px;rotate:-2.5deg;scale:1.025}
  56%{translate:-3px 9px;rotate:1.8deg;scale:.99}
  81%{translate:3px -5px;rotate:-1deg;scale:1.012}
}
@keyframes edge-float-right{
  0%,100%{translate:0 0;rotate:0deg;scale:1}
  29%{translate:-4px 14px;rotate:2.3deg;scale:1.02}
  58%{translate:3px -17px;rotate:-1.7deg;scale:.992}
  84%{translate:-3px 5px;rotate:.9deg;scale:1.014}
}
@media(prefers-reduced-motion:no-preference){
  .edge-shape{animation:edge-float-left 8.4s cubic-bezier(.45,.05,.55,.95) infinite}
  .edge-shape--zig,.edge-shape--glass-pill,.edge-shape--glass-diamond{animation-name:edge-float-right}
  .edge-shape:nth-child(2n){animation-duration:10.2s;animation-delay:-4.3s}
  .edge-shape:nth-child(3n){animation-duration:7.1s;animation-delay:-2.6s}
}
@media(max-width:900px){
  .edge-art{opacity:.6}
  html[data-theme="dark"] .edge-art{opacity:.68}
  .edge-shape--triangle{left:-57px;top:18%;width:82px}
  .edge-shape--zig,.edge-shape--bars{display:none}
  .edge-shape--orb{left:-54px;top:2%;width:74px}
  .edge-shape--glass-pill{right:-62px;top:43%;width:78px;height:27px}
  .edge-shape--glass-disc{left:-44px;top:69%;width:60px}
  .edge-shape--glass-diamond{right:-56px;top:62%;width:68px;border-radius:12px}
}
@media(max-width:700px){
  .edge-shape--triangle{left:-50px;top:20%;width:68px}
  .edge-shape--orb{left:-42px;top:2%;width:62px}
  .edge-shape--glass-pill{right:-58px;top:43%;width:70px;height:24px}
  .edge-shape--glass-disc{left:-40px;top:70%;width:54px}
  .edge-shape--glass-diamond{right:-54px;top:63%;width:62px;border-radius:11px}
}
@media(prefers-reduced-motion:reduce){.edge-shape{--shape-x:0px!important;--shape-y:0px!important;translate:none!important;rotate:none!important;scale:none!important;animation:none;transition:none;will-change:auto}}
@media(prefers-reduced-transparency:reduce){.edge-shape--orb,.edge-shape--glass-pill,.edge-shape--glass-disc,.edge-shape--glass-diamond{-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(forced-colors:active),print{.edge-art{display:none}}

/* Reusable character sprite: one quiet placement, with expressions tied to project intent. */
.section-head{position:relative}
.work-mascot{position:absolute;left:clamp(2px,.7vw,12px);bottom:-18px;width:clamp(132px,11vw,168px);aspect-ratio:264/260;margin:0;pointer-events:none;z-index:2;transform:rotate(-5deg);transform-origin:50% 82%;filter:drop-shadow(3px 4px 0 rgba(18,19,19,.12))}
.work-mascot img{display:block;width:100%;height:100%;object-fit:contain}

@keyframes work-mascot-bob{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-4px,0)}
}
@keyframes work-mascot-pop{
  0%{transform:translate3d(0,0,0) scale(1)}
  48%{transform:translate3d(2px,-7px,0) scale(1.075)}
  100%{transform:translate3d(0,0,0) scale(1)}
}

@media(prefers-reduced-motion:no-preference){
  .work-mascot:not(.is-reacting) img{animation:work-mascot-bob 4.8s ease-in-out infinite}
  .work-mascot.is-reacting img{animation:work-mascot-pop .34s cubic-bezier(.22,1,.36,1)}
}
@media(max-width:850px){.work-mascot{left:auto;right:2px;top:-30px;bottom:auto;width:110px;transform:rotate(5deg)}}
@media(max-width:520px){.work-mascot{top:-22px;right:-3px;width:90px}}
@media(forced-colors:active){.work-mascot{display:none}}

/* Two more small character moments across the remaining pages. */
.page-sprite{margin:0;pointer-events:none;z-index:2;filter:drop-shadow(3px 4px 0 rgba(18,19,19,.12));transform-origin:50% 82%}
.page-sprite img{display:block;width:100%;height:100%;object-fit:contain}
.story{position:relative}
.page-sprite--about{position:absolute;right:4%;top:-16px;width:clamp(140px,12vw,184px);aspect-ratio:264/260;transform:rotate(6deg)}
.contact-page{position:relative}
.contact-page>.eyebrow{grid-column:1;grid-row:1}
.contact-page h1{grid-column:1/4;grid-row:2}
.contact-page .contact-intro,.contact-page .contact-details{grid-row:3}
.page-sprite--contact{position:relative;grid-column:1;grid-row:3;align-self:end;justify-self:start;width:clamp(142px,12vw,184px);aspect-ratio:264/260;transform:rotate(-6deg)}

@media(prefers-reduced-motion:no-preference){
  .page-sprite:not(.is-reacting) img{animation:work-mascot-bob 5.4s ease-in-out infinite}
  .page-sprite.is-reacting img{animation:work-mascot-pop .34s cubic-bezier(.22,1,.36,1)}
}
@media(max-width:850px){
  .page-sprite--about{right:1%;top:-16px;width:126px}
  .contact-page h1{grid-column:1/3}
  .page-sprite--contact{grid-column:1;grid-row:4;width:126px;margin-top:28px}
}
@media(max-width:520px){
  .page-sprite--about{position:relative;right:auto;top:auto;width:98px;margin:-20px 0 4px auto;transform:rotate(5deg)}
  .contact-page h1{grid-column:1}
  .contact-page .contact-intro{grid-row:3}
  .page-sprite--contact{grid-column:1;grid-row:4;width:96px;margin:26px 0 0;transform:rotate(-5deg)}
  .contact-page .contact-details{grid-row:5}
}
@media(forced-colors:active){.page-sprite{display:none}}

/* Page-opening mascot sequence. The early HTML veil prevents a first-paint flash. */
html.intro-pending,html.intro-pending body{overflow:hidden}
html.intro-pending:not(.intro-ready):before{content:"";position:fixed;inset:0;z-index:1999;background:var(--bg)}
.site-intro{position:fixed;inset:0;z-index:998;display:grid;place-items:center;overflow:hidden;cursor:wait;isolation:isolate}
.site-intro__backdrop{position:absolute;inset:0;z-index:-1;background:var(--bg)}
.site-intro__backdrop:before{content:"";position:absolute;inset:0;background-image:linear-gradient(to right,transparent calc(25% - .5px),rgba(127,127,127,.18) 25%,transparent calc(25% + .5px),transparent calc(50% - .5px),rgba(127,127,127,.18) 50%,transparent calc(50% + .5px),transparent calc(75% - .5px),rgba(127,127,127,.18) 75%,transparent calc(75% + .5px)),radial-gradient(circle,rgba(127,127,127,.16) 1px,transparent 1.2px);background-size:100% 100%,10px 10px;opacity:.38}
.site-intro__traveler{position:relative;width:clamp(170px,18vw,240px);aspect-ratio:916/830;opacity:0;overflow:visible;will-change:transform,opacity;transform:rotate(-18deg) scale(.72);transform-origin:52% 62%}
.site-intro__logo{position:absolute;top:-43.01%;left:-3.38%;display:block;width:109.17%;height:auto;max-width:none;object-fit:contain;filter:saturate(.95) contrast(1.03)}
.site-intro__progress{position:absolute;left:50%;top:calc(50% + clamp(108px,13vw,150px));width:clamp(90px,10vw,140px);height:3px;background:var(--accent);transform-origin:left center}
html[data-theme="dark"].intro-pending:not(.intro-ready):before,html[data-theme="dark"] .site-intro__backdrop{background-color:var(--bg);background-image:linear-gradient(rgba(9,11,11,.34),rgba(9,11,11,.34)),var(--main-dark-background);background-size:cover;background-position:center;background-repeat:no-repeat}
.intro-home .hero-character.intro-target-awaiting{visibility:hidden;opacity:1;animation-play-state:paused!important;transition:none!important}
.intro-home .hero-character.intro-target-visible{visibility:visible;opacity:1;transition:none!important}
.hero-character{transition:transform .18s ease-out,opacity .16s ease}
.intro-pending:not(.intro-exiting) .reveal.visible{opacity:0;transform:translateY(16px)}
.intro-pending:not(.intro-exiting) .kinetic-word,.intro-pending:not(.intro-exiting) .kinetic-item{animation-play-state:paused!important}
@media(max-width:520px){.site-intro__traveler{width:clamp(132px,42vw,156px)}.site-intro__progress{top:calc(50% + 96px)}}
@media(prefers-reduced-motion:reduce){.site-intro,html.intro-pending:not(.intro-ready):before{display:none!important}.intro-home .hero-character.intro-target-awaiting{opacity:1}}

/* Quiet fade between internal pages; the mascot intro remains for fresh opens. */
html:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:2500;
  visibility:hidden;
  pointer-events:none;
  background-color:var(--bg);
  opacity:0;
  will-change:opacity
}
html.page-transition-leaving,html.page-transition-leaving body{overflow:hidden}
html.page-transition-leaving:after,html.page-transition-arriving:after{visibility:visible;pointer-events:auto}
html.page-transition-leaving:after{opacity:1;transition:opacity .26s ease-in-out}
html.page-transition-arriving:after{opacity:1}
html.page-transition-arriving.page-transition-arrival-active:after{opacity:0;transition:opacity .38s ease-in-out}
@media(prefers-reduced-motion:reduce){html:after{display:none!important}}
@media(forced-colors:active){html:after{background:Canvas}}

/* Responsive hardening: bounded widescreen frame and min-content-safe grids. */
:root{--frame-pad:max(var(--pad),calc((100vw - 1600px)/2));--header-height:82px}
html{max-width:100%;overflow-x:clip;scrollbar-gutter:stable}
body{max-width:100%;overflow-x:clip}
img{max-width:100%}
.site-header,.hero,.section,.page-title,.contact-page,.site-footer{padding-left:var(--frame-pad);padding-right:var(--frame-pad)}
.page-grid{background-size:calc(100% - var(--frame-pad)*2) 100%,100% 192px}
.hero{min-height:min(calc(100svh - var(--header-height)),1100px)}
.hero:before{right:var(--frame-pad);width:calc((100% - var(--frame-pad)*2)/4)}
.hero-character{right:var(--frame-pad)}
.site-footer:before{right:var(--frame-pad);width:calc((100% - var(--frame-pad)*2)/4)}
.split>*:first-child{padding-left:var(--frame-pad)}
.split>*:last-child{padding-right:var(--frame-pad)}
.site-header{position:sticky;top:0;z-index:100}
.hero>*,.section-head>*,.page-title>*,.story>*,.story-copy>*,.project-row>*,.timeline-item>*,.contact-page>*,.case-grid>*,.skills-grid>*{min-width:0}
.project-row h3,.case h2,.timeline-item h3,.skill-group h3,.film-title h3{overflow-wrap:anywhere}
.contact-page{grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr)}
.footer-links{min-width:0;flex-wrap:wrap;row-gap:14px}

@media(max-width:1024px){
  body.menu-open{overflow:hidden}
  .site-header{grid-template-columns:minmax(0,1fr) 58px;column-gap:8px}
  .menu-toggle{grid-column:2;display:grid!important;place-items:center;width:58px;height:48px;justify-self:end;position:relative;z-index:11;overflow:hidden;border:1px solid var(--line);padding:0;transition:background-color .2s ease,border-color .2s ease,transform .2s cubic-bezier(.22,1,.36,1)}
  .menu-toggle:before,.menu-toggle:after{grid-area:1/1;font:700 9px/1 var(--head);letter-spacing:.08em;text-transform:uppercase;transition:opacity .16s ease,transform .28s cubic-bezier(.22,1,.36,1)}
  .menu-toggle:before{content:"Close";opacity:0;transform:translateY(8px)}
  .menu-toggle:after{content:"Menu";opacity:1;transform:none}
  .menu-toggle[aria-expanded="true"]{background:var(--panel);border-color:var(--accent)}
  .menu-toggle[aria-expanded="true"]:before{opacity:1;transform:none}
  .menu-toggle[aria-expanded="true"]:after{opacity:0;transform:translateY(-8px)}
  .menu-toggle:active{transform:scale(.96)}
  .menu-toggle span,.menu-toggle b{display:none}
  .nav{position:absolute;grid-column:1/-1;top:var(--header-height);left:0;right:0;display:flex;height:auto;max-height:calc(100dvh - var(--header-height));overflow-y:auto;overscroll-behavior:contain;flex-direction:column;align-items:stretch;visibility:hidden;pointer-events:none;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(-10px);transform-origin:top;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(18,19,19,.1);transition:clip-path .38s cubic-bezier(.22,1,.36,1),transform .38s cubic-bezier(.22,1,.36,1),opacity .18s ease,visibility 0s linear .38s;will-change:clip-path,transform,opacity}
  .nav.open{visibility:visible;pointer-events:auto;opacity:1;clip-path:inset(0);transform:none;transition-delay:0s}
  .nav a{--menu-delay:70ms;height:56px;padding:0 var(--frame-pad);border-left:0;border-top:1px solid var(--line);justify-items:start;opacity:0;transform:translateY(-9px);transition:opacity .18s ease,transform .3s cubic-bezier(.22,1,.36,1),background-color .2s ease,color .2s ease}
  .nav a:nth-child(2){--menu-delay:110ms}
  .nav a:nth-child(3){--menu-delay:150ms}
  .nav a:nth-child(4){--menu-delay:190ms}
  .nav a:nth-child(5){--menu-delay:230ms}
  .nav a:nth-child(6){--menu-delay:270ms}
  .nav.open a{opacity:1;transform:none;transition-delay:var(--menu-delay),var(--menu-delay),0s,0s}
  .nav a:last-child{border-right:0}
}

@media(max-width:1024px) and (prefers-reduced-motion:reduce){
  .nav,.nav a,.menu-toggle,.menu-toggle:before,.menu-toggle:after{transition:none!important}
  .nav,.nav a{transform:none}
}

@media(max-width:850px){
  .hero:before{right:var(--frame-pad);width:calc((100% - var(--frame-pad)*2)/2)}
  .hero-character{right:calc(var(--frame-pad) + 12px);will-change:auto}
  .site-footer:before{right:var(--frame-pad);width:calc((100% - var(--frame-pad)*2)/2)}
  .project-row{grid-template-columns:minmax(30px,.3fr) minmax(90px,.8fr) minmax(0,1.7fr) minmax(20px,.2fr);gap:clamp(10px,2vw,20px)}
  .contact-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

@media(max-width:700px){
  .section-head,.page-title{grid-template-columns:minmax(0,1fr)}
  .section-head h2,.section-head p:last-child,.page-title h1,.page-title>p:last-child{grid-column:1}
  .section-head p:last-child,.page-title>p:last-child{max-width:38rem;margin-top:26px}
  .story-copy{grid-template-columns:minmax(0,1fr);gap:28px}
  .footer-bottom{display:block}
  .footer-links{margin-bottom:30px}
}

@media(max-width:520px){
  :root{--header-height:70px}
  .site-header{height:var(--header-height)}
  .nav{top:var(--header-height)}
  .menu-toggle{display:grid!important;place-items:center}
  .hero{min-height:calc(100svh - var(--header-height));padding-top:clamp(48px,11svh,76px);padding-bottom:36px;row-gap:28px}
  .hero h1{font-size:clamp(72px,24vw,92px);margin:clamp(92px,16svh,132px) 0 clamp(52px,10svh,82px)}
  .hero-intro{font-size:clamp(20px,6.3vw,27px)}
  .hero-meta{width:min(100%,340px);max-width:none}
  .hero:before{right:var(--frame-pad);width:calc((100% - var(--frame-pad)*2)/2)}
  .hero-character{top:22%;right:calc(var(--frame-pad) + 6px);width:clamp(138px,39vw,158px)}
  .section{padding-top:clamp(56px,15vw,75px);padding-bottom:clamp(56px,15vw,75px)}
  .section-head{margin-bottom:48px}
  .section-head h2{font-size:clamp(46px,14vw,60px)}
  .story h2{font-size:clamp(44px,13.5vw,58px)}
  .page-title{min-height:clamp(420px,68svh,590px);padding-top:56px;padding-bottom:38px}
  .page-title h1{font-size:clamp(48px,15vw,62px);margin:52px 0 20px}
  .project-row{grid-template-columns:30px minmax(0,1fr) 20px;gap:10px;min-height:112px;padding:18px 0}
  .project-row .kind{display:none}
  .project-row h3{font-size:clamp(24px,8.2vw,34px)}
  .project-row .open{font-size:18px}
  .case,.media-role-grid .case{min-height:0;padding:clamp(22px,7vw,30px)}
  .case h2,.media-role-grid .case h2{font-size:clamp(28px,8.5vw,36px);margin:clamp(42px,12vw,58px) 0 16px}
  .case p{margin-top:0}
  .media-film-list .project-row{grid-template-columns:26px minmax(0,1fr) 18px;gap:8px}
  .film-title{grid-template-columns:clamp(62px,21vw,82px) minmax(0,1fr);gap:8px}
  .media-film-list .project-row h3{font-size:clamp(18px,5.8vw,23px);line-height:1.05}
  .work-mascot{position:relative;inset:auto;width:clamp(96px,30vw,118px);margin:24px 0 -8px auto;transform:rotate(5deg)}
  .contact-page{grid-template-columns:minmax(0,1fr);align-content:start;row-gap:clamp(30px,8vw,46px);padding-top:54px;padding-bottom:42px}
  .contact-page h1{font-size:clamp(44px,16vw,64px);line-height:.84;margin:clamp(44px,9svh,72px) 0 0}
  .contact-page .contact-intro{font-size:clamp(20px,6vw,27px)}
  .page-sprite--contact{margin-top:0}
  .contact-page .contact-details{margin-top:0}
  .site-footer{min-height:0;gap:clamp(70px,18vw,110px);padding-top:52px;padding-bottom:30px}
  .site-footer h2{font-size:clamp(42px,13vw,58px);max-width:90%;overflow-wrap:anywhere}
}

@media(max-width:380px){
  :root{--pad:16px;--header-height:64px}
  .site-header{height:var(--header-height);grid-template-columns:minmax(0,1fr) 52px;column-gap:5px}
  .wordmark{font-size:27px}
  .menu-toggle{width:52px;height:44px}
  .nav{top:var(--header-height);max-height:calc(100dvh - var(--header-height))}
  .media-film-list .project-row{grid-template-columns:24px minmax(0,1fr)}
  .media-film-list .project-row .open{display:none}
  .film-title{grid-template-columns:58px minmax(0,1fr);gap:7px}
  .media-film-list .project-row h3{font-size:clamp(17px,5.7vw,20px)}
  .contact-page h1{font-size:clamp(43px,15.5vw,56px)}
}

@media(max-height:720px) and (min-width:521px){
  .hero{padding-top:clamp(38px,7vh,54px);padding-bottom:30px}
  .hero h1{font-size:clamp(96px,28vh,180px);margin:3vh 0 5vh}
  .hero-character{top:15%;width:clamp(190px,32vh,240px)}
  .page-title{min-height:calc(100svh - var(--header-height));padding-top:clamp(38px,7vh,58px);padding-bottom:34px}
  .contact-page{padding-top:clamp(38px,7vh,58px);padding-bottom:34px}
  .contact-page h1{font-size:clamp(88px,25vh,150px);margin:3vh 0 5vh}
}

@media(pointer:coarse){.hero-character{will-change:auto}}

/* Curated raster work: editorial crops sized to stay comfortably below source resolution. */
.case-visual,.about-portrait,.media-design-shot{position:relative;margin:0;overflow:hidden;border:1px solid var(--line);background:var(--dark)}
.case-visual:after,.about-portrait:after,.media-design-shot:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,255,255,.18) .65px,transparent .9px);background-size:6px 6px;mix-blend-mode:soft-light;opacity:.22}
.case-visual img,.about-portrait img,.media-design-shot img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.22,1,.36,1),filter .45s ease}

/* Project cards use the image as one grid module, while keeping the project text dominant. */
.case-visual{width:100%;margin-top:clamp(28px,3.2vw,44px);box-shadow:8px 8px 0 rgba(36,115,135,.13)}
.case-visual--landscape,.case-visual--cad{aspect-ratio:16/10}
.case-visual--limited{max-width:620px}
.case-visual--poster{width:min(100%,420px);aspect-ratio:1;align-self:flex-start}
.case-visual--cad{background:#fff}
.case-visual--cad img{object-fit:contain;padding:clamp(5px,.7vw,10px)}
.case--visual h2{margin:clamp(34px,4vw,56px) 0 20px}

/* Projects use one compact thumbnail beside the title and one shared card height. */
.projects-grid{grid-auto-rows:1fr}
.projects-grid .case{display:grid;grid-template-columns:minmax(0,1fr) clamp(132px,13vw,180px);grid-template-rows:auto auto minmax(0,1fr) auto auto;column-gap:clamp(18px,2vw,28px);min-height:470px;height:100%}
.projects-grid .case-top{grid-column:1/-1;grid-row:1}
.projects-grid .case h2{grid-column:1;grid-row:2;align-self:center;margin:clamp(30px,3.2vw,42px) 0 22px;font-size:clamp(34px,3.6vw,54px)}
.projects-grid .case:not(.case--visual) h2{grid-column:1/-1}
.projects-grid .case-visual{grid-column:2;grid-row:2;align-self:center;width:100%;max-width:none;aspect-ratio:4/3;margin:clamp(30px,3.2vw,42px) 0 22px;box-shadow:6px 6px 0 rgba(36,115,135,.13)}
.projects-grid .case>p{grid-column:1/-1;grid-row:3;align-self:start;margin:0}
.projects-grid .case>.tag-row{grid-column:1/-1;grid-row:4}
.projects-grid .case>.text-link{grid-column:1/-1;grid-row:5;justify-self:start}

/* Work history leads with employment, while extracurricular leadership stays distinct. */
.experience-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.experience-card{position:relative;min-height:390px;padding:clamp(28px,3vw,42px);border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.experience-card--primary{background-color:var(--panel);background-image:radial-gradient(circle,rgba(36,115,135,.2) 1px,transparent 1.25px);background-size:9px 9px}
.experience-card--primary:after{content:"";position:absolute;right:clamp(22px,3vw,42px);top:78px;width:62px;height:62px;border:2px solid var(--accent);border-radius:50%;opacity:.55;z-index:0}
.experience-card>*{position:relative;z-index:1}
.experience-card__meta{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font:700 10px/1.35 var(--head);letter-spacing:.11em;text-transform:uppercase}
.experience-card__meta span:last-child{text-align:right}
.experience-card__body{margin-top:auto;padding-top:clamp(70px,8vw,120px)}
.experience-company{margin:0 0 13px;color:var(--accent);font:700 11px/1.3 var(--head);letter-spacing:.1em;text-transform:uppercase}
.experience-card h3{max-width:760px;margin:0 0 20px;font:700 clamp(38px,4.5vw,66px)/.92 var(--title);letter-spacing:-.045em}
.experience-card__body>p:last-child{max-width:760px;margin:0;color:var(--muted);font-size:clamp(16px,1.35vw,19px);line-height:1.6}
.experience-subhead{display:grid;grid-template-columns:1fr 3fr;align-items:end;gap:30px;padding:clamp(62px,8vw,100px) 0 28px}
.experience-subhead h3{margin:0;font:700 clamp(30px,3.5vw,50px)/1 var(--title);letter-spacing:-.035em}
.experience-timeline .timeline-item{grid-template-columns:1fr 2fr 1fr}

/* A single portrait gives the About story a human anchor without filling the page with photos. */
.about-portrait{grid-column:1;width:min(100%,360px);aspect-ratio:3/4;align-self:start;margin-top:60px;box-shadow:12px 12px 0 rgba(189,101,92,.18)}
.about-portrait img{object-position:50% 28%}
.about-story .story-copy{grid-column:2/4}

/* Roles align directly to the page grid: number, title, evidence, description. */
.robotics-systems .timeline-item{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:0;align-items:center;min-height:210px;padding:24px 0}
.robotics-systems .timeline-item h3{grid-column:2;padding-left:clamp(16px,2vw,30px)}
.robotics-systems .timeline-item>p{grid-column:4;padding-left:clamp(16px,2vw,30px);padding-right:clamp(0px,1vw,16px)}
.timeline-media{position:relative;grid-column:3;width:min(calc(100% - clamp(32px,4vw,64px)),280px);aspect-ratio:16/10;margin:0 0 0 clamp(16px,2vw,30px);overflow:hidden;border:1px solid var(--line);background:var(--dark)}
.timeline-media:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,255,255,.17) .65px,transparent .9px);background-size:6px 6px;mix-blend-mode:soft-light;opacity:.2}
.timeline-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.22,1,.36,1),filter .4s ease}
.timeline-media--contain{background:var(--panel)}
.timeline-media--contain img{object-fit:contain;padding:7px}

/* Media identity samples align to the four-column site grid. */
.media-design-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2vw,30px);margin-bottom:clamp(60px,7vw,92px)}
.media-design-shot{aspect-ratio:1}
.media-design-shot--website{grid-column:span 2;aspect-ratio:auto;min-height:0;align-self:stretch}
.media-design-shot--website img{position:absolute;inset:0;object-position:50% 46%}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .case:hover .case-visual img,.about-portrait:hover img,.media-design-shot:hover img,.timeline-item:hover .timeline-media img{transform:scale(1.018);filter:saturate(1.03) contrast(1.015)}
}

@media(max-width:850px){
  .experience-grid{grid-template-columns:minmax(0,1fr)}
  .experience-card{min-height:340px}
  .experience-card__body{padding-top:70px}
  .experience-subhead{grid-template-columns:1fr 2fr}
  .about-portrait{grid-column:1;width:min(72vw,340px);margin-top:38px}
  .about-story .story-copy{grid-column:1;margin-top:22px}
  .media-design-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-design-shot--website{aspect-ratio:2/1}
  .robotics-systems .timeline-item{grid-template-columns:54px minmax(0,1fr);column-gap:18px;row-gap:18px;align-items:start;min-height:0;padding:30px 0}
  .robotics-systems .timeline-item .year{grid-column:1;grid-row:1}
  .robotics-systems .timeline-item h3{grid-column:2;grid-row:1;padding-left:0}
  .timeline-media{grid-column:2;grid-row:2;width:min(100%,360px);max-width:none;margin:0}
  .robotics-systems .timeline-item>p{grid-column:2;grid-row:3;padding:0}
}

@media(max-width:650px){
  .robotics-systems .timeline-item{grid-template-columns:38px minmax(0,1fr);column-gap:14px}
  .timeline-media{width:min(100%,320px)}
}

@media(max-width:520px){
  .case-visual{margin-top:24px;box-shadow:6px 6px 0 rgba(36,115,135,.12)}
  .case-visual--poster{width:100%}
  .case--visual h2{margin:36px 0 16px}
  .projects-grid .case{grid-template-columns:minmax(0,1fr) clamp(88px,28vw,112px);column-gap:14px;min-height:0}
  .projects-grid .case h2{margin:26px 0 20px;font-size:clamp(27px,8vw,34px)}
  .projects-grid .case-visual{aspect-ratio:4/3;margin:26px 0 20px;box-shadow:4px 4px 0 rgba(36,115,135,.12)}
  .experience-card{min-height:0;padding:26px}
  .experience-card__meta{display:grid;gap:8px}
  .experience-card__meta span:last-child{text-align:left}
  .experience-card__body{padding-top:58px}
  .experience-card h3{font-size:clamp(34px,11vw,46px)}
  .experience-subhead{grid-template-columns:minmax(0,1fr);gap:18px;padding:58px 0 24px}
  .experience-timeline .timeline-item{grid-template-columns:minmax(0,1fr)}
  .about-portrait{width:min(82vw,310px);margin:28px 0 14px;box-shadow:8px 8px 0 rgba(189,101,92,.16)}
  .media-design-grid{grid-template-columns:minmax(0,1fr);gap:22px;margin-bottom:52px}
  .media-design-shot--website{grid-column:auto;aspect-ratio:16/9}
  .robotics-systems .timeline-item{grid-template-columns:minmax(0,1fr);row-gap:16px}
  .robotics-systems .timeline-item .year{grid-column:1;grid-row:1}
  .robotics-systems .timeline-item h3{grid-column:1;grid-row:2}
  .timeline-media{grid-column:1;grid-row:3;width:100%}
  .robotics-systems .timeline-item>p{grid-column:1;grid-row:4}
}

@media(prefers-reduced-motion:reduce){.case-visual img,.about-portrait img,.media-design-shot img,.timeline-media img{transition:none;transform:none!important}}

/* Contact is a single-screen composition: no footer or extra scroll required. */
.contact-page{height:calc(100svh - var(--header-height));min-height:0;padding-top:clamp(48px,6vh,72px);padding-bottom:clamp(140px,18vh,200px)}
.contact-page>.eyebrow,.contact-page h1,.contact-page .contact-intro{margin-block:0}
.contact-page h1{font-size:clamp(68px,min(10.5vw,18vh),150px);line-height:.82}
.contact-details a{min-width:0;overflow-wrap:anywhere}

@media(max-width:850px){
  .contact-page{padding-top:clamp(28px,4vh,42px);padding-bottom:clamp(80px,12vh,112px)}
  .page-sprite--contact{position:absolute;grid-column:auto;grid-row:auto;left:auto;right:var(--frame-pad);top:clamp(24px,5vh,44px);bottom:auto;width:clamp(82px,13vw,112px);margin:0}
}

@media(max-width:520px){
  .contact-page{height:calc(100svh - var(--header-height));min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto minmax(0,1fr);align-content:stretch;row-gap:clamp(13px,2svh,17px);padding-top:clamp(18px,3svh,26px);padding-bottom:clamp(48px,7svh,62px)}
  .contact-page>.eyebrow{grid-column:1;grid-row:1;margin:0}
  .contact-page h1{grid-column:1;grid-row:2;margin:0;font-size:clamp(40px,13vw,49px);line-height:.84}
  .contact-page .contact-intro{grid-column:1;grid-row:3;margin:0;font-size:clamp(18px,5vw,20px);line-height:1.32}
  .page-sprite--contact{position:absolute;grid-column:auto;grid-row:auto;left:auto;right:var(--frame-pad);top:auto;bottom:clamp(142px,19svh,160px);width:clamp(68px,20vw,82px);margin:0}
  .contact-page .contact-details{grid-column:1;grid-row:4;align-self:end;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:16px;margin:0}
  .contact-details a{padding:10px 0;font-size:10px}
  .contact-details a:last-child{grid-column:1/-1}
}

@media(max-width:520px) and (max-height:680px){
  .contact-page{row-gap:10px;padding-top:14px;padding-bottom:24px}
  .contact-page h1{font-size:clamp(38px,12.5vw,46px)}
  .contact-page .contact-intro{font-size:16px;line-height:1.28}
  .page-sprite--contact{bottom:104px;width:62px}
  .contact-details a{padding:7px 0;font-size:9px}
}

@media(max-height:720px) and (min-width:851px){
  .contact-page{padding-top:28px;padding-bottom:clamp(60px,10vh,80px)}
  .contact-page h1{font-size:clamp(72px,min(9vw,16vh),120px)}
  .contact-details a{padding:10px 0}
}

/* Opening screens resolve as complete compositions before the first scroll. */
.hero{
  height:calc(100svh - var(--header-height));
  min-height:620px;
  grid-template-columns:minmax(0,2.35fr) minmax(250px,.65fr);
  grid-template-rows:auto minmax(0,1fr) auto;
  column-gap:clamp(36px,5vw,84px);
  row-gap:clamp(16px,2.5vh,30px);
  align-content:stretch;
  padding-top:clamp(38px,5.5vh,68px);
  padding-bottom:clamp(28px,4.5vh,48px)
}
.hero-label{grid-column:1/-1;grid-row:1;margin:0;align-self:start}
.hero h1{
  grid-column:1/-1;
  grid-row:2;
  align-self:center;
  width:min(100%,10ch);
  margin:0;
  font-size:clamp(100px,min(16vw,27vh),245px)
}
.hero h1 small{margin-bottom:clamp(12px,2.2vh,24px)}
.hero-intro{grid-column:1;grid-row:3;align-self:end;margin:0}
.hero-meta{
  grid-column:2;
  grid-row:3;
  align-self:end;
  justify-self:end;
  width:min(100%,300px);
  max-width:none;
  margin:0
}
.hero-meta .arrow-link{margin-top:18px}
.hero-character{
  position:relative;
  grid-column:2;
  grid-row:2;
  align-self:center;
  justify-self:end;
  top:auto;
  right:auto;
  left:auto
}

.page-title{
  position:relative;
  height:calc(100svh - var(--header-height));
  min-height:560px;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:auto minmax(0,1fr) auto;
  align-items:stretch;
  column-gap:0;
  padding-top:clamp(42px,6vh,72px);
  padding-bottom:clamp(34px,5vh,56px)
}
.page-title .eyebrow{grid-column:1;grid-row:1;align-self:start;margin:0}
.page-title h1{
  grid-column:2/4;
  grid-row:2;
  align-self:center;
  width:min(100%,10ch);
  margin:0;
  font-size:clamp(68px,min(8vw,18vh),118px)
}
.page-title>p:last-child{
  grid-column:4;
  grid-row:3;
  align-self:end;
  max-width:320px;
  margin:0
}
.page-title:after{
  content:"Scroll  ↓";
  grid-column:1;
  grid-row:3;
  align-self:end;
  color:var(--muted);
  font:700 9px/1 var(--head);
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  transition:opacity .24s ease,transform .24s ease,visibility 0s linear;
  pointer-events:none
}
.page-has-scrolled .page-title:after{opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .24s ease,transform .24s ease,visibility 0s linear .24s}
@media(prefers-reduced-motion:reduce){.page-title:after{transition:none}.page-has-scrolled .page-title:after{transform:none;transition:none}}
.page-title.dark:after{color:#c5cbc7}

@media(max-width:1024px){
  .page-title{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-title h1{grid-column:1/-1}
  .page-title>p:last-child{grid-column:2}
}

@media(max-width:700px){
  .page-title{
    height:calc(100svh - var(--header-height));
    min-height:520px;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr) auto;
    padding-top:clamp(30px,5.5svh,48px);
    padding-bottom:clamp(28px,5svh,42px)
  }
  .page-title .eyebrow{grid-column:1;grid-row:1}
  .page-title h1{
    grid-column:1;
    grid-row:2;
    align-self:center;
    width:min(100%,9ch);
    margin:0;
    font-size:clamp(52px,15vw,72px)
  }
  .page-title>p:last-child{
    grid-column:1;
    grid-row:3;
    width:min(100%,36rem);
    max-width:none;
    margin:0
  }
  .page-title:after{display:none}
}

@media(max-width:520px){
  .hero{
    height:calc(100svh - var(--header-height));
    min-height:600px;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr) auto auto;
    row-gap:clamp(14px,2.2svh,20px);
    padding-top:clamp(28px,4.5svh,40px);
    padding-bottom:clamp(22px,3.5svh,30px)
  }
  .hero-label{grid-column:1;grid-row:1;max-width:calc(100% - 72px);line-height:1.45}
  .hero h1{
    grid-column:1;
    grid-row:2;
    align-self:center;
    width:100%;
    margin:0;
    font-size:clamp(72px,min(24vw,15.5vh),92px)
  }
  .hero h1 small{font-size:clamp(17px,5vw,20px);margin:0 0 12px 3px}
  .hero-intro{
    grid-column:1;
    grid-row:3;
    width:min(100%,22rem);
    margin:0;
    font-size:clamp(20px,6.2vw,25px)
  }
  .hero-meta{
    grid-column:1;
    grid-row:4;
    justify-self:start;
    width:min(100%,340px);
    margin:0;
    padding:10px 12px;
    font-size:clamp(14px,4vw,16px);
    line-height:1.48
  }
  .hero-meta .arrow-link{margin-top:14px}
  .hero-character{
    position:absolute;
    grid-column:auto;
    grid-row:auto;
    align-self:auto;
    justify-self:auto;
    top:16%;
    right:calc(var(--frame-pad) + 2px);
    width:clamp(126px,35vw,148px)
  }
}

@media(max-width:520px) and (max-height:700px){
  .hero{
    min-height:calc(100svh - var(--header-height));
    row-gap:10px;
    padding-top:18px;
    padding-bottom:18px
  }
  .hero h1{font-size:clamp(64px,min(22vw,14vh),82px)}
  .hero h1 small{font-size:16px;margin-bottom:8px}
  .hero-intro{font-size:19px;line-height:1.2}
  .hero-meta{font-size:13px;line-height:1.38;padding:8px 10px}
  .hero-meta .arrow-link{margin-top:10px}
  .hero-character{top:14%;width:118px}
  .page-title{min-height:calc(100svh - var(--header-height));padding-top:24px;padding-bottom:24px}
  .page-title h1{font-size:clamp(48px,min(14vw,13vh),62px)}
  .page-title>p:last-child{font-size:14px;line-height:1.45}
}

@media(max-height:720px) and (min-width:521px){
  .hero{min-height:calc(100svh - var(--header-height));padding-top:28px;padding-bottom:26px;row-gap:12px}
  .hero h1{font-size:clamp(90px,min(15vw,24vh),150px)}
  .hero-meta{font-size:14px;line-height:1.4}
  .page-title{min-height:calc(100svh - var(--header-height));padding-top:30px;padding-bottom:30px}
  .page-title h1{font-size:clamp(62px,min(8vw,16vh),96px)}
}