/* LCP Optimization CSS */

/* Ensure LCP element renders immediately */
.hero-title {
    /* Force immediate rendering */
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    will-change: auto !important;
    
    /* Use system fonts for fastest rendering */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
    
    /* Optimize for LCP */
    contain: layout style paint !important;
    content-visibility: auto !important;
    
    /* Force all critical styles */
    font-size: 3.5rem !important;
    font-weight: 700 !important;
    color: #fff !important;
    line-height: 1.2 !important;
    min-height: 4.2rem !important;
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
    background: linear-gradient(45deg, #ff6b6b, #4ecdc4) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Section title LCP optimization */
.section-title {
    /* Force immediate rendering */
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    will-change: auto;
    
    /* Use system fonts for fastest rendering */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif !important;
    
    /* Optimize for LCP */
    contain: layout style paint;
    content-visibility: auto;
}

/* Remove any blocking animations from LCP element */
.hero-title.animate-fadeInUp {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
}

/* Optimize hero section for faster rendering */
.hero {
    /* Ensure hero section renders quickly */
    contain: layout style paint;
    will-change: auto;
}

.hero-container {
    /* Optimize container rendering */
    contain: layout style;
}

/* System font optimization */
@font-face {
    font-family: 'SystemFont';
    src: local('-apple-system'), local('BlinkMacSystemFont'), local('Segoe UI'), local('Roboto');
    font-display: swap;
}

/* Critical path optimization */
.hero-title,
.hero-subtitle,
.hero-buttons {
    /* Ensure these elements don't block rendering */
    contain: layout style paint;
}

/* Remove any potential layout shifts */
.hero-title {
    min-height: 1.2em;
    line-height: 1.2;
}

/* Optimize button rendering */
.btn {
    /* Ensure buttons don't cause layout shifts */
    contain: layout style paint;
    will-change: auto;
}

/* Media queries for responsive LCP */
@media (max-width: 768px) {
    .hero-title {
        font-size: 2.5rem;
        min-height: 1.1em;
    }
}

@media (max-width: 480px) {
    .hero-title {
        font-size: 2rem;
        min-height: 1em;
    }
}