@font-face{font-family:"Archivo";src:url(fonts/archivo-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Archivo";src:url(fonts/archivo-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--bg:#111;--fg:#fff;--muted:#aeaeae;--dim:#999;--line:#2a2a2a;--pad:clamp(20px,4vw,56px)}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--fg);font-family:"Archivo",system-ui,sans-serif;font-kerning:normal;letter-spacing:0;-webkit-font-smoothing:antialiased}
body{margin:0}a{color:inherit}img,video{display:block;width:100%;height:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.site-header{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:var(--pad) var(--pad) 40px;flex-wrap:wrap}
.logo,.nav a{text-transform:uppercase;text-decoration:none;color:var(--muted);letter-spacing:.04em}
.logo{font-size:19px;font-weight:500;color:var(--fg)}.nav{display:flex;gap:28px}.nav a{font-size:15px}
.nav a:hover,.nav a[aria-current]{color:var(--fg)}main{padding:0 var(--pad)}
.covers{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:40px 24px}
.cover{text-decoration:none;display:block}.cover-img{display:block;aspect-ratio:16/9;overflow:hidden;background:#1b1b1b}
.cover-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.cover:hover .cover-img img{transform:scale(1.03)}
.cover-meta{display:flex;justify-content:space-between;gap:16px;padding-top:14px}
.cover-title{text-transform:uppercase;font-size:16px;letter-spacing:.03em}.cover-year{color:var(--dim);font-size:14px}
.project{max-width:1400px;margin:0 auto}
.project-head{display:flex;justify-content:space-between;align-items:baseline;gap:24px;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:40px}
.project-head h1{font-size:clamp(26px,3.4vw,48px);font-weight:500;text-transform:uppercase;letter-spacing:.01em;margin:0;line-height:1.05}
.year{color:var(--dim);margin:0}.block{margin:0 0 24px}
.block.text{max-width:68ch;margin:40px 0;font-size:18px;line-height:1.6;color:#ddd}
.block.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.block.video video{background:#000}
.more{margin:120px 0 0;border-top:1px solid var(--line);padding-top:32px}
.more h2{font-size:15px;font-weight:400;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 28px}
.prose{max-width:720px;font-size:19px;line-height:1.6;color:#ddd}
.prose h1{font-size:clamp(26px,3.4vw,48px);font-weight:500;text-transform:uppercase;color:var(--fg);margin:0 0 32px}
form{display:grid;gap:20px}
label{display:grid;gap:8px;font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
input,textarea{font:inherit;font-size:17px;text-transform:none;letter-spacing:0;color:var(--fg);background:#1b1b1b;border:1px solid var(--line);padding:12px 14px}
input:focus,textarea:focus{outline:2px solid #fff;outline-offset:1px}
button{justify-self:start;font:inherit;font-size:15px;text-transform:uppercase;letter-spacing:.06em;background:#fff;color:#111;border:0;padding:14px 32px;cursor:pointer}
.hp{position:absolute;left:-9999px}
.site-footer{display:flex;justify-content:space-between;padding:96px var(--pad) var(--pad);color:var(--dim);font-size:14px}
@media (prefers-reduced-motion:reduce){.cover-img img{transition:none}}
