/* ==========================================================================
   WAVE 196 - RECHTSTEXTE SIND EIN DOKUMENT, KEIN KACHELLAGER
   ==========================================================================
   Die AGB liefen als dreispaltiges Raster aus vierzehn hohen Kacheln mit
   unterschiedlichen Höhen, unterschiedlichen Hintergrundtönen, einer roten
   und einer violetten Umrandung, und Überschriften, die irgendwo in der
   Mitte ihrer Kachel hingen. Ein Vertrag, den man in schmalen Spalten von
   oben nach unten und wieder hoch lesen muss, ist kein Vertrag, den jemand
   liest.

   Eine Lesespalte. Nummerierte Abschnitte an einer Haarlinie. Ein Rhythmus.
   Kein Rahmen, kein Radius, kein Farbton pro Kachel.
   ========================================================================== */

body[data-ka-doc="legal"] .section-inner {
  width: min(760px, calc(100% - 48px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

/* das Raster wird eine Spalte */
body[data-ka-doc="legal"] .section-inner > div,
body[data-ka-doc="legal"] .section-inner > ol,
body[data-ka-doc="legal"] .section-inner > ul {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  columns: auto !important;
}

/* jede Kachel wird ein Abschnitt */
body[data-ka-doc="legal"] .offer-tile {
  display: block !important;
  position: relative !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 0 clamp(2.4rem, 4vw, 3.4rem) !important;
  padding: clamp(1.5rem, 2.4vw, 2rem) 0 0 !important;
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(226, 237, 252, .14) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transform: none !important;
  color: rgba(246, 241, 231, .78) !important;
}
body[data-ka-doc="legal"] .offer-tile::before,
body[data-ka-doc="legal"] .offer-tile::after { content: none !important; }

/* die Nummer steht in der Marge, nicht im Text */
body[data-ka-doc="legal"] .offer-tile > *:first-child {
  display: block !important;
  margin: 0 0 .35rem !important;
  color: rgba(236, 196, 120, .8) !important;
  font:700 0.6875rem/1 "JetBrains Mono", ui-monospace, monospace !important;
  letter-spacing: .24em !important;
}

body[data-ka-doc="legal"] .offer-tile h2,
body[data-ka-doc="legal"] .offer-tile h3,
body[data-ka-doc="legal"] .offer-tile h4 {
  margin: 0 0 .9rem !important;
  max-width: 34ch;
  color: #f6f1e7 !important;
  font-size: clamp(1.12rem, 1.5vw, 1.35rem) !important;
  font-weight: 700 !important;
  line-height: 1.24 !important;
  letter-spacing: -.005em !important;
  text-align: left !important;
}

body[data-ka-doc="legal"] .offer-tile p {
  margin: 0 0 .95rem !important;
  max-width: 68ch;
  color: rgba(246, 241, 231, .74) !important;
  font-size: 1rem !important;
  line-height: 1.68 !important;
  text-align: left !important;
}
body[data-ka-doc="legal"] .offer-tile p:last-child { margin-bottom: 0 !important; }

body[data-ka-doc="legal"] .offer-tile ul,
body[data-ka-doc="legal"] .offer-tile ol {
  margin: 0 0 .95rem !important;
  padding-left: 1.15rem !important;
  max-width: 68ch;
}
body[data-ka-doc="legal"] .offer-tile li {
  margin: 0 0 .5rem !important;
  color: rgba(246, 241, 231, .7) !important;
  font-size: 1rem !important;
  line-height: 1.62 !important;
}

body[data-ka-doc="legal"] .offer-tile strong,
body[data-ka-doc="legal"] .offer-tile b { color: #f6f1e7 !important; }

/* Kopf und Vorspann */
body[data-ka-doc="legal"] .section-heading,
body[data-ka-doc="legal"] h1 {
  max-width: 22ch;
  text-align: left !important;
}
body[data-ka-doc="legal"] .section-lead {
  max-width: 68ch;
  color: rgba(246, 241, 231, .68) !important;
  font-size: 1.0625rem !important;
  line-height: 1.65 !important;
  font-style: normal !important;
  text-align: left !important;
}
body[data-ka-doc="legal"] .eyebrow {
  color: rgba(236, 196, 120, .8) !important;
  letter-spacing: .24em !important;
  font-size:0.6875rem !important;
}

/* ein Grundton über das ganze Dokument */
body[data-ka-doc="legal"] .section {
  background: #060b14 !important;
  padding-block: clamp(2.6rem, 5vw, 4rem) !important;
}
body[data-ka-doc="legal"] .section + .section { border-top: 0 !important; }

@media (max-width: 599px) {
  body[data-ka-doc="legal"] .section-inner { width: calc(100% - 36px) !important; }
}