/* Your colors: change these three and the whole page follows. */
:root{--brand:#2b59c3;--ink:#16181d;--paper:#fbfaf7}
*{box-sizing:border-box}
body{margin:0;font:17px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}
.hero{max-width:760px;margin:0 auto;padding:72px 22px 48px}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--brand);margin:0 0 10px}
h1{font-size:clamp(30px,5vw,48px);line-height:1.1;margin:0 0 14px}
.lead{font-size:19px;color:#4b505a;margin:0 0 26px}
.button{display:inline-block;background:var(--brand);color:#fff;text-decoration:none;font-weight:700;padding:13px 22px;border-radius:10px}
.button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
main{max-width:760px;margin:0 auto;padding:0 22px 40px}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;margin:18px 0 40px}
.three h2{font-size:15px;margin:0 0 4px;color:var(--brand)}
.three p{margin:0;color:#4b505a}
.contact{border-top:1px solid #e3e1db;padding-top:26px}
footer{max-width:760px;margin:0 auto;padding:18px 22px 40px;color:#8a8f99;font-size:13px}