/* Terms and Conditions page styles */

.terms-main {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
    background-color: var(--surface-primary);
}

.terms-container {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
    padding-inline: var(--space-5);
    padding-block: var(--space-8);
}

.terms-hero {
    margin-block-end: var(--space-7);
    text-align: left;
}

.terms-effective-date {
    font-size: var(--text-caption);
    line-height: var(--leading-caption);
    color: var(--color-slate);
    margin-block-end: var(--space-3);
    letter-spacing: 0.02em;
}

.terms-title {
    font-size: var(--text-h1);
    line-height: var(--leading-h1);
    margin-block-end: var(--space-4);
    color: var(--color-navy);
}

.terms-lead {
    font-size: var(--text-body);
    line-height: var(--leading-body);
    color: var(--color-slate);
    max-width: 65ch;
    margin-block-end: 0;
}

.terms-section {
    margin-block-end: var(--space-7);
    padding-block-end: var(--space-6);
    border-block-end: var(--border-sand);
}

.terms-section:last-child {
    border-block-end: none;
    margin-block-end: 0;
    padding-block-end: 0;
}

.terms-section h2 {
    font-size: var(--text-h2);
    line-height: var(--leading-h2);
    margin-block-end: var(--space-4);
    color: var(--color-navy);
}

.terms-section h3 {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: var(--space-3);
    color: var(--color-navy);
}

.terms-section p {
    max-width: 65ch;
    margin-block-end: var(--space-4);
    color: var(--color-navy);
}

.terms-list,
.terms-contact-list {
    max-width: 65ch;
    margin-block-end: var(--space-4);
    padding-inline-start: var(--space-5);
    list-style-position: outside;
    color: var(--color-navy);
}

.terms-list li,
.terms-contact-list li {
    margin-block-end: var(--space-2);
    line-height: var(--leading-body);
}

.terms-list li:last-child,
.terms-contact-list li:last-child {
    margin-block-end: 0;
}

.terms-contact-list a {
    color: var(--color-teal);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.terms-contact-list a:hover {
    color: var(--color-gold);
    text-decoration: underline;
    text-decoration-color: var(--color-gold);
    text-underline-offset: 3px;
}

@media (max-width: 768px) {
    .terms-container {
        padding-inline: var(--space-4);
        padding-block: var(--space-6);
    }

    .terms-hero {
        margin-block-end: var(--space-6);
    }

    .terms-title {
        font-size: var(--text-h1);
    }

    .terms-section {
        margin-block-end: var(--space-6);
        padding-block-end: var(--space-5);
    }

    .terms-section h2 {
        font-size: var(--text-h2);
    }

    .terms-section h3 {
        font-size: var(--text-h3);
    }

    .terms-section p,
    .terms-list,
    .terms-contact-list {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .terms-container {
        padding-inline: var(--space-3);
        padding-block: var(--space-5);
    }

    .terms-title {
        font-size: 1.75rem;
        line-height: 1.2;
    }

    .terms-lead {
        font-size: var(--text-small);
        line-height: var(--leading-small);
    }

    .terms-section h2 {
        font-size: 1.5rem;
        line-height: 1.3;
    }

    .terms-section h3 {
        font-size: 1.25rem;
        line-height: 1.4;
    }

    .terms-section p,
    .terms-list li,
    .terms-contact-list li {
        font-size: var(--text-small);
        line-height: var(--leading-small);
    }
}
