:root{--bg:#f3f1ec;--ink:#111;--muted:#686868;--line:#cbc6bd;--pad:clamp(24px,4.4vw,72px);--dark:#101010}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;letter-spacing:-.02em}a{color:inherit;text-decoration:none}
.site-header{position:relative;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:26px var(--pad);color:#fff;background:var(--dark)}
.brand{font-size:clamp(23px,1.7vw,30px);font-weight:700;letter-spacing:.11em}.site-header nav{display:flex;gap:clamp(28px,3vw,48px);font-size:clamp(18px,1.25vw,22px);font-weight:500}.site-header nav a{opacity:.96}.site-header nav a:hover{opacity:.65}
.hero{background:var(--dark);color:#fff}.hero-panel{padding:clamp(76px,9vw,140px) var(--pad) clamp(62px,7vw,110px)}.hero-copy{max-width:1500px}.eyebrow,.section-kicker{font-size:13px;text-transform:uppercase;letter-spacing:.16em}.hero h1,.section h2,.contact h2{font-size:clamp(44px,5.3vw,86px);line-height:.94;margin:24px 0 30px;font-weight:600;letter-spacing:-.05em}.hero h1{max-width:1200px;font-size:clamp(48px,6.2vw,108px);line-height:.92}.dek{font-size:clamp(18px,1.55vw,25px);max-width:720px;line-height:1.38;color:rgba(255,255,255,.84)}.hero-link{display:inline-block;margin-top:34px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.6);font-size:13px;text-transform:uppercase;letter-spacing:.13em}
.hero-image{position:relative;width:100%;background:#d8e4ee}.hero-image img{width:100%;height:auto;display:block;filter:saturate(.92) contrast(1.02)}.image-label{display:flex;justify-content:space-between;gap:16px;padding:18px var(--pad) 20px;background:var(--dark);color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.section{padding:120px var(--pad)}.intro{display:grid;grid-template-columns:1fr 2fr;gap:42px;align-items:start}.intro .section-kicker{grid-column:1}.intro h2{grid-column:2;margin-top:0}.intro .lead{grid-column:2;max-width:850px}.lead{font-size:clamp(22px,2.2vw,34px);line-height:1.3}
.projects{padding:0 var(--pad) 120px;display:grid;grid-template-columns:1fr 1fr;gap:72px 32px}.project.wide{grid-column:1/-1}.project img{width:100%;height:auto;display:block;filter:saturate(.93) contrast(1.01);background:#e7e3dc}.project-info{padding-top:15px;border-top:1px solid var(--ink);margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}.project h3{font-size:29px;margin:0}.project p{margin:4px 0;font-size:14px}.project .role{grid-column:2;color:var(--muted);font-size:12px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:60px}.dark{background:#111;color:#fff}.services p{font-size:clamp(28px,3.2vw,52px);margin:0;padding:18px 0;border-bottom:1px solid #444}.services small{font-size:.46em;line-height:1.5;font-weight:400;opacity:.72}.studio p{max-width:760px;font-size:18px;line-height:1.6}.contact{padding:150px var(--pad);background:#dfdcd4}.contact h2{max-width:1050px}.contact-note{color:var(--muted)}.contact a{border-bottom:1px solid currentColor}.contact a:hover{opacity:.65}footer{padding:22px var(--pad);display:grid;grid-template-columns:1fr auto 2fr;gap:24px;border-top:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.08em}footer span:last-child{text-align:right;color:var(--muted)}
@media(max-width:900px){.site-header{padding-top:22px;padding-bottom:22px}.hero-panel{padding-top:86px;padding-bottom:72px}.hero h1{font-size:clamp(46px,10vw,82px)}.intro,.two-col{grid-template-columns:1fr}.intro .section-kicker,.intro h2,.intro .lead{grid-column:auto}}
@media(max-width:760px){.site-header{padding:18px 20px;align-items:flex-start}.brand{font-size:20px}.site-header nav{gap:18px;font-size:15px}.site-header nav a:nth-child(2),.site-header nav a:nth-child(3){display:none}.hero-panel{padding:68px 20px 58px}.hero h1{font-size:12.5vw;max-width:none}.image-label{padding:14px 20px 16px}.section{padding:88px 20px}.projects{padding:0 20px 88px;grid-template-columns:1fr}.project,.project.wide{grid-column:1}.project-info{grid-template-columns:1fr}.project .role{grid-column:1}footer{padding:20px;grid-template-columns:1fr;gap:8px}footer span:last-child{text-align:left}}
