*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Segoe UI',sans-serif;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}

body{
background:#0b0f2a;
color:#fff;
overflow-x:hidden;
line-height:1.6;
scroll-behavior:smooth;
}

/* ================= NAVBAR ================= */
.navbar{
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 60px;
position:fixed;
width:100%;
top:0;
z-index:1000;
background-color:#fff;
backdrop-filter:blur(10px);
border-bottom:1px solid rgba(255,255,255,0.1);
}

/* ================= LOGO ================= */
.logo img{
height:40px;
width:auto;
display:block;
}

/* ================= NAV LINKS ================= */
.nav-links{
display:flex;
list-style:none;
gap:30px;
}

/* NEW SPACING (layered override) */
.nav-links{
    margin-left: 450px;
    margin-bottom: 0px;
}

.nav-links li a{
text-decoration:none;
color:#0a1f44;
font-weight:500;
position:relative;
padding:5px 0;
transition:all 0.3s ease;
}

/* NEW LINK SPACING */
.nav-links li a{
margin-left:10px;
}

/* ================= UNDERLINE ================= */
.nav-links li a::after{
content:"";
position:absolute;
left:0;
bottom:-4px;
width:0%;
height:2px;
background:linear-gradient(90deg,#1e3a8a,#1f9552);
transition:0.3s;
border-radius:2px;
}

.nav-links li a:hover{
color:#1f9552;
}

.nav-links li a:hover::after{
width:100%;
}

/* ================= DROPDOWN ================= */
.dropdown{
position:relative;
}

.dropdown-menu{
display:none;
position:absolute;
top:25px;
left:0;
background:#0a1f44;
padding:5px 0;
border-radius:5px;
min-width:150px;
z-index:9999;
}

.dropdown-menu li{
list-style:none;
}

.dropdown-menu li a{
color:#fff;
padding:8px 15px;
display:block;
text-decoration:none;
white-space:nowrap;
}

.dropdown-menu li a:hover{
/* background:#1e3a8a; */
}

.dropdown:hover .dropdown-menu{
display:block;
}

/* ================= BUTTON ================= */
.btn{
padding:10px 22px;
border:none;
border-radius:25px;
cursor:pointer;
color:#fff;
font-weight:600;
letter-spacing:0.5px;
background:linear-gradient(135deg,#1f9552,#22c55e);
transition:all 0.3s ease;
box-shadow:0 5px 15px rgba(31,149,82,0.3);
}

.btn:hover{
transform:scale(1.1);
}

/* HERO */
/* ================= HERO BASE ================= */
.hero{
height:100vh;
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
position:relative;
overflow:hidden;
color:#fff;
background:#020617;
}

/* ================= OLD BACKGROUND ================= */
.hero::before{
content:"";
position:absolute;
width:200%;
height:200%;
background:radial-gradient(circle,#1a1f4a,#0b0f2a);
animation:rotateBG 20s linear infinite;
z-index:0;
}

/* ================= NEW GRID BACKGROUND (LAYERED) ================= */
.hero::after{
content:"";
position:absolute;
width:200%;
height:200%;
background-image: linear-gradient(rgba(14,165,233,0.08) 1px, transparent 1px),
                  linear-gradient(90deg, rgba(14,165,233,0.08) 1px, transparent 1px);
background-size:60px 60px;
animation:moveGrid 20s linear infinite;
z-index:0;
}

/* EXTRA GLOW LAYER */
.hero .glow-bg{
position:absolute;
width:500px;
height:500px;
background: radial-gradient(circle, rgba(14,165,233,0.4), transparent 70%);
top:20%;
left:40%;
filter:blur(100px);
z-index:0;
}

/* ================= PARTICLES ================= */
.particles{
position:absolute;
width:100%;
height:100%;
background:url("https://www.transparenttextures.com/patterns/stardust.png");
opacity:0.2;
animation:moveParticles 60s linear infinite;
z-index:0;
}

/* ================= ANIMATIONS ================= */
@keyframes rotateBG{
0%{transform:rotate(0deg);}
100%{transform:rotate(360deg);}
}

@keyframes moveGrid{
0%{transform:translate(0,0);}
100%{transform:translate(-60px,-60px);}
}

@keyframes moveParticles{
from{background-position:0 0;}
to{background-position:1000px 1000px;}
}

/* ================= CONTENT ================= */
.hero-container{
display:flex;
align-items:center;
justify-content:space-between;
width:90%;
max-width:1200px;
z-index:2;
position:relative;
}

.hero-content{
position:relative;
z-index:2;
max-width:500px;
text-align:left;
}

/* ================= HEADINGS ================= */
.hero h1{
font-size:52px;
margin-bottom:20px;
font-weight:700;
background:linear-gradient(45deg,#1e3a8a,#1f9552);
-webkit-background-clip:text;
color:transparent;
text-shadow:0 10px 30px rgba(30,58,138,0.2);
}

/* NEW GLOW TEXT EFFECT */
.hero-content h1{
font-size:48px;
background:linear-gradient(90deg,#0ea5e9,#22c55e);
-webkit-background-clip:text;
color:transparent;
animation:fadeUp 1s ease forwards;
}

/* ================= TEXT ================= */
.hero p{
color:#cfd8ff;
font-size:16px;
line-height:1.7;
margin-bottom:30px;
}

/* ================= BUTTONS ================= */
.hero-buttons button{
margin:10px;
padding:12px 25px;
border:none;
border-radius:30px;
cursor:pointer;
font-size:16px;
}

.primary-btn{
background:linear-gradient(135deg,#1e3a8a,#1f9552);
color:#fff;
border-radius:30px;
padding:12px 28px;
font-weight:600;
box-shadow:0 10px 25px rgba(31,149,82,0.3);
transition:0.3s;
}

.primary-btn:hover{
transform:translateY(-3px);
box-shadow:0 15px 35px rgba(31,149,82,0.5);
}

/* NEW BUTTON GLOW */
.primary-btn:hover{
box-shadow:0 0 25px #0ea5e9;
}

.secondary-btn{
background:transparent;
border:1px solid #1f9552;
color:#1f9552;
border-radius:30px;
padding:12px 28px;
transition:0.3s;
}

.secondary-btn:hover{
background:#1f9552;
color:#fff;
}

/* ================= COINS ================= */
.coin{
position:absolute;
width:60px;
height:60px;
background:linear-gradient(45deg,#00f0ff,#7a5cff);
border-radius:50%;
opacity:0.3;
animation:float 6s infinite ease-in-out;
}

/* NEW REALISTIC COIN STYLE (ADDED, NOT REMOVED) */
.coin.real{
width:70px;
height:70px;
background: radial-gradient(circle at 30% 30%, #ffd700, #ff8c00, #b45309);
box-shadow:0 0 20px rgba(255,215,0,0.6),
           inset 0 0 10px rgba(255,255,255,0.5);
animation:coinFloat 6s ease-in-out infinite;
}

.coin1{top:20%; left:10%;}
.coin2{top:70%; left:80%; animation-delay:2s;}
.coin3{top:50%; left:50%; animation-delay:4s;}

@keyframes float{
0%{transform:translateY(0px);}
50%{transform:translateY(-30px);}
100%{transform:translateY(0px);}
}

@keyframes coinFloat{
0%{transform:translateY(0) rotateY(0deg);}
50%{transform:translateY(-40px) rotateY(180deg);}
100%{transform:translateY(0) rotateY(360deg);}
}

/* ================= CARDS ================= */
.hero-cards{
display:flex;
flex-direction:row;
gap:25px;
align-items:center;
}

.card{
width:220px;
padding:22px;
border-radius:18px;
background:rgba(255,255,255,0.06);
backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,0.1);
box-shadow:0 10px 30px rgba(0,0,0,0.2);
transition:all 0.4s ease;
animation:cardFloat 4s ease-in-out infinite;
}

/* SECOND CARD VERSION (KEPT) */
.card{
width:300px;
padding:20px;
border-radius:15px;
background:rgba(255,255,255,0.05);
backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,0.1);
transition:0.4s;
animation:cardFloat 4s ease-in-out infinite;
}

/* NEW CARD HOVER */
.hero-cards .card:hover{
transform:translateY(-10px);
box-shadow:0 0 30px rgba(14,165,233,0.3);
}

/* OLD HOVER */
.card:hover{
transform:translateY(-10px) scale(1.05);
box-shadow:0 10px 30px rgba(0,240,255,0.2);
}

@keyframes cardFloat{
0%{transform:translateY(0);}
50%{transform:translateY(-15px);}
100%{transform:translateY(0);}
}

.hero-cards .card:nth-child(2){
animation-delay:1.5s;
}

/* ================= TEXT ================= */
.card h3{
margin-bottom:10px;
font-size:18px;
}

.price{
font-size:22px;
margin-bottom:8px;
}

.up{color:#00ff9d;}
.down{color:#ff4d4d;}


/*WHY CHOOSE US*/

/* ================= SECTION ================= */
.why-section{
background:#ffffff;
padding:100px 20px;
}

/* ================= HEADER ================= */
.why-header{
text-align:center;
margin-bottom:60px;

/* animation (from new code) */
position:relative;
opacity:0;
transform:translateY(30px);
animation:fadeUp 0.8s forwards;
}

/* OLD STYLE (kept) */
.why-header h2{
font-size:34px;
color:#0a1f44;
margin-bottom:10px;
font-weight:600;
}

/* NEW STYLE (layered override) */
.why-header h2{
font-size:38px;
font-weight:700;
margin-bottom:15px;
background:#162a69;
-webkit-background-clip:text;
color:transparent;
text-shadow:0 10px 30px rgba(30,58,138,0.2);
}

/* TEXT */
.why-header p{
color:#6c757d;
font-size:15px;
}

/* NEW TEXT IMPROVEMENT */
.why-header p{
font-size:16px;
max-width:600px;
margin:auto;
line-height:1.6;
}

/* ================= GRID ================= */
.why-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
max-width:1200px;
margin:auto;
}

/* ================= CARD ================= */
.why-card{
background:#ffffff;
padding:30px;
border-radius:12px;
border:1px solid #eef2f7;
box-shadow:0 5px 20px rgba(0,0,0,0.04);
transition:all 0.3s ease;
position:relative;
}

/* ================= ICON ================= */
.why-icon{
width:50px;
height:50px;
display:flex;
align-items:center;
justify-content:center;
background:#eef4ff;
color:#2b6cff; /* OLD */
border-radius:10px;
font-size:20px;
margin-bottom:20px;
}

/* NEW ICON COLOR (layered) */
.why-icon{
color:#162a69;
}

/* ================= TEXT ================= */
.why-card h3{
font-size:18px;
color:#0a1f44;
margin-bottom:10px;
font-weight:600;
}

.why-card p{
color:#6c757d;
font-size:14px;
line-height:1.6;
}

/* ================= HOVER ================= */
.why-card:hover{
transform:translateY(-6px);
box-shadow:0 15px 35px rgba(0,0,0,0.08);
}

/* ================= TOP BORDER ================= */
.why-card::after{
content:"";
position:absolute;
top:0;
left:0;
width:0%;
height:3px;
background:#2b6cff; /* OLD */
transition:0.4s;
}

/* NEW GRADIENT BORDER (layered override) */
.why-card::after{
background:linear-gradient(45deg,#1e3a8a,#1f9552);
}

.why-card:hover::after{
width:100%;
}

/* ================= SCROLL ANIMATION ================= */
.why-card{
opacity:0;
transform:translateY(30px);
animation:fadeUp 0.8s ease forwards;
}

.why-card:nth-child(2){animation-delay:0.1s;}
.why-card:nth-child(3){animation-delay:0.2s;}
.why-card:nth-child(4){animation-delay:0.3s;}

/* ================= KEYFRAMES ================= */
@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}


/*NEXT SECTION*/

/* ================= SECTION ================= */
.markets-section{
background:linear-gradient(135deg,#0a1f44,#0d2b6b); /* OLD */
padding:100px 20px;
color:#fff;
}

/* NEW GRADIENT (layered) */
.markets-section{
background:linear-gradient(135deg,#0d2b6b,#0a1f44);
}

/* ================= HEADER ================= */
.markets-header{
text-align:center;
margin-bottom:50px;
}

.markets-header h2{
font-size:34px;
margin-bottom:10px;
}

/* NEW HEADER COLOR */
.markets-header h2{
color:#1f9552;
}

.markets-header p{
color:#cfd8ff;
}

/* ================= ROW ================= */
.markets-row{
max-width:1000px;   /* OLD */
margin:auto;
display:flex;
flex-direction:column;
gap:20px;
}

/* NEW ROW STYLE (layered override) */
.markets-row{
max-width:1200px;
flex-direction:row;
}

/* ================= CARD ================= */
.market-card{
display:flex;
align-items:center;
justify-content:space-between;

padding:20px 25px;
border-radius:10px;

background:rgba(255,255,255,0.05);
border:1px solid rgba(255,255,255,0.1);

transition:0.3s;
backdrop-filter:blur(6px); /* OLD */
}

/* NEW FLEX CONTROL */
.market-card{
flex:1;
min-width:0;
}

/* ================= HOVER ================= */
.market-card:hover{
background:rgba(255,255,255,0.08);
transform:translateX(8px);
}

/* NEW EXTRA HOVER EFFECT (layered) */
.market-card:hover{
transform:translateY(-8px);
box-shadow:0 15px 35px rgba(31,149,82,0.3);
}

/* ================= LEFT ================= */
.left h3{
font-size:18px; /* OLD */
margin-bottom:5px;
}

/* NEW FONT SIZE */
.left h3{
font-size:15px;
}

.left span{
font-size:12px;
color:#cfd8ff;
}

/* ================= MIDDLE ================= */
.middle{
text-align:center;
}

.price{
font-size:18px;
font-weight:600;
}

.change{
font-size:13px;
}

.up{color:#00e676;}
.down{color:#ff5252;}

/* ================= BUTTON ================= */
.right button{
padding:8px 18px;
border:none;
border-radius:6px;
background:#ffffff; /* OLD */
color:#0a1f44;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

/* NEW BUTTON STYLE (layered override) */
.right button{
background:linear-gradient(135deg,#1f9552,#22c55e);
color:#fff;
}

.right button:hover{
background:#e6ecff; /* OLD */
}

/* NEW HOVER */
.right button:hover{
background:linear-gradient(135deg,#1f9552,#22c55e);
transform:translateY(-2px);
}

/* ================= ANIMATION ================= */
.market-card{
opacity:0;
transform:translateY(20px);
animation:fadeUp 0.6s forwards;
}

.market-card:nth-child(2){animation-delay:0.1s;}
.market-card:nth-child(3){animation-delay:0.2s;}

@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/*NEXT SECTION*/

/* ================= SECTION ================= */
.account-section{
background:#ffffff;
padding:100px 20px;
}

/* ================= HEADER ================= */
.account-header{
text-align:center;
margin-bottom:60px;
}

/* OLD HEADER */
.account-header h2{
font-size:34px;
color:#0a1f44;
margin-bottom:10px;
}

/* NEW HEADER (layered override) */
.account-header h2{
font-size:38px;
font-weight:700;
margin-bottom:15px;
background:#162a69;
-webkit-background-clip:text;
color:transparent;
text-shadow:0 10px 30px rgba(30,58,138,0.2);
}

.account-header p{
color:#6c757d;
}

/* ================= GRID ================= */
.account-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
max-width:1100px;
margin:auto;
}

/* NEW GRID (layered override) */
.account-grid{
display:flex;
justify-content:center;
gap:30px;
flex-wrap:wrap;
max-width:1200px;
}

/* ================= CARD ================= */
.account-card{
background:#ffffff;
border:1px solid #eef2f7;
border-radius:12px;
padding:35px 25px;
text-align:center;

box-shadow:0 5px 20px rgba(0,0,0,0.04);
transition:0.3s;
position:relative;
}

/* NEW CARD STYLE (layered override) */
.account-card{
flex:1;
min-width:280px;
max-width:320px;

border-radius:16px;
box-shadow:0 10px 30px rgba(0,0,0,0.06);
transition:all 0.4s ease;
overflow:hidden;
}

/* ================= HOVER ================= */
.account-card:hover{
transform:translateY(-8px);
box-shadow:0 15px 40px rgba(0,0,0,0.08);
}

/* NEW HOVER */
.account-card:hover{
transform:translateY(-12px) scale(1.03);
box-shadow:0 20px 50px rgba(0,0,0,0.1);
}

/* ================= ACTIVE ================= */
.account-card.active{
border:2px solid #2b6cff;
transform:scale(1.03);
}

/* NEW ACTIVE */
.account-card.active{
border:2px solid #1f9552;
transform:scale(1.05);
box-shadow:0 20px 60px rgba(31,149,82,0.25);
}

/* ================= TOP BORDER ================= */
.account-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#1e3a8a,#1f9552);
opacity:0;
transition:0.4s;
}

.account-card:hover::before{
opacity:1;
}

/* ================= BADGE ================= */
.badge{
position:absolute;
top:-12px;
left:50%;
transform:translateX(-50%);
background:#2b6cff;
color:#fff;
padding:5px 12px;
font-size:12px;
border-radius:20px;
}

/* NEW BADGE */
.badge{
top:2px;
background:linear-gradient(45deg,#1e3a8a,#1f9552);
padding:6px 14px;
font-weight:600;
}

/* ================= TITLE ================= */
.account-card h3{
font-size:20px;
color:#0a1f44;
margin-bottom:10px;
}

/* ================= PRICE ================= */
.account-card h2{
font-size:32px;
color:#2b6cff;
margin-bottom:10px;
}

/* NEW PRICE */
.account-card h2{
font-size:36px;
color:#1e3a8a;
font-weight:700;
}

/* ================= SUB ================= */
.sub{
color:#6c757d;
margin-bottom:20px;
}

/* ================= LIST ================= */
.account-card ul{
list-style:none;
margin-bottom:25px;
}

.account-card ul li{
margin-bottom:10px;
color:#444;
font-size:14px;
}

/* NEW LIST STYLE */
.account-card ul li{
margin-bottom:12px;
position:relative;
padding-left:18px;
}

.account-card ul li::before{
content:"✔";
position:absolute;
left:0;
color:#1f9552;
font-size:12px;
}

/* ================= BUTTON ================= */
.account-card button{
padding:10px 20px;
border:none;
border-radius:6px;
background:#2b6cff;
color:#fff;
cursor:pointer;
font-weight:600;
transition:0.3s;
}

.account-card button:hover{
background:#1f52cc;
}

/* NEW BUTTON */
.account-card button{
padding:12px 25px;
border-radius:25px;
background:linear-gradient(135deg,#1e3a8a,#1f9552);
}

.account-card button:hover{
transform:scale(1.05);
box-shadow:0 10px 25px rgba(31,149,82,0.4);
background:linear-gradient(135deg,#1e3a8a,#1f9552);
}

/* ================= ANIMATION ================= */
.account-card{
opacity:0;
transform:translateY(30px);
animation:fadeUp 0.7s forwards;
}

/* NEW ANIMATION */
.account-card{
transform:translateY(40px);
animation:fadeUp 0.8s forwards;
}

.account-card:nth-child(2){animation-delay:0.1s;}
.account-card:nth-child(3){animation-delay:0.2s;}

@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/*NEXT SECTION*/
/* ================= SECTION ================= */
.security-section{
background:linear-gradient(135deg,#0a1f44,#0d2b6b);
padding:100px 20px;
color:#fff;
}

/* ================= CONTAINER ================= */
.security-container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:60px;
flex-wrap:wrap;
}

/* ================= LEFT ================= */
.security-content{
max-width:500px;
}

.security-content h2{
font-size:34px;
margin-bottom:20px;
}

/* NEW HEADER COLOR */
.security-content h2{
color:#1f9552;
}

.security-content p{
color:#cfd8ff;
margin-bottom:25px;
line-height:1.6;
}

/* ================= LIST ================= */
.security-list{
list-style:none;
}

.security-list li{
margin-bottom:12px;
color:#e0e6ff;
}

/* ================= RIGHT CARDS ================= */
.security-cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
flex:1;
}

/* NEW FLEX ROW (layered override) */
.security-cards{
display:flex;
justify-content:space-between;
gap:25px;
width:100%;
}

/* ================= CARD ================= */
.security-card{
background:rgba(255,255,255,0.05);
border:1px solid rgba(255,255,255,0.1);
padding:20px;
border-radius:10px;

backdrop-filter:blur(6px);
transition:0.3s;
}

/* NEW CARD STYLE (layered override) */
.security-card{
flex:1;
max-width:32%;

background:rgba(255,255,255,0.06);
padding:25px;
border-radius:16px;

backdrop-filter:blur(10px);

transition:all 0.4s ease;
position:relative;
overflow:hidden;
}

/* ================= ICON ================= */
.sec-icon{
width:55px;
height:55px;
display:flex;
align-items:center;
justify-content:center;

background:linear-gradient(135deg,#1e3a8a,#1f9552);
color:#fff;

border-radius:12px;
font-size:22px;

margin-bottom:15px;

box-shadow:0 10px 25px rgba(31,149,82,0.3);
}

/* ================= HOVER ================= */
.security-card:hover{
transform:translateY(-6px);
background:rgba(255,255,255,0.08);
}

/* NEW HOVER (layered) */
.security-card:hover{
transform:translateY(-10px) scale(1.03);
box-shadow:0 20px 50px rgba(0,0,0,0.2);
}

/* ================= BORDER EFFECT ================= */
.security-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:0%;
height:3px;
background:linear-gradient(90deg,#1e3a8a,#1f9552);
transition:0.4s;
}

.security-card:hover::before{
width:100%;
}

/* ================= TEXT ================= */
.security-card h3{
margin-bottom:10px;
font-size:18px;
}

.security-card p{
font-size:14px;
color:#dbe4ff;
line-height:1.6;
}

/* ================= ANIMATION ================= */
.security-card{
opacity:0;
transform:translateY(20px);
animation:fadeUp 0.6s forwards;
}

/* NEW ANIMATION */
.security-card{
transform:translateY(30px);
animation:fadeUp 0.7s forwards;
}

.security-card:nth-child(2){animation-delay:0.1s;}
.security-card:nth-child(3){animation-delay:0.2s;}

/* ================= KEYFRAMES ================= */
@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/*NEXT SECTION*/

/* ================= SECTION ================= */
.platform-section{
background:#ffffff;
padding:100px 20px;
}

/* NEW BACKGROUND (layered override) */
.platform-section{
background:linear-gradient(180deg,#ffffff 0%,#f5f9ff 100%);
position:relative;
overflow:hidden;
}

/* ================= CONTAINER ================= */
.platform-container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:60px;
flex-wrap:wrap;
}

/* ================= IMAGE ================= */
.platform-image{
flex:1;
text-align:center;
}

.platform-image img{
width:100%;
max-width:500px;
border-radius:12px;

box-shadow:0 20px 50px rgba(0,0,0,0.1);
transition:0.4s;
}

/* NEW IMAGE STYLE (layered override) */
.platform-image img{
max-width:520px;
border-radius:16px;
box-shadow:0 25px 60px rgba(0,0,0,0.15);
}

/* HOVER */
.platform-image img:hover{
transform:scale(1.03);
}

/* NEW HOVER (layered) */
.platform-image img:hover{
transform:translateY(-10px) scale(1.03);
box-shadow:0 35px 80px rgba(30,58,138,0.25);
}

/* ================= CONTENT ================= */
.platform-content{
flex:1;
max-width:500px;
}

.platform-content h2{
font-size:34px;
color:#0a1f44;
margin-bottom:20px;
font-weight:600;
}

/* NEW HEADING STYLE */
.platform-content h2{
font-size:36px;
font-weight:700;
background:linear-gradient(45deg,#1e3a8a);
-webkit-background-clip:text;
color:transparent;
}

.platform-content p{
color:#6c757d;
margin-bottom:25px;
line-height:1.6;
}

/* NEW TEXT STYLE */
.platform-content p{
font-size:16px;
line-height:1.7;
}

/* ================= LIST ================= */
.platform-list{
list-style:none;
margin-bottom:25px;
}

.platform-list li{
margin-bottom:12px;
color:#444;
}

/* ================= BUTTON ================= */
.platform-btn{
padding:12px 25px;
border:none;
border-radius:6px;
background:#2b6cff;
color:#fff;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

.platform-btn:hover{
background:#1f52cc;
}

/* NEW BUTTON (layered override) */
.platform-btn{
background:linear-gradient(135deg,#1f9552,#22c55e);
}

.platform-btn:hover{
background:linear-gradient(135deg,#1f9552,#22c55e);
transform:translateY(-2px);
}

/* ================= ANIMATION ================= */
.platform-image,
.platform-content{
opacity:0;
transform:translateY(30px);
animation:fadeUp 0.8s forwards;
}

.platform-content{
animation-delay:0.2s;
}

/* ================= KEYFRAMES ================= */
@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/*NEXT SECTION*/
/* ================= SECTION ================= */
.payment-section.blue{
background:linear-gradient(135deg,#0a1f44,#0d2b6b);
padding:100px 20px;
color:#fff;
}

/* NEW BACKGROUND (layered override) */
.payment-section.blue{
background:radial-gradient(circle at top left,#1e3a8a 0%,#0a1f44 60%,#081a3a 100%);
position:relative;
overflow:hidden;
}

/* GLOW EFFECT */
.payment-section.blue::before{
content:"";
position:absolute;
width:300px;
height:300px;
background:rgba(31,149,82,0.2);
filter:blur(120px);
top:-50px;
left:-50px;
}

/* ================= CONTAINER ================= */
.payment-container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:60px;
flex-wrap:wrap;
}

/* EXTRA ALIGN (kept) */
.payment-container{
align-items:center;
}

/* ================= LEFT ================= */
.payment-content{
max-width:500px;
}

.payment-content h2{
font-size:34px;
margin-bottom:20px;
font-weight:600;
}

/* NEW HEADING STYLE */
.payment-content h2{
font-size:36px;
font-weight:700;
background:linear-gradient(45deg,#22c55e);
-webkit-background-clip:text;
color:transparent;
}

.payment-content p{
color:#cfd8ff;
margin-bottom:25px;
line-height:1.6;
}

/* NEW TEXT STYLE */
.payment-content p{
line-height:1.7;
}

/* ================= LIST ================= */
.payment-list{
list-style:none;
margin-bottom:25px;
}

.payment-list li{
margin-bottom:12px;
color:#e0e6ff;
}

/* NEW LIST STYLE */
.payment-list li{
margin-bottom:14px;
position:relative;
padding-left:25px;
}

.payment-list li::before{
content:"✔";
position:absolute;
left:0;
color:#22c55e;
font-weight:bold;
}

/* ================= BUTTON ================= */
.payment-btn{
padding:12px 25px;
border:none;
border-radius:6px;
background:#ffffff;
color:#0a1f44;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

.payment-btn:hover{
background:#e6ecff;
}

/* NEW BUTTON STYLE */
.payment-btn{
padding:14px 28px;
border-radius:30px;
background:linear-gradient(135deg,#1e3a8a,#1f9552);
color:#fff;
box-shadow:0 10px 25px rgba(31,149,82,0.3);
}

.payment-btn:hover{
background:linear-gradient(135deg,#1e3a8a,#1f9552);
transform:translateY(-2px);
}

/* ================= RIGHT UI ================= */
.payment-ui{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
}

/* ================= CARD ================= */
.payment-card{
display:flex;
align-items:center;
gap:15px;

background:rgba(255,255,255,0.08);
border:1px solid rgba(255,255,255,0.15);
padding:18px;
border-radius:10px;

backdrop-filter:blur(6px);
transition:0.3s;
}

/* NEW CARD STYLE */
.payment-card{
padding:20px;
border-radius:14px;
backdrop-filter:blur(10px);
box-shadow:0 10px 30px rgba(0,0,0,0.2);
transition:all 0.4s ease;
}

/* ================= ICON ================= */
.payment-card img{
width:35px;
height:35px;
}

/* NEW ICON STYLE */
.payment-card img{
width:40px;
height:40px;
border-radius:10px;
box-shadow:0 5px 15px rgba(0,0,0,0.3);
}

/* ================= TEXT ================= */
.payment-card span{
font-weight:500;
}

/* ================= HOVER ================= */
.payment-card:hover{
transform:translateY(-6px);
background:rgba(255,255,255,0.12);
}

/* NEW HOVER */
.payment-card:hover{
transform:translateY(-10px) scale(1.04);
box-shadow:0 20px 50px rgba(31,149,82,0.4);
border:1px solid rgba(31,149,82,0.4);
}

/* ================= ANIMATION ================= */
.payment-card{
opacity:0;
transform:translateY(20px);
animation:fadeUp 0.6s forwards;
}

/* NEW FLOAT ANIMATION */
.payment-card{
animation:floatCard 5s ease-in-out infinite;
}

/* DELAYS */
.payment-card:nth-child(2){animation-delay:1s;}
.payment-card:nth-child(3){animation-delay:2s;}
.payment-card:nth-child(4){animation-delay:3s;}

/* FLOAT KEYFRAMES */
@keyframes floatCard{
0%{transform:translateY(0);}
50%{transform:translateY(-8px);}
100%{transform:translateY(0);}
}

/* FADEUP */
@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/* FORCE VISIBILITY (kept) */
.payment-content,
.payment-ui{
opacity:1;
transform:translateY(0);
}

.payment-ui{
animation-delay:0.2s;
}

.payment-content,
.payment-ui,
.payment-card{
opacity:1 !important;
transform:none !important;
animation:none !important;
}


/*next section*/

/* ================= SECTION ================= */
.cta-section{
background:#ffffff;
padding:100px 20px;
text-align:center;
}

/* ================= CONTAINER ================= */
.cta-container{
max-width:800px;
margin:auto;
}

/* ================= TITLE ================= */
/* OLD STYLE */
.cta-container h2{
font-size:42px;
color:#0a1f44;
font-weight:600;
margin-bottom:20px;
}

/* NEW STYLE (layered override) */
.cta-container h2{
font-size:38px;
background:#162a69;
-webkit-background-clip:text;
color:transparent;
text-shadow:0 10px 30px rgba(30,58,138,0.2);
}

/* ================= UNDERLINE ================= */
.underline{
width:80px;
height:3px;
background:#2b6cff;
margin:15px auto 25px auto;
border-radius:2px;
transition:0.4s;
}

/* ================= TEXT ================= */
.cta-container p{
color:#6c757d;
font-size:16px;
line-height:1.7;
margin-bottom:35px;
}

/* ================= BUTTON ================= */
/* OLD BUTTON */
.cta-btn{
padding:14px 32px;
border:none;
border-radius:8px;
background:#2b6cff;
color:#fff;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:0.3s;
display:inline-flex;
align-items:center;
gap:10px;
}

/* NEW BUTTON (layered override) */
.cta-btn{
background:linear-gradient(135deg,#1f9552,#22c55e);
}

/* ================= BUTTON HOVER ================= */
/* OLD */
.cta-btn:hover{
background:#1f52cc;
transform:translateY(-2px);
}

/* NEW (layered override) */
.cta-btn:hover{
background:linear-gradient(135deg,#1f9552,#22c55e);
transform:translateY(-2px);
}

/* ================= ARROW ================= */
.cta-btn span{
transition:0.3s;
}

.cta-btn:hover span{
transform:translateX(5px);
}

/* ================= ANIMATION ================= */
.cta-container{
opacity:0;
transform:translateY(30px);
animation:fadeUp 0.8s forwards;
}

/* ================= KEYFRAMES ================= */
@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/*next section*/

/* SECTION */
.footer-section{
background:linear-gradient(135deg,#0a1f44,#0d2b6b);
color:#fff;
}

/* CONTAINER */
.footer-container{
max-width:1200px;
margin:auto;
padding:60px 20px;

display:flex;
justify-content:space-between;
gap:60px;
flex-wrap:wrap;
}

/* LEFT */
.footer-left{
flex:1;
min-width:280px;
}

.logo{
font-size:38px;
font-weight:700;
margin-bottom:15px;
letter-spacing:1px;
}

.footer-left p{
color:#cfd8ff;
line-height:1.7;
}

/* RIGHT */
.footer-right{
flex:1;
min-width:280px;
}

.footer-right h3{
font-size:20px;
margin-bottom:15px;
}

.footer-right p{
color:#dbe4ff;
line-height:1.7;
}

/* BOTTOM */
.footer-bottom{
text-align:center;
padding:20px;
background:#081a3a;
font-size:14px;
color:#cfd8ff;
}

/* ANIMATION */
.footer-left,
.footer-right{
opacity:0;
transform:translateY(20px);
animation:fadeUp 0.8s forwards;
}

.footer-right{
animation-delay:0.2s;
}

@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

/* HOVER EFFECT (SUBTLE) */
.footer-container div:hover{
transform:translateY(-3px);
transition:0.3s;
}

/*NEXT PAGE SECTION*/

.contact-section{
background:linear-gradient(135deg,#0a1f44,#0d2b6b);
padding:100px 20px;
color:#fff;
}

/* CONTAINER */
.contact-container{
max-width:1200px;
/*margin-top: 30px !important;*/
margin:auto;
display:flex;
gap:60px;
justify-content:space-between;
flex-wrap:wrap;
align-items:center;
}

/* LEFT */
.contact-info{
flex:1;
max-width:500px;
}

.contact-info h2{
font-size:36px;
margin-bottom:20px;
color:#22c55e;
}

.contact-info p{
color:#cfd8ff;
line-height:1.7;
margin-bottom:30px;
}

/* INFO BOX */
.info-box{
display:flex;
align-items:center;
gap:15px;
margin-bottom:20px;

background:rgba(255,255,255,0.08);
padding:15px;
border-radius:10px;

transition:0.3s;
}

.info-box i{
font-size:20px;
color:#22c55e;
}

.info-box:hover{
transform:translateX(10px);
background:rgba(255,255,255,0.15);
}

/* RIGHT FORM */
.contact-form{
flex:1;
max-width:450px;

background:rgba(255,255,255,0.08);
padding:30px;
border-radius:16px;

backdrop-filter:blur(10px);
box-shadow:0 10px 30px rgba(0,0,0,0.3);
}

.contact-form h3{
margin-bottom:20px;
}

/* INPUTS */
.input-box{
margin-bottom:15px;
}

.input-box input,
.input-box textarea{
width:100%;
padding:12px 15px;
border:none;
border-radius:8px;
outline:none;

background:rgba(255,255,255,0.1);
color:#fff;
}

/* BUTTON */
.contact-form button{
width:100%;
padding:12px;
border:none;
border-radius:25px;

background:linear-gradient(135deg,#1e3a8a,#1f9552);
color:#fff;

font-weight:600;
cursor:pointer;
transition:0.3s;
}

.contact-form button:hover{
transform:translateY(-2px);
box-shadow:0 10px 25px rgba(31,149,82,0.4);
}


/*ANIMATIONS*/

/* default hidden state */
section,
.why-card,
.market-card,
.account-card,
.security-card,
.platform-content,
.platform-image,
.payment-card,
.cta-container,
.footer-left,
.footer-right
.contact-info,
.contact-form{
opacity:1;
transform:translateY(60px);
transition:all 0.8s cubic-bezier(0.22,1,0.36,1);
}

/* visible */
.show{
opacity:1 !important;
transform:translateY(0) !important;
}

@media(max-width:768px){
.nav-links{
display:none;
}

.hero-content h1{
font-size:28px;
}

.markets-row{
flex-direction:column;
}

.security-container,
.platform-container,
.payment-container{
flex-direction:column;
}
}

.text-primary {

    color: #162a69 !important;
}