/*
 * PLTHost - Professional Animations File
 * Version: 1.0
 * Description: A centralized file for high-quality, performant animations.
*/

/* 1. Reveal on Scroll Animation
 * This is the primary animation for elements appearing as the user scrolls.
 *--------------------------------------------------*/

.reveal {
    opacity: 0;
    /* Start the element 40px down */
    transform: translateY(40px); 
    /* Smooth transition for opacity and transform */
    transition: opacity 0.8s ease-out, transform 0.8s ease-out; 
    /* Allows for custom delays on elements using style="--reveal-delay: 0.2s;" */
    transition-delay: var(--reveal-delay, 0s); 
}

.reveal.visible {
    opacity: 1;
    /* Move the element back to its original position */
    transform: translateY(0); 
}


/* 2. Page Load Animations (for elements visible at the top)
 *--------------------------------------------------*/
@keyframes fadeInDown {
    from { 
        opacity: 0; 
        transform: translateY(-20px); 
    }
    to { 
        opacity: 1; 
        transform: translateY(0); 
    }
}

.animate-fade-in-down {
    /* Starts slightly later than the page load for a smoother effect */
    animation: fadeInDown 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s backwards;
}


/* 3. Interactive Hover Effects
 *--------------------------------------------------*/

/* A subtle lift effect for cards and interactive sections */
.interactive-lift {
    transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
}
.interactive-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(45, 35, 31, 0.15); /* text-primary with opacity */
}

/* A subtle scaling effect for buttons */
.interactive-scale {
    transition: transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.interactive-scale:hover {
    transform: scale(1.05);
}


/* 4. Accessibility: Reduce motion for users who prefer it
 *--------------------------------------------------*/
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

