/* Mise en page des pages légales (CGV/CGU, confidentialité). */
.legal {
  max-width: 760px;
  margin: 0 auto;
  padding: 28px 22px 80px;
}
.legal .top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 28px;
}
.legal .brand { display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--text); font-weight: 800; }
.legal .brand .mark {
  width: 28px; height: 28px; border-radius: 8px; background: var(--blue);
  color: #fff; display: grid; place-items: center; font-weight: 900;
}
.legal h1 { font-size: 30px; letter-spacing: -.5px; margin: 0 0 6px; }
.legal .updated { color: var(--muted); font-size: 13px; margin-bottom: 28px; }
.legal h2 { font-size: 19px; margin: 30px 0 10px; color: var(--text); }
.legal h3 { font-size: 16px; margin: 18px 0 6px; color: var(--text); }
.legal p, .legal li { color: var(--reading, #c2cbd6); font-size: 15px; line-height: 1.65; }
.legal ul { padding-left: 20px; margin: 8px 0; }
.legal li { margin: 4px 0; }
.legal a { color: var(--blue); }
.legal .notice {
  background: var(--blue-soft); border: 1px solid var(--blue); color: var(--text);
  border-radius: 12px; padding: 12px 16px; font-size: 13px; line-height: 1.55; margin-bottom: 26px;
}
.legal .ph { color: var(--warn); font-weight: 600; }
.legal .back { color: var(--muted); text-decoration: none; font-size: 14px; }
.legal .back:hover { color: var(--blue); }