/* Specific styles for the Lucky Cart project page */

.lucky-page-wrapper {
    position: relative;
    width: 1728px;
    height: 3340px;
    background-color: #294452;
    overflow: hidden;
}

/* Header Adjustments for Dark Page */
.site-header {
    background-color: rgba(41, 68, 82, 0.95);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.site-header .main-nav a {
    color: #ffffff;
}

.site-header .main-nav a:hover {
    background-color: #ffffff;
    color: #294452;
}

.site-header .btn-contact {
    color: #ffffff;
}

body.lucky-cart-theme .site-header .btn-contact:hover,
body.lucky-cart-theme .site-header .btn-contact:hover span {
    background-color: #ffffff !important;
    color: #294452 !important;
}

/* SECTION 1: HERO (NEW FLEX Figma LAYOUT) */
.lc-hero-section-new {
    position: absolute;
    left: 76px;
    top: 86px;
    width: 1578.6px;
    height: 513.15px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 38px;
    pointer-events: none;
    z-index: 10;
}

.lc-hero-content-new {
    width: 620px;
    height: 330px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0px;
    gap: 21px;
    color: #FFFFFF;
    font-family: 'Source Code Pro', monospace;
    pointer-events: auto;
    flex: none;
    order: 0;
    flex-grow: 0;
}

.lc-hero-content-new h1 {
    font-size: 40px;
    line-height: 50px;
    font-weight: 700;
    margin: 0;
    color: #FFFFFF;
}

.lc-hero-content-new p {
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
    opacity: 0.9;
}

.lc-hero-tags-new {
    font-size: 14px;
    font-weight: 500;
    color: #FFF26B;
}

/* Back button (BOUTON TOUT VOIR) */
.lc-back-button-new {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 0px;
    width: 46px;  /* Figma width */
    height: 19px; /* Figma height */
    cursor: pointer;
    transition: transform 0.3s ease;
    pointer-events: auto;
    flex: none;
    order: 1;
    flex-grow: 0;
    margin-top: 21px; /* Space between tags and button */
}

.lc-back-button-new:hover {
    transform: translateY(4px);
}

.lc-back-button-new img {
    width: 24px;
    height: 40.62px;
    filter: brightness(0) invert(1); /* Render SVG as white */
    transform: rotate(0deg); /* Oriented downwards */
    object-fit: contain;
}

/* Phone Mockups (mea) Container */
.lc-mea-container {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 3px;
    width: 920.6px;
    height: 513.15px;
    flex: none;
    order: 2;
    flex-grow: 0;
    pointer-events: auto;
}

.lc-phone-1 {
    width: 300.38px;
    height: 455.35px;
    background: url('../09-Lucky%20cart/hero/mea-1.webp') no-repeat center/contain;
    flex: none;
    order: 0;
    flex-grow: 0;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    cursor: pointer;
}

.lc-phone-2 {
    width: 303.93px;
    height: 513.15px;
    background: url('../09-Lucky%20cart/hero/mea-2.webp') no-repeat center/contain;
    flex: none;
    order: 1;
    flex-grow: 0;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    cursor: pointer;
}

.lc-phone-3 {
    width: 310.29px;
    height: 483.3px;
    background: url('../09-Lucky%20cart/hero/mea-3.webp') no-repeat center/contain;
    flex: none;
    order: 2;
    flex-grow: 0;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    cursor: pointer;
}

/* Custom brand cursor */
.lc-brand-cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 90px;
    height: 90px;
    pointer-events: none;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
    opacity: 0;
    will-change: transform;
    backdrop-filter: blur(6px);
}

.lc-brand-cursor.active {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
}

.lc-brand-cursor img {
    width: 60px;
    height: 60px;
    object-fit: contain;
}

/* Decorative White Dot */
.lc-ellipse-3 {
    position: absolute;
    left: 584.34px;
    top: 492.72px;
    width: 21.05px;
    height: 20.43px;
    background: #FFFEFF;
    border-radius: 50%;
}

