
.hero-wrapper { position: relative; overflow: hidden; min-height: 400px; }
#hero-bg-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }
.hero-slide { 
    position: absolute; 
    inset: 0; 
    background-size: cover; 
    opacity: 0; 
    z-index: 0; 
    transition: opacity 2.0s ease-in-out, transform 8s linear; 
    will-change: opacity, transform; 
    background-position: center;
    transform: scale(1);
}

.hero-slide.active { 
    opacity: 1; 
    z-index: 1; 
    transform: scale(1.15);
}

.hero-threejs { width: 100%; height: 100%; opacity: 1; }
.hero-overlay { position: absolute; inset: 0; z-index: 1; }
.hero-overlay-gradient { background: linear-gradient(90deg, rgba(15, 23, 42, 0.98) 0%, rgba(15, 23, 42, 0.85) 50%, rgba(15, 23, 42, 0.4) 100%); }
.hero-content {
    position: relative; z-index: 3; max-width: 1400px; width: 100%; padding: 30px; margin: 0 auto;
    display: flex; flex-direction: row; align-items: center; justify-content: space-between; height: 100%;
    background: transparent; border: none; box-shadow: none; backdrop-filter: none;
    animation: fadeInUp 1s cubic-bezier(0.215, 0.610, 0.355, 1.000); color: white; gap: 40px;
}
@media (max-width: 992px) {
    .hero-content { flex-direction: column; justify-content: center; text-align: center; align-items: center; }
    .hero-actions-wrapper { justify-content: center; }
    .hero-content > div { min-width: 100% !important; }
}
.hero-badge-container { display: inline-flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, 0.05); color: var(--accent); padding: 8px 20px; border-radius: 50px; font-weight: 700; font-size: 0.75rem; letter-spacing: 1.5px; margin-bottom: 20px; border: 1px solid rgba(212, 175, 55, 0.3); backdrop-filter: blur(5px); }
.hero-badge-dot { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; box-shadow: 0 0 10px var(--accent); }
.hero-tagline { color: var(--accent); text-transform: uppercase; letter-spacing: 3px; font-weight: 700; font-size: 0.75rem; margin-bottom: 10px; display: block; text-shadow: 0 2px 4px rgba(0,0,0,0.5); }
.hero-title { font-size: clamp(2.5rem, 4vw, 4rem); line-height: 1.1; margin-bottom: 15px; font-weight: 800; color: white; text-shadow: 0 2px 10px rgba(0,0,0,0.8), 0 4px 20px rgba(0,0,0,0.6), 0 8px 30px rgba(0,0,0,0.4); }
.hero-desc { font-size: 1.1rem; color: #cbd5e1; margin-bottom: 30px; line-height: 1.6; max-width: 600px; font-weight: 300; opacity: 0.9; text-shadow: 0 2px 8px rgba(0,0,0,0.8); }
.hero-desc span { color: white; font-weight: 600; }
.hero-actions { display: flex; gap: 16px; justify-content: flex-start; flex-wrap: wrap; }
.hero-actions-wrapper { display: flex; gap: 16px; justify-content: flex-start; flex-wrap: wrap; }
.hero-overlay-img { max-width: 120px; height: auto; margin-bottom: 15px; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); animation: flightMove 6s ease-in-out infinite; }
.text-gradient-gold { background: linear-gradient(135deg, #bf953f 0%, #fcf6ba 25%, #b38728 50%, #fbf5b7 75%, #aa771c 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; text-shadow: none; filter: drop-shadow(0 0 2px rgba(0,0,0,0.5)); }
.hero-badge-animate { animation: floatBadge 4s ease-in-out infinite; box-shadow: 0 0 20px rgba(212, 175, 55, 0.2); }

@keyframes floatBadge { 0% { transform: translateY(0px); box-shadow: 0 0 20px rgba(212, 175, 55, 0.2); } 50% { transform: translateY(-8px); box-shadow: 0 10px 30px rgba(212, 175, 55, 0.4); } 100% { transform: translateY(0px); box-shadow: 0 0 20px rgba(212, 175, 55, 0.2); } }
@keyframes flightMove { 0% { transform: scale(1) translateY(0); } 50% { transform: scale(1.05) translateY(-20px); } 100% { transform: scale(1.1) translateY(0); } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
