.legal-page {

    width: min(100% - 40px, 920px);

    margin: 150px auto 80px;

}

.legal-hero {

    margin-bottom: 26px;

    padding: 42px;

    border: 1px solid rgba(167, 139, 250, .28);

    border-radius: 28px;

    background: rgba(13, 10, 28, .82);

    box-shadow: 0 18px 55px rgba(0, 0, 0, .28);

}

.legal-eyebrow {

    color: #a78bfa;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: .12em;

}

.legal-hero h1 {

    margin: 14px 0 10px;

    font-size: clamp(34px, 5vw, 52px);

}

.legal-hero p {

    color: var(--text-secondary);

}

.legal-card {

    padding: 42px;

    border: 1px solid rgba(255, 255, 255, .09);

    border-radius: 28px;

    background: rgba(13, 10, 28, .88);

    box-shadow: 0 18px 55px rgba(0, 0, 0, .22);

}

.legal-card h2 {

    margin: 38px 0 14px;

    color: white;

    font-size: 22px;

}

.legal-card h2:first-child {

    margin-top: 0;

}

.legal-card p,
.legal-card li {

    color: var(--text-secondary);

    line-height: 1.8;

}

.legal-card p + p {

    margin-top: 14px;

}

.legal-card ul {

    display: grid;

    gap: 10px;

    margin: 16px 0 0 20px;

}

.legal-card a {

    color: #c4b5fd;

    font-weight: 700;

}

.legal-card a:hover {

    color: white;

}

@media (max-width: 600px) {

    .legal-page {

        width: min(100% - 32px, 920px);

        margin-top: 112px;

    }

    .legal-hero,
    .legal-card {

        padding: 28px 22px;

        border-radius: 22px;

    }

}