/* BLOC 2: PARTNERS LOGO BAR CONTAINER */
.lc-bloc2-container {
    position: absolute;
    left: 0px;
    top: 726px;
    width: 1728px;
    height: 131.37px;
    background: transparent;
    z-index: 2;
    overflow: hidden; /* Hide the scrolling overflow */
}

.lc-logo-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0;
    width: max-content;
    height: 113.37px;
    position: absolute;
    top: 18px; /* 874px - 726px - 130px shift => 18px relative to container */
    left: 48px; /* Left offset from Figma */
    pointer-events: auto;
}

.lc-logo-track {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 71px; /* Gap from Figma specification */
    padding-right: 71px; /* Guarantee identical distance between the two tracks */
    animation: lc-scroll-logos 30s linear infinite;
    flex-shrink: 0;
}

@keyframes lc-scroll-logos {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-100%, 0, 0);
    }
}

.lc-logo-bar img {
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.7;
    transition: opacity 0.3s ease;
    flex-shrink: 0;
}

/* Individual Logo Sizing based on Figma specifications (Intermarché and E.Leclerc scaled up) */
.lc-logo-bar img:nth-child(6n+1) { width: 140.98px; height: 112.98px; margin-right: 75px; } /* Carrefour */
.lc-logo-bar img:nth-child(6n+2) { width: 194px; height: 113.37px; }    /* General Mills */
.lc-logo-bar img:nth-child(6n+3) { width: 340px; height: 75px; }        /* Intermarché (scaled up from 280x62) */
.lc-logo-bar img:nth-child(6n+4) { width: 248px; height: 57px; margin-right: 35px; }        /* Mondelez */
.lc-logo-bar img:nth-child(6n+5) { width: 248px; height: 95px; }        /* Système U */
.lc-logo-bar img:nth-child(6n+6) { width: 390px; height: 103px; margin-left: -50px; margin-right: -30px; }        /* E.Leclerc (scaled up from 340x90) */

.lc-logo-bar img:hover {
    opacity: 1;
}

.lc-logo-bar-gradient-left {
    position: absolute;
    width: 250px;
    height: 131px;
    left: 0px;
    top: 0px;
    background: linear-gradient(90deg, #294452 0%, rgba(41, 68, 82, 0) 100%);
    z-index: 3;
    pointer-events: none;
}

.lc-logo-bar-gradient-right {
    position: absolute;
    width: 250px;
    height: 131px;
    right: 0px; /* Anchored to right */
    top: 0px;
    background: linear-gradient(270deg, #294452 0%, rgba(41, 68, 82, 0) 100%);
    z-index: 3;
    pointer-events: none;
}

/* BLOC 3: DOTS GRID & LAPTOP & WHEEL GAME CONTAINER */
.lc-bloc3-container {
    position: absolute;
    width: 1399px;
    height: 2400px;
    left: 194px;
    top: 945px;
    z-index: 4;
}

/* Dots Grid Background inside Bloc 3 Container */
.fond-lucky-cart-2 {
    position: absolute;
    width: 1137.28px;
    height: 1446.86px;
    left: 98.13px; /* 292.13px - 194px */
    top: 0px; /* 1075px - 1075px */
    pointer-events: none;
    z-index: 1;
}

.lc-flipped-grid {
    position: absolute;
    width: 100%;
    height: 713px;
    top: 600px;
    left: 0;
    transform: scaleY(-1);
}

/* Columns of Bloc 3 (absolute positions relative to fond-lucky-cart-2) */
.lc-frame-b3 {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 44.65px;
    width: 18.29px;
    pointer-events: none;
}

.lc-frame-b3-1  { left: 0px;      top: 64px; }
.lc-frame-b3-2  { left: 89.91px;  top: 128.09px; }
.lc-frame-b3-3  { left: 179.82px; top: 1px; }
.lc-frame-b3-4  { left: 269.73px; top: 128.09px; }
.lc-frame-b3-5  { left: 360.64px; top: 128.09px; }
.lc-frame-b3-6  { left: 459.54px; top: 63px; }
.lc-frame-b3-7  { left: 559.45px; top: 0px; }
.lc-frame-b3-8  { left: 659.36px; top: 128.09px; }
.lc-frame-b3-9  { left: 753.87px; top: 0px; }
.lc-frame-b3-10 { left: 846.27px; top: 128.09px; }
.lc-frame-b3-11 { left: 939.18px; top: 128.09px; }
.lc-frame-b3-12 { left: 1034.08px; top: 0px; }
.lc-frame-b3-13 { left: 1118.99px; top: 128.09px; }

.lc-dot {
    width: 18.29px;
    height: 18.29px;
    border-radius: 50%;
    flex: none;
    align-self: stretch;
    flex-grow: 0;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}


/* Individual dot floating animations to create a completely random and organic cloud effect */
@keyframes lc-float-y {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -30px, 0); }
}
@keyframes lc-float-diag {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-20px, 25px, 0); }
}
@keyframes lc-float-x {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(25px, -15px, 0); }
}

