.legal-page { min-height: 100vh; background: radial-gradient(circle at 85% 8%, rgba(140,124,255,.09), transparent 28%), var(--bg); }
.legal-shell { padding-top: calc(var(--header-height) + 62px); padding-bottom: 90px; }
.legal-shell > h1 { max-width: 780px; margin: 9px 0 6px; font-size: clamp(2.5rem, 6vw, 5rem); letter-spacing: -.055em; line-height: 1; }
.legal-updated { color: var(--text-muted); font-size: .75rem; }
.legal-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 22px; align-items: start; margin-top: 34px; }
.legal-content, .legal-summary { border: 1px solid var(--line); border-radius: 22px; background: rgba(11,27,43,.68); box-shadow: 0 24px 70px rgba(0,0,0,.14); }
.legal-content { padding: clamp(22px, 4vw, 42px); }
.legal-content section + section { margin-top: 30px; padding-top: 30px; border-top: 1px solid var(--line); }
.legal-content h2 { margin: 0 0 9px; font-size: 1.22rem; }
.legal-content p { margin: 0; color: var(--text-soft); font-size: .87rem; line-height: 1.8; }
.legal-content a { color: var(--primary); }
.legal-summary { position: sticky; top: calc(var(--header-height) + 22px); padding: 24px; }
.legal-summary strong { font-size: 1rem; }
.legal-summary ul { display: grid; gap: 10px; margin: 18px 0 22px; padding: 0; list-style: none; color: var(--text-soft); font-size: .78rem; }
.legal-summary li::before { content: "✓"; margin-right: 8px; color: var(--green); font-weight: 900; }
.legal-summary button { width: 100%; padding: 10px; border: 1px solid rgba(114,230,255,.25); border-radius: 11px; color: var(--primary); background: rgba(114,230,255,.07); cursor: pointer; font-weight: 800; }
html[data-theme="light"] .legal-content, html[data-theme="light"] .legal-summary { background: rgba(248,251,253,.96); box-shadow: 0 22px 58px rgba(25,56,78,.1); }
@media (max-width: 850px) { .legal-layout { grid-template-columns: 1fr; }.legal-summary { position: static; } }

/* About/legal pages keep one continuous page surface into the footer.
   This removes the near-black footer band that looked like a broken strip on mobile. */
.legal-page .site-footer {
  background: var(--bg);
}
html[data-theme="light"] .legal-page .site-footer {
  background: var(--bg);
}


/* Legal/About pages use the footer shell's outer divider only. */
.legal-page .footer-bottom {
  border-top: 0;
  padding-top: 0;
}


/* v19 brand-aligned legal/about surface. */
.legal-page{
  background:
    radial-gradient(circle at 88% 8%,rgba(11,103,242,.07),transparent 28%),
    radial-gradient(circle at 10% 16%,rgba(24,197,169,.055),transparent 28%),
    var(--bg);
}