/* Critical fixes for mobile devices and cross-browser compatibility */

/* Force hardware acceleration for specific elements only */
.main-cta-btn,
.stat-item,
.step-item,
.testimonial-item {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
}

/* Fix for iOS Safari viewport issues */
@supports (-webkit-touch-callout: none) {
    html {
        height: -webkit-fill-available;
    }
    
    body {
        min-height: -webkit-fill-available;
    }
}

/* Fix for Android Chrome address bar - simplified */
.header .container {
    min-height: auto;
}

/* Ensure fonts load properly */
@font-face {
    font-family: 'Cairo-Fallback';
    src: local('Segoe UI'), local('Roboto'), local('Arial');
    font-display: swap;
}

/* Critical CSS for immediate rendering */
.main-title,
.section-title {
    font-family: 'Cairo', 'Cairo-Fallback', sans-serif;
    font-display: swap;
}

/* Fix for slow 3G connections */
.diamond-img,
.ff-logo img,
.game-option img {
    background-color: rgba(255, 215, 0, 0.1);
    border-radius: 8px;
}

/* Ensure buttons work on all touch devices */
button,
.game-option,
.main-cta-btn {
    -webkit-tap-highlight-color: rgba(255, 215, 0, 0.3);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}

/* Fix for older browsers */
.stats-grid,
.steps-slider,
.testimonials-grid,
.games-grid {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

/* Ensure proper spacing on all devices */
@media (max-width: 480px) {
    .container {
        padding: 0 10px;
        width: 100%;
        max-width: 100%;
    }
    
    * {
        max-width: 100%;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

/* Fix for very old Android browsers */
.main-cta-btn {
    background: #ffd700;
    background: -webkit-linear-gradient(45deg, #ffd700, #ffed4e);
    background: -moz-linear-gradient(45deg, #ffd700, #ffed4e);
    background: -o-linear-gradient(45deg, #ffd700, #ffed4e);
    background: linear-gradient(45deg, #ffd700, #ffed4e);
}

/* Ensure animations work smoothly */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Fix for Internet Explorer (if needed) */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .stats-grid,
    .steps-slider,
    .testimonials-grid {
        display: -ms-flexbox;
    }
}

/* Ensure proper text rendering */
body,
.main-title,
.section-title,
.description {
    text-rendering: optimizeLegibility;
    -webkit-font-feature-settings: "kern" 1;
    -moz-font-feature-settings: "kern" 1;
    -o-font-feature-settings: "kern" 1;
    font-feature-settings: "kern" 1;
}

/* Fix for Samsung Internet Browser */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .main-cta-btn {
        -webkit-appearance: none;
        appearance: none;
    }
}

/* Emergency fallback styles - simplified */
.no-css-fallback {
    font-family: Arial, sans-serif;
    background: #000;
    color: #fff;
    padding: 20px;
    text-align: center;
}

/* Ensure critical content is always visible */
.main-title,
.main-cta-btn,
.section-title {
    position: relative;
    z-index: 10;
}