.hero {
    background: linear-gradient(135deg, #e9f7ef, #ffffff);
    position: relative;
    overflow: hidden;
}

.food-anim {
    position: absolute;
    font-size: 64px;
    opacity: .15;
    animation: float 6s ease-in-out infinite;
}

.food-1 {
    top: 10%;
    left: 5%;
}

.food-2 {
    top: 60%;
    right: 8%;
    animation-delay: 2s;
}

.food-3 {
    bottom: 5%;
    left: 40%;
    animation-delay: 4s;
}

@keyframes float {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

    100% {
        transform: translateY(0);
    }
}

.icon-circle {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e9f7ef;
    font-size: 28px;
}

.card-hover:hover {
    transform: translateY(-4px);
    transition: .2s;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
}



.hero {
    background: linear-gradient(135deg, #e9f7ef, #ffffff);
    position: relative;
    overflow: hidden;
}

.food-anim {
    position: absolute;
    font-size: 64px;
    opacity: .15;
    animation: float 6s ease-in-out infinite;
}

.food-1 {
    top: 10%;
    left: 5%;
}

.food-2 {
    top: 60%;
    right: 8%;
    animation-delay: 2s;
}

.food-3 {
    bottom: 5%;
    left: 40%;
    animation-delay: 4s;
}

@keyframes float {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

    100% {
        transform: translateY(0);
    }
}

.icon-circle {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e9f7ef;
    font-size: 28px;
}

.card-hover:hover {
    transform: translateY(-4px);
    transition: .2s;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
}