/* Privacy Policy page-owned styles */

.privacy-policy-page {
  width: 100%;
}

.policy-section {
  width: 100%;
  padding-block: var(--space-3xl);
}

.policy-section__inner {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

.policy-section__content {
  width: 100%;
  max-width: 720px;
  margin-inline: 0;
}

.policy-section__title {
  color: inherit;
  margin-block-end: var(--space-lg);
}

.policy-section__lead {
  margin-block-end: var(--space-lg);
}

.policy-section__note {
  margin-block-start: var(--space-lg);
  color: var(--color-smoke-grey);
}

.surface-dark .policy-section__note,
.policy-use .policy-section__note,
.policy-retention .policy-section__note,
.policy-contact .policy-section__note {
  color: var(--color-raw-concrete);
}

/* Policy Introduction */
.policy-intro {
  background-color: var(--color-soot-black);
  color: var(--color-warm-ivory);
}

.policy-intro__title {
  color: var(--color-burnt-orange);
  font-size: clamp(2.25rem, 4vw, 3.5rem);
  margin-block-end: var(--space-lg);
}

.policy-intro__lead {
  margin-block-end: var(--space-md);
}

.policy-intro__date {
  color: var(--color-oxidized-copper);
  margin-block-end: var(--space-md);
}

.policy-intro__scope {
  margin-block-end: 0;
}

/* Information We Collect */
.policy-collect {
  background-color: var(--color-warm-ivory);
  color: var(--color-soot-black);
}

.policy-collect__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
}

.policy-list--square {
  list-style: none;
  padding-inline-start: 0;
  margin-block-end: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.policy-list--square li {
  position: relative;
  padding-inline-start: var(--space-lg);
}

.policy-list--square li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.55em;
  width: 8px;
  height: 8px;
  background-color: var(--color-burnt-orange);
  border-radius: 0;
}

.policy-list--square strong {
  color: inherit;
}

/* How We Use Your Information */
.policy-use {
  background-color: var(--color-soot-black);
  color: var(--color-warm-ivory);
}

.policy-use__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
}

.policy-list--numbered {
  list-style: none;
  padding-inline-start: 0;
  margin-block-end: 0;
  counter-reset: policy-counter;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.policy-list--numbered li {
  counter-increment: policy-counter;
  position: relative;
  padding-inline-start: var(--space-2xl);
}

.policy-list--numbered li::before {
  content: counter(policy-counter);
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--color-burnt-orange);
  line-height: 1.4;
}

/* Information Sharing and Disclosure */
.policy-sharing {
  background-color: var(--color-warm-ivory);
  color: var(--color-soot-black);
}

.policy-sharing__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
}

.policy-sharing__scenarios {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-block-end: var(--space-lg);
}

.policy-sharing__scenarios p {
  margin-block-end: 0;
}

.policy-sharing__lead-in {
  color: var(--color-oxidized-copper);
  font-weight: 600;
}

/* Data Retention and Security */
.policy-retention {
  background-color: var(--color-soot-black);
  color: var(--color-warm-ivory);
}

.policy-retention__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
}

.policy-retention__block {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.policy-retention__subtitle {
  color: var(--color-burnt-orange);
  margin-block-end: 0;
}

.policy-retention__block p {
  margin-block-end: 0;
}

.policy-retention__block .policy-list--square {
  margin-block-end: 0;
}

/* Your Rights and Choices */
.policy-rights {
  background-color: var(--color-warm-ivory);
  color: var(--color-soot-black);
}

.policy-rights__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
}

.policy-rights__name {
  color: var(--color-oxidized-copper);
  font-weight: 600;
}

/* Contact Us */
.policy-contact {
  background-color: var(--color-soot-black);
  color: var(--color-warm-ivory);
}

.policy-contact__content {
  border-inline-start: 2px solid var(--color-oxidized-copper);
  padding-inline-start: var(--space-lg);
}

.policy-contact__list {
  list-style: none;
  padding-inline-start: 0;
  margin-block-end: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.policy-contact__list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-xs);
}

.policy-contact__label {
  font-family: var(--font-heading);
  font-size: 0.875rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-burnt-orange);
  min-width: 90px;
}

.policy-contact__list a {
  color: var(--color-burnt-orange);
}

.policy-contact__list a:hover,
.policy-contact__list a:focus-visible {
  color: var(--color-ember-glow);
}

/* Responsive */
@media (min-width: 768px) {
  .policy-section {
    padding-block: var(--space-4xl);
  }

  .policy-section__inner {
    padding-inline: var(--container-padding-desktop);
  }
}

@media (min-width: 1024px) {
  .policy-section__content {
    max-width: 720px;
  }
}

@media (max-width: 767px) {
  .policy-section {
    padding-block: var(--space-2xl);
  }

  .policy-section__inner {
    padding-inline: var(--container-padding-mobile);
  }

  .policy-section__content {
    max-width: 100%;
  }

  .policy-intro__title {
    font-size: clamp(2.25rem, 8vw, 3rem);
  }

  .policy-contact__list li {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2xs);
  }

  .policy-contact__label {
    min-width: 0;
  }
}
