.elementor-6 .elementor-element.elementor-element-82990ee{width:100%;max-width:100%;}body.elementor-page-6:not(.elementor-motion-effects-element-type-background), body.elementor-page-6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1D3557;}/* Start custom CSS for html, class: .elementor-element-82990ee */.mainheader{
    height:78px;
}


/*=========================================
PARADISE HEADER
=========================================*/

.paradise-header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:9999;

    transition:
    background .45s ease,
    backdrop-filter .45s ease,
    height .45s ease,
    box-shadow .45s ease;

}

.paradise-header.scrolled{

    background:rgba(7,17,28,.72);

    backdrop-filter:blur(22px);

    -webkit-backdrop-filter:blur(22px);

    border-bottom:1px solid rgba(255,255,255,.08);

    box-shadow:0 10px 40px rgba(0,0,0,.25);

}

.paradise-header__wrapper{

    max-width:1600px;

    height:96px;

    margin:auto;

    padding:0 40px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    transition:.4s ease;

}

.paradise-header.scrolled .paradise-header__wrapper{

    height:78px;

}

/*=========================================
LOGO AREA
=========================================*/

.paradise-header__branding{

    display:flex;

    align-items:center;

    gap:10px;

    flex-shrink:0;

}

.clickbells-logo img{

    height:70px;

    width:auto;

    display:block;

    transition:.35s ease;

}

.paradise-logo img{

    height:70px;

    width:auto;

    display:block;

    transition:.35s ease;

}

.paradise-header.scrolled .clickbells-logo img{

    height:36px;

}

.paradise-header.scrolled .paradise-logo img{

    height:48px;

}

/*=========================================
PRESENTS
=========================================*/

.branding-divider{

    display:flex;

    align-items:center;

    justify-content:center;

    position:relative;

}

.branding-divider span{

    color:var(--gold);

    font-size:4px;

    font-weight:600;

    letter-spacing:4px;

    text-transform:uppercase;

    white-space:nowrap;

    opacity:.9;

}

.branding-divider::before{

    content:"";

    position:absolute;

    top:-18px;

    width:1px;

    height:14px;

    background:rgba(212,175,55,.45);

}

.branding-divider::after{

    content:"";

    position:absolute;

    bottom:-18px;

    width:1px;

    height:14px;

    background:rgba(212,175,55,.45);

}

/*=========================================
NAVIGATION
=========================================*/

.paradise-nav{

    flex:1;

    display:flex;

    justify-content:center;

}

.paradise-nav ul{

    display:flex;

    align-items:center;

    gap:34px;

    list-style:none;

}

.paradise-nav li{

    position:relative;

}

.paradise-nav a{

    position:relative;

    color:var(--white);

    text-decoration:none;

    font-size:10px;

    font-weight:500;

    letter-spacing:1.2px;

    text-transform:uppercase;

    transition:
    color .35s ease,
    opacity .35s ease;

}

/*=========================================
PREMIUM DOT HOVER
=========================================*/

.paradise-nav a::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:-12px;

    width:6px;

    height:6px;

    background:var(--gold);

    border-radius:50%;

    transform:
    translateX(-50%)
    scale(0);

    opacity:0;

    transition:.35s ease;

}

.paradise-nav a:hover{

    color:var(--gold-light);

}

.paradise-nav a:hover::after{

    opacity:1;

    transform:
    translateX(-50%)
    scale(1);

}

/*=========================================
ACTIVE MENU
=========================================*/

.paradise-nav a.active{

    color:var(--gold);

}

.paradise-nav a.active::after{

    opacity:1;

    transform:
    translateX(-50%)
    scale(1);

}

/*=========================================
HEADER CTA
=========================================*/

.paradise-header__cta{

    display:flex;

    align-items:center;

    justify-content:flex-end;

    flex-shrink:0;

    margin-left:40px;

}

.site-visit-btn{

    position:relative;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:14px;

    padding:16px 28px;

    border:1px solid rgba(212,175,55,.55);

    border-radius:100px;

    overflow:hidden;

    color:var(--white);

    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:1.5px;

    font-size:13px;

    font-weight:600;

    background:rgba(255,255,255,.04);

    backdrop-filter:blur(12px);

    -webkit-backdrop-filter:blur(12px);

    transition:
    transform .35s ease,
    background .35s ease,
    color .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;

}

