/* ==========================================================================
   STAR PESQUISAS - Animations
   ========================================================================== */

/* ==========================================================================
   Keyframes
   ========================================================================== */

/* Fade In Up */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Fade In Down */
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Fade In Left */
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Fade In Right */
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Fade In */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Scale In */
@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Shimmer Dourado */
@keyframes shimmer {
    0% {
        background-position: -200% center;
    }
    100% {
        background-position: 200% center;
    }
}

/* Pulse Estrela */
@keyframes starPulse {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }
}

/* Float suave */
@keyframes float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Rotate */
@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Pulse */
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(198, 162, 105, 0.4);
    }
    50% {
        transform: scale(1.02);
        box-shadow: 0 0 0 15px rgba(198, 162, 105, 0);
    }
}

/* Bounce */
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

/* Draw Line */
@keyframes drawLine {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}

/* Circle Expand */
@keyframes circleExpand {
    from {
        transform: scale(0);
        opacity: 1;
    }
    to {
        transform: scale(2);
        opacity: 0;
    }
}

/* ==========================================================================
   Animation Classes - Scroll Triggered
   ========================================================================== */

.animate {
    opacity: 0;
}

.animate.animated {
    animation-duration: 0.8s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

.animate-fade-in.animated {
    animation-name: fadeIn;
}

.animate-fade-up.animated {
    animation-name: fadeInUp;
}

.animate-fade-down.animated {
    animation-name: fadeInDown;
}

.animate-fade-left.animated {
    animation-name: fadeInLeft;
}

.animate-fade-right.animated {
    animation-name: fadeInRight;
}

.animate-scale.animated {
    animation-name: scaleIn;
}

/* Animation Delays */
.delay-100 {
    animation-delay: 100ms;
}

.delay-200 {
    animation-delay: 200ms;
}

.delay-300 {
    animation-delay: 300ms;
}

.delay-400 {
    animation-delay: 400ms;
}

.delay-500 {
    animation-delay: 500ms;
}

.delay-600 {
    animation-delay: 600ms;
}

.delay-700 {
    animation-delay: 700ms;
}

.delay-800 {
    animation-delay: 800ms;
}

/* ==========================================================================
   Hover Animations
   ========================================================================== */

.hover-lift {
    transition: transform var(--transition-base);
}

.hover-lift:hover {
    transform: translateY(-5px);
}

.hover-scale {
    transition: transform var(--transition-base);
}

.hover-scale:hover {
    transform: scale(1.05);
}

.hover-glow {
    transition: box-shadow var(--transition-base);
}

.hover-glow:hover {
    box-shadow: var(--shadow-dourado);
}

/* ==========================================================================
   Button Pulse Animation
   ========================================================================== */

.btn-pulse {
    animation: pulse 2s infinite;
}

/* ==========================================================================
   Counter Animation (handled by JS, but visual styles here)
   ========================================================================== */

.counter-number {
    font-family: var(--font-titulo);
    font-weight: var(--font-bold);
    font-size: var(--text-4xl);
    color: var(--dourado);
    line-height: 1;
}

@media (min-width: 768px) {
    .counter-number {
        font-size: var(--text-5xl);
    }
}

/* ==========================================================================
   Timeline Animation
   ========================================================================== */

.timeline-line {
    position: relative;
    overflow: hidden;
}

.timeline-line::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    height: 2px;
    width: 0;
    background-color: var(--dourado);
    transition: width 1s ease-out;
}

.timeline-line.animated::after {
    width: 100%;
}

/* ==========================================================================
   Logo Star Animation
   ========================================================================== */

.logo-star {
    display: inline-block;
    animation: starPulse 3s ease-in-out infinite;
}

/* ==========================================================================
   Carousel Animation
   ========================================================================== */

.carousel-slide {
    opacity: 0;
    transform: translateX(20px);
    transition: all var(--transition-slow);
}

.carousel-slide.active {
    opacity: 1;
    transform: translateX(0);
}

/* ==========================================================================
   Menu Animation
   ========================================================================== */

.menu-overlay {
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-base);
}

.menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

.mobile-nav {
    transform: translateX(100%);
    transition: transform var(--transition-base);
}

.mobile-nav.active {
    transform: translateX(0);
}

/* ==========================================================================
   Hamburger Animation
   ========================================================================== */

/* Animação movida para sections.css com transição cubic-bezier */

/* ==========================================================================
   Header Scroll Animation
   ========================================================================== */

.header {
    transition: all var(--transition-base);
}

.header.scrolled {
    background-color: rgba(13, 45, 66, 0.95);
    backdrop-filter: blur(10px);
    box-shadow: var(--shadow-md);
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .animate,
    .animate.animated {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .hover-lift:hover,
    .hover-scale:hover {
        transform: none;
    }

    .btn-pulse {
        animation: none;
    }

    .logo-star {
        animation: none;
    }
}