body{

    font-family:Poppins,sans-serif;

}

.panel-lateral{

    background:linear-gradient(180deg,#0B3C6D,#062849);

    color:white;

    min-height:750px;

    padding:40px;

}

.logo-panel{

    text-align:center;

    margin-bottom:20px;

}

.logo-colegio{

    width:130px;

}

.titulo-panel{

    text-align:center;

    font-weight:700;

}

.subtitulo-panel{

    text-align:center;

    margin-top:20px;

}

.descripcion-panel{

    text-align:center;

    opacity:.9;

}

.timeline{

    margin-top:40px;

}

.timeline-item{

    padding:12px;

    border-left:3px solid rgba(255,255,255,.3);

    margin-bottom:15px;

}

.timeline-item.activo{

    border-left:4px solid #FFC107;

    font-weight:bold;

}

.encabezado{

    padding:35px;

    background:#F8F9FA;

    border-bottom:1px solid #DDD;

}

.barra{

    width:100%;

    background:#DDD;

    border-radius:30px;

    height:10px;

}

.barra-progreso{

    width:25%;

    height:10px;

    background:#28A745;

    border-radius:30px;

    transition:.4s;

}

.paso{

    padding:35px;

}

.info-contacto{

    margin-top:60px;

}

.form-control{

    height:48px;

    border-radius:10px;

}

.btn{

    border-radius:10px;

}
.paso{
    display:none;
}

.paso.activo{
    display:block;
}

.tituloPaso{
    display:flex;
    align-items:center;
    gap:20px;
}

.iconPaso{

    width:70px;

    height:70px;

    border-radius:20px;

    background:#EAF4FF;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:28px;

    color:#0A3D62;

}

.form-control{

    transition:.25s;

}

.form-control:focus{

    transform:scale(1.02);

    box-shadow:0 0 0 .2rem rgba(13,110,253,.15);

}

.opcion-panel{
    cursor:pointer;
    transition:.2s;
}

.opcion-panel:hover{
    background:#f5f5f5;
    color:#0d6efd;
    border-radius:6px;
}