:root{--ink:#17191b;--muted:#5b5e61;--rule:#d9dcda;--paper:#fafaf9;--navy:#1b395c;--plum:#502451;--mint:#91cbae;--coral:#f17b67}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,summary:focus-visible{outline:2px solid var(--navy);outline-offset:5px}
img{max-width:100%}
.site-shell{max-width:1440px;margin:0 auto;padding:0 54px}
.site-header{height:76px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between}
.wordmark{font-size:17px;font-weight:700;letter-spacing:-.065em}
.header-actions{display:flex;align-items:center;gap:30px}
.cv-button{border:1.6px solid var(--ink);border-radius:999px;padding:8px 17px;font-size:12px;font-weight:500;display:inline-flex;gap:14px;align-items:center}
.cv-button:hover{background:var(--ink);color:var(--paper)}
.menu{position:relative}
.menu summary{list-style:none;width:25px;height:28px;display:flex;flex-direction:column;justify-content:center;gap:6px;cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu summary span{display:block;height:1px;width:23px;background:var(--ink)}
.menu nav{position:absolute;right:0;top:37px;z-index:10;background:var(--paper);border:1px solid var(--rule);box-shadow:0 16px 35px #0002;min-width:170px;padding:10px 0;display:grid}
.menu nav a{font-size:13px;padding:9px 16px}
.menu nav a:hover{background:#edeeec}
.back-link{display:inline-block;color:var(--muted);font-size:12px;margin:19px 0 35px}
.back-link:hover{text-decoration:underline}
.eyebrow{font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;margin:0}
.intro{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:end;gap:36px;margin-bottom:20px}
.intro h1{font-size:clamp(90px,10.9vw,164px);line-height:.88;letter-spacing:-.09em;font-weight:600;margin:15px 0 0}
.intro h1 span{letter-spacing:-.13em}
.intro-summary{max-width:475px;justify-self:end;font-size:clamp(21px,2.2vw,30px);line-height:1.16;letter-spacing:-.052em;margin:0 0 8px}
.project-meta{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:0;padding:14px 0 18px}
.project-meta dt{font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--muted);margin-bottom:8px}
.project-meta dd{font-size:13px;line-height:1.35;margin:0}
.hero{position:relative;margin:0 -34px;background:var(--navy);overflow:hidden}
.hero img{display:block;width:100%;height:clamp(390px,39vw,570px);object-fit:cover;object-position:center 47%}
.hero figcaption{position:absolute;left:38px;bottom:23px;color:white;background:#112c4ea8;backdrop-filter:blur(6px);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:9px 12px}
.editorial-row{display:grid;grid-template-columns:24% 38% 1fr;gap:34px;padding:32px 0 38px;border-bottom:1px solid var(--rule)}
.section-title h2{font-size:clamp(32px,3.15vw,47px);line-height:1.04;letter-spacing:-.064em;font-weight:500;margin:6px 0 0}
.section-title>p:not(.eyebrow){max-width:260px;color:var(--muted);font-size:14px;line-height:1.45;margin:18px 0 0}
.editorial-row>p{color:#484c4f;font-size:14px;line-height:1.46;margin:0;letter-spacing:-.015em}
.editorial-row strong{color:var(--ink);font-weight:600}
.feature-row{border-bottom:1px solid var(--rule);padding:24px 0 26px;display:grid;grid-template-columns:22% minmax(0,1fr);gap:24px}
.feature-row .section-title h2{font-size:clamp(30px,2.9vw,42px)}
.identity-showcase{display:grid;grid-template-columns:1.25fr 1fr 1.2fr;gap:9px;height:240px;min-width:0}
.identity-crop{background:var(--navy);overflow:hidden}
.identity-crop img{width:100%;height:100%;object-fit:cover;object-position:18% 45%;display:block;transform:scale(1.8);transform-origin:25% 47%}
.palette{display:flex;gap:4px}
.palette span{flex:1;min-width:0}
.palette .navy{background:var(--navy)}.palette .plum{background:var(--plum)}.palette .mint{background:var(--mint)}.palette .coral{background:var(--coral)}
.type-panel{background:#eeefed;display:flex;flex-direction:column;justify-content:center;padding:20px 25px;position:relative;overflow:hidden}
.type-large{font-size:85px;font-weight:700;letter-spacing:-.09em;line-height:1;color:var(--navy)}
.type-panel>span:nth-child(2){font-size:12px;font-weight:700;letter-spacing:.08em;line-height:1.3;color:var(--navy)}
.type-panel i{position:absolute;right:9px;top:19px;font-size:80px;font-style:normal;color:var(--coral);font-weight:400}
.architecture-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;height:270px;overflow:hidden}
.architecture-grid img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.media-panel{margin:0;min-width:0}
.media-panel img{display:block;width:100%;height:auto;max-height:560px;object-fit:cover}
.media-panel figcaption{font-size:11px;color:var(--muted);margin-top:7px}
.outcome{border-bottom:0}
.site-footer{border-top:1px solid var(--rule);min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}
.site-footer a:hover{text-decoration:underline}
@media(max-width:1080px){
  .site-shell{padding:0 30px}
  .intro{grid-template-columns:1fr .8fr}
  .intro h1{font-size:clamp(80px,10.5vw,122px)}
  .hero{margin:0 -18px}
  .editorial-row{grid-template-columns:25% 1fr 1fr;gap:22px}
  .feature-row{grid-template-columns:24% 1fr}
  .identity-showcase{height:195px}
  .architecture-grid{height:220px}
}
@media(max-width:760px){
  .site-shell{padding:0 22px}
  .site-header{height:66px}
  .back-link{margin-bottom:29px}
  .intro{display:block}
  .intro h1{font-size:clamp(72px,15vw,120px)}
  .intro-summary{max-width:580px;margin:24px 0 0;font-size:25px}
  .project-meta{grid-template-columns:repeat(2,1fr);gap:17px}
  .hero{margin:0 -12px}
  .hero img{height:420px;object-position:center}
  .editorial-row{grid-template-columns:1fr 1fr;gap:18px;padding:29px 0}
  .editorial-row .section-title{grid-column:1/-1}
  .feature-row{display:block}
  .feature-row .section-title{margin-bottom:22px}
  .section-title>p:not(.eyebrow){max-width:620px}
  .identity-showcase{height:220px}
  .architecture-grid{height:230px}
}
@media(max-width:520px){
  .site-shell{padding:0 17px}
  .wordmark{font-size:15px}
  .header-actions{gap:17px}
  .cv-button{font-size:11px;padding:7px 13px}
  .intro h1{font-size:clamp(60px,14.5vw,80px)}
  .intro-summary{font-size:22px}
  .hero{margin:0 -9px}
  .hero img{height:340px;object-position:48% center}
  .hero figcaption{left:15px;bottom:12px;font-size:8px}
  .editorial-row{display:block}
  .editorial-row .section-title{margin-bottom:20px}
  .editorial-row>p+p{margin-top:14px}
  .feature-row{padding:27px 0}
  .identity-showcase{grid-template-columns:1fr 1fr;height:auto}
  .identity-crop,.palette{height:170px}
  .type-panel{grid-column:1/-1;height:160px}
  .architecture-grid{grid-template-columns:1fr 1fr;height:auto}
  .architecture-grid img{height:250px}
  .site-footer{flex-wrap:wrap;padding:20px 0}
}
