:root {
    --bg-color: #030303; /* Deep black contrast */
    --bg-gradient-top: #0a0908;
    --text-color: #E6E1D8; /* Soft beige/neutral */
    --accent-glow: rgba(210, 190, 160, 0.15); /* Warm beige glow */
    --gold-glow: rgba(220, 180, 130, 0.35);
    --nav-height: 80px;
    --font-main: 'Outfit', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: #000000;
    color: var(--text-color);
    font-family: var(--font-main);
    overflow: hidden;
    position: relative;
    height: 100vh;
    width: 100vw;
}

/* Cinematic Film Grain Effect */
body::after {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    pointer-events: none;
    z-index: 100;
    opacity: 0.05;
    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.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

/* Background Effects (Glows & Curves) */
.background-effects {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.abstract-curve {
    position: absolute;
    bottom: -5%;
    left: 0;
    width: 100%;
    height: 75vh;
    opacity: 0.7;
    transform-origin: bottom;
    z-index: 1; /* keep it behind the image */
}

.path-1 { animation: wave 15s infinite alternate ease-in-out; transform-origin: center; }
.path-2 { animation: wave 25s infinite alternate-reverse ease-in-out; transform-origin: center; }

@keyframes wave {
    0% { transform: scaleY(1) translateY(0); }
    100% { transform: scaleY(1.05) translateY(-20px); }
}

@keyframes breathCurve {
    0% { transform: scaleY(1); }
    100% { transform: scaleY(1.15); }
}

.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(140px);
    opacity: 0.6;
    animation: float 25s infinite alternate ease-in-out;
}

.blob-1 {
    width: 550px;
    height: 550px;
    background: var(--gold-glow);
    top: 15%;
    left: 5%;
}

.blob-2 {
    width: 700px;
    height: 700px;
    background: rgba(80, 80, 95, 0.25);
    bottom: -15%;
    right: 0%;
    animation-delay: -7s;
}

@keyframes float {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, -60px) scale(1.1); }
}

/* Header & Navbar */
.nav-gradient-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 180px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.6) 50%, transparent 100%);
    z-index: 8;
    pointer-events: none;
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2.5rem 2rem 1.5rem 2rem; /* Internal padding */
    width: 100%;
    max-width: 1100px; /* Squeezes icons and right items inwards towards center logo */
    margin: 0 auto; /* Centers the whole navigation */
    position: relative;
    z-index: 10;
}

.nav-left {
    display: flex;
    gap: 1.2rem;
}

.nav-left a, .nav-right a, .nav-right span {
    color: #fff;
    text-decoration: none;
    font-size: 1.3rem;
    opacity: 0.6;
    transition: all 0.4s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem; /* ensures physically equal spacing for different icon widths */
}

.svg-icon {
    width: 1.3rem;
    height: 1.3rem;
    object-fit: contain;
}

.language-selector {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    margin-right: 0.5rem;
    padding: 0.5rem 0;
}

.current-lang {
    font-size: 1.15rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    transition: color 0.3s ease, text-shadow 0.3s ease;
}

.language-selector:hover .current-lang {
    color: #DCCCB5;
    text-shadow: 0 0 10px rgba(220, 204, 181, 0.4);
}



.nav-right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.search-container {
    display: flex;
    align-items: center;
}

.search-input {
    width: 0;
    opacity: 0;
    border: none;
    border-bottom: 1px solid #fff;
    background: transparent;
    color: #fff;
    font-family: inherit;
    font-size: 0.9rem;
    transition: width 0.4s ease, opacity 0.4s ease, margin 0.4s ease;
    outline: none;
    padding: 0.2rem 0;
    margin-right: 0;
    pointer-events: none;
}

.search-container.active .search-input {
    width: 120px;
    opacity: 1;
    margin-right: 0.8rem;
    pointer-events: auto;
}

.nav-icon-home {
    margin-left: 0.8rem;
    font-size: 1.5rem; /* Ensure home icon is slightly larger */
}

.nav-left a:hover, .search-icon:hover, .nav-icon-home:hover {
    opacity: 1;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.8);
    transform: translateY(-2px);
}

.nav-center .logo {
    font-size: 2.8rem;
    font-weight: 800;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

/* Secondary Menu */
/* Hide mobile-specific elements globally (shown only on mobile via media queries) */
.mobile-menu-toggle,
.mobile-menu-header,
.mobile-menu-socials,
.mobile-bottom-tabs,
.mobile-scroll-indicator {
    display: none;
}

.main-menu {
    position: relative;
    z-index: 10;
    width: 100%;
    padding: 0;
    margin-top: 0.5rem;
}

.main-menu ul.submenu {
    display: none;
    list-style: none;
    padding-top: 1rem;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    position: absolute;
    top: 100%;
    background: rgba(5, 5, 5, 0.95);
    padding: 1.5rem 1.2rem;
    border-radius: 8px;
    border: 1px solid rgba(220, 204, 181, 0.15);
    backdrop-filter: blur(10px);
    min-width: 120px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
    z-index: 20;
}

.main-menu ul.submenu.active {
    display: flex;
}

.submenu-icon {
    font-size: 0.8rem;
    margin-left: 0.5rem;
    transition: transform 0.3s ease;
}

.has-submenu.active .submenu-icon {
    transform: rotate(180deg);
}

.has-submenu {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.epk-sub-link {
    font-size: 1.1rem !important; /* Slightly smaller than main links */
    color: #A5A5A5 !important;
}

.epk-sub-link:hover {
    color: #fff !important;
}

.main-menu ul {
    list-style: none;
    display: flex;
    justify-content: center; /* Groups items tightly */
    gap: 1rem; /* Reduced gap to close distance between headers */
    align-items: center;
    width: 100%;
}

.main-menu li {
    display: flex;
    align-items: center;
}

.main-menu a {
    color: #fff;
    text-decoration: none;
    font-size: 1.05rem; /* Increased size */
    font-weight: 200;
    letter-spacing: 0.15em; /* Decreased letter spacing */
    opacity: 0.65;
    text-transform: uppercase;
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    position: relative;
    padding-bottom: 4px;
}

.main-menu a::after {
    content: '';
    position: absolute;
    width: 0%;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #fff;
    transition: width 0.4s ease;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
}

.main-menu a:hover, .main-menu a.active-nav {
    opacity: 1;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.7);
}

.main-menu a.active-nav {
    color: #DCCCB5;
    text-shadow: 0 0 10px rgba(220, 204, 181, 0.5);
}

.main-menu a:hover::after, .main-menu a.active-nav::after {
    width: 100%;
}

.main-menu a.active-nav::after {
    background-color: #DCCCB5;
    box-shadow: 0 0 8px rgba(220, 204, 181, 0.5);
}

.main-menu .dot {
    color: #fff;
    opacity: 0.25;
    font-size: 1.2rem;
    line-height: 0;
}

/* Hero Section */
.hero {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

/* Hero Image Container */
.hero-image-container {
    position: absolute;
    bottom: 0;
    right: 4%; /* Shifted slightly left */
    width: 55vw;
    height: 100vh;
    z-index: 2;
    mix-blend-mode: lighten;
    pointer-events: none;
}

.hero-image {
    height: 100%;
    width: 100%;
    object-fit: contain;
    object-position: center bottom; /* Adjusted to better fit 1:1 image */
    filter: contrast(1.25) brightness(0.95); /* Increased contrast */
}

@keyframes subtlePresence {
    0% { transform: scale(1) translateY(0); }
    100% { transform: scale(1.02) translateY(-10px); }
}

/* Text Section - Cinematic Layout */
.hero-text {
    position: absolute;
    left: calc(50vw - 550px + 2rem); /* EXACTLY tracks the leftmost boundary of the nav-left icons */
    right: auto;
    top: 54%; /* Shifted up slightly for readability while keeping it cinematic */
    transform: translateY(-50%);
    z-index: 10;
    max-width: 600px;
    text-align: left; /* Explicitly left aligned */
}

.quote {
    font-family: 'Akzidenz-Grotesk Pro Super', sans-serif;
    font-size: 2.3rem;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
    letter-spacing: 0.05em;
    position: relative;
    text-transform: uppercase;
}

/* Soft ambient block behind text to ensure readability and hint at club atmosphere */
.hero-text::before {
    content: '';
    position: absolute;
    top: -40px;
    left: -40px;
    width: calc(100% + 80px);
    height: calc(100% + 80px);
    background: radial-gradient(circle at left center, rgba(15, 12, 10, 0.4) 0%, transparent 80%);
    z-index: -1;
    filter: blur(20px);
    border-radius: 50%;
}

.quote-line {
    display: inline-block;
    opacity: 0;
    transform: translateY(20px);
    animation: slideFadeUp 1.2s forwards cubic-bezier(0.2, 0.8, 0.2, 1);
}

.quote-line:nth-child(1) { animation-delay: 0.3s; }
.quote-line:nth-child(3) { animation-delay: 0.7s; font-weight: 800; }
.quote-line:nth-child(5) { animation-delay: 1.1s; border-left: 2px solid transparent;} /* break line offset */
.quote-line:nth-child(7) { 
    animation-delay: 1.5s; 
    font-weight: 500; 
    color: #DCCCB5; 
    text-shadow: 0 0 20px rgba(220, 204, 181, 0.4);
    margin-top: 5px;
}

/* Quote signature removed */

@keyframes slideFadeUp {
    0% { opacity: 0; transform: translateY(25px); }
    100% { opacity: 1; transform: translateY(0); }
}

/* Responsive adjustments */

/* ------------------------------------- */
/* MOBILE 9:16 HERO & HEADER REDESIGN    */
/* ------------------------------------- */

/* ------------------------------------- */
/* ABOUT SECTION                         */
/* ------------------------------------- */

.about-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px);
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center; /* Center the text vertically within the remaining space */
    padding-top: 0; /* Removed top padding to center naturally */
}

