:root{--bg:#7b949b;--ink:#1f2a4e;--cream:#fff4d9;--btn:#5b7388}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.125rem/1.6 Raleway,system-ui,sans-serif}
h1,h2,.brand,.f-name{font-family:"Space Grotesk",system-ui,sans-serif}
a{color:inherit}
:focus-visible{outline:3px solid var(--cream);outline-offset:3px;box-shadow:0 0 0 5px var(--ink)}
.pad{padding-left:clamp(20px,4.5vw,60px);padding-right:clamp(20px,4.5vw,60px)}
header.site{display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
.brand{font-size:1.7rem;font-weight:500;text-decoration:none;letter-spacing:-.01em}
nav a{margin-left:26px;text-decoration:none}
nav a[aria-current]{text-decoration:underline;text-underline-offset:6px}
.btn{display:inline-block;font:700 .95rem "Space Mono",monospace;text-transform:uppercase;background:var(--cream);color:var(--ink);padding:22px 46px;border-radius:999px;text-decoration:none;border:0;cursor:pointer}
.btn.send{background:var(--btn);color:var(--cream);padding:16px 30px}
.btn:disabled{opacity:.6}
.hero{min-height:100vh;display:flex;flex-direction:column;color:var(--cream);background:linear-gradient(rgba(25,22,30,.52),rgba(25,22,30,.52)),url(images/hero.jpg) center/cover}
.hero main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px 90px}
.hero h1{font-size:clamp(3.2rem,10vw,6.5rem);line-height:1;margin:0 0 18px;text-transform:uppercase;font-weight:500;letter-spacing:-.03em}
.hero p{margin:0 0 40px;font-size:1.2rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;padding-top:30px;padding-bottom:30px}
h1.page{font-size:clamp(2.6rem,6vw,4.4rem);line-height:1.1;margin:0 0 36px;font-weight:700}
.split p{max-width:32em;margin:0 0 16px}
.split img{width:100%;max-width:560px;aspect-ratio:3/4;object-fit:cover;justify-self:end}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;max-width:510px}
.fields .full{grid-column:1/-1}
label{display:block;margin:14px 0 4px}
label small,.opt{font-size:.9rem;opacity:.75}
input,textarea{width:100%;font:inherit;color:var(--ink);background:transparent;border:1px solid var(--ink);border-radius:999px;padding:12px 18px}
textarea{border-radius:24px;min-height:130px;resize:vertical}
#status{margin-top:14px;font-weight:600}
.hp{position:absolute;left:-9999px}
.meet{display:grid;grid-template-columns:1fr auto 1.2fr;gap:50px;align-items:center;padding-top:50px;padding-bottom:50px}
.meet h1{font-size:clamp(3rem,6vw,4.6rem);line-height:1.05;font-weight:500;margin:0 0 0 clamp(0px,5vw,100px)}
.meet img{width:237px;max-width:100%}
.meet p{margin:0 0 14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cards img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.cards .bot{object-position:center bottom;background:#939393}
.cards h2{font-size:2.2rem;font-weight:500;margin:44px 0 24px}
.cards p{margin:0}
footer.site{display:grid;grid-template-columns:1fr auto;gap:10px 40px;padding-top:90px;padding-bottom:110px}
.f-name{font-size:clamp(2rem,4vw,3.1rem);line-height:1.1;font-weight:500;letter-spacing:-.02em}
.f-right{grid-row:span 2;text-align:right}
.f-right a.big{display:block;font:500 clamp(1.6rem,4vw,3.1rem)/1.15 "Space Grotesk",sans-serif;letter-spacing:-.02em;text-decoration:none;margin-bottom:10px}
.social{display:flex;gap:16px;justify-content:flex-end;margin-top:6px}
.social svg{width:24px;height:24px;fill:currentColor}
@media(max-width:800px){.split,.meet,.cards{grid-template-columns:1fr}.split img{justify-self:start}.meet h1{margin:0}footer.site{grid-template-columns:1fr}.f-right{text-align:left;grid-row:auto}.social{justify-content:flex-start}nav a{margin:0 18px 0 0}}