@font-face{font-family:Jost;src:url(assets/jost-300.woff) format("woff");font-weight:300;font-display:swap}
@font-face{font-family:Jost;src:url(assets/jost-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url(assets/jost-500.woff) format("woff");font-weight:500;font-display:swap}
@font-face{font-family:Orbitron;src:url(assets/orbitron-500.woff) format("woff");font-weight:500;font-display:swap}
:root{--bg:#090d10;--panel:#10171b;--ink:#edf2ef;--muted:#a3afb0;--line:#2a3439;--accent:#b6ede2;--display:Orbitron,Arial,sans-serif;--body:Jost,"Century Gothic",Arial,sans-serif;--pad:clamp(22px,5vw,90px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}img,video{display:block;max-width:100%}p{margin:0 0 1.2em}h1,h2,h3{margin:0;font-weight:400}h2{font-size:clamp(40px,5.5vw,82px);line-height:1.05;letter-spacing:-.035em;font-weight:300}h2 em{font-style:normal;color:var(--accent)}.eyebrow{font-family:var(--display);font-weight:500;font-size:12px;letter-spacing:.12em;text-transform:uppercase;line-height:1.6}.section{padding:110px var(--pad);scroll-margin-top:0}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--accent);color:var(--bg);padding:10px}.skip:focus{top:10px}.header{position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:22px var(--pad);border-bottom:1px solid #ffffff20;background:#090d10d9;backdrop-filter:blur(15px)}.brand{font-family:var(--display);font-size:24px;white-space:nowrap}.brand>span:first-child{color:var(--accent);margin:0 3px}.brand-name{font-family:var(--body);font-size:14px;margin-left:20px}.header nav{display:flex;gap:27px;font-size:16px}.header nav a{position:relative}.header nav a:after{content:"";height:1px;position:absolute;bottom:-5px;left:0;right:100%;background:var(--accent);transition:right .3s}.header nav a:hover:after{right:0}.header-actions{display:flex;gap:25px;align-items:center;font-size:14px}.motion{color:var(--muted);font-size:13px;padding:4px 0}.cv-link{border-bottom:1px solid var(--ink);padding-bottom:3px}.hero{min-height:850px;min-height:100svh;position:relative;padding:125px var(--pad) 35px;display:flex;flex-direction:column;isolation:isolate;overflow:hidden}.hero-visual{position:absolute;inset:0 0 0 27%;z-index:-2;background:url(assets/shell-in-engine.webp) center/cover}.hero-visual video{width:100%;height:100%;object-fit:cover;opacity:.82}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#090d10 0%,#090d10a8 25%,#090d1010 70%),linear-gradient(0deg,#090d10 0%,transparent 25%,#090d1030 80%)}.hero-top,.hero-bottom{display:flex;justify-content:space-between;gap:25px}.hero-top{color:var(--muted)}.hero-main{padding:55px 0;flex:1;display:flex;flex-direction:column;justify-content:center}.hero-role{color:var(--accent);margin-bottom:22px}.hero h1{font-size:clamp(75px,10vw,160px);font-weight:300;line-height:.9;letter-spacing:-.045em}.hero h1 span{color:var(--accent)}.hero-intro{font-size:clamp(18px,1.5vw,23px);margin:30px 0 0;line-height:1.5}.hero-bottom{align-items:flex-end}.text-link{display:inline-flex;gap:35px;align-items:center;border-bottom:1px solid var(--line);padding:12px 0;font-size:16px}.plus{font-size:26px;font-weight:300;transition:transform .3s}.text-link:hover .plus,.hero-project:hover .plus{transform:rotate(90deg)}.hero-project{text-align:right}.hero-project>span{display:block}.hero-project>span:last-child{font-size:24px}.hero-project .eyebrow{color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:55px}.section-head .eyebrow{margin-bottom:22px;color:var(--muted)}.filters{display:flex;gap:6px;flex-wrap:wrap}.filters button{padding:9px 15px;border:1px solid var(--line);font-size:14px;border-radius:2px;transition:.25s}.filters button.active,.filters button:hover{background:var(--accent);color:#09100f;border-color:var(--accent)}.filters small{font-size:12px;margin-left:10px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:65px 28px}.project.featured{grid-column:1/-1}.project[hidden]{display:none}.project-open{width:100%;text-align:left;padding:0}.project-image{position:relative;overflow:hidden;background:var(--panel);aspect-ratio:1.4}.featured .project-image{aspect-ratio:2.2}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.22,1,.36,1),filter .8s;filter:saturate(.8)}.project-open:hover img{transform:scale(1.045);filter:saturate(1)}.image-label{position:absolute;top:20px;left:20px;background:#090d10cf;padding:6px 11px;font-size:12px;font-family:var(--display);letter-spacing:.06em}.open-circle{position:absolute;right:22px;bottom:22px;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:32px;font-weight:300;transition:background .3s,transform .4s}.project-open:hover .open-circle{background:var(--accent);transform:rotate(90deg)}.project-description{padding:24px 0 0;border-bottom:1px solid var(--line)}.project-description h3{font-size:clamp(30px,3vw,45px);line-height:1.1;letter-spacing:-.02em;margin-bottom:15px}.project-description p{color:var(--muted);font-size:18px}.project-meta{font-family:var(--display);font-size:12px;display:block;color:var(--muted);margin-bottom:22px}.featured .project-description{display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:start}.featured h3{font-family:var(--display);font-size:clamp(32px,4vw,60px)}.approach{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0c1216}.approach .section-head{align-items:flex-start}.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:12%;margin-top:75px}.large-copy{font-size:clamp(25px,2.2vw,34px);font-weight:300;line-height:1.35}.approach-copy>p:not(.large-copy),.about-copy>p:not(.large-copy){color:var(--muted)}.skills{display:flex;flex-wrap:wrap;gap:9px;margin-top:35px}.skills span{border-bottom:1px solid var(--line);padding:5px 0;margin-right:18px;font-size:14px}.research{border-left:1px solid var(--line);padding-left:45px;display:flex;flex-direction:column;justify-content:center}.research .eyebrow{color:var(--accent)}.research h3{font-size:clamp(28px,2.8vw,40px);font-weight:300;line-height:1.15;margin:20px 0}.research>p:not(.eyebrow){color:var(--muted)}.research-foot{font-size:13px;color:var(--muted);margin-top:15px}.practice-strip{border-top:1px solid var(--line);margin-top:80px;padding-top:45px;display:grid;grid-template-columns:1fr 1fr;gap:12%}.practice-strip h3{font-size:30px;line-height:1.2}.practice-strip>p{color:var(--muted)}.practice-strip .eyebrow{color:var(--muted)}.about-head{margin-bottom:65px}.about-head>.eyebrow{color:var(--muted);margin-bottom:25px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:12%}.education{list-style:none;padding:0;margin:0}.education li{display:grid;grid-template-columns:110px 1fr;gap:20px;border-top:1px solid var(--line);padding:20px 0}.year{font-size:13px;color:var(--accent);font-family:var(--display)}.education h3{font-size:22px}.education p{color:var(--muted);font-size:16px;margin:8px 0 0}.education small{font-size:13px}.recognition{margin-top:85px}.recognition>.eyebrow{margin-bottom:25px;color:var(--muted)}.award-row{display:grid;grid-template-columns:100px 1fr 1fr;gap:20px;border-top:1px solid var(--line);padding:22px 0;align-items:center}.award-row>span{color:var(--accent);font-family:var(--display);font-size:12px}.award-row h3{font-size:22px}.award-row p{margin:0;color:var(--muted);font-size:16px}.contact{background:var(--accent);color:#0b1718}.contact .eyebrow{color:#34514f}.contact h2{font-size:clamp(90px,14vw,210px);margin:35px 0 60px;letter-spacing:-.06em}.contact h2 em{color:#3b6460}.contact-bottom{display:flex;justify-content:space-between;gap:30px;border-top:1px solid #15332d50;padding-top:30px}.contact-bottom>p{font-size:22px;font-weight:300}.email{font-size:clamp(22px,2.4vw,34px);border-bottom:1px solid}.contact-links{display:flex;gap:25px;margin-top:20px;font-size:15px}.contact-links a:hover{text-decoration:underline}footer{padding:25px var(--pad);display:flex;justify-content:space-between;gap:20px;font-size:13px;color:var(--muted)}footer>a{color:var(--ink)}dialog{padding:0;border:0;background:var(--bg);color:var(--ink);width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;overflow:auto}dialog::backdrop{background:#090d10ee}dialog[open]{animation:projectIn .55s cubic-bezier(.22,1,.36,1)}@keyframes projectIn{from{opacity:0;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}.dialog-bar{position:sticky;top:0;background:#090d10f2;backdrop-filter:blur(12px);padding:20px var(--pad);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);z-index:4}.dialog-bar button{font-size:16px;display:flex;gap:20px;align-items:center}.dialog-bar button span{font-size:30px}.detail-header{padding:60px var(--pad) 45px;display:grid;grid-template-columns:1.2fr 1fr;gap:8%;align-items:end}.detail-header h2{font-family:var(--display);font-size:clamp(38px,6vw,80px);overflow-wrap:anywhere;letter-spacing:-.035em}.detail-header .eyebrow{color:var(--accent)}.detail-header .summary{font-size:22px;font-weight:300}.detail-cover{width:100%;max-height:78vh;object-fit:cover}.detail-body{padding:65px var(--pad);display:grid;grid-template-columns:1fr 1.5fr;gap:10%}.detail-body h3{font-size:28px;margin-bottom:20px}.detail-body p,.detail-body li{color:var(--muted)}.detail-body ul{padding-left:20px}.detail-body li{margin-bottom:12px}.fact{border-top:1px solid var(--line);padding:15px 0;font-size:16px}.fact small{display:block;color:var(--muted);font-family:var(--display);font-size:12px;margin-bottom:7px}.detail-links{display:flex;flex-wrap:wrap;gap:25px;margin-top:30px}.detail-gallery{padding:0 var(--pad) 60px;display:grid;grid-template-columns:1fr 1fr;gap:30px}.detail-gallery figure{margin:0}.detail-gallery figure.wide{grid-column:1/-1}.detail-gallery img{width:100%;height:auto;background:var(--panel)}figcaption{color:var(--muted);font-size:14px;margin:12px 0 0}.detail-foot{padding:30px var(--pad) 70px;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}.watch-btn{border:1px solid var(--line);padding:12px 20px;font-size:16px}.watch-btn:hover{background:var(--accent);color:var(--bg)}.video-wrap{margin:30px var(--pad) 60px;aspect-ratio:16/9}.video-wrap iframe{width:100%;height:100%;border:0}.js .reveal{opacity:0;transform:translateY(35px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}.js .reveal.visible{opacity:1;transform:none}.motion-off *{scroll-behavior:auto!important;animation:none!important;transition:none!important}.motion-off .reveal{opacity:1;transform:none}
@media(min-width:1600px){.hero-main{padding-top:90px}.section{max-width:2000px;margin:auto}}
@media(max-width:1000px){.brand-name{display:none}.header{gap:18px}.header nav{gap:18px}.header-actions{gap:16px}.hero-visual{left:10%}.featured .project-description{grid-template-columns:1fr 1fr}.featured .project-meta{grid-column:2}.about-grid,.approach-grid,.practice-strip{gap:7%}.research{padding-left:25px}.award-row{grid-template-columns:60px 1fr 1fr}.detail-header{grid-template-columns:1fr}.detail-header .summary{max-width:650px;margin-top:30px}}
@media(max-width:700px){body{font-size:17px}.header{padding:16px 22px;flex-wrap:wrap;row-gap:13px}.brand{font-size:21px}.header nav{order:3;width:100%;justify-content:space-between;font-size:15px}.header-actions{margin-left:auto}.motion{font-size:12px}.cv-link{font-size:13px}.hero{padding-top:145px;min-height:850px;min-height:100svh}.hero-top>.eyebrow{font-size:10px}.hero-top>.eyebrow:first-child{display:none}.hero-top{justify-content:flex-end}.hero-visual{left:0}.hero-shade{background:linear-gradient(90deg,#090d10d9,#090d1060),linear-gradient(0deg,#090d10,transparent 65%)}.hero-main{padding:40px 0}.hero h1{font-size:clamp(78px,20vw,140px)}.hero-project>.eyebrow{display:none}.hero-project>span:last-child{font-size:18px}.hero-bottom>.text-link{font-size:14px;gap:18px}.section{padding:75px 22px}.section-head{display:block;margin-bottom:35px}.filters{margin-top:30px}.projects{grid-template-columns:1fr;gap:45px}.project.featured{grid-column:auto}.featured .project-image,.project-image{aspect-ratio:1.3}.featured .project-description{display:block}.project-description h3{font-size:33px}.project-description p{font-size:17px}.project-description{padding-top:18px}.project-meta{font-size:11px}.image-label{top:14px;left:14px;font-size:10px}.approach .section-head h2{margin-top:30px}.approach-grid,.about-grid,.practice-strip{display:block;margin-top:40px}.research{margin-top:45px;padding:30px 0 0;border-left:0;border-top:1px solid var(--line)}.practice-strip{margin-top:45px}.practice-strip>p{margin-top:20px}.education{margin-top:40px}.education li{grid-template-columns:92px 1fr}.about-head{margin-bottom:35px}.recognition{margin-top:55px}.award-row{grid-template-columns:50px 1fr;gap:10px}.award-row p{grid-column:2}.contact h2{font-size:clamp(75px,20vw,130px);margin-bottom:40px}.contact-bottom{display:block}.contact-bottom>p{font-size:20px}.email{font-size:clamp(18px,5.3vw,26px);overflow-wrap:anywhere}.contact-links{gap:20px;flex-wrap:wrap}footer{flex-wrap:wrap;padding:25px 22px}footer>span:nth-child(2){display:none}.detail-header{padding:40px 22px 30px}.detail-header h2{font-size:36px}.detail-header .summary{font-size:21px;margin-top:25px}.dialog-bar{padding:15px 22px}.detail-body{display:block;padding:40px 22px}.detail-copy{margin-top:40px}.detail-gallery{display:block;padding:0 22px 40px}.detail-gallery figure{margin-bottom:30px}.detail-foot{padding:25px 22px 45px}.video-wrap{margin:20px 22px 40px}.detail-cover{min-height:240px;object-fit:cover}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .reveal{opacity:1;transform:none}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Local media preview refinement — extends the original template. */
:root{--bg:#080b0e;--panel:#12191e;--ink:#f4f6f7;--muted:#acb6be;--accent:#c6eee9;--pad:clamp(24px,5.6vw,110px)}
.header{padding-top:16px;padding-bottom:16px;background:#080b0ebb;backdrop-filter:blur(24px)}
.brand-name{font-weight:500}.header nav a.current{color:var(--accent)}
.hero{min-height:920px;min-height:100svh}.hero-visual{inset:0; background-image:url(assets/local/73-bartlett-autumn-2026-cva-group1-cameron-lai-heroshot.jpg)}
.hero-visual video{opacity:1}.hero-shade{background:linear-gradient(90deg,#080b0ef0 0%,#080b0e88 35%,#080b0e10 75%),linear-gradient(0deg,#080b0e 0%,transparent 35%,#080b0e55 100%)}
.hero-main{padding-top:80px}.hero h1{font-size:clamp(90px,11vw,182px);letter-spacing:-.065em;line-height:.9}.hero h1 span{color:var(--ink)}
.hero-role{font-family:var(--body);font-size:17px;letter-spacing:.06em}.hero-intro{font-weight:300;max-width:460px;font-size:24px}.hero-top{max-width:100%;gap:35px}.hero-top .eyebrow{font-family:var(--body);font-size:14px;letter-spacing:.13em}.hero-bottom{padding-top:25px;border-top:1px solid #ffffff35}.hero-project .eyebrow{font-family:var(--body);font-size:14px}.hero-project>span:last-child{font-family:var(--display);font-size:26px}
.scroll-progress{position:fixed;inset:0 auto auto 0;height:2px;background:var(--accent);z-index:60;width:0;pointer-events:none}
.section{padding-top:120px;padding-bottom:120px}.section-head h2{font-size:clamp(45px,5.2vw,84px);font-weight:400;letter-spacing:-.045em}.eyebrow{font-family:var(--body);font-size:14px;font-weight:400;letter-spacing:.13em}.filters{border:1px solid var(--line);padding:4px;border-radius:30px}.filters button{border:0;border-radius:22px;font-size:14px}.filters button.active{background:#eff7f6}.projects{gap:58px 32px}.project-image{border-radius:8px;aspect-ratio:16/10}.featured .project-image{aspect-ratio:2.05}.project-image img{filter:none}.project-description{padding-bottom:12px}.project-meta{font-family:var(--body);font-size:14px}.project-description h3{font-size:37px;letter-spacing:-.035em}.image-label{font-family:var(--body);font-size:13px;border-radius:16px;backdrop-filter:blur(12px)}.preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;opacity:0;transition:opacity .6s}.preview-video.playing{opacity:1}.image-label,.open-circle,.preview-label{z-index:2}.preview-label{position:absolute;left:20px;bottom:22px;font-size:13px;background:#080b0ecc;padding:6px 13px;border-radius:20px}.diagram-preview{object-fit:contain;background:#f8f8f8}.film-project .project-image{aspect-ratio:16/9}.film-project h3{font-size:30px}.research-preview{text-align:left;padding:0;margin-top:15px;width:100%}.research-preview img{max-height:360px;width:100%;object-fit:contain;background:#f9f8f5;border-radius:8px;padding:12px}.research-preview .text-link{width:100%;justify-content:space-between}.detail-header h2{font-family:var(--body);font-weight:400}.detail-cover{aspect-ratio:16/9}.detail-gallery img{border-radius:5px}.detail-gallery button{padding:0;width:100%;cursor:zoom-in}.detail-gallery figure.wide img{max-height:850px;object-fit:contain}.detail-gallery video{width:100%;border-radius:5px;background:#000}.video-wrap video{width:100%;height:100%;background:#000}.film-note{font-size:14px;color:var(--muted);padding:0 var(--pad);margin-bottom:40px}.sound-grid{padding:30px var(--pad) 60px;display:grid;grid-template-columns:1fr 1fr;gap:24px}.sound-grid h3{font-size:23px;margin-bottom:8px}.sound-grid p{font-size:14px;color:var(--muted)}.sound-grid audio{width:100%;margin-top:10px}.detail-links .watch-btn{background:var(--ink);color:var(--bg);border-radius:25px;padding:11px 24px}.detail-gallery .research-figure img{background:#f8f7f3;object-fit:contain;max-height:760px}.contact{background:#c6eee9}.contact h2{font-weight:400}.open-circle{width:46px;height:46px;font-size:28px}.motion{font-size:14px}.motion-off .preview-video{opacity:0!important}.detail-gallery figcaption{font-size:15px}
#image-dialog{background:#05080bf5;padding:70px 25px 25px;display:none;align-items:center;justify-content:center;flex-direction:column}#image-dialog[open]{display:flex}#image-dialog img{max-height:calc(100dvh - 140px);max-width:100%;width:auto;object-fit:contain}#image-dialog button{position:absolute;top:20px;right:var(--pad);font-size:18px}#image-dialog p{margin:15px 0 0;font-size:15px;color:var(--muted)}
@media(max-width:1000px){.header nav{gap:15px}.header-actions{gap:16px}.hero h1{font-size:clamp(90px,14vw,160px)}.hero-visual{inset:0}.hero-intro{font-size:22px}.filters{max-width:400px}.section-head{align-items:flex-start}}
@media(max-width:700px){.hero{padding-top:155px;min-height:780px;min-height:100svh}.hero-main{padding-top:55px}.hero h1{font-size:clamp(86px,23vw,142px)}.hero-role{font-size:15px}.hero-intro{font-size:20px}.hero-top .eyebrow{font-size:12px;letter-spacing:.06em}.hero-shade{background:linear-gradient(90deg,#080b0ed8,#080b0e30),linear-gradient(0deg,#080b0e,transparent 75%)}.hero-bottom{gap:15px}.hero-project>span:last-child{font-size:17px}.section{padding:80px 24px}.section-head h2{font-size:48px}.filters{border-radius:22px;width:100%;justify-content:center}.filters button{padding:8px 10px;font-size:13px}.filters small{margin-left:4px}.projects{gap:42px}.featured .project-image{aspect-ratio:1.3}.featured h3{font-size:38px}.project-description h3{font-size:32px}.project-meta{font-size:14px}.image-label{font-size:12px}.sound-grid{grid-template-columns:1fr;padding:20px 24px 40px}.detail-header h2{font-size:42px}.detail-header .summary{font-size:20px}.detail-cover{min-height:0;max-height:none}.detail-gallery figure{margin-bottom:34px}.contact h2{font-size:clamp(80px,22vw,130px)}.header-actions{gap:14px}.motion{font-size:13px}.cv-link{font-size:13px}}
