.legal-page-body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  background: var(--color-surface);
}

.legal-page-body > navigation-wrapper,
.legal-page-body > footer-wrapper { width: 100%; }

.legal-main {
  flex: 1 0 auto;
  width: 100%;
  background: var(--color-surface);
}

.legal-container {
  width: min(calc(100% - 2 * var(--spacing-xl)), 920px);
  margin: 0 auto;
}

.legal-hero {
  padding: var(--spacing-3xl) var(--spacing-xl) var(--spacing-2xl) var(--spacing-xl);
  color: var(--color-on-primary);
  background: var(--color-primary);
}

.legal-hero h1 {
  margin: 0 0 var(--spacing-sm);
  font-family: var(--font-family-heading);
  font-size: var(--font-size-4xl);
  line-height: var(--line-height-heading);
}

.legal-hero p { margin: 0; color: color-mix(in oklab, white 84%, transparent); }
.legal-eyebrow { margin-bottom: var(--spacing-sm) !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }

.legal-layout {
  padding-top: var(--spacing-2xl);
  padding-right: 0;
  padding-bottom: var(--spacing-3xl);
  padding-left: 0;
}

.legal-company-card {
  margin-bottom: var(--spacing-2xl);
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-xl);
  background: var(--color-surface-elevated);
}

.legal-company-card h2,
.legal-article h2 {
  margin: 0 0 var(--spacing-md);
  color: var(--color-primary);
  font-family: var(--font-family-heading);
  font-size: var(--font-size-2xl);
  line-height: var(--line-height-heading);
}

.legal-company-list { margin: 0; }
.legal-company-list > div {
  display: grid;
  grid-template-columns: minmax(150px, 0.35fr) 1fr;
  gap: var(--spacing-md);
  padding: var(--spacing-sm) 0 var(--spacing-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.legal-company-list > div:last-child { border-bottom: 0; }
.legal-company-list dt { font-weight: 700; }
.legal-company-list dd { margin: 0; overflow-wrap: anywhere; }

.legal-article {
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-xl) var(--spacing-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-xl);
  background: white;
  box-shadow: var(--shadow-level-1);
}

.legal-article section {
  padding: var(--spacing-lg) 0 var(--spacing-lg) 0;
  border-bottom: 1px solid var(--color-border);
}
.legal-article section:first-child { padding-top: 0; }
.legal-article section:last-child { padding-bottom: 0; border-bottom: 0; }
.legal-article p, .legal-article li { overflow-wrap: anywhere; }
.legal-article p { margin: 0; color: var(--color-on-surface-secondary); }
.legal-article a,
.legal-article a:visited,
.legal-company-card a,
.legal-company-card a:visited { color: var(--color-primary); text-decoration: none; font-weight: 600; }
.legal-article a:hover,
.legal-company-card a:hover { color: var(--color-secondary); text-decoration: none; }
.legal-back-link { margin: var(--spacing-xl) 0 0; }

@media (max-width: 700px) {
  .legal-container { width: min(calc(100% - 2 * var(--spacing-md)), 920px); }
  .legal-hero { padding: var(--spacing-2xl) var(--spacing-md) var(--spacing-xl) var(--spacing-md); }
  .legal-layout { padding-top: var(--spacing-xl); padding-right: 0; padding-bottom: var(--spacing-2xl); padding-left: 0; }
  .legal-company-card, .legal-article { padding: var(--spacing-lg) var(--spacing-md) var(--spacing-lg) var(--spacing-md); }
  .legal-company-list > div { grid-template-columns: 1fr; gap: var(--spacing-xs); }
}