/* ==========================================================================
   Page: legal  (site/legal/show — privacy, terms)
   --------------------------------------------------------------------------
   .legal  contents box (components/toc.css, sticky) beside the text
           (components/prose.css); the first h2 sits flush with the top;
           the closing "question about your data?" line on the panel colour
   ========================================================================== */

.legal { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: var(--space-12); align-items: start; }
.legal__body { max-width: 74ch; }
.legal__body > h2:first-child, .legal__body > blockquote:first-child { margin-top: 0; }
.legal__contact {
    display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2);
    margin-top: var(--space-10) !important;
    padding: var(--space-5) var(--space-6);
    border-radius: var(--r-lg);
    background: var(--panel);
    font-size: var(--fs-base);
}
.legal__contact .icon { color: var(--second-text); }

@media (max-width: 991.98px) {
    .legal { grid-template-columns: 1fr; gap: var(--space-6); }
}