.legal-page { min-height: 100vh; background: var(--color-surface); color: var(--color-on-surface); }
.legal-main { width: 100%; }
.legal-hero { padding: calc(var(--spacing-4xl) + 4rem) var(--spacing-xl) var(--spacing-2xl); background: linear-gradient(135deg, var(--color-primary), #10243c); color: var(--color-on-primary); }
.legal-hero-inner, .legal-content { width: min(100% - 2rem, var(--content-max-width)); margin-inline: auto; }
.legal-hero h1 { font-family: var(--font-family-heading); font-size: var(--font-size-4xl); line-height: var(--line-height-heading); margin-bottom: var(--spacing-md); }
.legal-hero p { max-width: 52rem; }
.legal-company { margin: var(--spacing-2xl) auto; padding: var(--spacing-xl); border: 1px solid var(--color-border); border-radius: var(--border-radius-card); background: var(--color-surface-elevated); }
.legal-company-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--spacing-sm) var(--spacing-xl); margin-top: var(--spacing-md); }
.legal-section { margin: 0 0 var(--spacing-2xl); }
.legal-section h2 { font-family: var(--font-family-heading); font-size: var(--font-size-2xl); color: var(--color-primary); margin-bottom: var(--spacing-md); }
.legal-section h3 { font-size: var(--font-size-xl); margin: var(--spacing-lg) 0 var(--spacing-sm); }
.legal-section p, .legal-section li { line-height: 1.75; margin-bottom: var(--spacing-sm); overflow-wrap: anywhere; }
.legal-section ul, .legal-section ol { padding-left: 1.25rem; margin: var(--spacing-sm) 0 var(--spacing-lg); }
.legal-note { padding: var(--spacing-md); border-left: 3px solid var(--color-secondary); background: color-mix(in oklab, var(--color-surface-elevated) 75%, transparent); }
@media (max-width: 767px) {
  .legal-hero { padding: calc(var(--spacing-3xl) + 3rem) var(--spacing-md) var(--spacing-xl); }
  .legal-hero-inner, .legal-content { width: min(100% - 1.5rem, var(--content-max-width)); }
  .legal-company { padding: var(--spacing-md); }
  .legal-company-grid { grid-template-columns: 1fr; }
    .navigation-container {
        justify-content: space-around;
        padding: var(--spacing-sm);
    }
}