section.infoGrid {
    @media (max-width: 1024px) {
        padding: 70px 30px !important;
    }

    @media (max-width: 767px) {
        padding: 50px 20px !important;
    }

    .info-grid-contents {
        flex-direction: column;
        justify-content: center;
        text-align: center;

        .info-grid-header {
            margin-bottom: 20px;

            h2 {
                margin-bottom: 20px;
            }

            .info-grid-description {
                p {
                    margin-bottom: 15px;
                }
            }
        }

        .info-grid-cards {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 30px;

            &.sub-three {
                .info-card {
                    margin-left: 50%;

                    @media (max-width: 1440px) {
                        margin-left: unset;
                    }

                    &:last-of-type {
                        @media (min-width: 992px) {
                            margin-left: 50%;
                        }
                    }
                }
            }

            &.three-col {
                grid-template-columns: repeat(3, 1fr);
            }

            &.five-item {
                grid-template-columns: repeat(6, 1fr);
                grid-template-rows: repeat(2, 1fr);

                & > :nth-child(1) {
                    grid-area: 1 / 1 / 2 / 3;
                }
                & > :nth-child(2) {
                    grid-area: 1 / 3 / 2 / 5;
                }
                & > :nth-child(3) {
                    grid-area: 1 / 5 / 2 / 7;
                }
                & > :nth-child(4) {
                    grid-area: 2 / 2 / 3 / 4;
                }
                & > :nth-child(5) {
                    grid-area: 2 / 4 / 3 / 6;
                }
            }

            &.two-col {
                grid-template-columns: repeat(2, 1fr);
            }

            @media (max-width: 1440px) {
                grid-template-columns: repeat(2, 1fr);
            }

            @media (max-width: 991px) {
                display: flex;
                flex-direction: column;
            }

            .info-card {
                display: flex;
                width: 100%;
                gap: 20px;
                flex-direction: column;
                align-items: center;
                padding: 20px;
                background-color: #f8fbea;
                border-radius: 25px;

                .info-card-description {
                    & > *:not(:first-child) {
                        margin-top: 20px;
                    }
                }
            }
        }

        .info-grid-sub-text {
            margin-top: 30px;
        }
    }
}

section.infoGrid.block-acne-and-scarring.instance-4
    .info-grid-cards
    .info-card:nth-of-type(1)
    h3.info-card-title {
    width: 100%;
    max-width: 79%;
}

section.infoGrid.block-acne-and-scarring.instance-4
    .info-grid-cards
    .info-card:nth-of-type(4)
    h3.info-card-title {
    width: 100%;
    max-width: 80%;
}

section.infoGrid.block-acne-and-scarring.instance-6 h2.info-grid-title {
    width: 100%;
    max-width: 99%;
    position: relative;
    margin: auto;
    margin-bottom: 20px;
}

section.infoGrid.block-acne-and-scarring.instance-6
    .info-grid-cards
    .info-card:nth-of-type(4)
    h3.info-card-title {
    width: 100%;
    max-width: 80%;
}
