/* ============================================================
   Rechtsseiten (Datenschutz, Impressum, AGB) – ruhige Textseite
   Baut auf style.css + liquid.css + pro.css auf.
   ============================================================ */
.legal{ max-width: 820px; margin: 0 auto; padding: calc(env(safe-area-inset-top, 0px) + 140px) 24px 100px; }
.legal__eyebrow{ margin-bottom: 14px; }
.legal h1{ font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin-bottom: 28px; overflow-wrap: break-word; hyphens: auto; }
.legal h2{ font-size: clamp(1.3rem, 3vw, 1.6rem); font-weight: 800; letter-spacing: -.01em; margin: 56px 0 16px; padding-top: 24px; border-top: 1px solid var(--border); }
.legal h3{ font-size: 1.125rem; font-weight: 700; margin: 32px 0 10px; color: var(--ink); }
.legal h4{ font-size: 1rem; font-weight: 700; margin: 22px 0 8px; }
.legal p, .legal li{ color: var(--ink-dim); font-size: 1rem; line-height: 1.7; }
.legal p{ margin-bottom: 14px; }
.legal ul, .legal ol{ margin: 0 0 16px 22px; }
.legal ul{ list-style: disc; }
.legal ol{ list-style: decimal; }
.legal li{ margin-bottom: 6px; }
.legal a{ color: var(--olive-light); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal a:hover{ color: var(--ink); }
.legal strong{ color: var(--ink); }
.legal__todo{ display: inline-block; padding: 2px 8px; border-radius: 6px; background: rgba(226,5,31,.15); color: var(--ink); font-weight: 600; }
.legal__back{ display: inline-flex; margin-top: 48px; }
@media (max-width: 560px){
  .legal{ padding: calc(env(safe-area-inset-top, 0px) + 110px) 20px 80px; }
}

/* eRecht24-Widerrufsbutton (Markup vom Anbieter) im Footer im Stil unserer Buttons */
#eRecht24RevocationButton{
  display: inline-flex; align-self: flex-start; margin-top: 6px;
  padding: 10px 18px; font-size: .8125rem;
  background: transparent; color: var(--ink); border: 1px solid var(--border-strong); border-radius: 100px;
}
#eRecht24RevocationButton:hover{ border-color: var(--olive-light); }
.footer__cookie{ background: none; border: 0; padding: 0; font: inherit; font-size: .875rem; color: var(--ink-dim); cursor: pointer; text-align: left; transition: color .2s ease; }
.footer__cookie:hover{ color: var(--ink); }

.legal__toc{ margin: 8px 0 24px 22px; columns: 2 240px; column-gap: 32px; }
.legal__toc li{ margin-bottom: 4px; break-inside: avoid; }
.legal h2[id], .legal h3[id]{ scroll-margin-top: 100px; }