.lc-frame-b3:nth-child(3n+1) .lc-dot:nth-child(3n+1) { animation: lc-float-y 5.5s ease-in-out infinite alternate; animation-delay: -1.2s; }
.lc-frame-b3:nth-child(3n+1) .lc-dot:nth-child(3n+2) { animation: lc-float-diag 7.5s ease-in-out infinite alternate; animation-delay: -2.8s; }
.lc-frame-b3:nth-child(3n+1) .lc-dot:nth-child(3n+3) { animation: lc-float-x 6.5s ease-in-out infinite alternate; animation-delay: -4.4s; }

.lc-frame-b3:nth-child(3n+2) .lc-dot:nth-child(3n+1) { animation: lc-float-x 7.2s ease-in-out infinite alternate; animation-delay: -1.9s; }
.lc-frame-b3:nth-child(3n+2) .lc-dot:nth-child(3n+2) { animation: lc-float-y 6.8s ease-in-out infinite alternate; animation-delay: -3.7s; }
.lc-frame-b3:nth-child(3n+2) .lc-dot:nth-child(3n+3) { animation: lc-float-diag 8.4s ease-in-out infinite alternate; animation-delay: -0.8s; }

.lc-frame-b3:nth-child(3n+3) .lc-dot:nth-child(3n+1) { animation: lc-float-diag 6.7s ease-in-out infinite alternate; animation-delay: -4.9s; }
.lc-frame-b3:nth-child(3n+3) .lc-dot:nth-child(3n+2) { animation: lc-float-x 8.2s ease-in-out infinite alternate; animation-delay: -1.5s; }
.lc-frame-b3:nth-child(3n+3) .lc-dot:nth-child(3n+3) { animation: lc-float-y 7.6s ease-in-out infinite alternate; animation-delay: -3.1s; }

/* Laptop Elements relative to Bloc 3 Container */
.lc-laptop-mockup {
    position: absolute;
    left: 117px; /* 311px - 194px */
    top: 245px; /* 1320px - 1075px */
    width: 1282px;
    height: 647px;
    background: url('../09-Lucky%20cart/Bloc-2/mockup-ordi-LC.webp') no-repeat center/contain;
    z-index: 3;
    pointer-events: none;
}

.lc-laptop-bg {
    position: absolute;
    width: 860px;
    height: 569px;
    left: 235px; /* 429px - 194px */
    top: 274px; /* 1349px - 1075px */
    background: #FFFFFF;
    z-index: 1;
}

.lc-laptop-video-container {
    position: absolute;
    width: 876.57px;
    height: 518px;
    left: 235px; /* 429px - 194px */
    top: 299px; /* 1374px - 1075px */
    z-index: 2;
    overflow: hidden;
    pointer-events: auto;
}

.lc-laptop-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Interactive Wheel Game relative to Bloc 3 Container */
.lc-wheel-game {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    width: 355px;
    height: auto;
    gap: 24px;
    left: 492.5px;
    top: 1044px;
    z-index: 6;
}

.lc-game-title {
    font-family: 'Source Code Pro', monospace;
    font-size: 24px;
    font-weight: 600;
    color: #FFFFFF;
    text-align: center;
    margin: 0;
}

