main:has(.legal-container) { padding-top: 104px; padding-bottom: 60px; }

.legal-container { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; padding: 0 20px; }

.legal-back {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: .82rem; color: var(--muted); text-decoration: none;
    margin-bottom: 32px; transition: color .2s;
}
.legal-back:hover { color: var(--accent); }
.legal-back svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; }

.legal-header {
    display: flex; align-items: center; gap: 16px;
    margin-bottom: 40px; animation: legalSlide .5s cubic-bezier(.22,.68,0,1.2) both;
}
.legal-logo {
    width: 40px; height: 40px; border-radius: 11px;
    background: linear-gradient(135deg, var(--accent), var(--accent2));
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 14px rgba(124,158,255,.30); flex-shrink: 0;
}
.legal-logo svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.legal-logo img { width: 100%; height: 100%; object-fit: contain; border-radius: 9px; }
.legal-logo.has-img { background: none; box-shadow: none; }
.legal-header-text h1 {
    font-family: 'Cormorant Garamond', serif; font-size: 1.9rem;
    font-weight: 400; letter-spacing: -.02em; line-height: 1.1; color: var(--text);
}
.legal-header-text p { font-size: .82rem; color: var(--muted); font-weight: 300; margin-top: 3px; }

@keyframes legalSlide { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }

.legal-card {
    background: var(--glass-bg); border: 1.5px solid var(--glass-border);
    border-radius: 24px; backdrop-filter: var(--blur);
    box-shadow: 0 8px 48px rgba(120,130,160,.13), inset 0 1px 0 rgba(255,255,255,.9);
    padding: 48px 52px; position: relative; overflow: hidden;
    animation: legalSlide .55s cubic-bezier(.22,.68,0,1.2) .1s both;
}
.legal-card::before {
    content: ''; position: absolute; inset: 0; border-radius: 24px;
    background: linear-gradient(135deg, var(--glass-bg) 0%, rgba(255,255,255,0) 55%);
    pointer-events: none;
}

/* Content styling for WYSIWYG output */
.legal-card h2 {
    font-family: 'Cormorant Garamond', serif; font-size: 1.35rem;
    font-weight: 400; color: var(--text); letter-spacing: -.01em; margin: 32px 0 14px;
}
.legal-card h2:first-child { margin-top: 0; }
.legal-card h3 {
    font-family: 'Cormorant Garamond', serif; font-size: 1.1rem;
    font-weight: 400; color: var(--text); margin: 24px 0 10px;
}
.legal-card p { font-size: .875rem; color: #3a3d52; font-weight: 300; line-height: 1.75; margin-bottom: 10px; }
.legal-card ul, .legal-card ol { font-size: .875rem; color: #3a3d52; font-weight: 300; line-height: 1.75; padding-left: 22px; margin: 10px 0; }
.legal-card li { margin-bottom: 4px; }
.legal-card a { color: var(--accent); font-weight: 400; text-decoration: none; }
.legal-card a:hover { text-decoration: underline; }
.legal-card strong { font-weight: 500; color: var(--text); }
.legal-card blockquote {
    border-left: 3px solid var(--accent); padding-left: 16px;
    margin: 16px 0; color: var(--muted); font-style: italic;
}
.legal-card hr {
    border: none; border-top: 1px solid rgba(180,190,220,.35);
    margin: 36px 0;
}
.legal-card table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: .85rem; }
.legal-card th, .legal-card td { border-bottom: 1px solid rgba(180,190,220,.25); padding: 9px 0; text-align: left; }
.legal-card th { color: var(--muted); font-weight: 400; width: 180px; }
.legal-card td { color: var(--text); font-weight: 300; }
.legal-card code {
    font-family: 'DM Sans', sans-serif; font-weight: 500; color: var(--accent);
    background: rgba(124,158,255,.09); border-radius: 4px; padding: 1px 5px; font-size: .82rem;
}
.legal-card img { max-width: 100%; height: auto; border-radius: 8px; margin: 12px 0; }

.legal-update {
    text-align: center; font-size: .76rem; color: var(--muted);
    margin-top: 28px; font-weight: 300;
}

@media (max-width: 600px) {
    .legal-card { padding: 28px 24px; border-radius: 18px; }
    .legal-header-text h1 { font-size: 1.5rem; }
}