@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,500&family=Outfit:wght@200;300;400;500&display=swap');

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
    background-color: #0a0a0a;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #0a0a0a;
}

::-webkit-scrollbar-thumb {
    background: #5C4B13;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #D4AF37;
}

/* Text Selection */
::selection {
    background: #D4AF37;
    color: #000;
}

/* Animations */
@keyframes scaleSlow {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.1);
    }
}

.animate-scaleSlow {
    animation: scaleSlow 20s infinite alternate linear;
}

@keyframes pulseSlow {

    0%,
    100% {
        opacity: 0.2;
        transform: scale(1);
    }

    50% {
        opacity: 0.4;
        transform: scale(1.1);
    }
}

.animate-pulseSlow {
    animation: pulseSlow 4s infinite ease-in-out;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.animate-marquee {
    animation: marquee 20s linear infinite;
    display: inline-block;
    padding-left: 100%;
    /* Start off-screen */
}

/* Sticky Container Tweaks */
main {
    overflow: visible;
}

/* Glassmorphism Classes */
.glass {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Cinematic Animations */

/* Ken Burns Effect (Slow Pan/Zoom) */
@keyframes kenBurns {
    0% {
        transform: scale(1) translate(0, 0);
    }

    50% {
        transform: scale(1.1) translate(-1%, -1%);
    }

    100% {
        transform: scale(1) translate(0, 0);
    }
}

.animate-ken-burns {
    animation: kenBurns 40s infinite ease-in-out;
    transform-origin: center center;
}

/* Shimmer / Light Sweep Effect */
@keyframes shimmerSweep {
    0% {
        transform: translateX(-150%) skewX(-30deg);
    }

    100% {
        transform: translateX(150%) skewX(-30deg);
    }
}

.shimmer-container {
    position: relative;
    overflow: hidden;
    /* Contains the shimmer */
}

.shimmer-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 60%;
    height: 100%;
    background: linear-gradient(to right,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, 0.1) 40%,
            rgba(255, 255, 255, 0.8) 50%,
            rgba(255, 255, 255, 0.1) 60%,
            rgba(255, 255, 255, 0) 100%);
    z-index: 20;
    pointer-events: none;
    animation: shimmerSweep 6s infinite ease-in-out;
    /* Slow visual sweep every 6s */
    mix-blend-mode: overlay;
    opacity: 0.6;
}

/* Vertical Floating for Zero-Gravity feel */
@keyframes liquidFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }
}

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