.about-content {
    display: flex;
    width: 100%;
    max-width: 1200px;
    height: 100%; /* Take full height for vertical alignment */
    justify-content: flex-start; /* Keep text aligned left naturally */
    align-items: center; /* Center vertically */
    margin: 0 auto;
    padding: 0 2rem;
    gap: 0;
}

.about-text {
    flex: none;
    width: 50%; /* Wider column for better text flow */
    max-width: 550px; 
    color: #E6E1D8;
    font-family: 'Open Sauce', 'Outfit', sans-serif;
    font-size: 1.25rem; /* Larger, more striking font size */
    line-height: 1.8; /* Better readability */
    font-weight: 300;
    text-align: left; /* Left align like the screenshot */
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1);
    position: relative;
    z-index: 10;
    margin-top: 0; /* Reset margin since we vertically center */
}

.about-text p {
    margin-bottom: 1.2rem;
}

.about-text p strong {
    font-weight: 600;
    font-size: 1.25rem;
    color: #fff;
    letter-spacing: 0.05em;
}

.about-text .highlight {
    font-family: 'Open Sauce', 'Akzidenz Regular', sans-serif;
    font-size: 1.6rem;
    color: #DCCCB5;
    font-style: italic;
    margin-top: 2rem;
    font-weight: 600;
    text-transform: uppercase;
    text-align: left;
    text-shadow: 0 0 15px rgba(220, 204, 181, 0.2);
}

.about-video-container {
    position: absolute;
    top: -140px; /* Start from the very top behind the header */
    right: 0;
    height: 100vh; /* Full screen height */
    width: 60vw; /* Massive right side focus */
    z-index: 1; /* Keep it behind text/nav but interactable */
    background: transparent;
    border-radius: 0;
    overflow: hidden;
    animation: slideFadeUp 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
    box-shadow: none;
    mix-blend-mode: lighten;
}

.about-video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Makes video fill the entire container proportionally, fixes thin/long issue */
    object-position: right 15%; /* Keep focus on the DJ, shifted up to show head */
    filter: brightness(0.65) contrast(1.1); /* Keep native colors but slightly dimmed */
    transition: filter 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    z-index: 1;
}

.about-video:hover {
    filter: brightness(1) contrast(1); /* Reveal full vibrance */
}

/* ------------------------------------- */
/* NEWS SECTION                          */
/* ------------------------------------- */

.news-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px);
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 4rem;
    padding-bottom: 4rem;
    overflow-y: auto;
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.news-scroll-btn {
    display: none;
}

.news-container {
    width: 100%;
    max-width: 1100px;
    height: auto; 
    display: flex;
    flex-direction: column;
    gap: 6rem;
    padding: 0 4rem;
    align-items: center;
    margin: 0 auto;
    z-index: 5;
}

.news-item {
    flex: none;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 5rem;
    background: transparent;
    border: none;
    box-shadow: none;
    opacity: 0;
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.news-item:nth-child(2) { animation-delay: 0.2s; }
.news-item:nth-child(3) { animation-delay: 0.4s; }
.news-item:nth-child(4) { animation-delay: 0.6s; }

.news-image-wrapper {
    flex: 0 0 35%;
    max-width: 320px;
    height: auto;
    position: relative;
    z-index: 1;
}

.news-image {
    width: 100%;
    max-height: 480px;
    height: auto;
    object-fit: contain;
    display: block;
}

.news-text {
    flex: 1;
    max-width: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    z-index: 3;
    position: relative;
}

.news-text p {
    font-family: 'Outfit', sans-serif;
    color: #C0BDB6;
    font-size: 1.15rem;
    line-height: 1.8;
    margin-bottom: 2.5rem;
    font-weight: 300;
    letter-spacing: 0.01em;
}

.btn-read-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #E6E1D8;
    color: #000;
    text-decoration: none;
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 0.8rem 2rem;
    transition: all 0.3s ease;
    width: fit-content;
}

.btn-read-more:hover {
    background-color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(230, 225, 216, 0.3);
}

/* ------------------------------------- */
/* VIDEOS SECTION                        */
/* ------------------------------------- */

.videos-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px);
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 1rem;
    padding-bottom: 2rem;
    overflow: hidden;
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.video-ambient-glow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 20%;
    height: 80%;
    pointer-events: none;
    z-index: 0;
    opacity: 0.5;
    animation: pulseGlow 4s infinite alternate ease-in-out;
}

.video-ambient-glow.left {
    left: -5%;
    background: radial-gradient(ellipse at left center, rgba(220, 180, 130, 0.15) 0%, transparent 70%);
}

.video-ambient-glow.right {
    right: -5%;
    background: radial-gradient(ellipse at right center, rgba(220, 180, 130, 0.15) 0%, transparent 70%);
}

@keyframes pulseGlow {
    0% { opacity: 0.3; }
    100% { opacity: 0.7; }
}

.videos-scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: 1px solid rgba(220, 204, 181, 0.2);
    color: rgba(220, 204, 181, 0.5); /* Reduced opacity */
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 20;
    transition: all 0.3s ease;
    backdrop-filter: blur(5px);
}

.videos-scroll-btn:hover {
    border-color: rgba(220, 204, 181, 0.8);
    color: #fff;
    box-shadow: 0 0 15px rgba(220, 204, 181, 0.3);
    transform: translateY(-50%) scale(1.05);
}

.videos-scroll-btn.left { left: 2rem; }
.videos-scroll-btn.right { right: 2rem; }

.videos-container {
    width: 100%;
    max-width: 1600px;
    height: auto; 
    display: flex;
    gap: 1.5rem;
    padding: 2rem 6rem; /* Top/bottom padding for hover pop, side padding for arrows */
    align-items: center;
    overflow-x: auto;
    scroll-behavior: smooth;
    -ms-overflow-style: none;  
    scrollbar-width: none;  
    z-index: 5;
}

.videos-container::-webkit-scrollbar {
    display: none;
}

.video-wrapper {
    flex: 0 0 auto;
    width: 14vw;
    max-width: 220px;
    min-width: 160px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    aspect-ratio: 9/16;
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    background: #050505;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.video-wrapper::before {
    display: none; /* Remove dark dimming overlay entirely */
}

.videos-item {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(0%) brightness(1) contrast(1); /* Natural colors */
    transition: filter 0.6s ease, transform 0.6s ease;
    cursor: pointer;
    z-index: 1;
}

