/* ========================================Terms & Conditions======================================== */

.terms-section {
    background-color: var(--color-ivory);
    width: 100%;
    padding: 80px 40px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.terms-section__container {
    width: 100%;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
}

.terms-section__title {
    width: 100%;
    margin: 0;
    font-family: var(--font-family-primary);
    font-size: var(--text-h3);
    font-weight: var(--font-semibold);
    line-height: var(--leading-h3);
    color: var(--grey-950);
}

.terms-section__intro {
    width: 100%;
    margin: 0;
    font-family: var(--font-family-primary);
    font-size: var(--text-body-lg);
    font-weight: var(--font-regular);
    line-height: var(--leading-body-lg);
    color: var(--grey-950);
}

.terms-section__definitions {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.terms-definition {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.terms-definition__term {
    flex: 0 0 auto;
    font-family: var(--font-family-primary);
    font-size: var(--text-body);
    font-weight: var(--font-semibold);
    line-height: var(--leading-body);
    color: var(--grey-950);
}

.terms-definition__description {
    flex: 1;
    font-family: var(--font-family-primary);
    font-size: var(--text-body);
    font-weight: var(--font-regular);
    line-height: var(--leading-body);
    color: var(--grey-900);
}


/* ========================================Terms Articles======================================== */

.terms-articles {
    width: 100%;
    padding: 80px 40px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}


.terms-articles__container {
    width: 100%;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 64px;
}

.terms-article {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.terms-article__title {
    width: 100%;
    margin: 0;
    font-family: var(--font-family-primary);
    font-size: var(--text-h6);
    font-weight: var(--font-semibold);
    line-height: var(--leading-h6);
    color: var(--grey-950);
}

.terms-article__paragraph {
    width: 100%;
    margin: 0;
    font-family: var(--font-family-primary);
    font-size: var(--text-body);
    font-weight: var(--font-regular);
    line-height: var(--leading-body);
    color: var(--grey-900);
    text-align: justify;
}



/* ========================================Responsive======================================== */

@media (max-width: 768px) {

    .terms-section {
        padding: 64px 24px;
    }

    .terms-section__container {
        gap: 32px;
    }

    .terms-section__title {
        font-size: 28px;
        line-height: 36px;
    }

    .terms-section__intro {
        font-size: 16px;
        line-height: 24px;
    }

    .terms-definition {
        flex-direction: column;
        gap: 4px;
    }

    .terms-definition__term {
        font-size: 18px;
        line-height: 24px;
    }

    .terms-definition__description {
        font-size: 16px;
        line-height: 24px;
    }


    /* Terms Articles */

    .terms-articles {
        padding: 64px 24px;
    }

    .terms-articles__container {
        gap: 48px;
    }

    .terms-article {
        gap: 28px;
    }

    .terms-article__title {
        font-size: 28px;
        line-height: 36px;
    }

    .terms-article__paragraph {
        font-size: 16px;
        line-height: 24px;
        text-align: left;
    }
}


/* ========================================Small Mobile======================================== */

@media (max-width: 480px) {

    .terms-section {
        padding: 48px 20px;
    }

    .terms-section__container {
        gap: 28px;
    }

    .terms-section__title {
        font-size: 26px;
        line-height: 32px;
    }

    .terms-section__intro {
        font-size: 16px;
        line-height: 24px;
    }

    .terms-section__definitions {
        gap: 18px;
    }

    .terms-definition__term {
        font-size: 17px;
        line-height: 24px;
    }

    .terms-definition__description {
        font-size: 16px;
        line-height: 24px;
    }


    /* Terms Articles */

    .terms-articles {
        padding: 48px 20px;
    }

    .terms-articles__container {
        gap: 40px;
    }

    .terms-article {
        gap: 24px;
    }

    .terms-article__title {
        font-size: 26px;
        line-height: 32px;
    }

    .terms-article__paragraph {
        font-size: 16px;
        line-height: 24px;
    }
}