/* Critical font loading CSS - add to head for immediate font fallback */
/* This should be loaded before the main CSS to prevent FOIT (Flash of Invisible Text) */

/* Immediate fallback fonts */
h1, h2, h3, h4, h5, .newake, .title-text {
    font-family: 'Arial Black', Arial, Helvetica, sans-serif;
    font-display: swap;
}

/* Mobile font optimization */
@media (max-width: 768px) {
    h1, h2, h3, h4, h5, .newake, .title-text {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Reduce layout shift */
.font-loading h1, .font-loading h2, .font-loading h3, 
.font-loading h4, .font-loading h5, .font-loading .newake, 
.font-loading .title-text {
    visibility: hidden;
}

.fonts-loaded h1, .fonts-loaded h2, .fonts-loaded h3, 
.fonts-loaded h4, .fonts-loaded h5, .fonts-loaded .newake, 
.fonts-loaded .title-text {
    visibility: visible;
    font-family: 'Newake', 'Newake Demo', 'Arial Black', Arial, Helvetica, sans-serif;
}

/* Ensure fonts work on iOS Safari */
@supports (-webkit-touch-callout: none) {
    h1, h2, h3, h4, h5, .newake, .title-text {
        -webkit-font-feature-settings: "kern" 1;
        font-feature-settings: "kern" 1;
        -webkit-font-kerning: normal;
        font-kerning: normal;
    }
}