.legal-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 3rem;
    padding-bottom: 6rem;
    min-height: calc(100dvh - 100px);

    & .legal-contain {
        width: 100%;
        max-width: 720px;
        color: var(--white);
    }

    & .legal-header {
        margin-bottom: 3rem;
    }

    & .legal-heading {
        font-family: iv, serif;
        font-weight: 300;
        font-size: 68px;
        line-height: 1;
        letter-spacing: -0.06em;
        color: var(--white);
        margin-bottom: 0.75rem;
    }

    & .legal-updated {
        font-family: nhg-tx, sans-serif;
        font-size: var(--reg);
        color: var(--grey-text);
        letter-spacing: var(--l-s-sm);
        margin-bottom: 0;
    }

    & section {
        margin-bottom: 2rem;

        & h2 {
            font-family: iv, serif;
            font-weight: 300;
            font-size: 32px;
            line-height: 1.1;
            letter-spacing: -0.04em;
            color: var(--white);
            margin-bottom: 1rem;
            margin-top: 0;
        }

        & p {
            font-family: nhg-tx, sans-serif;
            font-weight: 400;
            font-size: var(--reg);
            line-height: 1.65;
            letter-spacing: var(--l-s-sm);
            color: var(--white);
            margin-bottom: 1rem;
        }

        & p:last-child {
            margin-bottom: 0;
        }

        & strong {
            font-weight: 500;
            color: var(--white);
        }
    }

    & .legal-link {
        color: var(--link);
        text-decoration: underline;
        text-underline-offset: 0.2em;
        text-decoration-thickness: 1px;

        &:hover {
            text-decoration-thickness: 2px;
        }
    }
}

@media (max-width: 768px) {
    .legal-page {
        padding-top: 2rem;
        padding-bottom: 4rem;

        & .legal-heading {
            font-size: 52px;
        }

        & section h2 {
            font-size: 26px;
        }
    }
}

@media (max-width: 425px) {
    .legal-page {
        & .legal-heading {
            font-size: 44px;
        }

        & .legal-header {
            margin-bottom: 2rem;
        }
    }
}
