* { box-sizing: border-box; }
body {
  margin: 0;
  background: #f4f6fa;
  color: #16223a;
  font-family: 'Hanken Grotesk', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 760px; margin: 0 auto; padding: 56px 24px 96px; }
.top-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #5a6883;
  text-decoration: none;
  margin-bottom: 32px;
}
.top-link:hover { color: #3B74F2; }
h1 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 32px;
  color: #0E2A4A;
  margin: 0 0 8px;
}
.updated { font-size: 13px; color: #8893a4; margin-bottom: 40px; }
h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  font-size: 19px;
  color: #0E2A4A;
  margin: 40px 0 12px;
}
p, li { font-size: 15px; line-height: 1.7; color: #3a475e; }
ul { padding-left: 22px; margin: 10px 0; }
li { margin-bottom: 6px; }
a { color: #3B74F2; }
.callout {
  background: #eaf1fb;
  border: 1px solid #c8d4e8;
  border-radius: 12px;
  padding: 16px 20px;
  font-size: 14px;
  color: #1e3a5f;
  margin: 32px 0;
}
strong { color: #16223a; }
.placeholder { background: #fef3c7; padding: 1px 5px; border-radius: 4px; }

@media (max-width: 600px) {
  .wrap { padding: 32px 18px 72px; }
  h1 { font-size: 26px; }
  h2 { font-size: 17px; margin: 32px 0 10px; }
}