/* Hero Section Styles */
@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideUpWords {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideUpWord {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

h1 {
    display: inline-block;
    /* Removed animation from h1 to prevent blinking */
}

/* Mobile Hero Fixes */
.hero-section {
    height: 100vh;
    /* Using the CSS variable for consistent heights on mobile */
    height: calc(var(--vh, 1vh) * 100);
}

@media (max-width: 767px) {
    h1 {
        font-size: 3.5em !important;
    }
    
    .improved-hero-title {
        font-size: 2.8em !important;
    }
    
    @keyframes slideUp {
        from {
            transform: translateY(10px);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }
}

@media (max-width: 576px) {
    h1 {
        font-size: 2.5em !important;
    }
    
    .improved-hero-title {
        font-size: 2.2em !important;
    }
}