:root { --text:#2b2f3a; --muted:#6b7286; --accent:#3d8bff; --bg:#f4f6fb; }
* { box-sizing: border-box; }
body { margin:0; font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--text); background:var(--bg); line-height:1.6; }
a { color: var(--accent); }
.hero { background: linear-gradient(180deg,#6ea4ff,#3550c9); color:#fff; text-align:center; padding:56px 16px 48px; }
.hero.small { padding:18px 16px; text-align:left; }
.hero .brand { color:#fff; font-weight:700; text-decoration:none; font-size:20px; }
.hero h1 { margin:16px 0 6px; font-size:clamp(28px,6vw,44px); }
.logo { border-radius:30px; box-shadow:0 12px 30px rgba(0,0,0,.25); }
.tag { opacity:.9; margin:0 0 22px; }
.btn { display:inline-block; background:#2ebf6a; color:#fff; text-decoration:none; font-weight:700; padding:14px 26px; border-radius:999px; box-shadow:0 6px 0 #1f9a52; }
.doc { max-width:820px; margin:0 auto; padding:28px 16px 48px; background:#fff; }
.doc h1 { font-size:30px; margin-top:0; }
.doc h2 { font-size:20px; margin-top:28px; }
.muted { color:var(--muted); }
.foot { text-align:center; color:var(--muted); padding:24px 16px; font-size:14px; }