.lc-wheel-video {
    width: 355px;
    height: 354px;
    object-fit: cover;
    border: 12px solid #FFFFFF;
    border-radius: 16px;
    box-shadow: 0px 24px 48px rgba(0, 0, 0, 0.15);
    background-color: #FFFFFF;
    box-sizing: border-box;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
}

.lc-wheel-cta-container {
    width: 122px;
    height: 60px;
    position: relative;
    flex: none;
    order: 1;
    flex-grow: 0;
}

.lc-wheel-cta {
    position: absolute;
    width: 102px;
    height: 32px;
    left: 10.5px;
    top: 23px;
    background: #F94969;
    border-radius: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    text-decoration: none;
    font-family: 'Source Code Pro', monospace;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    transition: transform 0.3s ease, background-color 0.3s ease;
}

.lc-wheel-cta:hover {
    transform: scale(1.05);
    background-color: #e23d5b;
}

/* SECTION 4: BOTTOM GALLERY SECTION (ABSOLUTELY POSITIONED FIGMA SPEC) */
.lc-bottom-gallery-new {
    position: absolute;
    left: -194px; /* 0px - 194px (to align with left 0px of screen/wrapper) */
    top: 1550px;
    width: 1728px;
    height: 800px;
    z-index: 5;
    pointer-events: auto;
}

.lc-gallery-card {
    position: absolute;
    width: 472px;
    height: 328px;
    background-color: #D9D9D9;
    border-radius: 19px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

.lc-gallery-bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.6s ease;
}

.lc-gallery-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.lc-gallery-card:hover .lc-gallery-bg {
    transform: scale(1.05);
}

.lc-gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: linear-gradient(180deg, rgba(41, 68, 82, 0) 0%, rgba(41, 68, 82, 0.9) 100%);
    color: #ffffff;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.lc-gallery-card:hover .lc-gallery-overlay {
    opacity: 1;
}

.lc-gallery-title {
    font-family: 'Source Code Pro', monospace;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 4px;
}

.lc-gallery-desc {
    font-family: 'Source Code Pro', monospace;
    font-size: 12px;
    opacity: 0.8;
}

/* Absolute positions of the 6 Cards from Figma specs */
.lc-card-pos-1 { left: 110px;  top: 0px; }      /* Rectangle 50: left: 110, top: 2176 */
.lc-card-pos-2 { left: 630px;  top: 0px; }      /* Rectangle 51: left: 630, top: 2176 */
.lc-card-pos-3 { left: 1145px; top: 0px; }      /* Rectangle 52: left: 1145, top: 2176 */
.lc-card-pos-4 { left: 110px;  top: 368px; }    /* Row 2: 2176 + 328 + 40 (gap) = 2544 */
.lc-card-pos-5 { left: 630px;  top: 368px; }
.lc-card-pos-6 { left: 1145px; top: 368px; }

/* Responsive scaling for MacBook Pro 16" (1728px reference width) */
@media (max-width: 1728px) {
    .lucky-page-wrapper {
        transform: scale(calc(100vw / 1728));
        transform-origin: top left;
        height: calc(3340px * (100vw / 1728));
    }
}

/* Dark Theme Adjustments for Page Body and Footer */
body.lucky-cart-theme {
    background-color: #294452 !important;
}

body.lucky-cart-theme .site-footer {
    color: #ffffff !important;
    max-width: 100% !important;
    padding: 70px 41px 70px !important;
}

body.lucky-cart-theme .site-footer a {
    color: #ffffff !important;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

body.lucky-cart-theme .site-footer a:hover {
    opacity: 1;
}

/* Apply light/white filters to dark footer assets */
body.lucky-cart-theme .site-footer .contact-icon,
body.lucky-cart-theme .site-footer .social-icon {
    filter: brightness(0) invert(1);
}

body.lucky-cart-theme .site-footer .footer-line-img {
    filter: brightness(0) invert(1);
    opacity: 0.2;
}

/* Header logo adjustments for dark background */
body.lucky-cart-theme .site-header .main-logo {
    filter: brightness(0) invert(1);
}

/* --- PREMIUM POPUP MODAL STYLES --- */
.lc-popup-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.lc-popup-modal.visible {
    opacity: 1;
    pointer-events: auto;
}

.lc-popup-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(16, 26, 32, 0.7);
    backdrop-filter: blur(12px);
    z-index: 1;
}

