/* Fix for about-columns text color in mobile view */

/* Ensure text in about-columns has the same color and brightness on mobile as on desktop */
@media (max-width: 768px) {
    /* Target the animate-text paragraphs in the about section */
    .about-text-animated .animate-text {
        color: #ffffff !important; /* Bright white text */
        opacity: 1 !important; /* Full opacity */
    }
    
    /* Ensure highlighted text maintains the proper styling */
    .about-text-animated .highlight-text {
        color: #fecf6a !important; /* beOnd signature yellow/gold color */
        font-weight: 600 !important;
        text-shadow: 0 0 5px rgba(254, 207, 106, 0.3) !important;
    }
    
    /* Enhance visibility of all text in the about cards */
    .about-text-animated {
        color: #ffffff !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
    }
    
    /* Ensure the highlight "O" maintains proper styling */
    .highlight {
        color: #fecf6a !important; /* beOnd signature yellow/gold color */
    }
}