/* Informations légales — page styles (on top of nocturne.css). */
html { scroll-behavior: smooth; }
body { margin: 0; background: #0A0908; color: #ECEBF0; font-family: "Inter", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: #CDBBFF; text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: #ECEBF0; }
* { box-sizing: border-box; }

.legal-header { position: sticky; top: 0; z-index: 10; background: rgba(10,9,8,0.9); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(236,235,240,0.06); }
.legal-header > div { max-width: 1100px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.legal-header .brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.legal-header .brand img { display: block; height: auto; }
.legal-header .btn { padding: 8px 14px; text-decoration: none; color: #ECEBF0; }

.legal { max-width: 1100px; margin: 0 auto; padding: 72px 24px 120px; display: flex; flex-wrap: wrap; gap: 48px 64px; align-items: flex-start; }
.toc { flex: 0 1 240px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.toc p { margin: 0 0 10px; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: #9D9AA8; }
.toc a { color: #B9B6C4; text-decoration: none; padding: 8px 0; border-top: 1px solid rgba(236,235,240,0.08); }
.toc a:last-child { border-bottom: 1px solid rgba(236,235,240,0.08); }
.toc a:hover { color: #ECEBF0; }

.legal-body { flex: 1 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 64px; font-size: 15px; line-height: 1.7; color: #C9C6D3; }
.legal-body p, .legal-body dl, .legal-body ul { margin: 0; }
.legal-intro .kicker { margin: 0 0 14px; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: #B39AFF; }
.legal-intro h1 { margin: 0 0 16px; font-size: clamp(32px,4vw,48px); line-height: 1.08; letter-spacing: -0.03em; font-weight: 500; color: #ECEBF0; }
.legal-intro p:last-child { color: #9D9AA8; }
.legal-body section { display: flex; flex-direction: column; gap: 14px; scroll-margin-top: 96px; }
.legal-body h2 { margin: 0; font-size: 26px; font-weight: 500; letter-spacing: -0.02em; color: #ECEBF0; }
.legal-body h3 { margin: 8px 0 0; font-size: 17px; font-weight: 500; color: #ECEBF0; }
.legal-body strong { color: #ECEBF0; font-weight: 500; }
.legal-body ul { padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
.legal-body dl { display: grid; grid-template-columns: minmax(140px,200px) minmax(0,1fr); gap: 10px 24px; }
.legal-body dt { color: #9D9AA8; }
.legal-body dd { margin: 0; }
/* Placeholders still to be filled in by VERUM */
.todo { color: #E6DDFF; background: #1C0A4D; padding: 1px 6px; border-radius: 4px; }

.legal-body .artci { padding: 28px; border-radius: 16px; background: #141217; box-shadow: 0 0 0 1px #2A2830; }
.artci .kicker { font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: #B39AFF; }
.artci h2 { font-size: 24px; }
.artci dl { grid-template-columns: minmax(160px,220px) minmax(0,1fr); }

@media (max-width: 520px) {
  .legal-body dl, .artci dl { grid-template-columns: 1fr; gap: 2px; }
  .legal-body dd { margin-bottom: 10px; }
}