:root{--bg:#F6F3EE;--ink:#2A2522;--mute:#6E665E;--rule:#DDD5CA;--accent:#6B1F2A;--pad:clamp(16px,5vw,72px);--serif:'Cormorant Garamond',Georgia,serif;--sans:'Jost',system-ui,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.7}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;transition:color .2s}
a:hover{color:var(--accent)}
h1,h2{font-family:var(--serif);font-weight:300;margin:0;line-height:1.12}
.wrap{padding-left:var(--pad);padding-right:var(--pad);max-width:1440px;margin-left:auto;margin-right:auto}
.narrow{max-width:1100px}
.eyebrow{font-size:12px;letter-spacing:.2em;color:var(--mute);margin:0;font-weight:400}
.caps{font-size:13px;letter-spacing:.2em;text-transform:uppercase}
.underline{border-bottom:1px solid currentColor;padding-bottom:6px}

/* header */
.site-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:28px var(--pad);position:relative}
.brand img{height:20px;width:auto}
.wordmark{font-family:var(--serif);font-size:22px;letter-spacing:.28em;color:var(--accent);font-weight:400}
.wordmark.small{font-size:16px}
.site-header nav{display:flex;gap:36px;font-size:13px;letter-spacing:.16em;text-transform:uppercase}
.site-header nav a[aria-current]{border-bottom:1px solid var(--ink);padding-bottom:4px}
.menu-btn{display:none;background:none;border:0;font:inherit;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);cursor:pointer;padding:8px 0}

/* footer */
.site-footer{padding:40px var(--pad) 48px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;font-size:13px;letter-spacing:.08em}
.site-footer .leopards img{height:40px;width:auto}
.foot-links{display:flex;gap:32px;flex-wrap:wrap;justify-content:center}
.insta{display:inline-flex;padding:4px}
.foot-note{margin:0;line-height:1.9;color:var(--mute);font-size:12px;letter-spacing:.14em}

