:root { --ink:#102019; --green:#1b3026; --paper:#f2eee4; --gold:#b58b3d; --gold2:#d6ba75; --white:#fffdf7; --serif:Georgia,"Times New Roman",serif; --sans:"Helvetica Neue",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); }
body.no-scroll { overflow:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
button,input,textarea { font:inherit; }
.site-header { height:92px; padding:0 5vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(16,32,25,.15); position:relative; z-index:10; }
.header-overlay { position:absolute; inset:0 0 auto; color:var(--white); border-color:rgba(255,255,255,.15); }
.wordmark { font:400 36px/1 var(--serif); letter-spacing:-.08em; }
.wordmark span { color:var(--gold2); font-style:italic; }
.nav { display:flex; align-items:center; gap:34px; font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
.nav a { opacity:.58; transition:.2s; }
.nav a:hover,.nav a.active { opacity:1; color:var(--gold); }
.header-overlay .nav a:hover,.header-overlay .nav a.active { color:var(--gold2); }
.nav-contact { padding:13px 18px; border:1px solid var(--gold); }
.menu-button { display:none; border:0; background:transparent; color:inherit; text-transform:uppercase; letter-spacing:.15em; }
.eyebrow { margin:0 0 25px; color:var(--gold); font-size:10px; letter-spacing:.22em; text-transform:uppercase; }
.home-page { background:var(--ink); color:var(--white); overflow:hidden; }
.home-stage { min-height:100vh; padding:140px 5vw 44px; display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; align-items:center; position:relative; }
.home-stage::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 35% 50%,rgba(181,139,61,.13),transparent 34%); pointer-events:none; }
.home-copy { position:relative; z-index:2; }
.home-copy h1,.page-intro h1,.about-story h1,.contact-intro h1 { margin:0; font:400 clamp(58px,7.2vw,116px)/.9 var(--serif); letter-spacing:-.055em; }
h1 em { color:var(--gold2); font-weight:400; }
.home-intro { max-width:520px; margin:34px 0; color:rgba(255,255,255,.62); font-size:18px; line-height:1.65; }
.arrow-link { display:inline-flex; gap:45px; align-items:center; padding:17px 0; border-bottom:1px solid var(--gold2); color:var(--gold2); font-size:11px; letter-spacing:.17em; text-transform:uppercase; }
.arrow-link span { transition:transform .2s; }.arrow-link:hover span { transform:translate(4px,-4px); }
.home-showcase { height:min(67vh,690px); min-height:480px; position:relative; display:grid; grid-template-columns:1fr 180px; gap:24px; z-index:1; }
.showcase-image-wrap { height:100%; position:relative; overflow:hidden; background:#0a130f; }
.showcase-image-wrap::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(214,186,117,.24); pointer-events:none; }
.showcase-image-wrap img { height:100%; object-fit:cover; transition:opacity .25s ease,transform .55s ease; }
.showcase-image-wrap img.changing { opacity:.1; transform:scale(1.03); }
.showcase-image-wrap p { position:absolute; left:22px; bottom:18px; margin:0; padding:9px 12px; background:rgba(16,32,25,.82); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.showcase-menu { align-self:end; display:grid; }
.showcase-option { padding:18px 0; border:0; border-top:1px solid rgba(255,255,255,.2); background:transparent; color:rgba(255,255,255,.52); text-align:left; cursor:pointer; text-transform:uppercase; letter-spacing:.12em; font-size:10px; transition:.2s; }
.showcase-option span { display:block; margin-bottom:8px; color:var(--gold); font-family:var(--serif); font-size:14px; }
.showcase-option:hover,.showcase-option.active { color:var(--white); padding-left:10px; border-color:var(--gold2); }
.home-footer { position:absolute; z-index:2; left:5vw; right:5vw; bottom:22px; display:flex; justify-content:space-between; color:rgba(255,255,255,.34); font-size:9px; letter-spacing:.17em; text-transform:uppercase; }
.page-intro { padding:85px 7vw 75px; display:grid; grid-template-columns:1fr auto; align-items:end; background:var(--ink); color:var(--white); }
.page-intro .eyebrow { grid-column:1/-1; }
.page-intro h1 { font-size:clamp(55px,6.5vw,100px); }
.page-intro > p:last-child { max-width:250px; color:rgba(255,255,255,.5); line-height:1.6; }
.work-library { padding:35px 5vw 110px; }
.filter-bar { display:flex; gap:12px; margin-bottom:35px; }
.filter { border:1px solid rgba(16,32,25,.25); border-radius:30px; padding:11px 17px; background:transparent; color:var(--ink); cursor:pointer; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.filter.active,.filter:hover { background:var(--ink); color:var(--white); }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); grid-auto-flow:dense; gap:18px; }
.project-card { min-height:360px; aspect-ratio:1/1; position:relative; padding:0; overflow:hidden; border:0; background:#ddd; text-align:left; cursor:pointer; }
.project-card.tall { grid-row:span 2; aspect-ratio:auto; }
.project-card.wide { grid-column:span 2; aspect-ratio:2/1; }
.project-card img { height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.project-overlay { position:absolute; inset:auto 0 0; padding:70px 22px 22px; color:white; background:linear-gradient(transparent,rgba(8,18,13,.86)); transform:translateY(28px); transition:.35s; }
.project-overlay b,.project-overlay small { display:block; }.project-overlay b { font:400 27px/1.1 var(--serif); }.project-overlay small { margin-top:7px; opacity:.6; text-transform:uppercase; letter-spacing:.13em; }.project-overlay i { display:block; margin-top:15px; color:var(--gold2); font-style:normal; font-size:10px; letter-spacing:.14em; text-transform:uppercase; opacity:0; }
.project-card:hover img { transform:scale(1.045); }.project-card:hover .project-overlay { transform:none; }.project-card:hover .project-overlay i { opacity:1; }
.project-card.hidden { display:none; }
.case-dialog { width:min(1180px,92vw); height:min(760px,88vh); padding:0; border:0; color:var(--white); background:var(--ink); box-shadow:0 30px 90px rgba(0,0,0,.45); }
.case-dialog::backdrop { background:rgba(4,10,7,.78); backdrop-filter:blur(8px); }
.case-dialog[open] { display:grid; grid-template-columns:1.05fr .95fr; }
.dialog-image { height:100%; overflow:hidden; background:#09130e; }.dialog-image img { height:100%; object-fit:cover; }
.dialog-copy { padding:70px 5vw 35px; overflow:auto; }.dialog-copy h2 { margin:0 0 35px; font:400 clamp(40px,4vw,65px)/1 var(--serif); }.dialog-copy dl { margin:0; }.dialog-copy dl div { padding:20px 0; border-top:1px solid rgba(255,255,255,.15); display:grid; grid-template-columns:110px 1fr; gap:25px; }.dialog-copy dt { color:var(--gold2); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }.dialog-copy dd { margin:0; color:rgba(255,255,255,.68); line-height:1.6; }
.dialog-close { position:absolute; right:20px; top:15px; z-index:2; width:38px; height:38px; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:rgba(16,32,25,.55); color:white; cursor:pointer; font-size:25px; }
.dialog-nav { display:flex; justify-content:space-between; margin-top:30px; }.dialog-nav button { padding:0; border:0; background:transparent; color:var(--gold2); cursor:pointer; text-transform:uppercase; letter-spacing:.12em; font-size:9px; }
.about-layout { min-height:calc(100vh - 92px); display:grid; grid-template-columns:1.15fr .85fr; }
.about-story { padding:80px 7vw; }.about-story h1 { font-size:clamp(55px,6.5vw,100px); }.about-lead { max-width:760px; margin:42px 0; font:400 clamp(23px,2.4vw,37px)/1.35 var(--serif); }.story-columns { display:grid; grid-template-columns:1fr 1fr; gap:40px; max-width:820px; color:#536159; line-height:1.75; }.about-facts { display:flex; gap:45px; margin-top:55px; padding-top:30px; border-top:1px solid rgba(16,32,25,.18); }.about-facts span { max-width:150px; color:#6b746e; font-size:10px; line-height:1.5; letter-spacing:.08em; text-transform:uppercase; }.about-facts b { display:block; color:var(--gold); font:400 31px/1 var(--serif); margin-bottom:8px; }
.founder-card { min-height:650px; position:relative; overflow:hidden; background:var(--ink); }.founder-card img { height:100%; object-fit:cover; filter:saturate(.75); }.founder-card::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 55%,rgba(6,13,9,.8)); }.founder-card div { position:absolute; z-index:1; left:35px; bottom:35px; color:white; }.founder-card p { margin:0; font:400 34px/1 var(--serif); }.founder-card span { display:block; margin-top:9px; color:var(--gold2); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }
.contact-page { background:var(--ink); color:var(--white); }.contact-page .site-header { border-color:rgba(255,255,255,.15); }.contact-layout { min-height:calc(100vh - 92px); display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:9vw; padding:65px 8vw; }.contact-intro h1 { font-size:clamp(55px,6.5vw,100px); }.contact-intro > p:not(.eyebrow) { max-width:470px; color:rgba(255,255,255,.55); line-height:1.7; }.contact-location { margin-top:50px; }.contact-location span,.contact-location b { display:block; }.contact-location span { color:var(--gold2); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }.contact-location b { margin-top:10px; font:400 20px/1.2 var(--serif); }
.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:28px 24px; }.contact-form label { display:grid; gap:10px; color:var(--gold2); font-size:9px; letter-spacing:.16em; text-transform:uppercase; }.contact-form label:nth-child(4) { grid-column:span 2; }.contact-form input,.contact-form textarea { width:100%; border:0; border-bottom:1px solid rgba(255,255,255,.28); border-radius:0; padding:10px 0; outline:0; background:transparent; color:white; font:16px/1.5 var(--sans); resize:vertical; }.contact-form input:focus,.contact-form textarea:focus { border-color:var(--gold2); }.submit-button { justify-self:start; padding:16px 22px; border:1px solid var(--gold); background:var(--gold); color:var(--ink); cursor:pointer; font-size:10px; letter-spacing:.16em; text-transform:uppercase; }.submit-button span { margin-left:25px; }.form-status { margin:0; align-self:center; color:rgba(255,255,255,.52); font-size:12px; line-height:1.5; }
.page-footer { padding:28px 5vw; background:#0b1711; color:white; }.page-footer a { display:flex; justify-content:space-between; align-items:center; font:400 clamp(22px,3vw,40px)/1.1 var(--serif); }.page-footer span { color:var(--gold2); font:500 9px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; }
@media(max-width:900px){.site-header{height:75px}.menu-button{display:block}.nav{display:none;position:absolute;top:75px;left:0;right:0;padding:25px 5vw;background:var(--ink);color:white;flex-direction:column;align-items:flex-start}.nav.open{display:flex}.home-stage{padding-top:115px;grid-template-columns:1fr 1fr;gap:4vw}.home-showcase{grid-template-columns:1fr;height:58vh}.showcase-menu{position:absolute;left:0;right:0;bottom:0;padding:0 15px;background:rgba(16,32,25,.82);grid-template-columns:repeat(3,1fr)}.showcase-option{padding:14px 5px}.showcase-option span{display:none}.showcase-option:hover,.showcase-option.active{padding-left:5px}.showcase-image-wrap p{bottom:58px}.project-grid{grid-template-columns:repeat(2,1fr)}.project-card.wide{grid-column:span 2}.case-dialog[open]{grid-template-columns:1fr 1fr}.about-layout,.contact-layout{grid-template-columns:1fr}.founder-card{min-height:70vh}.contact-layout{padding-top:80px;padding-bottom:80px}}
@media(max-width:620px){.home-page{overflow:auto}.home-stage{min-height:100svh;display:block;padding-top:120px}.home-copy h1{font-size:60px}.home-showcase{height:45vh;min-height:340px;margin-top:45px}.home-footer{display:none}.page-intro{grid-template-columns:1fr;padding:65px 6vw 55px}.page-intro h1{font-size:55px}.page-intro>p:last-child{margin-top:28px}.project-grid{grid-template-columns:1fr}.project-card,.project-card.tall,.project-card.wide{grid-column:auto;grid-row:auto;aspect-ratio:1/1;min-height:0}.case-dialog{width:100vw;height:100vh;max-width:none;max-height:none}.case-dialog[open]{grid-template-columns:1fr;grid-template-rows:40vh 1fr}.dialog-copy{padding:35px 7vw}.dialog-copy dl div{grid-template-columns:1fr;gap:8px}.about-story{padding:65px 6vw}.about-story h1,.contact-intro h1{font-size:58px}.story-columns{grid-template-columns:1fr}.about-facts{flex-wrap:wrap}.contact-form{grid-template-columns:1fr}.contact-form label:nth-child(4){grid-column:auto}.contact-layout{padding:65px 6vw}.page-footer a{align-items:flex-start;flex-direction:column;gap:15px}}