/* ---------------------------------
   Privacy layout
---------------------------------- */

.privacy-page {
  background: var(--color-cream);
}

.privacy-page__layout {
  display: grid;
  grid-template-columns:
    16rem
    minmax(0, 1fr);

  align-items: start;
  gap: var(--space-8);
}

/* ---------------------------------
   Sidebar
---------------------------------- */

.privacy-page__sidebar-inner {
  position: sticky;
  top: 7rem;
}

.privacy-page__sidebar .eyebrow {
  margin-bottom: var(--space-3);
}

.privacy-nav {
  display: grid;

  max-height: calc(100vh - 11rem);
  overflow-y: auto;

  padding-right: var(--space-2);
}

.privacy-nav a {
  padding-block: 0.5rem;

  font-size: 0.8125rem;
  line-height: 1.35;

  color: var(--color-text-secondary);
  text-decoration: none;

  border-bottom:
    1px solid
    var(--color-border);

  transition: color 180ms ease;
}

.privacy-nav a:hover {
  color: var(--color-primary);
}

/* ---------------------------------
   Content
---------------------------------- */

.privacy-content {
  max-width: 52rem;
}

.privacy-content__intro {
  margin-bottom: var(--space-8);
}

.privacy-content__updated {
  margin-bottom: var(--space-4);

  font-size: 0.8125rem;
  font-weight: 600;

  color: var(--color-primary);
}

.privacy-content__intro h2 {
  margin-bottom: var(--space-3);
}

.privacy-content p,
.privacy-content li,
.privacy-content dd {
  font-size: 0.9375rem;
  line-height: 1.7;

  color: var(--color-text-secondary);
}

.privacy-content a {
  color: var(--color-primary);
  font-weight: 600;
}

.privacy-content a:hover {
  color: var(--color-primary);
}

/* ---------------------------------
   Summary
---------------------------------- */

.privacy-highlight {
  margin-bottom: var(--space-9);

  padding: var(--space-6);

  background: var(--color-sand);

  border-radius: var(--radius-lg);
}

.privacy-highlight .eyebrow {
  margin-bottom: var(--space-2);
}

.privacy-highlight h2 {
  margin-bottom: var(--space-5);
}

.privacy-highlight__grid {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: var(--space-4);
}

.privacy-highlight__grid div {
  display: grid;
  gap: var(--space-1);

  padding: var(--space-3);

  background: rgb(255 255 255 / 55%);

  border-radius: var(--radius-sm);
}

.privacy-highlight__grid strong {
  font-size: 0.875rem;
  color: var(--color-primary);
}

.privacy-highlight__grid span {
  font-size: 0.8125rem;
  line-height: 1.5;

  color: var(--color-text-secondary);
}

/* ---------------------------------
   Sections
---------------------------------- */

.privacy-section {
  scroll-margin-top: 7rem;

  margin-bottom: var(--space-8);
}

.privacy-section h2 {
  margin-bottom: var(--space-4);

  padding-bottom: var(--space-3);

  border-bottom:
    1px solid
    var(--color-border);
}

.privacy-section p {
  margin-bottom: var(--space-3);
}

.privacy-section ul {
  display: grid;
  gap: var(--space-2);

  margin:
    var(--space-4)
    0;

  padding-left: 1.25rem;
}

.privacy-section li::marker {
  color: var(--color-primary);
}

/* ---------------------------------
   Definition cards
---------------------------------- */

.privacy-definitions {
  display: grid;
  gap: var(--space-3);

  margin: var(--space-4) 0;
}

.privacy-definitions div {
  padding: var(--space-3);

  background: #fff;

  border:
    1px solid
    var(--color-border);

  border-radius: var(--radius-sm);
}

.privacy-definitions dt {
  margin-bottom: var(--space-1);

  font-size: 0.875rem;
  font-weight: 600;

  color: var(--color-primary);
}

.privacy-definitions dd {
  margin: 0;
}

/* ---------------------------------
   Addresses
---------------------------------- */

.privacy-content address {
  margin:
    var(--space-3)
    0;

  font-style: normal;
  font-size: 0.9375rem;
  line-height: 1.65;

  color: var(--color-text-secondary);
}

/* ---------------------------------
   Tablet
---------------------------------- */

@media (max-width: 64rem) {
  .privacy-page__layout {
    grid-template-columns: 1fr;

    gap: var(--space-6);
  }

  .privacy-page__sidebar-inner {
    position: static;
  }

  .privacy-nav {
    display: flex;
    gap: var(--space-2);

    max-height: none;

    overflow-x: auto;

    padding-bottom: var(--space-2);
  }

  .privacy-nav a {
    flex: 0 0 auto;

    padding:
      0.625rem
      0.875rem;

    background: #fff;

    border:
      1px solid
      var(--color-border);

    border-radius: var(--radius-round);
  }

  .privacy-content {
    max-width: none;
  }
}

/* ---------------------------------
   Mobile
---------------------------------- */

@media (max-width: 48rem) {
  .privacy-highlight {
    padding: var(--space-4);
  }

  .privacy-highlight__grid {
    grid-template-columns: 1fr;
  }

  .privacy-section {
    margin-bottom: var(--space-7);
  }
}