:root {
  color-scheme: light;
  --porcelain: #fbf6f3;
  --card: #ffffff;
  --blush: #f6e7e2;
  --line: #ebddd8;
  --ink: #2b1d26;
  --muted: #8a7680;
  --rose: #b9506f;
  --max: 760px;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: radial-gradient(circle at 15% 0%, rgba(232, 180, 160, 0.35), transparent 42%),
              radial-gradient(circle at 95% 8%, rgba(185, 80, 111, 0.12), transparent 36%), var(--porcelain);
  color: var(--ink);
  line-height: 1.6;
}
a { color: var(--rose); }
.page { width: min(calc(100% - 32px), var(--max)); margin: 0 auto; padding: 28px 0 64px; }
header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 36px; flex-wrap: wrap; }
.brand { font-family: Georgia, "Times New Roman", serif; font-size: 24px; color: var(--ink); text-decoration: none; }
nav a { color: var(--muted); text-decoration: none; margin-left: 16px; font-size: 15px; }
nav a:hover { color: var(--ink); }
h1 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: clamp(34px, 7vw, 54px); line-height: 1.08; margin: 0 0 16px; }
h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: 24px; margin: 34px 0 8px; }
p, li { color: #4a3a44; }
.lead { font-size: 19px; color: var(--muted); max-width: 600px; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin: 34px 0; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 18px; }
.card b { display: block; margin-bottom: 4px; color: var(--ink); }
.card span { color: var(--muted); font-size: 15px; }
.note { background: var(--blush); border-radius: 14px; padding: 14px 16px; color: var(--ink); }
footer { margin-top: 48px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; }
footer a { color: var(--muted); margin-right: 14px; }