@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#17243b;--blue:#06448f;--aqua:#1ab6c8;--cream:#f5f3eb;--paper:#fff;--line:#d8dce4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.65 Manrope,Arial,sans-serif}.hero{min-height:610px;padding:90px max(7vw,32px);background:radial-gradient(circle at 80% 35%,#1ab6c8 0 3%,transparent 3.2%),radial-gradient(circle at 77% 40%,#06448f 0 18%,transparent 18.2%),linear-gradient(124deg,#092d61,#06448f);color:white}.eyebrow{margin:0 0 13px;color:var(--aqua);font-size:11px;font-weight:800;letter-spacing:2px}.hero h1{font-size:clamp(42px,7vw,84px);line-height:1.02;letter-spacing:-4px;margin:0;max-width:800px}.hero h1 em{font-style:normal;color:#7ee6ef}.lead{max-width:590px;font-size:19px;margin:28px 0 35px;color:#e6f3ff}.hero nav{display:flex;gap:11px;flex-wrap:wrap}.hero nav a{border:1px solid #87dce4;border-radius:99px;padding:9px 16px;color:white;text-decoration:none;font-weight:700;font-size:13px}main{max-width:1030px;margin:-68px auto 0;padding:0 24px}.card,.step{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:48px;display:grid;grid-template-columns:70px 1fr;gap:26px;margin-bottom:20px;box-shadow:0 10px 30px #17243b0a}.number{color:var(--aqua);font:700 25px 'DM Mono',monospace}.step h2,.card h2,.closing h2{font-size:32px;letter-spacing:-1.5px;line-height:1.12;margin:0 0 16px}.step p,.card p{margin:0 0 18px}.tint{background:#eaf8f8}.dark{background:#102c57;color:white;border-color:#102c57}.dark .number{color:#80e5ed}.dark .eyebrow{color:#80e5ed}.dark .hint{color:#d5eff1}.grid{display:grid;gap:15px;margin-top:24px}.grid.two{grid-template-columns:1fr 1fr}.grid article{border:1px solid var(--line);border-radius:12px;padding:20px;background:white}.grid h3{font-size:16px;margin:0 0 8px}ul,ol{padding-left:22px;margin:12px 0 21px}li{margin:5px 0}pre{overflow:auto;background:#122b51;color:#d9f5f6;border-radius:11px;padding:17px;font:13px/1.55 'DM Mono',monospace;white-space:pre-wrap}.prompt{background:#eef3fb;color:#1f385e;border-left:5px solid var(--aqua)}.dark .prompt{background:#173b70;color:white}.hint{font-size:13px;color:#536075}.filter-demo{display:flex;flex-wrap:wrap;gap:8px;margin:23px 0}.filter-demo button{border:0;border-radius:99px;padding:9px 15px;background:#e7ebf0;color:var(--ink);font:700 12px Manrope}.filter-demo button.active{background:var(--blue);color:white}a{color:var(--blue);font-weight:800}code{font:13px 'DM Mono',monospace;background:#eaf0f8;padding:2px 5px;border-radius:4px}.dark code{background:#274a7b}.step aside{border-left:5px solid var(--aqua);background:#e9f8f8;padding:18px 20px;margin-top:22px}.checklist{display:grid;grid-template-columns:1fr 1fr;gap:9px}.checklist label{background:white;border:1px solid #cfd9df;border-radius:8px;padding:11px;font-size:14px}.closing{text-align:center;padding:85px 15px 105px}.closing h2{font-size:clamp(33px,5vw,58px)}.closing p:last-child{max-width:640px;margin:0 auto;color:#5b6471}footer{background:#102c57;color:#d4e1ef;text-align:center;padding:24px;font-size:13px}@media(max-width:650px){.hero{min-height:500px;padding-top:65px}.hero h1{letter-spacing:-2.5px}.card,.step{padding:28px 22px;grid-template-columns:1fr;gap:10px}.grid.two,.checklist{grid-template-columns:1fr}.number{font-size:17px}main{padding:0 14px}.step h2,.card h2{font-size:27px}}