/* home */
.hero{padding:0 var(--pad)}
.hero img{width:100%;height:min(82vh,860px);object-fit:cover}
.intro{max-width:780px;margin:0 auto;padding:120px 24px 140px;text-align:center;display:flex;flex-direction:column;gap:28px}
.intro h1{font-size:clamp(30px,3.4vw,42px)}
.intro p{font-size:18px;line-height:1.8;margin:0}
.feature{display:flex;flex-direction:column;gap:140px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.card{display:flex;flex-direction:column;gap:18px}
.card .frame{overflow:hidden;background:#E6E0D7}
.card .frame img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.card:hover .frame img{transform:scale(1.02)}
.card.wide .frame{aspect-ratio:3/2}
.card.tall .frame{aspect-ratio:4/5}
.card.short .frame{aspect-ratio:4/5}
.card.offset{margin-top:180px;width:82%;justify-self:end}
.duo .card.offset:first-child{justify-self:start}
.cap{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.cap .t{font-family:var(--serif);font-size:21px;line-height:1.2}
.cap .pl{font-size:12px;letter-spacing:.16em;color:var(--mute)}
.center-link{text-align:center;padding:120px 24px 32px}
.as-featured{text-align:center;padding:72px 24px 72px;display:flex;flex-direction:column;gap:28px;align-items:center}
.pubs{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 48px;font-family:var(--serif);font-size:clamp(20px,2vw,25px)}

/* projects index */
.page-head{padding-top:72px;padding-bottom:64px}
.page-head h1{font-size:clamp(32px,3.6vw,44px)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:48px;row-gap:96px}
.grid .card .frame{aspect-ratio:4/5}
.in-progress{padding-top:160px;padding-bottom:72px}
.in-progress .eyebrow{margin-bottom:40px}
.city{color:var(--accent)}
.pgrid{display:flex;flex-direction:column;gap:clamp(56px,7vw,96px)}
.p-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.6vw,40px)}
.pgrid .frame{aspect-ratio:var(--ar)}
.grid .card .frame{aspect-ratio:var(--ar,4/5)}

/* project page */
.proj-head{padding-top:64px;padding-bottom:96px;max-width:1000px;display:flex;flex-direction:column;gap:20px}
.proj-head h1{font-size:clamp(32px,3.8vw,46px)}
.lede{font-size:18px;line-height:1.8;max-width:640px;margin:8px 0 0}
.featured{font-size:13px;letter-spacing:.06em;color:var(--mute);margin:0}
.featured a{border-bottom:1px solid var(--rule)}
.gallery{max-width:1100px;display:flex;flex-direction:column;gap:clamp(10px,1.4vw,16px)}
.g-row{display:grid;gap:0 calc(100% * 11 / 783)}
.g-full img,.g-pair img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.g-full{aspect-ratio:var(--ar)}
.g-pair{grid-template-columns:1fr 1fr}
.g-pair .cell{aspect-ratio:var(--ar);overflow:hidden}
.g-single{width:49.3%;margin:0 auto;grid-template-columns:1fr}
.proj-foot{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:24px;padding-top:120px;padding-bottom:56px}
.proj-foot .next{font-family:var(--serif);font-size:22px}

/* studio, contact */
.split{max-width:1200px;padding-top:72px;padding-bottom:72px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.frame.portrait{aspect-ratio:4/5;overflow:hidden}
.frame.portrait img{width:100%;height:100%;object-fit:cover}
.prose{display:flex;flex-direction:column;gap:28px}
.prose h1{font-size:clamp(32px,3.4vw,42px)}
.prose p{font-size:17px;line-height:1.75;margin:0}
.contact .links{line-height:2}
.contact .links a{border-bottom:1px solid var(--rule);padding-bottom:2px}
.contact .links a:hover{border-color:var(--accent)}
.founders{max-width:1200px;padding-top:40px;padding-bottom:100px;display:grid;grid-template-columns:1fr 1fr;gap:80px}
.founders div{display:flex;flex-direction:column;gap:16px}
.founders h2{font-size:25px}
.founders p:not(.eyebrow){margin:0;line-height:1.75}
.enquiries{max-width:760px;margin:0 auto;padding:72px 24px 72px;text-align:center;display:flex;flex-direction:column;gap:24px;align-items:center}
.enquiries .big{font-family:var(--serif);font-size:24px;line-height:1.4;margin:0}

/* press */
.press{padding-bottom:72px}
.press-row{display:grid;grid-template-columns:1.1fr 1.6fr auto;gap:16px 32px;align-items:baseline;padding:30px 0;border-top:1px solid var(--rule)}
.press-row:last-child{border-bottom:1px solid var(--rule)}
.press-row .pub{font-family:var(--serif);font-size:23px}
.press-row .read{font-size:12px;letter-spacing:.2em;color:var(--mute)}

@media (max-width:900px){
  .grid{grid-template-columns:1fr 1fr;column-gap:24px;row-gap:64px}
  .split,.founders{grid-template-columns:1fr;gap:48px}
}
@media (max-width:640px){
  .menu-btn{display:block}
  .site-header nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:10;background:var(--bg);flex-direction:column;gap:20px;padding:12px var(--pad) 32px;border-bottom:1px solid var(--rule)}
  .site-header nav.open{display:flex}
  .brand img{height:16px}
  .wordmark{font-size:17px}
  .hero img{height:62vh}
  .intro{padding:80px 8px 96px}
  .feature{gap:88px}
  .duo{grid-template-columns:1fr;gap:88px}
  .card.offset{margin-top:0;width:100%}
  .grid{grid-template-columns:1fr;row-gap:64px}
  .p-pair{grid-template-columns:1fr;gap:56px}
  .gallery{gap:12px}
  .g-pair{grid-template-columns:1fr;gap:12px}
  .g-single{width:100%}
  .site-footer{grid-template-columns:1fr}
  .press-row{grid-template-columns:1fr auto}
  .press-row .pr{grid-column:1}
  .press-row .read{grid-row:1;grid-column:2}
  .proj-head{padding-bottom:64px}
}