/* Use sitewide fonts: body = Barlow (--font-body), headings = New Amsterdam (--font-heading) from theme.css */
        /* Typography inherits from theme.css: font-weight 300 (light), line-height 1.3 */
        body {
            overflow-x: hidden;
            background: #1a2849;
        }
        
        /* Global Spacing System */
        :root {
            /* Consistent spacing scale - OPTIMIZED for desktop */
            --space-xs: 8px;
            --space-sm: 16px;
            --space-md: 20px;
            --space-lg: 28px;
            --space-xl: 36px;
            --space-2xl: 48px;
            --space-3xl: 64px;
            --space-4xl: 80px;
            
            /* Grid gaps - REDUCED */
            --grid-gap-sm: 16px;
            --grid-gap-md: 20px;
            --grid-gap-lg: 24px;
            --grid-gap-xl: 32px;
            
            /* Section padding - OPTIMIZED for compact desktop view */
            --section-padding-y: 28px;
            --section-padding-x: 18px;
            
            /* Card padding */
            --card-padding: 32px;
            --card-padding-mobile: 24px;
            
            /* Border radius */
            --radius-sm: 8px;
            --radius-md: 12px;
            --radius-lg: 16px;
            --radius-xl: 24px;
            --radius-full: 9999px;

            /* Experience read more */
            --experience-collapse-height: 150px;
            
            /* Typography scale - aliased to theme.css --font-size-* for consistency */
            --text-xs: var(--font-size-xs);
            --text-sm: var(--font-size-sm);
            --text-base: var(--font-size-md);
            --text-lg: var(--font-size-lg);
            --text-xl: var(--font-size-xl);
            --text-2xl: var(--font-size-h4);
            --text-3xl: var(--font-size-h3);
            --text-4xl: var(--font-size-h2);
            --text-5xl: var(--font-size-h1);
        }
        
        /* Smooth scrolling */
        html {
            scroll-behavior: smooth;
            overflow-x: hidden;
        }
        
        /* Prevent mobile zoom on input focus */
        input, textarea, select {
            font-size: 16px;
        }
        
        /* VIP-specific colors (theme colors like --color-gold, --color-red, --color-theme inherit from theme.css) */
        :root {
            --color-red-hover: #ff3333;
            --color-gray-dark: #1e2a44;
            --color-navy: #2c3e5f;
        }
        
        /* Utility classes not in theme.css (theme defines .bg-theme, .c-gold, .c-red etc. with !important) */
        .bg-gray-dark { background: var(--color-gray-dark); }
        .c-white { color: var(--color-white); }
        
        /* Container system - Aligned and consistent (scoped to main content only, not header) */
        #main .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 var(--section-padding-x);
        }
        
        #main .container.md {
            max-width: 960px;
        }
        
        #main .container.lg {
            max-width: 1400px;
        }
        
        /* Section spacing system */
        .section {
            padding: var(--section-padding-y) 0;
            position: relative;
        }
        
        .section.compact {
            padding: var(--space-xl) 0;
        }
        
        .section.spacious {
            padding: var(--space-2xl) 0;
        }
        
        /* Grid system for consistent layouts */
        .grid {
            display: grid;
            gap: var(--grid-gap-lg);
        }
        
        .grid-2 { grid-template-columns: repeat(2, 1fr); }
        .grid-3 { grid-template-columns: repeat(3, 1fr); }
        .grid-4 { grid-template-columns: repeat(4, 1fr); }
        
        /* Flexbox utilities */
        .flex { display: flex; }
        .flex-col { flex-direction: column; }
        .items-center { align-items: center; }
        .justify-center { justify-content: center; }
        .justify-between { justify-content: space-between; }
        .gap-sm { gap: var(--space-sm); }
        .gap-md { gap: var(--space-md); }
        .gap-lg { gap: var(--space-lg); }
        .gap-xl { gap: var(--space-xl); }
        
        /* Mobile container adjustments */
        @media (max-width: 768px) {
            :root {
                --section-padding-y: 40px;
                --section-padding-x: 18px;
                --card-padding: 24px;
                --experience-collapse-height: 170px;
            }
            
            #main .container {
                padding: 0 var(--section-padding-x);
            }
            
            .grid-2, .grid-3, .grid-4 {
                grid-template-columns: 1fr;
                gap: var(--grid-gap-md);
            }
        }
        
        @media (max-width: 480px) {
            :root {
                --section-padding-y: 32px;
                --section-padding-x: 14px;
                --card-padding: 20px;
                --experience-collapse-height: 160px;
            }
            
            #main .container {
                padding: 0 var(--section-padding-x);
            }
            
            .grid {
                gap: var(--grid-gap-sm);
            }
        }
        
        /* Main Content Spacing */
        #main {
            padding-top: 90px;
        }
        
        /* Section structure - Clean and aligned */
        .sc-inner {
            position: relative;
            padding: var(--section-padding-y) 0;
        }
        
        @media (max-width: 768px) {
            .sc-inner {
                padding: var(--section-padding-y) 0;
            }
        }
        
        .sc-container {
            position: relative;
        }
        
        .sc-headline {
            margin-bottom: var(--space-lg);
            text-align: center;
        }
        
        .sc-headline.align-left {
            text-align: left;
        }
        
        /* Hero section: center align headline content */
        .elevated-main [data-section="hero"] .sc-headline {
            display: flex;
            flex-direction: column;
            justify-content: end;
        }
        
        .sc-heading {
            font-weight: 400;
            text-transform: uppercase;
            margin-bottom: var(--space-sm);
        }
        
        /* Typography sizes - Consistent scale */
        .size-h1 {
            font-size: clamp(var(--text-3xl), 5vw, var(--text-5xl));
            line-height: 1.2;
        }
        
        .size-h2 {
            font-size: clamp(var(--text-2xl), 4vw, var(--text-4xl));
            line-height: 1.3;
        }
        
        .size-h3 {
            font-size: clamp(var(--text-xl), 3vw, var(--text-3xl));
            line-height: 1.4;
        }
        
        .size-h4 {
            font-size: clamp(var(--text-base), 2vw, var(--text-xl));
            line-height: 1.5;
        }
        
        /* Billboard sections - Clean and spacious */
        .sc-billboard {
            position: relative;
            overflow: hidden;
        }
        
        .sc-billboard.h-full {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Hero section: ensure headline block is truly vertically centered */
        .elevated-main [data-section="hero"] .sc-billboard .sc-inner {
            padding-top: 0;
            padding-bottom: 0;
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
        
        .sc-cover {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
        }
        
        .object-fit {
            width: 100%;
            height: 100%;
            position: relative;
            overflow: hidden;
        }
        
        .object-fit img,
        .object-fit video {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .sc-billboard .sc-inner {
            position: relative;
            z-index: 10;
            padding: var(--space-2xl) 0;
        }
        
        /* Alignment utilities */
        .a-center {
            text-align: center;
        }
        
        .a-center * {
            margin-left: auto;
            margin-right: auto;
        }
        
        /* Entry content - color for dark backgrounds; font-size and line-height inherit from theme */
        .entry-content {
            color: rgba(255, 255, 255, 0.85);
        }
        
        .entry-content p {
            margin-bottom: 20px;
        }
        
        /* Hero description – heading style (New Amsterdam, uppercase) */
        section[data-section="hero"] .hero-description,
        section[data-section="hero"] .hero-description p {
            font-family: var(--font-heading);
            text-transform: uppercase;
            font-size: var(--text-lg);
            line-height: 1.3;
            color: rgba(255, 255, 255, 0.95);
            margin-bottom: 0;
        }
        
        /* Animations */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }
        
        .animate {
            opacity: 0;
            animation: fadeInUp 0.8s ease-out forwards;
        }
        
        .animate.fadeIn {
            animation: fadeIn 0.8s ease-out forwards;
        }
        
        .animate[data-delay="1"] { animation-delay: 0.1s; }
        .animate[data-delay="2"] { animation-delay: 0.2s; }
        .animate[data-delay="3"] { animation-delay: 0.3s; }
        .animate[data-delay="4"] { animation-delay: 0.4s; }
        
        /* Overlays */
        .overlay:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            z-index: 2;
        }
        
        /* Buttons: use sitewide .button and .button.active from theme.css (matches header Get Tickets) */
        
        .explore {
            display: inline-block;
            color: var(--color-gold);
            text-decoration: none;
            text-transform: uppercase;
            font-size: 14px;
            transition: all 0.3s;
            position: relative;
            padding-bottom: 2px;
        }
        
        .explore:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
            background: var(--color-gold);
            transition: all 0.3s;
        }
        
        .explore:hover {
            color: var(--color-red);
        }
        
        .explore:hover:after {
            background: var(--color-red);
        }
        
        /* Fix for View Gallery link specifically */
        .card .explore.view-gallery {
            display: inline-block;
            width: auto;
            position: relative;
        }
        
        .card .explore.view-gallery:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: var(--color-gold);
            transition: all 0.3s;
        }
        
        .card .explore.view-gallery:hover:after {
            background: var(--color-red);
        }
        
        /* Card Caption Alignment */
        .card .caption {
            padding: var(--card-padding);
            flex: 1;
            display: flex;
            flex-direction: column;
            gap: var(--space-md);
        }
        
        .card .caption > * {
            margin: 0;
        }
        
        .card .caption .explore {
            align-self: flex-start;
        }
        
        /* Caption body: text content (title, desc, View Gallery) stacked vertically */
        .cards-swiper .card .caption .caption-body {
            display: flex;
            flex-direction: column;
            gap: var(--space-md);
            min-width: 0;
        }
        
        .cards-swiper .card .caption .caption-body > * {
            margin: 0;
        }
        
        .cards-swiper .card .caption .caption-body .entry-title:first-child {
            margin-top: 0;
        }
        
        /* Desktop: row layout – text left, button right; tops aligned (same line) */
        @media (min-width: 769px) {
            .cards-swiper .card .caption {
                flex-direction: row;
                flex-wrap: nowrap;
                align-items: flex-start;
                gap: var(--space-lg);
            }
            .cards-swiper .card .caption .caption-body {
                flex: 1 1 0%;
                min-width: 0;
            }
            .cards-swiper .card .caption .card-get-tickets {
                flex: 0 0 auto;
                align-self: flex-start;
                white-space: nowrap;
            }
            .cards-swiper .card .caption .card-action-row {
                margin-top: 0;
            }
        }
        
        /* Mobile: stacked – caption-body first, then Get Tickets full-width at bottom */
        @media (max-width: 768px) {
            .cards-swiper .card .caption {
                flex-direction: column;
            }
            .cards-swiper .card .caption .card-get-tickets {
                width: 100%;
                text-align: center;
            }
        }
        
        /* Video Section */
        .sc-video-wrapper {
            position: relative;
            padding-bottom: 56.25%;
            height: 0;
            overflow: hidden;
            background: #000;
            margin-bottom: 40px;
            border-radius: 10px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }
        
        .sc-video-wrapper iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 10px;
        }
        
        /* NEW: Full Width Lounge Cards */
        .lounge-cards-slider {
            position: relative;
            margin-top: 20px;
            overflow: visible;
            padding-bottom: 0;
        }
        
        .cards-swiper {
            overflow: hidden;
            padding: 0;
        }
        
        .cards-swiper .swiper-wrapper {
            padding: 0;
            align-items: stretch;
        }
        
        .cards-swiper .swiper-slide {
            opacity: 0;
            transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
            width: 100%;
        }
        
        .cards-swiper .swiper-slide-active {
            opacity: 1;
        }
        
        .cards-swiper .card {
            background: linear-gradient(135deg, rgba(30, 42, 68, 0.95), rgba(26, 40, 73, 0.9));
            border-radius: var(--radius-lg);
            overflow: hidden;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border: 1px solid rgba(212, 165, 116, 0.1);
            width: 100%;
            height: 100%;
            backdrop-filter: blur(10px);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
            display: flex;
            flex-direction: column;
            position: relative;
        }

        .cards-swiper .swiper-slide-active .card,
        .cards-swiper .card.gold-theme {
            background: linear-gradient(135deg, var(--color-gold), #c49968);
            border: 1px solid rgba(13, 20, 36, 0.15);
            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
            color: var(--color-black);
        }

        .cards-swiper .swiper-slide-active .card .entry-title,
        .cards-swiper .card.gold-theme .entry-title {
            color: var(--color-black);
        }

        .cards-swiper .swiper-slide-active .card .entry-subtitle,
        .cards-swiper .card.gold-theme .entry-subtitle {
            color: var(--color-theme);
        }

        .cards-swiper .swiper-slide-active .card .entry-desc,
        .cards-swiper .card.gold-theme .entry-desc {
            color: rgba(13, 20, 36, 0.85);
        }

        .cards-swiper .swiper-slide-active .card .explore,
        .cards-swiper .card.gold-theme .explore {
            color: var(--color-black);
        }

        .cards-swiper .swiper-slide-active .card .explore:after,
        .cards-swiper .card.gold-theme .explore:after {
            background: var(--color-black);
        }

        .cards-swiper .swiper-slide-active .card .explore:hover,
        .cards-swiper .card.gold-theme .explore:hover {
            color: var(--color-red);
        }

        .cards-swiper .swiper-slide-active .card .explore:hover:after,
        .cards-swiper .card.gold-theme .explore:hover:after {
            background: var(--color-red);
        }
        
        .cards-swiper .card .cover {
            height: 500px;
            width: 100%;
            overflow: hidden;
            position: relative;
            flex-shrink: 0;
        }
        
        @media (max-width: 768px) {
            .cards-swiper .card .cover {
                height: 400px;
            }
        }
        
        @media (max-width: 480px) {
            .cards-swiper .card .cover {
                height: 300px;
            }
        }
        
        .cards-swiper .card .cover img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .cards-swiper .card:hover .cover img {
            transform: scale(1.05);
        }
        
        /* Custom Dot Pagination - User Specified Design */
        .dot-pagination {
            display: flex;
            justify-content: center;
            gap: 20px;
            padding: 28px 0;
            background: transparent;
        }
        
        .dot {
            height: 32px;
            width: 32px;
            background: #39304a;
            border-radius: 50%;
            display: inline-block;
            transition: background 0.3s;
            cursor: pointer;
        }
        
        .dot.active {
            background: #fd434f;
        }
        
        .dot:hover:not(.active) {
            background: #4a3f5c;
        }
        
        /* Override Swiper pagination to use custom dots - CI Compliant */
        .experience-pagination-wrapper,
        .cards-pagination-wrapper,
        .testimonials-pagination-wrapper {
            margin-top: 24px;
            padding: 20px 0;
            background: transparent;
            display: flex;
            justify-content: center;
            width: 100%;
        }
        
        .experience-pagination-wrapper .swiper-pagination,
        .cards-pagination-wrapper .swiper-pagination,
        .testimonials-pagination-wrapper .swiper-pagination {
            display: flex;
            justify-content: center;
            gap: 16px;
            padding: 0;
            position: static !important;
            background: transparent;
        }
        
        .experience-pagination-wrapper .swiper-pagination-bullet,
        .testimonials-pagination-wrapper .swiper-pagination-bullet {
            height: 12px;
            width: 12px;
            background: rgba(212, 165, 116, 0.3);
            border-radius: 50%;
            display: inline-block;
            transition: all 0.3s ease;
            cursor: pointer;
            opacity: 1;
            border: 2px solid transparent;
            margin: 0 !important;
        }

        .cards-pagination-wrapper .swiper-pagination-bullet {
            height: 12px;
            width: 12px;
            background: rgba(212, 165, 116, 0.35);
            border-radius: 50%;
            display: inline-block;
            transition: all 0.3s ease;
            cursor: pointer;
            opacity: 1;
            border: 2px solid transparent;
            margin: 0 !important;
        }

        .experience-pagination-wrapper .swiper-pagination-bullet-active,
        .testimonials-pagination-wrapper .swiper-pagination-bullet-active {
            background: #d4a574;
            border-color: #d4a574;
            transform: scale(1.3);
            box-shadow: 0 0 12px rgba(212, 165, 116, 0.5);
        }

        .cards-pagination-wrapper .swiper-pagination-bullet-active {
            background: var(--color-gold);
            border-color: var(--color-gold);
            transform: scale(1.3);
            box-shadow: 0 0 12px rgba(212, 165, 116, 0.6);
        }

        .experience-pagination-wrapper .swiper-pagination-bullet:hover:not(.swiper-pagination-bullet-active),
        .testimonials-pagination-wrapper .swiper-pagination-bullet:hover:not(.swiper-pagination-bullet-active) {
            background: rgba(212, 165, 116, 0.6);
            border-color: rgba(212, 165, 116, 0.4);
            transform: scale(1.15);
        }

        .cards-pagination-wrapper .swiper-pagination-bullet:hover:not(.swiper-pagination-bullet-active) {
            background: rgba(212, 165, 116, 0.6);
            border-color: rgba(212, 165, 116, 0.4);
            transform: scale(1.15);
        }
        
        /* Mobile adjustments for dot pagination */
        @media (max-width: 768px) {
            .experience-pagination-wrapper,
            .cards-pagination-wrapper,
            .testimonials-pagination-wrapper {
                margin-top: 30px;
                padding: 20px 0;
            }
            
            .experience-pagination-wrapper .swiper-pagination,
            .cards-pagination-wrapper .swiper-pagination,
            .testimonials-pagination-wrapper .swiper-pagination {
                gap: 12px;
            }
            
            .experience-pagination-wrapper .swiper-pagination-bullet,
            .cards-pagination-wrapper .swiper-pagination-bullet,
            .testimonials-pagination-wrapper .swiper-pagination-bullet {
                height: 10px;
                width: 10px;
            }
        }
        
        @media (max-width: 480px) {
            .experience-pagination-wrapper,
            .cards-pagination-wrapper,
            .testimonials-pagination-wrapper {
                margin-top: 20px;
                padding: 15px 0;
            }
            
            .experience-pagination-wrapper .swiper-pagination,
            .cards-pagination-wrapper .swiper-pagination,
            .testimonials-pagination-wrapper .swiper-pagination {
                gap: 10px;
            }
            
            .experience-pagination-wrapper .swiper-pagination-bullet,
            .cards-pagination-wrapper .swiper-pagination-bullet,
            .testimonials-pagination-wrapper .swiper-pagination-bullet {
                height: 8px;
                width: 8px;
            }
        }
        
        /* Ensure slider containers don't have pagination inside */
        .experience-swiper,
        .cards-swiper {
            margin-bottom: 0;
            padding-bottom: 0;
        }
        
        .experience-swiper .swiper-wrapper,
        .cards-swiper .swiper-wrapper {
            margin-bottom: 0;
        }
        
        .card .entry-title {
            font-family: var(--font-heading);
            font-size: var(--text-xl);
            color: var(--color-white);
            margin: 0;
            font-weight: 400;
            text-transform: uppercase;
            line-height: 1.3;
        }
        
        .card .entry-subtitle {
            color: var(--color-gold);
            font-size: var(--text-sm);
            margin: 0;
            text-transform: uppercase;
            font-weight: 500;
        }
        
        .card .entry-desc {
            color: rgba(255, 255, 255, 0.75);
            line-height: 1.6;
            font-size: var(--text-base);
            flex: 1;
        }
        
        /* Premier Lounge Zones Section - Navy Theme */
        section[data-section="gradient"] {
            background: linear-gradient(135deg, #1a2849 0%, #0d1424 50%, #1e2a44 100%);
            position: relative;
            border-top: 3px solid var(--color-gold);
            border-bottom: 3px solid var(--color-gold);
        }

        section[data-section="gradient"]::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg,
                rgba(44, 62, 95, 0.45) 0%,
                rgba(26, 40, 73, 0.35) 50%,
                rgba(13, 20, 36, 0.3) 100%);
            pointer-events: none;
            z-index: 1;
        }

        section[data-section="gradient"]::after {
            content: '';
            position: absolute;
            inset: 0;
            background-image:
                /* Diamond pattern inspired by Thai silk weaving - navy with gold shimmer */
                repeating-linear-gradient(45deg,
                    transparent 0px,
                    transparent 15px,
                    rgba(212, 165, 116, 0.04) 15px,
                    rgba(212, 165, 116, 0.04) 30px),
                repeating-linear-gradient(-45deg,
                    transparent 0px,
                    transparent 15px,
                    rgba(212, 165, 116, 0.04) 15px,
                    rgba(212, 165, 116, 0.04) 30px),
                /* Subtle horizontal lines like traditional Thai fabric - brighter for contrast */
                repeating-linear-gradient(0deg,
                    transparent 0px,
                    transparent 40px,
                    rgba(255, 255, 255, 0.04) 40px,
                    rgba(255, 255, 255, 0.04) 42px),
                /* Vertical accent lines */
                repeating-linear-gradient(90deg,
                    transparent 0px,
                    transparent 60px,
                    rgba(255, 255, 255, 0.03) 60px,
                    rgba(255, 255, 255, 0.03) 61px);
            pointer-events: none;
            z-index: 0;
            opacity: 0.35;
        }
        
        section[data-section="gradient"] .sc-inner {
            position: relative;
            z-index: 2;
        }

        /* Text color overrides for gradient section */
        section[data-section="gradient"] .sc-heading,
        section[data-section="gradient"] .sc-heading strong {
            color: var(--color-white);
        }

        section[data-section="gradient"] .entry-content,
        section[data-section="gradient"] .entry-content p {
            color: rgba(255, 255, 255, 0.92);
            opacity: 1;
        }
        
        /* Card Price Styling */
        .card-price {
            background: linear-gradient(135deg, var(--color-gold), #c49968);
            color: var(--color-black);
            padding: 10px 20px;
            border-radius: var(--radius-sm);
            font-size: calc(var(--text-sm) * 1.2);
            font-weight: 700;
            text-transform: uppercase;
            box-shadow: 0 4px 12px rgba(212, 165, 116, 0.4);
            display: inline-block;
            margin-left: auto;
        }
        
        .card-action-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: var(--space-md);
            margin-top: auto;
        }
        
        @media (max-width: 480px) {
            .card-action-row {
                flex-direction: column;
                align-items: stretch;
                gap: var(--space-sm);
            }
            
            .card-action-row .card-price {
                text-align: center;
                margin-left: 0;
            }
        }
        
        /* RWS Badge on first card */
        .card .rws-badge {
            position: absolute;
            top: 20px;
            right: 20px;
            width: 300px;
            height: auto;
            z-index: 10;
            background: rgba(0, 0, 0, 0.9);
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
        }

        @media (max-width: 480px) {
            .card .rws-badge {
                width: 112px;
                top: 15px;
                left: 50%;
                right: auto;
                transform: translateX(-50%);
                padding: 12px;
            }
        }

        /* Navigation buttons for cards slider */
        .lounge-cards-slider .swiper-button-prev,
        .lounge-cards-slider .swiper-button-next {
            width: 50px;
            height: 50px;
            margin-top: 0;
            top: 45%;
            transform: translateY(-50%);
        }
        
        .lounge-cards-slider .swiper-button-prev:hover,
        .lounge-cards-slider .swiper-button-next:hover {
            transform: translateY(-50%) scale(1.1);
        }
        
        .lounge-cards-slider .swiper-button-prev {
            left: 20px;
        }
        
        .lounge-cards-slider .swiper-button-next {
            right: 20px;
        }
        
        /* NEW: Updated Experience Slider with Headers Outside */
        .experience-slider-container {
            position: relative;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        
        .experience-slide {
            position: relative;
            height: 600px;
            overflow: hidden;
            border-radius: 10px;
        }
        
        .experience-slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        /* Experience slider container spacing */
        .experience-slider-container {
            margin-bottom: 0;
        }
        
        /* NEW: Experience Title Below Image */
        .experience-title-container {
            margin-top: 30px;
            text-align: center;
            min-height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .experience-title {
            font-family: var(--font-heading);
            font-size: 1.5rem;
            color: var(--color-gold);
            text-transform: uppercase;
            opacity: 0;
            position: absolute;
            transition: opacity 0.6s ease;
        }
        
        .experience-title.active {
            opacity: 1;
            position: relative;
        }
        
        /* Experience Section Content Wrapper */
        .sc-content.a-center {
            position: relative;
            overflow: hidden;
        }
        
        /* Experience Descriptions */
        .experience-descriptions {
            position: relative;
            margin-top: 12px;
            padding: 0 20px;
            display: flex;
            align-items: flex-start;
            justify-content: center;
        }
        
        .experience-desc {
            width: 100%;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transition: opacity 0.4s ease, visibility 0.4s ease;
            z-index: 1;
            display: none;
        }
        
        .experience-desc.active {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            z-index: 10;
            position: relative;
            display: block;
        }
        
        /* Read More Functionality for Experience Descriptions */
        .experience-desc .entry-content {
            position: relative;
            max-height: var(--experience-collapse-height);
            overflow: hidden;
            transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            -webkit-mask-image: linear-gradient(180deg, #ffffff 65%, rgba(255, 255, 255, 0));
            mask-image: linear-gradient(180deg, #ffffff 65%, rgba(255, 255, 255, 0));
        }
        
        .experience-desc .entry-content.expanded {
            max-height: none;
            -webkit-mask-image: none;
            mask-image: none;
        }
        
        .read-more-btn {
            display: none; /* Hidden by default */
            align-items: center;
            gap: 8px;
            margin-top: 12px;
            color: var(--color-gold);
            background: transparent;
            border: none;
            font-size: var(--text-sm);
            font-weight: 600;
            text-transform: uppercase;
            cursor: pointer;
            transition: all 0.3s ease;
            padding: 8px 0;
            position: relative;
        }
        
        /* Only show read more button for active description */
        .experience-desc.active .read-more-btn {
            display: inline-flex;
        }
        
        .read-more-btn::after {
            content: '';
            position: absolute;
            bottom: 4px;
            left: 0;
            width: 100%;
            height: 1px;
            background: var(--color-gold);
            transform: scaleX(0);
            transform-origin: left;
            transition: transform 0.3s ease;
        }
        
        .read-more-btn:hover {
            color: var(--color-red);
        }
        
        .read-more-btn:hover::after {
            background: var(--color-red);
            transform: scaleX(1);
        }
        
        .read-more-btn .arrow {
            transition: transform 0.3s ease;
            font-size: 12px;
        }
        
        .read-more-btn.expanded .arrow {
            transform: rotate(180deg);
        }
        
        /* NEW: Updated Testimonials without Images - Text Only */
        .testimonials-container {
            margin-top: var(--space-xl);
            position: relative;
            padding-bottom: var(--space-xl);
        }
        
        .testimonials-swiper {
            padding: 0;
            overflow: hidden;
        }
        
        .testimonial-card {
            background: linear-gradient(135deg, rgba(26, 40, 73, 0.95), rgba(30, 42, 68, 0.85));
            backdrop-filter: blur(10px);
            border: 1px solid rgba(212, 165, 116, 0.15);
            border-radius: var(--radius-lg);
            padding: var(--space-xl);
            overflow: hidden;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            min-height: 350px;
        }
        
        .testimonial-card:hover {
            transform: translateY(-8px);
            border-color: rgba(212, 165, 116, 0.3);
            box-shadow: 0 20px 48px rgba(212, 165, 116, 0.2);
        }
        
        .testimonial-rating {
            margin-bottom: var(--space-md);
            text-align: center;
        }
        
        .testimonial-rating .star {
            color: var(--color-gold);
            font-size: var(--text-xl);
            margin: 0 2px;
            text-shadow: 0 2px 8px rgba(212, 165, 116, 0.4);
        }
        
        .testimonial-content {
            margin: var(--space-md) 0;
            flex: 1;
            display: flex;
            align-items: center;
        }
        
        .testimonial-content p {
            font-size: var(--text-base);
            line-height: 1.7;
            color: rgba(255, 255, 255, 0.85);
            font-style: italic;
            position: relative;
            padding: 0 var(--space-lg);
            margin: 0;
            text-align: center;
        }
        
        .testimonial-content p:before {
            content: '"';
            position: absolute;
            left: 0;
            top: -10px;
            font-size: var(--text-3xl);
            color: var(--color-gold);
            opacity: 0.2;
            line-height: 1;
        }
        
        .testimonial-content p:after {
            content: '"';
            position: absolute;
            right: 0;
            bottom: -20px;
            font-size: var(--text-3xl);
            color: var(--color-gold);
            opacity: 0.2;
            line-height: 1;
        }
        
        .testimonial-author {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: var(--space-md);
            margin-top: var(--space-md);
        }
        
        .author-info {
            text-align: center;
        }
        
        .author-name {
            color: var(--color-white);
            font-size: var(--text-base);
            margin-bottom: var(--space-xs);
            font-weight: 600;
            text-transform: uppercase;
        }
        
        /* Testimonials slider spacing */
        .testimonials-swiper {
            margin-bottom: 0;
            padding-bottom: 0;
        }
        
        /* Modal Styles */
        .modal-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.95);
            backdrop-filter: blur(10px);
            z-index: 9998;
            animation: fadeIn 0.3s ease-out;
        }
        
        .modal-overlay.active {
            display: block;
        }
        
        .modal-popup {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9999;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }
        
        .modal-popup.active {
            display: flex;
        }
        
        .modal-box {
            position: relative;
            background: #1e2a44;
            border-radius: 15px;
            max-width: 1100px;
            width: 100%;
            height: 75vh;
            max-height: 800px;
            overflow: hidden;
            border: 1px solid rgba(212, 165, 116, 0.2);
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
            animation: modalSlideIn 0.4s ease-out;
        }
        
        @keyframes modalSlideIn {
            from {
                opacity: 0;
                transform: scale(0.9) translateY(20px);
            }
            to {
                opacity: 1;
                transform: scale(1) translateY(0);
            }
        }
        
        .modal-dismiss {
            position: absolute !important;
            top: 20px;
            right: 20px;
            width: 40px;
            height: 40px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            color: white;
            font-size: 24px !important;
            text-decoration: none;
            z-index: 10;
            transition: all 0.3s;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }
        
        /* Override theme's :before pseudo-element to prevent duplicate close button */
        .modal-dismiss:before {
            display: none !important;
            content: none !important;
        }
        
        .modal-dismiss:hover {
            background: var(--color-red);
            border-color: var(--color-red);
            transform: rotate(90deg);
        }
        
        .modal-columns {
            display: grid;
            grid-template-columns: 1fr 1fr;
            height: 100%;
        }
        
        .modal-column.cover {
            background: #0d1424;
            overflow: hidden;
            position: relative;
        }
        
        .modal-column.detail {
            background: linear-gradient(135deg, #1a2849 0%, #1e2a44 100%);
            display: flex;
            flex-direction: column;
            position: relative;
            overflow: hidden;
        }
        
        .modal-scroll {
            position: relative;
            overflow-y: auto;
            flex: 1;
            padding: 30px;
            padding-bottom: 30px; /* Normal padding since button is now outside */
            display: flex;
            flex-direction: column;
        }
        
        /* Custom scrollbar for modal */
        .modal-scroll::-webkit-scrollbar {
            width: 6px;
        }
        
        .modal-scroll::-webkit-scrollbar-track {
            background: rgba(255, 255, 255, 0.05);
        }
        
        .modal-scroll::-webkit-scrollbar-thumb {
            background: var(--color-gold);
            border-radius: 3px;
        }
        
        .modal-container {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-height: 100%;
            position: relative;
        }
        
        .modal-scroll .entry-header {
            margin-bottom: 15px;
            flex-shrink: 0;
        }
        
        .modal-scroll .entry-title {
            font-family: var(--font-heading);
            color: #ffffff;
            margin-bottom: 10px;
            font-size: 1.5rem;
            line-height: 1.2;
        }
        
        .modal-scroll .entry-desc {
            color: var(--color-gold);
            text-transform: uppercase;
            font-size: 12px;
            margin-bottom: 10px;
        }
        
        .modal-scroll .entry-content {
            color: rgba(255, 255, 255, 0.9);
            line-height: 1.6;
            margin-bottom: 20px;
        }
        
        .modal-scroll .entry-content p {
            margin-bottom: 10px;
            font-size: 0.9rem;
        }
        
        .entry-features {
            margin: 20px 0 20px 0;
            flex: 1;
        }
        
        .entry-features h3 {
            font-family: var(--font-heading);
            color: var(--color-gold);
            font-size: 1.1rem;
            margin-bottom: 15px;
            text-transform: uppercase;
        }
        
        .entry-features ul:not(.vip-facilities) {
            list-style: none;
        }
        
        .entry-features ul:not(.vip-facilities) li {
            color: rgba(255, 255, 255, 0.8);
            padding: 6px 0;
            padding-left: 25px;
            position: relative;
            font-size: 0.95rem;
        }
        
        .entry-features ul:not(.vip-facilities) li:before {
            content: '✓';
            position: absolute;
            left: 0;
            color: var(--color-gold);
            font-weight: bold;
        }
        
        /* VIP Facilities in Modal - Clean grid pattern */
        .modal-container .vip-facilities {
            list-style: none;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: var(--space-sm);
            margin: var(--space-md) 0;
            padding: 0;
        }
        
        .modal-container .vip-facilities li {
            margin: 0;
        }
        
        .modal-container .vip-facilities-wrap {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 8px;
            background: rgba(255, 255, 255, 0.03);
            border-radius: var(--radius-sm);
            border: 1px solid rgba(212, 165, 116, 0.1);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            height: 100%;
        }
        
        .modal-container .vip-facilities-wrap:hover {
            background: rgba(212, 165, 116, 0.08);
            transform: translateX(4px);
            border-color: rgba(212, 165, 116, 0.2);
        }
        
        .modal-container .vip-facilities-wrap img {
            width: 24px;
            height: 24px;
            object-fit: contain;
            flex-shrink: 0;
            filter: brightness(1.1);
        }
        
        .modal-container .vip-facilities-wrap .entry-title {
            color: rgba(255, 255, 255, 0.85);
            font-size: 0.8rem;
            margin: 0;
            line-height: 1.2;
            font-weight: 500;
        }
        
        .entry-explore {
            position: relative;
            flex-shrink: 0;
            background: linear-gradient(to top, rgba(26, 40, 73, 1) 60%, rgba(26, 40, 73, 0.95) 80%, rgba(26, 40, 73, 0) 100%);
            padding: 25px 30px 30px;
            margin: 0;
            z-index: 100;
            border-top: 1px solid rgba(212, 165, 116, 0.1);
        }
        
        /* .button.w-full — inherited from theme.css */
        
        /* Modal Gallery Swiper Styles */
        .modal-swiper {
            height: 100%;
            width: 100%;
        }
        
        .modal-swiper .swiper-slide img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .modal-swiper .swiper-button-prev,
        .modal-swiper .swiper-button-next {
            color: var(--color-gold);
            background: linear-gradient(135deg, rgba(26, 40, 73, 0.95), rgba(30, 42, 68, 0.9));
            border: 2px solid rgba(212, 165, 116, 0.4);
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            backdrop-filter: blur(10px);
        }
        
        .modal-swiper .swiper-button-prev:hover,
        .modal-swiper .swiper-button-next:hover {
            background: linear-gradient(135deg, var(--color-red), var(--color-red-hover));
            border-color: var(--color-red);
            color: white;
            box-shadow: 0 8px 24px rgba(255, 0, 0, 0.4);
        }
        
        .modal-swiper .swiper-button-prev:after,
        .modal-swiper .swiper-button-next:after {
            width: 11px;
            height: 11px;
            border-right-width: 2.5px;
            border-bottom-width: 2.5px;
        }
        
        /* Modal pagination - aligned center and consistent design */
        .modal-swiper .swiper-pagination {
            display: flex !important;
            justify-content: center !important;
            align-items: center !important;
            gap: 12px !important;
            position: absolute !important;
            bottom: 20px !important;
            left: 50% !important;
            transform: translateX(-50%) !important;
            width: auto !important;
            z-index: 10;
        }
        
        .modal-swiper .swiper-pagination-bullet {
            background: rgba(212, 165, 116, 0.3);
            opacity: 1;
            width: 12px;
            height: 12px;
            margin: 0 !important;
            border: 2px solid transparent;
            transition: all 0.3s ease;
        }
        
        .modal-swiper .swiper-pagination-bullet-active {
            background: var(--color-gold);
            border-color: var(--color-gold);
            transform: scale(1.3);
            box-shadow: 0 0 12px rgba(212, 165, 116, 0.5);
        }
        
        /* Modal Mobile Responsive - Better spacing without scroll */
        @media (max-width: 768px) {
            .modal-popup {
                padding: 10px;
            }
            
            .modal-box {
                height: 90vh;
                max-height: 90vh;
                display: flex;
                flex-direction: column;
            }
            
            .modal-columns {
                grid-template-columns: 1fr;
                grid-template-rows: 40% 60%;
                height: 100%;
                overflow: hidden;
            }
            
            .modal-column.cover {
                height: 100%;
                flex-shrink: 0;
            }
            
            .modal-column.detail {
                flex: 1;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                position: relative;
            }
            
            .modal-scroll {
                padding: 15px 15px 15px 15px; /* Normal padding */
                flex: 1;
                overflow-y: auto;
                display: flex;
                flex-direction: column;
                position: relative;
            }
            
            .modal-container {
                display: flex;
                flex-direction: column;
                position: relative;
                flex: 1;
            }
            
            .modal-scroll .entry-header {
                flex-shrink: 0;
                margin-bottom: 12px;
            }
            
            .modal-scroll .entry-title {
                font-size: 1.3rem;
                margin-bottom: 8px;
                line-height: 1.3;
                font-weight: 600;
            }
            
            .modal-scroll .entry-desc p {
                font-size: 0.85rem;
                margin-bottom: 8px;
                line-height: 1.4;
                color: var(--color-gold);
                text-transform: uppercase;
            }
            
            .modal-scroll .entry-content {
                flex-shrink: 0;
                margin-bottom: 15px;
            }
            
            .modal-scroll .entry-content p {
                font-size: 0.9rem;
                margin-bottom: 0;
                line-height: 1.6;
                color: rgba(255, 255, 255, 0.85);
            }
            
            .entry-features {
                flex: 1;
                margin: 15px 0 15px 0;
            }
            
            .entry-explore {
                padding: 20px 15px 20px 15px; /* Adjusted padding for mobile */
            }
            
            .entry-features h3 {
                font-size: 1rem;
                margin-bottom: 12px;
                color: var(--color-gold);
                font-weight: 600;
            }
            
            .modal-container .vip-facilities {
                gap: 8px;
                grid-template-columns: 1fr;
                margin: 0;
                padding: 0;
            }
            
            .modal-container .vip-facilities-wrap {
                padding: 8px 10px;
                gap: 10px;
                background: rgba(255, 255, 255, 0.05);
                border-radius: 6px;
            }
            
            .modal-container .vip-facilities-wrap img {
                width: 20px;
                height: 20px;
            }
            
            .modal-container .vip-facilities-wrap .entry-title {
                font-size: 0.8rem;
                line-height: 1.3;
                font-weight: 400;
            }
            
            .entry-explore {
                position: relative;
                flex-shrink: 0;
                background: linear-gradient(to top, rgba(26, 40, 73, 1) 70%, rgba(26, 40, 73, 0.98) 90%, rgba(26, 40, 73, 0) 100%);
                padding: 20px 15px 15px;
                margin: 0;
                border-top: none;
                z-index: 100;
            }
            
            .modal-column.detail .entry-explore {
                position: relative;
            }
            
            .entry-explore .button {
                padding: 14px 24px;
                font-size: 0.95rem;
                font-weight: 600;
                box-shadow: 0 4px 15px rgba(255, 0, 0, 0.3);
            }
            
            .modal-dismiss {
                width: 32px;
                height: 32px;
                font-size: 20px;
                top: 10px;
                right: 10px;
                background: rgba(0, 0, 0, 0.6);
                border-color: rgba(255, 255, 255, 0.3);
            }
        }
        
        @media (max-width: 480px) {
            .modal-columns {
                grid-template-rows: 35% 65%;
            }
            
            .modal-scroll {
                padding: 12px 12px 12px 12px;
            }
            
            .modal-scroll .entry-title {
                font-size: 1.2rem;
            }
            
            .modal-scroll .entry-desc p {
                font-size: 0.8rem;
            }
            
            .modal-scroll .entry-content p {
                font-size: 0.85rem;
            }
            
            .modal-scroll .entry-features h3 {
                font-size: 0.95rem;
            }
            
            .modal-container .vip-facilities-wrap img {
                width: 18px;
                height: 18px;
            }
            
            .modal-container .vip-facilities-wrap .entry-title {
                font-size: 0.75rem;
            }
            
            .entry-explore {
                padding: 18px 12px 12px;
            }
            
            .entry-explore .button {
                font-size: 0.9rem;
                padding: 12px 20px;
            }
        }
        
        /* Swiper Navigation - Redesigned to match CI */
        .swiper-button-prev,
        .swiper-button-next {
            position: absolute;
            top: 50%;
            width: 56px;
            height: 56px;
            margin-top: 0;
            transform: translateY(-50%);
            background: linear-gradient(135deg, rgba(26, 40, 73, 0.95), rgba(30, 42, 68, 0.9));
            border: 2px solid rgba(212, 165, 116, 0.4);
            border-radius: 50%;
            color: var(--color-gold);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 28px;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            z-index: 10;
            -webkit-tap-highlight-color: transparent;
            user-select: none;
            backdrop-filter: blur(10px);
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
        }
        
        /* Special positioning for testimonials navigation */
        .testimonials-container .swiper-button-prev,
        .testimonials-container .swiper-button-next {
            top: auto;
            bottom: 50px; /* Lowered more to align exactly with pagination dots center */
            transform: none;
        }
        
        .testimonials-container .swiper-button-prev:hover,
        .testimonials-container .swiper-button-next:hover {
            transform: scale(1.1);
        }
        
        .testimonials-container .swiper-button-prev:active,
        .testimonials-container .swiper-button-next:active {
            transform: scale(0.92);
        }
        
        .swiper-button-prev:active,
        .swiper-button-next:active {
            transform: translateY(-50%) scale(0.92);
        }
        
        .swiper-button-prev:hover,
        .swiper-button-next:hover {
            background: linear-gradient(135deg, var(--color-red), var(--color-red-hover));
            border-color: var(--color-red);
            color: white;
            transform: translateY(-50%) scale(1.1);
            box-shadow: 0 8px 24px rgba(255, 0, 0, 0.4), 0 0 20px rgba(212, 165, 116, 0.3);
        }
        
        .swiper-button-prev {
            left: 20px;
        }
        
        .swiper-button-next {
            right: 20px;
        }
        
        .swiper-button-prev:after,
        .swiper-button-next:after {
            content: '';
            width: 12px;
            height: 12px;
            border-right: 2.5px solid currentColor;
            border-bottom: 2.5px solid currentColor;
            display: block;
            font-size: 0;
            padding: 0;
            margin: 0;
            box-sizing: border-box;
        }

        .swiper-button-prev:after {
            transform: rotate(135deg);
            margin-left: 3px;
        }

        .swiper-button-next:after {
            transform: rotate(-45deg);
            margin-right: 3px;
        }
        
        /* Swiper Pagination - Default (kept for modal swiper) */
        .modal-swiper .swiper-pagination {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 10px;
            z-index: 10;
        }
        
        .modal-swiper .swiper-pagination-bullet {
            width: 12px;
            height: 12px;
            background: rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            cursor: pointer;
            transition: all 0.3s;
            border: 2px solid transparent;
        }
        
        .modal-swiper .swiper-pagination-bullet-active {
            background: var(--color-red);
            border-color: var(--color-gold);
            transform: scale(1.2);
        }
        
        /* Footer Styles - Updated CI */
        #footer {
            background: #0d1424;
            color: white;
            padding: 48px 0 32px;
            margin-top: 48px;
        }
        
        .footer-break {
            padding: 40px 0;
        }
        
        .footer-break hr {
            border: none;
            height: 1px;
            background: rgba(255, 255, 255, 0.1);
        }
        
        .footer-nav {
            display: grid;
            grid-template-columns: 1fr 2fr;
            gap: 60px;
        }
        
        .footer-detail .slogan {
            margin-bottom: 30px;
        }
        
        .footer-detail .contact {
            color: rgba(255, 255, 255, 0.7);
            line-height: 1.8;
        }
        
        .footer-detail .contact a {
            color: rgba(255, 255, 255, 0.7);
            text-decoration: none;
            transition: color 0.3s;
        }
        
        .footer-detail .contact a:hover {
            color: var(--color-gold);
        }
        
        .footer-directory {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }
        
        .footer-directory .menu {
            list-style: none;
        }
        
        .footer-directory .menu li {
            margin-bottom: 15px;
        }
        
        .footer-directory .menu a {
            color: rgba(255, 255, 255, 0.7);
            text-decoration: none;
            transition: color 0.3s;
        }
        
        .footer-directory .menu a:hover {
            color: var(--color-gold);
        }
        
        .copyright {
            grid-column: 1 / -1;
            color: rgba(255, 255, 255, 0.5);
            font-size: 14px;
            margin-top: 32px;
        }
        
        /* ===== DESKTOP OPTIMIZATION - Further reduce spacing on large screens ===== */
        @media (min-width: 993px) {
            :root {
                /* Even more compact spacing for desktop */
                --section-padding-y: 24px;
                --space-xl: 32px;
                --space-2xl: 42px;
                --space-3xl: 56px;
                --grid-gap-lg: 20px;
                --grid-gap-xl: 28px;
            }
            
            .sc-headline {
                margin-bottom: var(--space-md);
            }
            
            .sc-billboard .sc-inner {
                padding: var(--space-xl) 0;
            }
            
            .experience-pagination-wrapper,
            .cards-pagination-wrapper,
            .testimonials-pagination-wrapper {
                margin-top: 20px;
                padding: 16px 0;
            }
            
            .dot-pagination {
                padding: 24px 0;
            }
            
            .footer-directory {
                gap: 28px;
            }
            
            .copyright {
                margin-top: 28px;
            }
        }
        
        /* Responsive */
        @media (max-width: 768px) {
            .sc-inner {
                padding: var(--section-padding-y) 0;
            }
            
            .sc-billboard .sc-inner {
                padding: calc(var(--section-padding-y) * 1.25) 0;
            }
            
            .experience-slide {
                height: 400px;
            }
            
            .lounge-zones-slider {
                padding: 0 10px;
            }
            
            .read-more-btn {
                font-size: 0.75rem;
                padding: 6px 0;
            }
            
            .footer-nav {
                grid-template-columns: 1fr;
            }
            
            .footer-directory {
                grid-template-columns: 1fr;
            }
            
            .modal-box {
                width: 95%;
                height: 90vh;
                max-height: none;
            }
            
            .modal-columns {
                grid-template-columns: 1fr;
                grid-template-rows: 35% 65%;
            }
            
            .modal-scroll {
                padding: 20px;
                height: calc(100% - 40px);
            }
            
            .modal-container .vip-facilities li {
                flex: 0 0 100%;
            }
            
            .modal-scroll .entry-title {
                font-size: 1.5rem;
            }
            
            .modal-scroll .entry-content p {
                font-size: 0.95rem;
            }
            
            .modal-dismiss {
                top: 10px;
                right: 10px;
                width: 35px;
                height: 35px;
                font-size: 20px;
            }
        }
        
        @media (max-width: 480px) {
            .experience-slide {
                height: 300px;
            }

            /* Fix card height consistency on mobile */
            .cards-swiper .swiper-slide {
                height: auto;
            }

            .cards-swiper .card {
                min-height: 550px;
                height: 100%;
            }

            .cards-swiper .card .caption {
                min-height: 250px;
            }

            .lounge-cards-slider .swiper-button-prev,
            .lounge-cards-slider .swiper-button-next {
                top: 40%;
                width: 44px;
                height: 44px;
            }
            
            /* Adjust navigation arrows for mobile */
            .swiper-button-prev,
            .swiper-button-next {
                width: 44px;
                height: 44px;
            }

            .swiper-button-prev:after,
            .swiper-button-next:after {
                width: 10px;
                height: 10px;
            }

            .swiper-button-prev:after {
                margin-left: 2px;
            }

            .swiper-button-next:after {
                margin-right: 2px;
            }
            
            .swiper-button-prev {
                left: 10px;
            }
            
            .swiper-button-next {
                right: 10px;
            }
            
            /* Testimonials arrows aligned with pagination on mobile */
            .testimonials-container .swiper-button-prev,
            .testimonials-container .swiper-button-next {
                bottom: 45px; /* Align with pagination dots center on mobile */
            }
        }
        
        /* Removed Mobile Floating Get Tickets Button */
        
        /* VIP Facilities List Styles */
        .vip-facilities {
            list-style: none;
            padding: 0;
            margin: 24px 0;
            display: grid;
            gap: 16px;
        }
        
        .vip-facilities li {
            padding: 0;
            margin: 0;
        }
        
        .vip-facilities-wrap {
            display: flex;
            align-items: center;
            gap: 15px;
            padding: 15px;
            background: rgba(255, 255, 255, 0.05);
            border-radius: 10px;
            border: 1px solid rgba(212, 165, 116, 0.2);
            transition: all 0.3s;
        }
        
        .vip-facilities-wrap:hover {
            background: rgba(212, 165, 116, 0.1);
            border-color: rgba(212, 165, 116, 0.4);
            transform: translateX(5px);
        }
        
        .vip-facilities-wrap img {
            width: 50px;
            height: 50px;
            object-fit: contain;
            flex-shrink: 0;
        }
        
        .vip-facilities-wrap .entry-title {
            font-family: var(--font-heading);
            color: rgba(255, 255, 255, 0.9);
            font-size: 14px;
            line-height: 1.4;
            text-transform: uppercase;
            font-weight: 500;
        }
        
        /* Video Banner Styles */
        .intro-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
        }
        
        .intro-yt-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 2;
            opacity: 0;
            transition: opacity 1s ease-in-out;
            pointer-events: none;
        }
        
        .intro-yt-overlay.loaded {
            opacity: 1;
        }
        
        /* YouTube player - match theme.css approach for full coverage */
        *[data-section="hero"] .intro-yt-player {
            width: 100vw;
            min-width: 175vh;
            height: 100vw;
            min-height: 175vh;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            pointer-events: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }
        
        /* Fallback for intro-yt-player without section context */
        .intro-yt-player {
            width: 100vw;
            min-width: 175vh;
            height: 100vw;
            min-height: 175vh;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            pointer-events: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }
        
        /* Spacing utilities - Consistent system */
        .mt-xs { margin-top: var(--space-xs); }
        .mt-sm { margin-top: var(--space-sm); }
        .mt-md { margin-top: var(--space-md); }
        .mt-lg { margin-top: var(--space-lg); }
        .mt-xl { margin-top: var(--space-xl); }
        .mt-2xl { margin-top: var(--space-2xl); }
        .mt-3xl { margin-top: var(--space-3xl); }
        
        .mb-xs { margin-bottom: var(--space-xs); }
        .mb-sm { margin-bottom: var(--space-sm); }
        .mb-md { margin-bottom: var(--space-md); }
        .mb-lg { margin-bottom: var(--space-lg); }
        .mb-xl { margin-bottom: var(--space-xl); }
        .mb-2xl { margin-bottom: var(--space-2xl); }
        .mb-3xl { margin-bottom: var(--space-3xl); }
        
        /* strong { font-weight: 400; } — inherited from theme.css */
        
        /* Loading State */
        .loading {
            pointer-events: none;
            opacity: 0.5;
        }
        
        /* ===== SECTION DIFFERENTIATION STYLES - ENHANCED ===== */
        
        /* Hero Section - Dramatic entrance with gradient fade */
        section[data-section="hero"] {
            position: relative;
            background: linear-gradient(180deg, rgba(13, 20, 36, 0.3) 0%, #1a2849 100%);
        }
        
        section[data-section="hero"]::before {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 200px;
            background: linear-gradient(to top, #1a2849 0%, transparent 100%);
            pointer-events: none;
            z-index: 3;
        }
        
        /* Decorative corner accent */
        section[data-section="hero"]::after {
            content: '';
            position: absolute;
            top: 90px;
            right: 0;
            width: 300px;
            height: 300px;
            background: radial-gradient(circle at top right, rgba(212, 165, 116, 0.08) 0%, transparent 60%);
            pointer-events: none;
            z-index: 3;
        }
        
        /* Experience Section - Gold accents with Thai-inspired geometric pattern */
        section[data-section="experience"] {
            background: linear-gradient(135deg, #1a2849 0%, #0d1424 50%, #1a2849 100%);
            position: relative;
            overflow: hidden;
        }
        
        /* Top border accent */
        section[data-section="experience"]::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, transparent 0%, var(--color-gold) 50%, transparent 100%);
        }
        
        /* Diamond pattern overlay */
        section[data-section="experience"]::after {
            content: '';
            position: absolute;
            inset: 0;
            background-image: 
                repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(212, 165, 116, 0.02) 35px, rgba(212, 165, 116, 0.02) 70px),
                repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(212, 165, 116, 0.02) 35px, rgba(212, 165, 116, 0.02) 70px);
            pointer-events: none;
            opacity: 0.6;
        }
        
        section[data-section="experience"] .sc-headline::before {
            content: '';
            position: absolute;
            top: -40px;
            left: 50%;
            transform: translateX(-50%);
            width: 100px;
            height: 2px;
            background: linear-gradient(90deg, transparent, var(--color-gold), transparent);
        }
        
        /* Lounge Cards Section - Hexagonal grid with depth */
        section[data-section="lounge"] {
            background: linear-gradient(180deg, #0d1424 0%, #1e2a44 30%, #2c3e5f 60%, #1a2849 100%);
            position: relative;
        }
        
        /* Subtle hexagonal pattern */
        section[data-section="lounge"]::before {
            content: '';
            position: absolute;
            inset: 0;
            background-image: 
                repeating-linear-gradient(0deg, rgba(212, 165, 116, 0.03) 0px, transparent 1px, transparent 60px, rgba(212, 165, 116, 0.03) 61px),
                repeating-linear-gradient(60deg, rgba(212, 165, 116, 0.03) 0px, transparent 1px, transparent 60px, rgba(212, 165, 116, 0.03) 61px),
                repeating-linear-gradient(120deg, rgba(212, 165, 116, 0.03) 0px, transparent 1px, transparent 60px, rgba(212, 165, 116, 0.03) 61px);
            pointer-events: none;
            opacity: 0.4;
        }
        
        /* Top decorative border */
        section[data-section="lounge"]::after {
            content: '';
            position: absolute;
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 80%;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(212, 165, 116, 0.3), transparent);
        }
        
        section[data-section="lounge"] .sc-headline {
            position: relative;
        }
        
        section[data-section="lounge"] .sc-headline::before {
            content: '';
            position: absolute;
            top: -30px;
            left: 50%;
            transform: translateX(-50%);
            width: 60px;
            height: 3px;
            background: linear-gradient(90deg, transparent, var(--color-gold), transparent);
        }
        
        /* Side accent glows */
        section[data-section="lounge"] .sc-inner::before,
        section[data-section="lounge"] .sc-inner::after {
            content: '';
            position: absolute;
            top: 50%;
            width: 200px;
            height: 400px;
            transform: translateY(-50%);
            border-radius: 50%;
            pointer-events: none;
        }
        
        section[data-section="lounge"] .sc-inner::before {
            left: -100px;
            background: radial-gradient(circle, rgba(212, 165, 116, 0.06) 0%, transparent 70%);
        }
        
        section[data-section="lounge"] .sc-inner::after {
            right: -100px;
            background: radial-gradient(circle, rgba(255, 0, 0, 0.04) 0%, transparent 70%);
        }
        
        /* Testimonials Section - Warm spotlight with radial pattern */
        section[data-section="testimonials"] {
            background: linear-gradient(135deg, #1a2849 0%, #0d1424 100%);
            position: relative;
        }
        
        /* Central warm glow */
        section[data-section="testimonials"]::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 1000px;
            height: 1000px;
            background: radial-gradient(circle, rgba(255, 0, 0, 0.12) 0%, rgba(212, 165, 116, 0.05) 40%, transparent 70%);
            pointer-events: none;
        }
        
        /* Radial lines pattern */
        section[data-section="testimonials"]::after {
            content: '';
            position: absolute;
            inset: 0;
            background-image: 
                repeating-conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(212, 165, 116, 0.02) 1deg, transparent 2deg);
            pointer-events: none;
            opacity: 0.3;
        }
        
        section[data-section="testimonials"] .sc-heading {
            text-shadow: 0 2px 30px rgba(212, 165, 116, 0.4);
            position: relative;
        }
        
        /* Star accent above heading */
        section[data-section="testimonials"] .sc-headline::before {
            content: '★';
            position: absolute;
            top: -50px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 24px;
            color: var(--color-gold);
            opacity: 0.6;
        }
        
        /* CTA Section - Bold and commanding with diagonal stripes */
        section[data-section="cta"] {
            position: relative;
            background: linear-gradient(135deg, #0d1424 0%, #1a2849 100%);
        }
        
        /* Dramatic overlay gradient */
        section[data-section="cta"]::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(255, 0, 0, 0.25) 0%, transparent 40%, rgba(212, 165, 116, 0.15) 100%);
            pointer-events: none;
            z-index: 2;
        }
        
        /* Diagonal stripe pattern */
        section[data-section="cta"]::after {
            content: '';
            position: absolute;
            inset: 0;
            background-image: repeating-linear-gradient(
                45deg,
                transparent,
                transparent 100px,
                rgba(255, 0, 0, 0.03) 100px,
                rgba(255, 0, 0, 0.03) 200px
            );
            pointer-events: none;
            z-index: 2;
        }
        
        section[data-section="cta"] .sc-heading {
            text-shadow: 0 4px 30px rgba(0, 0, 0, 0.8);
        }
        
        section[data-section="cta"] .button {
            box-shadow: 0 10px 40px rgba(255, 0, 0, 0.6);
            animation: pulseGlow 2s ease-in-out infinite;
            transform: scale(1.05);
        }
        
        @keyframes pulseGlow {
            0%, 100% {
                box-shadow: 0 10px 40px rgba(255, 0, 0, 0.6);
            }
            50% {
                box-shadow: 0 15px 60px rgba(255, 0, 0, 0.8), 0 0 30px rgba(212, 165, 116, 0.4);
            }
        }
        
        /* Section indicators - decorative line beneath headings */
        .sc-headline::after {
            content: '';
            display: block;
            width: 80px;
            height: 2px;
            background: linear-gradient(90deg, transparent, var(--color-gold), transparent);
            margin: 20px auto 0;
            opacity: 0.6;
        }
        
        /* Accessibility */
        .sr-only {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border-width: 0;
        }
        
        /* Focus styles */
        a:focus,
        button:focus {
            outline: 2px solid var(--color-gold);
            outline-offset: 2px;
        }
        
        /* Skip to content link */
        .skip-to-content {
            position: absolute;
            top: -40px;
            left: 0;
            background: var(--color-red);
            color: white;
            padding: 8px;
            text-decoration: none;
            z-index: 100;
        }
        
        .skip-to-content:focus {
            top: 0;
        }
        
        /* Main description read more styles */
        .experience-main-desc {
            display: -webkit-box;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            overflow: hidden;
            transition: all 0.3s ease;
        }
        
        .experience-main-desc.expanded {
            -webkit-line-clamp: unset;
            display: block;
        }
        
        #mainDescReadMore {
            margin-top: 12px;
        }
        
        /* Back to Top Button - Updated CI */
        .back-to-top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 50px;
            height: 50px;
            background: var(--color-red);
            color: white;
            border: none;
            border-radius: 50%;
            cursor: pointer;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s;
            z-index: 999;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            font-weight: bold;
            box-shadow: 0 4px 15px rgba(255, 0, 0, 0.4);
        }

        .back-to-top.visible {
            opacity: 1;
            visibility: visible;
        }

        .back-to-top:hover {
            background: var(--color-red-hover);
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(255, 0, 0, 0.5);
        }

        @media (max-width: 768px) {
            .back-to-top {
                bottom: 20px;
                right: 20px;
                width: 45px;
                height: 45px;
            }
        }
        
        /* Button Styles Update for Modal */
        .entry-explore {
            padding: var(--space-lg);
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            display: flex;
            gap: var(--space-md);
        }
        
        .entry-explore .button {
            flex: 1;
            text-align: center;
        }
        
        .button.outline {
            background: transparent;
            color: var(--color-gold);
            border: 2px solid var(--color-gold);
        }
        
        .button.outline:hover {
            background: var(--color-gold);
            color: var(--color-black);
        }
        
        /* Seat Plan Modal Styles */
        .seat-plan-modal {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.9);
            z-index: 10000;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }
        
        .seat-plan-modal.active {
            display: flex;
        }
        
        .seat-plan-container {
            position: relative;
            max-width: 90%;
            max-height: 90%;
            background: var(--color-theme);
            border-radius: var(--radius-xl);
            padding: 20px;
            border: 2px solid var(--color-gold);
        }
        
        .seat-plan-close {
            position: absolute;
            top: -15px;
            right: -15px;
            width: 40px;
            height: 40px;
            background: var(--color-red);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--color-white);
            font-size: 24px;
            cursor: pointer;
            transition: all 0.3s ease;
            z-index: 10;
        }
        
        .seat-plan-close:hover {
            transform: rotate(90deg);
            background: var(--color-red-hover);
        }
        
        .seat-plan-image {
            width: 100%;
            height: auto;
            max-height: 80vh;
            object-fit: contain;
            border-radius: var(--radius-lg);
        }

        /* Page Loading Effect */
        #page-loader {
            position: fixed;
            inset: 0;
            z-index: 9999;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #1a2849;
            transition: transform 0.7s ease-in-out;
            transform: translateY(0);
            overflow: hidden;
        }

        #page-loader.exiting {
            transform: translateY(-100%);
        }

        .loader-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .loader-logo {
            width: 200px;
            height: auto;
            opacity: 0;
            transform: translateY(64px);
            transition: opacity 0.5s ease-out, transform 0.5s ease-out;
        }

        .loader-logo.show {
            opacity: 1;
            transform: translateY(0);
        }

        @media (max-width: 768px) {
            .loader-logo {
                width: 150px;
            }
        }

        /* FAQ Section Styling */
        #faq-section {
            padding: var(--section-padding-y) var(--section-padding-x);
            background: var(--color-theme);
        }

        .faq-container {
            max-width: 1200px;
            margin: 0 auto;
        }

        .faq-header {
            max-width: 512px;
            margin: 0 auto 48px;
            text-align: center;
        }

        .faq-header h2 {
            font-family: var(--font-heading);
            margin-bottom: 20px;
            font-size: var(--text-3xl);
            font-weight: 400;
            color: var(--color-white);
        }

        .faq-header p {
            color: rgba(255, 255, 255, 0.8);
            font-size: var(--text-base);
        }

        .faq-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 48px;
            margin-bottom: 48px;
        }

        @media (min-width: 768px) {
            .faq-header {
                margin-bottom: 72px;
            }

            .faq-header h2 {
                font-size: var(--text-5xl);
            }

            .faq-grid {
                grid-template-columns: 1fr 1fr;
                gap: 64px;
                margin-bottom: 72px;
            }
        }

        .faq-accordion {
            width: 100%;
        }

        .faq-accordion-item {
            border-bottom: 1px solid rgba(212, 165, 116, 0.2);
            overflow: hidden;
        }

        .faq-accordion-item:first-child {
            border-top: 1px solid rgba(212, 165, 116, 0.2);
        }

        @media (min-width: 768px) {
            .faq-grid .faq-accordion:last-child .faq-accordion-item:first-child {
                border-top: 1px solid rgba(212, 165, 116, 0.2);
            }
        }

        .faq-accordion-trigger {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 20px 0;
            background: transparent;
            border: none;
            cursor: pointer;
            text-align: left;
            font-size: var(--text-base);
            font-weight: 600;
            color: var(--color-white);
            transition: color 0.3s;
        }

        .faq-accordion-trigger:hover {
            color: var(--color-gold);
        }

        @media (min-width: 768px) {
            .faq-accordion-trigger {
                padding: 24px 0;
                font-size: var(--text-lg);
            }
        }

        .faq-accordion-icon {
            flex-shrink: 0;
            margin-left: 16px;
            width: 24px;
            height: 24px;
            transition: transform 0.3s;
        }

        .faq-accordion-icon svg {
            width: 100%;
            height: 100%;
            stroke: currentColor;
        }

        .faq-accordion-item.active .faq-accordion-icon {
            transform: rotate(180deg);
        }

        .faq-accordion-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out, padding 0.3s ease-out;
            padding: 0;
        }

        .faq-accordion-item.active .faq-accordion-content {
            max-height: 1000px;
            padding-bottom: 24px;
        }

        @media (min-width: 768px) {
            .faq-accordion-item.active .faq-accordion-content {
                padding-bottom: 32px;
            }
        }

        .faq-accordion-content p {
            color: rgba(255, 255, 255, 0.75);
            line-height: 1.6;
            font-size: var(--text-base);
        }

        .faq-footer {
            max-width: 448px;
            margin: 0 auto;
            text-align: center;
            padding-top: 48px;
            border-top: 1px solid rgba(212, 165, 116, 0.2);
        }

        @media (min-width: 768px) {
            .faq-footer {
                padding-top: 72px;
            }
        }

        .faq-footer h4 {
            margin-bottom: 12px;
            font-size: var(--text-2xl);
            font-weight: 400;
            color: var(--color-white);
        }

        @media (min-width: 768px) {
            .faq-footer h4 {
                margin-bottom: 16px;
                font-size: var(--text-3xl);
            }
        }

        .faq-footer p {
            color: rgba(255, 255, 255, 0.8);
            font-size: var(--text-base);
            margin-bottom: 24px;
        }

        @media (min-width: 768px) {
            .faq-footer p {
                margin-bottom: 32px;
            }
        }

        .faq-footer .button {
            display: inline-block;
        }

        /* Mobile Fixed Get Tickets Button */
        #get-tickets-fixed {
            display: none;
            position: fixed;
            bottom: 80px;
            right: 0;
            z-index: 1000;
            writing-mode: vertical-rl;
            text-orientation: mixed;
        }

        #get-tickets-fixed .button {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 16px 12px;
            border-radius: 8px 0 0 8px;
            box-shadow: -4px 4px 20px rgba(0, 0, 0, 0.3);
            text-decoration: none;
            white-space: nowrap;
        }

        #get-tickets-fixed .ic-arrow-down {
            transform: rotate(-90deg);
            font-size: 16px;
        }

        #get-tickets-fixed .ic-name {
            font-size: 14px;
            font-weight: 600;
        }

        @media (max-width: 768px) {
            #get-tickets-fixed {
                display: block;
            }
        }