.site-visit-btn span{

    position:relative;

    z-index:2;

}

.site-visit-btn svg{

    position:relative;

    z-index:2;

    transition:.35s ease;

}

/* Gold Fill */

.site-visit-btn::before{

    content:"";

    position:absolute;

    inset:0;

    width:0;

    background:linear-gradient(
    90deg,
    #C89C3D,
    #E8C975
    );

    transition:.45s ease;

    z-index:1;

}

.site-visit-btn:hover{

    color:#07111C;

    border-color:#E8C975;

    transform:translateY(-3px);

    box-shadow:

    0 10px 30px rgba(212,175,55,.25),

    0 0 20px rgba(212,175,55,.15);

}

.site-visit-btn:hover::before{

    width:100%;

}

.site-visit-btn:hover svg{

    transform:translateX(6px);

}

/*=========================================
MOBILE TOGGLE
=========================================*/

.mobile-toggle{

    width:54px;

    height:54px;

    display:none;

    border:none;

    background:none;

    cursor:pointer;

    position:relative;

    z-index:10010;

}

.mobile-toggle span{

    position:absolute;

    left:12px;

    width:30px;

    height:2px;

    border-radius:10px;

    background:var(--white);

    transition:.35s ease;

}

.mobile-toggle span:nth-child(1){

    top:18px;

}

.mobile-toggle span:nth-child(2){

    top:26px;

}

.mobile-toggle span:nth-child(3){

    top:34px;

}

/* ACTIVE */

.mobile-toggle.active span:nth-child(1){

    top:26px;

    transform:rotate(45deg);

}

.mobile-toggle.active span:nth-child(2){

    opacity:0;

}

.mobile-toggle.active span:nth-child(3){

    top:26px;

    transform:rotate(-45deg);

}

/*=========================================
MOBILE MENU
=========================================*/

.mobile-menu{

    position:fixed;

    top:0;

    right:-420px;

    width:380px;

    max-width:100%;

    height:100vh;

    background:rgba(7,17,28,.92);

    backdrop-filter:blur(25px);

    -webkit-backdrop-filter:blur(25px);

    border-left:1px solid rgba(255,255,255,.08);

    transition:right .55s cubic-bezier(.19,1,.22,1);

    z-index:10000;

}

.mobile-menu.active{

    right:0;

}

.mobile-menu__inner{

    padding:120px 40px;

    display:flex;

    flex-direction:column;

    height:100%;

}

.mobile-logo{

    margin-bottom:50px;

}

.mobile-logo img{

    height:64px;

    width:auto;

}

/*=========================================
MOBILE NAV
=========================================*/

.mobile-menu nav{

    display:flex;

    flex-direction:column;

    gap:26px;

}

.mobile-menu nav a{

    position:relative;

    font-size:18px;

    font-weight:500;

    text-decoration:none;

    color:var(--white);

    letter-spacing:2px;

    text-transform:uppercase;

    transition:.35s ease;

}

.mobile-menu nav a:hover{

    color:var(--gold);

    padding-left:12px;

}

/*=========================================
MOBILE CTA
=========================================*/

.mobile-cta{

    margin-top:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:18px;

    border-radius:100px;

    background:linear-gradient(
    90deg,
    #C89C3D,
    #E8C975
    );

    color:#07111C;

    text-decoration:none;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    transition:.35s ease;

}

.mobile-cta:hover{

    transform:translateY(-3px);

}

/*=========================================
OVERLAY
=========================================*/

.menu-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.45);

    opacity:0;

    visibility:hidden;

    transition:.35s ease;

    z-index:9998;

}

.menu-overlay.active{

    opacity:1;

    visibility:visible;

}

/*=========================================
SCROLL HEADER
=========================================*/

.paradise-header.scrolled .paradise-nav ul{

    gap:30px;

}

.paradise-header.scrolled .site-visit-btn{

    padding:14px 24px;

}

.paradise-header.scrolled .branding-divider span{

    font-size:9px;

    letter-spacing:3px;

}

/*=========================================
HEADER LIGHT SWEEP
=========================================*/

.paradise-header::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(
    120deg,
    transparent 35%,
    rgba(255,255,255,.05) 48%,
    rgba(212,175,55,.08) 50%,
    rgba(255,255,255,.05) 52%,
    transparent 65%
    );

    transform:translateX(-130%);

    pointer-events:none;

}

