.planes{
  padding:100px 8%;
  background:#050816;
  color:white;
  text-align:center;
}

.planes h2{
  font-family:'Orbitron', sans-serif;
  font-size:2.5rem;
  margin-bottom:20px;
}

.planes h2 span{
  color:#00E5FF;
}

.planes-sub{
  max-width:700px;
  margin:0 auto 60px;
  color:#cbd5e1;
}

/* GRID */

.planes-grid{
  display:flex;
  justify-content:center;
  gap:30px;
  flex-wrap:wrap;
}

/* PLAN */

.plan{
  width:280px;
  padding:25px;
  border-radius:12px;

  background:rgba(0,229,255,0.05);
  border:1px solid rgba(0,229,255,0.2);

  transition:0.3s;
  position:relative;
}

.plan:hover{
  transform:translateY(-10px);
  box-shadow:0 0 25px rgba(0,229,255,0.2);
}

/* DESTACADO */

.featured{
  transform:scale(1.05);
  border:2px solid #00E5FF;
}

.badge{
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  background:#00E5FF;
  color:#050816;
  padding:5px 12px;
  font-size:0.7rem;
  border-radius:6px;
}

/* TEXTO */

.plan h3{
  margin-bottom:10px;
}

.plan-desc{
  color:#94a3b8;
  font-size:0.9rem;
  margin-bottom:15px;
}

.price{
  font-size:1.8rem;
  font-weight:bold;
  margin-bottom:15px;
  color:#00E5FF;
}

/* LISTA */

.plan ul{
  list-style:none;
  margin-bottom:20px;
}

.plan ul li{
  margin:8px 0;
  font-size:0.9rem;
}

/* BOTÓN */

.plan .btn{
  width:100%;
}
@media (max-width: 768px){

  .planes{
    padding:70px 5%;
  }

  .planes h2{
    font-size:1.8rem;
  }

  .featured{
    transform:none;
  }

}