/* Privacy Policy and Terms and Conditions pages.
   The policy text is kept exactly as written (including its own <h1>/<h2>
   tags), so the section headings are styled here rather than in the markup. */

.legalHero {
    padding-bottom: 5rem;
}

.legalHero .heroTxt h1 {
    font-size: 3.5rem;
}

.terms-content {
    background: var(--white);
    padding: 5rem 0 6rem;
}

.terms-content .content {
    max-width: 62rem;
    margin: 0 auto;
}

.terms-content .privacy-policy,
.terms-content .terms-conditions {
    color: #1c1c1c;
    font-size: 1.0625rem;
    line-height: 1.8;
}

.terms-content h2 {
    font-size: 2rem;
    font-weight: 600;
    color: var(--theme-color);
    margin-bottom: 0.5rem;
}

/* Section headings (1. Information We Collect, ...) */
.terms-content h1 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.3;
    text-transform: none;
    color: var(--theme-color);
    margin: 2.5rem 0 0;
    padding-bottom: 0.6rem;
    border-bottom: 2px solid var(--secondary-color);
}

.terms-content p {
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.8;
    margin-bottom: 0.75rem;
}

.terms-content p a {
    color: var(--accent-color);
    text-decoration: underline;
}

.terms-content p a:hover {
    color: var(--secondary-color);
}

@media (max-width: 767px) {
    .legalHero .heroTxt h1 {
        font-size: 2.5rem;
    }

    .terms-content {
        padding: 3rem 0 4rem;
    }

    .terms-content h1 {
        font-size: 1.25rem;
        margin-top: 2rem;
    }
}