/* ==========================================
   PRIVACY POLICY — /privacy-policy
   Centered legal document. Column + rhythm come from
   .container-small.section (master.css); the hero is centered, the numbered
   sections stay left-aligned for readability. This file holds only the
   document-specific deltas on the .legal-* vocabulary.
   ========================================== */

/* Hero (centered) */
.legal-hero {
  margin-bottom: var(--space-8);
}
.legal-updated {
  margin-top: var(--space-3);
  font-size: var(--text-small);
  letter-spacing: 0.04em;
  color: var(--color-gray-dark);
}
.legal-intro {
  max-width: 62ch;
  margin: var(--space-5) auto 0;
  color: var(--color-gray);
}

/* Sections (left-aligned) */
.legal-section + .legal-section {
  margin-top: var(--space-8);
}
.legal-heading {
  font-size: var(--text-h3);
  font-weight: 500;
  color: var(--color-white);
}
.legal-body > * + * {
  margin-top: var(--space-4);
}
.legal-body p {
  color: var(--color-gray);
}
.legal-body a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.legal-body a:hover {
  color: var(--color-primary-light);
}
.legal-body strong {
  color: var(--color-white);
  font-weight: 600;
}

/* Sub-headings inside a section (e.g. the data categories) */
.legal-subheading {
  margin-top: var(--space-5);
  font-size: var(--text-h5);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--color-white);
}
.legal-subheading + p {
  margin-top: var(--space-2);
}

/* Bulleted list — master resets ul to list-style:none, so draw a brass dash */
.legal-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-left: var(--space-5);
}
.legal-list li {
  position: relative;
  color: var(--color-gray);
  line-height: 1.7;
}
.legal-list li::before {
  content: "";
  position: absolute;
  left: calc(-1 * var(--space-5));
  top: 0.75em;
  width: 7px;
  height: 1px;
  background-color: var(--color-primary);
}

/* Contact block */
.legal-contact-name {
  color: var(--color-white);
  font-weight: 500;
}
.legal-contact p {
  margin-top: var(--space-1);
}