.video-wrapper:hover {
    border-color: #DCCCB5;
    box-shadow: 0 0 40px rgba(220, 204, 181, 0.5), inset 0 0 20px rgba(220, 204, 181, 0.2);
    z-index: 10;
    transform: translateY(-10px) scale(1.05);
}

.video-wrapper:hover::before {
    display: none;
}

.video-wrapper:hover .videos-item {
    filter: grayscale(0%) brightness(1.05) contrast(1.05); /* Slight pop on hover */
    transform: scale(1.03);
}

/* Custom Play Buttons for Desktop & Mobile */
.video-play-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    z-index: 10;
    pointer-events: none; /* Let clicks pass through */
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.video-play-overlay.desktop {
    display: none !important;
}

.video-wrapper:hover .video-play-overlay.desktop {
    display: none !important;
}

.video-play-overlay.mobile {
    width: 40px; /* Smaller, premium size */
    height: 40px;
    font-size: 0.9rem;
    background: rgba(10, 10, 10, 0.25); /* More transparency */
    border: 1px solid rgba(255, 255, 255, 0.15); /* Minimal border */
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    padding-left: 3px; /* Optical center for play triangle */
}

/* ------------------------------------- */
/* CONTACT SECTION                       */
/* ------------------------------------- */

.contact-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px); /* Fill the screen minus header */
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center; /* Center content vertically */
    padding: 2rem 0; /* Breathing room */
    overflow: hidden; /* Prevent scrolling */
}

.contact-container {
    width: 100%;
    max-width: 1800px; /* Very wide to fit everything cinematically */
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contact-content-row {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0; /* Let images touch the form */
}

.contact-image-column {
    flex: 1;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center; /* Center images vertically */
    justify-content: center; /* Center images horizontally */
    animation: slideFadeUp 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    z-index: 1;
    pointer-events: none; /* Let clicks pass through */
}

.contact-image-column.left {
    padding-right: 0;
}

.contact-image-column.right {
    padding-left: 0;
}

.contact-ambient-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100vw; 
    height: 100vh; 
    background: radial-gradient(ellipse at center, rgba(220, 204, 181, 0.08) 0%, transparent 60%);
    z-index: 0;
    pointer-events: none;
}

.contact-hero-image {
    width: auto;
    height: 80%; /* Balanced size */
    max-width: 100%;
    object-fit: cover;
    object-position: center; 
    position: relative;
    z-index: 2;
    filter: drop-shadow(0 0 20px rgba(0,0,0,0.5)) contrast(1.1) brightness(0.85);
    mask-image: radial-gradient(ellipse at center, black 40%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse at center, black 40%, transparent 75%);
}

.contact-form-wrapper {
    flex: none; 
    width: 100%;
    max-width: 420px; /* Even narrower */
    height: auto; 
    margin: 0 2rem; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2rem 2.5rem; /* Reduced padding */
    background: rgba(8, 8, 8, 0.6); 
    border: 1px solid rgba(220, 204, 181, 0.1); 
    border-radius: 4px;
    z-index: 10;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 30px 60px rgba(0,0,0,0.8);
}

.contact-form-header {
    text-align: center;
    margin-bottom: 1.2rem; /* Reduced */
}

.contact-small-title {
    display: block;
    font-family: 'Outfit', sans-serif;
    font-size: 0.65rem;
    font-weight: 500;
    letter-spacing: 0.3em;
    color: #DCCCB5;
    text-transform: uppercase;
    margin-bottom: 0.8rem; /* Reduced */
}

.contact-main-title {
    font-family: 'Outfit', sans-serif;
    font-size: 1.4rem; /* Smaller sizing */
    font-weight: 300;
    letter-spacing: 0.25em;
    color: #fff;
    text-transform: uppercase;
    line-height: 1.3;
    margin-bottom: 0.8rem; /* Reduced */
}

.contact-desc {
    font-family: 'Outfit', sans-serif;
    font-size: 0.8rem;
    font-weight: 300;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.4;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 0.8rem; /* Reduced */
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 0.3rem; /* Reduced */
}

.form-group label {
    font-family: 'Outfit', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    color: #fff;
    text-transform: uppercase;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    background: rgba(0, 0, 0, 0.5); /* Darker clean background */
    border: 1px solid rgba(255, 255, 255, 0.08); /* Thinner border */
    color: #fff;
    padding: 0.7rem 0.9rem; /* Reduced padding */
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem; /* Reduced font size */
    font-weight: 300;
    transition: all 0.3s ease;
    border-radius: 2px;
    outline: none;
}

.contact-form input:focus,
.contact-form textarea:focus {
    border-color: #DCCCB5;
    background: rgba(220, 204, 181, 0.05);
}

.contact-form textarea {
    resize: none; 
    height: 60px; /* Force smaller height */
}

.btn-send {
    width: 100%;
    padding: 0.8rem; /* Less bulky */
    background: linear-gradient(to right, #B89C71, #DCCCB5, #B89C71); /* Elegant gold */
    color: #050505;
    border: none;
    font-family: 'Outfit', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.4s ease;
    margin-top: 0.2rem; /* Reduced */
    border-radius: 2px;
}

.btn-send:hover {
    box-shadow: 0 0 25px rgba(220, 204, 181, 0.4);
    transform: translateY(-2px);
}

.contact-info-footer {
    text-align: center;
    margin-top: 1.2rem; /* Reduced */
    display: flex;
    flex-direction: column;
    gap: 0.4rem; /* Reduced */
}

.contact-footer-title {
    font-family: 'Outfit', sans-serif;
    font-size: 0.65rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

.contact-email {
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 300;
    color: #fff;
    letter-spacing: 0.05em;
}

/* ------------------------------------- */
/* MUSIC SECTION                         */
/* ------------------------------------- */

.music-section {
    width: 100%;
    height: calc(100vh - 140px);
    z-index: 5;
    padding: 2rem 2rem 4rem 2rem;
    overflow-y: auto; 
    position: relative;
    /* hide scrollbar for elegance */
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}

.music-section::-webkit-scrollbar { 
    display: none; 
}

.music-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem; /* Space between categories */
    padding-bottom: 5rem;
}

.music-category-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.2rem;
    color: #DCCCB5;
    font-weight: 400;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 3.5rem;
    position: relative;
}

.music-category-title::before {
    content: '';
    position: absolute;
    width: 60vw;
    max-width: 720px;
    left: 50%;
    transform: translateX(-50%);
    bottom: -1rem;
    border-bottom: 1px solid rgba(220, 180, 130, 0.15);
}

.music-category-title::after {
    display: none; /* Removed corrupted diamond character */
}

.music-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 3rem;
    justify-items: center;
}

#music-grid-albums {
    grid-template-columns: 1fr 1fr; /* Force 2 columns for albums */
    align-items: start;
    position: relative;
    gap: 4rem;
}

#music-grid-albums::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    border-left: 1px solid rgba(220, 180, 130, 0.15);
    transform: translateX(-50%);
}

.music-item {
    width: 100%;
    max-width: 350px;
    position: relative;
    cursor: pointer;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.music-item img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    filter: grayscale(0%) brightness(0.9) contrast(1.05); /* Original color, slightly dimmed for hover effect */
    transition: filter 0.6s cubic-bezier(0.25, 1, 0.5, 1), transform 0.6s ease;
}

/* Titles sit below the cover art */
.music-title {
    color: #E6E1D8;
    padding: 1.5rem 0 0.5rem 0;
    text-align: center;
    font-family: 'Outfit', sans-serif;
    font-size: 1.1rem;
    font-weight: 400;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    width: 100%;
}

.music-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.9), 0 0 20px rgba(220, 204, 181, 0.1);
}

.music-item:hover img {
    filter: grayscale(0%) brightness(1) contrast(1);
    transform: scale(1.03);
}



/* ------------------------------------- */
/* MUSIC ALBUMS & BUTTONS UI             */
/* ------------------------------------- */

.music-single-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #080808;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    padding: 0;
    overflow: hidden;
    transition: all 0.4s ease;
    width: 100%;
}

.music-single-container .music-item {
    width: 100%;
    max-width: none;
    border-radius: 0;
    box-shadow: none;
}

.music-single-container .music-title {
    padding: 1.5rem 1rem 1rem 1rem;
    font-size: 1rem;
}

