:root { --accent: #F7931A; --ink: #10141a; --muted: #5b6572; --bg: #ffffff; --soft: #f5f7fa; }
* { box-sizing: border-box; }
body { margin:0; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink); background: var(--bg); line-height: 1.6; }
header { border-bottom: 1px solid #e6eaf0; }
.wrap { max-width: 880px; margin: 0 auto; padding: 0 22px; }
nav { display:flex; gap:20px; align-items:center; padding: 16px 0; flex-wrap: wrap; }
nav a { color: var(--muted); text-decoration:none; font-size:14px; }
nav a:hover { color: var(--accent); }
.brand { font-weight:800; font-size:19px; color: var(--ink); margin-right:auto; }
.dot { display:inline-block; width:11px; height:11px; border-radius:50%; background: var(--accent); margin-right:8px; }
h1 { font-size: 38px; line-height:1.15; margin: 34px 0 10px; letter-spacing:-.6px; }
h2 { font-size: 22px; margin: 32px 0 8px; }
.lede { font-size: 19px; color: var(--muted); margin-bottom: 26px; }
.hero { background: var(--soft); border-left: 5px solid var(--accent); padding: 20px 22px; border-radius: 10px; margin: 24px 0; }
ul { padding-left: 20px; } li { margin: 7px 0; }
footer { margin-top: 54px; border-top:1px solid #e6eaf0; padding: 22px 0 44px; color: var(--muted); font-size: 14px; }
.cta { display:inline-block; background: var(--accent); color:#fff; text-decoration:none;
  padding: 12px 20px; border-radius: 8px; font-weight:700; margin-top: 10px; }