.paradise-header.scrolled::before{

    animation:headerSweep 8s linear infinite;

}

@keyframes headerSweep{

    0%{

        transform:translateX(-130%);

    }

    100%{

        transform:translateX(130%);

    }

}

/*=========================================
FOCUS STATES
=========================================*/

.paradise-nav a:focus,

.site-visit-btn:focus,

.mobile-menu nav a:focus,

.mobile-cta:focus{

    outline:2px solid var(--gold);

    outline-offset:4px;

}

/*=========================================
RESPONSIVE
=========================================*/

@media(max-width:1400px){

.paradise-nav ul{

    gap:24px;

}

.site-visit-btn{

    padding:15px 22px;

    font-size:12px;

}

}

/*=========================*/

@media(max-width:1200px){

.paradise-nav{

    display:none;

}

.paradise-header__cta{

    display:none;

}

.mobile-toggle{

    display:block;

}

.paradise-header__wrapper{

    height:84px;

    padding:0 28px;

}

.clickbells-logo img{

    height:98px;

}

.paradise-logo img{

    height:90px;

}

.branding-divider{

    display:none;

}

}

/*=========================*/

@media(max-width:992px){

.paradise-header__wrapper{

    padding:0 24px;

}

.mobile-menu{

    width:360px;

}

}

/*=========================*/

@media(max-width:768px){

.paradise-header__wrapper{

    height:76px;

    padding:0 20px;

}

.clickbells-logo img{

    height:90px;

}

.paradise-logo img{

    height:92px;

}

.mobile-menu{

    width:100%;

}

.mobile-menu__inner{

    padding:

    110px

    28px

    40px;

}

.mobile-menu nav{

    gap:20px;

}

.mobile-menu nav a{

    font-size:17px;

}

.mobile-cta{

    margin-top:50px;

}

}

/*=========================*/

@media(max-width:576px){

.paradise-header__branding{

    gap:14px;

}

.clickbells-logo img{

    height:46px;
    Padding-right:12px;
border-right: 1px solid #d4af37;
}

.paradise-logo img{

    height:66px;

}

.mobile-toggle{

    width:46px;

    height:46px;

}

.mobile-toggle span{

    left:10px;

    width:26px;

}

.mobile-menu nav a{

    font-size:16px;

}

.mobile-cta{

    padding:16px;

    font-size:13px;

}

}

/*=========================================
SMOOTH ACTIVE LINK
=========================================*/

.paradise-nav a{

    overflow:hidden;

}

.paradise-nav a::before{

    content:"";

    position:absolute;

    left:0;

    bottom:-16px;

    width:100%;

    height:1px;

    background:

    linear-gradient(

    90deg,

    transparent,

    rgba(212,175,55,.8),

    transparent

    );

    transform:scaleX(0);

    transform-origin:center;

    transition:.35s ease;

}

.paradise-nav a:hover::before,

.paradise-nav a.active::before{

    transform:scaleX(1);

}

/*=========================================
REDUCED MOTION
=========================================*/

