:root{--bg:#fafaf8;--ink:#1a1a1a;--muted:#6e6e6e;--soft:#eeece6;--line:#e5e3dd;--accent:#a98b6c}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter','Helvetica Neue','Arial',sans-serif;background:var(--bg);color:var(--ink);line-height:1.65;font-weight:300;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.nav{position:sticky;top:0;background:rgba(250,250,248,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);z-index:100;padding:1.5rem 0}
.nav-inner{max-width:1280px;margin:0 auto;padding:0 2.5rem;display:flex;justify-content:space-between;align-items:center}
.logo{font-size:1.05rem;font-weight:500;letter-spacing:.02em;text-decoration:none;color:var(--ink)}
.logo span{color:var(--muted);font-weight:300}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{color:var(--muted);text-decoration:none;font-size:.9rem;font-weight:400;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.hero{padding:6rem 2.5rem 5rem;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;align-items:end}
.hero-text h1{font-size:4rem;font-weight:300;line-height:1.05;letter-spacing:-.02em;margin-bottom:1.5rem}
.hero-text h1 em{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;color:var(--accent)}
.hero-text p{font-size:1.15rem;color:var(--muted);max-width:42ch}
.hero-img{position:relative}
.hero-img img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.eyebrow{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:1rem}
section{max-width:1280px;margin:0 auto;padding:5rem 2.5rem}
.about{display:grid;grid-template-columns:1fr 2fr;gap:5rem;align-items:start;border-top:1px solid var(--line);padding-top:5rem}
.about h2{font-size:2.5rem;font-weight:300;line-height:1.15;letter-spacing:-.01em}
.about p{font-size:1.1rem;color:var(--muted);margin-bottom:1.25rem}
.philosophy{background:var(--soft);padding:6rem 2.5rem;margin-top:5rem}
.philosophy-inner{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:3rem}
.philosophy-inner div h3{font-size:1.25rem;font-weight:500;margin:1rem 0 .5rem}
.philosophy-inner div p{color:var(--muted);font-size:.98rem}
.philosophy-inner .num{font-family:'Cormorant Garamond',serif;font-size:2.5rem;color:var(--accent);font-style:italic}
.work{margin-top:5rem}
.work h2{font-size:2.5rem;font-weight:300;margin-bottom:3rem;letter-spacing:-.01em}
.project-list{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem 2.5rem}
.project img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px;transition:transform .6s}
.project:hover img{transform:scale(1.02)}
.project h3{font-size:1.2rem;font-weight:500;margin-top:1.25rem}
.project p{color:var(--muted);font-size:.92rem;margin-top:.25rem}
.page-header{padding:5rem 2.5rem 3rem;max-width:1280px;margin:0 auto}
.page-header h1{font-size:3.5rem;font-weight:300;letter-spacing:-.02em;margin-bottom:1rem}
.page-header p{font-size:1.15rem;color:var(--muted);max-width:55ch}
.team{display:grid;grid-template-columns:repeat(2,1fr);gap:4rem 3rem}
.member{display:grid;grid-template-columns:1fr 1.4fr;gap:1.75rem;align-items:start}
.member img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px;filter:grayscale(.25)}
.member h3{font-size:1.3rem;font-weight:500;margin-bottom:.25rem}
.member .role{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem}
.member p{font-size:.95rem;color:var(--muted)}
.contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:5rem}
.contact-info-block{margin-bottom:2.5rem}
.contact-info-block .eyebrow{margin-bottom:.5rem}
.contact-info-block p{font-size:1.05rem;color:var(--ink);font-weight:400}
.contact-info-block a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--line)}
form{display:grid;gap:1.5rem}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
form label{display:block;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
form input,form textarea,form select{width:100%;border:1px solid var(--line);background:#fff;padding:.85rem 1rem;font:inherit;font-size:1rem;color:var(--ink);border-radius:2px;transition:border-color .2s}
form input:focus,form textarea:focus,form select:focus{outline:none;border-color:var(--ink)}
form textarea{min-height:140px;resize:vertical}
form button{justify-self:start;padding:1rem 2.5rem;background:var(--ink);color:#fff;border:none;font:inherit;font-size:.9rem;font-weight:500;cursor:pointer;border-radius:2px;transition:background .2s}
form button:hover{background:var(--accent)}
footer{border-top:1px solid var(--line);padding:3rem 2.5rem;margin-top:5rem;display:flex;justify-content:space-between;color:var(--muted);font-size:.88rem;max-width:1280px;margin-left:auto;margin-right:auto}
@media(max-width:860px){
  .hero{grid-template-columns:1fr;gap:2.5rem;padding:3rem 1.5rem}
  .hero-text h1{font-size:2.5rem}
  .about,.contact-wrap,.team{grid-template-columns:1fr;gap:2rem}
  .philosophy-inner,.project-list{grid-template-columns:1fr;gap:2rem}
  section,.philosophy{padding:3rem 1.5rem}
  .nav-links{gap:1.25rem}
  .page-header h1{font-size:2.5rem}
  .member{grid-template-columns:1fr}
  form .row{grid-template-columns:1fr}
  footer{flex-direction:column;gap:.5rem;text-align:center}
}