/* Public legal page styles. */
/* Legal pages: privacy and terms */
.legal-page {
  background: var(--color-paper);
}
.legal-main {
  background: linear-gradient(180deg, var(--color-cloud) 0, var(--color-paper) 220px);
}
.legal-hero {
  padding: clamp(48px, 6vw, 68px) 0 clamp(40px, 5vw, 58px);
}
.legal-section {
  padding: clamp(28px, 4vw, 48px) 0 clamp(54px, 6vw, 74px);
  background: transparent;
}
.legal-shell {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 960px);
  gap: var(--space-40);
  align-items: start;
  max-width: 1280px;
}
.legal-aside {
  position: sticky;
  top: 104px;
  padding: var(--space-24) 0;
}
.legal-aside-title {
  margin-bottom: var(--space-12);
  color: var(--color-copper-600);
  font-size: var(--font-13);
  font-weight: var(--weight-bold);
  
  text-transform: uppercase;
}
.legal-toc {
  display: grid;
  gap: var(--space-8);
}
.legal-toc a {
  display: block;
  padding: var(--space-8) 0;
  color: var(--color-muted);
  font-size: var(--font-13);
  line-height: var(--leading-compact);
  text-decoration: none;
}
.legal-toc a:hover,
.legal-toc a:focus-visible {
  color: var(--color-navy-900);
}
.legal-toc--compact a {
  padding: var(--space-4) 0;
  font-size: var(--font-13);
}
.legal-content {
  overflow: hidden;
  border: var(--border-soft);
  border-radius: var(--radius-8);
  background: var(--color-paper);
  box-shadow: 0 24px 70px color-mix(in srgb, var(--color-navy-950) 8%, transparent);
}
.legal-intro,
.legal-block {
  padding: clamp(24px, 3vw, 32px) clamp(20px, 4vw, 40px);
}
.legal-block {
  scroll-margin-top: calc(72px + var(--space-24));
}
.legal-intro {
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-paper) 95%, transparent), var(--color-paper));
  border-bottom: 1px solid color-mix(in srgb, var(--color-navy-800) 8%, transparent);
}
.legal-block + .legal-block {
  border-top: 1px solid color-mix(in srgb, var(--color-navy-800) 8%, transparent);
}
.legal-content h2 {
  margin-bottom: var(--space-16);
}
.legal-content h3 {
  margin: 26px 0 var(--space-10);
}
.legal-content p,
.legal-content li,
.legal-contact dd,
.legal-contact dt {
  color: var(--color-text);
  font-size: var(--font-16);
  line-height: var(--leading-relaxed);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.legal-content p + p {
  margin-top: 14px;
}
.legal-content ul,
.legal-content ol {
  display: grid;
  gap: var(--space-12);
  margin: 18px 0 0;
  padding-left: var(--space-24);
}
.legal-content li strong {
  display: block;
  margin-bottom: 3px;
  color: var(--color-navy-900);
  font-weight: var(--weight-bold);
}
.legal-content li span {
  display: block;
}
.legal-contact {
  display: grid;
  gap: 0;
  margin: 22px 0 0;
  border: 1px solid color-mix(in srgb, var(--color-navy-800) 10%, transparent);
  border-radius: var(--radius-8);
  overflow: hidden;
}
.legal-contact div {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
}
.legal-contact div + div {
  border-top: 1px solid color-mix(in srgb, var(--color-navy-800) 8%, transparent);
}
.legal-contact dt,
.legal-contact dd {
  padding: var(--space-16) var(--space-20);
}
.legal-contact dt {
  background: var(--color-cloud);
  color: var(--color-navy-900);
  font-weight: var(--weight-bold);
}
.legal-contact dd {
  background: var(--color-paper);
}



/* ==========================================================================
   Final Media Queries
   ========================================================================== */

@media (max-width: 1024px) {
.legal-shell {
    grid-template-columns: 1fr;
    gap: var(--space-20);
  }
  .legal-aside {
    position: static;
    padding: 0;
  }
  .legal-toc {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4) var(--space-20);
    padding: var(--space-20) var(--space-20);
    border: var(--border-soft);
    border-radius: var(--radius-8);
    background: color-mix(in srgb, var(--color-paper) 78%, transparent);
  }
}

@media (max-width: 768px) {
.legal-aside {
    display: none;
  }
  .legal-content p,
  .legal-content li,
  .legal-contact dd,
  .legal-contact dt {
    font-size: var(--font-13);
    line-height: var(--leading-relaxed);
    word-break: normal;
  }
  .legal-contact div {
    grid-template-columns: 1fr;
  }
  .legal-contact dt {
    padding-bottom: var(--space-8);
  }
  .legal-contact dd {
    padding-top: var(--space-8);
  }
}
