:root { color-scheme: light; --rose:#be123c; --rose-dark:#881337; --ink:#27272a; --muted:#71717a; --line:#e7e5e4; --paper:#fffdfb; --wash:#fff1f2; }
* { box-sizing: border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC",sans-serif; }
a { color:var(--rose); text-underline-offset:3px; }
header, main, footer { width:min(760px,calc(100% - 40px)); margin-inline:auto; }
header { padding:28px 0 18px; border-bottom:1px solid var(--line); }
.brand { color:var(--rose-dark); font-weight:750; text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:12px; font-size:.93rem; }
main { padding:42px 0 56px; }
.crumbs { color:var(--muted); font-size:.88rem; margin-bottom:24px; }
h1,h2 { line-height:1.3; color:#18181b; }
h1 { font-size:clamp(2rem,6vw,3.2rem); letter-spacing:-.04em; margin:0 0 18px; }
h2 { margin-top:38px; font-size:1.35rem; }
.lead { font-size:1.12rem; color:#52525b; }
.notice { margin:28px 0; padding:18px 20px; background:var(--wash); border-left:4px solid var(--rose); border-radius:10px; }
.cards { display:grid; gap:14px; margin:26px 0; }
.card { display:block; padding:20px; border:1px solid var(--line); border-radius:14px; color:inherit; text-decoration:none; background:white; }
.card:hover { border-color:#fda4af; box-shadow:0 8px 24px rgba(136,19,55,.07); }
.card strong { display:block; color:var(--rose-dark); font-size:1.05rem; }
.card span { color:var(--muted); font-size:.92rem; }
ol li, ul li { margin:.55em 0; }
.cta { display:inline-block; margin-top:20px; padding:10px 18px; border-radius:999px; background:var(--rose); color:white; font-weight:700; text-decoration:none; }
footer { padding:24px 0 38px; border-top:1px solid var(--line); color:var(--muted); font-size:.86rem; }
code { background:#f5f5f4; padding:.12em .35em; border-radius:4px; }
@media (min-width:700px) { .cards.two { grid-template-columns:1fr 1fr; } }