:root{--cream:#F2EDE4;--cream-deep:#E8E1D5;--sable:#8B837A;--mauve:#8A7587;--mauve-soft:#D8CDD3;--black:#111010;--serif:'Fraunces',Georgia,serif;--sans:'Figtree',system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--black);font-family:var(--sans);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit}
:focus-visible{outline:2px solid var(--mauve);outline-offset:4px}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(1.25rem,4vw,3rem)}
header{padding:1.75rem 0}
header .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.logo{font-family:var(--serif);font-size:1.25rem;text-decoration:none}
nav{display:flex;gap:1.6rem;flex-wrap:wrap}
nav a{text-decoration:none;font-weight:500;font-size:.98rem;color:var(--sable);transition:color .2s;padding-bottom:.2rem;border-bottom:2px solid transparent}
nav a:hover{color:var(--black)}
nav a[aria-current="page"]{color:var(--black);border-bottom-color:var(--mauve)}
h1,h2{font-family:var(--serif);font-weight:300;letter-spacing:-.015em;line-height:1.08}
h1{font-size:clamp(2.4rem,6vw,4.4rem)}
h2{font-size:clamp(1.7rem,3.5vw,2.4rem)}
.hero{padding:clamp(3rem,9vw,7rem) 0 clamp(3rem,7vw,5rem)}
.hero h1{font-size:clamp(2.6rem,7.5vw,6rem);line-height:1.02;letter-spacing:-.02em;max-width:14ch}
.hero p{margin-top:2rem;max-width:44ch;color:var(--sable);font-size:1.15rem}
.line{width:min(220px,40%);height:3px;background:var(--mauve);margin-top:2.5rem}
.btns{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.25rem}
.btn{display:inline-block;padding:.8rem 1.5rem;background:var(--black);color:var(--cream);text-decoration:none;font-weight:500;transition:background .2s}
.btn:hover{background:var(--mauve)}
.btn.alt{background:transparent;color:var(--black);box-shadow:inset 0 0 0 1.5px var(--black)}
.btn.alt:hover{background:var(--black);color:var(--cream)}
.page{padding:clamp(2rem,6vw,4.5rem) 0 clamp(4rem,8vw,6rem)}
.page>.wrap>h1{margin-bottom:2.5rem}
.text{max-width:60ch}
.text p+p{margin-top:1.15rem}
.split{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2rem,6vw,5rem)}
.photo{aspect-ratio:4/5;background:var(--mauve-soft);display:flex;align-items:flex-end;padding:1rem;font-family:var(--serif);color:var(--black);overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1.5rem,3vw,2.5rem)}
.project{display:flex;flex-direction:column;gap:.9rem}
.project:nth-child(1){grid-column:span 7}
.project:nth-child(2){grid-column:span 5;margin-top:3.5rem}
.project:nth-child(3){grid-column:span 5}
.project:nth-child(4){grid-column:span 7;margin-top:-2rem}
.frame{position:relative;aspect-ratio:16/9;background:var(--sable);overflow:hidden}
.project:nth-child(1) .frame{background:var(--mauve)}
.project:nth-child(2) .frame{background:var(--black)}
.project:nth-child(3) .frame{background:var(--mauve-soft)}
.frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ph{position:absolute;inset:0;display:flex;align-items:flex-end;padding:1.1rem;font-family:var(--serif);font-size:1.1rem;color:var(--cream)}
.project:nth-child(3) .ph{color:var(--black)}
.project h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;line-height:1.25}
.project p{color:var(--sable);font-size:.98rem}
.edu{list-style:none;border-top:1px solid var(--cream-deep)}
.edu li{display:grid;grid-template-columns:10rem 1fr;gap:1.5rem;padding:1.75rem 0;border-bottom:1px solid var(--cream-deep)}
.edu .yr{font-family:var(--serif);font-size:1.15rem;color:var(--mauve)}
.edu h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;margin-bottom:.35rem}
.edu p{color:var(--sable);max-width:56ch}
.big{font-family:var(--serif);font-weight:300;font-size:clamp(1.6rem,4.5vw,3.2rem);letter-spacing:-.01em;text-decoration:none;border-bottom:2px solid var(--mauve);padding-bottom:.15rem;word-break:break-all;transition:color .2s}
.big:hover{color:var(--mauve)}
.links{list-style:none;display:flex;flex-wrap:wrap;gap:.75rem 2rem;margin-top:2.25rem}
.links a{color:var(--sable);font-weight:500;text-decoration:none;transition:color .2s}
.links a:hover{color:var(--black)}
footer{border-top:1px solid var(--cream-deep);padding:1.5rem 0 2.5rem;color:var(--sable);font-size:.9rem}
@media(max-width:760px){
.grid{display:flex;flex-direction:column}
.project:nth-child(n){margin-top:0}
.split{grid-template-columns:1fr}
.photo{max-width:320px}
.edu li{grid-template-columns:1fr;gap:.4rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.text .name{font-family:var(--serif);font-size:1.5rem;font-weight:400;margin-bottom:1.25rem}
.text h2{margin:2.75rem 0 1.25rem}
