body.legal-page {
  font-family: "Lato", sans-serif;
  background: linear-gradient(
    180deg,
    var(--legal-bg-start) 0%,
    var(--legal-bg-end) 100%
  );
  color: #1f2a37;
}

body.legal-page--privacy {
  --legal-bg-start: #f8fbff;
  --legal-bg-end: #eef4fb;
  --legal-hero-accent-top: #ffd7ad;
  --legal-hero-accent-bottom: #bfd8ff;
  --legal-hero-accent-top-stop: 42%;
  --legal-hero-accent-bottom-stop: 36%;
  --legal-content-border: #d7e2ef;
  --legal-content-shadow: rgba(17, 39, 69, 0.08);
  --legal-note-border: #f59d45;
  --legal-note-bg: #fff4e8;
  --legal-note-text: #5e3d1d;
}

body.legal-page--terms {
  --legal-bg-start: #fffaf4;
  --legal-bg-end: #fff2e5;
  --legal-hero-accent-top: #ffd9b3;
  --legal-hero-accent-bottom: #c9dcff;
  --legal-hero-accent-top-stop: 40%;
  --legal-hero-accent-bottom-stop: 34%;
  --legal-content-border: #e9d9c8;
  --legal-content-shadow: rgba(94, 58, 29, 0.08);
  --legal-note-border: #1a3a6b;
  --legal-note-bg: #eef4ff;
  --legal-note-text: #1a365a;
}

.legal-hero {
  padding: 8.5rem 0 3rem;
  background:
    radial-gradient(
      circle at top right,
      var(--legal-hero-accent-top) 0%,
      transparent var(--legal-hero-accent-top-stop)
    ),
    radial-gradient(
      circle at bottom left,
      var(--legal-hero-accent-bottom) 0%,
      transparent var(--legal-hero-accent-bottom-stop)
    );
}

.legal-badge {
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #1a3a6b;
  margin-bottom: 0.9rem;
}

.legal-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.2;
  color: #112745;
}

.legal-subtitle {
  margin-top: 1rem;
  max-width: 780px;
  color: #3a4b60;
  line-height: 1.75;
}

.legal-wrapper {
  padding: 0 0 4.5rem;
}

.legal-content {
  background: #ffffff;
  border: 1px solid var(--legal-content-border);
  border-radius: 22px;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  box-shadow: 0 18px 45px var(--legal-content-shadow);
}

.legal-updated {
  margin-bottom: 1.5rem;
  font-size: 0.95rem;
  color: #576578;
}

.legal-section + .legal-section {
  margin-top: 1.8rem;
}

.legal-section h2 {
  font-family: "Playfair Display", serif;
  font-size: clamp(1.3rem, 2.7vw, 1.9rem);
  line-height: 1.3;
  color: #16345c;
  margin-bottom: 0.65rem;
}

.legal-section p,
.legal-section li {
  line-height: 1.8;
  color: #233244;
}

.legal-section ul {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.legal-note {
  margin-top: 2rem;
  padding: 1rem 1.1rem;
  border-left: 4px solid var(--legal-note-border);
  background: var(--legal-note-bg);
  border-radius: 10px;
  color: var(--legal-note-text);
}

.legal-actions {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.legal-nav-actions {
  display: flex;
  gap: 0.8rem;
  align-items: center;
}

@media (max-width: 768px) {
  .legal-hero {
    padding-top: 7.5rem;
  }
}