:root{--blue:#2a4bff;--mist:#f2f3f5;--line:#dcdee3;--mute:#4a505a}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font:17px/1.65 'Instrument Sans',system-ui,sans-serif;color:#000;background:#fff}
h1,h2,h3{font-family:'Bricolage Grotesque','Instrument Sans',system-ui,sans-serif;line-height:1.1;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,6vw,4.4rem);font-weight:800}
h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;margin-bottom:.6em}
h3{font-size:1.4rem;font-weight:700;margin-bottom:.4em}
a{color:inherit}
.w{max-width:1080px;margin:auto;padding:0 22px}
header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:9}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 1.1rem 'Bricolage Grotesque',sans-serif;letter-spacing:.04em}
.logo b{background:#000;color:#fff;width:40px;height:40px;display:grid;place-items:center;font-size:1.5rem;font-weight:400}
nav a{margin-left:26px;text-decoration:none;font-weight:600;font-size:.95rem}
nav a[aria-current],nav a:hover{color:var(--blue)}
.menu{display:none;background:none;border:1.5px solid #000;padding:8px 12px;font:inherit;font-weight:600;cursor:pointer}
.btn{display:inline-block;background:var(--blue);color:#fff;padding:14px 26px;font:600 1rem 'Instrument Sans',sans-serif;text-decoration:none;border-radius:4px;border:0;cursor:pointer}
.btn.o{background:none;border:1.5px solid #fff}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.hero{background:#000;color:#fff;position:relative;overflow:hidden;padding:110px 0 100px}
.hero svg{position:absolute;right:-8%;top:50%;width:min(760px,85vw);transform:translateY(-50%)}
.hero path{fill:none;stroke:var(--blue);stroke-width:1.2;stroke-dasharray:300;stroke-dashoffset:300;animation:d 3.5s ease forwards}
@keyframes d{to{stroke-dashoffset:0}}
.hero .w{position:relative}
.hero h1{max-width:11em}
.hero p{max-width:34em;margin:24px 0 34px;font-size:1.2rem;color:#d4d7dd}
.hero .btn+.btn{margin-left:12px}
.page{background:#000;color:#fff;padding:70px 0 60px}
.page p{color:#d4d7dd;max-width:36em;margin-top:16px;font-size:1.15rem}
section{padding:80px 0}
.alt{background:var(--mist)}
.row{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding:30px 0;border-top:2px solid #000}
.row p,.mute{color:var(--mute)}
.row a{display:inline-block;margin-top:10px;font-weight:600;color:var(--blue)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;list-style:none;padding:0;counter-reset:s}
.steps li{counter-increment:s;border-top:2px solid #000;padding-top:14px}
.steps li:before{content:counter(s);font:800 2rem 'Bricolage Grotesque',sans-serif;color:var(--blue);display:block}
.steps b{display:block;font-size:1.15rem}
.tick{list-style:none;padding:0}
.tick li{padding:9px 0 9px 28px;border-bottom:1px solid var(--line);position:relative}
.tick li:before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:700}
.svc{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:64px 0;border-top:2px solid #000}
.cta{background:var(--blue);color:#fff;text-align:center}
.cta p{max-width:30em;margin:0 auto 28px;font-size:1.15rem}
.cta .btn{background:#fff;color:#000}
article{max-width:700px;padding:56px 0;border-top:2px solid #000}
article p{margin-bottom:1em}
article small{color:var(--mute)}
.contact{display:grid;grid-template-columns:3fr 2fr;gap:50px}
label{display:block;font-weight:600;margin:0 0 18px}
input,select,textarea{display:block;width:100%;margin-top:6px;padding:12px;border:1.5px solid #000;border-radius:4px;font:inherit;background:#fff}
textarea{min-height:140px}
footer{background:#000;color:#d4d7dd;padding:48px 0;font-size:.95rem}
footer .w{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer a{margin-right:18px}
@media(max-width:760px){.row,.svc,.contact{grid-template-columns:1fr;gap:18px}
.menu{display:block}
nav{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;padding:8px 22px 18px;border-bottom:1px solid var(--line)}
nav.open{display:block}nav a{display:block;margin:0;padding:12px 0}
.hero{padding:80px 0}.hero .btn+.btn{margin:12px 0 0}section{padding:56px 0}}
@media(prefers-reduced-motion:reduce){.hero path{animation:none;stroke-dashoffset:0}html{scroll-behavior:auto}}
