/* NAVBAR */

.ux-nav-wrapper{
position:fixed;
top:0;
width:100%;
z-index:999;

padding:0px 40px;

display:flex;
align-items:center;
justify-content:space-between;

background:rgba(255,255,255,0.05);
backdrop-filter:blur(12px);

border-bottom:1px solid rgba(255,255,255,0.08);

transition:0.4s;
}

.ux-nav-wrapper.ux-nav-scrolled{
background:#020617;
box-shadow:0 10px 30px rgba(0,0,0,0.6);
}


/* LOGO */

.ux-nav-logo{
font-size:26px;
font-weight:700;
color:#fff;
text-decoration:none;
letter-spacing:1px;
}


/* MENU */

.ux-nav-menu{
display:flex;
gap:40px;
}

.ux-nav-menu a{
color:#fff;
font-weight:500;
text-decoration:none;
position:relative;
padding:6px 0;
}


/* ACTIVE INDICATOR */

.ux-nav-menu a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;

width:0%;
height:3px;

background:linear-gradient(90deg,#2563eb,#06b6d4);

transition:0.4s;
border-radius:10px;
}

.ux-nav-menu a:hover::after{
width:100%;
}

.ux-nav-menu a.ux-nav-active::after{
width:100%;
}


/* AUTH BUTTONS */

.ux-nav-auth{
display:flex;
align-items:center;
gap:15px;
}

