/* =====================================================
           THEME SYSTEM — Dark (default) & Light mode
           All colors flow from these variables. Never use
           raw hex values outside of brand-specific palettes
           (carrier logos, WhatsApp green, etc.)
        ===================================================== */
   :root {
       /* ── Luxury Gold Palette (unchanged across themes) ── */
       --platinum: #C0C0C0;
       --platinum-bright: #E5E7EB;
       --platinum-muted: rgba(192, 192, 192, 0.15);
       --gold: #D4AF37;
       --gold-glow: rgba(212, 175, 55, 0.35);
       --gold-muted: rgba(212, 175, 55, 0.15);
       --gold-border: rgba(212, 175, 55, 0.15);
       --gold-border-hover: rgba(212, 175, 55, 0.4);

       /* ── Typography ── */
       --font-serif: "Playfair Display", "Didot", serif;
       --font-sans: "Manrope", "Inter", sans-serif;
   }

   /* ── DARK MODE (default) ── */
   :root,
   [data-theme="dark"] {
       --bg-primary: #0a0e1a;
       /* page background */
       --bg-card: #111827;
       /* card surfaces   */
       --bg-surface: #060913;
       /* deepest surface */
       --bg-footer: #05070d;
       --bg-navbar-scrolled: rgba(10, 14, 26, 0.90);
       --bg-navbar-gradient: linear-gradient(to bottom, rgba(10, 14, 26, 0.95) 0%, rgba(10, 14, 26, 0.4) 70%, transparent 100%);
       --bg-navbar-mobile: rgba(10, 14, 26, 0.98);
       --bg-dropdown: rgba(10, 14, 26, 0.98);
       --bg-offcanvas: #0a0e1a;
       --bg-gradient-leak: radial-gradient(circle at 80% 20%, #1a150a 0%, #0a0e1a 65%);
       --bg-overlay: linear-gradient(to bottom, rgba(10, 14, 26, 0.4) 0%, rgba(10, 14, 26, 0.98) 100%);
       --bg-section-video-overlay: linear-gradient(180deg, #0a0e1a 0%, rgba(10, 14, 26, 0.85) 50%, #0a0e1a 100%);

       --text-primary: #F9FAFB;
       --text-secondary: #9CA3AF;
       --text-muted: rgba(255, 255, 255, 0.5);
       --text-nav: rgba(255, 255, 255, 0.7);
       --text-nav-hover: #E5E7EB;

       --border-subtle: rgba(212, 175, 55, 0.12);
       --border-white: rgba(255, 255, 255, 0.05);
       --border-white-md: rgba(255, 255, 255, 0.08);
       --border-divider: rgba(255, 255, 255, 0.03);

       --card-bg: rgba(255, 255, 255, 0.01);
       --card-bg-hover: rgba(255, 255, 255, 0.03);
       --input-bg: rgba(255, 255, 255, 0.02);
       --input-bg-focus: rgba(255, 255, 255, 0.04);
       --input-text: #ffffff;

       --scrollbar-bg: #060913;
       --scrollbar-thumb: rgba(212, 175, 55, 0.15);

       --hover-label-bg: rgba(6, 11, 22, 0.95);
       --phone-screen-bg: #060913;
       --phone-border: #1e293b;

       --faq-bg: rgba(17, 24, 37, 0.4);
       --faq-bg-hover: rgba(17, 24, 37, 0.7);
       --legal-bg: #060912;
       --footer-social-hover-text: #060912;

       --theme-toggle-border: rgba(255, 255, 255, 0.15);
       --theme-toggle-bg: rgba(255, 255, 255, 0.06);
       --theme-toggle-color: rgba(255, 255, 255, 0.7);
   }

   /* ── LIGHT MODE ── */
   [data-theme="light"] {
       --bg-primary: #f5f3ee;
       --bg-card: #ffffff;
       --bg-surface: #ece9e2;
       --bg-footer: #1a1610;
       --bg-navbar-scrolled: rgba(245, 243, 238, 0.96);
       --bg-navbar-gradient: linear-gradient(to bottom, rgba(245, 243, 238, 0.97) 0%, rgba(245, 243, 238, 0.7) 70%, transparent 100%);
       --bg-navbar-mobile: rgba(245, 243, 238, 0.99);
       --bg-dropdown: rgba(255, 255, 255, 0.99);
       --bg-offcanvas: #f5f3ee;
       --bg-gradient-leak: radial-gradient(circle at 80% 20%, #f0ead8 0%, #f5f3ee 65%);
       --bg-overlay: linear-gradient(to bottom, rgba(245, 243, 238, 0.3) 0%, rgba(245, 243, 238, 0.92) 100%);
       --bg-section-video-overlay: linear-gradient(180deg, #f5f3ee 0%, rgba(245, 243, 238, 0.88) 50%, #f5f3ee 100%);

       --text-primary: #1a1a2e;
       --text-secondary: #4b5563;
       --text-muted: rgba(30, 30, 50, 0.5);
       --text-nav: rgba(20, 20, 40, 0.75);
       --text-nav-hover: #0f0f1a;

       --border-subtle: rgba(212, 175, 55, 0.25);
       --border-white: rgba(0, 0, 0, 0.08);
       --border-white-md: rgba(0, 0, 0, 0.12);
       --border-divider: rgba(0, 0, 0, 0.06);

       --card-bg: rgba(0, 0, 0, 0.02);
       --card-bg-hover: rgba(0, 0, 0, 0.04);
       --input-bg: rgba(0, 0, 0, 0.03);
       --input-bg-focus: rgba(0, 0, 0, 0.05);
       --input-text: #1a1a2e;

       --scrollbar-bg: #ece9e2;
       --scrollbar-thumb: rgba(212, 175, 55, 0.3);

       --hover-label-bg: rgba(245, 243, 238, 0.97);
       --phone-screen-bg: #ece9e2;
       --phone-border: #c9c2b5;

       --faq-bg: rgba(255, 255, 255, 0.6);
       --faq-bg-hover: rgba(255, 255, 255, 0.9);
       --legal-bg: #ece9e2;
       --footer-social-hover-text: #f5f3ee;

       --theme-toggle-border: rgba(0, 0, 0, 0.15);
       --theme-toggle-bg: rgba(0, 0, 0, 0.05);
       --theme-toggle-color: rgba(30, 30, 50, 0.7);
   }

   html,
   body {
       width: 100%;
       overflow-x: hidden;
   }

   html {
       scroll-behavior: smooth;
       background-color: var(--bg-primary);
   }

   body {
       font-family: var(--font-sans);
       background-color: var(--bg-primary);
       color: var(--text-primary);
       overflow-x: hidden;
       letter-spacing: -0.2px;
       transition: background-color 0.4s ease, color 0.4s ease;
   }

   /* Custom Scrollbar */
   ::-webkit-scrollbar {
       width: 8px;
       background: var(--scrollbar-bg);
   }

   ::-webkit-scrollbar-thumb {
       background: var(--scrollbar-thumb);
       border-radius: 4px;
   }

   ::-webkit-scrollbar-thumb:hover {
       background: var(--gold);
   }

   h1,
   h2,
   h3,
   h4,
   h5,
   h6 {
       font-family: var(--font-serif);
       letter-spacing: 0.5px;
   }

   p {
       font-size: 1.05rem;
       line-height: 1.8;
       font-weight: 300;
   }

   .platinum-text,
   .text-platinum {
       background: linear-gradient(135deg, #FFFFFF 0%, var(--platinum) 60%, #9CA3AF 100%);
       background-clip: text;
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       color: var(--platinum) !important;
   }

   .text-gold {
       color: var(--gold) !important;
   }

   /* =========================
           LOADER SCREEN SYSTEM
        ========================= */
   #loader {
       position: fixed;
       inset: 0;
       background: var(--bg-primary);
       display: flex;
       justify-content: center;
       align-items: center;
       z-index: 99999;
       transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1);
   }

   #loader .loader-brand {
       position: relative;
       text-align: center;
   }

   #loader img {
       width: 110px;
       height: 110px;
       border: 1px solid var(--gold-muted);
       padding: 5px;
       animation: pulseGlow 3s ease-in-out infinite;
   }

   /* =========================
           ELITE HEADER & NAVIGATION
        ========================= */
   .navbar {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       z-index: 1000;
       padding: 35px 0;
       background: var(--bg-navbar-gradient);
       transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .navbar.scrolled {
       padding: 16px 0;
       background: var(--bg-navbar-scrolled);
       backdrop-filter: blur(24px);
       -webkit-backdrop-filter: blur(24px);
       border-bottom: 1px solid var(--gold-border);
   }

   .navbar-brand {
       font-family: var(--font-serif);
       font-weight: 700;
       letter-spacing: 1px;
       font-size: 1.25rem;
       text-transform: uppercase;
   }

   .nav-link {
       color: var(--text-nav) !important;
       margin-left: 24px;
       font-weight: 400;
       font-size: 0.85rem;
       text-transform: uppercase;
       letter-spacing: 1.5px;
       transition: color .3s ease;
       position: relative;
   }

   .nav-link:hover {
       color: var(--text-nav-hover) !important;
   }

   .nav-link::after {
       content: '';
       position: absolute;
       bottom: -6px;
       left: 50%;
       width: 0;
       height: 2px;
       background: var(--gold);
       transform: translateX(-50%);
       transition: width .4s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .nav-link:hover::after {
       width: 100%;
   }

   @media (max-width: 1199px) {
       .nav-link {
           margin-left: 12px;
           font-size: 0.75rem;
       }
   }

   @media (max-width: 991px) {
       .navbar {
           padding: 20px 0;
       }

       .navbar-collapse {
           margin-top: 20px;
           background: var(--bg-navbar-mobile);
           backdrop-filter: blur(20px);
           border: 1px solid var(--gold-border);
           border-radius: 4px;
           padding: 24px;
       }

       .nav-link {
           margin-left: 0;
           padding: 14px 0 !important;
           border-bottom: 1px solid var(--border-divider);
       }

       .nav-link::after {
           display: none;
       }
   }

   /* =========================
           CINEMATIC HERO DISPLAY
        ========================= */
   .hero {
       height: 100vh;
       position: relative;
       overflow: hidden;
       display: flex;
       align-items: center;
       background: #000;
   }

   .hero video {
       position: absolute;
       top: 50%;
       left: 50%;
       min-width: 100%;
       min-height: 100%;
       transform: translate(-50%, -50%);
       object-fit: cover;
       filter: brightness(0.3) contrast(1.1);
   }

   .hero-overlay {
       position: absolute;
       inset: 0;
       background: linear-gradient(to bottom, rgba(10, 14, 26, 0.4) 0%, rgba(10, 14, 26, 0.98) 100%);
       z-index: 2;
   }

   .hero-content {
       position: relative;
       z-index: 10;
       width: 100%;
       margin-top: 80px;
   }

   .hero h1 {
       font-size: 4rem;
       font-weight: 700;
       line-height: 1.2;
       letter-spacing: -0.5px;
       margin-bottom: 24px;
   }

   @media (max-width: 768px) {
       .hero h1 {
           font-size: 2.4rem;
       }
   }

   /* =========================
           PREMIUM GEOMETRIC BUTTONS
        ========================= */
   .btn-luxury {
       position: relative;
       padding: 14px 30px;
       font-size: 0.8rem;
       font-weight: 600;
       text-transform: uppercase;
       letter-spacing: 2px;
       color: #000000 !important;
       background: var(--gold);
       border: 1px solid var(--gold);
       border-radius: 2px;
       box-shadow: 0 4px 14px var(--gold-muted);
       transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
       overflow: hidden;
   }

   .btn-luxury:hover {
       transform: translateY(-3px);
       background: transparent;
       color: var(--gold) !important;
       box-shadow: 0 12px 30px var(--gold-glow);
       border-color: var(--gold);
   }

   .btn-luxury::before {
       content: '';
       position: absolute;
       top: 0;
       left: -150%;
       width: 150%;
       height: 100%;
       background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
       transition: 0.7s;
   }

   .btn-luxury:hover::before {
       left: 150%;
   }

   .btn-outline-luxury {
       padding: 14px 30px;
       font-size: 0.8rem;
       font-weight: 500;
       text-transform: uppercase;
       letter-spacing: 2px;
       color: #FFF;
       background: transparent;
       border: 1px solid rgba(212, 175, 55, 0.4);
       border-radius: 2px;
       transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .btn-outline-luxury:hover {
       border-color: var(--gold);
       background: var(--gold-muted);
       color: #FFF;
       transform: translateY(-3px);
       box-shadow: 0 8px 24px var(--gold-glow);
   }

   /* =========================
           ELEGANT CONTAINER BLOCKS
        ========================= */
   .luxury-section {
       padding: 120px 0;
       position: relative;
       background-color: var(--bg-dark-absolute);
   }

   /* Dynamic Services Background Video Setup */
   .luxury-section-video-bg {
       position: relative;
       padding: 120px 0;
       background: #000;
       overflow: hidden;
   }

   .luxury-section-video-bg .section-video {
       position: absolute;
       top: 50%;
       left: 50%;
       min-width: 100%;
       min-height: 100%;
       transform: translate(-50%, -50%);
       object-fit: cover;
       z-index: 1;
       filter: brightness(0.2) contrast(1.1);
   }

   .luxury-section-video-bg .video-overlay {
       position: absolute;
       inset: 0;
       background: linear-gradient(180deg, var(--bg-dark-absolute) 0%, rgba(10, 14, 26, 0.85) 50%, var(--bg-dark-absolute) 100%);
       z-index: 2;
   }

   .luxury-section-video-bg .container {
       position: relative;
       z-index: 3;
   }

   .bg-gradient-leak {
       background: radial-gradient(circle at 80% 20%, #1a150a 0%, var(--bg-dark-absolute) 65%);
   }

   .section-header {
       margin-bottom: 70px;
   }

   .section-eyebrow {
       font-size: 0.8rem;
       text-transform: uppercase;
       letter-spacing: 4px;
       color: var(--gold);
       display: block;
       margin-bottom: 14px;
       font-weight: 600;
   }

   .section-title {
       font-size: 2.8rem;
       font-weight: 700;
       line-height: 1.2;
   }

   .unlocked-glow {
       color: var(--text-light);
       font-weight: 700;
       position: relative;
       display: inline-block;
       animation: pulseGlow 3s ease-in-out infinite;
   }

   @keyframes pulseGlow {

       0%,
       100% {
           text-shadow: 0 0 10px rgba(212, 175, 55, 0.2);
       }

       50% {
           text-shadow: 0 0 25px rgba(212, 175, 55, 0.6);
       }
   }

   /* =========================
   VIDEO BACKGROUND SECTION
========================= */
   .video-bg-section {
       position: relative;
       overflow: hidden;
       background: #000;
       /* Fallback color */
   }

   .section-video-bg {
       position: absolute;
       top: 50%;
       left: 50%;
       min-width: 100%;
       min-height: 100%;
       width: auto;
       height: auto;
       transform: translate(-50%, -50%);
       object-fit: cover;
       z-index: 1;
       filter: brightness(0.35) saturate(0.85);
       /* Tames the brightness of the violet video */
   }

   .section-video-overlay {
       position: absolute;
       inset: 0;
       /* Soft top/bottom fade that anchors the section into your dark absolute body theme */
       background: linear-gradient(to bottom, var(--bg-dark-absolute) 0%, transparent 15%, transparent 85%, var(--bg-dark-absolute) 100%);
       z-index: 2;
   }

   /* Helper utility context wrapper positioning override */
   .z-3 {
       z-index: 3 !important;
   }

   /* =========================
           ELITE CARD SYSTEM
        ========================= */
   .elite-card {
       position: relative;
       padding: 40px;
       background: rgba(17, 24, 39, 0.85);
       backdrop-filter: blur(12px);
       -webkit-backdrop-filter: blur(12px);
       border: 1px solid var(--border-subtle);
       border-radius: 2px;
       transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
       height: 100%;
   }

   .elite-card:hover {
       transform: translateY(-10px);
       border-color: rgba(212, 175, 55, 0.5);
       background: rgba(17, 24, 39, 0.95);
       box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6), 0 0 20px var(--gold-glow);
   }

   .elite-icon {
       font-size: 28px;
       margin-bottom: 24px;
       display: block;
       color: var(--gold);
       transition: transform 0.4s ease, color 0.4s ease;
   }

   .elite-card:hover .elite-icon {
       transform: scale(1.1);
       color: #fff;
       filter: drop-shadow(0 0 8px var(--gold-glow));
   }

   .why-box {
       text-align: center;
       padding: 40px 20px;
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid rgba(255, 255, 255, 0.02);
       border-radius: 2px;
       transition: all 0.4s ease;
       height: 100%;
   }

   .why-box:hover {
       background: var(--gold-muted);
       border-color: rgba(212, 175, 55, 0.3);
       box-shadow: 0 10px 25px var(--gold-muted);
   }

   .why-box i {
       font-size: 32px;
       color: var(--gold);
       margin-bottom: 16px;
       transition: color 0.3s ease;
   }

   .why-box:hover i {
       color: #fff;
       filter: drop-shadow(0 0 6px var(--gold-glow));
   }

   /* =========================
           TRACKING ENGINE
        ========================= */
   .track-input-group {
       background: var(--bg-dark-card);
       border: 1px solid var(--border-subtle);
       padding: 8px;
       border-radius: 2px;
       transition: all 0.3s ease;
   }

   .track-input-group:focus-within {
       border-color: var(--gold);
       box-shadow: 0 0 15px var(--gold-glow);
   }

   .track-input-group input {
       background: transparent;
       border: none;
       color: white;
       padding: 12px;
       width: 100%;
   }

   .track-input-group input:focus {
       outline: none;
   }

   /* =========================
           FORM LAYERS
        ========================= */
   .form-control {
       background: rgba(255, 255, 255, 0.02);
       border: 1px solid rgba(255, 255, 255, 0.08);
       border-radius: 2px;
       padding: 14px;
       color: #FFF !important;
       transition: all 0.4s ease;
   }

   .form-control:focus {
       background: rgba(255, 255, 255, 0.04);
       border-color: var(--gold);
       box-shadow: 0 0 15px var(--gold-glow);
       outline: none;
   }

   /* =========================
           MEMBERSHIP OFFCANVAS
        ========================= */
   .membership-canvas {
       width: 85vw !important;
       max-width: 950px;
       background: rgba(10, 14, 26, 0.98) !important;
       backdrop-filter: blur(30px);
       -webkit-backdrop-filter: blur(30px);
       color: var(--text-light);
       z-index: 1050;
   }

   @media (max-width: 768px) {
       .membership-canvas {
           width: 100vw !important;
       }
   }

   .btn-close-luxury {
       background: transparent;
       border: 1px solid rgba(255, 255, 255, 0.1);
       color: rgba(255, 255, 255, 0.6);
       padding: 8px 16px;
       font-size: 0.75rem;
       text-transform: uppercase;
       letter-spacing: 2px;
       transition: all 0.3s ease;
   }

   .btn-close-luxury:hover {
       color: var(--platinum-bright);
       border-color: var(--gold);
       box-shadow: 0 0 10px var(--gold-glow);
   }

   .tier-card {
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid var(--border-subtle);
       padding: 35px;
       height: 100%;
       border-radius: 2px;
       display: flex;
       flex-direction: column;
       transition: all 0.4s ease;
   }

   .featured-tier {
       border: 1px solid rgba(212, 175, 55, 0.4) !important;
       background: linear-gradient(180deg, rgba(255, 255, 255, 0.01) 0%, var(--gold-muted) 100%);
   }

   .tier-card:hover {
       border-color: rgba(212, 175, 55, 0.5);
       box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
   }

   .tier-features {
       list-style: none;
       padding: 0;
       margin: 20px 0;
   }

   .tier-features li {
       font-size: 0.9rem;
       margin-bottom: 12px;
       display: flex;
       align-items: flex-start;
       gap: 10px;
   }

   .tier-features li i {
       margin-top: 5px;
       font-size: 0.75rem;
   }

   .floating-contact {
       position: fixed;
       right: 35px;
       bottom: 35px;
       display: flex;
       flex-direction: column;
       gap: 20px;
       z-index: 9999;
   }

   .floating-btn {
       position: relative;
       width: 56px;
       height: 56px;
       border-radius: 50%;
       display: flex;
       justify-content: center;
       align-items: center;
       font-size: 22px;
       color: white !important;
       text-decoration: none;
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
       transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.4s ease;
       backdrop-filter: blur(8px);
   }

   /* Platform Color Definitions */
   .floating-btn:first-child {
       background: rgba(37, 211, 102, 0.85);
       border: 1px solid rgba(37, 211, 102, 0.3);
   }

   .floating-btn:last-child {
       background: rgba(214, 175, 55, 0.85);
       border: 1px solid rgba(214, 175, 55, 0.3);
   }

   /* The Slide-Out Chat Label */
   .hover-label {
       position: absolute;
       right: 70px;
       top: 50%;
       transform: translateY(-50%) translateX(15px);
       background: rgba(6, 11, 22, 0.95);
       color: #FFF;
       font-size: 0.8rem;
       font-weight: 500;
       text-transform: uppercase;
       letter-spacing: 1.5px;
       padding: 8px 18px;
       white-space: nowrap;
       border-radius: 4px;
       border: 1px solid rgba(255, 255, 255, 0.08);
       opacity: 0;
       pointer-events: none;
       transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
           transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
   }

   /* Left-facing notch arrow indicator on label */
   .hover-label::after {
       content: '';
       position: absolute;
       right: -5px;
       top: 50%;
       transform: translateY(-50%) rotate(45deg);
       width: 8px;
       height: 8px;
       background: rgba(6, 11, 22, 0.95);
       border-right: 1px solid rgba(255, 255, 255, 0.08);
       border-top: 1px solid rgba(255, 255, 255, 0.08);
   }

   /* Hover Mechanics */
   .floating-btn:hover {
       transform: translateY(-4px);
   }

   .floating-btn:hover .hover-label {
       opacity: 1;
       transform: translateY(-50%) translateX(0);
   }

   /* =========================
           PHONE CHAT SIMULATION
        ========================= */
   .phone-mockup {
       width: 100%;
       max-width: 310px;
       height: 580px;
       background: #000;
       border: 10px solid #1e293b;
       border-radius: 36px;
       overflow: hidden;
       box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7);
   }

   .phone-screen {
       height: 100%;
       display: flex;
       flex-direction: column;
       background: #060913;
   }

   .chat-container {
       flex: 1;
       padding: 14px;
       overflow-y: auto;
       display: flex;
       flex-direction: column;
       gap: 12px;
   }

   .chat-bubble {
       max-width: 85%;
       padding: 10px 12px;
       border-radius: 14px;
       font-size: 0.75rem;
       line-height: 1.5;
   }

   .client-bubble {
       background: rgba(255, 255, 255, 0.03);
       border: 1px solid rgba(255, 255, 255, 0.05);
       color: #eaeff7;
       align-self: flex-end;
       border-bottom-right-radius: 2px;
   }

   .concierge-bubble {
       background: var(--gold-muted);
       border: 1px solid rgba(212, 175, 55, 0.3);
       color: #fff;
       align-self: flex-start;
       border-bottom-left-radius: 2px;
   }

   footer {
       background: #05070d;
       padding: 100px 0 40px;
       border-top: 1px solid rgba(212, 175, 55, 0.1);
       color: var(--text-white);
       font-size: 0.95rem;
   }

   footer h5 {
       color: #FFF;
       font-size: 1.1rem;
       font-weight: 600;
       margin-bottom: 24px;
       text-transform: uppercase;
       letter-spacing: 1px;
   }

   .footer-links {
       list-style: none;
       padding: 0;
       margin: 0;
   }

   .footer-links li {
       margin-bottom: 12px;
   }

   .footer-links a {
       color: var(--text-white) !important;
       text-decoration: none;
       transition: color 0.3s ease;
   }

   .footer-links a:hover {
       color: var(--gold) !important;
       color: #000000 !important;

   }

   .social-icons a {
       width: 42px;
       height: 42px;
       border-radius: 50%;
       background: rgba(255, 255, 255, 0.02);
       display: inline-flex;
       justify-content: center;
       align-items: center;
       color: var(--text-light) !important;
       margin-right: 10px;
       transition: all 0.3s ease;
       border: 1px solid rgba(255, 255, 255, 0.05);
   }

   .social-icons a:hover {
       background: var(--gold);
       color: #000000 !important;
       transform: translateY(-3px);
       box-shadow: 0 6px 15px var(--gold-glow);
   }

   /* Custom Premium Dropdown Styling */
   .dropdown-menu-dark {
       background: rgba(10, 14, 26, 0.98) !important;
       backdrop-filter: blur(20px);
       -webkit-backdrop-filter: blur(20px);
       border: 1px solid rgba(212, 175, 55, 0.15) !important;
       border-radius: 2px !important;
       padding: 10px 0;
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
   }

   .dropdown-item {
       font-size: 0.8rem !important;
       text-transform: uppercase;
       letter-spacing: 1px;
       padding: 10px 20px !important;
       color: rgba(255, 255, 255, 0.8) !important;
       transition: all 0.3s ease;
   }

   .dropdown-item:hover {
       background: var(--gold-muted) !important;
       color: var(--gold) !important;
       padding-left: 24px !important;
       /* Elegant subtle slide effect on hover */
   }

   /* Ensure the dropdown chevron matches design constraints */
   .dropdown-toggle::after {
       vertical-align: 0.15em;
       margin-left: 0.4em;
       border-top: 0.3em solid;
       border-right: 0.3em solid transparent;
       border-left: 0.3em solid transparent;
   }

   /* =========================
           BESPOKE TESTIMONIALS SYSTEM
        ========================= */
   .testimonial-card {
       background: var(--bg-dark-card);
       border: 1px solid rgba(255, 255, 255, 0.03);
       padding: 45px 40px;
       height: 100%;
       display: flex;
       flex-direction: column;
       justify-content: space-between;
       backdrop-filter: blur(16px);
       -webkit-backdrop-filter: blur(16px);
       transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .featured-testimonial {
       border: 1px solid rgba(214, 175, 55, 0.2) !important;
       background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(214, 175, 55, 0.02) 100%);
       box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
   }

   .testimonial-card:hover {
       transform: translateY(-8px);
       border-color: rgba(214, 175, 55, 0.3);
       box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6);
   }

   .testimonial-quote-icon {
       font-size: 24px;
       color: rgba(255, 255, 255, 0.15);
       margin-bottom: 24px;
   }

   .testimonial-text {
       font-size: 0.98rem;
       line-height: 1.8;
       color: var(--text-white);
       font-weight: 300;
       margin-bottom: 30px;
   }

   .testimonial-divider {
       border: 0;
       border-top: 1px solid rgba(255, 255, 255, 0.06);
       margin-bottom: 24px;
       margin-top: auto;
   }

   .border-gold {
       border-top: 1px solid rgba(214, 175, 55, 0.25) !important;
   }

   .testimonial-name {
       font-family: var(--font-serif);
       font-weight: 600;
       font-size: 1.15rem;
       color: #FFF;
       margin-bottom: 4px;
       letter-spacing: 0.5px;
   }

   .testimonial-title {
       font-size: 0.78rem;
       text-transform: uppercase;
       letter-spacing: 1.5px;
       color: rgba(255, 255, 255, 0.5);
       display: block;
   }

   .italic-sans {
       font-size: 0.85rem;
       letter-spacing: 0.5px;
       opacity: 0.7;
   }

   /* =========================
   LUXURY FAQ COMPONENT STYLES
========================= */
   /* Keeps the text white and visible regardless of whether it's collapsed or expanded */
   .luxury-faq-trigger.accordion-button {
       color: #ffffff !important;
       background-color: transparent !important;
   }

   /* Optional: If Bootstrap is applying a default opacity or light-blue tint on focus/click, remove it here */
   .luxury-faq-trigger.accordion-button:focus {
       box-shadow: none;
       border-color: transparent;
   }

   .luxury-faq-item {
       background: rgba(17, 24, 37, 0.4) !important;
       border: none !important;
       border-bottom: 1px solid rgba(212, 175, 55, 0.12) !important;
       margin-bottom: 10px;
       transition: all 0.4s ease;
   }

   .luxury-faq-item:hover {
       background: rgba(17, 24, 37, 0.7) !important;
       border-bottom-color: rgba(212, 175, 55, 0.35) !important;
   }

   .luxury-faq-trigger {
       background: transparent !important;
       color: var(--text-white) !important;
       font-family: var(--font-serif);
       font-size: 1.15rem;
       font-weight: 400;
       padding: 24px 20px !important;
       box-shadow: none !important;
       transition: all 0.3s ease;
   }

   .luxury-faq-trigger:not(.collapsed) {
       color: var(--gold) !important;
       font-weight: 600;
       letter-spacing: 0.2px;
   }

   /* Custom Accordion Chevron Overwrite */
   .luxury-faq-trigger::after {
       background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239CA3AF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
       transform: rotate(-90deg);
       transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .luxury-faq-trigger:not(.collapsed)::after {
       background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23D4AF37'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
       transform: rotate(0deg);
   }

   .luxury-faq-body {
       background: transparent !important;
       color: var(--text-white);
       font-family: var(--font-sans);
       font-size: 0.98rem;
       font-weight: 300;
       line-height: 1.8;
       padding: 0 20px 28px 20px !important;
   }

   .tracking-iframe-wrapper {
       position: relative;
       width: 100%;
       height: 600px;
       /* Keeps your desired height desktop container */
       overflow: hidden;
       border-radius: 12px;
       /* Matches your luxury theme curves */
   }

   .tracking-iframe-wrapper iframe {
       width: 100% !important;
       height: 100% !important;
   }

   /* Adjust height dynamically for smaller mobile viewports */
   @media (max-width: 768px) {
       .tracking-iframe-wrapper {
           height: 500px;
       }
   }

   /* =========================
   PREMIUM DROPDOWN SYSTEM
========================= */
   .dropdown-menu-dark {
       background: rgba(10, 14, 26, 0.98) !important;
       backdrop-filter: blur(20px);
       -webkit-backdrop-filter: blur(20px);
       border: 1px solid rgba(212, 175, 55, 0.15) !important;
       border-radius: 2px !important;
       padding: 10px 0;
       box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
   }

   .dropdown-item {
       font-size: 0.8rem !important;
       text-transform: uppercase;
       letter-spacing: 1px;
       padding: 12px 24px !important;
       color: rgba(255, 255, 255, 0.8) !important;
       transition: all 0.3s ease;
       white-space: nowrap;
       /* Forces text to remain on a single line on desktop panels */
   }

   .dropdown-item:hover {
       background: var(--gold-muted) !important;
       color: var(--gold) !important;
       padding-left: 30px !important;
   }

   /* Caret Customizations */
   .dropdown-toggle::after {
       display: inline-block;
       margin-left: 0.45em;
       vertical-align: 0.255em;
       content: "";
       border-top: 0.3em solid;
       border-right: 0.3em solid transparent;
       border-left: 0.3em solid transparent;
       color: var(--gold);
       transition: transform 0.3s ease;
   }

   .dropdown.show .dropdown-toggle::after {
       transform: rotate(-180deg);
   }

   /* Responsive Structural Breakpoints */
   @media (min-width: 992px) {

       /* For Widescreen Devices: Dropdown container dynamic size based on widest element */
       .custom-nav-dropdown {
           width: max-content !important;
           min-width: 210px !important;
           position: absolute;
       }
   }

   @media (max-width: 991px) {
       .navbar-collapse {
           padding: 20px 15px !important;
       }

       .nav-link {
           width: 100%;
           padding: 14px 10px !important;
           margin-left: 0 !important;
           border-bottom: 1px solid rgba(255, 255, 255, 0.03);
       }

       /* For Mobile and Tablets: Full width bleed to match parent menu block container */
       .custom-nav-dropdown {
           width: 100% !important;
           margin: 0 !important;
           border: none !important;
           border-left: 2px solid var(--gold) !important;
           /* Elegant vertical baseline tracker on mobile */
           background: rgba(6, 9, 13, 0.6) !important;
           border-radius: 0 !important;
       }

       .dropdown-item {
           white-space: normal;
           /* Safe wrap handling for constrained smaller viewports */
           padding-left: 20px !important;
       }
   }

   /* =======================================
   INTERACTIVE REVEAL CAPABILITIES SYSTEM
   ======================================= */
   .interactive-service-card {
       cursor: pointer;
       display: flex;
       flex-direction: column;
       transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   }

   /* Base state for hidden text wrapper */
   .service-description-wrapper {
       display: grid;
       grid-template-rows: 0fr;
       transition: grid-template-rows 0.45s cubic-bezier(0.16, 1, 0.3, 1);
   }

   /* Hidden internal text state */
   .service-description-wrapper p {
       overflow: hidden;
       opacity: 0;
       transform: translateY(10px);
       transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
   }

   /* Custom visual expand caret styling */
   .card-toggle-icon {
       font-size: 0.85rem;
       color: var(--text-white);
       transition: transform 0.4s ease, color 0.3s ease;
       padding-top: 5px;
   }

   /* ACTIVE EXPANSION TRIGGER STATE (Hover or Click) */
   .interactive-service-card:hover .service-description-wrapper,
   .interactive-service-card.is-expanded .service-description-wrapper {
       grid-template-rows: 1fr;
   }

   .interactive-service-card:hover .service-description-wrapper p,
   .interactive-service-card.is-expanded .service-description-wrapper p {
       opacity: 1;
       transform: translateY(0);
   }

   /* Rotate indicator indicator chevron on activation state */
   .interactive-service-card:hover .card-toggle-icon,
   .interactive-service-card.is-expanded .card-toggle-icon {
       transform: rotate(-180deg);
       color: var(--gold);
   }

   /* =======================================
   STRATEGIC TRACKING CARRIER GRAPHICS
   ======================================= */
   .carrier-card {
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid rgba(255, 255, 255, 0.03);
       border-radius: 4px;
       transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .carrier-card:hover {
       background: rgba(255, 255, 255, 0.03);
       border-color: rgba(255, 255, 255, 0.08);
       transform: translateY(-4px);
   }

   /* Master icon scaling control */
   .carrier-logo {
       font-size: 2.85rem !important;
       /* Forces uniform corporate visibility */
       line-height: 1;
       filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.3));
       transition: filter 0.3s ease;
   }

   .carrier-card:hover .carrier-logo {
       filter: drop-shadow(0 4px 14px rgba(255, 255, 255, 0.05));
   }

   .carrier-title {
       font-size: 0.85rem;
       font-family: var(--font-sans);
       letter-spacing: 0.5px;
       text-transform: uppercase;
       font-weight: 500;
       margin: 0;
   }

   /* Official Multi-Carrier Logo Palettes */
   .dhl-brand-color {
       color: #FFCC00 !important;
       /* Authentic DHL Signal Yellow */
   }

   .fedex-brand-color {
       color: #4D148C !important;
       /* Precision FedEx Purple (Blends beautifully on dark backgrounds) */
   }

   /* Custom adjustment for FedEx multi-tone icon text layering if using font strings */
   .carrier-card:hover .fedex-brand-color {
       color: #FF6600 !important;
       /* Smooth shift indicator to FedEx Orange on block hover interaction */
   }

   .ups-brand-color {
       color: #FFB500 !important;
       /* Authentic UPS Gold Metallic Tone */
   }

   .usps-brand-color {
       color: #333366 !important;
       /* Postal Premium Dark Blue Slate */
   }

   /* Maritime Oceanic Blueprint Tone */
   .maritime-brand-color {
       color: #008080 !important;
       /* Emerald Deep Maritime Teal */
   }

   /* Media optimization query for tighter viewports */
   @media (max-width: 575px) {
       .carrier-logo {
           font-size: 2.25rem !important;
       }

       .carrier-title {
           font-size: 0.75rem;
       }
   }

   /* ==========================================================================
   LAPTOP VIEWPORT OPTIMIZATION ENGINE
   Forces compact framing on medium height desktop resolutions (Laptops)
   ========================================================================== */
   @media (min-height: 600px) and (max-height: 950px) and (min-width: 992px) {

       /* 1. Scale down master headings to protect text wrapping */
       h2.section-title,
       .section-header h2 {
           font-size: 2.2rem !important;
       }

       .section-header {
           margin-bottom: 35px !important;
           /* Tighten heading gaps */
       }

       /* 2. Compact padded containers */
       .luxury-section,
       .luxury-section-video-bg,
       .video-bg-section {
           padding: 60px 0 !important;
           /* Reduces vertical bleed by half */
           min-height: auto;
       }

       /* 3. Force exact fit for 100vh Landing frames (Hero / Intro) */
       .hero {
           height: 100vh !important;
           display: flex;
           align-items: center;
       }

       .hero-content {
           margin-top: 40px !important;
       }

       .hero h1 {
           font-size: 3.2rem !important;
           margin-bottom: 16px !important;
       }

       /* 4. Optimize inner content components for space saving */
       .elite-card {
           padding: 25px 20px !important;
           /* Make cards sleeker */
       }

       .elite-icon {
           font-size: 24px !important;
           margin-bottom: 15px !important;
       }

       .elite-card h4 {
           font-size: 1.25rem !important;
       }

       .elite-card p {
           font-size: 0.95rem !important;
           line-height: 1.6 !important;
       }

       /* 5. Phone simulator framing optimization */
       .phone-mockup {
           max-width: 260px !important;
           height: 480px !important;
           border-width: 8px !important;
       }

       /* 6. Form elements spacing */
       .form-control {
           padding: 10px 12px !important;
       }

       /* 7. Testimonials block spacing optimization */
       .testimonial-card {
           padding: 30px 25px !important;
       }

       .testimonial-text {
           font-size: 0.9rem !important;
           margin-bottom: 15px !important;
       }

       /* 8. Accordion Header Optimization */
       .luxury-faq-trigger {
           padding: 16px 15px !important;
           font-size: 1.05rem !important;
       }
   }

   /* ==========================================================================
   GOLD PRESTIGE WHY CHOOSE US SYSTEM
   ========================================================================== */
   .prestige-feature-card {
       background: rgba(17, 24, 37, 0.4);
       border: 1px solid rgba(212, 175, 55, 0.12);
       border-radius: 4px;
       padding: 35px 30px;
       position: relative;
       overflow: hidden;
       transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   }

   .prestige-feature-card::before {
       content: '';
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: linear-gradient(180deg, rgba(212, 175, 55, 0.04) 0%, transparent 100%);
       opacity: 0;
       transition: opacity 0.5s ease;
   }

   .prestige-feature-card:hover {
       transform: translateY(-5px);
       border-color: rgba(212, 175, 55, 0.35);
       box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5), 0 0 25px rgba(212, 175, 55, 0.08);
   }

   .prestige-feature-card:hover::before {
       opacity: 1;
   }

   /* Feature Icon Configuration */
   .feature-icon-box {
       width: 50px;
       height: 50px;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 2px;
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid rgba(212, 175, 55, 0.15);
       margin-bottom: 24px;
       color: var(--gold, #d4af37);
       font-size: 1.4rem;
       position: relative;
       z-index: 2;
       transition: all 0.4s ease;
   }

   .prestige-feature-card:hover .feature-icon-box {
       color: #111;
       background: var(--gold, #d4af37);
       border-color: var(--gold, #d4af37);
       box-shadow: 0 0 15px rgba(212, 175, 55, 0.4);
   }

   /* Typography elements */
   .prestige-feature-card h4 {
       font-family: var(--font-serif);
       color: var(--text-white, #ffffff);
       font-size: 1.3rem;
       font-weight: 500;
       margin-bottom: 14px;
       position: relative;
       z-index: 2;
       letter-spacing: 0.3px;
   }

   .prestige-feature-card p {
       font-family: var(--font-sans);
       color: var(--text-white, #94a3b8);
       font-size: 0.95rem;
       font-weight: 300;
       line-height: 1.7;
       margin: 0;
       position: relative;
       z-index: 2;
   }

   /* --------------------------------------------------------------------------
   RESPONSIVE VIEWPORT ENGINE INTEGRATION
   -------------------------------------------------------------------------- */
   /* Laptop height optimizations */
   @media (min-height: 600px) and (max-height: 950px) and (min-width: 992px) {
       .prestige-feature-card {
           padding: 26px 22px !important;
       }

       .feature-icon-box {
           margin-bottom: 16px !important;
           width: 44px !important;
           height: 44px !important;
           font-size: 1.2rem !important;
       }

       .prestige-feature-card h4 {
           font-size: 1.15rem !important;
           margin-bottom: 10px !important;
       }

       .prestige-feature-card p {
           font-size: 0.9rem !important;
           line-height: 1.6 !important;
       }
   }

   /* Tablet & Mobile Layout Adaptations */
   @media (max-width: 991.98px) {
       .prestige-feature-card {
           height: auto !important;
       }
   }

   /* Small Smartphone Overrides */
   @media (max-width: 575.98px) {
       .prestige-feature-card {
           padding: 25px 20px !important;
       }
   }

   .luxury-phone-link {
       color: #D4AF37 !important;
       /* Premium Metallic Gold */
       transition: color 0.3s ease-in-out;
   }

   .luxury-phone-link:hover {
       color: #F3E5AB !important;
       /* Lighter soft gold hover state */
   }

   /* ==========================================
   LEGAL ASSURANCE CORE STYLING ARCHITECTURE
=========================================== --> */
   .bg-legal-luxury {
       background: #060912;
       position: relative;
   }

   .legal-card-frame {
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid rgba(255, 255, 255, 0.03);
       border-radius: 2px;
       transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
   }

   .legal-card-frame:hover {
       background: rgba(255, 255, 255, 0.02);
       border-color: rgba(212, 175, 55, 0.15);
   }

   .legal-index-num {
       font-size: 0.75rem;
       font-weight: 600;
       letter-spacing: 1px;
       opacity: 0.3;
   }

   /* Custom Legal Link Interactivity */
   .legal-trigger-link {
       cursor: pointer;
       transition: color 0.3s ease, padding-left 0.3s ease;
   }

   .legal-trigger-link:hover {
       color: var(--gold) !important;
       padding-left: 5px;
   }

   /* ==========================================
   PREMIUM FOOTER LAYER RULES
=========================================== */
   .footer-section {
       background: #060912;
       border-top: 1px solid rgba(255, 255, 255, 0.02);
   }

   .footer-legal-nav {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       gap: 24px;
   }

   .legal-trigger-link {
       color: rgba(255, 255, 255, 0.4);
       text-decoration: none;
       font-size: 0.78rem;
       letter-spacing: 0.5px;
       transition: color 0.4s cubic-bezier(0.25, 1, 0.5, 1);
   }

   .legal-trigger-link:hover {
       color: var(--gold) !important;
   }

   .footer-social-link {
       color: rgba(255, 255, 255, 0.35);
       width: 34px;
       height: 34px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       border: 1px solid rgba(255, 255, 255, 0.04);
       border-radius: 50%;
       transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
   }

   .footer-social-link:hover {
       color: #060912;
       background: #FFF;
       border-color: #FFF;
   }

   /* ==========================================
   UPDATED VERTICAL LEGAL NAV STYLING
=========================================== */
   .footer-legal-nav {
       list-style: none;
       padding: 0;
       margin: 0;
       display: flex;
       flex-direction: column;
       /* Forces links down in a column row */
       gap: 12px;
       /* Balanced spacing between vertical rows */
   }

   .legal-trigger-link {
       color: rgba(255, 255, 255, 0.4);
       text-decoration: none;
       font-size: 0.78rem;
       letter-spacing: 1px;
       transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
       display: inline-block;
   }

   .legal-trigger-link:hover {
       color: var(--gold) !important;
       transform: translateX(4px);
       /* Sleek micro-movement to the right on hover */
   }

   /* Business Hours Micro-Spacing */
   .hours-label {
       font-size: 0.72rem;
       letter-spacing: 1.5px;
       font-weight: 600;
   }

   .hours-text {
       line-height: 1.7;
       font-size: 0.85rem;
   }

   /* ==========================================
   HERO VIDEO BACKGROUND SYSTEM 
   MORE FIX
   ========================================== */


   .hero-video-container {
       position: relative;
       height: 100vh;
       width: 100%;
       overflow: hidden;
       display: flex;
       align-items: center;
   }

   .hero-backend-video {
       position: absolute;
       top: 50%;
       left: 50%;
       min-width: 100%;
       min-height: 100%;
       width: auto;
       height: auto;
       z-index: 1;
       transform: translate(-50%, -50%);
       object-fit: cover;
   }

   .hero-video-overlay {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: linear-gradient(180deg, rgba(6, 9, 18, 0.4) 0%, rgba(6, 9, 18, 0.95) 100%);
       z-index: 2;
   }

   .hero-content {
       position: relative;
       z-index: 3;
   }

   .pulse-dot {
       width: 8px;
       height: 8px;
       background-color: #00e676;
       /* Emerald Green */
       border-radius: 50%;
       box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.7);
       animation: pulse 1.6s infinite;
   }

   @keyframes pulse {
       0% {
           transform: scale(0.95);
           box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.7);
       }

       70% {
           transform: scale(1);
           box-shadow: 0 0 0 8px rgba(0, 230, 118, 0);
       }

       100% {
           transform: scale(0.95);
           box-shadow: 0 0 0 0 rgba(0, 230, 118, 0);
       }
   }

   /* Custom Transitions for Velocity Aesthetics */
   .vector-card .vector-img-wrapper img {
       transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
   }

   /* When hovering over a card, zoom the image slightly */
   .vector-card:hover .vector-img-wrapper img {
       transform: scale(1.06);
   }

   /* Clean micro-interaction for text description lines */
   .vector-card .vector-description {
       transition: opacity 0.4s ease, transform 0.4s ease;
   }

   /* Desktop-only optimization to give a clean reveal feel */
   @media (min-width: 992px) {
       .vector-card .vector-description {
           opacity: 0.35;
           transform: translateY(4px);
       }

       .vector-card:hover .vector-description {
           opacity: 0.85;
           transform: translateY(0);
       }
   }

   /* Parent Container Wrapper */
   .global-presence-section {
       position: relative;
       padding: 140px 0;
       border-top: 1px solid rgba(255, 255, 255, 0.03);
       overflow: hidden;
   }

   /* Moving Background Layer */
   .global-presence-bg {
       position: absolute;
       top: -15%;
       /* Increased from -10% to pull it higher up */
       left: 0;
       width: 100%;
       height: 130%;
       /* Increased from 120% to give it extra stretching room */
       background-image: url('../img/world1.png');
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
       z-index: 1;
       transform: translateY(0);
       will-change: transform;
       transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
   }

   /* Dark Minimalist Overlay Mask */
   .global-presence-overlay {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background: linear-gradient(180deg, rgba(6, 9, 18, 0.88) 0%, rgba(6, 9, 18, 0.93) 100%);
       z-index: 2;
   }

   /* Micro-Interaction for Cards */
   .carrier-card {
       background: rgba(255, 255, 255, 0.01);
       border: 1px solid rgba(255, 255, 255, 0.02);
       border-radius: 4px;
       transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), background 0.4s ease;
   }

   .carrier-card:hover {
       transform: translateY(-2px);
       background: rgba(212, 175, 55, 0.03);
       border-color: rgba(212, 175, 55, 0.15);
   }

   @media (max-width: 768px) {
       .global-presence-section {
           padding: 90px 0;
       }

       .global-presence-bg {
           height: 110%;
           top: -5%;
       }
   }

   /* Luxury White to Gold Text & Icon Gradient */
   .text-gradient-white-gold {
       background: linear-gradient(135deg, #FFFFFF 0%, #F3E5AB 45%, #D4AF37 100%);
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       background-clip: text;
       display: inline-flex;
       align-items: center;
   }

   /* Fixes Font Awesome rendering issues inside transparent clip masks */
   .text-gradient-white-gold i {
       background: inherit;
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       background-clip: text;
   }

   /* Premium Security Slider Framework Component Layouts */
   .security-slider {
       width: 100%;
       height: 52px;
       background: rgba(255, 255, 255, 0.02);
       border: 1px solid rgba(255, 255, 255, 0.08);
       border-radius: 4px;
       overflow: hidden;
       color: rgba(255, 255, 255, 0.35);
       font-size: 0.72rem;
       letter-spacing: 2px;
       font-family: var(--bs-font-sans-serif), sans-serif;
       transition: background 0.4s ease, border-color 0.4s ease;
   }

   .slider-thumb {
       width: 52px;
       height: 50px;
       /* Offset account for parent 1px border bounds */
       background: linear-gradient(135deg, #FFFFFF 0%, #D4AF37 100%);
       cursor: grab;
       z-index: 3;
       border-radius: 2px;
   }

   .slider-thumb:active {
       cursor: grabbing;
   }

   .security-slider.verified {
       background: rgba(6, 9, 18, 0.8) !important;
   }

   .unselectable {
       user-select: none;
       -webkit-user-select: none;
       -moz-user-select: none;
       -ms-user-select: none;
   }

   .slider-prompt {
       pointer-events: none;
       /* Prevents cursor highlighting text while sliding */
       z-index: 1;
   }



   /* Testimonial Container Layout */
   .testimonial-section {
       width: 100%;
       max-width: 900px;
       margin: 0 auto;
       padding: 40px 20px;
       display: flex;
       justify-content: center;
       /* Uses your global main theme background color */
       background-color: var(--bg-color);
   }

   /* --- THE GLOWING GRADIENT CARD --- */
   .glow-card {
       position: relative;
       width: 100%;
       border-radius: 32px;
       overflow: hidden;
       display: flex;
       justify-content: center;
       align-items: center;
       padding: 24px;
       /* Generous padding so the premium gold/purple glow frames the text nicely */
       background: #0a0e1a;
       /* Matches your core theme background color */
   }

   /* Animated Rotating Gradient Background */
   .glow-card::before {
       content: '';
       position: absolute;
       width: 150%;
       height: 300%;
       /* Updated with a touch of luxury gold (#d4af37) alongside deep purples 
       to align flawlessly with your brand's new color scheme.
    */
       background: conic-gradient(from 0deg,
               transparent 20%,
               #50236a 40%,
               #d4af37 52%,
               /* Premium Gold accent */
               #8a2be2 65%,
               transparent 80%);
       animation: rotateGlow 9s linear infinite;
       /* Slightly slowed down for a more regal, fluid feel */
       z-index: 1;
   }

   /* Card Inner Content Box (The Theme Overlay) */
   .glow-card-inner {
       position: relative;
       z-index: 2;
       /* Sits firmly above the rotating gradient layer */
       width: 100%;
       background-color: #0a0e1a;
       /* Your exact brand theme color overlay */
       border-radius: 20px;
       padding: 60px 50px;
       color: #ffffff;
       /* Crisp white text for ultimate readability against the dark navy */
       box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.5);
   }

   /* Typography Styling */
   .source-tag {
       font-size: 11px;
       font-weight: 800;
       text-transform: uppercase;
       letter-spacing: 2px;
       color: #d4af37;
       /* Source tag flipped to your brand gold for an elite touch */
       margin-bottom: 24px;
       opacity: 0.9;
   }

   .quote-text {
       font-size: 28px;
       line-height: 1.45;
       font-weight: 400;
       letter-spacing: -0.5px;
       color: #ffffff;
   }

   .quote-text span.quote-mark {
       font-family: Georgia, serif;
       font-size: 40px;
       line-height: 0;
       display: inline-block;
       vertical-align: -10px;
       margin-right: 4px;
       color: #d4af37;
       /* Quotation marks highlighted in brand gold */
   }

   /* --- MOTION ANIMATION --- */
   @keyframes rotateGlow {
       0% {
           transform: rotate(0deg);
       }

       100% {
           transform: rotate(360deg);
       }
   }

   /* Responsive scaling for mobile devices */
   @media (max-width: 768px) {
       .glow-card {
           padding: 12px;
           /* Tighter frame to preserve screen real estate on mobile */
       }

       .glow-card-inner {
           padding: 40px 25px;
       }

       .quote-text {
           font-size: 21px;
       }
   }