:root { color: var(--navy); background: var(--bg); font-family: var(--font); } * { box-sizing: border-box; } body { margin: 0; padding: 16px; } main { max-width: 680px; margin: 0 auto; } header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0 24px; }.brand { color: var(--coral); font-size: 14px; font-weight: 850; letter-spacing: .05em; text-decoration: none; }.brand span { padding: 2px 6px; border-radius: 5px; color: #fff; background: var(--coral-cta); font-size: 10px; }.back, a { color: var(--navy); text-underline-offset: 3px; }.back { font-size: 13px; font-weight: 750; }.kicker { margin: 0 0 6px; color: var(--coral-cta); font-size: 10px; font-weight: 850; letter-spacing: .1em; } h1 { margin: 0; font-size: clamp(30px, 7vw, 47px); letter-spacing: -.045em; } h2 { margin: 28px 0 8px; font-size: 20px; letter-spacing: -.025em; } p, li { color: var(--body); line-height: 1.6; } .lead { margin: 12px 0 0; color: var(--muted); font-size: 17px; }.card { margin-top: 22px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }.notice { border-left: 4px solid var(--coral); background: var(--alert-bg); }.list { padding-left: 20px; }.list li + li { margin-top: 8px; } footer { margin: 34px 0 8px; color: var(--muted); font-size: 12px; line-height: 1.55; } @media (max-width: 420px) { body { padding: 12px; }.card { padding: 16px; } }