/* Lumiere Music Group - Premium Style Sheet */

/* Hide default browser scrollbars */
::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    background: transparent;
}
html {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

/* Base typography setup with high-contrast text rendering */
body {
    cursor: auto !important;
    font-family: 'Plus Jakarta Sans', sans-serif;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .font-display {
    font-family: 'Syne', sans-serif;
    font-weight: 800; /* Ultra bold default */
}

.font-semibold {
    font-weight: 600 !important;
}

/* Procedural Film Grain Noise Overlay */
.noise-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    content: "";
    opacity: 0.035;
    z-index: 999;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

/* Ambient Slow Floating Light Glows */
.ambient-glow {
    animation: float-glow 25s ease-in-out infinite alternate;
}

@keyframes float-glow {
    0% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(3%, 2%) scale(1.04);
    }
    100% {
        transform: translate(-1%, -2%) scale(0.98);
    }
}

/* Lenis Smooth Scroll Configuration Styles */
html.lenis {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-scrolling iframe {
    pointer-events: none;
}

/* Parallax Background Hardware Acceleration */
#hero-bg, #about-bg {
    will-change: transform;
    backface-visibility: hidden;
}

/* Scroll Scrub Text Reveal - Words start dim and light up on scroll */
.scroll-reveal-text {
    line-height: 1.5;
    font-family: 'Syne', sans-serif;
    font-weight: 600; /* Semibold for readable scrub-text */
    letter-spacing: -0.02em;
}

.reveal-word {
    color: rgba(255, 255, 255, 0.12); /* Dim gray state */
    transition: color 0.15s ease-out;
}

.reveal-word.revealed {
    color: rgba(255, 255, 255, 1); /* Lit up white state */
}

/* Slanted Releases Marquee Section ("Hafif Yamuk Akış") */
.marquee-section {
    transform: rotate(-2.5deg) scale(1.03); /* Slants the entire flow across screen */
    transform-origin: center;
    padding: 40px 0;
    will-change: transform;
}

.marquee-wrapper {
    overflow: hidden;
    width: 100%;
}

.marquee-track {
    display: flex;
    width: max-content;
    will-change: transform;
}

#marquee-row-1 {
    animation: scroll-right 45s linear infinite;
}

#marquee-row-2 {
    animation: scroll-right 38s linear infinite;
}

.marquee-wrapper:hover .marquee-track {
    animation-play-state: paused;
}

@keyframes scroll-right {
    0% {
        transform: translateX(-50%);
    }
    100% {
        transform: translateX(0%);
    }
}

/* Release Card Layout - PURE IMAGE COLLAGE (No text overlay) */
.release-card {
    position: relative;
    width: 280px;
    height: 280px;
    border-radius: 24px;
    overflow: hidden;
    flex-shrink: 0;
    background: #0B0B0E;
    border: 1px solid rgba(255, 255, 255, 0.03);
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), filter 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.4);
}

.release-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.release-card:hover img {
    transform: scale(1.06);
}

/* Sibling Blurring Effect */
.marquee-track:hover .release-card {
    opacity: 0.35;
    filter: blur(4px);
}

.marquee-track .release-card:hover {
    opacity: 1;
    filter: blur(0px);
    transform: scale(1.05); /* Tilted card zoom scale */
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 20px 50px rgba(255, 255, 255, 0.08);
}

/* Video Wrapper Grow-up Transition Variables */
#revenue-video-wrapper {
    will-change: transform, opacity;
}

/* Mobile responsive menu */
#mobile-nav {
    transition: max-height 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    max-height: 0;
    overflow: hidden;
}

#mobile-nav.open {
    max-height: 450px;
}

/* Disable custom elements on touch devices */
@media (hover: none) and (pointer: coarse) {
    body {
        cursor: auto !important;
    }
}

/* Premium Hologram Glitch Title Effect */
.hologram-text {
    position: relative;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.05);
    transition: text-shadow 0.2s ease;
}

.hologram-text.glitch {
    animation: hologram-flicker 0.3s linear infinite;
}

@keyframes hologram-flicker {
    0% {
        text-shadow: -2.5px 0 0 rgba(255, 123, 0, 0.75), 2.5px 0 0 rgba(99, 102, 241, 0.75), 0 0 8px rgba(255, 255, 255, 0.15);
        transform: skewX(0deg) scale(1);
        opacity: 0.92;
    }
    15% {
        text-shadow: -3.5px -1.5px 0 rgba(255, 123, 0, 0.85), 3.5px 2px 0 rgba(99, 102, 241, 0.85);
        transform: skewX(2.5deg) scaleY(1.02);
        opacity: 0.82;
    }
    30% {
        text-shadow: 2px 3.5px 0 rgba(255, 123, 0, 0.85), -2px -2px 0 rgba(99, 102, 241, 0.85);
        transform: skewX(-3deg) scaleY(0.98);
        opacity: 0.95;
    }
    45% {
        text-shadow: -1.5px 2px 0 rgba(255, 123, 0, 0.75), 1.5px -3.5px 0 rgba(99, 102, 241, 0.75);
        transform: skewX(1.5deg) scale(0.99);
        opacity: 0.76;
    }
    60% {
        text-shadow: 3.5px 0 0 rgba(255, 123, 0, 0.85), -3.5px 1.5px 0 rgba(99, 102, 241, 0.85);
        transform: skewX(-1deg) scale(1.01);
        opacity: 0.88;
    }
    75% {
        text-shadow: -2.5px -2px 0 rgba(255, 123, 0, 0.85), 2.5px 2.5px 0 rgba(99, 102, 241, 0.85);
        transform: skewX(1deg) scaleY(0.99);
        opacity: 0.84;
    }
    90% {
        text-shadow: 1.5px -1.5px 0 rgba(255, 123, 0, 0.75), -1.5px 1.5px 0 rgba(99, 102, 241, 0.75);
        transform: skewX(-1.5deg) scale(1);
        opacity: 0.96;
    }
    100% {
        text-shadow: -2.5px 0 0 rgba(255, 123, 0, 0.75), 2.5px 0 0 rgba(99, 102, 241, 0.75);
        transform: skewX(0deg) scale(1);
        opacity: 1;
    }
}
