.teachers-section{


    padding:120px 0;


}



.teachers-grid{

    margin-top:70px;

    display:grid;

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

    gap:35px;

}



.teacher-card{

    position:relative;

    overflow:hidden;

    background:

    rgba(255,255,255,.08);


    border:

    1px solid rgba(255,255,255,.12);


    border-radius:35px;


    padding:35px 25px;


    text-align:center;


    transition:.4s;


}



.teacher-card::before{

    content:"";

    position:absolute;

    width:200px;

    height:200px;


    background:

    radial-gradient(
        circle,
        rgba(123,223,242,.35),
        transparent 70%
    );


    top:-100px;

    right:-100px;


    transition:.4s;

}



.teacher-card:hover{

    transform:

    translateY(-15px);


    box-shadow:

    0 25px 70px rgba(0,0,0,.25);

}



.teacher-card:hover::before{

    transform:

    scale(1.5);

}




.teacher-avatar{

    position:relative;

    z-index:2;

}



.avatar-circle{

    width:150px;

    height:150px;


    margin:auto;


    border-radius:50%;


    overflow:hidden;


    border:

    5px solid rgba(255,255,255,.2);


    background:

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


}



.avatar-circle img{

    width:100%;

    height:100%;

    object-fit:cover;

}




.teacher-info{

    margin-top:30px;

}



.teacher-info h3{

    font-size:28px;

}



.teacher-info span{

    display:block;

    margin-top:10px;

    color:

    var(--yellow);

    font-weight:bold;

}



.teacher-info p{

    margin-top:20px;

    line-height:2;

    color:

    var(--text-muted);

}




.teacher-level{

    margin-top:25px;


    display:inline-block;


    padding:8px 20px;


    border-radius:999px;


    background:

    rgba(58,134,255,.15);


    color:

    var(--cyan);


    font-size:14px;

}



@media(max-width:900px){


    .teachers-grid{

        grid-template-columns:1fr;

    }

}