.music-single-container:hover {
    transform: translateY(-5px);
    border-color: rgba(220, 204, 181, 0.2);
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
}

.music-album-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    padding-bottom: 2rem;
    width: 100%;
}

.music-album-card {
    width: 100%;
    max-width: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.music-album-card .music-item img {
    aspect-ratio: 1 / 1; /* Match singles cover size */
    object-fit: cover;
}

.music-album-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    color: #DCCCB5;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
}

.music-album-tracks {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.music-track-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 0;
}

.music-track-row:last-child {
    border-bottom: none;
}

/* Global utility classes for responsive music rows */
.mobile-track-thumb, .track-artist, .mobile-only-row {
    display: none;
}
.track-left-group {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.track-name {
    font-family: 'Outfit', sans-serif;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    color: #E6E1D8;
    text-transform: uppercase;
}

.music-buttons {
    display: flex;
    gap: 1rem;
}

.single-buttons {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    width: calc(100% - 2rem);
    margin: 0 1rem 1.5rem 1rem;
}

.single-buttons .btn-music {
    width: 100%;
    flex: none;
}

.btn-music {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem; /* Better i18n spacing */
    padding: 0.45rem 1rem; /* Thinner buttons */
    background: transparent;
    color: #A5A5A5;
    border: 1px solid rgba(220, 204, 181, 0.3);
    border-radius: 4px;
    font-family: 'Outfit', sans-serif;
    font-size: 0.65rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    min-width: 160px; /* Minimum width for short texts */
    width: auto; /* Allow expansion for long translations like RU */
    padding: 0.45rem 1.2rem; /* Add horizontal padding for expanded text */
    position: relative;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap; /* Prevent wrapping */
}

.btn-music i {
    margin-right: 0; /* Removed margin-right because gap is already used in flex parent */
    font-size: 0.85rem;
}

.btn-download::before {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: var(--progress, 0%);
    background: rgba(220, 204, 181, 0.25);
    z-index: -1;
    transition: width 0.1s linear;
}

.btn-music:hover {
    color: #DCCCB5;
    border-color: #DCCCB5;
    box-shadow: 0 0 15px rgba(220, 204, 181, 0.1);
}

.btn-music.downloading {
    color: #DCCCB5;
    border-color: #DCCCB5;
    cursor: wait;
}

/* ------------------------------------- */
/* RESPONSIVE DESIGN                     */
/* ------------------------------------- */

/* Mobile Menu Toggle Styling */
.mobile-menu-toggle {
    display: none;
    font-size: 1.5rem;
    color: #fff;
    cursor: pointer;
    z-index: 100;
}




.section-title {
    font-family: 'Open Sauce', 'Akzidenz Regular', sans-serif;
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 0.15em;
    color: #fff;
    margin-bottom: 2.5rem;
    text-transform: uppercase;
    text-align: center;
}

/* ------------------------------------- */
/* TOUR SECTION                          */
/* ------------------------------------- */

.tour-section {
    width: 100%;
    height: calc(100vh - 140px);
    z-index: 5;
    padding: 2rem 2rem 4rem 2rem;
    overflow-y: auto; 
    position: relative;
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}

.tour-section::-webkit-scrollbar { 
    display: none; 
}

.tour-container {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.tour-item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 2rem 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.tour-item:last-child {
    border-bottom: none;
}

.tour-item:hover {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.1);
}

.tour-date {
    flex: 0 0 120px;
    font-size: 2.2rem;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 400;
    color: #DCCCB5;
    letter-spacing: 0.15em;
    border-right: 1px solid rgba(255,255,255,0.2);
    padding-right: 2rem;
    margin-right: 2rem;
}

.tour-details {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 3rem;
}

.tour-name {
    font-size: 1.1rem;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.tour-address {
    font-size: 0.85rem;
    color: #A5A5A5;
    font-weight: 400;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.tour-action {
    flex: 0 0 auto;
    text-align: right;
    margin-left: auto;
}

.btn-tour {
    display: inline-block;
    padding: 0.8rem 2.2rem;
    background: #DCCCB5;
    color: #000;
    border: none;
    border-radius: 50px;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    transition: all 0.4s ease;
}

.btn-tour:hover {
    background: #fff;
    color: #000;
    box-shadow: 0 0 20px rgba(220, 204, 181, 0.4);
}


/* ------------------------------------- */
/* EPK SECTION                           */
/* ------------------------------------- */

.epk-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px); /* Fit exactly to screen, matching .hero */
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: stretch;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: visible; /* Allow poster to break out */
}

.epk-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 1500px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.epk-subnav {
    display: flex;
    justify-content: center; /* Centered under main menu */
    gap: 3rem;
    position: relative; /* Normal flow */
    top: 0; 
    left: 0; 
    width: 100%; 
    padding: 1.5rem 0 1rem 0; /* Nicely spaced under menu */
    z-index: 20;
    flex: none;
    border-bottom: none;
}

.epk-tab {
    color: rgba(255, 255, 255, 0.5);
    font-family: 'Open Sauce One', 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-decoration: none;
    padding-bottom: 0.8rem;
    margin-bottom: -1px; /* Overlap border */
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.epk-tab:hover, .epk-tab.active {
    color: #DCCCB5;
    border-bottom: 2px solid #DCCCB5;
}

.epk-content {
    position: relative;
    width: 100%;
    flex: 1; /* Take remaining height in epk-wrapper */
    overflow: visible; /* Allow poster to break out */
}

.epk-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Fill epk-wrapper completely */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease;
}

.epk-panel.active {
    display: block;
    opacity: 1;
    visibility: visible;
}

#epk-djinfo, #epk-bio {
    padding: 0;
    overflow: hidden;
}

.epk-split-layout, .info-new-layout {
    display: block; /* Allow content to flow and scroll naturally */
    width: 100%;
    height: 100%;
    padding: 0;
    position: relative;
    overflow-y: auto; /* Scroll the text area */
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.epk-split-layout::-webkit-scrollbar, .info-new-layout::-webkit-scrollbar, .epk-text-column::-webkit-scrollbar, .info-left-content::-webkit-scrollbar {
    display: none; /* Hide scrollbars completely */
}

.epk-text-column, .info-left-content {
    width: 100%; /* Allow text to expand fully to the right */
    max-width: none; /* Remove any cap so it can stretch fully to avoid scrolling */
    height: auto; /* Grow with content */
    padding-top: 1rem; /* Subnav is no longer inside */
    padding-left: 12%; /* Added significant left margin to match the rest of the site's centered layout */
    padding-right: 4rem; /* Allow it to get close to the right edge without hitting it */
    padding-bottom: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    z-index: 10;
    overflow-y: auto; /* Changed to auto so only text area scrolls if needed */
    -ms-overflow-style: none;
    scrollbar-width: none;
    position: relative; /* Above background image */
}

.epk-visual-column, .info-right-visual {
    position: fixed; /* Keep image fixed while text scrolls over it */
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 0; /* Behind the text */
    pointer-events: none;
}

.epk-visual-column::after, .info-right-visual::after {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    /* Replaced vertical split with a subtle overall darkening to avoid frame look */
    background: rgba(5, 5, 5, 0.6); 
}

.epk-visual-column img, .info-hero-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right top; /* Keep subject aligned right */
    opacity: 0.5; /* Dim slightly for text contrast */
}

.epk-title {
    font-family: 'Akzidenz-Grotesk Pro Super', 'Outfit', sans-serif;
    font-size: 3rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: #fff;
    margin-bottom: 0.5rem;
}

.epk-subtitle {
    font-family: 'Akzidenz-Grotesk Pro Super', 'Outfit', sans-serif;
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 0.2em;
    color: #A5A5A5;
    margin-bottom: 2rem;
}

.epk-bio p {
    font-family: 'Open Sauce', 'Outfit', sans-serif;
    font-size: 0.95rem; /* Reduced to fit perfectly on single screen in all languages */
    line-height: 1.6;
    font-weight: 300;
    color: #E6E1D8;
    margin-bottom: 1rem;
    text-align: left;
}
.epk-bio p:last-child {
    margin-bottom: 0;
}

/* ------------------------------------- */
/* SHOP SECTION                          */
/* ------------------------------------- */

