body{font-family: 'Gotham Book';}
.clb{clear:both;}
.padd-0{padding:0px !important;}
.top-10{ margin-top:10px;}
.top-15{ margin-top:15px;}
.top-20{ margin-top:20px;}
.top-30{ margin-top:30px;}
.bottom-10{margin-bottom:10px;}
.fl{float:left;}
.fr{float:right;}
.text-left{text-align:left!important;}
.text-center{text-align:center!important;}
.text-right{text-align:right!important;}
.pad-top-25{ padding-top:25px;}
.border-0{border:0px!important;}
.center-block{ margin:0 auto; float:none;}
.border-red{border:1px solid red;}
.border-blue{border:1px solid blue;}

/*===============================================*/
.navbar-light .navbar-nav .nav-link { color: rgba(255, 255, 255);}
.navbar-light .navbar-nav .nav-link:hover{color:#e79c23;}
.navbar-expand-lg .navbar-nav .nav-link { padding-right: 1rem;padding-left: 1rem;}
.navbar-bg{background-color:#000000!important;}


.navbar{padding-top:1rem;padding-bottom:1rem;}
.logo-container{/*width:56vw;*/}
/*.logo-container img{width:98px;}*/
.logo-txt{font-size: 20px;line-height: 16px;color:#4d4e4e; text-transform: uppercase;padding-left: 9px; font-weight: bold;font-style: normal;}


.carousel-indicators [data-bs-target] {flex: 0 1 auto; width: 10px; height: 10px; padding:0; margin-right: 3px; margin-left: 3px;text-indent: -999px;cursor: pointer;background-color: #fff;
	transition: opacity 0.6s ease;  border-radius: 90px;border-top: 0px solid transparent;  border-bottom: 0px solid transparent;}
	
	
.down-btn{background:#e79c23;border:1px solid #e79c23; color:#FFF!important; text-decoration:none;  padding:8px 15px;-webkit-border-radius: 10px;-moz-border-radius: 10px; border-radius: 10px;}
.down-btn:hover{background:#FFF; color:#e79c23!important;}
/*======================================*/
section{padding-top:3rem; padding-bottom:3rem;}

.section-a{background:#130f39; color:#FFF;}
.section-b{background:#FFF; color:#000;}
.section-c{background:#000; color:#FFF;}

.banner-section {padding:0px; margin-top:96px;}
.section-title{text-align:Center;}
.section-title h1{font-size:30px; font-family: 'Gotham Book';font-weight: normal;font-style: normal; color:#FFF;margin-bottom: 25px;}
.section-title h1 span, .section-title-c h2 span{ font-family: 'Gotham Book';font-weight: bold;font-style: normal;}
.section-text p{font-size:18px;color:#FFF; font-family: 'Nexa';font-weight: 300;font-style: normal; text-align:Center;}

.section-title-b{text-align:Center;}
.section-title-b h1{font-size:30px; font-family: 'Gotham Book';font-weight: normal;font-style: normal; color:#000;    margin-bottom: 25px;}
.section-title-b h1 span, .section-title-c h2 span{ font-family: 'Gotham Book';font-weight: bold;font-style: normal;}
.section-text-b p{font-size:18px;color:#000; font-family: 'Nexa';font-weight: 300;font-style: normal; text-align:Center;}


.section-title-c{text-align:Center;}
.section-title-c h1{font-size:30px; font-family: 'Gotham Book';font-weight: normal;font-style: normal; color:#e79f25; margin-bottom: 25px;}
.section-title-c h1 span, .section-title-c h2 span{ font-family: 'Gotham Book' ;font-weight: bold;font-style: normal;}
.section-text-c p{font-size:18px;color:#000; font-family: 'Nexa';font-weight: 300;font-style: normal; text-align:Center;}



.section-img-bg{background:url(../images/section-bg.webp);text-align: left;background-repeat:no-repeat;background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;background-size: cover;}
.section-logo{margin-bottom:15%;margin-top: 3%;}

.down-bro-floor a{background:#e79c23; color:#FFF; border:1px solid #e79c23; font-size:16px; font-weight:600; text-decoration:none; display:inline-block; margin-left:10px;margin-top:30px;  margin-right:10px;  padding:20px 33px; text-transform:uppercase; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.down-bro-floor a:hover{background:#FFF; color:#e79c23; border:1px solid #e79c23; text-decoration:none;}

.section-text-box ul li::marker {color: #4d4d4d;}
.section-text-box ul li{font-size:18px;color:#000; font-family: 'Nexa';font-weight: 300;font-style: normal; text-align:left;}
.section-text-box-border{border-right:1px solid #4d4d4d;}

.firstblock td{padding-right: 12px; font-size: 18px; text-align:left;color:#333333; font-family: 'Gotham Book';font-weight: normal;font-style: normal;}
.firstblock td span{font-size:18px;}
.key-distance h4{font-family: "Montserrat", sans-serif; font-weight: bold;font-style: normal; font-size:20px; color:#333333; margin-bottom:20px; text-align:left;}

.section-a-thank {background: #130f39;color: #FFF;margin-top: 6%; text-align:Center; padding-top: 9rem; padding-bottom: 23rem;}
.section-a-thank h1{font-size:25px; font-family: 'Gotham Book';font-weight: normal;font-style: normal; color:#FFF;margin-bottom: 25px;}
.section-a-thank h1 span{font-size:30px;color:#e79f25; font-family: 'Montserrat';font-weight: bold;font-style: normal;}
.section-a-thank a{background:#e79f25;border:1px solid #e79f25; font-size:22px;margin-top:25px; display: inline-block; color:#FFF; text-decoration:none; padding:8px 20px;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.section-a-thank a:hover{background:#130f39; color:#e79f25; border:1px solid #e79f25;}

/*======================*/

.about-text{text-align:Center;}
.about-text h1{font-size:35px;color:#000; margin-bottom:20px; text-transform:uppercase;text-align:center;}
.video-section{padding-top:4rem; padding-bottom:2rem;}
.video-section h1{font-size:35px;color:#000; margin-bottom:20px; text-transform:uppercase;text-align:center;}
.down-bro-floor{text-align:center;}
.section-gallery{padding-top:4rem;padding-bottom:4rem;}

/*=======form=========*/
.form-box-heading{margin-top:2%;}
.form-box-heading h1{font-size:42px; color:#FFF; font-family: 'Nexa'; font-weight: bold;font-style: normal;line-height: 45px;}
.form-box-heading h1 span{color:#e79f25;font-size:64px; font-family: 'Salty Feathers DEMO'; font-weight: normal; font-style: normal; padding-left:5px; padding-right:5px;}

.form-box-heading h2{font-size:68px; color:#e79f25; font-family: 'Niagara Solid';font-weight: normal; font-style: normal;}

.form-box-heading ul {list-style: none; padding-left: 4px;text-indent:-32px;margin-left: 30px;}    
.form-box-heading ul li::before {content: ''; background: url('../images/bullet-icon.png');width: 21px;height: 16px;display: inline-block;margin-right: 5px;z-index: 10;background-position: bottom;  vertical-align: middle;}
.form-box-heading ul li{font-size:18px; font-family:'Nexa'; font-weight:300; font-style: normal; margin-bottom:10px;}
	
input:focus {outline: none!important; background:transparent!important; color:#FFF!important;  border-color: #FFF!important;}
.form-title{text-align:center!important;}
.border-form{border: 1px solid #FFF;padding-bottom: 0px!important;}
.lable-text{color:#FFF;}
.form-group{text-align:left;}
.form-control {background:#130f39;border: 1px solid #FFF; color:#FFF; padding:15px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;}
.btn-dark {color: #fff;background-color: #42c1ee; border-color: #42c1ee;}
.tnc{color:#FFF; font-size:12px;}
.form-title h2{font-size:36px; color:#FFF;  font-family: 'Nexa';font-weight: 900;font-style: normal;}
.form-title h4{font-size:25px; color:#FFF; font-family: 'Nexa';font-weight: 900;font-style: normal;}
.btn-submit{background:#e79c23; color:#FFF;border:1px solid #e79c23; text-transform:uppercase;border-radius:0; padding:8px 40px}
.btn-submit:hover{background:#130f39; color:#e79c23; border:1px solid #e79c23;}

.cap-box-center{margin:0px auto;}
.capbox {width: 100%;max-width:308px;	background-color: #0e0b29;border-width: 2px 2px 2px 20px;	box-sizing: border-box;	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;	padding: 5px 5px;border-radius: 4px 4px 4px 4px; text-align:Center;}
.capbox-inner {font: bold 12px arial, sans-serif;color: #000000;background-color: #E3E3E3;margin: 8px auto 0px auto;padding: 5px 10px 5px 10px;	border-radius: 4px;}
#CaptchaDiv {font: normal 25px Impact, Charcoal, arial, sans-serif;font-style: italic;color: #000000;background-color: #FFFFFF;	user-select: none;padding: 4px;	border-radius: 4px;}
#CaptchaInput { /*border: #38B000 2px solid;*/ margin: 3px 0px 1px 0px; height:30px;  }


#CaptchaDiva {font: normal 25px Impact, Charcoal, arial, sans-serif;font-style: italic;color: #000000;background-color: #FFFFFF;	user-select: none;padding: 4px;	border-radius: 4px;}
#CaptchaDivb{font: normal 25px Impact, Charcoal, arial, sans-serif;font-style: italic;color: #000000;background-color: #FFFFFF;	user-select: none;padding: 4px;	border-radius: 4px;}

#CaptchaInputc { /*border: #38B000 2px solid;*/ margin: 3px 0px 1px 0px; height:30px;  }
#CaptchaDivc{font: normal 25px Impact, Charcoal, arial, sans-serif;font-style: italic;color: #000000;background-color: #FFFFFF;	user-select: none;padding: 4px;	border-radius: 4px;}




.footer{background:#000; color:#FFF; padding-top:3rem; padding-bottom:3rem;}
.footer-logo{padding-top:16%;}
.footer-logo img{height:90px;}
.footer-data{text-align:center;}
.footer-data h4{font-size:22px; color:#FFF; margin-bottom:10px;font-family: 'Nexa'; font-weight: bold; font-style: normal;}
.footer-data h5{font-size:16px; color:#FFF; line-height:26px; text-align:Center;font-family: 'Nexa'; font-weight: 300; font-style: normal;}
.footer-data h5 span{color:#FFF; font-weight:600; font-size:17px;}
.footer-data-inner{padding-top:10px;padding-bottom:10px;text-align:center;font-weight: 300;font-style: normal; font-size:16px; color:#FFF;}
.footer-data-inner a{color:#FFF; text-decoration:none; }
.footer-data-inner-2{text-align:Center;font-size:12px; color:#FFF;padding-top: 17px;}
.footer-data-inner-2 a{color:#FFF; text-decoration:none;}
.social-icon {text-align:center;}
.social-icon img{width:40px; margin-right:15px;}
.tel-mail-icon{text-align:center;}
.tel-mail-icon img{width:50px; margin-right:10px;}
.footer-box-line{ border-left:1px solid #FFF; border-right:1px solid #FFF;}
.footer-box{padding: 15px 30px;}

.gmap-btn{margin-top:-135px;    height: 58px;}


.tel-mail-container{margin-top:5rem;}

.tel-mail-footer span{background: #FFF;padding:2px 4px 4px 5px;margin-top: 1px; color: #000; border-radius: 90px;width: 25px; height: 25px;display: inline-block; text-align: center;}
.tel-mail-footer a{color:#FFF; text-decoration:none; font-size:16px;font-family: 'Montserrat';font-weight: normal;font-style: normal;}
.tel-mail-footer a:hover{color:#e79f25;}
.discl{font-size:17px; color:#a6a6a6;font-family: 'Nexa'; font-weight: 300; font-style: normal; text-align:Center;}

.modal-dialog-2 {max-width: 700px;}
/*===============Owl====================== */
.amtext {font-weight: 600;}
.owl-carousel .owl-item {transition: all 0.3s ease-in-out;    display: flex;    justify-content: center;    align-items: center;}
.owl-carousel .owl-item .card {	padding: 0px;position: relative;}
.owl-carousel .owl-stage-outer {overflow-y: auto !important;padding-bottom: 10px;}
#amenitiesOwl .owl-item img {height: 450px;	width: 700px;object-fit: cover;	border-radius: 6px;}
.owl-carousel .owl-item .card .name {position: absolute;bottom: -20px;left: 33%;color: #101c81;	font-size: 1.1rem;font-weight: 600;background-color: aquamarine;padding: 0.3rem 0.4rem;border-radius: 5px;box-shadow: 2px 3px 15px #3c405a;}
.owl-carousel .owl-item .card {opacity: 0.2;transform: scale3d(0.8, 0.8, 0.8);transition: all 0.3s ease-in-out;}
.owl-carousel .owl-item.active.center .card {opacity: 1;transform: scale3d(1, 1, 1);}
.owl-carousel .owl-dots {display: inline-block;	width: 100%;text-align: center;}
.owl-theme .owl-dots .owl-dot span {height: 20px;background: #2a6ba3 !important;border-radius: 2px !important;opacity: 0.0;}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {height: 13px;	width: 13px;opacity: 1;	transform: translateY(2px);	background: #83b8e7 !important;	opacity: 0.0;}

		/*.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next {color: #FFF !important;}
	  */

.owl-carousel {	position: relative;}
.owl-next,
.owl-prev {	position: absolute;	top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);}
.owl-next {right: 0;display: flex;}
.owl-prev {left: 0;	display: flex;}
.carousel_se_041_carousel .owl-next {right: -42px !important;display: flex;	margin-top: -20px !important;}
.carousel_se_041_carousel .owl-prev {left: -42px !important;display: flex;	margin-top: -20px !important;}

@media(min-width: 480.6px) and (max-width: 575.5px) {
	.owl-carousel .owl-item .card .name {
				left: 24%;
	}
}

@media(max-width: 360px) {
	.owl-carousel .owl-item .card .name {
				left: 30%;
	}
}

.owl-theme .owl-nav [class*="owl-"] {
	background: none !important;
}


/*===============End Owl====================== */


.tc{ font-size:10px; text-align:center; font-weight:300}


.visi-desk{display:block;}
.visi-mob{display:none;}


/*============================================*/

@media (max-width:441px){ 
.visi-desk{display:none!important;}
.visi-mob{display:block!important;}
.logo{width: 130px;}
.banner-section {margin-top:83px;}
.navbar-light .navbar-toggler {border:0px; color:#e79f25;font-size: 30px;}
.section-title h1 {font-size: 22px;font-weight: 700;}
.section-text p {font-size: 18px; line-height: 30px;}
.down-bro-floor a {padding: 12px 25px;width: 67%;}
.form-title h2 {font-size: 26px;}
.form-title h4 {font-size: 19px;}
.form-box-heading h1 {font-size: 25px;}
.form-box-heading h1 span {font-size: 43px;}
.form-box-heading h2 {font-size: 45px;letter-spacing: 1.5px;}
.form-box-heading ul li { font-size: 18px;}
.section-title-b h1 {font-size: 24px;}
.section-text-box ul li {font-size: 18px;}
.section-text-box ul{margin-bottom:0px;}
.section-title-c h1 {font-size: 22px;}
.gmap-btn {margin-top: -135px; height: 54px;}
.discl {font-size: 16px;}
.section-a-thank h1 {font-size: 18px;}
.section-a-thank h1 span {font-size: 28px;}
.section-a-thank a {font-size: 18px;}
.footer-logo {padding-top: 0%; text-align: center;}
.tel-mail-container{margin-top:0rem;}

}

        .floor-plan-section .container {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
            box-sizing: border-box;
            text-align: center;
            text-transform: uppercase;
        }

        .floor-plan-section .floor-plans {
            display: flex;
            justify-content: center;
            gap: 30px;
            flex-wrap: wrap;
        }

        .floor-plan-section .floor-plan {
            background-color: #2d2a52;
            padding: 40px;
            border-radius: 10px;
            text-align: center;
            width: 503px;
            box-sizing: border-box;
            transition: all 0.3s ease;
        }

        .floor-plan-section .floor-plan:hover {
            background-color: #3e3b71;
            transform: scale(1.05);
        }

        .floor-plan-section h2 {
            color: #fff;
            font-size: 2rem;
            margin-bottom: 32px;
        }

        .floor-plan-section .floor-plan p {
            font-size: 1.25rem;
            margin-bottom: 20px;
        }

        .floor-plan-section .download-button {
            background-color: #e79f25;
            color: #130f39;
            padding: 10px 20px;
            font-size: 1rem;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            text-decoration: none;
        }

        .floor-plan-section .download-button:hover {
            background-color: #d38c1b;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .floor-plan-section .floor-plans {
                flex-direction: column;
                align-items: center;
            }

            .floor-plan-section .floor-plan {
                width: 90%;
                margin-bottom: 20px;
            }
        }

        @media (max-width: 480px) {
            .floor-plan-section .floor-plan {
                width: 100%;
            }

            .floor-plan-section .download-button {
                font-size: 0.9rem;
            }
        }
        
        .map-bg-section {
            /*background-image: url('../images/map_bg_img.jpg');
            background-blend-mode: lighten;
            background-position: left;
            background-repeat: repeat-x;*/
            text-transform: uppercase;
            background-color: white;
        }
        
        .map-bg-section img{
            width: 100%;
            height: auto;
        }
        
        .location-section {
            display: flex;
            flex-wrap: wrap;
            padding: 20px;
        }

        .location-section .left-side {
            flex: 1;
            padding: 20px;
            background-image: url('file-NWcjx82TZURLCt67kSNAEP'); /* Placeholder for the background image */
            background-size: cover;
            background-position: center;
            color: #000;
            text-align: center;
            height: 70vh;
        }
        .location-section p {
                font-size: 16px;
    font-weight: 500;
    line-height: 32px;
    text-align: justify;
        }

        .location-section .right-side {
            flex: 1;
            /*background-color: #130f39;*/
            padding: 20px;
            color: #fff;
            box-sizing: border-box;
            height: 70vh;
            overflow-y: auto;
        }

        .location-section h2 {
            color: #e79f25;
            font-size: 2rem;
            margin-bottom: 20px;
        }

        .location-section .accordion {
            background-color: #fff;
            color: #130f39;
            cursor: pointer;
            padding: 18px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 1.2rem;
            margin: 5px 0 0;
            transition: 0.4s;
        }

        .location-section .accordion:after {
            content: '+';
            color: #e79f25;
            font-weight: bold;
            float: right;
        }

        .location-section .active:after {
            content: '-';
        }

        .location-section .panel {
            padding: 0 18px 5px;
            display: none;
            background-color: #fff;
            color: #130f39;
            margin: 0 0 5px;
        }

        .location-section .panel p {
            margin: 10px 0;
        }

        /* Responsive styles */
        @media screen and (max-width: 768px) {
            .location-section {
                flex-direction: column;
            }

            .location-section .left-side {
                height: auto;
            }

            .location-section .right-side {
                height: auto;
            }
        }
        
        
/* Overlay Styles */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1111;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Popup Container */
.popup-container {
    background: linear-gradient(135deg, #2c2c54 0%, #1e1e3f 100%);
    border: 2px solid #4a4a8a;
    border-radius: 8px;
    padding: 16px 24px;
    max-width: 500px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    transform: scale(0.8);
    transition: transform 0.3s ease;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.overlay.active .popup-container {
    transform: scale(1);
}

/* Close Button */
.close-btn {
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 28px;
    cursor: pointer;
    line-height: 1;
    padding: 5px;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.close-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: rotate(90deg);
}

/* Form Content */
.form-content {
    color: #ffffff;
}

.form-title {
    font-size: 24px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 30px;
    color: #ffffff;
    letter-spacing: 0.5px;
}

/* Form Styles */
.contact-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-group {
    display: flex;
    flex-direction: column;
}

.form-label {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #ffffff;
    letter-spacing: 0.3px;
}

.form-input {
    background: transparent;
    border: none;
    border-bottom: 2px solid #6a6a9a;
    padding: 4px 0;
    font-size: 16px;
    color: #ffffff;
    outline: none;
    transition: border-color 0.3s ease;
}

.form-input:focus {
    border-bottom-color: #ffffff;
}

.form-input::placeholder {
    color: #8a8ab0;
}

/* Captcha Section */
.captcha-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 8px 0;
}

.captcha-display {
    background-color: #e8e8e8;
    border-radius: 4px;
    padding: 12px;
    text-align: center;
    align-self: center;
    min-width: 150px;
}

.captcha-code {
    font-size: 24px;
    font-weight: bold;
    color: #333333;
    font-family: 'Courier New', monospace;
    letter-spacing: 3px;
}

.captcha-input-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.captcha-label {
    font-size: 13px;
    color: #ffffff;
    text-align: center;
    font-weight: 400;
}

.captcha-input {
    background: transparent;
    border: 2px solid #6a6a9a;
    border-radius: 4px;
    padding: 10px 15px;
    font-size: 16px;
    color: #ffffff;
    outline: none;
    text-align: center;
    width: 120px;
    transition: border-color 0.3s ease;
}

.captcha-input:focus {
    border-color: #ffffff;
}

/* Submit Button */
.submit-btn {
    background: linear-gradient(135deg, #ff8c42 0%, #e67e22 100%);
    border: none;
    border-radius: 6px;
    padding: 16px;
    font-size: 12px;
    font-weight: 600;
    color: #ffffff;
    cursor: pointer;
    margin: 12px auto 0;
    display: block;
    min-width: 150px;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(255, 140, 66, 0.3);
}

.submit-btn:hover {
    background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 140, 66, 0.4);
}

.submit-btn:active {
    transform: translateY(0);
}

/* Privacy Notice */
.privacy-notice {
    text-align: center;
    margin-top: 0px;
    font-size: 12px;
    color: #b8b8d4;
    line-height: 1.4;
}

.privacy-notice p {
    margin: 3px 0;
}

/* Demo Section */
.demo-section {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 999;
}

.demo-btn {
    background: linear-gradient(135deg, #2c2c54 0%, #1e1e3f 100%);
    border: 2px solid #4a4a8a;
    border-radius: 8px;
    padding: 15px 25px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(44, 44, 84, 0.3);
}

.demo-btn:hover {
    background: linear-gradient(135deg, #3a3a6b 0%, #252550 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(44, 44, 84, 0.4);
}

/* Responsive Design */
@media (max-width: 768px) {
    .popup-container {
        padding: 30px 25px;
        width: 95%;
        margin: 20px;
    }
    
    .form-title {
        font-size: 24px;
        margin-bottom: 25px;
    }
    
    .form-input {
        font-size: 16px;
        padding: 10px 0;
    }
    
    .captcha-display {
        min-width: 130px;
        padding: 12px;
    }
    
    .captcha-code {
        font-size: 20px;
        letter-spacing: 2px;
    }
    
    .submit-btn {
        padding: 12px 25px;
        font-size: 15px;
        min-width: 130px;
    }
    
    .demo-btn {
        padding: 12px 20px;
        font-size: 14px;
    }
    
    .demo-section {
        bottom: 20px;
        right: 20px;
    }
}

@media (max-width: 480px) {
    .popup-container {
        padding: 25px 20px;
        width: 98%;
        margin: 10px;
    }
    
    .form-title {
        font-size: 22px;
        margin-bottom: 20px;
    }
    
    .contact-form {
        gap: 18px;
    }
    
    .form-label {
        font-size: 13px;
    }
    
    .form-input {
        font-size: 15px;
        padding: 8px 0;
    }
    
    .captcha-display {
        min-width: 120px;
        padding: 10px;
    }
    
    .captcha-code {
        font-size: 18px;
        letter-spacing: 1px;
    }
    
    .captcha-input {
        width: 100px;
        padding: 8px 12px;
        font-size: 15px;
    }
    
    .captcha-label {
        font-size: 12px;
    }
    
    .submit-btn {
        padding: 10px 20px;
        font-size: 14px;
        min-width: 120px;
    }
    
    .privacy-notice {
        font-size: 11px;
        margin-top: 20px;
    }
}

/* Animation for form validation */
.form-input.error {
    border-bottom-color: #e74c3c;
    animation: shake 0.5s ease-in-out;
}

.captcha-input.error {
    border-color: #e74c3c;
    animation: shake 0.5s ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

/* Loading state for submit button */
.submit-btn.loading {
    opacity: 0.7;
    cursor: not-allowed;
    pointer-events: none;
}

.submit-btn.loading::after {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
    margin-left: 10px;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.line-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 600px; /* Optional: constrain max width */
  margin: 2rem auto;
}

.line {
  flex: 1;
  height: 2px;
  background-color: white;
}

.dot {
  width: 1em;
  height: 1em;
  background-color: white;
  border-radius: 50%;
}

.amount-class {
    font-size: 40px;
}