:root {
  color-scheme: light;
  --ink: #1a1033;
  --muted: #6e6489;
  --violet: #7c3aed;
  --deep: #2e1065;
  --line: #e9d8fd;
  --wash: #fbf9ff;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--wash);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
}

header {
  background: linear-gradient(135deg, var(--deep), var(--violet), #d946ef);
  color: white;
  padding: 56px 22px 48px;
}

header div, main, footer { max-width: 760px; margin: 0 auto; }
h1 { margin: 0 0 8px; font-size: clamp(2rem, 8vw, 3.25rem); line-height: 1.08; }
header p { margin: 0; color: #eadcff; }
main { padding: 34px 22px 56px; }
h2 { margin: 34px 0 8px; font-size: 1.25rem; }
p, li { color: var(--muted); }
a { color: var(--violet); font-weight: 650; }
.card {
  background: white;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 22px;
  margin: 18px 0;
}
.links { display: flex; flex-wrap: wrap; gap: 16px; }
footer { padding: 0 22px 40px; color: var(--muted); font-size: .9rem; }