@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root { --paper:#f3f3ef; --ink:#101010; --muted:#6c6c67; --line:rgba(16,16,16,.24); --red:#f04435; --side:clamp(18px,2.35vw,38px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:Manrope,Arial,sans-serif; background:var(--paper); }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
img { max-width:100%; }
.project-nav { display:grid; grid-template-columns:1fr auto auto; gap:30px; align-items:center; min-height:68px; padding:0 var(--side); border-bottom:1px solid var(--ink); font-size:12px; }
.wordmark { font-size:17px; font-weight:800; }
.wordmark span { margin-left:4px; color:var(--red); }
.project-nav nav { display:flex; gap:30px; }
.project-nav button { padding:0; border:0; background:transparent; }
.nav-actions { display:flex; gap:20px; align-items:center; }
.menu-toggle { display:none; width:27px; height:18px; }
.menu-toggle span { display:block; width:100%; height:1px; margin:5px 0; background:currentColor; transition:transform .25s ease; }
.project-header { display:grid; grid-template-columns:90px minmax(300px,1fr) minmax(280px,430px); gap:32px; align-items:end; min-height:360px; padding:92px var(--side) 40px; }
.project-index, .project-meta, .section-label, .project-gallery figcaption, .project-nav-links span, footer { font-family:'DM Mono',monospace; font-size:10px; text-transform:uppercase; }
.project-index { align-self:start; color:var(--muted); }
.project-header h1 { margin:0; font-size:clamp(62px,8vw,116px); line-height:.88; }
.project-summary { display:grid; gap:24px; }
.project-meta { display:flex; flex-wrap:wrap; gap:12px 24px; }
.project-summary p { margin:0; font-size:14px; line-height:1.7; }
.project-award { padding-top:15px; border-top:1px solid var(--line); }
.project-award span { display:block; margin-bottom:7px; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; text-transform:uppercase; }
.project-award strong { color:#b3342a; font-size:13px; line-height:1.5; }
.project-cover { margin:0; padding:0 var(--side); }
.project-cover img, .project-gallery img { display:block; width:100%; height:auto; background:#d0d0ca; }
.project-cover figcaption, .project-gallery figcaption { display:flex; justify-content:space-between; padding-top:10px; color:var(--muted); }
.project-gallery-section { padding:112px var(--side); }
.gallery-heading { display:grid; grid-template-columns:22% 78%; margin-bottom:60px; padding-bottom:18px; border-bottom:1px solid var(--ink); }
.section-label { margin:0; color:var(--muted); }
.gallery-heading h2 { margin:0; font-size:clamp(38px,4.8vw,68px); line-height:1; }
.project-gallery { display:grid; gap:76px; }
.project-gallery figure { margin:0; }
.project-navigation { padding:0 var(--side) 110px; }
.project-nav-links { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.project-nav-links a { display:grid; gap:16px; min-height:150px; padding:24px 24px 24px 0; }
.project-nav-links a + a { padding-right:0; padding-left:24px; border-left:1px solid var(--ink); text-align:right; }
.project-nav-links span { color:var(--muted); }
.project-nav-links strong { font-size:clamp(26px,3vw,42px); line-height:1; }
.project-contact { display:flex; justify-content:space-between; margin-top:54px; padding:18px; color:#fff; font-weight:700; background:var(--ink); }
footer { display:flex; justify-content:space-between; padding:24px var(--side); color:#999; background:var(--ink); border-top:1px solid #333; }
footer a { color:#fff; }
@media(max-width:760px) {
  .project-nav { grid-template-columns:1fr auto; padding:0 18px; }
  .project-nav nav { position:fixed; z-index:10; inset:0; display:flex; flex-direction:column; justify-content:center; gap:20px; padding:82px 18px 40px; background:var(--paper); opacity:0; pointer-events:none; transform:translateY(-14px); transition:opacity .25s ease,transform .25s ease; }
  .project-nav nav a { padding:10px 0; border-bottom:1px solid var(--ink); font-size:34px; font-weight:600; }
  .wordmark, .nav-actions { position:relative; z-index:12; }
  .menu-toggle { display:block; }
  .menu-open .project-nav nav { opacity:1; pointer-events:auto; transform:none; }
  .menu-open .menu-toggle span:first-child { transform:translateY(3px) rotate(45deg); }
  .menu-open .menu-toggle span:last-child { transform:translateY(-3px) rotate(-45deg); }
  .wordmark { font-size:15px; }
  .project-header { display:block; min-height:0; padding:84px 18px 34px; }
  .project-index { margin-bottom:36px; }
  .project-header h1 { font-size:56px; }
  .project-summary { margin-top:40px; }
  .project-cover { padding:0; }
  .project-cover figcaption { padding-right:18px; padding-left:18px; }
  .project-gallery-section { padding:78px 18px; }
  .gallery-heading { display:block; margin-bottom:42px; }
  .gallery-heading h2 { margin-top:26px; font-size:42px; }
  .project-gallery { gap:44px; }
  .project-navigation { padding:0 18px 78px; }
  .project-nav-links { display:block; }
  .project-nav-links a { min-height:118px; }
  .project-nav-links a + a { padding-left:0; border-top:1px solid var(--ink); border-left:0; }
  footer { padding:22px 18px; }
}