/* Menu, Cards and Grid Styles */

#hero-intro .group:hover img {
    transform: scale(1.05);
}

#hero-intro .border-l-2 {
    border-color: var(--primary-pepper);
}

.menu-item {
    outline: none;
    user-select: none;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-left: 3px solid transparent;
    padding-left: 0.5rem;
    box-sizing: border-box;
    display: block;
}

.menu-item span {
    transition: all 0.4s ease;
}

.menu-item.active-menu-item {
    border-left-color: var(--primary-pepper);
    padding-left: 1.25rem;
    transform: translateX(5px);
}

.menu-item.active-menu-item span {
    color: var(--primary-pepper);
    font-weight: 700;
}

/* Feature Cards */
.feature-card {
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    border-bottom: 2px solid transparent;
}

.feature-card:hover {
    transform: translateY(-5px);
    border-bottom-color: var(--primary-pepper);
}

.feature-avatar {
    width: 6.25rem;
    height: 4.1875rem;
    object-fit: cover;
    filter: brightness(0.9);
}

.feature-card:hover .feature-avatar {
    filter: brightness(1.1);
}