/* CNB easy navigation buttons */
.niveles-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:1rem!important;
  margin:0 auto 2rem!important;
  max-width:1100px!important;
  padding:0 1rem!important;
}
@media (max-width:900px){.niveles-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:560px){.niveles-grid{grid-template-columns:1fr!important}}
.nivel-card{
  background:#fff!important;
  border:1px solid #d1d5db!important;
  border-radius:14px!important;
  padding:1.35rem 1rem!important;
  text-align:center!important;
  cursor:pointer!important;
  box-shadow:0 1px 3px rgba(0,0,0,.08)!important;
  color:#1f2937!important;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease!important;
}
.nivel-card:hover{
  transform:translateY(-3px)!important;
  border-color:#2B9BA6!important;
  box-shadow:0 10px 24px rgba(43,155,166,.18)!important;
}
.nivel-card .nivel-title, .nivel-card h3{
  color:#111827!important;
  font-size:1.15rem!important;
  margin:.5rem 0 .35rem!important;
}
.nivel-card .nivel-desc, .nivel-card p{
  color:#4b5563!important;
  font-size:.92rem!important;
}
.nivel-badges{display:flex!important;flex-wrap:wrap!important;gap:.4rem!important;justify-content:center!important;margin-top:.7rem!important}
.badge-sm{display:inline-block!important;background:#ecfeff!important;color:#0f766e!important;border:1px solid #99f6e4!important;border-radius:999px!important;padding:.2rem .55rem!important;font-size:.75rem!important}
.modal-overlay{position:fixed!important;inset:0!important;background:rgba(15,23,42,.55)!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:2000!important;padding:1rem!important}
.modal-content{background:#fff!important;border-radius:16px!important;max-width:920px!important;width:100%!important;max-height:90vh!important;overflow:auto!important;padding:1.25rem!important}
.grados-select-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))!important;gap:.75rem!important}
.grado-select-btn{cursor:pointer!important;padding:1rem!important;border:1px solid #e5e7eb!important;border-radius:12px!important;background:#fff!important}
.grado-select-btn:hover{border-color:#2B9BA6!important}