.pricing{

padding:170px 0;

background:#081018;

color:#fff;

}

.pricing-toggle{

display:flex;

justify-content:center;

margin:60px 0;

gap:15px;

}

.pricing-toggle button{

padding:14px 35px;

border:none;

border-radius:50px;

cursor:pointer;

background:#1b2738;

color:#fff;

font-weight:600;

transition:.3s;

}

.pricing-toggle .active{

background:#22C55E;

}

.pricing-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}

.price-card{

position:relative;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.08);

padding:45px;

border-radius:24px;

backdrop-filter:blur(20px);

transition:.35s;

}

.price-card:hover{

transform:translateY(-15px);

}

.featured{

border:2px solid #84CC16;

transform:scale(1.05);

}

.popular{

position:absolute;

top:-15px;

left:50%;

transform:translateX(-50%);

background:#84CC16;

color:#081018;

padding:8px 18px;

border-radius:50px;

font-size:13px;

font-weight:700;

}

.plan{

font-size:24px;

font-weight:700;

margin-bottom:25px;

}

.price-card h2{

font-size:56px;

margin-bottom:25px;

}

.price-card span{

font-size:18px;

color:#cbd5e1;

}

.price-card ul{

list-style:none;

padding:0;

margin-bottom:35px;

}

.price-card li{

padding:12px 0;

border-bottom:1px solid rgba(255,255,255,.06);

color:#c7d2da;

}

.price-card a{

display:block;

text-align:center;

padding:16px;

border-radius:14px;

background:linear-gradient(
135deg,
#22C55E,
#2F855A
);

color:#fff;

font-weight:700;

transition:.3s;

}

.price-card a:hover{

transform:translateY(-3px);

}

@media(max-width:1100px){

.pricing-grid{

grid-template-columns:1fr;

}

.featured{

transform:none;

}

}