/* Topics Rules */

.topics-container {
    padding: 18px 0;
    background-color: var(--glue-grey-50);
}

.topics-container .topics-container__wrapper {
    display: flex;
    flex-direction: column;
}

.topics-container .topics-container__wrapper .heading {
    margin-bottom: 20px;
}

.topics-container .topics-container__wrapper .topic-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 21px;
}

.topics-container .topics-container__wrapper .topic-list ul li {
    background-color: white;
    border: 1px solid var(--glue-grey-300);
    border-radius: 8px;
}

.topics-container .topics-container__wrapper .topic-list ul li a {
    display: block;
    padding: 6px 16px;
    text-decoration: none;
    color: var(--glue-grey-700);
}

@media (min-width: 1024px) {
    .topics-container {
        padding: 0;
    }

    .topics-container .topics-container__wrapper {
        flex-direction: row;
        gap: 70px;
        padding: 32px 0px;
    }

    .topics-container .topics-container__wrapper .heading {
        flex-shrink: 0;
        margin: 0;
    }
}

/* Blocks Rules */

.blocks-container {

    .blocks-container__block-item {

        .glue-button {
            border-radius: 4px;
            border: 1px solid var(--grey-300, #DADCE0);
        }

        .blocks-container__cta {
            display: flex;
            flex-direction: column;

            >h3 {
                color: #000;
                font-family: Google Sans;
                font-size: 28px;
                font-style: normal;
                line-height: 36px; /* 128.571% */
                letter-spacing: -1px;
            }

            .glue-button {
                display: none;
            }
        }

        .glue-carousel {
            .glue-card {
                display: flex !important;
                flex-direction: column;
                justify-content: space-between;
                height: 100%;
                box-shadow: unset;
                border-radius: unset;

                &:focus {
                    outline: var(--glue-blue-500) auto 1px;
                }
    
                > img {
                    border-radius: 8px;
                    background: var(--grey-300, #DADCE0);
                    margin-top: 14%;
                }

                .post-title {
                    color: var(--grey-900, #202124);
                    font-family: Google Sans;
                    font-size: 20px;
                    font-style: normal;
                    font-weight: 400;
                    line-height: 25px; /* 125% */
                    margin-bottom: auto;
                    margin-top: 12px;
                }

                .glue-eyebrow {
                    color: var(--blue-900, #174EA6);
                    font-family: Google Sans;
                    font-size: 14px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: 20px; /* 142.857% */
                    letter-spacing: 1.25px;
                    text-transform: uppercase;
                }
            }
        }

        @media (min-width: 1024px) {

            .blocks-container__cta {

                .glue-button {
                    display: inline-flex;
                }
            }

            .blocks-container__cta--mobile {
                display: none;
            }
        }
    }
}


/* Follow Rules */

.follow-container .follow-block {
    background-color: var(--blue-100, #D2E3FC);
    padding: 3.5rem 2.5rem;
}

.follow-container .follow-block__wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 2.1875rem;
    column-gap: 1.5rem;
}

.follow-container .follow-block__wrapper .follow-block__title {
    flex: 0 0 100%;
    text-align: center;
}

.follow-container .follow-block__wrapper .follow-block__item {
    display: flex;
    padding: 17px;
    flex-direction: column;
    width: 100%;
    border-radius: 8px;
    border: 1px solid var(--grey-300, #DADCE0);
    background: var(--grey-white, #FFF);
}

.follow-container .follow-block__wrapper .follow-block__item img {
    width: 2.375rem;
    height: 2.375rem;
}

.follow-container .follow-block__wrapper .follow-block__item .glue-button {
    border-radius: 4px;
    margin-bottom: 0;
    margin-top: auto;
    padding: 0.5rem 1.5rem;
}

@media screen and (min-width: 700px) {
    .follow-container .follow-block__wrapper .follow-block__item {
        width: 21.375rem;
    }
}


.cta-block .cta-block__container {
    background-color: var(--blue-100, #D2E3FC);
    padding: 3.5rem 2.5rem;
}

.cta-block__container .cta-block__wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 2.1875rem;
    column-gap: 1.5rem;
}

.cta-block__container .cta-block__wrapper  .glue-button {
    border-radius: 4px;
}