.shop-section {
    position: relative;
    width: 100%;
    height: calc(100vh - 140px); /* Fit within viewport */
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Fix for overflow scrolling */
    padding-top: 3rem;
    padding-bottom: 4rem;
    overflow-y: auto; /* Allow scrolling for multiple rows */
    -ms-overflow-style: none;  
    scrollbar-width: none;  
    animation: slideFadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.shop-section::-webkit-scrollbar {
    display: none;
}

.shop-wrapper {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shop-subnav {
    display: flex;
    justify-content: center;
    gap: 1.5rem; /* Reduced from 3rem */
    position: relative;
    margin-top: 1rem;
    margin-bottom: 1.5rem; /* Reduced margin */
    width: 100%;
    z-index: 10;
}

.shop-tab {
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    color: #A5A5A5;
    letter-spacing: 0.15em;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid transparent;
}

.shop-tab:hover {
    color: #E6E1D8;
}

.shop-tab.active {
    color: #DCCCB5;
    border-bottom: 1px solid #DCCCB5;
}

.shop-panel {
    display: none;
    width: 100%;
    animation: fadeIn 0.4s ease-out forwards;
}

.shop-panel.active {
    display: block;
}

.shop-header {
    text-align: center;
    margin-bottom: 1.5rem; /* Reduced from 2.5rem */
}

.shop-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.2rem; /* Reduced size */
    color: #DCCCB5;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 0.2rem;
}

.shop-subtitle {
    font-family: 'Outfit', sans-serif;
    font-size: 1rem;
    color: #A5A5A5;
    letter-spacing: 0.2em;
    margin-bottom: 0.5rem;
}

.shop-tagline {
    font-family: 'Outfit', sans-serif;
    font-size: 0.9rem;
    color: #E6E1D8;
    letter-spacing: 0.1em;
    font-style: italic;
}

.shop-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.2rem;
    width: 100%;
    padding: 0 2rem;
}

.shop-item {
    flex: 0 0 calc(20% - 1.2rem); 
    max-width: calc(20% - 1.2rem);
    max-height: calc(50vh - 120px); 
    min-height: 250px;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: radial-gradient(circle at top center, #1a1a1a 0%, #050505 100%);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 0;
    border-radius: 4px;
    transition: all 0.4s ease;
    overflow: hidden;
}

.shop-item:hover {
    transform: translateY(-5px);
    border-color: rgba(220, 204, 181, 0.4);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
}

.shop-image-wrapper {
    width: 100%;
    flex-grow: 1;
    min-height: 0;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0; /* Removed padding to maximize image size */
}

.shop-image-wrapper img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    aspect-ratio: unset;
    margin-bottom: 0;
    display: block;
    transition: transform 0.4s ease;
    cursor: zoom-in; /* Indicate it's clickable */
}

.shop-item:hover .shop-image-wrapper img {
    transform: scale(1.03);
}

.shop-item-title {
    font-family: 'Outfit', sans-serif;
    font-size: 0.75rem; /* Reduced from 0.85rem */
    font-weight: 500;
    color: #E6E1D8;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
    margin-top: 0.5rem; /* Reduced margin */
    margin-bottom: 0.1rem;
    min-height: 1.5rem; /* Reduced min-height */
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-item-price {
    font-family: 'Outfit', sans-serif;
    font-size: 0.8rem; /* Reduced from 0.95rem */
    color: #DCCCB5;
    margin-bottom: 0.5rem; /* Reduced margin */
}

.btn-preorder {
    width: calc(100% - 3rem); /* Make button less prominent */
    margin-bottom: 0.5rem; /* Reduced margin */
    padding: 0.4rem; /* Reduced padding */
    background: transparent;
    color: #A5A5A5;
    border: 1px solid rgba(220, 204, 181, 0.3);
    border-radius: 4px;
    font-family: 'Outfit', sans-serif;
    font-size: 0.65rem; /* Reduced font size */
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Lightbox Styles */
.shop-lightbox {
    display: none;
    position: fixed;
    z-index: 9999; /* Above everything */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95); /* Very dark backdrop */
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.shop-lightbox.active {
    display: flex;
    opacity: 1;
}

.shop-lightbox-content {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    animation: zoomIn 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.shop-lightbox-close {
    position: absolute;
    top: 20px;
    right: 35px;
    color: #E6E1D8;
    font-size: 40px;
    font-weight: 300;
    cursor: pointer;
    transition: color 0.3s;
    z-index: 10000;
}

.shop-lightbox-close:hover {
    color: #DCCCB5;
}

@keyframes zoomIn {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.btn-preorder:hover {
    color: #000;
    background: #DCCCB5;
    border-color: #DCCCB5;
}

@media (max-width: 1200px) {
    .shop-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}



/* ------------------------------------- */
/* INFO SECTION (CINEMATIC 16:9 LAYOUT)  */
/* ------------------------------------- */

/* Removed duplicate .info-new-layout and .info-left-content blocks that restricted width to 50% */

.info-main-title {
    font-family: 'Akzidenz-Grotesk Pro Super', 'Outfit', sans-serif;
    font-size: 2.2rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: #fff;
    margin-bottom: 1rem; /* Reduced */
    text-transform: uppercase;
}

.info-data-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 1rem; /* Reduced */
}

.info-data-item {
    display: flex;
    align-items: flex-start;
    padding: 0.6rem 0; /* Reduced to tighten gaps */
    border-bottom: 1px solid rgba(220, 204, 181, 0.15);
}

.info-data-item:first-child {
    border-top: 1px solid rgba(220, 204, 181, 0.15);
}

.info-data-item.highlight {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(220, 204, 181, 0.15);
    padding: 0.6rem 0; /* Reduced */
}

.info-icon {
    flex: 0 0 40px;
    font-size: 1.2rem;
    color: #DCCCB5;
    text-align: left;
    padding-top: 0.1rem;
}

.info-data-item.highlight .info-value {
    color: #1DB954; /* Spotify green highlight */
    font-weight: 500;
    font-size: 1.05rem; /* Slightly larger */
    letter-spacing: 0.1em;
}

.info-data-item.highlight .info-icon {
    color: #1DB954; /* Spotify green highlight */
    font-size: 1.3rem;
}

.info-label {
    flex: 0 0 160px;
    font-family: 'Outfit', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.15em;
    color: rgba(220, 204, 181, 0.6);
    text-transform: uppercase;
    padding-top: 0.2rem;
}

.info-value {
    flex: 1;
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 300;
    color: #fff;
    line-height: 1.5;
}

.info-bio-text, .info-bio-text p {
    font-family: 'Open Sauce', 'Outfit', sans-serif;
    font-size: 0.95rem; /* Reduced to fit perfectly without scroll on smaller screens */
    line-height: 1.6;
    font-weight: 300;
    color: #E6E1D8;
    text-align: left;
}

.info-bio-text p {
    margin-bottom: 1.2rem; /* Comfortable spacing */
}

.info-bio-text p:last-child {
    margin-bottom: 0;
}

/* Make EPK Info text much more impressive on Desktop screens */
@media (min-width: 1025px) {
    /* Combine normal sentences into one flowing paragraph */
    .info-bio-text p:not(:last-child) {
        display: inline;
        font-size: 1.2rem;
        line-height: 1.8;
        letter-spacing: 0.02em;
        color: rgba(255, 255, 255, 0.9);
        margin-right: 0.4rem;
        transition: color 0.3s ease;
    }
    
    .info-bio-text p:not(:last-child):hover {
        color: #fff;
    }
    
    /* Highlight the final bold statement ("A NEW WAVE IS COMING...") */
    .info-bio-text p:last-child {
        display: block;
        font-family: 'Akzidenz-Grotesk Pro Super', 'Outfit', sans-serif;
        font-size: 1.4rem;
        font-weight: 600;
        letter-spacing: 0.15em;
        text-transform: uppercase;
        color: #DCCCB5;
        text-shadow: 0 0 20px rgba(220, 204, 181, 0.3);
        margin-top: 3rem;
        border-left: 3px solid #DCCCB5;
        padding-left: 1.2rem;
    }

    /* Match the top part (info-data-item) to the bottom part's impressive typography */
    #epk-djinfo .info-label {
        font-size: 1rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        flex: 0 0 220px;
    }
    
    #epk-djinfo .info-value {
        font-size: 1.2rem;
        line-height: 1.8;
        font-weight: 300;
        color: rgba(255, 255, 255, 0.9);
    }
    
    #epk-djinfo .info-data-item.highlight .info-value {
        font-size: 1.3rem;
    }
    
    #epk-djinfo .info-icon {
        font-size: 1.5rem;
        flex: 0 0 50px;
    }
}

