:root{--ink:#10233f;--muted:#5d6b7e;--blue:#3267e3;--pale:#eef4ff;--line:#dbe3ef;--white:#fff}*{box-sizing:border-box}body{margin:0;background:#f8fafc;color:var(--ink);font:16px/1.65 Arial,sans-serif}.site-header,main,footer{max-width:1120px;margin:auto}.site-header{min-height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{font-weight:800;font-size:22px;color:var(--ink);text-decoration:none}.brand:before{content:"◈";color:var(--blue);margin-right:9px}nav{display:flex;gap:24px}nav a,footer a{color:var(--muted);text-decoration:none}nav a:hover,nav a.active,footer a:hover{color:var(--blue)}main{padding:32px 24px 72px}.hero,.page-head{padding:72px 7%;background:linear-gradient(135deg,#fff 45%,var(--pale));border:1px solid var(--line);border-radius:28px}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.18em}h1{max-width:820px;margin:.2em 0;font-size:clamp(40px,7vw,74px);line-height:1.03;letter-spacing:-.04em}h2{line-height:1.2}p{color:var(--muted)}.actions{display:flex;gap:24px;align-items:center;margin-top:32px}.button,button{display:inline-block;border:0;border-radius:10px;padding:13px 20px;background:var(--blue);color:#fff;text-decoration:none;font-weight:700;cursor:pointer}.text-link{color:var(--ink);font-weight:700;text-decoration:none}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.grid article,.content,.demo{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px}.grid span{color:var(--blue);font-weight:800}.demo{display:flex;justify-content:space-between;align-items:center;margin-top:24px}.content{margin-top:24px}.content.split{display:grid;grid-template-columns:1fr 1fr;gap:30px}.content li{margin:10px 0;color:var(--muted)}footer{padding:24px;border-top:1px solid var(--line)}@media(max-width:720px){.site-header{align-items:flex-start;padding-top:20px}nav{gap:12px;flex-wrap:wrap;justify-content:flex-end}.grid,.content.split{grid-template-columns:1fr}.demo,.actions{align-items:flex-start;flex-direction:column}.hero,.page-head{padding:44px 24px}h1{font-size:42px}}
