/* Start - Banner Section on Homepage */
.banner {
    opacity: 0;
    animation: fadeIn 1s forwards; /* Animation for the entire banner */
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.block {
    transform: translateY(20px);
    opacity: 0;
    animation: slideUp 0.5s forwards 0.5s; /* Delay for the block */
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.btn-container {
    transform: translateY(10px);
    opacity: 0;
    animation: slideUp 0.5s forwards 1s; /* Delay for the button */
}
/* End - Banner Section on Homepage */

/* Start - Services Section on Homepage */
.features {
    background-color: #f8f9fa; /* Light background for the section */
    padding: 50px 0; /* Spacing around the section */
}

.feature-item {
    background: white; /* Background color for each feature item */
    border-radius: 8px; /* Rounded corners */
    padding: 20px; /* Inner spacing */
    text-align: center; /* Center text */
    transition: all 0.3s ease; /* Smooth transition for hover effects */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}

.feature-item:hover {
    transform: scale(1.05); /* Slightly enlarge on hover */
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2); /* Enhanced shadow */
}

.feature-item h4 {
    color: #333; /* Dark color for headings */
    transition: color 0.3s ease; /* Smooth transition for text color */
}

.feature-item:hover h4 {
    color: #007bff; /* Change heading color on hover */
}

.feature-item span {
    display: block; /* Make span a block element */
    font-weight: bold; /* Bold font for emphasis */
    margin-bottom: 10px; /* Space below span */
}

.feature-icon {
    font-size: 40px; /* Larger icon size */
    color: #007bff; /* Icon color */
    transition: color 0.3s ease; /* Smooth transition for icon color */
}

.feature-item:hover .feature-icon {
    color: #ff5733; /* Change icon color on hover */
}
/* End - Services Section on Homepage */