:root {
  --ink: #172033;
  --muted: #5f6b7a;
  --brand: #195bdb;
  --surface: #ffffff;
  --background: #f5f7fb;
  --border: #dfe5ef;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--background);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.7;
}

header {
  background: linear-gradient(135deg, #123b8e, var(--brand));
  color: #fff;
  padding: 56px 20px 48px;
}

header div, main { max-width: 820px; margin: 0 auto; }
h1 { margin: 0 0 8px; font-size: clamp(2rem, 6vw, 3rem); line-height: 1.15; }
header p { margin: 0; color: #dce8ff; }

main {
  margin-top: 32px;
  margin-bottom: 48px;
  padding: 40px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(23, 32, 51, 0.07);
}

h2 { margin: 34px 0 8px; font-size: 1.35rem; line-height: 1.3; }
h2:first-of-type { margin-top: 0; }
p, ul { margin-top: 8px; }
ul { padding-left: 24px; }
a { color: var(--brand); }
.updated { color: var(--muted); font-size: 0.95rem; }
.home-link { display: inline-block; margin-top: 24px; font-weight: 600; }

@media (max-width: 700px) {
  header { padding: 40px 20px 34px; }
  main { margin: 20px 12px 32px; padding: 26px 20px; border-radius: 12px; }
}