.terms {
  max-width: 900px;
  margin: 40px auto;
  font-size: 16px;
  line-height: 1.6;
}
.terms__header h1 {
  font-size: 32px;
  margin: 0 0 6px;
}
.terms__meta {
  color: #6b7280;
  margin: 0 0 24px;
}

.terms__toc {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 28px;
}
.terms__toc ol {
  margin: 8px 0 0;
  padding-left: 20px;
}
.terms__toc a { text-decoration: none; }
.terms__toc a:hover { text-decoration: underline; }

.terms__section { margin: 28px 0; }
.terms__section h2 { font-size: 22px; margin: 0 0 10px; }
.terms__section h3 { font-size: 18px; margin: 12px 0 6px; }

.keyvals { list-style: none; padding: 0; }
.keyvals li { padding: 6px 0; border-bottom: 1px dashed #e5e7eb; }
.keyvals li:last-child { border-bottom: 0; }

code {
  background: #f3f4f6;
  padding: 2px 6px;
  border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 90%;
}

/* ==========================================================================
   RESPONSIVE — Ajouts mobile-first (terms.css)
   ========================================================================== */

/* 🔹 Ultra-petits téléphones (<= 360px) */
@media (max-width: 359.98px){
  .terms{ max-width:100%; margin:24px auto; padding:0 14px; font-size:15px; line-height:1.65; }
  .terms__header h1{ font-size:24px; margin-bottom:8px; }
  .terms__meta{ margin-bottom:18px; }
  .terms__toc{ padding:12px 14px; border-radius:10px; margin-bottom:20px; }
  .terms__toc ol{ padding-left:16px; }
  .terms__section{ margin:22px 0; }
  .terms__section h2{ font-size:18px; margin-bottom:8px; }
  .terms__section h3{ font-size:16px; }
}

/* 🔹 Petits téléphones (<= 480px) */
@media (max-width: 480px){
  .terms{ padding:0 16px; }
  .terms__header h1{ font-size:26px; }
  .keyvals li{ padding:6px 0; }
  /* Si tu insères des listes longues dans le TOC, resserre l'indentation */
  .terms__toc ol{ padding-left:18px; }
}

/* 🔹 Téléphones “moyens” (>= 390px) */
@media (min-width: 390px){
  .terms__header h1{ font-size:28px; }
}

/* 🔹 À partir de 640px (sm) */
@media (min-width: 640px){
  .terms{ font-size:16px; line-height:1.65; }
  .terms__header h1{ font-size:30px; }
  .terms__toc{ padding:16px 18px; }
}

/* 🔹 Tablettes (>= 768px) */
@media (min-width: 768px){
  .terms{ padding:0 20px; }
  .terms__header h1{ font-size:32px; }
  .terms__section h2{ font-size:22px; }
  .terms__section h3{ font-size:18px; }
}

/* 🔹 Petits laptops (>= 1024px) */
@media (min-width: 1024px){
  .terms{ max-width:900px; margin:40px auto; padding:0; }
}

/* 🔹 ≥ 1280px */
@media (min-width: 1280px){
  .terms__header h1{ font-size:34px; }
}

/* 🔹 Safe areas (iPhone notch, etc.) */
@supports (padding: max(0px)){
  .terms{
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }
}

/* 🔹 Accessibilité */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto; }
}