/* Page: legal
 * Rôle: pages Privacy/Terms/Cookies (bloc légal + table cookies).
 * Dépendances: typographie globale + sections.css.
 * Note: conserver l'overflow horizontal mobile pour la table.
 */
.legal-wrap{max-width:920px; margin:0 auto}

.legal-card{
  border:1px solid var(--border);
  background:var(--panel);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:34px;
}

.legal-card section+section{
  margin-top:28px;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,0.08);
}

.legal-card h2{
  font-size:24px;
  margin-bottom:12px;
}

.legal-card ul{
  margin:12px 0 0 18px;
  color:var(--muted);
}

.legal-card li+li{
  margin-top:8px;
}

.legal-meta{
  margin-top:18px;
  color:var(--muted);
  font-size:14px;
}

.legal-note{
  margin-top:18px;
  padding:16px 18px;
  border-radius:16px;
  background:rgba(127,208,210,0.08);
  border:1px solid rgba(127,208,210,0.18);
  color:var(--muted);
}

.cookie-table{
  width:100%;
  border-collapse:collapse;
  margin-top:18px;
  color:var(--muted);
  font-size:15px;
}

.cookie-table th,
.cookie-table td{
  border:1px solid rgba(255,255,255,0.08);
  padding:12px 14px;
  vertical-align:top;
}

.cookie-table th{
  color:var(--text);
  text-align:left;
  background:rgba(255,255,255,0.04);
}

@media(max-width:900px){
  .cookie-table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
}