.elementor-1396 .elementor-element.elementor-element-3b28ad50{--display:flex;}.elementor-1396 .elementor-element.elementor-element-3b28ad50.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1396 .elementor-element.elementor-element-5bc814b5{text-shadow:0px 0px 0px #000000;color:#000000;}@media(min-width:768px){.elementor-1396 .elementor-element.elementor-element-3b28ad50{--width:98%;}}/* Start custom CSS for text-editor, class: .elementor-element-5bc814b5 */.niveles-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
margin-top:40px;
}

.nivel-card{
background:#0f0f10;
border-radius:18px;
padding:45px;
border:1px solid #222;
box-shadow:0 10px 30px rgba(0,0,0,.5);
text-align:center;
}

.nivel-card h3{
font-size:26px;
margin-bottom:25px;
color:#ffffff;
}

.botones{
display:flex;
justify-content:center;
gap:10px;
}

.btn-entrar{
padding:12px 18px;
border-radius:10px;
border:1px solid #444;
background:#111;
color:white;
text-decoration:none;
font-weight:700;
}

.btn-comprar{
padding:12px 18px;
border-radius:10px;
background:#f6a622;
color:black;
text-decoration:none;
font-weight:700;
}

@media(max-width:900px){

.niveles-grid{
grid-template-columns:1fr;
}

}
/* fondo elegante de la sección */
body{
background:#f5f6f8;
}

/* mejora del contenedor del curso */
.cursos-grid{
margin-top:50px;
padding:20px;
}

/* efecto al pasar el mouse */
.curso-card:hover{
transform:translateY(-10px) scale(1.02);
}

/* mejora del botón entrar */
.btn-entrar{
background:#1c1c1c;
color:white;
border:1px solid #444;
transition:0.3s;
}

.btn-entrar:hover{
background:#333;
}

/* mejora botón comprar */
.btn-comprar{
background:#f6a622;
color:black;
font-weight:700;
transition:0.3s;
}

.btn-comprar:hover{
background:#ffb733;
}

/* títulos más elegantes */
.curso-card h3{
font-weight:700;
letter-spacing:0.5px;
}

/* mejora del subtítulo */
p{
font-size:15px;
line-height:1.6;
}
.curso-card{
border:1px solid #1e1e1e;
}
/* Resaltar el texto debajo del título */
.cursos-grid + p,
h2 + p + p{
color:#333 !important;
font-weight:600;
font-size:18px;
margin-top:10px;
}/* End custom CSS */