.lc-popup-content {
    position: relative;
    width: 90%;
    max-width: 960px;
    height: 80vh;
    max-height: 600px;
    background: #203540;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    overflow: hidden;
    z-index: 2;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4);
    transform: scale(0.95) translateY(20px);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
}

.lc-popup-modal.visible .lc-popup-content {
    transform: scale(1) translateY(0);
}

.lc-popup-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: #ffffff;
    font-size: 28px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: background-color 0.3s, transform 0.3s;
}

.lc-popup-close:hover {
    background-color: #F94969;
    transform: rotate(90deg);
}

.lc-popup-body {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: 100%;
}

.lc-popup-image-container {
    flex: 1.2;
    height: 100%;
    background-color: #1a2c35;
    overflow-y: auto;
    overflow-x: hidden;
    border-right: 1px solid rgba(255, 255, 255, 0.05);
    /* Custom scrollbar */
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.2) transparent;
}

.lc-popup-image-container::-webkit-scrollbar {
    width: 4px;
}

.lc-popup-image-container::-webkit-scrollbar-track {
    background: transparent;
}

.lc-popup-image-container::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2);
    border-radius: 2px;
}

.lc-popup-image-container img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: unset;
}

.lc-popup-info {
    flex: 1;
    padding: 50px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #ffffff;
    font-family: 'Source Code Pro', monospace;
    overflow-y: auto;
}

.lc-popup-info h2 {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 20px 0;
    color: #FFF26B;
}

.lc-popup-info p {
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
    opacity: 0.9;
    color: #e5e5e5;
}

/* Responsive adjustment for popup details */
@media (max-width: 768px) {
    .lc-popup-body {
        flex-direction: column;
    }
    .lc-popup-image-container {
        flex: 1;
        height: 50%;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    }
    .lc-popup-info {
        flex: 1;
        padding: 30px 20px;
    }
}

/* --- FULLWIDTH POPUP MODE (image only, no text panel) --- */
.lc-popup-modal.lc-popup-fullwidth .lc-popup-info {
    display: none;
}

.lc-popup-modal.lc-popup-fullwidth .lc-popup-image-container {
    flex: 1;
    border-right: none;
}

.lc-popup-modal.lc-popup-fullwidth .lc-popup-content {
    max-width: 1100px;
}

/* Multi-image stacked scroll */
.lc-popup-multi-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: unset;
}

/* Glassmorphism Navigation Arrows inside Popup Modal */
.lc-popup-nav-arrow {
    position: absolute;
    width: 64px;
    height: 64px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2500;
    cursor: pointer;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.05) 100%);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.25);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
    opacity: 0;
    visibility: hidden;
}

.lc-popup-modal.visible .lc-popup-nav-arrow {
    opacity: 1;
    visibility: visible;
}

.lc-popup-prev {
    left: 40px;
}

.lc-popup-next {
    right: 40px;
}

.lc-popup-nav-arrow:hover {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0.15) 100%);
    border-color: rgba(255, 255, 255, 0.4);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.lc-popup-prev:hover {
    transform: translateY(-50%) scale(1.08) translateX(-2px);
}

.lc-popup-next:hover {
    transform: translateY(-50%) scale(1.08) translateX(2px);
}

.lc-popup-nav-arrow svg {
    width: 24px;
    height: 24px;
    transition: transform 0.2s ease;
}

/* Responsive adjustment for popup navigation */
@media (max-width: 1024px) {
    .lc-popup-prev {
        left: 15px;
    }
    .lc-popup-next {
        right: 15px;
    }
    .lc-popup-nav-arrow {
        width: 48px;
        height: 48px;
    }
    .lc-popup-nav-arrow svg {
        width: 20px;
        height: 20px;
    }
}

/* Video display inside popup */
.lc-popup-video {
    width: 100%;
    height: auto;
    max-height: 100%;
    display: block;
    object-fit: contain;
    background: #000;
}