/* info-right-visual and info-hero-image have been merged with epk-visual-column above */


.bio-layout .info-main-title {
    font-size: 2rem;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.epk-bio p {
    font-family: 'Outfit', sans-serif;
    font-size: 0.9rem; /* Reduced */
    line-height: 1.6; /* Reduced */
    font-weight: 300;
    color: #E6E1D8;
    margin-bottom: 1rem; /* Reduced */
    text-align: left;
}
.epk-bio p:last-child {
    margin-bottom: 0;
}



#epk-photos {
    padding: 0 !important; /* Override auto padding */
    overflow: visible !important; /* Allow poster to break out */
    display: none; /* Fix visibility bug */
}

#epk-photos.active {
    display: flex;
    flex-direction: column;
}

.epk-photos-layout {
    display: flex;
    justify-content: center; /* Center the grid and preview perfectly together */
    align-items: flex-start;
    gap: 1.5rem; /* Tight, graphical gap between the two sections */
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    height: 100%;
    padding: 0 4rem; /* Side padding */
    position: relative;
}

.epk-thumbnails-grid {
    flex: 1; /* Take the available space on the left */
    max-width: 700px; /* But don't let it become massive */
    height: 100%;
    padding: 0;
    margin-top: 1.5rem; /* Comfortable space below the sub-menus */
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: auto;
    gap: 0.5rem;
    align-content: flex-start;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.epk-thumbnails-grid::-webkit-scrollbar {
    display: none;
}

.epk-thumb-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    aspect-ratio: 1526 / 2752; /* Ensure thumbnails match original photo proportions vertically */
}

.epk-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%; 
    filter: none;
    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 2px;
}

.epk-thumb:hover {
    filter: brightness(1.1);
    border-color: rgba(220, 204, 181, 0.3);
    transform: translateY(-2px);
}

.epk-thumb.active {
    filter: brightness(1);
    border-color: #DCCCB5;
    box-shadow: 0 0 15px rgba(220, 204, 181, 0.2);
    transform: scale(1.03);
    z-index: 2;
}

.epk-preview-container {
    flex: 0 0 auto; /* Do not grow or shrink */
    position: relative; /* Normal flex flow again */
    bottom: auto;
    right: auto;
    width: calc((100vh - 200px) * 0.5545); /* BUGFIX: Shrink 5% to guarantee visibility. */
    height: auto; /* Let the wrapper dictate the height */
    margin-top: -3rem; /* Slightly less push up to balance the shrink */
    display: flex;
    flex-direction: column;
    align-items: stretch; /* Force download bar to stretch to wrapper width */
    justify-content: flex-start;
    padding: 0;
    z-index: 2; /* Behind the header if it overlaps */
}

.epk-preview-wrapper {
    position: relative;
    top: auto;
    left: auto;
    width: 100%; /* Take exact calculated width from parent */
    height: calc(100vh - 200px); /* Shrunk ~5% to guarantee room for the download bar at the bottom */
    aspect-ratio: 1526 / 2752; /* Strict aspect ratio */
    max-width: none;
    flex-shrink: 0; /* Never squash */
    z-index: 1;
    overflow: hidden;
    border: 1px solid rgba(220, 204, 181, 0.3);
}

.epk-preview-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover; /* Since wrapper matches aspect ratio, cover works like contain but fills perfectly */
    object-position: center top;
    border-radius: 0;
    box-shadow: 0 0 40px rgba(0,0,0,0.8);
    filter: none;
    transition: opacity 0.3s ease;
}

/* Minimal Single Download Bar */
.epk-download-bar-container {
    width: 100%; /* Perfectly matches width of wrapper */
    height: 24px; /* Reduced by half as requested */
    min-height: 24px; /* Guarantee it doesn't squash */
    margin: 0.5rem 0 0 0; /* Gap between image and bar */
    background: #080808;
    border: 1px solid rgba(220, 204, 181, 0.3);
    border-radius: 2px;
    display: flex;
    align-items: center;
    padding: 0 1rem; /* Tighter padding for thinner bar */
    gap: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    flex-shrink: 0; /* Prevent shrinking */
    z-index: 50; /* Guarantee visibility above gradients */
}

.epk-download-bar-container:hover {
    background: #111;
    border-color: rgba(220, 204, 181, 0.6);
}

.epk-download-bar-container .download-icon {
    color: #DCCCB5;
    font-size: 0.8rem; /* Smaller icon to fit the 24px height */
}

.epk-download-track {
    flex: 1;
    height: 3px;
    background: rgba(220, 204, 181, 0.15);
    border-radius: 2px;
    position: relative;
    overflow: hidden;
}

.epk-download-fill {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 60%; /* Static visual fill */
    background: #DCCCB5;
    transition: width 0.1s linear;
    box-shadow: 0 0 10px rgba(220, 204, 181, 0.8); /* Glow effect when filling */
}



/* ========================================= */
/* MOBILE OVERLAY & MUSIC BUTTON REFINEMENTS */
/* ========================================= */

