:root{
    --legal-bg: #2a2a2a;
    --legal-panel: #ffffff;
    --legal-text: #111;
    --legal-muted: rgba(0,0,0,.45);
    --legal-border: rgba(0,0,0,.10);
}

body{
    margin:0;
    min-height:100vh;
    font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Header */
.legal-header{
    display:grid;
    grid-template-columns: 160px 1fr 160px;
    align-items:center;
    padding: 26px 28px 8px;
}

.legal-brand{
    display:flex;
    align-items:center;
}

.legal-logo{
    height: 42px;
    width: auto;
    display:block;
}

.legal-title{
    text-align:center;
    font-weight: 800;
    font-size: 22px;
    color: var(--legal-text);
    margin:0;
}

.legal-close-wrap{
    display:flex;
    justify-content:flex-end;
}

.legal-close-btn{
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #000;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size: 18px;
    line-height: 1;
    transition: transform .12s ease, filter .12s ease;
}

.legal-close-btn:hover{ filter: brightness(.9); }
.legal-close-btn:active{ transform: translateY(1px); }

/* Meta */
.legal-meta{
    padding: 0 28px 18px;
}

.legal-updated{
    font-size: 12px;
    font-weight: 600;
    color: var(--legal-muted);
}

.legal-divider{
    height:1px;
    background: var(--legal-border);
    margin: 0 28px;
}

/* Body */
.legal-body{
    padding: 22px 28px 28px;
}

.legal-section-title{
    font-weight: 800;
    font-size: 12px;
    letter-spacing: .7px;
    text-transform: uppercase;
    margin: 0 0 14px;
    color: #000;
}

html { scroll-behavior: smooth; }

.legal-scroll{
    overflow: auto;
    padding-right: 18px;
    scroll-behavior: smooth;
}

/* nice anchor landing */
.legal-scroll [id]{
    scroll-margin-top: 18px;
}

/* Headings + text */
.legal-h2{
    color: #000;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin: 24px 0 12px;
}

.legal-h3{
    color: #000;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
    margin: 16px 0 8px;
}

.legal-text p{
    color: rgba(0,0,0,.78);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: .25px;
    margin: 0 0 14px;
}

.legal-text strong{
    color:#000;
    font-weight: 700;
}

.legal-link{
    color: #0B57D0;
    text-decoration: underline;
    font-weight: 700;
}

/* Lists inside legal text */
.legal-list{
    margin: 0 0 14px 18px;
    padding: 0;
}
.legal-list li{
    color: rgba(0,0,0,.78);
    font-size: 14px;
    line-height: 22px;
    letter-spacing: .25px;
    margin: 6px 0;
}

/* TOC */
.toc{
    margin: 12px 0 26px;
}
.toc-title{
    color:#000;
    font-size:16px;
    font-weight:700;
    line-height:24px;
    margin-bottom: 12px;
}
.toc-list{
    display:flex;
    flex-direction: column;
    gap: 2px;
}
.toc-link{
    color: #0B57D0;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: 0.25px;
}
.toc-link:hover{
    text-decoration-thickness: 2px;
}
.toc-num{
    font-weight: 700;
    margin-right: 6px;
}

/* Mobile */
@media (max-width: 640px){
    .legal-header{
        grid-template-columns: 90px 1fr 90px;
        padding: 18px 18px 8px;
    }

    .legal-logo{
        height: 34px;
    }

    .legal-title{
        font-size: 18px;
    }

    .legal-meta{
        padding: 0 18px 14px;
    }

    .legal-body{
        padding: 18px 18px 20px;
    }

    .legal-divider{
        margin: 0 18px;
    }
}
