.legal-page { min-height: 60vh; padding: var(--spacing-3xl) var(--spacing-xl) var(--spacing-3xl) var(--spacing-xl); background: var(--color-surface); }
.legal-container { width: min(100%, 920px); margin: 0 auto; overflow-wrap: anywhere; }
.legal-header { margin-bottom: var(--spacing-2xl); padding-bottom: var(--spacing-xl); border-bottom: 1px solid var(--color-border); }
.legal-header .hero-title { margin-bottom: var(--spacing-md); color: var(--color-primary); }
.legal-updated { color: var(--color-on-surface-secondary); font-size: var(--font-size-sm); }
.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-lg); background: var(--color-surface-elevated); box-shadow: var(--shadow-level-1); }
.legal-company-card h2 { margin-bottom: var(--spacing-lg); color: var(--color-primary); }
.legal-company-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--spacing-md) var(--spacing-xl); }
.legal-company-item { overflow-wrap: anywhere; }
.legal-company-item strong { display: block; margin-bottom: 0.2rem; color: var(--color-secondary); font-size: var(--font-size-xs); letter-spacing: 0.06em; text-transform: uppercase; }
.legal-section { margin-bottom: var(--spacing-2xl); }
.legal-section h2 { margin-bottom: var(--spacing-md); color: var(--color-primary); font-size: var(--font-size-2xl); }
.legal-section h3 { margin: var(--spacing-lg) 0 var(--spacing-sm); color: var(--color-primary); font-size: var(--font-size-xl); }
.legal-section p, .legal-section li { color: var(--color-on-surface-secondary); }
.legal-section ul, .legal-section ol { padding: 0 0 0 1.35rem; }
.legal-section li + li { margin-top: var(--spacing-xs); }
.legal-page a, .legal-page a:visited { color: var(--color-primary); text-decoration: none; font-weight: 600; }
.legal-page a:hover { color: var(--color-secondary); text-decoration: none; }
.legal-page a:focus-visible, .legal-page a:active { color: var(--color-accent); text-decoration: none; }
.legal-back { margin-top: var(--spacing-2xl); }
@media (max-width: 640px) { .legal-page { padding: var(--spacing-2xl) var(--spacing-md) var(--spacing-2xl) var(--spacing-md); } .legal-company-grid { grid-template-columns: 1fr; } }