.card {

background:
linear-gradient(
145deg,
rgba(255,255,255,0.08),
rgba(255,255,255,0.02)
);

border:

1px solid rgba(0,217,255,.25);

border-radius:20px;

padding:25px;

backdrop-filter:blur(15px);

box-shadow:
0 0 30px rgba(0,217,255,.08);

}


.brand-header {

display:flex;

align-items:center;

justify-content:space-between;

padding:20px 30px;

border-bottom:

1px solid rgba(0,217,255,.2);

background:

rgba(0,0,0,.4);

}


.logo {

height:70px;

filter:

drop-shadow(
0 0 15px var(--cyan)
);

}


.brand-header h1 {

font-size:32px;

margin:0;

background:

linear-gradient(
90deg,
white,
var(--cyan)
);

-webkit-background-clip:text;

color:transparent;

}


.brand-header p {

color:#aaa;

letter-spacing:3px;

}


button {

background:

linear-gradient(
135deg,
var(--cyan),
var(--cyan-dark)
);

border:none;

padding:

12px 25px;

border-radius:30px;

font-weight:bold;

cursor:pointer;

}


.wave {

height:100px;

display:flex;

align-items:center;

justify-content:center;

font-size:35px;

color:var(--cyan);

animation:pulse 1.5s infinite;

}


@keyframes pulse {

50%{

opacity:.4;

}

}


.service {

padding:15px;

margin-top:12px;

border-radius:12px;

background:

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

}


.service.active {

border:

1px solid #10b981;

}


.locked {

opacity:.5;

}