/* Simple Hero Summary Animation Styles */

/* Base styles for hero-summary component */
.hero-summary {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: transform 0.3s ease;
    will-change: transform, opacity;
}

/* When animation is applied, these styles will be overridden by GSAP */
.hero-summary.gsap-animated {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Simple hover effect */
.hero-summary:hover {
    transform: translateY(-5px);
}

/* Simple image hover effect */
.hero-summary img[alias="IMAGE"] {
    transition: transform 0.3s ease;
}

.hero-summary img[alias="IMAGE"]:hover {
    transform: scale(1.1);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .hero-summary:hover {
        transform: translateY(-3px);
    }
    
    .hero-summary img[alias="IMAGE"]:hover {
        transform: scale(1.05);
    }
}

/* Accessibility - Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .hero-summary,
    .hero-summary img[alias="IMAGE"] {
        transition: none !important;
    }
    
    .hero-summary:hover {
        transform: none !important;
    }
    
    .hero-summary img[alias="IMAGE"]:hover {
        transform: none !important;
    }
    
    /* Show elements immediately for reduced motion users */
    .hero-summary {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }
} 