/* ============================================
   ARVOLUOTTO — legal.css
   Styles réutilisables pour les pages légales
   (Tietosuoja, Käyttöehdot, Evästeet).
   ============================================ */

.legal-updated {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #9AA79D;
  margin-bottom: 32px;
}
.legal-updated svg { width: 15px; height: 15px; }

/* ---------- TABLE DES MATIÈRES ---------- */
.legal-toc {
  background: #FFFFFF;
  border: 1px solid var(--bordure);
  border-radius: var(--rayon);
  padding: 24px 28px;
  margin-bottom: 48px;
}
.legal-toc h2 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #9AA79D;
  margin-bottom: 14px;
}
.legal-toc ol {
  columns: 2;
  column-gap: 32px;
  margin: 0;
  padding-left: 20px;
}
.legal-toc li { font-size: 14px; margin-bottom: 8px; break-inside: avoid; }
.legal-toc a { color: var(--vert-fonce); font-weight: 600; }
.legal-toc a:hover { color: var(--vert-pur); }

/* ---------- CONTENU ---------- */
.legal-content { max-width: 760px; margin: 0 auto; }
.legal-section { margin-bottom: 44px; scroll-margin-top: 104px; }
.legal-section:last-child { margin-bottom: 0; }
.legal-section h2 {
  font-size: 20px;
  color: var(--texte);
  margin-bottom: 14px;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.legal-section h2 .num { color: var(--vert-pur); font-family: var(--police-titres); }
.legal-section p, .legal-section li {
  font-size: 15px;
  line-height: 1.75;
  color: #4B594E;
}
.legal-section p { margin: 0 0 16px; }
.legal-section ul, .legal-section ol.legal-list { margin: 0 0 16px; padding-left: 22px; }
.legal-section li { margin-bottom: 6px; }
.legal-section strong { color: var(--texte); }
.legal-section a { color: var(--vert-fonce); font-weight: 600; }
.legal-section a:hover { color: var(--vert-pur); }

.legal-table { width: 100%; border-collapse: collapse; margin: 0 0 16px; font-size: 14px; }
.legal-table th, .legal-table td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--bordure); }
.legal-table th { color: #9AA79D; font-weight: 600; font-size: 12px; text-transform: uppercase; }
.legal-table td { color: #4B594E; }

.legal-contact-box {
  background: var(--vert-pale);
  border-radius: var(--rayon);
  padding: 22px 26px;
  margin-top: 8px;
}
.legal-contact-box p { margin: 0; color: #384038; }
.legal-contact-box a { color: var(--vert-fonce); }

/* ---------- Responsive ---------- */
@media (max-width: 640px) {
  .legal-toc ol { columns: 1; }
}