/* ========================================= */
/* PREMIUM HEADER HOVER EFFECTS              */
/* ========================================= */
.music-category-title, .shop-title, .epk-title, .section-title {
    background-image: linear-gradient(to right, #fff, #fff);
    background-size: 0% 2px;
    background-position: center bottom;
    background-repeat: no-repeat;
    transition: background-size 0.5s cubic-bezier(0.25, 1, 0.5, 1), color 0.4s ease, text-shadow 0.4s ease;
    cursor: pointer;
    align-self: center;
    display: inline-block;
    padding-bottom: 8px; /* Room for underline */
}

/* Specific alignments since they are now inline-block */
.shop-title, .section-title {
    margin-left: auto;
    margin-right: auto;
}

.music-category-title:hover, .shop-title:hover, .epk-title:hover, .section-title:hover {
    background-size: 100% 2px;
    color: #fff !important;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.6);
}

/* ========================================= */
/* MOBILE ARCHITECTURE (MAX-WIDTH: 1024PX)   */
/* ========================================= */

.mobile-quick-home {
    display: none;
}

@media (max-width: 1024px) {
    :root {
        --mobile-vh: 100dvh;
        --safe-top: env(safe-area-inset-top, 0px);
        --safe-bottom: env(safe-area-inset-bottom, 0px);
        --safe-left: env(safe-area-inset-left, 0px);
        --safe-right: env(safe-area-inset-right, 0px);
    }

    html, body {
        width: 100vw;
        height: auto;
        min-height: var(--mobile-vh);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: none;
    }

    body.nav-open {
        overflow: hidden;
        position: fixed;
        width: 100%;
        height: var(--mobile-vh);
    }

    /* ------------------------------------- */
    /* HEADER & NAVBAR (MOBILE)              */
    /* ------------------------------------- */
    .background-effects {
        position: fixed;
        height: 100dvh;
    }

    .navbar {
        height: calc(140px + var(--safe-top));
        padding: calc(2rem + var(--safe-top)) 1.5rem 0 1.5rem;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        border-bottom: none !important;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1000;
        width: 100vw;
        display: block;
    }

    .nav-left {
        display: none;
    }

    .nav-center {
        position: absolute;
        top: calc(4.5rem + var(--safe-top));
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        text-align: center;
    }

    .nav-center .logo {
        font-size: 3.2rem;
        letter-spacing: 0.35em;
        font-weight: 600;
        color: #F2F2F2;
    }

    .nav-right {
        position: absolute;
        top: calc(1rem + var(--safe-top));
        left: 0;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 1.5rem;
    }

    .nav-right .search-container,
    .nav-right .nav-icon-home {
        display: none;
    }

    .language-selector {
        font-size: 1rem;
        margin-right: 0;
        color: #A5A5A5;
        letter-spacing: 0.1em;
    }
    
    .mobile-lang-icon {
        display: inline-block !important;
    }

    .mobile-menu-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.8rem;
        color: #DCCCB5;
        background: transparent;
        border: none;
        cursor: pointer;
    }

    /* ------------------------------------- */
    /* FULLSCREEN MOBILE MENU                */
    /* ------------------------------------- */
    .main-menu {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: var(--mobile-vh);
        background: #050505;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding: calc(1rem + var(--safe-top)) 2rem calc(1rem + var(--safe-bottom)) 2rem;
        transform: translateY(-100%);
        transition: transform 0.5s cubic-bezier(0.85, 0, 0.15, 1);
        z-index: 1000;
        overflow-y: auto;
    }

    .main-menu.active {
        transform: translateY(0);
    }

    .mobile-menu-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .mobile-menu-logo {
        font-family: 'Akzidenz-Grotesk Pro Super', 'Outfit', sans-serif;
        font-size: 1.4rem;
        letter-spacing: 0.3em;
        color: #fff;
    }

    .mobile-menu-close {
        background: transparent;
        border: none;
        color: #fff;
        font-size: 1.8rem;
        cursor: pointer;
    }

    .main-menu ul {
        flex-direction: column;
        gap: 0.2rem;
        width: 100%;
        text-align: left;
        margin-bottom: auto;
    }

    .main-menu ul li {
        width: 100%;
    }

    .main-menu ul li .dot {
        display: none;
    }

    .main-menu ul li a {
        font-size: 1.5rem;
        letter-spacing: 0.2em;
        padding: 0;
        display: block;
        color: #E6E1D8;
    }

    .main-menu ul li a.active {
        color: #DCCCB5;
    }

    .mobile-menu-socials {
        display: flex;
        gap: 1.5rem;
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .mobile-menu-socials a {
        color: #A5A5A5;
        font-size: 1.5rem;
        transition: color 0.3s ease;
    }
    
    .mobile-menu-socials a img {
        width: 1.5rem;
        height: 1.5rem;
        opacity: 0.6;
    }

    .mobile-bottom-tabs {
        display: none !important;
    }

    .mobile-bottom-tabs .tab-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
        color: #A5A5A5;
        text-decoration: none;
        font-size: 0.7rem;
        letter-spacing: 0.1em;
        font-family: 'Outfit', sans-serif;
    }

    .mobile-bottom-tabs .tab-item i {
        font-size: 1.2rem;
        color: #DCCCB5;
    }

    /* ------------------------------------- */
    /* HERO SECTION (MOBILE)                 */
    /* ------------------------------------- */
    .hero {
        height: var(--mobile-vh);
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        text-align: left;
        width: 100vw;
        overflow: hidden;
        position: relative;
    }

    .hero-image-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: var(--mobile-vh);
        z-index: 1;
        mix-blend-mode: lighten;
    }

    .hero-image {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center 45%;
    }

    .black-gradient-bottom {
        position: absolute;
        bottom: 0; left: 0; right: 0; top: 0;
        height: 100%;
        background: linear-gradient(to right, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 70%, transparent 100%), linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.2) 30%, transparent 100%);
    }

    .hero-text {
        position: relative;
        top: 0 !important;
        left: 0 !important;
        z-index: 10;
        width: 100%;
        height: 100%;
        padding: calc(180px + var(--safe-top)) 2.5rem calc(6rem + var(--safe-bottom)) 2.5rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        opacity: 1 !important;
        animation: none !important;
        transform: translateY(55px) !important;
    }

    .mobile-quote-icon {
        display: none !important;
    }

    .quote {
        font-size: 1.3rem;
        line-height: 1.3;
        letter-spacing: 0.02em;
        margin-bottom: 0.5rem;
        text-align: left;
        font-family: 'Akzidenz-Grotesk Pro Super', sans-serif;
        max-width: 340px;
    }
    
    .quote-line.quote-gold {
        color: #DCCCB5;
        text-shadow: 0 0 10px rgba(220, 204, 181, 0.4);
        margin-top: 5px;
        display: inline-block;
    }

    .mobile-hero-extras {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        animation: fadeIn 2s ease forwards 0.5s;
        margin-top: auto;
        width: 100%;
    }

    .hero-divider {
        width: 50px;
        height: 2px;
        background-color: #DCCCB5;
        margin-bottom: 0.5rem;
    }

    .hero-subtitle {
        font-family: 'Outfit', sans-serif;
        font-size: 0.85rem;
        letter-spacing: 0.4em;
        color: #DCCCB5;
        font-weight: 500;
        text-transform: uppercase;
    }

    .hero-explore-btn {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        color: #DCCCB5;
        background-color: transparent;
        border: 1px solid rgba(220, 204, 181, 0.5);
        padding: 0.8rem 1.8rem;
        border-radius: 4px;
        text-decoration: none;
        font-size: 0.8rem;
        font-weight: 400;
        letter-spacing: 0.2em;
        transition: all 0.3s ease;
        text-transform: uppercase;
    }
    
    .hero-explore-btn i {
        display: inline-block !important;
        font-size: 0.7rem;
    }

    .mobile-scroll-indicator {
        display: none !important;
    }

    .scroll-text {
        font-family: 'Outfit', sans-serif;
        font-size: 0.65rem;
        letter-spacing: 0.3em;
        color: #DCCCB5;
        text-transform: uppercase;
    }

    .scroll-line {
        width: 1px;
        height: 40px;
        background: linear-gradient(to bottom, #DCCCB5, transparent);
    }
    
    .scroll-dot {
        width: 6px;
        height: 6px;
        background-color: #DCCCB5;
        border-radius: 50%;
        box-shadow: 0 0 10px #DCCCB5;
        margin-top: -6px;
    }

    @keyframes floatUpDown {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(5px); }
    }

    /* ------------------------------------- */
    /* ABOUT SECTION (MOBILE)                */
    /* ------------------------------------- */
    .about-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding: calc(135px + var(--safe-top)) 1.5rem calc(4rem + var(--safe-bottom)) 1.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        overflow-y: auto;
        background-image: 
            radial-gradient(circle at center 45%, rgba(220, 40, 15, 0.25) 0%, rgba(20, 5, 5, 0.5) 40%, rgba(10, 2, 2, 0.85) 100%),
            url('Photos/about.jpeg');
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
    }

    .about-content {
        flex-direction: column;
        gap: 3rem;
        margin-top: 0;
        align-items: center;
        text-align: center;
        width: 100%;
        position: relative;
        z-index: 2;
    }

    .about-text {
        width: 100%;
        max-width: 100%;
        text-align: center;
        background: rgba(0, 0, 0, 0.25);
        padding: 2rem 0.5rem; /* Expanded by 1rem (~0.5 cm) on each side */
        border-radius: 12px;
        box-shadow: 0 10px 40px rgba(0,0,0,0.3);
    }

    .about-text p[data-i18n-key="about_p3"] {
        font-weight: 800 !important;
        white-space: nowrap !important;
        font-size: 1.2rem !important;
    }

    .about-text p {
        font-size: 1rem;
        line-height: 1.6;
        text-align: center;
        color: rgba(230, 225, 216, 0.85); /* Reduced text brightness */
    }

    .about-text p strong {
        color: #F2F2F2; /* Warm white */
    }

    .about-text p.highlight {
        font-size: 1.2rem;
        text-align: center;
    }

    .about-video-container {
        display: none;
    }

    /* ------------------------------------- */
    /* CONTACT SECTION (MOBILE)              */
    /* ------------------------------------- */
    .contact-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding: calc(135px + var(--safe-top)) 1.5rem calc(4rem + var(--safe-bottom)) 1.5rem;
        overflow-y: auto;
        display: block;
    }

    .contact-container {
        width: 100%;
        padding: 0;
    }

    .contact-content-row {
        flex-direction: column;
        gap: 2rem;
    }

    .contact-image-column {
        display: none;
    }

    .contact-form-wrapper {
        width: 100%;
        padding: 2rem 0;
        margin-top: 0;
    }

    .contact-main-title {
        font-size: 1.8rem;
    }

    .form-group input,
    .form-group textarea {
        font-size: 0.9rem;
        padding: 0.8rem;
        width: 100%;
        box-sizing: border-box;
    }
    
    .btn-send {
        width: 100%;
    }

    /* ------------------------------------- */
    /* TOUR SECTION (MOBILE)                 */
    /* ------------------------------------- */
    .tour-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding: calc(135px + var(--safe-top)) 1.5rem calc(4rem + var(--safe-bottom)) 1.5rem;
        display: block;
        overflow-y: auto;
    }

    .tour-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding: 2rem 0;
        width: 100%;
    }

    .tour-date {
        flex: none;
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.2);
        padding-right: 0;
        padding-bottom: 1rem;
        margin-right: 0;
        margin-bottom: 0;
        width: 100%;
    }

    .tour-details {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        width: 100%;
    }

    .tour-action {
        margin-left: 0;
        width: 100%;
        text-align: left;
    }

    /* ------------------------------------- */
    /* MUSIC, VIDEOS & NEWS SECTIONS (MOBILE)*/
    /* ------------------------------------- */
    .music-section, .videos-section, .news-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding: calc(135px + var(--safe-top)) 1.5rem calc(4rem + var(--safe-bottom)) 1.5rem;
        display: block;
        overflow-y: auto;
    }

    .music-container {
        gap: 1.5rem; /* Reduced gap between singles and albums sections */
        padding-bottom: 2rem;
    }

    .music-category-title {
        font-size: 1.5rem;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }

    .music-category-title::before {
        display: none; /* Hide decorative line for cleaner mobile look */
    }

    .music-grid {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    #music-grid-albums {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    #music-grid-albums::before {
        display: none;
    }

    .music-album-container {
        flex-direction: column;
        gap: 0;
        padding-bottom: 0;
    }

    .music-album-card {
        width: 100%;
        position: relative;
        top: 0;
    }

    .music-album-tracks {
        width: 100%;
    }

    .music-single-container {
        flex-direction: column;
        background: transparent !important;
        border: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }

    .music-track-row {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 0 !important;
        padding: 15px 0 !important;
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .music-track-row:last-child {
        border-bottom: none !important;
    }

    .desktop-only { display: none !important; }
    .mobile-only-row { display: flex !important; }

    .track-left-group {
        display: flex;
        flex-direction: row !important;
        align-items: center !important;
        gap: 15px !important;
    }
    
    .mobile-track-thumb {
        display: block;
        width: 50px !important;
        height: 50px !important;
        object-fit: cover !important;
        border-radius: 4px !important;
        flex-shrink: 0;
    }
    
    .track-info {
        display: flex;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 4px !important;
    }
    
    .track-name {
        font-family: 'Outfit', sans-serif !important;
        font-size: 1rem !important;
        font-weight: 300 !important;
        color: #E6E1D8 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
    }
    
    .track-artist {
        display: block;
        font-family: 'Outfit', sans-serif !important;
        font-size: 0.75rem !important;
        font-weight: 300 !important;
        color: rgba(230, 225, 216, 0.5) !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
    }
    
    .track-number {
        display: none !important;
    }

    .music-buttons {
        width: auto !important;
        flex-direction: row !important;
        gap: 12px !important;
        display: flex;
        align-items: center;
    }

    .btn-music {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        padding: 0 !important;
        justify-content: center !important;
        align-items: center !important;
        border-radius: 6px !important;
        background: #DCCCB5;
        color: #050505;
        font-size: 0.9rem;
        border: none;
        display: flex;
    }
    
    .btn-music.btn-download {
        background: transparent;
        color: #DCCCB5;
        border: 1px solid rgba(220, 204, 181, 0.4);
        font-size: 1.1rem;
    }

    .btn-text {
        display: none !important;
    }
    
    .music-album-card {
        display: none;
    }
    
    .music-album-container {
        gap: 0;
    }

    .news-container {
        width: 100%;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 3rem;
        height: auto;
        overflow: visible;
    }

    .videos-container {
        width: 100%;
        padding: 0 2.5rem;
        display: flex;
        flex-direction: row;
        gap: 1.5rem;
        height: auto;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        align-items: center;
        scrollbar-width: none;
    }
    
    .videos-container::-webkit-scrollbar {
        display: none;
    }

    .video-wrapper {
        flex: 0 0 75vw;
        max-width: 300px;
        aspect-ratio: 9/16;
        margin-bottom: 0;
        scroll-snap-align: center;
    }
    
    .video-wrapper::before {
        display: none !important;
    }

    .news-item {
        width: 100%;
        flex: 0 0 100%;
    }
    
    .videos-item {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: grayscale(0%) brightness(1) contrast(1) !important;
    }

    .news-scroll-btn {
        display: none;
    }
    
    .videos-scroll-btn {
        display: flex;
        width: 30px;
        height: 30px;
        font-size: 0.85rem;
        border: 0.5px solid rgba(220, 204, 181, 0.2);
        background: rgba(5, 5, 5, 0.4);
    }
    
    .videos-scroll-btn.left { left: 0.5rem; }
    .videos-scroll-btn.right { right: 0.5rem; }

    /* ------------------------------------- */
    /* SHOP SECTION (MOBILE)                 */
    /* ------------------------------------- */
    .shop-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding-top: calc(135px + var(--safe-top)) !important;
        padding-bottom: calc(4rem + var(--safe-bottom)) !important;
        display: block;
        overflow-y: auto;
    }

    .shop-header {
        margin: 0;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .shop-grid {
        display: flex !important;
        padding: 0 1rem;
        gap: 0.8rem;
    }
    .shop-item {
        flex: 0 0 calc(50% - 0.4rem) !important; /* 2 items per row side-by-side */
        max-width: calc(50% - 0.4rem) !important;
    }

    /* ------------------------------------- */
    /* EPK SECTION (MOBILE)                  */
    /* ------------------------------------- */
    .epk-section {
        height: auto;
        min-height: var(--mobile-vh);
        padding-top: calc(135px + var(--safe-top)) !important;
        padding-bottom: calc(4rem + var(--safe-bottom)) !important;
        display: block;
        overflow-y: auto;
    }

    .epk-wrapper {
        height: auto;
    }

    .epk-subnav {
        padding: 1rem 1.5rem;
        gap: 2rem;
        justify-content: center;
        position: relative;
        z-index: 10;
        background: rgba(5, 5, 5, 0.95);
    }

    .epk-tab {
        font-size: 0.8rem;
    }

    .epk-content {
        height: auto;
    }

    .epk-panel {
        display: none;
        position: relative;
        height: auto;
    }

    .epk-panel.active {
        display: block;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    #epk-photos.active {
        display: flex;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .info-new-layout {
        display: flex;
        flex-direction: column-reverse;
        height: auto;
        overflow: visible;
    }

    .epk-text-column, .info-left-content {
        padding: 2rem 1.5rem;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin-top: -225px; /* ~6cm overlap over the image (3cm more than before) */
        position: relative;
        z-index: 10;
    }

    #epk-djinfo .info-left-content {
        margin-top: -185px; /* Shift text down by ~1cm (40px) */
    }

    .info-right-visual {
        position: relative;
        width: 100vw;
        height: 50vh;
        left: -1.5rem; /* pull out of padding if wrapper has it, or just 100vw */
    }

    .epk-visual-column img, .info-hero-image {
        opacity: 0.8;
    }

    .epk-title, .info-main-title {
        font-size: 2rem;
    }

    .sub-genre-item {
        flex-wrap: wrap;
    }
    
    .sub-genre-item .info-label {
        flex: 1;
    }
    
    .sub-genre-item .info-value {
        flex: 0 0 calc(100% - 40px);
        margin-left: 40px;
        margin-top: 0.3rem;
    }

    .epk-photos-layout {
        flex-direction: column-reverse;
        padding: 0 1.5rem;
        gap: 2rem;
    }

    .epk-preview-container {
        width: 100%;
        height: auto;
        margin-top: 0;
    }

    .epk-preview-wrapper {
        height: 60vh;
        width: 100%;
    }

    .epk-thumbnails-grid {
        width: 100%;
        max-width: 100%;
        grid-template-columns: repeat(3, 1fr);
        margin-top: 0;
        height: auto;
        max-height: 50vh;
    }
    
    .mobile-quick-home {
        display: none !important;
    }
}