/* Text Clarity Fixes */

/* Fix for "About Eggy Car" heading clarity */
.game-article h2 {
    /* Override any conflicting styles */
    background: linear-gradient(135deg, #2d3748 0%, #4a5568 50%, #2d3748 100%) !important;
    color: #ffffff !important;
    text-shadow: 
        0 2px 4px rgba(0, 0, 0, 0.8),
        0 1px 2px rgba(0, 0, 0, 0.6) !important;
    font-weight: 800 !important;
    letter-spacing: 0.3px !important;
    line-height: 1.4 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
    position: relative;
    z-index: 2;
}

/* Remove conflicting pseudo-elements that might cause blur */
.game-article h2::before {
    display: none !important;
}

/* Enhanced bottom border for better visual separation */
.game-article h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #5a67d8 100%);
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
    z-index: 1;
}

/* Improve text contrast and readability */
.enhanced-heading {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    background-clip: initial !important;
    color: #1a202c !important;
    text-shadow: none !important;
    font-weight: 800 !important;
    letter-spacing: 0.2px !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Fix blurry text on retina displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .game-article h2,
    .enhanced-heading {
        -webkit-font-smoothing: subpixel-antialiased !important;
        -moz-osx-font-smoothing: auto !important;
    }
}

/* Ensure proper text rendering across browsers */
.game-article h2,
.enhanced-heading,
.game-title {
    text-rendering: optimizeLegibility;
    -webkit-font-feature-settings: "kern" 1;
    -moz-font-feature-settings: "kern" 1;
    font-feature-settings: "kern" 1;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Fix for main game title if it's also blurry */
.game-title {
    background: linear-gradient(135deg, #ffffff 0%, #f0f8ff 50%, #e6f3ff 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    text-shadow: 
        0 4px 8px rgba(0, 0, 0, 0.4),
        0 2px 4px rgba(0, 0, 0, 0.3) !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* Ensure content text is clear */
.article-content {
    color: #374151 !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

.article-content h3 {
    color: #1f2937 !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Fix any other potentially blurry headings */
.about-section h2 {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: #1f2937 !important;
    background-clip: initial !important;
    color: #1f2937 !important;
    text-shadow: none !important;
    font-weight: 800 !important;
}

/* Ensure navigation text is clear */
.nav-logo span {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    font-weight: 800 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Widget headings clarity */
.widget h3 {
    background: linear-gradient(135deg, #374151 0%, #4b5563 100%) !important;
    color: white !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    font-weight: 700 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Remove any blur filters that might be applied */
* {
    -webkit-filter: none !important;
    filter: none !important;
}

/* Ensure proper backdrop-filter usage doesn't affect text */
.glass-effect {
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

.glass-effect * {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* High DPI display optimizations */
@media (min-resolution: 120dpi) {
    .game-article h2,
    .enhanced-heading,
    .game-title {
        font-weight: 900 !important;
        text-shadow: 
            0 1px 2px rgba(0, 0, 0, 0.8),
            0 0 1px rgba(0, 0, 0, 0.5) !important;
    }
}

/* Firefox specific fixes */
@-moz-document url-prefix() {
    .game-article h2,
    .enhanced-heading {
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
        font-weight: 800 !important;
    }
}

/* Safari specific fixes */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .game-article h2 {
        -webkit-font-smoothing: antialiased !important;
        font-weight: 800 !important;
    }
}