/* =========================================================================
   Legal Pages — freundlicher Hero + ruhige Inhaltskarte
   ========================================================================= */

.legal-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 0%, rgba(168, 189, 160, 0.34), transparent 30rem),
    radial-gradient(circle at 88% 18%, rgba(168, 85, 107, 0.10), transparent 26rem),
    var(--creme-warm);
  padding-block: calc(var(--raum-3xl) + 0.5rem) var(--raum-2xl);
}

.legal-hero::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: var(--raum-xl);
  width: 72px;
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(122, 144, 112, 0.9), transparent);
}

.legal-hero__inner {
  max-width: 780px;
  margin-inline: auto;
  text-align: center;
}

.legal-hero .lead {
  margin-inline: auto;
}

.legal-body {
  background: var(--creme);
  padding-block: var(--raum-2xl) calc(var(--raum-4xl) + var(--safe-bottom));
}

.legal-card {
  max-width: 880px;
  margin-inline: auto;
  background: var(--papier);
  border: 1px solid rgba(216, 212, 203, 0.72);
  border-radius: 24px;
  box-shadow: var(--schatten-md);
  padding: var(--raum-xl);
}

@media (min-width: 768px) {
  .legal-card {
    padding: var(--raum-2xl);
  }
}

.legal-block {
  padding-block: var(--raum-lg);
  border-top: 1px solid rgba(216, 212, 203, 0.78);
}

.legal-block:first-child {
  border-top: 0;
  padding-top: 0;
}

.legal-block:last-child {
  padding-bottom: 0;
}

.legal-block h2 {
  font-size: clamp(1.35rem, 1vw + 1.1rem, 1.85rem);
  margin-bottom: var(--raum-sm);
}

.legal-block p:last-child {
  margin-bottom: 0;
}

.legal-note {
  background: linear-gradient(135deg, var(--creme-warm), rgba(250, 246, 239, 0.74));
  border: 1px solid rgba(168, 189, 160, 0.48);
  border-radius: var(--radius-lg);
  padding: var(--raum-md);
  font-size: 0.95rem;
}

.legal-contact-card {
  background: linear-gradient(135deg, var(--creme-warm), var(--papier));
  border: 1px solid rgba(168, 189, 160, 0.52);
  border-radius: var(--radius-lg);
  box-shadow: var(--schatten-sm);
  padding: var(--raum-lg);
}

.legal-contact-card p:last-child {
  margin-bottom: 0;
}

.legal-contact-card__title {
  display: block;
  font-family: var(--schrift-serif);
  font-size: clamp(1.45rem, 1.5vw + 1rem, 2rem);
  line-height: 1.15;
  color: var(--moos);
  margin-bottom: var(--raum-xs);
}

.legal-meta {
  display: inline-flex;
  align-items: center;
  margin-top: var(--raum-xl);
  padding: 0.45rem 0.85rem;
  border: 1px solid rgba(216, 212, 203, 0.9);
  border-radius: var(--radius-pill);
  background: var(--creme-warm);
  font-size: 0.85rem;
  color: var(--grau);
}

@media (max-width: 767px) {
  .legal-hero {
    padding-block: var(--raum-2xl) var(--raum-xl);
  }

  .legal-body {
    padding-block: var(--raum-xl) calc(var(--raum-3xl) + var(--safe-bottom));
  }

  .legal-card {
    border-radius: var(--radius-lg);
    padding: var(--raum-lg);
  }

  .legal-block {
    padding-block: var(--raum-md);
  }
}