            /* @font-face {
    font-family: "Founders Grotesk";
    src: url("../fonts/Founders_Grotesk/FoundersGrotesk-Regular.otf");
    src: url("../fonts/Founders_Grotesk/FoundersGrotesk-Regular.ttf") format("ttf"), url("../fonts/Founders_Grotesk/FoundersGrotesk-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
} */
            
            @import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&display=swap');
             :root {
                --primary: #384D6D;
                --secondary: #00A2E2;
                --tertiary: #FFFDF0;
                --light-gray: #F7F7F5;
                --gray: #eeeeee;
                --dark: #6d6a67;
                --dark-gray: #777777;
                --white: #ffffff;
                --text-color: #384D6D;
                --text-dark: #201D1D;
                --rounded: 0.5rem;
                --placeholder: #6c757d;
            }
            
            html {
                margin-top: 0 !important;
                width: 100%;
                overflow-x: hidden;
            }
            
            input::-webkit-input-placeholder,
            textarea::-webkit-input-placeholder {
                color: var(--placeholder);
                opacity: 1;
            }
            
            input::-moz-placeholder,
            textarea::-moz-placeholder {
                color: var(--placeholder);
                opacity: 1;
            }
            
            input::-ms-input-placeholder,
            textarea::-ms-input-placeholder {
                color: var(--placeholder);
                opacity: 1;
            }
            
            .form-control::placeholder {
                color: var(--placeholder);
            }
            
            body,
            html {
                -webkit-text-size-adjust: none;
                margin: 0;
                padding: 0;
                width: 100%;
                max-width: 100%;
                min-height: 100%;
                -webkit-overflow-scrolling: touch;
                transition: background-color 0.15s ease-in-out;
            }
            
            .rounded {
                border-radius: var(--rounded) !important;
                overflow: hidden;
            }
            
            .rounded-2x {
                border-radius: 1.3rem !important;
                overflow: hidden;
            }
            
            img {
                border: none;
                margin: 0;
                -webkit-user-select: none;
                -moz-user-select: -moz-none;
                -ms-user-select: none;
                user-select: none;
                -webkit-tap-highlight-color: transparent;
            }
            
            a,
            a:focus,
            a:link,
            a:visited,
            input:focus,
            textarea:focus {
                outline: 0;
                text-decoration: none;
            }
            
            select:focus {
                outline: 0;
            }
            
            textarea {
                resize: none;
            }
            
            form:not(.content-area*),
            h1:not(.content-area*),
            h2:not(.content-area*),
            h3:not(.content-area*),
            h4:not(.content-area*),
            h5:not(.content-area*),
            h6:not(.content-area*),
            p:not(.content-area*),
            ul:not(.content-area*) {
                margin: 0;
                padding: 0;
            }
            
            input::-moz-focus-inner {
                border: 0;
                padding: 0;
            }
            
            iframe {
                display: block;
            }
            
            p+p {
                margin-top: 1.5em;
            }
            
            article,
            aside,
            details,
            figcaption,
            figure,
            footer,
            header,
            hgroup,
            menu,
            nav,
            section,
            time {
                display: block;
                margin: 0;
                padding: 0;
            }
            
             ::selection {
                background: var(--primary);
                color: var(--tertiary);
            }
            
             ::-moz-selection {
                background: #1c1c1c;
                color: #fff;
            }
            
            ul {
                list-style: none;
            }
            
            .text-link-color {
                color: #0b59d1;
            }
            
            .privacy-policy ul {
                list-style: disc;
            }
            
            li {
                padding: 0;
                margin: 0;
            }
            
            label {
                font-weight: 400 !important;
            }
            
            .fa-ul>li:not(:last-child) {
                margin-bottom: 15px;
            }
            
            .has-lead .content-area h5,
            .lead {
                font-size: 1.3em;
                line-height: 1.5em;
                font-weight: 400;
            }
            
            .has-lead .content-area h5 {
                margin-bottom: 1.5em;
            }
            
            .h1,
            .h2,
            .h3,
            .h4,
            .h5,
            .h6,
            h1,
            h2,
            h3,
            h4,
            h5,
            h6 {
                font-weight: 600;
                letter-spacing: 0;
                color: var(--primary);
            }
            
            .h1,
            h1 {
                font-size: 2.25em;
            }
            
            .h2,
            h2 {
                font-size: 2em;
            }
            
            .h3,
            h3 {
                font-size: 1.75em;
            }
            
            .h4,
            h4 {
                font-size: 1.5em;
            }
            
            .h5,
            h5 {
                font-size: 1.25em;
            }
            
            .h6,
            h6 {
                font-size: 1.25em;
            }
            
            .plus-minus .count {
                margin-top: 8px !important;
            }
            
            .t-datepicker {
                font-size: 1rem;
            }
            
            .t-check-in,
            .t-check-out {
                border-radius: 0;
            }
            
            .t-datepicker .t-check-in .fa,
            .t-check-out .fa {
                margin-right: 5px;
            }
            
            .room-search-container i {
                color: #8f8f8f;
            }
            
            .room-search-container .btn.btn-primary {
                display: flex;
                align-items: center;
                border-radius: 0;
            }
            
            .room-search-container .btn.btn-primary img {
                max-width: 19px;
                max-height: 15px;
                margin-top: -4px;
            }
            
            .room-search-container .btn.btn-primary span {
                margin-top: 5px;
            }
            
            @media only screen and (max-width: 991px) {
                .h1,
                h1 {
                    font-size: 2em;
                }
                .h2,
                h2 {
                    font-size: 1.77em;
                }
                .h3,
                h3 {
                    font-size: 1.54em;
                }
                .h4,
                h4 {
                    font-size: 1.31em;
                }
                .h5,
                h5 {
                    font-size: 1.1em;
                }
                .h6,
                h6 {
                    font-size: 1em;
                }
                .vocality-pic {
                    margin-top: 20px;
                }
                .search-panel.home form {
                    min-width: unset !important;
                }
            }
            
            @media only screen and (max-width: 767px) {
                .h1,
                h1 {
                    font-size: 1.75em;
                }
                .h2,
                h2 {
                    font-size: 1.57em;
                }
                .h3,
                h3 {
                    font-size: 1.39em;
                }
                .h4,
                h4 {
                    font-size: 1.21em;
                }
                .h5,
                h5 {
                    font-size: 1.075em;
                }
                .h6,
                h6 {
                    font-size: 1em;
                }
            }
            
            @media only screen and (min-width: 1601px) {
                section>.minHeight {
                    min-height: 250px;
                }
            }
            
            a {
                color: var(--primary);
            }
            
            .underlined {
                padding-bottom: 0.75em;
                margin-bottom: 1em;
                text-align: center;
                text-transform: uppercase;
                position: relative;
            }
            
            .underlined:after {
                content: "";
                width: 150px;
                height: 5px;
                position: absolute;
                left: 50%;
                bottom: 0;
                transform: translateX(-50%);
                -ms-transform: translateX(-50%);
                -webkit-transform: translateX(-50%);
                background-color: var(--danger);
            }
            
            h1 small,
            h2 small,
            h3 small,
            h4 small,
            h5 small,
            h6 small {
                font-size: 0.8em;
                display: block;
                line-height: 1.5em;
                font-family: "Butler";
            }
            
            h1 span,
            h2 span,
            h3 span,
            h4 span {
                color: var(--primary);
            }
            
            p:last-child {
                margin-bottom: 0;
            }
            
            .stretched {
                letter-spacing: 1px;
            }
            
            .text-default,
            .text-default:active,
            .text-default:focus {
                color: var(--dark) !important;
            }
            
            .text-primary,
            .text-primary:active,
            .text-primary:focus {
                color: var(--primary) !important;
            }
            
            .text-secondary,
            .text-secondary:active,
            .text-secondary:focus {
                color: var(--secondary) !important;
            }
            
            .text-tertiary,
            .text-tertiary:active,
            .text-tertiary:focus {
                color: var(--tertiary) !important;
            }
            
            .text-quaternary,
            .text-quaternary:active,
            .text-quaternary:focus {
                color: var(--quaternary) !important;
            }
            
            .text-white,
            .text-white:active,
            .text-white:focus {
                color: var(--white);
            }
            /* .text-danger,
.text-danger:active,
.text-danger:focus {
color: var(--danger) !important
}
*/
            
            .text-grey {
                color: #737373 !important;
            }
            
            .popover,
            .tooltip {
                font-family: "Abadi MT Std Light";
            }
            
            .tooltip-inner {
                font-size: 0.875em;
            }
            
            .bgGradient::after {
                content: "";
                position: absolute;
                z-index: 1;
                width: 100%;
                height: 100%;
                bottom: 0;
                left: 0;
                background: rgba(255, 255, 255, 0);
                background: -moz-linear-gradient( top, rgba(255, 255, 255, 0) 0, rgba(153, 153, 153, 0) 60%, rgba(0, 0, 0, 0.9) 100%);
                background: -webkit-gradient( left top, left bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(60%, rgba(153, 153, 153, 0)), color-stop(100%, rgba(0, 0, 0, 0.9)));
                background: -webkit-linear-gradient( top, rgba(255, 255, 255, 0) 0, rgba(153, 153, 153, 0) 60%, rgba(0, 0, 0, 0.9) 100%);
                background: -o-linear-gradient( top, rgba(255, 255, 255, 0) 0, rgba(153, 153, 153, 0) 60%, rgba(0, 0, 0, 0.9) 100%);
                background: -ms-linear-gradient( top, rgba(255, 255, 255, 0) 0, rgba(153, 153, 153, 0) 60%, rgba(0, 0, 0, 0.9) 100%);
                background: linear-gradient( to bottom, rgba(255, 255, 255, 0) 0, rgba(153, 153, 153, 0) 60%, rgba(0, 0, 0, 0.9) 100%);
            }
            
            .bgOverlay,
            .hoverIcon {
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
                background: rgba(0, 0, 0, 0.5);
                z-index: 0;
            }
            
            .bg-primary {
                background: var(--primary) !important;
            }
            
            .bg-secondary {
                background: var(--secondary) !important;
            }
            
            .bg-tertiary {
                background: var(--tertiary) !important;
            }
            
            .bg-light {
                background-color: var(--light-gray) !important;
            }
            
            .has-link-light a,
            .has-link-primary a,
            .has-link-primary-and-light a {
                display: inline-block;
                font-weight: 400;
                line-height: 1.5;
                color: #212529;
                text-align: center;
                text-decoration: none;
                vertical-align: middle;
                cursor: pointer;
                -webkit-user-select: none;
                -moz-user-select: none;
                user-select: none;
                background-color: transparent;
                border: 1px solid transparent;
                padding: 0.375rem 0.75rem;
                font-size: 1rem;
                border-radius: 0.25rem;
                transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
                font-weight: 700 !important;
                position: relative;
                background: var(--tertiary) !important;
                border-color: var(--tertiary) !important;
                color: #fff;
                margin-right: 0.75rem;
                margin-bottom: 1rem;
                padding-right: 1.5rem !important;
                padding-left: 1.5rem !important;
            }
            
            .has-link-light a:hover,
            .has-link-primary a:hover,
            .has-link-primary-and-light a:hover {
                background: var(--quaternary) !important;
                border-color: var(--quaternary) !important;
                color: #fff;
            }
            
            .has-link-light a:focus,
            .has-link-primary a:focus,
            .has-link-primary-and-light a:focus {
                outline: 0;
                box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
            }
            
            .has-link-light a,
            .has-link-primary-and-light a:nth-child(even),
             :not(.has-link-primary)>.bg-overlay-dark .btn-primary,
             :not(.has-link-primary)>.bg-overlay-dark .open>.dropdown-toggle.btn-primary,
             :not(.has-link-primary)>.bg-tertiary .btn-primary,
             :not(.has-link-primary)>.bg-tertiary .open>.dropdown-toggle.btn-primary {
                background: var(--light-gray) !important;
                border-color: var(--light-gray) !important;
                color: var(--primary) !important;
                font-weight: 700 !important;
                position: relative;
            }
            
            .has-link-light a:hover,
            .has-link-primary-and-light a:nth-child(even):hover,
             :not(.has-link-primary)>.bg-overlay-dark .btn-primary:hover,
             :not(.has-link-primary)>.bg-overlay-dark .open>.dropdown-toggle.btn-primary:hover,
             :not(.has-link-primary)>.bg-tertiary .btn-primary:hover,
             :not(.has-link-primary)>.bg-tertiary .open>.dropdown-toggle.btn-primary:hover {
                background: 0 0 !important;
                border-color: var(--light-gray) !important;
                color: var(--light-gray) !important;
            }
            
            .has-link-light a:focus,
            .has-link-primary-and-light a:nth-child(even):focus,
             :not(.has-link-primary)>.bg-overlay-dark .btn-primary:focus,
             :not(.has-link-primary)>.bg-overlay-dark .open>.dropdown-toggle.btn-primary:focus,
             :not(.has-link-primary)>.bg-tertiary .btn-primary:focus,
             :not(.has-link-primary)>.bg-tertiary .open>.dropdown-toggle.btn-primary:focus {
                box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
            }
            
            .bg-quaternary {
                background: var(--quaternary) !important;
            }
            
            .bg-white {
                background: var(--white) !important;
            }
            
            .bg-dark {
                background: var(--dark) !important;
            }
            
            .bg-gray {
                background: var(--gray) !important;
            }
            
            .bg-lgray {
                background: var(--light-gray) !important;
            }
            
            .bg-darkGray {
                background: #333 !important;
            }
            
            .bg-dark-gray-news * {
                color: #fff;
            }
            
            .bg-opacity {
                background: rgba(245, 245, 245, 0.2);
            }
            
            .bg-dgray {
                background: #dedede !important;
            }
            
            .grow {
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }
            
            .grow:hover {
                -moz-transform: scale(1.04);
                -ms-transform: scale(1.04);
                -webkit-transform: scale(1.04);
                transform: scale(1.04);
            }
            
            .btn-primary {
                background: var(--primary) !important;
                border-color: var(--primary) !important;
                text-transform: uppercase;
                font-size: 0.9rem;
                color: var(--tertiary);
                line-height: .9rem;
                padding: 0.85rem 1.3rem;
                border-radius: 0;
                box-shadow: none !important;
                position: relative;
            }
            
            .btn-primary:hover {
                background: var(--secondary) !important;
                border-color: var(--secondary) !important;
            }
            
            .btn-secondary {
                background: var(--secondary) !important;
                border-color: var(--secondary) !important;
            }
            
            .btn-secondary:hover {
                background: #ffdb60 !important;
                border-color: #ffdb60 !important;
                color: var(--dark);
            }
            
            .btn-tertiary {
                background: var(--tertiary) !important;
                border-color: var(--tertiary) !important;
                color: #fff;
            }
            
            .btn-tertiary:hover {
                background: #1e172c !important;
                border-color: #1e172c !important;
                color: #fff;
            }
            
            .btn-quaternary {
                background: var(--quaternary) !important;
                border-color: var(--quaternary) !important;
                color: #fff;
            }
            
            .btn-light {
                background: var(--light-gray);
                border-color: var(--light-gray);
                text-transform: uppercase;
                font-weight: 600;
                position: relative;
                font-size: .9rem;
            }
            
            .btn-arrow {
                padding: 12px 40px 11px 20px !important;
            }
            
            .btn-light::before,
            .btn-arrow::before {
                content: '\f062';
                font-family: "Font Awesome 6 Free";
                font-weight: 800;
                position: absolute;
                color: var(--secondary);
                transform: rotate(45deg);
                right: 17px;
                top: 11px;
            }
            
            .btn-light:hover {
                background: 0 0 !important;
                border-color: var(--light-gray) !important;
                color: var(--light-gray) !important;
            }
            
            .btn-transparent {
                background: transparent !important;
                border-color: #fff !important;
                text-transform: uppercase;
                font-size: 0.9rem;
                color: var(--primary);
                letter-spacing: 2px;
                line-height: 1rem;
                padding: 0.75rem 1.2rem;
            }
            
            .btn-transparent:hover {
                background: var(--primary) !important;
                color: #fff !important;
            }
            
            .btn-xs {
                font-size: .7rem;
            }
            
            .btn-shape {
                border: 0;
                border-top-right-radius: 1rem;
                border-bottom-left-radius: 1rem;
                padding: 0.75rem 2.2rem;
            }
            
            .btn {
                line-height: 1rem;
                padding: 14px 20px 10px;
            }
            
            .btn-lg {
                padding: 14px 20px !important;
            }
            
            body {
                font-family: "Archivo", sans-serif;
                overflow-x: hidden;
                padding-top: 0;
                color: var(--text-color);
                background-color: #ffffff;
                font-size: 18px;
                /* letter-spacing: 0.8px; */
                font-weight: 400;
            }
            
            main {
                overflow-x: hidden;
            }
            
            .container-max {
                width: 90%;
                max-width: 1600px;
                margin: auto;
                position: relative;
                z-index: 999;
            }
            
            .section {
                padding: 3rem 0;
            }
            
            .small {
                font-size: .75rem;
            }
            /* =====================
   Header
===================== */
            
            .site-header {
                background: #fff;
                /* border-bottom: 1px solid #eee; */
                position: relative;
                width: 100%;
                z-index: 1000;
                transition: box-shadow 0.25s ease, background-color 0.25s ease;
                padding: 1rem 0;
            }
            
            .navbar {
                padding: 18px 0 0;
                transition: padding 0.25s ease;
            }
            
            .navbar-brand {
                padding-top: .3125rem;
                padding-bottom: .3125rem;
                margin-right: 1rem;
                font-size: 1.25rem;
                text-decoration: none;
                white-space: nowrap;
                transform: scale(1.8);
                position: absolute;
                margin-top: 3rem;
                z-index: 9;
                left: 34px;
                transition: transform 0.25s ease, margin-top 0.25s ease, left 0.25s ease;
            }
            
            .navbar-brand img {
                height: 64px;
                transition: height 0.25s ease;
            }
            
            .site-header.is-fixed {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
                background: #fff;
                padding: .25rem 0;
            }
            
            .site-header.is-fixed .navbar {
                padding-top: 8px;
                padding-bottom: 8px;
            }
            
            .site-header.is-fixed .navbar-brand {
                transform: scale(1.2);
                margin-top: 0;
                left: 9px;
            }
            
            .site-header.is-fixed .navbar-brand img {
                height: 44px;
            }
            /* Desktop menu */
            
            .navbar-nav .nav-link {
                font-weight: 400;
                font-size: 1rem;
                color: #000;
                padding: 0 16px;
            }
            
            .navbar-nav .nav-link.active,
            .navbar-nav .nav-link:hover {
                color: var(--secondary);
            }
            
            .navbar-nav .nav-link.active {
                font-weight: 600;
            }
            /* =====================
   Contact button
===================== */
            
            .btn-contact {
                background: #3c4f6d;
                color: #fff;
                border-radius: 40px;
                padding: 10px 18px 10px 22px;
                font-size: 14px;
                font-weight: 500;
                display: inline-flex;
                align-items: center;
                gap: 12px;
                text-decoration: none;
                transition: all 0.3s ease;
            }
            
            .btn-contact:hover {
                background: #2f3f59;
                color: #fff;
            }
            
            .btn-contact .arrow {
                width: 34px;
                height: 34px;
                background: #fff;
                color: #3c4f6d;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: transform 0.3s ease;
            }
            
            .btn-contact:hover .arrow {
                transform: translateX(6px);
            }
            /* =====================
   Fullscreen mobile menu
===================== */
            
            .mobile-menu {
                background: #0f1c2e;
                color: #fff;
            }
            
            .mobile-menu .offcanvas-header {
                padding: 24px;
            }
            
            .mobile-menu .btn-close {
                filter: invert(1);
            }
            
            .mobile-menu .offcanvas-body {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
            }
            
            .mobile-menu a {
                color: #fff;
                font-size: 1rem;
                font-weight: 400;
                margin: 12px 0;
                text-decoration: none;
                transition: opacity 0.3s ease;
            }
            
            .mobile-menu a:hover {
                opacity: 0.7;
            }
            
            .mobile-menu .btn-contact {
                margin-top: 40px;
            }
            
            .navbar .btn {
                padding: 10px 10px 10px;
                font-size: 1.6rem;
                border: 0;
                background: var(--primary);
                color: #fff;
            }
            /* FULLSCREEN MOBILE MENU â€“ FIX */
            
            .mobile-menu.offcanvas-top {
                height: 100vh !important;
                max-height: 100vh !important;
                top: 0;
            }
            
            .mobile-menu .offcanvas-body {
                height: calc(100vh - 90px);
                /* header height */
                overflow: hidden;
                /* no scrolling */
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            /* Hide desktop nav on mobile */
            
            @media (max-width:1350px) {
                .navbar-nav .nav-link {
                    font-size: .8rem;
                }
                .navbar-brand {
                    position: relative;
                    transform: scale(1.2);
                    margin-top: 0;
                    left: 9px;
                }
            }
            
            @media (max-width: 991px) {
                .desktop-nav {
                    display: none;
                }
                .navbar {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    flex-wrap: nowrap;
                    padding-top: 20px;
                    padding-bottom: 10px;
                }
                .navbar-brand {
                    position: absolute;
                    left: 10px;
                    margin-top: 0;
                    margin-right: 0;
                    transform: scale(1.2);
                    flex-shrink: 0;
                    top: 25px;
                }
                .navbar-brand img {
                    height: 66px;
                }
                .site-header.is-fixed .navbar-brand {
                    left: 10px;
                    margin-top: 0;
                    transform: scale(1.2);
                    position: relative;
                    top: 0;
                }
                .site-header.is-fixed .navbar-brand img {
                    height: 42px;
                }
                .navbar .btn.d-lg-none {
                    margin-left: auto;
                    flex-shrink: 0;
                    position: relative;
                    right: 0;
                }
            }
            /* banner styles */
            /* =====================
   HERO WRAPPER
===================== */
            
            .banner-section {
                position: relative;
                padding: 0;
                margin: -20px 0 0 0;
            }
            
            .hero-slider {
                position: relative;
                border-radius: 28px;
                overflow: hidden;
                margin: 40px auto;
                max-width: 1300px;
            }
            /* SVG overlays */
            
            .hero-svg-top,
            .hero-svg-bottom {
                position: absolute;
                z-index: 6;
                pointer-events: none;
            }
            
            .hero-svg-top {
                top: -1px;
                left: -1px;
                width: 260px;
            }
            
            .hero-svg-bottom {
                right: -1px;
                bottom: -1px;
                width: 240px;
            }
            /* =====================
   SLIDES
===================== */
            
            .banner-section .swiper-slide {
                position: relative;
                height: 620px;
                color: #fff;
                border-radius: 2rem;
                overflow: hidden;
            }
            
            .swiper-slide video,
            .swiper-slide img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }
            
            .swiper-slide:hover img {
                -moz-transform: scale(1.08);
                -ms-transform: scale(1.08);
                -webkit-transform: scale(1.08);
                transform: scale(1.08);
            }
            
            .hero-overlay {
                position: absolute;
                inset: 0;
                background: linear-gradient( 90deg, rgba(10, 20, 40, 0.75) 0%, rgba(10, 20, 40, 0.45) 45%, rgba(10, 20, 40, 0) 100%);
                z-index: 1;
            }
            /* =====================
   CONTENT
===================== */
            
            .hero-content {
                position: absolute;
                z-index: 2;
                left: 60px;
                bottom: 15%;
                /* transform: translateY(-50%); */
                max-width: 920px;
            }
            
            .hero-content h1 {
                font-size: 3rem;
                font-weight: 700;
                line-height: 1.2;
                color: var(--white);
            }
            
            .hero-content h1 span {
                color: #00aaff;
            }
            
            .hero-content p {
                font-size: 1rem;
                opacity: 0.85;
                margin-top: 12px;
                max-width: 500px;
            }
            /* CTA */
            
            .btn-join {
                margin-top: 24px;
                background: rgba(255, 255, 255, 0.15);
                color: #fff;
                border-radius: 30px;
                padding: 10px 18px;
                font-size: .9rem;
                display: inline-flex;
                align-items: center;
                gap: 10px;
                text-decoration: none;
            }
            
            .btn-join span {
                width: 28px;
                height: 28px;
                background: #fff;
                color: #000;
                border-radius: 50%;
                display: grid;
                place-items: center;
            }
            
            .btn-join span img {
                max-width: 9px;
                max-height: 9px;
                padding-right: 0px;
            }
            
            .btn-join:hover {
                background-color: var(--secondary);
                color: var(--white);
            }
            
            .btn-glass {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 12px 28px;
                border-radius: 50px;
                font-size: 14px;
                font-weight: 600;
                letter-spacing: 0.5px;
                text-transform: uppercase;
                color: #fff;
                text-decoration: none;
                background: rgba(255, 255, 255, 0.12);
                backdrop-filter: blur(18px);
                -webkit-backdrop-filter: blur(18px);
                border: 1px solid rgba(255, 255, 255, 0.25);
                box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.4);
                transition: all 0.3s ease;
            }
            
            .btn-glass:hover {
                background: rgba(255, 255, 255, 0.22);
                transform: translateY(-3px);
                box-shadow: 0 12px 35px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.5);
            }
            /* =====================
   VIDEO BUTTON
===================== */
            
            .video-toggle {
                position: absolute;
                right: 32px;
                bottom: 110px;
                z-index: 3;
                width: 48px;
                height: 48px;
                background: rgba(255, 255, 255, 0.2);
                border-radius: 50%;
                display: grid;
                place-items: center;
                cursor: pointer;
                font-size: 18px;
                padding-left: 2px;
            }
            /* =====================
   PAGINATION (LINES)
===================== */
            
            .swiper-pagination {
                position: absolute;
                right: 20px;
                bottom: 32px;
                display: flex;
                gap: 6px;
                left: unset !important;
                width: fit-content !important;
            }
            
            .swiper-pagination-bullet {
                width: 8px;
                height: 28px;
                border-radius: 5px;
                background: rgba(17, 17, 17, 0.2);
                opacity: 1;
                transform: none;
                transform: rotate(44deg);
            }
            
            .swiper-pagination-bullet-active {
                background: #00aaff;
            }
            
            .banner-section .swiper-pagination {
                z-index: 6;
            }
            /* =====================
   RESPONSIVE
===================== */
            
            @media (max-width: 768px) {
                .swiper-slide {
                    height: 420px;
                }
                .hero-content {
                    left: 24px;
                    right: 24px;
                }
                .hero-content h1 {
                    font-size: 2rem;
                }
                .hero-svg-top {
                    width: 180px;
                }
                .hero-svg-bottom {
                    width: 160px;
                }
                .swiper.thumbs-swiper {
                    display: none;
                }
                .hero-swiper {
                    height: fit-content;
                    max-height: 440px;
                }
                .video-toggle {
                    right: 12px;
                    bottom: 60px;
                }
            }
            /* stats section */
            
            .club-title {
                font-weight: 700;
                font-size: 3rem;
                line-height: 1.2;
                text-transform: uppercase;
            }
            
            .club-title span {
                color: var(--secondary);
            }
            
            .club-title span.bg-secondary {
                background: var(--secondary);
                color: var(--white);
                padding: 0px 5px;
            }
            
            .club-desc {
                font-size: 1rem;
                color: #3d4d66;
                max-width: 450px;
                font-weight: 500;
                margin-top: 1.5rem;
            }
            /* =====================
   CARDS
===================== */
            
            .club-card {
                border-radius: 20px;
                overflow: hidden;
                height: 100%;
            }
            
            .club-card img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                -webkit-transition: all 0.5s;
                -moz-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }
            
            .club-card:hover img {
                -moz-transform: scale(1.08);
                -ms-transform: scale(1.08);
                -webkit-transform: scale(1.08);
                transform: scale(1.08);
            }
            
            .card-overlay {
                position: absolute;
                inset: 0;
                background: linear-gradient( 180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.6) 100%);
            }
            
            .card-content {
                position: absolute;
                top: 50%;
                left: 50%;
                color: #fff;
                max-width: 200px;
                transform: translate(-50%);
                display: flex;
                flex-wrap: wrap;
            }
            
            .card-content h6 {
                color: var(--white);
                font-weight: 500;
                text-align: center;
            }
            
            .btn-join {
                margin-top: 12px;
                background: rgba(255, 255, 255, 0.2);
                color: #fff;
                border-radius: 30px;
                padding: 8px 16px;
                font-size: .9rem;
                display: inline-flex;
                align-items: center;
                gap: 8px;
                text-decoration: none;
            }
            
            .btn-join span {
                width: 24px;
                height: 24px;
                background: #fff;
                color: var(--primary);
                border-radius: 50%;
                display: grid;
                place-items: center;
            }
            /* =====================
   STATS
===================== */
            
            .stat-number {
                font-size: 4rem;
                font-weight: 300;
                color: var(--secondary);
                text-align: left;
            }
            
            .stat-text {
                font-size: 1rem;
                color: #3d4d66;
                text-align: left;
                padding-right: 4rem;
            }
            /* =====================
   LIGHT STAT CARD
===================== */
            
            .light-card {
                background: linear-gradient(360deg, #96D1E8, #e6f3fb);
                border-radius: 20px;
                height: 100%;
                padding: 40px;
                display: flex;
                align-items: center;
            }
            
            .light-card .stat-number {
                font-size: 4rem;
            }
            /* =====================
   RESPONSIVE
===================== */
            
            @media (max-width: 1350px) {
                .club-title {
                    font-size: 2.6rem;
                }
            }
            
            @media (max-width: 768px) {
                .club-title {
                    font-size: 28px;
                }
            }
            /* =====================
   MEMBERSHIP SECTION
===================== */
            
            .membership-section {
                padding-top: 6rem;
            }
            
            .membership-det {
                max-width: 75%;
            }
            
            .membership-box figure {
                margin-bottom: 1rem;
                overflow: hidden;
                position: relative;
                border-radius: 1rem;
            }
            
            .membership-box figure img {
                transition: all 0.3s ease;
                border-radius: 1.1rem;
            }
            /* .membership-box:hover img {
                transform: scale(1.1);
                border-radius: 1.5rem;
            } */
            
            .membership-det h6 {
                color: var(--secondary);
                font-size: 1rem;
                text-transform: uppercase;
            }
            
            .top-left-shape,
            .bottom-left-shape,
            .bottom-right-shape {
                position: absolute;
                top: -3px;
                left: -3px;
                z-index: 1;
            }
            
            .bottom-left-shape {
                top: unset;
                bottom: -2px;
                left: -3px;
            }
            
            .bottom-right-shape {
                top: unset;
                bottom: -2px;
                left: unset;
                right: -2px;
            }
            
            .btn-outline {
                border: solid 1px var(--text-dark);
                color: var(--text-color) !important;
                text-transform: uppercase;
                font-weight: 500;
                margin-top: 0;
            }
            
            .btn-outline span {
                background: var(--primary);
                color: #fff;
            }
            
            .btn-outline:hover {
                background: var(--primary);
                border-color: var(--primary);
                color: var(--white) !important;
            }
            
            .btn-outline:hover span {
                background: var(--white);
                color: var(--primary);
            }
            
            .cat-div {
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
            }
            
            .cat-img {
                mask-image: url(../images/membership-img.svg);
                mask-mode: alpha;
                mask-repeat: no-repeat;
                mask-size: 100%;
                max-width: 600px;
                width: 100%
            }
            
            .bg-shape {
                background-size: contain;
                background-repeat: no-repeat;
            }
            /* responsive */
            
            @media (max-width:768px) {
                .membership-section {
                    padding-top: 1rem;
                }
                .membership-box {
                    margin: 1rem 0 1.5rem;
                }
            }
            /* =====================
   SERVICES SECTION
===================== */
            
            .left-col,
            .right-col {
                width: 100%;
            }
            
            .core-services {
                /* padding: 0; */
                background-size: cover;
                background-repeat: no-repeat;
            }
            
            .core-grid {
                display: grid;
                /* grid-template-columns: 1fr 1.1fr; */
                gap: 60px;
                align-items: center;
            }
            
            .core-services .core-grid>.row {
                margin-left: 0;
                margin-right: 0;
                max-width: 100%;
            }
            
            .swiper-wrapper {
                align-items: flex-end;
            }
            /* LEFT CONTENT */
            
            .bottom-align {
                height: 100%;
                display: flex;
                align-items: flex-end;
                overflow: hidden;
            }
            
            .section-label {
                color: #00aaff;
                font-size: 1rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                margin-bottom: .75rem;
            }
            
            .section-desc {
                font-size: 1.6rem;
                line-height: 1.45;
                color: #1e2d46;
                margin: 12px 0 32px;
                max-width: 520px;
                font-weight: 500;
            }
            /* =====================
   THUMBNAILS
===================== */
            
            .thumbs-swiper .swiper-slide {
                max-width: none !important;
                height: 240px;
                border-radius: 20px;
                overflow: hidden;
                cursor: pointer;
                /* opacity: 0.5; */
                transition: opacity 0.3s ease;
                position: relative;
            }
            
            .thumbs-swiper .swiper-slide .overlay {
                position: absolute;
                width: 100%;
                height: 100%;
                bottom: 0;
                left: 0;
                z-index: 3;
                padding: 1rem;
                background: linear-gradient(rgba(56, 77, 109, 0), rgb(27, 39, 56));
                display: flex;
                align-items: flex-end;
            }
            
            .thumbs-swiper .swiper-slide .overlay h6 {
                color: var(--white);
                text-transform: uppercase;
                font-size: 1rem;
            }
            
            .thumbs-swiper .swiper-slide-thumb-active {
                opacity: 1;
                border: solid 2px var(--secondary);
            }
            
            .thumbs-swiper img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            /* =====================
   HERO
===================== */
            
            .core-services .hero-swiper {
                height: 720px;
                position: relative;
                aspect-ratio: 1.5 / 2;
            }
            
            .core-services .hero-swiper .swiper-slide {
                position: relative;
                border-radius: 28px;
                overflow: hidden;
            }
            
            .service-pic-shape {
                position: absolute;
                top: -3px;
                right: -3px;
                z-index: 1;
            }
            
            .core-services .hero-swiper img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
                border-radius: 2rem;
            }
            
            .core-services .hero-swiper .service-text {
                max-width: 320px;
                color: var(--white);
            }
            
            .core-services .hero-swiper,
            .core-services .hero-swiper .swiper-wrapper,
            .core-services .hero-swiper .swiper-slide,
            .core-services .hero-swiper img {
                backface-visibility: hidden;
                -webkit-backface-visibility: hidden;
                transform: translateZ(0);
            }
            
            .core-services .hero-swiper {
                isolation: isolate;
                overflow: hidden;
                margin: 0;
                width: 100%;
            }
            /* Overlay */
            
            .hero-overlay {
                position: absolute;
                inset: 0;
                background: linear-gradient( 180deg, rgba(0, 0, 0, 0.15) 35%, rgba(0, 0, 0, 0.75) 100%);
            }
            
            .hero-swiper .swiper-slide .overlay {
                position: absolute;
                width: 100%;
                height: 80%;
                bottom: 0;
                left: 0;
                z-index: 3;
                padding: 1rem 2rem 2rem;
                box-sizing: border-box;
                background: linear-gradient(rgba(56, 77, 109, 0), rgb(27, 39, 56));
                display: flex;
                align-items: flex-end;
            }
            
            .hero-swiper .swiper-slide .overlay h5 {
                color: var(--white);
                text-transform: uppercase;
                /* font-size: 1rem; */
            }
            /* Content */
            
            .hero-content {
                position: absolute;
                bottom: 32px;
                left: 32px;
                right: 32px;
                color: #fff;
            }
            
            .hero-content h4 {
                font-size: 22px;
                margin-bottom: 8px;
            }
            
            .service-btn {
                width: 100%;
                text-align: right;
            }
            /* =====================
   NAV ARROWS
===================== */
            
            .swiper-button-next,
            .swiper-button-prev {
                width: 44px;
                height: 44px;
                background: rgba(0, 0, 0, 0.4);
                border-radius: 50%;
                color: #fff;
            }
            
            .swiper-button-next::after,
            .swiper-button-prev::after {
                content: "";
                display: block;
                width: 18px;
                height: 18px;
                background: url(../images/arrow-icon.svg) no-repeat center;
                background-size: contain;
                font-size: 0;
            }
            
            .swiper-button-prev::after {
                transform: rotate(180deg);
            }
            
            .left-nav {
                display: flex;
                gap: 14px;
                margin: 24px 0 16px;
                justify-content: flex-end;
            }
            
            .core-services .core-services-pagination {
                position: absolute;
                top: 16px;
                right: 16px;
                bottom: auto;
                left: auto !important;
                width: auto !important;
                margin: 0;
                display: flex;
                gap: 6px;
                z-index: 8;
            }
            
            .core-services .core-services-pagination .swiper-pagination-bullet {
                background: rgba(17, 17, 17, 0.2);
                opacity: 0.8;
            }
            
            .core-services .core-services-pagination .swiper-pagination-bullet-active {
                background: #00aaff;
                opacity: 1;
            }
            
            .custom-prev,
            .custom-next {
                position: static;
                width: 40px;
                height: 40px;
                background: transparent;
                border-radius: 50%;
                color: #1e2d46;
                margin-top: -3px;
            }
            
            .custom-prev::after,
            .custom-next::after {
                font-size: 14px;
            }
            /* =====================
   RESPONSIVE
===================== */
            
            @media (max-width: 992px) {
                .core-grid {
                    grid-template-columns: 1fr;
                }
                .core-services .hero-swiper {
                    height: auto;
                    margin-top: 0;
                    max-height: 600px;
                    aspect-ratio: 0.5;
                }
            }
            
            @media (max-width: 768px) {
                .hero-swiper .swiper-slide .overlay {
                    position: relative;
                    background: var(--primary);
                    display: block;
                    font-size: 1rem;
                    min-height: 235px
                }
                .service-btn {
                    text-align: center;
                }
                .core-services .hero-swiper {
                    height: auto;
                    aspect-ratio: 0.65;
                }
                .core-services .hero-swiper .service-text {
                    text-align: center;
                }
                .service-pic-shape {
                    top: 88px;
                    right: -3px;
                    z-index: 1;
                    max-width: 180px;
                }
                .core-services .core-grid>.row {
                    margin-left: 0;
                    margin-right: 0;
                    max-width: 86%;
                }
                .core-services .service-btn .btn-join {
                    margin-top: 0;
                }
            }
            /* amenities section */
            
            .amenities-section {
                padding: 3rem 0rem;
                background: #FFFDF0;
                overflow: hidden;
                /* margin-bottom: 2rem; */
            }
            
            .amenities-section h5 {
                font-weight: 500;
                font-size: 1.6rem;
                color: var(--primary);
            }
            /* =============================
SLIDER
============================= */
            
            .amenities-slider,
            .amenities-slider .swiper,
            .membership-slider,
            .membership-slider .swiper  {
                overflow: visible;
                position: relative;
            }
            /* =============================
CARD
============================= */
            
            .amenity-card, .membership-card {
                position: relative;
                border-radius: 16px;
                overflow: hidden;
                height: 360px;
            }
            
            .amenity-card img, .membership-card img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                transition: ease-in .2s;
            }
            
            .amenity-card:hover img, .membership-card:hover img  {
                transform: scale(1.1);
            }
            /* gradient */
            
            .amenity-card::after, .membership-card::after {
                content: "";
                position: absolute;
                inset: 0;
                background: linear-gradient(to top, rgba(0, 0, 0, .65), rgba(0, 0, 0, .1));
            }
            /* text */
            
            .amenity-content, .membership-content {
                position: absolute;
                bottom: 30px;
                left: 20px;
                right: 20px;
                z-index: 2;
                color: #fff;
                max-width: calc(100% - 100px);
            }
            
            .amenity-title, .membership-title {
                font-weight: 700;
                font-size: 1.3rem;
                letter-spacing: .5px;
                color: #fff;
                text-transform: uppercase;
                line-height: 1.6rem;
            }
            
            .amenity-desc, .membership-desc  {
                font-size: 14px;
                opacity: .9;
                max-width: 400px;
                margin-top: .75rem;
            }
            /* small arrow */
            .membership-card tr {
                color: #fff;
            }
            .membership-card .table-bordered>:not(caption)>*>* {
                border-width: 0 !important;
            }

            .membership-slider .card-arrow,
            .amenities-slider .card-arrow,
            .amenity-card .card-arrow, .membership-card .card-arrow {
                position: absolute;
                right: 20px;
                bottom: 30px;
                z-index: 2;
                width: 45px;
                height: 45px;
                border-radius: 50%;
                background: rgba(255, 255, 255, .25);
                display: flex;
                align-items: center;
                justify-content: center;
                color: #fff;
                font-size: 18px;
                line-height: 1;
            }
            /* =============================
NAVIGATION
============================= */
            
            .membership-slider .swiper-nav,
            .amenities-slider .swiper-nav {
                position: absolute;
                right: 12px;
                top: -80px;
                display: flex;
                gap: 10px;
            }
            
            .membership-slider .swiper-button-next,
            .amenities-slider .swiper-button-next,
            .swiper-button-prev {
                position: relative;
                width: 36px;
                height: 36px;
                margin: 0;
                background: transparent;
                border-radius: 50%;
                color: #000;
            }
            
            .amenities-slider .swiper-button-next:after,
            .amenities-slider .swiper-button-prev:after,
            .membership-slider .swiper-button-next:after,
            .membership-slider .swiper-button-prev:after {
                font-size: 14px;
                font-weight: bold;
            }
            
            .amenities-slider .swiper-button-prev,
            .membership-slider .swiper-button-prev {
                margin-right: 15px;
            }
            
            @media(max-width:768px) {
                .amenities-slider .swiper-nav,
                .membership-slider .swiper-nav {
                    position: relative;
                    top: 0;
                    margin-bottom: 1rem;
                }
                .swiper-slide {
                    height: auto;
                }
            }
            /* events section */
            
            .events-section h4 {
                font-weight: 500;
                color: var(--primary);
            }
            
            .events-box {
                text-align: center;
            }
            
            .events-box figure {
                margin-bottom: 1rem;
                overflow: hidden;
                border-radius: 18px;
                /* clip-path: polygon(20% 0%, 100% 0%, 100% 82%, 86% 100%, 0% 100%, 0% 18%); */
                position: relative;
            }
            
            .events-box .events-tp {
                position: absolute;
                top: -2px;
                left: -2px;
                max-width: 100px;
                border-radius: 0;
                object-fit: unset;
            }
            
            .events-box .events-btm {
                position: absolute;
                bottom: -2px;
                right: -2px;
                max-width: 100px;
                border-radius: 0;
                object-fit: unset;
            }
            
            .events-box h6 {
                font-size: 1rem;
                text-transform: uppercase;
                color: var(--primary);
                font-weight: 700;
            }
            
            .events-box .event-det p {
                font-size: 1rem;
            }
            
            .events-box figure img {
                border-radius: 1rem;
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: 1.2rem;
            }
            
            .events-box .date {
                color: var(--secondary);
                font-weight: 600;
                font-size: 1rem;
                text-transform: uppercase;
            }
            
            @media(max-width:768px) {
                .events-box {
                    margin: 1rem 0 1.5rem;
                }
            }
            /* cta section */
            
            .cta-pic {
                /* width: 420px; */
                max-width: 100%;
                height: 280px;
                overflow: hidden;
                border-radius: 1rem;
                position: relative;
                border-top-right-radius: 0;
                border-bottom-right-radius: 0;
            }
            
            .cta-pic img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                /* border-radius: 1rem; */
            }
            
            .cta-shape-top,
            .cta-shape-bottom {
                position: absolute;
                left: -3px;
                top: -3px;
                z-index: 1;
            }
            
            .cta-shape-bottom {
                top: unset;
                left: unset;
                bottom: -3px;
                right: -1px;
            }
            
            .cta-box {
                background-size: cover;
                background-repeat: no-repeat;
                width: 100%;
                padding: 0 3rem 0 0;
                border-radius: 1.5rem;
                /* overflow: hidden; */
                position: relative;
            }
            /* .cta-pic {
                transform: scale(1.2);
                margin-left: 2rem;
            } */
            
            .cta-content {
                display: flex;
                align-items: center;
                color: var(--white);
            }
            
            .cta-content h4 {
                color: var(--white);
            }
            
            .cta-content p {
                max-width: 260px;
            }
            
            .cta-content .input-group {
                background: rgba(0, 0, 0, 0.24);
                border-radius: 1.5rem;
            }
            
            .cta-content input {
                background: transparent;
                color: var(--white);
                text-transform: uppercase;
                border-top-left-radius: 1rem;
                border-bottom-left-radius: 1rem;
                border: 0;
                padding: .85rem 1rem;
            }
            
            .cta-content input::placeholder {
                color: #a3a3a3;
                text-transform: capitalize;
            }
            
            .cta-content .btn-white {
                margin-top: 0;
                border-radius: 1.5rem !important;
                background: var(--white);
                color: var(--primary);
                font-weight: 600;
                text-transform: uppercase;
            }
            
            .cta-content .btn-white span {
                background: var(--primary);
                color: var(--white);
            }
            
            .cta-box .cta-shape {
                position: absolute;
                bottom: -3px;
                right: -3px;
                z-index: 1;
                max-width: 160px;
            }
            
            @media (max-width:768px) {
                .cta-box {
                    padding: 0;
                    border-radius: 1rem;
                    overflow: hidden;
                }
                .cta-pic {
                    transform: none;
                    margin-left: 0;
                    width: 100%;
                    height: auto;
                    margin-top: -1rem;
                    margin-bottom: 1rem;
                }
                .cta-box .cta-shape {
                    bottom: -2px;
                    right: -2px;
                    max-width: 110px;
                }
                .cta-content {
                    padding: 2rem 2rem 3rem;
                }
            }
            /* FAQ section */
            
            .faq-section h3 {
                font-size: 3rem;
                font-weight: 500;
                color: var(--primary);
            }
            
            .faq-section .faq-help img {
                max-width: 120px;
            }
            
            .faq-section .faq-help .lead {
                margin-bottom: .5rem;
                font-size: .9rem;
            }
            
            .faq-section .faq-help p {
                color: #646A69;
                font-size: .85rem;
            }
            
            .faq-section .faq-help a {
                color: #333;
            }
            
            .faq-section .accordion-item {
                border-bottom: 1px solid #e5e5e5;
                background: #fff;
                border: solid 1px #f2f2f2;
                padding: .35rem 1rem;
                border-radius: .5rem;
                margin-bottom: 1rem;
                box-shadow: 3px 3px 5px 1px #f7f6f6;
            }
            
            .faq-section .accordion-button {
                padding: 1rem 0;
                font-weight: 500;
                color: #000;
            }
            
            .faq-section .accordion-button:not(.collapsed) {
                background: none;
                color: #000;
                box-shadow: none;
            }
            
            .faq-section .accordion-button::after {
                background-image: none;
                content: '+';
                font-size: 22px;
                transform: none;
            }
            
            .faq-section .accordion-button:not(.collapsed)::after {
                content: '-';
            }
            
            .faq-section .accordion-body {
                padding: 0 0 1rem;
                color: #555;
                font-size: .9rem;
            }
            /* responsive */
            
            @media (max-width: 1350px) {
                #faqAccordion {
                    margin-top: 1rem;
                }
                .faq-section h3 {
                    font-size: 2.5rem;
                }
            }
            /* map section */
            
            #map {
                height: 100%;
                width: 100%;
                /* filter: brightness(0.92) saturate(0.85) contrast(0.95); */
                border-top-left-radius: 1rem;
                border-bottom-left-radius: 1rem;
            }
            
            .map-tint {
                position: absolute;
                inset: 0;
                background: rgba(56, 77, 109, 0.65);
                mix-blend-mode: multiply;
                pointer-events: none;
                z-index: 400;
            }
            /* Tint ONLY the tiles, not markers */
            
            .leaflet-tile-pane {
                /* filter: sepia(18%) saturate(120%) hue-rotate(190deg) brightness(92%) contrast(95%); */
                /* filter: sepia(100%) saturate(900%) hue-rotate(190deg) brightness(190.1%) contrast(80%); */
            }
            
            .leaflet-control-attribution.leaflet-control {
                display: none;
            }
            
            .location-det {
                border-top-right-radius: 1rem;
                border-bottom-left-radius: 1rem;
            }
            
            .location-det .adrs {
                background: var(--secondary);
                display: flex;
                padding: 1rem 2rem;
                color: var(--white);
                border-bottom-right-radius: 1rem;
                align-items: center;
                justify-content: space-between;
            }
            
            .location-det .adrs p {
                max-width: 300px;
                margin-right: 50px;
                margin-bottom: 0;
            }
            
            .location-det .adrs img {
                min-width: 50px;
                margin-top: 1rem;
            }
            
            .location-det a {
                transition: ease-in .5s;
            }
            
            .location-det a:hover {
                -webkit-transform: scaleX(-1);
                transform: scaleX(-1);
            }
            
            @media (max-width:768px) {
                .location-det .adrs p {
                    font-size: 1rem;
                }
            }
            /* footer */
            
            .footer {
                background: url(../images/footer-bg.jpg) no-repeat;
                background-size: cover;
                position: relative;
                padding: 5rem 2rem 0;
                border-radius: 1rem;
                overflow: hidden;
                margin-bottom: 2rem;
                color: var(--white);
                font-size: .8rem;
            }
            
            .footer img {
                max-width: 250px;
            }
            
            .footer h6 {
                color: var(--white);
                font-size: 1rem;
                text-transform: uppercase;
            }
            
            .footer ul {
                display: flex;
                flex-wrap: wrap;
                padding: 0;
                margin: 0;
            }
            
            .footer ul li {
                min-width: 170px;
                margin-bottom: .5rem;
            }
            
            .footer a {
                color: var(--white);
            }
            
            .footer li a {
                text-transform: uppercase;
            }
            
            .footer a:hover {
                /* text-decoration: underline; */
                /* font-weight: 600; */
                color: var(--secondary);
            }
            
            .footer .creds {
                font-weight: 300;
                padding-bottom: 1.5rem;
                margin-top: 2rem;
            }
            
            .footer .creds .row {
                align-items: center;
            }
            
            .footer-social {
                display: flex;
                justify-content: flex-end;
                gap: .65rem;
                z-index: 9;
                /* position: relative; */
                position: absolute;
                right: 15px;
                bottom: 5px;
            }
            
            .footer-social a {
                width: 36px;
                height: 36px;
                border-radius: 50%;
                background: var(--primary);
                color: var(--white);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 1rem;
            }
            
            .footer-social a:hover {
                background: var(--secondary);
                color: var(--white);
            }
            
            .footer-contact {
                line-height: 1.5rem;
                text-transform: uppercase;
            }
            
            @media (max-width:768px) {
                .footer .creds {
                    margin-bottom: 3rem;
                }
                .footer h6 {
                    margin-top: 1rem;
                }
                .footer-social {
                    justify-content: flex-start;
                    margin-top: 1rem;
                    right: unset;
                    bottom: unset;
                }
            }
            
            .inner-banner {
                padding: 4rem 0;
            }
            
            .inner-banner .inner-banner-content {
                margin-top: 6rem;
                padding-right: 4rem;
            }
            
            .inner-banner .banner-pic {
                position: relative;
            }
            
            .inner-banner .banner-pic .inner-banner-top {
                position: absolute;
                top: -3px;
                left: -2px;
                z-index: 1;
                max-width: 300px;
            }
            
            .inner-banner .banner-pic .inner-banner-bottom {
                position: absolute;
                bottom: -1px;
                right: -3px;
                z-index: 1;
                max-width: 200px;
            }
            
            .inner-banner .page-name {
                background: #E9E7DE;
                border-radius: 20px;
                padding: .25rem 1rem;
                font-size: 0.9rem;
                margin-bottom: 1rem;
                width: fit-content;
                color: #000;
                font-weight: 600;
                text-transform: uppercase;
            }
            
            .inner-banner h1 {
                color: var(--primary);
                font-weight: 500;
            }
            
            .inner-banner img {
                border-radius: 1rem;
            }
            
            .heading {
                text-transform: uppercase;
                color: var(--primary);
                font-size: 2.2rem;
                font-weight: 700;
            }
            
            .service-pics {
                position: relative;
            }
            
            .service-pics img {
                border-radius: 1rem;
                min-height: 560px;
            }
            
            .service-texts {
                padding-left: 2.5rem;
                padding-top: 2.5rem;
                padding-right: 2rem;
            }
            
            .service-shape {
                position: absolute;
                top: -2px;
                right: -2px;
                z-index: 1;
            }
            
            .service-shape img {
                min-height: auto;
            }
            
            .service-slider .swiper-slide {
                height: 240px;
                border-radius: 20px;
                overflow: hidden;
                cursor: pointer;
                /* opacity: 0.5; */
                transition: opacity 0.3s ease;
                position: relative;
            }
            
            .service-slider {
                overflow: hidden;
                padding-bottom: 3rem;
            }
            
            .service-slider .service-slider-controls {
                position: absolute;
                left: 50%;
                bottom: 0;
                transform: translateX(-50%);
                display: flex;
                align-items: center;
                gap: 10px;
                z-index: 4;
            }
            
            .service-slider .service-slider-prev,
            .service-slider .service-slider-next {
                position: static;
                width: 36px;
                height: 36px;
                margin: 0;
                background: #fff;
                border-radius: 50%;
                color: #000;
            }
            
            .service-slider .service-slider-prev::after,
            .service-slider .service-slider-next::after {
                content: "";
                display: block;
                width: 10px;
                height: 10px;
                background: url(../images/arrow-icon.svg) no-repeat center;
                background-size: contain;
                font-size: 0;
            }
            
            .service-slider .service-slider-prev::after {
                transform: rotate(180deg);
            }
            
            .service-slider .service-slider-pagination {
                position: static;
                width: auto;
                display: flex;
                align-items: center;
            }
            
            .service-slider .service-slider-pagination .swiper-pagination-bullet {
                width: 8px;
                height: 8px;
                background: #9da9be;
                opacity: 1;
                margin: 0 4px !important;
            }
            
            .service-slider .service-slider-pagination .swiper-pagination-bullet-active {
                background: var(--primary);
            }
            
            .service-slider .swiper-slide .overlay {
                position: absolute;
                width: 100%;
                height: 100%;
                bottom: 0;
                left: 0;
                z-index: 3;
                padding: 1rem;
                background: linear-gradient(rgba(56, 77, 109, 0), rgb(27, 39, 56));
                display: flex;
                align-items: flex-end;
            }
            
            .service-slider .swiper-slide .overlay h6 {
                color: var(--white);
                text-transform: uppercase;
                font-size: 1rem;
            }
            
            .service-slider .swiper-slide-thumb-active {
                opacity: 1;
            }
            
            .service-slider img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            
            .membership-cycle-tabs {
                margin: 2rem auto 0;
                max-width: 760px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 1.25rem;
            }
            
            .membership-cycle-tab {
                min-width: 180px;
                padding: 0.8rem 1.4rem;
                border-radius: 999px;
                border: 1px solid rgba(56, 77, 109, 0.65);
                background: transparent;
                color: var(--primary);
                font-weight: 700;
                letter-spacing: 0.5px;
                text-transform: uppercase;
                transition: all .25s ease;
            }
            
            .membership-cycle-tab.is-active,
            .membership-cycle-tab:hover {
                background: var(--primary);
                color: var(--white);
                border-color: var(--primary);
            }
            
            .membership-tab-panel {
                display: none;
            }
            
            .membership-tab-panel.is-active {
                display: block;
            }
            
            .membership-single {
                margin-top: 5rem;
            }
            
            .membership-single .membership-box {
                margin-right: 5rem;
            }
            
            .membership-single .membership-box figure img {
                transition: all 0.3s ease;
                object-fit: cover;
                width: 100%;
            }
            
            .membership-single.img-right .membership-box {
                margin-right: 0;
                margin-left: 1rem;
            }
            
            .membership-plans-section {
                padding-top: 1rem;
            }
            
            .membership-plans-wrap {
                /* background: #f9f9f9; */
                border-radius: 12px;
                padding: 2.5rem 2rem 1.8rem;
            }
            
            .membership-plans-title {
                text-align: center;
                font-size: 3rem;
                line-height: 1.05;
                text-transform: uppercase;
                letter-spacing: 1px;
                margin-bottom: 2rem;
                color: var(--primary);
                font-weight: 800;
            }
            
            .membership-plans-grid {
                display: grid;
                grid-template-columns: 1.55fr 1fr 1fr 1.18fr;
            }
            
            .membership-plans-grid .plan-cell {
                padding: 1.1rem 1.2rem;
                border-bottom: 1px solid rgba(56, 77, 109, 0.2);
                color: var(--primary);
            }
            
            .membership-plans-grid .plan-head {
                font-weight: 700;
                text-transform: uppercase;
                border-bottom: 2px solid var(--secondary);
                font-size: 1.1rem;
                text-align: center;
            }
            
            .membership-plans-grid .plan-feature {
                font-weight: 700;
            }
            
            .membership-plans-grid .plan-value {
                text-align: center;
                font-size: 1.9rem;
                line-height: 1;
                font-weight: 500;
            }
            
            .membership-plans-grid .plan-check {
                color: var(--secondary);
            }
            
            .membership-plans-grid .plan-dash {
                color: #777;
            }
            
            .membership-plans-grid .plan-price-spacer,
            .membership-plans-grid .plan-btn-spacer {
                border-bottom: 0;
            }
            
            .membership-plans-grid .plan-price {
                border-bottom: 0;
                padding-top: 1.2rem;
                padding-bottom: .4rem;
                text-align: center;
                font-size: 2rem;
                font-weight: 800;
                color: var(--secondary);
            }
            
            .membership-plans-grid .plan-btn-wrap {
                border-bottom: 0;
                text-align: center;
                padding-top: .5rem;
                padding-bottom: 1.5rem;
            }
            
            .membership-plans-grid .plan-elite {
                background: #edf1e7;
                border-left: 1px solid rgba(56, 77, 109, 0.12);
                border-right: 1px solid rgba(56, 77, 109, 0.12);
            }
            
            .membership-plans-grid .elite-top {
                border-top-left-radius: 12px;
                border-top-right-radius: 12px;
            }
            
            .membership-plans-grid .elite-bottom {
                border-bottom-left-radius: 12px;
                border-bottom-right-radius: 12px;
            }
            
            .membership-plan-btn {
                min-width: 165px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
                border: 1px solid rgba(56, 77, 109, 0.45);
                border-radius: 999px;
                padding: 0.72rem 1rem;
                font-weight: 700;
                font-size: .82rem;
                color: var(--primary);
                transition: all .25s ease;
            }
            
            .membership-plan-btn span {
                width: 28px;
                height: 28px;
                border-radius: 50%;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                background: var(--primary);
                color: #fff;
                font-size: 1rem;
                line-height: 1;
            }
            
            .membership-plan-btn:hover {
                border-color: var(--primary);
                background: rgba(56, 77, 109, 0.08);
                color: var(--primary);
            }
            
            .membership-plan-btn--elite {
                background: var(--primary);
                border-color: var(--primary);
                color: #fff;
            }
            
            .membership-plan-btn--elite span {
                background: #fff;
                color: var(--primary);
            }
            
            .membership-plan-btn--elite:hover {
                background: #2f3f59;
                border-color: #2f3f59;
                color: #fff;
            }
            
            @media (max-width: 991px) {
                .membership-plans-title {
                    font-size: 2rem;
                }
                .membership-plans-wrap {
                    padding: 1.4rem 1rem 1rem;
                }
                .membership-plans-grid {
                    grid-template-columns: 1.45fr 1fr 1fr 1.2fr;
                    overflow-x: auto;
                }
                .membership-plans-grid .plan-cell {
                    min-width: 140px;
                    padding: .9rem .7rem;
                    font-size: .9rem;
                }
                .membership-plans-grid .plan-feature {
                    min-width: 180px;
                }
                .membership-plans-grid .plan-value {
                    font-size: 1.5rem;
                }
                .membership-plans-grid .plan-price {
                    font-size: 1.5rem;
                }
                .membership-plan-btn {
                    min-width: 125px;
                    padding: .6rem .75rem;
                    font-size: .72rem;
                    gap: 6px;
                }
                .membership-plan-btn span {
                    width: 24px;
                    height: 24px;
                    font-size: .9rem;
                }
                .service-slider .service-slider-controls {
                    position: relative;
                    bottom: -20px;
                    display: flex;
                    justify-content: center;
                }
                .service-slider {
                    padding-bottom: 1rem;
                }
                .membership-cycle-tabs {
                    margin-top: 1.5rem;
                    gap: .65rem;
                    flex-wrap: wrap;
                }
                .membership-cycle-tab {
                    min-width: 145px;
                    padding: .65rem 1rem;
                    font-size: .82rem;
                }
                .membership-single .membership-box {
                    margin-right: 0;
                }
            }
            
            .membership-single .membersip-content ul {
                margin: 1rem 0 1rem;
                padding: 0;
            }
            
            .membership-single .membersip-content ul li {
                position: relative;
                padding-left: 40px;
                margin-bottom: .25rem;
            }
            
            .membership-single .membersip-content ul li:before {
                content: '';
                background: url(../images/dumbell-icon.svg) no-repeat;
                background-size: contain;
                width: 20px;
                height: 20px;
                position: absolute;
                display: inline-block;
                left: 10px;
            }
            
            .membersip-content {
                padding-left: 1rem;
                padding-right: 4rem;
                max-width: 540px;
            }
            
            @media (max-width: 767px) {
                .membership-single .membership-media-col {
                    order: 1;
                }
                .membership-single .membership-content-col {
                    order: 2;
                }
            }
            
            .contact-form-section {
                padding-top: 1rem;
            }
            
            .contact-form-wrap {
                display: flex;
                background: #fff;
                border: 1px solid rgba(56, 77, 109, 0.12);
                border-radius: 1rem;
                overflow: hidden;
                box-shadow: 0 18px 45px rgba(56, 77, 109, 0.08);
            }
            
            .contact-form-media {
                /* width: 46%; */
                min-height: 640px;
                /* clip-path: polygon(0 0, 100% 0, 84% 100%, 0 100%); */
            }
            
            .contact-form-media img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            
            .contact-form-content {
                width: 54%;
                padding: 3rem 6% 2.75rem 5%;
                color: var(--primary);
            }
            
            .contact-form-head {
                margin-bottom: 1.75rem;
            }
            
            .contact-form-head .section-label {
                margin-bottom: .65rem;
            }
            
            .contact-form-head .club-title {
                font-size: 2.5rem;
                line-height: 1.2;
            }
            
            .contact-form-head .club-title span.bg-secondary {
                color: #fff;
            }
            
            .contact-form-head p {
                margin-top: .85rem;
                color: rgba(56, 77, 109, 0.85);
            }
            
            .contact-form .form-label {
                display: block;
                color: var(--primary);
                text-transform: uppercase;
                font-weight: 700;
                margin-bottom: .55rem;
                font-size: .85rem;
                letter-spacing: .06em;
            }
            
            .contact-form .form-control {
                background: #fff;
                border: 1px solid rgba(56, 77, 109, 0.2);
                border-radius: .45rem;
                color: var(--primary);
                padding: .9rem 1rem;
                font-size: 1rem;
                box-shadow: none;
            }
            
            .contact-form .form-control:focus {
                border-color: var(--secondary);
                box-shadow: 0 0 0 3px rgba(0, 162, 226, 0.16);
            }
            
            .contact-form textarea.form-control {
                min-height: 150px;
            }
            
            .contact-form .form-control::placeholder {
                color: rgba(56, 77, 109, 0.55);
            }
            
            .custom-contact-check {
                display: flex;
                align-items: flex-start;
                gap: .55rem;
                color: var(--primary);
                font-size: 1rem;
            }
            
            .custom-contact-check .form-check-input {
                margin-top: 0;
                border-radius: .2rem;
                border: 1px solid rgba(56, 77, 109, 0.38);
                width: 1.05rem;
                height: 1.05rem;
                background-color: #fff;
                box-shadow: none;
            }
            
            .custom-contact-check .form-check-input:checked {
                background-color: var(--secondary);
                border-color: var(--secondary);
            }
            
            .custom-contact-check a {
                color: var(--secondary);
                text-decoration: underline;
            }
            
            .contact-send-btn {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                margin-top: .2rem;
            }
            
            .contact-send-btn .arrow {
                display: inline-flex;
                width: 1.7rem;
                height: 1.7rem;
                border-radius: 50%;
                align-items: center;
                justify-content: center;
                background: #fff;
                color: var(--primary);
                line-height: 1;
            }
            
            @media (max-width: 768px) {
                .section {
                    padding: 3rem 0 1rem;
                }
                .inner-banner {
                    padding: 1rem 0;
                }
                .inner-banner .banner-pic .inner-banner-top,
                .inner-banner .banner-pic .inner-banner-bottom {
                    max-width: 200px;
                }
                .inner-banner .inner-banner-content {
                    margin-top: 3rem;
                    padding-right: 1rem;
                }
                .service-text {
                    padding: 1rem;
                }
                .service-shape {
                    max-width: 180px;
                }
                .core-services .hero-swiper img {
                    border-radius: 2rem;
                    border-bottom-right-radius: 0;
                    border-bottom-left-radius: 0;
                   height: 360px;
                }
                .core-services .hero-swiper .service-pic-shape img {
                    height: unset;
                }
                .image-curve {
  height: 360px;
  position: relative;
}
            }
            
            @media (max-width: 991px) {
                .contact-form-wrap {
                    flex-direction: column;
                }
                .contact-form-media,
                .contact-form-content {
                    width: 100%;
                }
                .contact-form-media {
                    min-height: 340px;
                    clip-path: none;
                }
                .contact-form-content {
                    padding: 2rem 1rem 2.4rem;
                }
                .contact-form-head .club-title {
                    font-size: 2rem;
                }
            }
