/* Pages légales, sur le thème papier (paper.css). */
.legal-banner { height: clamp(7rem, 22vw, 15rem); overflow: hidden; }
.legal-banner img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }

.legal { counter-reset: legal-section; max-width: 42rem; margin: 0 auto; padding: 3rem 1rem 4rem; line-height: 1.7; }
.legal h1, .legal h2 { font-family: var(--serif); font-weight: 400; color: var(--ink); }
.legal h1 { margin: 0 0 1rem; font-size: clamp(2rem, 5vw, 2.75rem); line-height: 1.15; }
.legal h2 { margin: 0 0 0.75rem; font-size: 1.5rem; line-height: 1.3; }
.legal section { margin-top: 2rem; }
.legal-toc-title { margin: 0 0 0.75rem; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); }
.legal-identity dt { font-weight: 600; }
.legal-identity dd { margin: 0 0 0.5rem; }

/* Sections numérotées, sommaire repris des mêmes numéros. */
.legal-body > section { counter-increment: legal-section; padding-top: 2rem; border-top: 1px solid var(--rule); }
.legal-body > section > h2::before { content: counter(legal-section, decimal-leading-zero); display: block; margin-bottom: 0.25rem; font-size: 0.875rem; letter-spacing: 0.1em; color: var(--accent); }
.legal-toc { margin: 2.5rem 0 0; padding: 1.25rem 1.5rem; background: rgb(255 255 255 / 0.5); border: 1px solid var(--rule); border-radius: 0.5rem; }
.legal-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: legal-toc; }
.legal-toc li { counter-increment: legal-toc; display: flex; gap: 0.75rem; padding: 0.25rem 0; }
.legal-toc li::before { content: counter(legal-toc, decimal-leading-zero); min-width: 1.5rem; font-variant-numeric: tabular-nums; color: var(--accent); }
.page-legal .legal-toc a { color: var(--ink); text-decoration: none; }
.page-legal .legal-toc a:hover { text-decoration: underline; }
.legal-body section[id], .legal-body h2[id] { scroll-margin-top: 1.5rem; }

@media (min-width: 62rem) {
    .legal--with-toc { display: grid; grid-template-columns: 13rem minmax(0, 42rem); column-gap: 4rem; max-width: 64rem; }
    .legal--with-toc .legal-head { grid-column: 2; }
    .legal--with-toc .legal-toc { grid-column: 1; grid-row: 1 / span 2; align-self: start; position: sticky; top: 2rem; margin: 0; padding: 0; background: none; border: 0; }
    .legal--with-toc .legal-body { grid-column: 2; }
}

.legal-reference { width: min(42rem, calc(100% - 2rem)); margin: 1.5rem auto 0; padding: 0.75rem 1rem; font-size: 0.9375rem; background: rgb(255 255 255 / 0.5); border: 1px solid var(--rule); border-radius: 0.5rem; }
