@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#18211f; --muted:#65706b; --paper:#f3f1eb; --card:#e5e9e1; --lime:#d8f36a; --line:rgba(24,33,31,.16); --max:1200px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope, sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; display:flex; justify-content:space-between; margin:auto; max-width:var(--max); padding:28px 28px; position:sticky; top:0; transition:.25s; z-index:5; }
.site-header.is-scrolled { background:rgba(243,241,235,.92); box-shadow:0 1px 0 var(--line); max-width:none; padding-left:max(28px, calc((100% - 1144px) / 2)); padding-right:max(28px, calc((100% - 1144px) / 2)); backdrop-filter:blur(12px); }
.brand { font-size:1.15rem; font-weight:800; letter-spacing:-.08em; }.brand span,.text-link span,.button span,.contact-link span { color:#8b9d34; }
nav { display:flex; gap:30px; font-size:.76rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; } nav a:hover,.text-link:hover { color:#83952d; }
.button { align-items:center; background:var(--ink); border:1px solid var(--ink); color:var(--paper); display:inline-flex; font-size:.76rem; font-weight:700; gap:18px; letter-spacing:.04em; padding:16px 20px; text-transform:uppercase; transition:.2s; }.button:hover { background:#fff; color:var(--ink); transform:translateY(-2px); }.button-small { padding:10px 14px; font-size:.64rem; }
.page-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:28px; max-width:var(--max); margin:auto; padding-left:28px; padding-right:28px; }.hero { min-height:650px; padding-top:110px; }.hero-copy { grid-column:1 / span 7; }.eyebrow { color:var(--muted); font:500 .67rem/1.2 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }.status-dot { background:#a8cd48; border-radius:50%; display:inline-block; height:7px; margin-right:8px; width:7px; }
h1,h2,h3,p { margin-top:0; } h1,h2 { font-size:clamp(3.2rem,7vw,6.2rem); letter-spacing:-.09em; line-height:.98; margin:32px 0; max-width:800px; } em { color:#93a43b; font-style:normal; }.hero-lede { color:var(--muted); font-size:1.05rem; max-width:470px; }.hero-actions { align-items:center; display:flex; gap:28px; margin-top:38px; }.text-link { border-bottom:1px solid var(--line); font-size:.75rem; font-weight:700; padding-bottom:5px; text-transform:uppercase; }
.hero-aside { align-self:end; background:var(--ink); color:var(--paper); grid-column:9 / span 4; min-height:360px; overflow:hidden; padding:32px; position:relative; }.orb { border:1px solid rgba(216,243,106,.38); border-radius:50%; position:absolute; }.orb-large { height:360px; right:-130px; top:-120px; width:360px; }.orb-small { background:var(--lime); border:0; height:70px; right:50px; top:70px; width:70px; }.aside-label { color:var(--lime); font:500 .65rem 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }.aside-value { font-size:1.4rem; font-weight:700; letter-spacing:-.04em; line-height:1.2; margin-top:150px; position:relative; }.aside-line { border-top:1px solid rgba(243,241,235,.25); margin:22px 0 14px; }.aside-meta { color:#a9b2ac; font-size:.7rem; position:relative; }
.section { border-top:1px solid var(--line); padding-bottom:140px; padding-top:110px; }.section-intro { grid-column:1 / span 4; }.section-intro h2 { font-size:clamp(2.3rem,4vw,4.2rem); margin-top:55px; }.interest-list { grid-column:6 / span 7; }.interest-card { align-items:flex-start; border-top:1px solid var(--line); display:grid; gap:22px; grid-template-columns:42px 1fr 30px; padding:26px 0; }.interest-card:last-child { border-bottom:1px solid var(--line); }.card-number,.project-type { color:var(--muted); font:500 .66rem 'DM Mono',monospace; }.interest-card h3 { font-size:1.35rem; letter-spacing:-.04em; margin-bottom:8px; }.interest-card p,.project p { color:var(--muted); font-size:.9rem; margin-bottom:0; max-width:480px; }.card-arrow { font-size:1.1rem; }.work-section { background:#e8e9e1; max-width:none; padding-left:max(28px, calc((100% - 1144px) / 2)); padding-right:max(28px, calc((100% - 1144px) / 2)); }.work-grid { display:grid; gap:18px; grid-column:6 / span 7; grid-template-columns:repeat(2,1fr); }.project { background:var(--paper); display:flex; flex-direction:column; min-height:260px; padding:25px; }.project-featured { background:var(--ink); color:var(--paper); grid-column:span 2; min-height:330px; }.project-featured p:not(.project-type) { color:#a9b2ac; }.project h3 { font-size:1.5rem; letter-spacing:-.06em; margin:36px 0 12px; }.project .text-link { margin-top:auto; width:max-content; }.contact-section { background:var(--lime); padding:130px 28px 150px; text-align:center; }.contact-section h2 { font-size:clamp(3rem,7vw,6rem); margin:45px auto; }.contact-link { border-bottom:1px solid var(--ink); font-size:1rem; font-weight:700; padding-bottom:10px; } footer { display:flex; font:500 .65rem 'DM Mono',monospace; justify-content:space-between; padding:24px 28px; text-transform:uppercase; }
@media (max-width:760px) { nav { display:none; }.site-header { padding:22px 20px; }.button-small { display:none; }.page-grid { display:block; padding-left:20px; padding-right:20px; }.hero { min-height:auto; padding-bottom:90px; padding-top:80px; }.hero-aside { margin-top:75px; }.hero-copy h1 { font-size:3.4rem; }.hero-actions { align-items:flex-start; flex-direction:column; }.section { padding-bottom:90px; padding-top:80px; }.section-intro { margin-bottom:55px; }.section-intro h2 { margin-top:35px; }.interest-card { grid-template-columns:34px 1fr 18px; }.work-section { padding-left:20px; padding-right:20px; }.work-grid { display:block; }.project { margin-bottom:18px; }.project-featured { min-height:300px; }.contact-section { padding:95px 20px 110px; } footer { flex-wrap:wrap; gap:12px; line-height:1.6; } }
