:root { --ink:#111315; --ink-soft:#272b2d; --paper:#f6f3ed; --paper-deep:#ebe7dd; --line:rgba(17,19,21,.16); --accent:#4ce0b2; --accent-dark:#0f9170; --mono:"DM Mono",monospace; --sans:"Manrope",sans-serif; --serif:"Playfair Display",serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.skip-link { position:absolute; left:-999px; }
.skip-link:focus { left:1rem; top:1rem; z-index:10; background:#fff; padding:.7rem 1rem; }
.site-shell { overflow:hidden; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:2rem; max-width:1280px; margin:0 auto; padding:1.35rem 2.5rem; border-bottom:1px solid var(--line); }
.brand { font-size:1.05rem; font-weight:800; letter-spacing:-.04em; white-space:nowrap; }
.brand-mark { color:var(--accent-dark); }
.brand-muted { color:#777b78; font-weight:500; margin-left:.1rem; }
nav { display:flex; gap:1.5rem; color:#4d514e; font-size:.8rem; font-weight:700; }
nav a:hover,.text-link:hover { color:var(--accent-dark); }
.hero { position:relative; min-height:690px; padding:8.5rem max(2.5rem, calc((100vw - 1180px)/2)); background:var(--ink); color:var(--paper); isolation:isolate; }
.hero-grid { position:absolute; inset:0; z-index:-1; opacity:.28; background:linear-gradient(90deg,rgba(255,255,255,.065) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.065) 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom,black,transparent 74%); }
.hero::after { content:""; position:absolute; inset:auto -10% -26rem auto; width:54rem; height:54rem; border-radius:50%; background:radial-gradient(circle,rgba(76,224,178,.28),transparent 64%); z-index:-1; }
.eyebrow,.kicker,.label { text-transform:uppercase; letter-spacing:.14em; font:500 .7rem var(--mono); }
.eyebrow { color:var(--accent); }
.hero h1 { max-width:920px; margin:1.1rem 0 1.7rem; font-size:clamp(3.25rem,8vw,7.4rem); line-height:.98; letter-spacing:-.075em; }
.hero h1 em { font-family:var(--serif); font-weight:600; letter-spacing:-.07em; }
.hero-copy { max-width:610px; color:#d3d8d5; font-size:1.15rem; line-height:1.65; }
.hero-actions { display:flex; align-items:center; gap:1.9rem; margin:2.35rem 0 6rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.75rem; border:1px solid transparent; padding:1rem 1.2rem; font-size:.84rem; font-weight:800; cursor:pointer; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--accent); color:#0d211a; }
.button-light { background:var(--paper); color:var(--ink); }
.text-link { font-size:.83rem; font-weight:800; color:#f1f4f1; }
.hero-proof { display:flex; gap:clamp(1.5rem,7vw,7rem); margin:0; }
.hero-proof div { display:grid; gap:.25rem; }
.hero-proof dt { color:var(--accent); font:500 clamp(1.4rem,3vw,2rem) var(--mono); }
.hero-proof dd { margin:0; color:#c4cbc7; font-size:.75rem; }
.section-padding { padding:clamp(5rem,9vw,9rem) max(2.5rem, calc((100vw - 1180px)/2)); }
.statement { border-bottom:1px solid var(--line); }
.kicker { color:var(--accent-dark); }
.statement-layout { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,8vw,10rem); align-items:end; margin-top:1.2rem; }
h2 { margin:0; font-size:clamp(2.2rem,4.7vw,4.45rem); line-height:1.03; letter-spacing:-.065em; }
.statement-layout p { margin:0; color:#4e5350; font-size:1.05rem; line-height:1.75; }
.section-intro { max-width:850px; }
.section-intro h2 { margin-top:.9rem; }
.problem-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:4rem; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.problem-grid article { min-height:265px; padding:1.55rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.problem-grid span { color:var(--accent-dark); font:500 .75rem var(--mono); }
.problem-grid h3 { margin:3.8rem 0 .7rem; font-size:1.1rem; letter-spacing:-.04em; }
.problem-grid p { color:#59605c; font-size:.86rem; line-height:1.65; }
.sprint { background:#183c34; color:#f2f4ec; }
.sprint-top { display:flex; justify-content:space-between; align-items:end; gap:2rem; }
.sprint .kicker { color:var(--accent); }
.sprint-lede { max-width:380px; margin:0; color:#c8d5cf; line-height:1.7; }
.sprint-card { display:grid; grid-template-columns:.25fr 1.1fr .8fr; gap:2.5rem; margin-top:3.7rem; padding:2.3rem 0; border-top:1px solid rgba(255,255,255,.25); border-bottom:1px solid rgba(255,255,255,.25); }
.sprint-number { color:var(--accent); font:500 1rem var(--mono); }
.label { color:var(--accent); }
.sprint-card h3 { max-width:570px; margin:.8rem 0 0; font-size:clamp(1.7rem,3vw,2.8rem); line-height:1.08; letter-spacing:-.06em; }
.sprint-card ul { margin:0; padding:0; list-style:none; color:#d5ded9; font-size:.9rem; line-height:1.75; }
.sprint-card li { padding:.35rem 0; border-bottom:1px solid rgba(255,255,255,.1); }
.sprint-card li::before { content:"↗"; color:var(--accent); margin-right:.65rem; }
.sprint-footer { display:flex; justify-content:space-between; align-items:center; gap:2rem; margin-top:2rem; }
.sprint-footer p { max-width:625px; margin:0; color:#c8d5cf; line-height:1.6; }
.narrow { max-width:760px; }
.work-layout { display:grid; grid-template-columns:.7fr 1.3fr; gap:clamp(3rem,11vw,12rem); margin-top:4rem; }
.work-note { color:#515653; font:italic 1.25rem/1.55 var(--serif); }
.steps { margin:0; padding:0; list-style:none; }
.steps li { display:grid; grid-template-columns:80px 1fr; gap:1rem; padding:0 0 1.9rem; margin-bottom:1.9rem; border-bottom:1px solid var(--line); }
.steps span { color:var(--accent-dark); font:500 .8rem var(--mono); }
.steps h3 { margin:0 0 .45rem; font-size:1.2rem; letter-spacing:-.04em; }
.steps p { margin:0; color:#5b605d; line-height:1.65; }
.credibility { background:var(--paper-deep); }
.credential-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2.5rem,9vw,10rem); margin-top:4rem; align-items:center; }
.quote-card { padding:2.2rem; background:var(--ink); color:#f5f3ed; }
.quote-card p { margin:0; font:600 clamp(1.6rem,3vw,2.7rem)/1.12 var(--serif); }
.quote-card span { display:block; margin-top:2rem; color:var(--accent); font:500 .68rem var(--mono); text-transform:uppercase; letter-spacing:.08em; }
.credential-copy { display:grid; gap:1.2rem; color:#4d5350; font-size:1.05rem; line-height:1.7; }
.credential-copy p { margin:0; }
.fit { display:grid; grid-template-columns:1fr .92fr; gap:clamp(3rem,10vw,10rem); background:#fdfcf8; }
.fit-copy h2 { margin:.9rem 0 1.4rem; }
.fit-copy > p:last-child { max-width:570px; color:#575e5a; line-height:1.75; }
.fit-form { display:grid; gap:1rem; padding:1.6rem; background:var(--paper); border:1px solid var(--line); }
.fit-form label { display:grid; gap:.5rem; font-size:.78rem; font-weight:800; }
input,textarea { width:100%; padding:.9rem; color:var(--ink); border:1px solid #c8c8c0; border-radius:0; background:#fffefa; font:400 .9rem var(--sans); }
input:focus,textarea:focus { outline:2px solid var(--accent); border-color:var(--accent); }
.form-note { margin:0; color:#797e7b; font-size:.69rem; line-height:1.5; }
.site-footer { display:flex; justify-content:space-between; gap:1.5rem; padding:1.8rem max(2.5rem, calc((100vw - 1180px)/2)); color:#d0d6d2; background:var(--ink); font-size:.8rem; }
.site-footer p { margin:0; }
.site-footer a { color:var(--accent); }
@media (max-width:850px) { .site-header { padding:1.15rem 1.25rem; } nav { display:none; } .hero { min-height:auto; padding:6rem 1.25rem 3rem; } .hero-actions,.sprint-footer { align-items:flex-start; flex-direction:column; } .hero-actions { margin-bottom:4rem; } .hero-proof { gap:1.2rem; } .section-padding { padding:4.5rem 1.25rem; } .statement-layout,.work-layout,.credential-grid,.fit { grid-template-columns:1fr; } .problem-grid { grid-template-columns:1fr 1fr; } .sprint-top,.sprint-card { display:grid; grid-template-columns:1fr; } .sprint-card { gap:1.4rem; } .sprint-card h3 { font-size:2rem; } .site-footer { padding:1.5rem 1.25rem; flex-direction:column; } }
@media (max-width:520px) { .hero h1 { font-size:3.5rem; } .hero-proof { flex-wrap:wrap; } .problem-grid { grid-template-columns:1fr; } .problem-grid article { min-height:220px; } }
