@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap");

:root{font-family:"DM Sans",system-ui,sans-serif;color:#0f1b3a;background:#f8fbff;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}
a{color:inherit;text-decoration:none}
.wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.site-header{border-bottom:1px solid #e4edf5;background:rgba(248,251,255,.9);position:sticky;top:0;z-index:10;backdrop-filter:blur(18px)}
.header-inner{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center}.brand img{height:auto;display:block}
nav{display:flex;align-items:center;gap:32px;font-size:13px;font-weight:600}nav a:hover,.site-footer a:hover{color:#1e82c6}.nav-github{border:1px solid #dbe7f1;border-radius:9px;padding:10px 15px;background:#fff}
.hero{min-height:680px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;padding-block:100px 110px}
.eyebrow,.section-label,.preview-top,.preview-bottom,.step-number,.hero-note{font-family:"DM Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.08em}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#287cbb;border:1px solid #d3e9fa;border-radius:100px;background:#eff8ff;padding:11px 15px;margin:0 0 30px}
.pulse{width:7px;height:7px;border-radius:50%;background:#2e9be0;display:inline-block;box-shadow:0 0 0 4px #d6eeff}
h1,h2,h3,p{margin-top:0}h1{font-size:clamp(48px,5.6vw,78px);line-height:1.04;letter-spacing:-.065em;font-weight:600;margin-bottom:26px}em{font-family:"Instrument Serif",Georgia,serif;color:#2e9be0;font-weight:400}
.lead{color:#5e6a80;font-size:18px;line-height:1.7;max-width:555px;margin-bottom:34px}
.actions{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:14px 20px;border-radius:10px;font-weight:700;font-size:14px;transition:transform .15s,box-shadow .15s}.button:hover{transform:translateY(-2px)}.primary{background:#2e9be0;color:#fff;box-shadow:0 9px 20px #2e9be032}.secondary{background:#fff;border:1px solid #dbe7f1}
.hero-note{display:flex;gap:13px;align-items:center;margin-top:28px;color:#6d7d92;letter-spacing:0}.hero-note b{color:#a9c8df}
.preview{border:1px solid #d6e4f0;border-radius:17px;overflow:hidden;background:#0c1428;box-shadow:0 32px 70px #0f1b3a20;transform:rotate(1deg)}.preview-top,.preview-bottom{display:flex;align-items:center;justify-content:space-between;color:#8ba3bb;padding:17px 22px;background:#101c34}.preview-top{border-bottom:1px solid #26344e}.preview-top .dots{display:flex;gap:6px}.dots i{width:7px;height:7px;border-radius:50%;background:#50617a}.dots i:first-child{background:#f58e8e}.dots i:nth-child(2){background:#f6c76e}.dots i:last-child{background:#78cfa8}.preview-tag{color:#80d9f4;border:1px solid #335168;padding:4px 8px;border-radius:5px}.preview-body{padding:25px 29px 32px}.preview-comment{font:12px "DM Mono",monospace;color:#6583a2;margin-bottom:20px}.preview pre{margin:0;overflow:auto;color:#d8e6f6;font:12px/2 "DM Mono",monospace}.preview .key{color:#8cd6ff}.preview .string{color:#9de2b3}.preview-bottom{border-top:1px solid #26344e;font-size:10px}.preview-bottom .pulse{width:5px;height:5px;box-shadow:none;margin-right:8px}
.section{padding:105px 0}.section:not(.integrations){background:#fff;border-block:1px solid #e9f0f7}.section-label{color:#3189c7;margin-bottom:30px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:40px}.section-heading h2{font-size:clamp(42px,4.5vw,64px);font-weight:600;line-height:1.08;letter-spacing:-.055em;margin:0}.section-heading p{max-width:360px;color:#6a7689;line-height:1.7;margin:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.steps article{border:1px solid #e1ebf4;border-radius:15px;background:#fbfdff;padding:32px;min-height:232px}.step-number{display:flex;justify-content:space-between;color:#2e9be0;margin-bottom:52px}.step-number span{font-size:18px}.steps h3{font-size:24px;letter-spacing:-.03em;margin-bottom:9px}.steps p{color:#68798e;line-height:1.65;font-size:14px;margin:0}
.integrations{background:#f3f9fe}.integration-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.integration-grid a{display:flex;align-items:center;gap:20px;border:1px solid #dcebf6;border-radius:15px;background:#fff;padding:27px;transition:transform .15s,border-color .15s}.integration-grid a:hover{transform:translateY(-3px);border-color:#9acff1}.integration-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:12px;color:#2188ca;background:#eaf6ff;font:22px "DM Mono",monospace}.integration-grid strong,.integration-grid small{display:block}.integration-grid strong{font-size:17px;margin-bottom:5px}.integration-grid small{font-size:13px;color:#718095}.arrow{margin-left:auto;color:#2e9be0;font-size:22px}
.site-footer{background:#0f1b3a;color:#d7e6f3;padding:34px 0}.footer-inner{display:flex;align-items:center;gap:22px}.footer-inner img{filter:brightness(0) invert(1)}.footer-inner p{font-size:13px;color:#9db1c9;margin:0}.footer-inner a:last-child{margin-left:auto;font-size:13px}
@media(max-width:850px){.hero{grid-template-columns:1fr;gap:50px;min-height:0;padding-block:80px}.preview{max-width:600px;transform:none}.section-heading{display:block}.section-heading p{margin-top:20px}.steps{grid-template-columns:1fr}.steps article{min-height:0}.step-number{margin-bottom:32px}}
@media(max-width:600px){.wrap{width:min(100% - 32px,1180px)}.header-inner{height:66px}.header-inner .brand img{width:115px}nav{gap:13px;font-size:11px}nav a:first-child,nav a:nth-child(2){display:none}.nav-github{padding:9px 12px}.hero{padding-block:65px}.lead{font-size:16px}.preview-body{padding:20px}.preview pre{font-size:10px}.section{padding:75px 0}.integration-grid{grid-template-columns:1fr}.footer-inner{flex-wrap:wrap}.footer-inner p{width:100%;order:3}.footer-inner a:last-child{margin-left:auto}}