@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400&display=swap');
/* Core Variables & Resets */
:root {
  --primary-color: #b19f77; --primary-font: "Montserrat"; --secondary-font: "Poppins";
  --white-section: #fff; --gray-section: #f5f5f5; --black-section: #161616;
  --selection_background: #dcdcdc; --selection_color: #232323; --footer-top: #111;
  --default-border: hsla(0, 0%, 59.2%, 0.2); --primary-font-color: #666;
  --black-color: #232323; --white-color: #fff;
}
/* Hide scrollbar for Chrome, Safari and Opera */
::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
html, body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
*, :after, :before { box-sizing: border-box; }
html { font-family: sans-serif; line-height: 1.1; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: transparent; }
body { margin: 0; font-family: var(--primary-font); font-size: 15px; font-weight: 400; color: var(--white-color); background-color: #272c38; overflow-x: hidden !important; overflow-y: scroll; line-height: 1.45; }

/* Typography & Base Elements */
a { color: #b7a77e; text-decoration: none; background-color: transparent; }
a:hover { color: #fce7b0; text-decoration: none; }
h1, h2, h3, h4, h5, h6, p { margin-bottom: 0; }
h1, h2, h3, h4, h5, h6 { line-height: 1.15 !important; font-weight: 500; color: var(--white-color); font-family: var(--secondary-font) !important; }
h1 { font-size: 56px; letter-spacing: -2.2px; }
h2 { font-size: 42px; letter-spacing: -2.2px; }
h3 { font-size: 36px; letter-spacing: -2.2px; }
h4 { font-size: 32px; letter-spacing: -1.7px; }
h5 { font-size: 24px; letter-spacing: -.5px; }
h6 { font-size: 18px; letter-spacing: -.5px; }
h16 { font-size: 14px; line-height: 1.8 !important; font-weight: 400; color: var(--black-color); font-family: var(--primary-font) !important; }
p { font-family: var(--primary-font); letter-spacing: .3px; color: #cccccc; }
ul { margin-bottom: 0; padding-left: 0; }
ul li { list-style-type: none; }
button:focus, input:focus { outline: none; }
::-moz-selection { background-color: var(--selection_background); color: var(--selection_color); }
::selection { background-color: var(--selection_background); color: var(--selection_color); }

/* Grid System */
.container { width: 100%; margin: 0 auto; padding-right: 15px; padding-left: 15px; }
.container-fluid { width: 100%; padding-top: 10px; padding-bottom: 40px; margin: 0 auto; }
.row { display: flex; height: 100%; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.no-gutters { margin-right: 0; margin-left: 0; }

/* FIXED: Added .col-lg-4 back into the base layout rules */
.col, .col-12, .col-lg-4, .col-lg-6 { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; }

@media (min-width:576px) { .container { max-width: 540px; } }
@media (min-width:768px) { .container { max-width: 720px; } }
@media (min-width:992px) {
  .container { max-width: 960px; }
  /* FIXED: Tells the browser to split these sections into perfect 33.3% columns on Desktop */
  .col-lg-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; min-height: 500px; }
}
@media (min-width:1200px) { .container { max-width: 1140px; } }

/* Ensures the columns stack beautifully on top of each other on Tablets & Mobile */
@media (max-width:991px) {
  .col-lg-4 { flex: 0 0 100%; max-width: 100%; } 
}
@media (max-width:575px) {
  .col-lg-6, .col-12, .image, .bg_img, .parallax-window, .last-image { flex: 0 0 100%; width: 100%; min-height: 500px; }
}

/* Custom Components */
.section-title { color: #C4B17A; font-family: var(--secondary-font); position: relative; margin-bottom: 15px; }
.white-section-title { color: #fff; }
.title-divider { margin-bottom: 50px; }
.title-divider:after { content: " "; display: block; width: 55px; height: 1px; background-color: var(--black-color); margin: 25px auto 0; transition: all .3s ease-in-out; }
.about-text { color: #F5F5F5; font-size: 17px; }
.col-lg-6, .col-12, .content-about, .light-gray-section { padding: 40px; min-height: 600px; }


/* ========================================= */
/* Desktop Navigation (Type 2) - Glass Bar   */
/* ========================================= */
.navigation-type-2 { 
    position: fixed; top: 0; left: 0; width: 100%; 
    transition: all .4s linear; z-index: 901; pointer-events: auto;
    
    /* 3D Glass Effect for Main Desktop Bar */
    background-color: rgba(20, 20, 20, 0.35) !important; 
    backdrop-filter: blur(15px) !important; 
    -webkit-backdrop-filter: blur(15px) !important; 
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5) !important; 
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important; 
}
@media (max-width:991px) { .navigation-type-2 { opacity: 0; visibility: hidden; pointer-events: none; } }

.navigation-type-2 .inner-wrapper { z-index: 100; position: relative; padding: 0 75px; background-color: transparent !important; }
.navigation-type-2 .inner-wrapper .navigation-wrapper { display: flex; align-items: center; justify-content: space-between; position: relative; height: 80px; width: 100%; }

/* FIXED: Logo Centering (Restricts height so it centers perfectly in the 80px bar) */
.navigation-type-2 .inner-wrapper .navigation-wrapper .logotype-wrapper { display: flex; align-items: center; height: 100%; }
.navigation-type-2 .inner-wrapper .navigation-wrapper .logotype-wrapper a { display: flex; align-items: center; }
.navigation-type-2 .inner-wrapper .navigation-wrapper .logotype-wrapper a img { max-height: 40px; max-width: 220px; width: auto; height: auto; }

/* Desktop Menu Links */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side { display: flex; align-items: center; height: 100%; }
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper { display: flex; align-items: center; height: 100%; margin-right: 40px; }
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list { display: flex; align-items: center; height: 100%; margin: 0; padding: 0; }

/* FIXED 1: Forces MAIN items to be exactly 80px high and perfectly centered vertically */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list > .menu-item { 
    height: 80px; 
    margin-right: 15px; 
    display: flex; 
    align-items: center; 
    position: relative; 
}

/* RESET SUB-MENU ITEMS so they don't inherit the massive 80px height */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .sub-menu .menu-item { 
    height: auto; 
    margin-right: 0; 
    display: block; 
}

.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item a { display: flex; align-items: center; font-weight: 400; letter-spacing: .78px; color: var(--white-color); font-size: 14px; padding: 0 5px; transition: all .3s ease-in-out; text-decoration: none !important; }

.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item a:hover { color: #cab88b; }
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children-link:after { content: "\f105"; font-size: 10px; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-left: 6px; color: rgba(255,255,255,0.6); }


/* ========================================= */
/* Desktop Sub-Menus (Glassmorphism + Right) */
/* ========================================= */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children:not(.menu-item-has-megamenu) { position: relative; }

/* Level 1 Dropdown (Drops straight DOWN) */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list > .menu-item-has-children > .sub-menu { 
    position: absolute; 
    top: 60px; /* Snaps exactly to the bottom of the 80px bar */
    left: -20px; 
    
    /* FIXED 2: Shrinks/Grows to perfectly fit the text inside */
    min-width: 180px; 
    width: max-content; 
    
    padding: 10px 0; 
    z-index: 15; 
    border-radius: 8px; 
    
    /* 3D Glass Effect for Dropdowns */
    background-color: rgba(60, 60, 60, 0.65) !important; 
    backdrop-filter: blur(50px) !important;
    -webkit-backdrop-filter: blur(50px) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.5) !important; 
    
    pointer-events: none; 
    opacity: 0; 
    transform: translateY(10px); 
    transition: all 0.3s ease;
}

/* Level 2 Nested Dropdown (Pops out to the RIGHT) */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .sub-menu .menu-item-has-children > .sub-menu {
    position: absolute; 
    top: 0 !important;       /* Aligns top with parent item */
    left: 100% !important;   /* Pushes completely to the right side */
    margin-left: 4px;        /* Tiny gap so the glass borders don't overlap */
    
    /* FIXED 2: Shrinks/Grows to perfectly fit the text inside */
    min-width: 180px; 
    width: max-content; 
    
    padding: 10px 0; 
    z-index: 16; 
    border-radius: 8px; 
    
    /* 3D Glass Effect */
    background-color: rgba(20, 20, 20, 0.75) !important; 
    backdrop-filter: blur(50px) !important;
    -webkit-backdrop-filter: blur(50px) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.5) !important; 
    
    pointer-events: none; 
    opacity: 0; 
    transform: translateX(-10px); /* Slides in from the left instead of top */
    transition: all 0.3s ease;
}

/* Show Dropdowns on Hover or JS trigger */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children:hover > .sub-menu,
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children.active-sub-menu > .sub-menu {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important; /* <--- THIS IS THE MAGIC FIX */
}

/* Dropdown Item Links */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children:not(.menu-item-has-megamenu) .sub-menu .menu-item a { 
    padding: 12px 25px; 
    text-transform: none; 
    font-size: 13px; 
    font-weight: 500; 
    color: #DAC39C !important; 
    display: flex;
    justify-content: space-between; 
    align-items: center;
    text-decoration: none !important;
    transition: all 0.3s ease;
    background-color: transparent !important; 
    
    /* Prevents text from breaking into two lines */
    white-space: nowrap; 
}

/* Hover effect for dropdown items */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .menu-item-has-children:not(.menu-item-has-megamenu) .sub-menu .menu-item a:hover { 
    background-color: rgba(202, 184, 139, 0.25) !important; /* Premium Transparent Gold Hover */
    color: #fff !important; 
    padding-left: 32px; /* Smooth indent animation for a high-end feel */
}

/* Add a tiny right-facing arrow to indicate a nested submenu */
.navigation-type-2 .inner-wrapper .navigation-wrapper .right-side .menu-list-wrapper .menu-list .sub-menu .menu-item-has-children > a:after {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    margin-left: 15px;
}

/* Mobile Navigation */
.navigation-mobile { position: fixed; top: 0; left: 0; width: 100%; height: 80px; display: flex; z-index: 1001 !important; opacity: 0; pointer-events: none; }
@media (max-width:991px) { .navigation-mobile { opacity: 1; pointer-events: auto; } }

/* FIXED: Hide unused HTML search form to fix top bar sizing */
.navigation-mobile .search-form-wrapper { display: none !important; }

.navigation-mobile .inner-wrapper { 
  display: flex; width: 100%; position: relative; z-index: 10; align-items: center; justify-content: space-between;
    background-color: transparent !important;
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); 
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5); border-bottom: 1px solid rgba(255, 255, 255, 0.08); 
}
.navigation-mobile .inner-wrapper .logotype-wrapper { padding-left: 20px; display: flex; align-items: center;}
.navigation-mobile .inner-wrapper .logotype-wrapper a img { max-height: 100px; max-width: 220px; width: auto; height: auto; display: flex; align-items: center; }
.navigation-mobile .inner-wrapper .navigation-side { display: flex; justify-content: flex-end; align-items: center; padding: 0 15px; }
.navigation-mobile .inner-wrapper .navigation-side .toggle-button { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.navigation-mobile .inner-wrapper .navigation-side .toggle-button i { font-size: 18px; color: var(--white-color); }
.navigation-mobile .inner-wrapper .navigation-side .menu-toggle-wrapper .menu-toggle { width: 25px; cursor: pointer; display: flex; flex-direction: column; justify-content: center; }

/* Mobile Menu Fullscreen Overlay */
.navigation-mobile .menu-list-wrapper { 
  position: fixed; display: flex; align-items: center; justify-content: center;
  top: 0; left: 0; width: 100%; height: 100vh; pointer-events: none; 
  background-color: rgba(20, 20, 20, 0.35); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  transform: scale(.9); opacity: 0; z-index: 21; 
}
.navigation-mobile .menu-list-wrapper .menu-toggle-close { position: absolute; right: 30px; top: 30px; width: 45px; height: 45px; cursor: pointer; display: flex; justify-content: center; align-items: center;}
.navigation-mobile .menu-list-wrapper .menu-toggle-close i { color: #ffffff; font-size: 24px; }

/* FIXED: Restore structural code so JS animations can reveal the menu */
.navigation-mobile .menu-list-wrapper .menu-list { max-width: 350px; width: 100%; }

.navigation-mobile .menu-list-wrapper .menu-list .menu-item a { cursor: pointer; font-weight: 500; color: #ffffff; line-height: 1; font-size: 18px; padding: 15px; display: flex; transform: translateX(-50px); opacity: 0; position: relative; z-index: 10; pointer-events: none; align-items: center; text-decoration: none !important; }
.navigation-mobile .menu-list-wrapper .menu-list .menu-item a:hover { color: #D1C08E; text-decoration: none !important; }

.navigation-mobile .menu-list-wrapper .menu-list .menu-item-back { margin-bottom: 20px; }
.navigation-mobile .menu-list-wrapper .menu-list .menu-item-back a span { line-height: 1; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: #ffffff; font-size: 11px; }
/* Properly space out ALL menu icons */
.navigation-mobile .menu-list-wrapper .menu-list .menu-item a i { 
    margin-right: 12px; 
    font-size: 14px; 
    transition: transform 0.4s ease;
}

/* Bonus: Makes the "Go Back" arrow slide slightly to the left on hover/tap */
.navigation-mobile .menu-list-wrapper .menu-list .menu-item-back a:hover i {
    transform: translateX(-4px);
}


/* Mobile Menu Sub-menus positioning */
.navigation-mobile .menu-list-wrapper .menu-list .menu-item-has-children .menu-item-has-children-link:after { content: "\f105"; font-family: "Font Awesome 5 Free"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-weight: 900; font-size: 12px; }
.navigation-mobile .menu-list-wrapper .menu-list .menu-item-has-children .sub-menu { max-width: 350px; width: 100%; height: auto; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); pointer-events: none; z-index: 1; }
.navigation-mobile .menu-list-wrapper .menu-list .menu-item-has-children .sub-menu.active-list { pointer-events: auto; z-index: 10; }

/* Buttons */
/* Buttons */
.button-default-black, .button-default-gold, .button-default-black-2, .button-default-color, .button-default-white { font-weight: 500; display: flex; line-height: 1; font-family: var(--secondary-font); letter-spacing: 2px; text-transform: uppercase; padding: 13px 17px; border-radius: 4px; position: relative; transition: all .3s ease-in-out; overflow: hidden; z-index: 1; font-size: 11px; margin-left: 10px; text-decoration: none !important; }

.button-default-color { 
    color: #fff; 
    background-color: rgba(202, 184, 139, 1); /* Transparent Gold */
    border: 1px solid rgba(202, 184, 139, 1); /* Edge highlight */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* 3D Drop shadow */
}
.button-default-color:after { display: none; /* Removes old animation */ }
.button-default-color:hover { 
    color: #fff !important; 
    background-color: rgba(40, 130, 255, 0.65) !important; /* Icy Blue Glass Hover */
    border-color: rgba(40, 130, 255, 0.5) !important; 
    text-decoration: none !important; 
    box-shadow: 0 6px 20px rgba(40, 130, 255, 0.3); /* Blue 3D Glow */
}
.button-default-color:hover:after { top: 0; left: 0; border-radius: 0; }
.button-default-black-2 { background-color: var(--black-color); color: #fff; border-radius: 25px; align-items: center; }
.button-default-black-2:hover { color: #fff; background-color: #cab88b; text-decoration: none !important; }


/* Digital Services / Content Layouts */
.d-flex { display: flex !important; }
.digital-services .content-about .content-wrapper .btn-wrapper { margin-top: 30px; display: flex;}
@media (max-width:767px) { .digital-services .content-about .content-wrapper .btn-wrapper { margin-top: 20px; } }

/* Footer */
footer .footer-inner { padding: 0; }
footer .footer-inner .footer-top { height: 120px; width: 100%; background-color: var(--footer-top); }
@media (max-width:991px) { footer .footer-inner .footer-top { padding: 25px 0; height: auto; } }
footer .footer-inner .footer-top .footer-top-inner { height: 100%; position: relative; align-items: center; justify-content: space-between; display: flex; }
@media (max-width:991px) { footer .footer-inner .footer-top .footer-top-inner { flex-direction: column; } }
footer .footer-inner .footer-top .footer-top-inner .lucopyright i { margin-right: 10px; font-size: 14px; color: #ac9c75; }
footer .footer-inner .footer-top .footer-top-inner .social-networks { display: flex; align-items: center; }
footer .footer-inner .footer-top .footer-top-inner .social-networks .social-list { display: flex; }
footer .footer-inner .footer-top .footer-top-inner .social-networks .social-list li a { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; }
footer .footer-inner .footer-top .footer-top-inner .social-networks .social-list li:not(:last-child) { margin-right: 10px; }
footer .footer-inner .footer-body { background-color: var(--black-section); padding: 50px 0; }
.footer-sidebar { margin-bottom: -30px; margin-right: -30px; }

@media (max-width:991px) { 
  .footer-sidebar { margin-bottom: 20px; margin-left: 0; margin-right: 0; } 
  footer .footer-inner .footer-body { padding: 40px 40px; }
  footer .footer-inner .footer-top { padding: 25px 40px; height: auto; }
}

.footer-sidebar .sidebar-widget { margin-bottom: 30px; padding-right: 30px; }
.footer-sidebar .sidebar-widget .sidebar-title { font-size: 12px; text-transform: uppercase; color: #fff; border-bottom: 1px solid var(--default-border); padding-bottom: 15px; margin-bottom: 20px; letter-spacing: .5px; }
.footer-sidebar .text-widget p { color: var(--white-color); margin-bottom: 30px; opacity: .7; }
.footer-sidebar .text-widget .newsletter-form-widget, .footer-sidebar .text-widget .newsletter-form-widget input { display: flex; width: 100%; }
.footer-sidebar .text-widget .newsletter-form-widget input { height: 50px; padding: 0 25px; background-color: var(--white-section); color: var(--black-color); border: none; line-height: 1; border-top-left-radius: 5px; border-bottom-left-radius: 5px; }

.footer-sidebar .text-widget .newsletter-form-widget button { 
    border: none; 
    height: 50px; 
    background-color: #cab88b; /* Matched exactly to your gold buttons */
    padding: 0 30px; 
    border-top-right-radius: 5px; 
    border-bottom-right-radius: 5px; 
    transition: all .3s ease-in-out; /* Adds the smooth fade */
    cursor: pointer;
}
.footer-sidebar .text-widget .newsletter-form-widget button i { 
    color: #fff; 
    font-size: 14px; 
    transition: all .3s ease-in-out; 
}

/* The new hover effect for the mailbox button */
.footer-sidebar .text-widget .newsletter-form-widget button:hover {
    background-color: rgba(40, 130, 255, 1) !important;
}
.footer-sidebar .text-widget .newsletter-form-widget button:hover i {
    color: #333333 !important;
}
.footer-sidebar .latest-posts-widget .post-list .post { display: flex; align-items: center; margin-bottom: 25px; }
.footer-sidebar .latest-posts-widget .post-list .post .img-wrapper { flex: 0 0 100px; width: 100px; height: 65px; margin-right: 15px; border-radius: 6px; overflow: hidden; }
.footer-sidebar .latest-posts-widget .post-list .post .img-wrapper img { width: 100%; height: 100%; object-fit: cover; }
.footer-sidebar .latest-posts-widget .post-list .post .post-body { display: flex; flex-direction: column; justify-content: center; flex: 1; }
.footer-sidebar .latest-posts-widget .post-list .post .post-body .post-title { margin-bottom: 5px; font-size: 13px; line-height: 1.4; }
.footer-sidebar .latest-posts-widget .post-list .post .post-body .post-title a { color: #b0a078; font-weight: 500; transition: all .2s ease-in-out; text-decoration: none !important; }
.footer-sidebar .latest-posts-widget .post-list .post .post-body .post-title a:hover { color: #fff0c4; text-decoration: none !important; }
.footer-sidebar .latest-posts-widget .post-list .post .post-body .description-box .date { opacity: .7; line-height: 1; font-size: 12px; color: var(--white-color); }

.footer-sidebar .contact-info-widget .contact-info li { display: flex; align-items: center; font-size: 14px; margin-bottom: 15px;}
.footer-sidebar .contact-info-widget .contact-info li i { margin-right: 15px; font-size: 14px; color: #c4b187; }
.footer-sidebar .contact-info-widget .contact-info li a { color: var(--white-color); transition: all .2s ease-in-out; }
.footer-sidebar .contact-info-widget .contact-info li a:hover { color: #ffe7b3; }
/* Remove underline from bottom footer links (Privacy, Terms, etc.) */
footer .footer-top-inner a,
footer .footer-top-inner a:hover {
    text-decoration: none !important;
}
/* Remove default browser focus rings and tap highlights on mobile menu */
.navigation-mobile .menu-list-wrapper .menu-list .menu-item a:focus,
.navigation-mobile .menu-list-wrapper .menu-list .menu-item a:active,
.navigation-mobile .menu-list-wrapper .menu-toggle-close:focus,
.navigation-mobile .menu-list-wrapper .menu-toggle-close:active {
    outline: none !important;
    -webkit-tap-highlight-color: transparent !important;
    box-shadow: none !important;
}

/* Also ensure the entire menu list doesn't get a focus box */
.navigation-mobile .menu-list-wrapper * {
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
}




/* ========================================= */
/* FIX 1: UNIVERSE CANVAS FULL SCREEN FIX    */
/* Forces particles to stretch to the top!   */
/* ========================================= */
.portal_intro {
    top: 0 !important;
}
.portal_intro .container-fluid, 
.portal_intro .row {
    margin: 0 !important;
    padding: 0 !important;
    height: 100vh !important;
}
.portal_intro .content.vfx--canvas {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important; /* Overrides the old calc(100vh - 4rem) */
    margin: 0 !important;
    padding: 0 !important;
}
.portal_intro .content.vfx--canvas canvas {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
}

/* ========================================= */
/* FIX 2: TOP-TIER 3-COLUMN DESKTOP FOOTER   */
/* Forces Email, News, and Contact in a row  */
/* ========================================= */
@media (min-width: 992px) {
    .footer-sidebar .row {
        display: flex !important;
        flex-wrap: nowrap !important; /* Forces the 3 sections side-by-side */
        justify-content: space-between !important;
        align-items: flex-start !important;
        margin: 0 -15px !important;
    }
    .footer-sidebar .col-lg-4 {
        flex: 0 0 31% !important; /* 31% gives them beautiful breathing room */
        max-width: 31% !important;
        padding: 0 15px !important;
    }
}
@media (max-width: 991px) {
    /* Ensures they stack neatly on mobile/tablets */
    .footer-sidebar .col-lg-4 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 40px !important; 
    }
}

/* ========================================= */
/* RESTORED STYLES FROM MAIN.CSS             */
/* Fixes Background, Fonts, and Colors       */
/* ========================================= */

:root {
  --gold: #B8A77E;
}

body {
  background-color: #000 !important;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.5 !important;
  font-weight: 400 !important;
  color: var(--gold) !important;
  font-family: var(--primary-font) !important;
}

a {
  color: #C9B88B !important;
}

a:hover {
  color: #fce7b0 !important;
}

h55, h66 {
  line-height: 2 !important;
  font-weight: 600;
  color: var(--black-color);
  font-size: 1.5em;
  font-family: var(--primary-font) !important;
}

hmeetlu {
  line-height: 1.0 !important;
  font-weight: 100;
  color: var(--gold);
  font-family: var(--primary-font) !important;
}

.content__title {
    color: #E8CE81 !important;
    text-shadow: 0.1em 0.13em 0.5em #232323 !important;
    text-align: center !important;
}

/* 1. Force the page background to solid black ONLY when the tile grid is present */
body:has(.lu_meet_tiles) {
    background-color: #000000 !important;
}

/* 2. Force the Navigation Bar to be solid black (no glass effect) ONLY on this page */
body:has(.lu_meet_tiles) .navigation-type-2 {
    background-color: #000000 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* 3. Fix the "LUCHEN" Main Title (Removes Serif font, adds Gold Color) */

.lu_meet_tiles__title {
    /* Forces the narrow, elegant Roboto Condensed font */
    font-family: "Roboto Condensed", sans-serif !important; 
    font-weight: 400 !important; /* Thinner, more elegant weight */
    letter-spacing: 0.045em !important; 
    color: #C9B88B !important; 
    background-color: transparent !important; /* Added to fix that weird white box in your screenshot */
}

/* 4. Strip out the forced white colors/blue backgrounds hidden inside lu_meet.css spans */
.lu_meet_tiles__title span {
    font-family: inherit !important;
    color: inherit !important;
    background-color: transparent !important;
    padding: 0 !important;
}

/* 5. Restore the blue pad and white text for the "Elegant | Legendary" alternate title */
.lu_meet_tiles__title--alt span {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 400 !important; /* Keeps it elegant and not too bulky */
    background-color: #001a80 !important; 
    color: white !important;
    padding: 0.05em 0.3em !important; 
    opacity: 0.8 !important;
}

/* ========================================================= */
/* INSTA-POP PAGE SPECIFIC FIXES                             */
/* These rules are scoped to ONLY affect the instapop page   */
/* ========================================================= */

/* 1. Restore the Hero Header / Breadcrumbs Height */
body:has(.player) .page-header {
    position: relative;
    height: 800px; 
}

/* 4. Center the Insta-Pop Title Vertically */
body:has(.player) .page-header .breadcrumbs-wrapper .breadcrumbs {
    justify-content: center !important;
}@media (max-width: 575px) {
    body:has(.player) .page-header {
        height: 400px;
    }
}
body:has(.player) .page-header .breadcrumbs-wrapper {
    height: 100%;
}
body:has(.player) .page-header .breadcrumbs-wrapper .breadcrumbs {
    position: relative;
    z-index: 900;
    height: 100%;
    padding-top: 80px; 
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 2. Restore the missing padding and widths for the Digital Services content section */
body:has(.player) .digital-services .content .content-wrapper {
    padding: 130px 0 80px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 1440px) {
    body:has(.player) .digital-services .content .content-wrapper {
        width: 550px;
        padding: 100px 0 50px;
    }
}
@media (max-width: 1199px) {
    body:has(.player) .digital-services .content .content-wrapper {
        width: 100%;
        padding: 60px 40px 30px;
    }
}
@media (max-width: 991px) {
    body:has(.player) .digital-services .content .content-wrapper {
        max-width: 720px;
        padding: 50px 15px 20px;
    }
}
@media (max-width: 767px) {
    body:has(.player) .digital-services .content .content-wrapper {
        max-width: 510px;
        margin-left: 30px;
        margin-right: auto;
    }
}

/* 3. Restore the image block properties for the side-by-side layout */
body:has(.player) .digital-services .image {
    background-size: cover;
    background-position: 100%;
    display: flex;
}
@media (max-width: 991px) {
    body:has(.player) .digital-services .image {
        height: 400px;
    }
}
@media (max-width: 767px) {
    body:has(.player) .digital-services .image {
        height: 150px; 
    }
}

/* ========================================================= */
/* FULL-WIDTH BANNER WITH FLOATING MOVEMENT (NO FIXED)        */
/* Append this to the very bottom of main-look.css           */
/* ========================================================= */

.full-width-separator {
    /* 1. Force the area to span the entire screen width */
    width: 100vw !important; 
    max-width: 100vw !important;
    
    /* 2. Break out of any 50% grid columns */
    position: relative !important;
    left: 50% !important; 
    margin-left: -50vw !important; 
    
    /* 3. Set the visible height of the banner */
    height: 500px; 
    overflow: hidden; /* Hide the parts of the image that slide out */
    display: block;
    clear: both;
}
/* DESKTOP HEIGHT (992px and wider) */
@media (min-width: 992px) {
    .full-width-separator {
        height: 700px !important;
    }
}/* THE MAGIC: The image is taller than the box and shifts via JS */
.full-width-separator img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 150% !important; /* Extra height allows room to 'float' */
    object-fit: cover;
    will-change: transform;
    transition: transform 0.1s linear;
    
    /* Optional: Add a smooth shadow to separate the black sections */
    box-shadow: inset 0 20px 20px -20px rgba(0,0,0,0.8), 
                inset 0 -20px 20px -20px rgba(0,0,0,0.8);
}

