:root { --paper:#f2efe7; --ink:#181816; --muted:#77736a; --line:rgba(24,24,22,.24); --signal:#d73322; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"SFMono-Regular",Menlo,monospace; }
a { color:inherit; text-decoration:none; }
main { min-height:100vh; padding:22px clamp(20px,4vw,58px) 28px; }
.masthead,.section-title,footer { display:flex; justify-content:space-between; gap:24px; font-size:10px; line-height:1.2; letter-spacing:.14em; text-transform:uppercase; }
.masthead { align-items:center; padding-bottom:17px; border-bottom:1px solid var(--ink); }
.masthead p,.section-title p,footer p { margin:0; }
.wordmark { font-weight:700; letter-spacing:.08em; }.wordmark span,h1 em { color:var(--signal); }
.intro { padding:clamp(64px,10vw,150px) 0 clamp(70px,11vw,160px); }.kicker { margin:0 0 18px; color:var(--signal); font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:0; font-family:"Bodoni 72",Didot,"Songti SC",serif; font-size:clamp(58px,11vw,164px); font-weight:400; letter-spacing:-.068em; line-height:.82; } h1 em { font-weight:400; }
.section-title { padding-bottom:15px; }.section-title p:last-child { color:var(--muted); }.project-list { border-top:1px solid var(--ink); }
.project { display:grid; grid-template-columns:70px minmax(0,1fr) minmax(150px,.45fr) 24px; align-items:center; min-height:136px; border-bottom:1px solid var(--line); transition:color .18s ease,padding .18s ease; }
.project:hover,.project:focus-visible { color:var(--accent,var(--signal)); padding-left:9px; outline:none; }.project-number { align-self:start; padding-top:25px; font-size:10px; }.project-copy { display:flex; align-items:baseline; gap:clamp(14px,3vw,44px); }.project-copy strong { font-family:"Bodoni 72",Didot,"Songti SC",serif; font-size:clamp(32px,5vw,68px); font-weight:400; letter-spacing:-.045em; }.project-copy i { color:var(--muted); font-family:"Bodoni 72",Didot,serif; font-size:16px; }.project-tags { color:var(--muted); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }.arrow { font-size:20px; }
footer { margin-top:clamp(70px,10vw,140px); padding-top:16px; border-top:1px solid var(--ink); color:var(--muted); }
@media (max-width:700px) { main{padding:18px 18px 22px}.intro{padding:70px 0 84px}h1{font-size:clamp(58px,18vw,94px)}.project{grid-template-columns:38px 1fr 22px;min-height:112px}.project-copy{align-items:flex-start;flex-direction:column;gap:4px}.project-copy strong{font-size:clamp(34px,11vw,54px)}.project-tags,.masthead p{display:none} }
@media (prefers-reduced-motion:no-preference) { .intro,.index{animation:enter .65s ease both}.index{animation-delay:.09s}@keyframes enter{from{opacity:0;transform:translateY(10px)}} }