@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500&family=Newsreader:ital,opsz,wght@1,6..72,400&display=swap');

:root { --ink:#132820; --cream:#f1eee5; --sage:#b7c7a4; --line:rgba(19,40,32,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:"DM Sans",sans-serif; font-weight:300; }
a { color:inherit; }
.site-header { height:104px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,6vw,96px); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:13px; text-decoration:none; text-transform:uppercase; letter-spacing:.17em; font-size:14px; font-weight:500; }
.brand-mark { width:31px; height:31px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.header-contact { font-size:13px; text-transform:uppercase; text-underline-offset:6px; letter-spacing:.15em; }
.hero { min-height:calc(100vh - 104px); padding:clamp(70px,11vh,130px) clamp(24px,9vw,140px) 70px; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.hero::after { content:""; position:absolute; width:min(36vw,480px); aspect-ratio:1; right:-5%; top:15%; border:1px solid var(--line); border-radius:50%; box-shadow:0 0 0 55px var(--cream),0 0 0 56px var(--line),0 0 0 110px var(--cream),0 0 0 111px var(--line); z-index:-1; }
.eyebrow,.section-number { text-transform:uppercase; letter-spacing:.2em; font-size:11px; font-weight:500; }
h1 { font-size:clamp(58px,9.4vw,142px); line-height:.82; letter-spacing:-.055em; font-weight:400; margin:35px 0 40px; max-width:1100px; }
h1 em { font-family:"Newsreader",serif; font-weight:400; }
.intro { font-size:clamp(17px,1.55vw,23px); line-height:1.6; max-width:630px; margin:0 0 46px; }
.button { align-self:flex-start; padding:17px 22px; border:1px solid var(--ink); text-decoration:none; text-transform:uppercase; letter-spacing:.13em; font-size:11px; font-weight:500; display:flex; gap:35px; transition:.2s; }
.button:hover { background:var(--ink); color:var(--cream); }
.approach { background:var(--ink); color:var(--cream); padding:clamp(80px,11vw,160px) clamp(24px,7vw,110px); display:grid; grid-template-columns:1fr 1fr; gap:8vw; }
h2 { font-family:"Newsreader",serif; font-size:clamp(50px,6.5vw,96px); line-height:.95; font-weight:400; letter-spacing:-.04em; margin:40px 0; }
.services article { padding:32px 0 38px; border-top:1px solid rgba(241,238,229,.25); display:grid; grid-template-columns:48px 1fr; }
.services article>span { font-size:11px; opacity:.55; padding-top:7px; }
h3 { font-size:22px; font-weight:400; margin:0 0 13px; }
.services p { grid-column:2; max-width:470px; margin:0; line-height:1.65; opacity:.72; }
.contact { padding:clamp(85px,12vw,170px) clamp(24px,9vw,140px); }
.contact h2 { font-size:clamp(60px,8.5vw,128px); }
.contact-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr); gap:clamp(50px,10vw,150px); margin-top:70px; padding-top:40px; border-top:1px solid var(--line); }
.contact-form { display:flex; flex-direction:column; gap:25px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:25px; }
.contact-form label { display:flex; flex-direction:column; gap:10px; text-transform:uppercase; letter-spacing:.14em; font-size:10px; font-weight:500; }
.contact-form label span { opacity:.55; }
.contact-form input,.contact-form textarea { appearance:none; border:0; border-bottom:1px solid var(--line); border-radius:0; padding:11px 0 14px; background:transparent; color:var(--ink); font:400 17px/1.5 "DM Sans",sans-serif; outline:none; resize:vertical; }
.contact-form input:focus,.contact-form textarea:focus { border-color:var(--ink); }
.form-button { cursor:pointer; background:transparent; margin-top:5px; }
.form-note { margin:0; font-size:11px; line-height:1.5; opacity:.6; }
.contact-details { display:flex; flex-direction:column; gap:32px; font-size:17px; line-height:1.65; }
.contact-details p { margin:0 0 5px; text-transform:uppercase; letter-spacing:.16em; font-size:10px; font-weight:500; opacity:.6; }
.contact-details a { text-underline-offset:5px; }
address { font-style:normal; }
footer { background:var(--sage); padding:30px clamp(24px,6vw,96px); display:flex; justify-content:space-between; text-transform:uppercase; letter-spacing:.12em; font-size:10px; }
@media (max-width:760px) { .site-header{height:82px}.hero{min-height:calc(100vh - 82px)}.hero::after{top:24%;right:-30%;width:70vw}.approach{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr;margin-top:45px}.field-row{grid-template-columns:1fr}footer{gap:15px;flex-direction:column}.header-contact{display:none} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} }