/* 
 * NexSeaSun Excellency - Premium Animation System
 * Sleek, hardware-accelerated, responsive transitions and micro-interactions.
 */

/* Core Animation Setup - Viewport Reveal classes */
.reveal-on-scroll {
    opacity: 0;
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Scroll reveal initial states */
.reveal-fade-in {
    opacity: 0;
}

.reveal-slide-up {
    opacity: 0;
    transform: translateY(35px);
}

.reveal-slide-down {
    opacity: 0;
    transform: translateY(-35px);
}

.reveal-slide-left {
    opacity: 0;
    transform: translateX(-35px);
}

.reveal-slide-right {
    opacity: 0;
    transform: translateX(35px);
}

.reveal-zoom-in {
    opacity: 0;
    transform: scale(0.93);
}

.reveal-scale-up {
    opacity: 0;
    transform: scale(0.85);
}

/* Revealed States (Applied dynamically when scrolled into view) */
.reveal-on-scroll.revealed,
.reveal-stagger.revealed > .reveal-item,
.reveal-fade-in.revealed,
.reveal-slide-up.revealed,
.reveal-slide-down.revealed,
.reveal-slide-left.revealed,
.reveal-slide-right.revealed,
.reveal-zoom-in.revealed,
.reveal-scale-up.revealed {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}

/* Stagger parent structure */
.reveal-stagger > * {
    opacity: 0;
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Stagger directions - applied to direct children of a stagger parent */
.reveal-stagger.stagger-slide-up > * {
    transform: translateY(30px);
}

.reveal-stagger.stagger-slide-left > * {
    transform: translateX(-30px);
}

.reveal-stagger.stagger-slide-right > * {
    transform: translateX(30px);
}

.reveal-stagger.stagger-zoom-in > * {
    transform: scale(0.93);
}

/* Active state for stagger children when parent is revealed */
.reveal-stagger.revealed > * {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}

/* Fallback/Manual transition delays */
.delay-100 { transition-delay: 100ms !important; }
.delay-200 { transition-delay: 200ms !important; }
.delay-300 { transition-delay: 300ms !important; }
.delay-400 { transition-delay: 400ms !important; }
.delay-500 { transition-delay: 500ms !important; }
.delay-600 { transition-delay: 600ms !important; }
.delay-700 { transition-delay: 700ms !important; }
.delay-800 { transition-delay: 800ms !important; }

/* Continuous floating micro-animations */
@keyframes float {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
    100% {
        transform: translateY(0px);
    }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.animate-float-delayed {
    animation: float 6s ease-in-out infinite;
    animation-delay: 3s;
}

/* Timeline dot pulse ripple animation */
@keyframes pulse-orange {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 122, 0, 0.5);
    }
    70% {
        box-shadow: 0 0 0 12px rgba(255, 122, 0, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 122, 0, 0);
    }
}

@keyframes pulse-blue {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 86, 179, 0.5);
    }
    70% {
        box-shadow: 0 0 0 12px rgba(0, 86, 179, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(0, 86, 179, 0);
    }
}

.timeline-dot.active {
    animation: pulse-orange 2s infinite;
}

.timeline-dot:not(.active) {
    animation: pulse-blue 3s infinite;
    animation-delay: 1.5s;
}

/* Premium Card & Image Hover Micro-interactions */
.premium-card-hover {
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.premium-card-hover:hover {
    transform: translateY(-8px) scale(1.02) !important;
    box-shadow: 0 20px 40px rgba(0, 86, 179, 0.12) !important;
    border-color: rgba(0, 86, 179, 0.3) !important;
}

/* Image Scale zoom hover effect */
.reveal-image-hover {
    overflow: hidden;
    position: relative;
    border-radius: 8px;
}

.reveal-image-hover img {
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.reveal-image-hover:hover img {
    transform: scale(1.08) !important;
}

/* Interactive list indicators */
.animated-list-item {
    transition: transform 0.3s ease, color 0.3s ease;
}

.animated-list-item:hover {
    transform: translateX(6px);
}

/* Premium button hover shine ripple */
.btn-premium-shine {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.btn-premium-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.25) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transition: all 0.6s ease;
    z-index: -1;
}

.btn-premium-shine:hover::after {
    left: 100%;
}