/* Rechtstexte (Datenschutz, 404): nummerierte Abschnitte als Karten. */

.legal{max-width:860px;margin:0 auto;padding:56px 24px 40px;counter-reset:abschnitt}
.legal-sec{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:30px 32px;margin-bottom:22px;
  counter-increment:abschnitt;
}
.legal-sec h2{display:flex;gap:14px;align-items:center;margin-bottom:14px;font-size:1.22rem}
.legal-sec h2::before{
  content:counter(abschnitt);
  flex:none;width:34px;height:34px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(45,212,191,.12);border:1px solid rgba(45,212,191,.4);
  color:var(--accent);font-size:.95rem;font-weight:700;
}
.legal-sec p,.legal-sec li{color:var(--muted);font-size:.97rem}
.legal-sec p{margin-bottom:12px}
.legal-sec p:last-child,.legal-sec ul:last-child{margin-bottom:0}
.legal-sec ul{margin:0 0 12px 20px}
.legal-sec li{margin-bottom:6px}
.legal-sec b,.legal-sec strong{color:var(--text)}
.legal-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:860px;margin:0 auto;padding:0 24px 56px}
.legal-foot--solo{padding-top:40px}

@media (max-width:760px){
  .legal{padding:40px 16px 24px}
  .legal-sec{padding:24px 20px}
  .legal-sec h2{font-size:1.1rem}
}