/* Root */
.icon-card-section {}

/* Squiggly Designs */
.icon-card-section__inner {
    position: relative;
    z-index: 0;
}

.icon-card-section__squiggly-top {
    position: absolute;
    z-index: -1;
    width: 138px;
    height: auto;
    top: -39px;
    left: -57px;
    transform: rotate(-117.357deg);
}

.icon-card-section__squiggly-bottom {
    position: absolute;
    z-index: -1;
    width: 119px;
    height: auto;
    top: 553px;
    right: -11px;
    transform: rotate(91.242deg);
}

.icons-cards__curve-bottom {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: -1px;
    left: 0;
    z-index: -1;
}

/* Grid/Row - Home */
.icon-card-section--homepage {   
    padding: 55px 0;
    background: #F1FCFA;
    position: relative;
    z-index: 1;    
}

.icon-card-section--homepage .icon-card-row {
    --bs-gutter-y: 20px;
}

/* Icon Card */
.icon-card-link {
    display: block;
    height: 100%;
    background: none;
}

.icon-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    justify-content: space-between;
    height: 100%;
    border: 1px solid #F0F0F0;
    background: #fff;
    padding: 20px 15px;
    border-radius: 20px;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.10);
}

.bg-green .icon-card {
    background: #EBF7F5;
    border-color: #ACDBD1;
}

.bg-purple .icon-card {
    background: #EFEDF5;
    border-color: #D0CFE7;
}

.icon-card__image {
    width: 35px;
    margin: 0 auto;
}

.icon-card__details {
    padding-top: 15px;
    text-align: center;
}

.icon-card__bottom {
    text-align: center;
    margin-top: 10px;
}

.icon-card__title {
    font-size: 18px;
}

.bg-green .icon-card__title {
    color: #00807F;
}

.icon-card__description {
    color: #000;
    font-size: 16px;
    font-weight: 300;
}

:where(.bg-green, .bg-gradient) .icon-card__btn {
    color: #4D47B3;
}

:where(.bg-white, .bg-purple) .icon-card__btn {
    color: #18705D;
}

.icon-card__btn{
    text-transform: inherit;
}

@media (min-width: 768px) {
    /* Squiggly Designs */
    .icon-card-section__squiggly-top {
        width: 205px;
        top: -71px;
        left: -49px;
    }

    .icon-card__image {
        width: 65px;
        margin: 0 auto;
    }

    .icon-card-section__squiggly-bottom {
        top: auto;
        bottom: -136px;
    }

    .icon-card-section__inner:has(.fx-slider-slides.slick-initialized) .icon-card-section__squiggly-bottom {
        bottom: -92px;
    }
}


@media (min-width: 1024px){

    .icon-card__image {
        width: 94px;
        margin: 0 auto;
    }

}

@media (min-width: 1200px) {
    /* Root - Home */
    .icon-card-section--homepage {   
        padding: 150px 0 50px;     
    }

    /* Icon Card */
    .icon-card {
        padding: 30px 35px;
        transition: border-color 0.3s;
    }

    .icon-card__details {
        padding-top: 25px;
    }

    .icon-card__title {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .icon-card__bottom {
        margin-top: 16px;
    }

    .icon-card__description {
        font-size: 18px;
    }

    .icon-card__image {
        width:100px;
        margin: 0 auto;
    }

    .icon-card-link .icon-card,
    .icon-card-link .icon-card__image img{
        transition: all 0.3s ease-in-out;
    }

    .icon-card-link:hover .icon-card {
        border-color: #00807F;
        box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.20);
    }
    
    .icon-card-link:hover .icon-card__image img{
        transform: scale(1.1);
    }

    /* Squiggly Designs */
    .icon-card-section__squiggly-top {
        width: 321px;
        top: -139px;
        left: -24px;
    }

    .icon-card-section__squiggly-bottom {
        width: 186px;
        bottom: -204px;
        right: 68px;
    }

    .icon-card-section__inner:has(.fx-slider-slides.slick-initialized) .icon-card-section__squiggly-bottom {
        bottom: -166px;
    }
}

@media (min-width: 1600px) {
    /* Icon Card */
    .icon-card {
        padding: 75px;
    }

    .icon-card__image {
        width: 100px;
    }

    .icon-card__details {
        padding-top: 35px;
    }

    .icon-card__title {
        font-size: 25px;
    }

    .icon-card-section__squiggly-bottom {
        bottom: -217px;
        right: 65px;
    }
}