:root { --ink:#17231f; --paper:#f4f1e9; --accent:#5f7d00; --mist:#d4ed61; --line:rgba(23,35,31,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",sans-serif; font-size:16px; }
a { color:inherit; text-decoration:none; }
.site-header { display:flex; justify-content:space-between; align-items:center; padding:23px 3.25vw; border-bottom:1px solid var(--line); position:relative; z-index:2; }
.wordmark { display:flex; align-items:center; width:118px; } .wordmark img { display:block; width:100%; height:auto; }
nav { display:flex; gap:28px; font-family:"DM Mono",monospace; font-size:11px; text-transform:uppercase; letter-spacing:.03em; }
nav a:hover, footer a:hover { opacity:.55; }.menu-toggle { display:none; }
.hero { min-height:calc(100vh - 77px); padding:4.6vw 3.25vw 3vw; display:flex; flex-direction:column; justify-content:space-between; border-bottom:1px solid var(--line); }
.eyebrow,.section-label { font-family:"DM Mono",monospace; font-size:10px; line-height:1.4; text-transform:uppercase; letter-spacing:.04em; }
.hero h1 { margin:7.8vw 0 auto; font-family:"Playfair Display",serif; font-size:clamp(55px,9vw,145px); letter-spacing:-.065em; font-weight:500; line-height:.96; }.hero em { color:var(--ink); } h2 em { color:var(--accent); }
.hero-bottom { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; }.hero-bottom p { max-width:310px; font-size:17px; line-height:1.35; letter-spacing:-.025em; }
.round-link { width:58px; height:58px; border:1px solid var(--ink); border-radius:50%; display:grid; place-items:center; background:var(--ink); color:var(--paper); font-size:27px; transition:.2s; }.round-link:hover { background:#34423e; border-color:#34423e; transform:translateY(4px); }
.statement { display:grid; grid-template-columns:25% 1fr; gap:20px; padding:11vw 14.5vw 12vw 3.25vw; border-bottom:1px solid var(--line); }.statement-copy { max-width:750px; }.statement h2,.clients h2,.contact h2 { margin:0; font-family:"Playfair Display",serif; font-weight:500; letter-spacing:-.055em; font-size:clamp(40px,5vw,76px); line-height:.98; }.statement p:not(.section-label) { max-width:545px; margin:38px 0 0; font-size:20px; letter-spacing:-.025em; line-height:1.4; }.statement p + p { margin-top:15px; }
.services { background:var(--ink); color:var(--paper); padding:5vw 3.25vw 5.8vw; }.service-list { margin:7vw 0 0 25%; }.service-list div { display:grid; grid-template-columns:15% 1fr; border-top:1px solid rgba(244,241,233,.3); padding:20px 0 25px; }.service-list div:last-child { border-bottom:1px solid rgba(244,241,233,.3); }.service-list span { font-family:"DM Mono",monospace; font-size:10px; }.service-list h3 { font-family:"Playfair Display",serif; font-weight:500; font-size:clamp(31px,4vw,61px); line-height:.95; letter-spacing:-.05em; margin:0; }
.clients { padding:10vw 3.25vw 8vw; }.clients-heading { display:grid; grid-template-columns:25% 1fr; }.clients h2 { max-width:610px; font-size:clamp(39px,4.3vw,67px); }.client-grid { display:grid; grid-template-columns:repeat(4,1fr); column-gap:10px; border-top:1px solid var(--ink); margin-top:7vw; }.client-grid a { padding:23px 12px 25px 0; border-bottom:1px solid var(--line); font-family:"DM Mono",monospace; font-size:13px; line-height:1.35; transition:padding-left .2s, background-color .2s, color .2s; }.client-grid a:hover { padding-left:9px; background:var(--ink); color:var(--paper); }.client-grid small { display:block; margin-bottom:12px; font-size:9px; color:rgba(23,35,31,.58); text-transform:uppercase; letter-spacing:.04em; }.client-grid a:hover small { color:rgba(244,241,233,.62); }.client-grid sup { margin-left:3px; font-size:9px; }.note { margin:22px 0 0; max-width:370px; font-size:11px; color:rgba(23,35,31,.65); line-height:1.45; }
.contact { background:var(--ink); color:var(--paper); padding:8vw 3.25vw 9vw; display:grid; grid-template-columns:25% 1fr; }.contact h2 em { color:var(--paper); }.email-link { display:inline-flex; margin-top:5vw; padding-bottom:7px; border-bottom:1px solid var(--paper); font-size:clamp(20px,2.4vw,36px); letter-spacing:-.04em; }.email-link .email-arrow { margin-left:15px; font-family:"DM Mono",monospace; font-size:.78em; line-height:1.1; }.email-link:hover { opacity:.68; }
footer { padding:18px 3.25vw; display:flex; gap:26px; font-family:"DM Mono",monospace; text-transform:uppercase; font-size:10px; } footer p { margin:0 auto 0 0; }
@media (max-width:700px) { .site-header { padding:18px 20px; }.wordmark { width:100px; }.menu-toggle { display:block; appearance:none; background:none; border:0; padding:0; color:var(--ink); font:10px "DM Mono",monospace; text-transform:uppercase; } nav { display:none; position:absolute; top:63px; left:0; right:0; padding:22px 20px; background:var(--paper); border-bottom:1px solid var(--line); } nav.open { display:flex; flex-direction:column; gap:18px; }.hero { min-height:0; display:block; padding:82px 20px 30px; }.hero h1 { margin:74px 0 94px; font-size:16vw; line-height:.98; }.hero-bottom { gap:20px; }.hero-bottom p { margin:0; font-size:16px; }.round-link { flex:0 0 52px; width:52px; height:52px; }.statement,.contact { display:block; padding:74px 20px; }.statement-copy { margin-top:52px; }.statement p:not(.section-label) { font-size:18px; }.services { padding:55px 20px 70px; }.service-list { margin:55px 0 0; }.service-list div { grid-template-columns:52px 1fr; padding:18px 0 23px; }.clients { padding:74px 20px; }.clients-heading { display:block; }.clients h2 { margin-top:52px; }.client-grid { grid-template-columns:1fr; column-gap:0; margin-top:58px; }.client-grid a { min-height:88px; padding:18px 6px; }.contact h2 { margin-top:52px; font-size:14.5vw; }.email-link { margin-top:48px; } footer { display:grid; grid-template-columns:1fr 1fr; padding:18px 20px; gap:16px; } footer p { grid-column:1 / -1; width:auto; }
}