@media(prefers-reduced-motion:reduce){

*{

animation:none!important;

transition:none!important;

scroll-behavior:auto!important;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-556c24e */.overflowhidden{
    overflow: hidden;
}

.hero-video{

    position:relative;

    width:auto;

    height:auto;

    overflow:hidden;

    background:#000;

}

.hero-video video{

    width:100%;

    height:100%;

    object-fit:cover;

}

.video-audio-btn{

    position:absolute;

    right:30px;

    bottom:30px;

    width:52px;

    height:52px;

    border:none;

    border-radius:50%;

    background:rgba(0,0,0,.45);

    backdrop-filter:blur(12px);

    color:#fff;

    cursor:pointer;

    display:flex;

    align-items:center;

    justify-content:center;

    transition:.3s ease;

}

.video-audio-btn:hover{

    background:rgba(212,175,55,.9);

    color:#07111C;

}

@media(max-width:768px){

.video-audio-btn{

    width:46px;

    height:46px;

    right:20px;

    bottom:20px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-150706f *//*=============================
PARADISE HIGHLIGHTS
=============================*/

.paradise-highlights{

    width:100%;

    display:grid;

    grid-template-columns:repeat(2,1fr);

    border-top:1px solid rgba(255,255,255,.08);

    border-left:1px solid rgba(255,255,255,.08);

    background:#ffffff00;

}

.highlight-item{

    display:flex;

    align-items:center;

    gap:18px;

    padding:0px;

    border-right:1px solid rgba(255,255,255,.08);

    border-bottom:1px solid rgba(255,255,255,.08);

    transition:.35s ease;

}

.highlight-item:hover{

    background:rgba(212,175,55,.05);

}

.icon{

    width:54px;

    height:54px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;
    color: #ffffff80;

}

.icon img{

    width:34px;

    height:34px;

    object-fit:contain;

    filter:brightness(0) saturate(100%) invert(75%) sepia(39%) saturate(596%) hue-rotate(8deg) brightness(98%) contrast(91%);

}

.content h4{

    margin:0;

    color:#D4AF37;

    font-size:18px;

    font-weight:600;

    line-height:1.3;

}

.content p{

    margin:4px 0 0;

    color:#fff;

    font-size:12px;

    line-height:1.5;

}

/*=============================
TABLET
=============================*/

@media(max-width:991px){

.highlight-item{

    padding:24px;

}

.content h4{

    font-size:20px;

}

.content p{

    font-size:12px;

}

}

/*=============================
MOBILE
=============================*/

@media(max-width:768px){

.paradise-highlights{

    grid-template-columns2:1fr;

}

.highlight-item{

    padding:5px;

    gap:10px;

}

.icon{

    width:26px;

    height:26px;

}

.icon img{

    width:28px;

    height:28px;

}

.content h4{

    font-size:14px;

}

.content p{

    font-size:12px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7bc2d28 *//*=========================================
MOBILE (768px)
=========================================*/

@media (max-width:768px){

.masterplan-section{

    position:relative;

    padding:70px 20px;

    overflow:hidden;

}

.masterplan-container{

    display:flex;

    flex-direction:column;

    gap:45px;

}

/* Image First */

.masterplan-image{

    order:-1;

    position:relative;

    width:100%;

    border-radius:24px;

    overflow:hidden;

}

.masterplan-image img{

    width:100%;

    display:block;

    border-radius:24px;

}

/* Content */

.masterplan-content{

    width:100%;

    text-align:left;

}

.section-tag{

    display:inline-block;

    font-size:12px;

    letter-spacing:4px;

    margin-bottom:18px;

}

.masterplan-content h2{

    font-size:38px;

    line-height:1.1;

    margin-bottom:20px;

}

.masterplan-content p{

    font-size:16px;

    line-height:1.8;

    margin-bottom:20px;

}

/* Features */

.masterplan-features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:16px;

    margin-top:35px;

}

.feature{

    padding:20px;

    border-radius:18px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    backdrop-filter:blur(12px);

}

.feature-number{

    font-size:28px;

    margin-bottom:8px;

}

.feature-text{

    font-size:14px;

    line-height:1.5;

}

/* Button */

.masterplan-btn{

    width:100%;

    margin-top:35px;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:18px;

    border-radius:100px;

    font-size:14px;

}

/* Floating Labels */

.label{

    padding:8px 14px;

    font-size:12px;

    border-radius:100px;

}

/* Label Positions */

.clubhouse{

    top:18%;

    left:58%;

}

.residential{

    top:42%;

    left:18%;

}

.commercial{

    top:65%;

    left:52%;

}

.greens{

    top:78%;

    left:22%;

}

.lake{

    top:30%;

    right:10%;

}

}/* End custom CSS */
/* Start custom CSS */:root{
  --primary:#07111C;
  --secondary:#0D1726;
  --gold:#D4AF37;
  --gold-light:#F2D17A;
  --white:#FFFFFF;
  --gray:#BFC7D1;

  --radius:24px;

  --transition:.35s ease;

  --container:1600px;

  --section-padding:140px;
}
.hero {
    background:

    linear-gradient(
        90deg,
        rgba(7,17,28,.90) 0%,
        rgba(7,17,28,.72) 28%,
        rgba(7,17,28,.40) 55%,
        rgba(7,17,28,.15) 100%
    ),

    linear-gradient(
        180deg,
        rgba(7,17,28,.15),
        rgba(7,17,28,.55)
    );
}/* End custom CSS */