:root { --ink:#111311; --paper:#f7f7f4; --line:#d8d9d3; --lime:#ccff31; --muted:#62665f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { display:flex; flex-direction:column; min-height:100dvh; margin:0; overflow-x:hidden; color:var(--ink); background:#fff; font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
main { display:flex; flex:1; min-height:0; flex-direction:column; }
.home-main { height:calc(100dvh - 132px); min-height:600px; flex:none; margin-top:90px; }
.project-gallery { position:relative; width:100%; max-width:none; flex:1 1 auto; min-height:0; margin:0; overflow:hidden; background:#ecece8; }
.gallery-photo { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none; transition:opacity .7s ease-in-out; }
.gallery-photo.is-active { opacity:1; pointer-events:auto; cursor:pointer; }
.gallery-photo-two { object-position:center 25%; }
.gallery-photo-four { object-position:center 30%; }
.gallery-photo-five { object-fit:contain; object-position:center; background:#fff; }
.gallery-photo-eight { object-fit:contain; object-position:center; background:#fff; }
.site-header { position:fixed; z-index:20; top:0; left:0; display:flex; width:100%; align-items:flex-start; justify-content:space-between; padding:26px clamp(24px,6vw,88px) 16px; background:#fff; }
.brand { font-weight:800; font-size:20px; letter-spacing:-.9px; line-height:1.05; }
.brand small { display:block; margin-top:7px; font:500 10px/1.2 "DM Mono",monospace; letter-spacing:1px; }
.site-nav { display:flex; gap:34px; padding-top:3px; font-size:13px; font-weight:700; }
.site-nav a { border-bottom:1px solid transparent; padding-bottom:4px; }
.site-nav a:hover,.site-nav .active { border-color:var(--ink); }
.menu-button { display:none; background:none; border:0; font:700 13px Manrope,sans-serif; }
.intro { max-width:1010px; margin:4px auto 12px; padding:0 30px; text-align:center; }
.eyebrow,.project-number { margin:0 0 13px; font:500 10px/1.4 "DM Mono",monospace; letter-spacing:1.2px; }
.intro h1 { max-width:1500px; margin:0 auto; font:500 clamp(22px,3vw,32px)/1.02 Archivo,sans-serif; letter-spacing:-1.8px; word-spacing:.2em; text-transform:uppercase; }
.intro h1 span { display:block; }
.intro .slogan-lead { margin-bottom:7px; font:500 clamp(14.67px,2vw,21.33px)/1.2 "DM Mono",monospace; letter-spacing:1.2px; }
@media(min-width:701px){.intro h1 span:last-child{white-space:nowrap}}
.intro-copy { max-width:420px; margin:25px auto 0; color:var(--muted); font-size:14px; line-height:1.6; }
.feature-project { align-self:stretch; width:100%; max-width:100%; flex:0 0 auto; margin:0; padding:10px clamp(24px,4vw,55px); background:#fff; }
.sun { position:absolute; top:13%; right:15%; width:100px; aspect-ratio:1; border-radius:50%; background:#fff4bc; opacity:.78; }
.cloud { position:absolute; width:34%; height:7%; background:#fff; opacity:.6; filter:blur(16px); border-radius:100%; }.cloud-one{top:15%;left:5%}.cloud-two{top:27%;right:4%;transform:scale(.55)}
.tree-line { position:absolute; inset:auto 0 30% 0; height:13%; background:repeating-radial-gradient(ellipse at 4% 100%,#274f35 0 8%,transparent 9% 13%),linear-gradient(#517557,#31523b); }
.canopy { position:absolute; z-index:3; left:-7%; right:-5%; bottom:32%; height:32%; background:linear-gradient(145deg,#faf9ef 0 44%,#d4d7d0 45% 51%,#f5f2e9 52%); clip-path:polygon(0 56%,74% 0,100% 21%,26% 100%); box-shadow:0 18px 18px #0003; transform:skewY(-2deg); }
.canopy i { position:absolute; top:44%; bottom:5%; width:2px; background:#95978f; transform:rotate(18deg); }.canopy i:nth-child(1){left:34%}.canopy i:nth-child(2){left:45%}.canopy i:nth-child(3){left:56%}.canopy i:nth-child(4){left:67%}.canopy i:nth-child(5){left:78%}
.glass-box { position:absolute; z-index:2; left:19%; bottom:0; width:57%; height:37%; background:linear-gradient(120deg,#253b3cdd,#b3d3d0a6 43%,#182d2cdd); border:5px solid #3b4340; box-shadow:inset 0 0 0 1px #b9d6d1; }
.column { position:absolute; z-index:4; bottom:0; width:25px; height:36%; background:linear-gradient(90deg,#9c9890,#eeeae0 48%,#77766e); }.column-one{left:27%}.column-two{left:49%}.column-three{left:72%}
.project-detail { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:baseline; gap:10px 25px; padding:0 2px; }.gallery-meta { display:flex; align-items:center; gap:12px; }.project-detail .project-number { margin:0; }.gallery-controls { display:flex; align-items:center; gap:4px; }.gallery-controls button { width:19px; height:19px; padding:0; color:#000; border:0; background:transparent; font:500 12px/1 "DM Mono",monospace; cursor:pointer; }.gallery-controls button:hover { color:#000; }.gallery-controls button.is-active { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }.double-triangle { display:inline-flex; align-items:center; letter-spacing:0; }.double-triangle span + span { margin-left:-4px; }.project-detail h2 { margin:0; font-size:18px; letter-spacing:-.7px; white-space:nowrap; }.project-summary { display:block; width:100%; min-width:0; justify-self:center; text-align:center; }.project-summary h2 { display:inline; margin-right:10px; }.project-summary p { display:inline; margin:0; color:var(--ink); font-size:16px; }.text-link { font:500 11px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.7px; white-space:nowrap; }.text-link-mobile { display:none; }.text-link span,.contact-link span { color:#698800; font-size:17px; }
@media(max-width:1100px){.project-detail{grid-template-columns:auto 1fr;align-items:start}.project-summary{grid-column:1 / -1;grid-row:2}.text-link-desktop{justify-self:end}}
.statement { display:grid; grid-template-columns:1fr 1.7fr 1fr; gap:35px; max-width:1100px; margin:150px auto; padding:35px; background:#081018b8; backdrop-filter:blur(6px); }.statement h2 { margin:0; font-size:clamp(28px,3.7vw,47px); letter-spacing:-2px; line-height:1.04; }.statement > p:last-child { margin:0; color:#e5e8e3; font-size:14px; line-height:1.65; }
.contact-panel { margin:0 clamp(18px,5.6vw,82px) 20px; padding:clamp(30px,6vw,80px); background:var(--lime); }.contact-panel h2 { margin:0 0 26px; font-size:clamp(38px,6vw,76px); line-height:.98; letter-spacing:-3px; }.contact-link { font:500 clamp(14px,2vw,21px) "DM Mono",monospace; border-bottom:1px solid #596d08; }
footer { position:fixed; z-index:20; right:0; bottom:0; left:0; display:flex; justify-content:center; padding:12px clamp(24px,6vw,88px) 16px; color:var(--muted); background:#fff; font:500 10px "DM Mono",monospace; letter-spacing:.5px; }
@media(max-width:700px){body{min-height:100dvh;overflow-x:hidden}.site-header{padding:22px 24px 14px}.site-nav{display:none; position:absolute; top:70px; right:24px; flex-direction:column; gap:16px; padding:17px; background:#fff; border:1px solid var(--line); z-index:10}.site-nav.open{display:flex}.menu-button{display:block}.home-main{height:auto;min-height:0;margin-top:70px}.intro{margin:8px auto 30px;padding:0 24px}.intro h1{letter-spacing:-1.5px}.project-gallery{width:100%;height:55vh;min-height:360px;flex:none;margin:0}.feature-project{margin:0}.project-detail{grid-template-columns:minmax(0,1fr);align-items:flex-start;gap:13px}.gallery-meta{grid-column:1;width:100%}.project-summary{align-items:flex-start;flex-direction:column;gap:3px;white-space:normal}.text-link-desktop{display:none}.text-link-mobile{display:inline-block;margin:0}.text-link{align-self:flex-start;margin-left:0}.gallery-meta .text-link-mobile{margin-left:auto}.about-section{min-height:0;padding:74px 28px 82px;scroll-margin-top:70px}.about-profile{grid-template-columns:1fr;gap:38px}.about-portrait{width:min(78vw,330px);margin:auto}.about-copy h2{font-size:30px}.about-copy .about-role{font-size:21px}.about-copy > p:not(.about-label):not(.about-role){margin-bottom:24px;font-size:16px;line-height:1.65}footer{padding:18px 24px;gap:13px;font-size:9px}}
