:root { --ink:#253b38; --paper:#f6f3ee; --lime:#dbe68a; --line:#d6d5ce; --muted:#677572; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",sans-serif; } a { color:inherit; text-decoration:none; } .section-pad { padding-left:clamp(24px,6.3vw,100px); padding-right:clamp(24px,6.3vw,100px); } .header { min-height:84px; padding:0 clamp(24px,6.3vw,100px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); } .brand { font:600 22px/1 "Fraunces",serif; letter-spacing:-1px; display:grid; grid-template-columns:auto auto; align-items:baseline; column-gap:5px; } .brand em { color:#819047; } .brand span { font:400 8px/1 "DM Mono",monospace; letter-spacing:1.3px; text-transform:uppercase; grid-column:1/-1; margin-top:5px; } .nav { display:flex; align-items:center; gap:30px; font-size:13px; } .nav > a:not(.nav-cta) { color:#52605d; } .nav-cta { border:1px solid var(--ink); border-radius:30px; padding:11px 16px; } .nav-cta span { margin-left:7px; } .menu-button { display:none; }
.hero { padding-top:52px; min-height:645px; display:flex; flex-direction:column; } .eyebrow,.label { font:500 10px/1.4 "DM Mono",monospace; letter-spacing:1.1px; color:var(--muted); } .eyebrow span { display:inline-block;width:7px;height:7px;background:#b6c66b;border-radius:50%;margin-right:7px; } .hero-grid { display:grid; grid-template-columns:1.5fr .7fr; gap:30px; align-items:end; margin-top:55px; } h1,h2 { font:500 clamp(54px,8vw,122px)/.93 "Fraunces",serif; letter-spacing:-.065em; margin:0; } h1 i,h2 i { font-weight:500; color:#889c4e; } .hero-copy { max-width:295px; padding-bottom:12px; } .hero-copy p,.body-copy { font-size:16px; line-height:1.55; margin:0 0 25px; color:#53615e; } .button { display:inline-flex; align-items:center; gap:25px; border-radius:50px; background:var(--ink); color:#fff; padding:15px 18px 15px 21px; font-size:13px; transition:transform .2s; } .button b { display:grid; place-items:center; width:22px;height:22px;flex:none;border-radius:50%;background:var(--lime); } .button b::before { content:""; width:7px;height:7px;border-top:1.5px solid var(--ink);border-right:1.5px solid var(--ink);transform:rotate(45deg);margin-left:-3px; } .button b::after { content:""; position:absolute;width:9px;height:1.5px;background:var(--ink);transform:translateX(-1px); } .button b { position:relative; } .button:hover { transform:translateY(-2px); }.hero-bottom { margin-top:auto; border-top:1px solid var(--line); padding-top:20px; }.hero-bottom p { font-size:12px; color:var(--muted); max-width:285px; line-height:1.5; }
.areas { padding-top:105px; padding-bottom:105px; display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; background:#e8ebe4; }.section-intro h2,.about h2,.contact h2 { font-size:clamp(44px,5.2vw,78px); margin-top:22px; }.area-list { border-top:1px solid #bfc5bd; }.area-list article { display:grid; grid-template-columns:55px 1fr .95fr; gap:15px; align-items:center; border-bottom:1px solid #bfc5bd; padding:22px 0; }.area-list span { font:11px "DM Mono"; color:#72806b; }.area-list h3 { margin:0;font:500 clamp(24px,2.35vw,35px)/.98 "Fraunces",serif;letter-spacing:-.04em; }.area-list p { margin:0;color:var(--muted);font-size:13px;line-height:1.5;max-width:200px; }
.process { padding-top:110px;padding-bottom:110px;background:var(--ink); }.process-card { color:#f8f6f1; max-width:1080px; margin:auto; }.process-card .label { color:#c7d39a; }.process-card h2 { font-size:clamp(52px,7vw,105px); margin-top:24px; }.steps { margin-top:65px; display:grid;grid-template-columns:repeat(3,1fr);gap:45px; }.steps div { border-top:1px solid #60716c;padding-top:17px; }.steps span { color:var(--lime);font:12px "DM Mono"; }.steps p { max-width:230px;font-size:15px;line-height:1.5;color:#dce2dc; }.steps b { color:white;display:block;font-weight:500; }
.about { padding-top:110px;padding-bottom:110px;display:grid;grid-template-columns:.84fr 1.16fr;gap:clamp(45px,8vw,140px);align-items:center; }.portrait { height:545px;position:relative;background:#b8c4ad;overflow:hidden;display:flex;align-items:end;padding:28px;color:#f6f3ee; }.portrait:before { content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:#7f956c;right:-90px;top:-30px; }.portrait-light { position:absolute;width:180px;height:400px;right:25%;bottom:-40px;border-radius:110px 110px 0 0;background:#e5decd;transform:rotate(13deg); }.portrait p { z-index:1;font:500 34px/.95 "Fraunces";letter-spacing:-.06em;margin:0; }.portrait span { z-index:1;position:absolute;right:25px;bottom:28px;font:12px "DM Mono"; }.about-copy { max-width:650px; }.about h2 { line-height:1.01;margin-bottom:28px; }.body-copy { max-width:510px; }.credentials { border-top:1px solid var(--line);padding-top:15px;display:flex;gap:15px;flex-wrap:wrap;font:10px "DM Mono";letter-spacing:.5px;color:#66736f; }.credentials span:before { content:"•";color:#91a050;margin-right:5px; }.quote { background:#dbe68a;padding-top:110px;padding-bottom:110px; }.quote p { margin:0;text-align:center;font:500 clamp(35px,5vw,74px)/1.04 "Fraunces";letter-spacing:-.055em; }.quote i { color:#486055; }
.faq { padding-top:105px;padding-bottom:105px;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px; }.faq h2 { font-size:clamp(44px,5.2vw,78px);margin-top:22px; }.faq-list { border-top:1px solid var(--line); }.faq details { border-bottom:1px solid var(--line);padding:0 0 18px; }.faq summary { cursor:pointer;list-style:none;padding:21px 0 3px;display:flex;justify-content:space-between;gap:20px;font:500 clamp(20px,2vw,29px)/1.1 "Fraunces";letter-spacing:-.04em; }.faq summary::-webkit-details-marker { display:none; }.faq summary span { font:400 26px/1 "DM Sans";color:#8a9c50;transition:transform .2s; }.faq details[open] summary span { transform:rotate(45deg); }.faq details p { max-width:480px;margin:14px 40px 2px 0;color:var(--muted);font-size:14px;line-height:1.55; }
.contact { background:#c1d0c1;padding-top:100px;padding-bottom:90px; }.contact h2 { margin-top:22px;max-width:900px; }.contact h2 i { color:#486057; }.contact-actions { display:flex;gap:28px;align-items:center;margin-top:46px; }.button.light { background:#f6f3ee;color:var(--ink); }.text-link { font-size:14px;border-bottom:1px solid #697b70;padding-bottom:3px; }.text-link span { margin-left:6px; }.contact-note { margin:35px 0 0;font:10px "DM Mono";color:#587062;letter-spacing:.3px; } footer { padding:35px clamp(24px,6.3vw,100px);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;color:var(--muted); } footer p { margin:0; } footer div { display:flex;gap:17px; }
@media(max-width:760px) { .header { min-height:72px; }.menu-button { display:flex;align-items:center;gap:3px;border:0;background:transparent;color:var(--ink);font:10px "DM Mono";cursor:pointer; }.menu-button span { width:4px;height:4px;background:var(--ink);border-radius:50%; }.menu-button i { font-style:normal;margin-left:6px; }.nav { display:none;position:absolute;z-index:5;top:72px;left:0;right:0;background:var(--paper);padding:24px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line); }.nav.open { display:flex; }.hero { min-height:0;padding-top:38px;padding-bottom:46px; }.hero-grid { grid-template-columns:1fr;margin-top:42px;gap:32px; }.hero-copy { padding-left:0;max-width:330px; }.hero-bottom { display:block;margin-top:46px;padding-top:18px; }.hero-bottom p { margin:0; }.areas,.about,.faq { grid-template-columns:1fr;gap:48px;padding-top:74px;padding-bottom:74px; }.area-list article { grid-template-columns:34px 1fr; }.area-list p { grid-column:2; }.steps { grid-template-columns:1fr;gap:14px;margin-top:45px; }.steps p { margin:8px 0 0; }.process { padding-top:75px;padding-bottom:75px; }.portrait { height:400px; }.quote { padding-top:80px;padding-bottom:80px; }.contact { padding-top:75px;padding-bottom:70px; }.contact-actions { align-items:flex-start;flex-direction:column;gap:20px; }.contact h2 br { display:none; } footer { align-items:flex-start;flex-direction:column;padding-top:30px;padding-bottom:30px; } }