.ux-nav-auth a{

display:flex;
align-items:center;
gap:8px;

padding:10px 22px;

border-radius:50px;

text-decoration:none;
font-weight:500;

color:#fff;

background:linear-gradient(90deg,#2563eb,#06b6d4);

transition:0.3s;
}

.ux-nav-auth a:hover{

transform:translateY(-3px);
box-shadow:0 10px 25px rgba(0,0,0,0.5);

}


/* ICON ANIMATION */

.ux-nav-auth i{
animation:ux-nav-iconmove 1.4s infinite;
}

@keyframes ux-nav-iconmove{

0%{transform:translateY(0)}
50%{transform:translateY(-5px)}
100%{transform:translateY(0)}

}


/* HAMBURGER */

.ux-nav-toggle{

width:40px;
height:30px;

display:none;
flex-direction:column;
justify-content:space-between;

background:none;
border:none;
cursor:pointer;
}

.ux-nav-toggle span{

height:3px;
width:100%;

background:#fff;

border-radius:10px;

transition:0.3s;

}


/* MOBILE MENU */

.ux-nav-mobile{

position:fixed;
top:0;
right:-100%;

width:300px;
height:100%;

background:#020617;

padding:40px 30px;

transition:0.4s;

z-index:1000;

box-shadow:-10px 0 40px rgba(0,0,0,0.7);

}

.ux-nav-mobile.ux-nav-open{
right:0;
}

.ux-nav-mobile a{

display:block;

color:#fff;

padding:14px 0;

text-decoration:none;

border-bottom:1px solid rgba(255,255,255,0.08);

}


/* MOBILE AUTH */

.ux-nav-mobile-auth{

margin-top:30px;

display:flex;
flex-direction:column;
gap:12px;

}

.ux-nav-mobile-auth a{

display:flex;
align-items:center;
justify-content:center;
gap:8px;

padding:12px;

border-radius:50px;

text-decoration:none;
font-weight:500;

color:#fff;

background:linear-gradient(90deg,#2563eb,#06b6d4);

}


/* CLOSE */

.ux-nav-close{

position:absolute;
top:20px;
right:20px;

font-size:26px;
color:#fff;
cursor:pointer;

}


/* OVERLAY */

.ux-nav-overlay{

position:fixed;
top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,0.6);

opacity:0;
visibility:hidden;

transition:0.3s;

z-index:998;

}

.ux-nav-overlay.ux-nav-active{
opacity:1;
visibility:visible;
}


/* RESPONSIVE */

@media(max-width:991px){

.ux-nav-menu{
display:none;
}

.ux-nav-auth{
display:none;
}

.ux-nav-toggle{
display:flex;
}

}
/*--About Us Section--*/
/* SECTION */

.call-to-action{
padding:100px 0;
background:#0f172a;
color:#fff;
}


/* ROW ALIGNMENT */

.call-to-action .row{
display:flex;
align-items:center;
}


/* CONTENT */

.call-to-action h2{
font-size:38px;
font-weight:700;
margin-bottom:20px;
}

.call-to-action p{
color:#cbd5e1;
font-size:16px;
line-height:1.7;
margin-bottom:30px;
}


/* BUTTONS */

.cta-buttons{
display:flex;
gap:15px;
}

.cta-buttons a{
padding:12px 28px;
text-decoration:none;
border-radius:40px;
font-weight:500;
transition:0.3s;
}

/* PRIMARY */

.btn-primary{
background:linear-gradient(90deg,#2563eb,#06b6d4);
color:#fff;
border:none;
}

.btn-primary:hover{
transform:translateY(-3px);
box-shadow:0 10px 25px rgba(0,0,0,0.4);
}


/* SECONDARY */

.btn-secondary{
background:transparent;
border:2px solid #2563eb;
color:#fff;
}

.btn-secondary:hover{
background:#2563eb;
}


/* VIDEO WRAPPER */

.image-wrapper{
display:flex;
align-items:center;
justify-content:center;
height:100%;
}


/* VIDEO */

.image-wrapper video{
width:100%;
height:100%;
max-height:420px;
object-fit:cover;
border-radius:14px;
box-shadow:0 20px 40px rgba(0,0,0,0.6);
}
.cta-buttons{
margin-top:25px;
}

.lux-btn-primary{

display:inline-flex;
align-items:center;
gap:10px;

padding:14px 32px;

font-size:16px;
font-weight:600;

color:#fff;
text-decoration:none;

background:linear-gradient(90deg,#2563eb,#06b6d4);

border-radius:40px;

transition:0.3s;

box-shadow:0 8px 20px rgba(0,0,0,0.3);

}

/* hover */

.lux-btn-primary:hover{

transform:translateY(-3px);
box-shadow:0 15px 35px rgba(0,0,0,0.4);

}


/* icon animation */

.lux-btn-primary i{

font-size:18px;

animation:lux-arrowMove 1.2s infinite;

}


/* animation */

@keyframes lux-arrowMove{

0%{
transform:translateX(0);
}

50%{
transform:translateX(6px);
}

100%{
transform:translateX(0);
}

}

/* MOBILE */

@media(max-width:991px){

.call-to-action{
padding:70px 0;
}

.call-to-action h2{
font-size:28px;
}

.image-wrapper{
margin-top:30px;
}

}

/*--End of About Us Section--*/

/* HERO SECTION */

/* HERO SECTION */

.hotel-hero{
position:relative;
height:90vh;
display:flex;
align-items:center;
justify-content:center;
padding:0;
overflow:hidden;
}

/* VIDEO */

.video-background{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
}

.video-background video{
width:100%;
height:100%;
object-fit:cover;
}

/* DARK OVERLAY */

.video-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.55);
}

/* HERO CONTENT */

.hero-content{
width:100%;
padding-top:80px;
}

/* HERO TEXT */

.hero-text{
margin:0;
}

.hero-text h1{
font-size:52px;
font-weight:700;
line-height:1.2;
margin-bottom:18px;
color:#fff;
}

/* GRADIENT */

.bluefx-gradient{
background:linear-gradient(90deg,#0060fd,#000eb8);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

/* SUBTITLE */

.hero-subtitle{
color:#d1d5db;
font-size:17px;
line-height:1.7;
margin-bottom:30px;
}

/* BUTTONS */

.hero-actions{
display:flex;
justify-content:center;
gap:18px;
flex-wrap:wrap;
}

/* BUTTON */

.hero-btn{
display:inline-flex;
align-items:center;
gap:10px;
padding:14px 30px;
font-weight:600;
border-radius:40px;
text-decoration:none;
transition:0.3s;
}

/* LOGIN */

.hero-login{
background:linear-gradient(90deg,#2563eb,#06b6d4);
color:#fff;
}

/* REGISTER */

.hero-register{
border:2px solid #fff;
color:#fff;
}

/* HOVER */

.hero-btn:hover{
transform:translateY(-3px);
}

/* ICON ANIMATION */

.hero-btn i{
animation:heroIconMove 1.3s infinite;
}

@keyframes heroIconMove{
0%{transform:translateX(0);}
50%{transform:translateX(6px);}
100%{transform:translateX(0);}
}

/* ULTRA COMPACT MOBILE HERO */

@media(max-width:768px){

.hotel-hero{
height:60vh !important;
min-height:70vh !important;
padding:60px 0 10px !important;
display:flex;
align-items:center;
}

.hero-content{
padding-top:0 !important;
}

.hero-text{
margin:0 !important;
}

.hero-text h1{
font-size:22px;
line-height:1.25;
margin-bottom:8px;
}

.hero-subtitle{
font-size:12.5px;
line-height:1.5;
margin-bottom:12px;
padding:0 8px;
}

.hero-actions{
gap:8px;
}

.hero-btn{
padding:9px 16px;
font-size:12.5px;
}

.video-overlay{
background:rgba(0,0,0,0.65);
}

}
/*--End of Hero Section--*/
/* Glitch effect for text */
/* SECTION BACKGROUND */

.bluefx-section{
position:relative;
overflow:hidden;
padding:100px 20px;
text-align:center;

background:linear-gradient(180deg,#f8fbff 0%,#eef4ff 100%);
}

/* HEADING */

.main-heading{
font-size:48px;
font-weight:800;
background:linear-gradient(90deg,#000eb8 0%,#0060fd 100%);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
animation:textFloat 4s ease-in-out infinite;
}

/* WELCOME TEXT */

.welcome-line{
font-size:18px;
font-weight:600;
color:#0060fd;
display:flex;
align-items:center;
justify-content:center;
gap:8px;
margin-bottom:12px;
}

/* ICON ANIMATION */

.star-icon{
font-size:20px;
animation:spinIcon 4s linear infinite;
}

/* HARD WAVE CIRCLES */

.wave-circle{
position:absolute;
border-radius:50%;
border:2px solid rgba(0,96,253,0.25);
animation:waveExpand 6s linear infinite;
}

.wave1{
width:200px;
height:200px;
top:50%;
left:50%;
transform:translate(-50%,-50%);
}

.wave2{
width:350px;
height:350px;
top:50%;
left:50%;
transform:translate(-50%,-50%);
animation-delay:2s;
}

.wave3{
width:500px;
height:500px;
top:50%;
left:50%;
transform:translate(-50%,-50%);
animation-delay:4s;
}

/* SCROLL PARALLAX EFFECT */

.bluefx-section::before{
content:"";
position:absolute;
width:600px;
height:600px;
background:radial-gradient(circle,rgba(0,96,253,0.15),transparent);
top:-200px;
right:-200px;
animation:scrollMove 12s linear infinite;
}

/* ANIMATIONS */

@keyframes waveExpand{
0%{
transform:translate(-50%,-50%) scale(0.8);
opacity:0.6;
}
100%{
transform:translate(-50%,-50%) scale(1.4);
opacity:0;
}
}

@keyframes spinIcon{
0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}
}

@keyframes textFloat{
0%{transform:translateY(0)}
50%{transform:translateY(-6px)}
100%{transform:translateY(0)}
}

@keyframes scrollMove{
0%{transform:translateY(0)}
100%{transform:translateY(120px)}
}
/*--Wave Animation End--*/
/* ABOUT SECTION */

/* SECTION HEADING */

.aboutus-heading{
margin-bottom:70px;
}


/* ABOUT US LABEL */

.aboutus-label{

display:inline-flex;
align-items:center;
gap:8px;

font-size:18px;
font-weight:600;

color:#38bdf8;

margin-bottom:20px;

position:relative;
top:-10px; /* upar shift */

}


/* ICON ANIMATION */

.aboutus-label i{

font-size:18px;

animation:aboutIconMove 1.5s infinite;

}

@keyframes aboutIconMove{

0%{transform:scale(1);}
50%{transform:scale(1.3);}
100%{transform:scale(1);}

}


/* MAIN HEADING */

.aboutus-title{

display:inline-block;

font-size:42px;
font-weight:700;

color:#ffffff;

padding:22px 32px;

border:2px dotted rgba(255,255,255,0.5);

border-radius:14px;

line-height:1.3;

animation:borderPulse 3s infinite;

}


/* BORDER ANIMATION */

@keyframes borderPulse{

0%{
border-color:#2563eb;
}

50%{
border-color:#06b6d4;
}

100%{
border-color:#2563eb;
}

}


/* MOBILE */

@media(max-width:768px){

.aboutus-title{
font-size:28px;
padding:16px 20px;
}

.aboutus-label{
top:-5px;
}

}
/*--End of About Section--*/

/*--How It Works Section--*/
/* SECTION */

.bluefx-how{

position:relative;
padding:120px 0;

background:linear-gradient(135deg,#020617,#0f172a);

color:#fff;

overflow:hidden;

}


/* WAVE BACKGROUND */

.bluefx-how::before{

content:"";

position:absolute;

bottom:0;
left:0;

width:200%;
height:220px;

background:radial-gradient(circle at 50% 0%,rgba(37,99,235,0.4),transparent 70%);

animation:waveMove 10s linear infinite;

}

@keyframes waveMove{

0%{transform:translateX(0);}
100%{transform:translateX(-50%);}

}


/* TITLE */

.bluefx-title{

text-align:center;

margin-bottom:70px;

}

.bluefx-title h2{

font-size:42px;
font-weight:700;

margin-bottom:15px;

}

.bluefx-title p{

color:#cbd5e1;

}


/* CARD */

.bluefx-step{

position:relative;

background:rgba(255,255,255,0.05);

backdrop-filter:blur(10px);

border-radius:16px;

padding:40px 25px;

text-align:center;

transition:0.4s;

height:100%;

overflow:hidden;

}


/* HALF GRADIENT BORDER */

.bluefx-step::before{

content:"";

position:absolute;

top:-1px;
left:-1px;

width:50%;
height:50%;

border-top:2px solid #2563eb;
border-left:2px solid #06b6d4;

border-top-left-radius:16px;

}


/* SECOND HALF */

.bluefx-step::after{

content:"";

position:absolute;

bottom:-1px;
right:-1px;

width:50%;
height:50%;

border-bottom:2px solid #06b6d4;
border-right:2px solid #2563eb;

border-bottom-right-radius:16px;

}


/* ICON */

.bluefx-icon{

font-size:42px;

color:#38bdf8;

margin-bottom:20px;

display:inline-block;

animation:iconFloat 2s ease-in-out infinite;

}

@keyframes iconFloat{

0%{transform:translateY(0);}
50%{transform:translateY(-6px);}
100%{transform:translateY(0);}

}


/* TITLE */

.bluefx-step h4{

font-size:20px;

font-weight:600;

margin-bottom:10px;

}


/* TEXT */

.bluefx-step p{

color:#cbd5e1;

font-size:14px;

}


/* HOVER */

.bluefx-step:hover{

transform:translateY(-10px);

box-shadow:0 25px 50px rgba(0,0,0,0.6);

}


/* MOBILE */

@media(max-width:768px){

.bluefx-title h2{

font-size:30px;

}

.bluefx-how{

padding:80px 0;

}

}
/*--End of How It Works Section--*/
/* SECTION */

.bluefx-community{
position:relative;
padding:120px 0;
background:linear-gradient(135deg,#020617,#0f172a);
color:#fff;
overflow:hidden;
}

/* MULTIPLE CIRCLE WAVES */

.circle{
position:absolute;
border-radius:50%;
filter:blur(40px);
opacity:0.6;
animation:float 12s ease-in-out infinite;
}

.circle1{
width:500px;
height:500px;
background:radial-gradient(circle,#2563eb,transparent 70%);
top:-150px;
left:-150px;
}

.circle2{
width:400px;
height:400px;
background:radial-gradient(circle,#06b6d4,transparent 70%);
bottom:-150px;
right:-120px;
animation-duration:14s;
}

.circle3{
width:350px;
height:350px;
background:radial-gradient(circle,#3b82f6,transparent 70%);
top:40%;
left:-120px;
animation-duration:16s;
}

.circle4{
width:300px;
height:300px;
background:radial-gradient(circle,#22d3ee,transparent 70%);
bottom:20%;
right:10%;
animation-duration:18s;
}

/* FLOAT ANIMATION */

@keyframes float{
0%{transform:translateY(0) scale(1);}
50%{transform:translateY(-60px) scale(1.2);}
100%{transform:translateY(0) scale(1);}
}

/* TITLE */

.community-title{
text-align:center;
margin-bottom:70px;
}

.community-title h2{
font-size:42px;
font-weight:700;
margin-bottom:15px;
}

.community-title p{
color:#cbd5e1;
max-width:700px;
margin:auto;
line-height:1.7;
}

/* CARD */

.community-card{
background:rgba(255,255,255,0.05);
border-radius:16px;
padding:40px 25px;
text-align:center;
border:1px solid rgba(255,255,255,0.08);
backdrop-filter:blur(10px);
transition:0.4s;
position:relative;
overflow:hidden;
}

.community-card:hover{
transform:translateY(-10px);
box-shadow:0 25px 50px rgba(0,0,0,0.6);
}

/* ICON */

.community-icon{
font-size:42px;
color:#38bdf8;
margin-bottom:15px;
animation:iconFloat 2s infinite;
}

@keyframes iconFloat{
0%{transform:translateY(0)}
50%{transform:translateY(-6px)}
100%{transform:translateY(0)}
}

/* COUNTER */

.community-number{
font-size:42px;
font-weight:700;
color:#fff;
margin-bottom:5px;
}

.community-label{
color:#cbd5e1;
font-size:16px;
}

/* MOBILE */

@media(max-width:768px){

.community-title h2{
font-size:30px;
}

.bluefx-community{
padding:80px 0;
}

}
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Poppins,sans-serif;
}

/* HERO */

.ux-hero{
height:100vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
position:relative;
overflow:hidden;
color:white;
}

/* VIDEO */

.ux-video{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
z-index:1;
}

/* OVERLAY */

.ux-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(120deg,#000000cc,#000428cc,#004e92cc);
z-index:2;
}

/* MOVING WAVE LIGHT */

.ux-wave{
position:absolute;
width:900px;
height:900px;
background:radial-gradient(circle,#00c6ff40,transparent 60%);
border-radius:50%;
animation:ux-waveMove 12s linear infinite;
z-index:3;
}

.ux-wave2{
position:absolute;
width:700px;
height:700px;
background:radial-gradient(circle,#0072ff40,transparent 60%);
border-radius:50%;
animation:ux-waveMove 16s linear infinite reverse;
z-index:3;
}

@keyframes ux-waveMove{

0%{transform:translate(-40%,-40%) rotate(0deg)}

50%{transform:translate(40%,40%) rotate(180deg)}

100%{transform:translate(-40%,-40%) rotate(360deg)}

}

/* GLASS BOX */

.ux-content{

max-width:800px;

padding:60px;

background:rgba(255,255,255,0.08);

backdrop-filter:blur(15px);

border:1px solid rgba(255,255,255,0.15);

border-radius:20px;

position:relative;

z-index:5;

}

/* HEADING */

.ux-title{

font-size:clamp(34px,5vw,48px);

font-weight:700;

line-height:1.2;

margin-bottom:20px;

background:linear-gradient(90deg,#00c6ff,#0072ff,#00c6ff);

background-size:200%;

-webkit-background-clip:text;

color:transparent;

animation:ux-gradient 6s linear infinite;

}

@keyframes ux-gradient{

0%{background-position:0%}

100%{background-position:200%}

}

/* TEXT */

.ux-desc{

font-size:20px;

opacity:.9;

margin-bottom:35px;

}

/* BUTTON */

.ux-btn{

display:inline-flex;

align-items:center;

gap:10px;

padding:16px 42px;

border-radius:50px;

text-decoration:none;

font-weight:600;

color:white;

background:linear-gradient(90deg,#00c6ff,#0072ff);

position:relative;

overflow:hidden;

animation:ux-pulse 2.5s infinite;

}

/* BUTTON SHINE */

.ux-btn::before{

content:"";

position:absolute;

top:0;

left:-100%;

width:100%;

height:100%;

background:linear-gradient(120deg,transparent,rgba(255,255,255,.6),transparent);

animation:ux-shine 3s infinite;

}

@keyframes ux-shine{

0%{left:-100%}

100%{left:120%}

}

/* BUTTON PULSE */

@keyframes ux-pulse{

0%{box-shadow:0 0 0 0 rgba(0,198,255,0.6)}

70%{box-shadow:0 0 0 18px rgba(0,198,255,0)}

100%{box-shadow:0 0 0 0 rgba(0,198,255,0)}

}

/* TYPING TEXT */

.ux-typing{

margin-top:30px;

font-size:20px;

color:#ffd700;

font-weight:500;

}

/* MOBILE */

@media(max-width:768px){

.ux-content{
padding:35px;
}

.ux-desc{
font-size:16px;
}

}
/*--End of Hero Section--*/
/*--Footer Section--*/
/* ===== FOOTER MAIN ===== */
.trading-footer{
  position:relative;
  background:linear-gradient(135deg,#020617,#020024,#000428);
  color:#fff;
  padding:40px 0 40px;
  overflow:hidden;
}

/* ===== UNIQUE WAVE BACKGROUND ===== */

@keyframes footerGlowWave{
  0%{transform:scale(1) translateY(0);}
  100%{transform:scale(1.2) translateY(-20px);}
}

/* ===== GRID ===== */
.footer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:40px;
  position:relative;
  z-index:2;
}

/* ===== HEADING ===== */
.footer-col h3{
  font-size:20px;
  margin-bottom:18px;
  position:relative;
  display:inline-block;
}

.footer-col h3::after{
  content:"";
  position:absolute;
  bottom:-6px;
  left:0;
  width:40px;
  height:2px;
  background:#0060fd;
  animation:headingLineMove 3s linear infinite;
}

@keyframes headingLineMove{
  0%{width:20px;}
  50%{width:60px;}
  100%{width:20px;}
}

/* ===== TEXT ===== */
.footer-col p{
  font-size:15px;
  line-height:1.7;
  color:#cbd5f5;
}

/* ===== QUICK LINKS ===== */
.quick-links{
  list-style:none;
  padding:0;
}

.quick-links li{
  margin-bottom:12px;
}

/* ===== LINK STYLE ===== */
.quick-links a{
  color:#e2e8f0;
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:15px;
  transition:0.4s;
  position:relative;
}

/* ===== ICON STYLE ===== */
.link-icon{
  font-size:18px;
  color:#00aaff;
  transition:0.4s;
  animation:iconPulse 3s infinite;
}

/* ICON CONTINUOUS ANIMATION */
@keyframes iconPulse{
  0%{transform:scale(1); filter:drop-shadow(0 0 0px #00aaff);}
  50%{transform:scale(1.2); filter:drop-shadow(0 0 8px #00aaff);}
  100%{transform:scale(1); filter:drop-shadow(0 0 0px #00aaff);}
}

/* HOVER EFFECT */
.quick-links a:hover{
  transform:translateX(8px);
  color:#00aaff;
}

.quick-links a:hover .link-icon{
  transform:rotate(360deg) scale(1.3);
  color:#00d9ff;
}

/* ===== FOOTER BOTTOM ===== */
.footer-bottom{
  text-align:center;
  margin-top:40px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,0.1);
  font-size:14px;
  color:#94a3b8;
}



/*--End of Footer Section--*/

#preloader{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#020617;
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
transition:opacity 0.6s ease, visibility 0.6s ease;
}

#preloader.hide{
opacity:0;
visibility:hidden;
}