/*
 * Service Card Read More Button Enhancement
 * Creates modern, attractive buttons for Read More links
 * Version: 1.4 - Maximum visibility with pure white text and completely stable glow effect
 */

.service-box {
    position: relative;
    padding-bottom: 25px; /* Space at bottom for button */
    min-height: 340px; /* Minimum height to accommodate content */
}

.service-box .read-more {
    display: block;
    width: 100%;
    max-width: 200px;
    margin: 15px auto 0;
    background: #0046be; /* Deeper blue for better contrast with white text */
    color: #ffffff !important; /* Force pure white text */
    padding: 12px 20px;
    border-radius: 5px;
    font-size: 1.05rem; /* Slightly larger text */
    font-weight: 700; /* Bolder text for better visibility */
    letter-spacing: 0.5px; /* Improve text readability */
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Only transition color and glow */
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Stronger shadow for better definition */
    border: none;
    text-align: center;
    position: relative;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); /* Subtle text shadow for improved readability */
    transform: none !important; /* Ensure no transform is applied */
}

.service-box .read-more i {
    margin-left: 8px;
    color: #ffffff !important; /* Ensure arrow is pure white */
    display: inline-block; /* Required for transform to work properly */
}

.service-box .read-more:hover {
    background: #0052da; /* Slightly brighter blue for hover state */
    box-shadow: 0 0 15px rgba(0, 70, 190, 0.7), 0 0 25px rgba(0, 70, 230, 0.4); /* Glow effect */
    color: #ffffff !important; /* Maintain pure white on hover */
    transform: none !important; /* Explicitly prevent any movement */
}

.service-box .read-more:hover i {
    color: #ffffff !important; /* Reinforce white color for arrow on hover */
    animation: none; /* Remove bounce animation to prevent movement */
    margin-left: 8px; /* Keep the same margin as non-hover state */
}

.service-box .read-more:active {
    background: #003698; /* Slightly darker on click */
    box-shadow: 0 0 8px rgba(0, 70, 190, 0.9); /* Reduced glow for active state */
    color: #ffffff !important; /* Maintain pure white on active state */
    transform: none !important; /* Explicitly prevent any movement */
}