.elementor-7688 .elementor-element.elementor-element-f815981{--display:flex;}.elementor-7688 .elementor-element.elementor-element-fcb785e{--display:flex;}.elementor-7688 .elementor-element.elementor-element-8c5120e{--display:flex;}/* Start custom CSS for html, class: .elementor-element-0a77df7 *//* =====================================
 HERO - HORARIOS ACADÉMICOS
 IESPP POMABAMBA
===================================== */

.ha-hero,
.ha-hero * {
  box-sizing: border-box;
}

.ha-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 28px 20px 78px;
  background: linear-gradient(
    120deg,
    #053a61 0%,
    #07558e 52%,
    #1268b3 100%
  );
}

.ha-hero::before {
  content: "";
  position: absolute;
  width: 430px;
  height: 430px;
  top: -240px;
  right: -160px;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
}

.ha-container {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
}

/* NAVEGACIÓN */

.ha-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 55px;
  font-size: 12px;
}

.ha-breadcrumb a {
  color: rgba(255,255,255,.75) !important;
  text-decoration: none !important;
}

.ha-breadcrumb a:hover {
  color: #f7c843 !important;
}

.ha-breadcrumb > span {
  color: rgba(255,255,255,.4);
}

.ha-breadcrumb strong {
  color: #ffffff;
  font-weight: 700;
}

/* DISTRIBUCIÓN */

.ha-grid {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr);
  align-items: center;
  gap: 60px;
}

.ha-content {
  min-width: 0;
}

.ha-label {
  display: inline-block;
  margin-bottom: 20px;
  color: #f7c843;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
}

/* TÍTULO */

.ha-content h1 {
  margin: 0 0 23px !important;
  color: #ffffff !important;
  font-size: clamp(38px,5vw,61px) !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  letter-spacing: -1.3px;
}

.ha-content h1 span {
  display: block;
  color: #f7c843 !important;
}

.ha-content p {
  max-width: 590px;
  margin: 0 0 30px !important;
  color: rgba(255,255,255,.85) !important;
  font-size: 16px !important;
  line-height: 1.8 !important;
}

/* BOTONES */

.ha-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
}

.ha-btn-primary,
.ha-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  padding: 13px 19px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none !important;
  transition: .25s ease;
}

.ha-btn-primary {
  background: #f7c843;
  color: #173a54 !important;
}

.ha-btn-primary:hover {
  background: #ffe17c;
  color: #173a54 !important;
  transform: translateY(-3px);
}

.ha-btn-secondary {
  border: 1px solid rgba(255,255,255,.3);
  background: rgba(255,255,255,.08);
  color: #ffffff !important;
}

.ha-btn-secondary:hover {
  background: rgba(255,255,255,.17);
  color: #ffffff !important;
  transform: translateY(-3px);
}

/* PANEL VISUAL */

.ha-visual {
  width: 100%;
  max-width: 350px;
  justify-self: center;
  padding: 33px 30px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 22px;
  background: rgba(255,255,255,.12);
  box-shadow: 0 20px 55px rgba(0,0,0,.16);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.ha-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 75px !important;
  height: 75px !important;
  min-width: 75px !important;
  min-height: 75px !important;
  max-width: 75px !important;
  max-height: 75px !important;
  flex: 0 0 75px !important;
  margin-bottom: 25px;
  border-radius: 19px;
  background: #f7c843;
}

.ha-icon svg {
  display: block !important;
  width: 39px !important;
  height: 39px !important;
  min-width: 39px !important;
  min-height: 39px !important;
  max-width: 39px !important;
  max-height: 39px !important;
  flex: 0 0 39px !important;
  margin: 0 !important;
  padding: 0 !important;
  fill: none !important;
  stroke: #053a61 !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.ha-visual-label {
  display: block;
  margin-bottom: 10px;
  color: #f7c843;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.1px;
}

.ha-visual > strong {
  display: block;
  color: #ffffff;
  font-size: 25px;
  line-height: 1.3;
}

.ha-line {
  width: 46px;
  height: 3px;
  margin: 22px 0;
  border-radius: 3px;
  background: #f7c843;
}

.ha-info {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 15px;
  color: rgba(255,255,255,.9);
  font-size: 13px;
}

.ha-info span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  min-width: 43px;
  height: 30px;
  border-radius: 7px;
  background: rgba(247,200,67,.16);
  color: #f7c843;
  font-size: 11px;
  font-weight: 800;
}

.ha-footer {
  margin-top: 25px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.15);
  color: rgba(255,255,255,.6);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.4px;
}

/* TABLET */

@media (max-width: 1024px) {
  .ha-grid {
    gap: 30px;
  }

  .ha-content h1 {
    font-size: 46px !important;
  }
}

/* MÓVIL */

@media (max-width: 767px) {
  .ha-hero {
    padding: 24px 16px 55px;
  }

  .ha-breadcrumb {
    margin-bottom: 35px;
    gap: 7px;
    font-size: 11px;
  }

  .ha-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .ha-content h1 {
    font-size: clamp(36px,9vw,47px) !important;
  }

  .ha-content p {
    font-size: 14px !important;
  }

  .ha-visual {
    max-width: 330px;
    padding: 27px 24px;
  }
}

@media (max-width: 380px) {
  .ha-actions {
    flex-direction: column;
  }

  .ha-btn-primary,
  .ha-btn-secondary {
    width: 100%;
  }
}

/* ACCESIBILIDAD */

.ha-hero a:focus-visible {
  outline: 3px solid #f7c843;
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .ha-hero a {
    transition: none !important;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7a53c90 *//* ==================================================
 IESPP POMABAMBA
 HORARIOS ACADÉMICOS
 PROGRAMAS + CICLOS + PDF + MODAL
================================================== */

.ha-consulta,
.ha-consulta * {
  box-sizing: border-box;
}

.ha-consulta {
  width: 100%;
  padding: 75px 20px 85px;
  background: #f8fafc;
}

.ha-consulta-wrap {
  max-width: 1180px;
  margin: 0 auto;
}

/* ENCABEZADO */

.ha-consulta-head {
  max-width: 760px;
  margin: 0 auto 40px;
  text-align: center;
}

.ha-consulta-kicker {
  display: inline-block;
  color: #1268b3;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.3px;
}

.ha-consulta-head h2 {
  margin: 12px 0 15px !important;
  color: #12344d !important;
  font-size: clamp(28px, 3vw, 38px) !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}

.ha-consulta-head p {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
}

/* =====================================
   TARJETAS DE PROGRAMAS
===================================== */

.ha-programas {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.ha-programa {
  display: flex;
  align-items: center;
  gap: 15px;

  min-width: 0;
  min-height: 145px;
  padding: 22px 18px;

  border: 1px solid #dce8f2 !important;
  border-radius: 17px;

  background: #ffffff !important;
  text-align: left;
  cursor: pointer;

  box-shadow: 0 8px 25px rgba(19,52,77,.06);
  transition: .25s ease;
}

.ha-programa:hover {
  transform: translateY(-5px);
  border-color: #1268b3 !important;
  box-shadow: 0 14px 30px rgba(19,52,77,.12);
}

.ha-programa.activo {
  background: #eff8ff !important;
  border-color: #1268b3 !important;
  box-shadow: 0 12px 28px rgba(18,104,179,.12);
}

.ha-programa-icono {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  flex: 0 0 60px !important;

  border-radius: 15px;
  background: #e8f4fd;
  color: #1268b3;
}

.ha-programa-icono svg {
  display: block !important;

  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  max-width: 30px !important;
  max-height: 30px !important;

  margin: 0 !important;
  padding: 0 !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.ha-programa-texto {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.ha-programa-texto small {
  color: #1268b3;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .8px;
}

.ha-programa-texto strong {
  color: #173a54;
  font-size: 17px;
  line-height: 1.3;
  font-weight: 800;
}

.ha-programa-texto > span {
  color: #687b8e;
  font-size: 11px;
}

.ha-programa-flecha {
  align-self: flex-start;
  color: #1268b3;
  font-size: 20px;
}

/* =====================================
   PANEL DE CICLOS Y RESULTADOS
===================================== */

.ha-ciclos-panel,
.ha-resultados {
  margin-top: 30px;
  padding: 30px;

  border: 1px solid #e0e7ee;
  border-radius: 18px;

  background: #ffffff;
  box-shadow: 0 10px 32px rgba(19,52,77,.055);

  scroll-margin-top: 100px;
}

.ha-ciclos-panel[hidden],
.ha-resultados[hidden],
.ha-documentos[hidden],
.ha-vacio[hidden] {
  display: none !important;
}

.ha-panel-head,
.ha-resultados-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 15px;

  margin-bottom: 25px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e5edf4;
}

.ha-panel-head h3,
.ha-resultados-head h3 {
  margin: 8px 0 !important;
  color: #173a54 !important;
  font-size: 26px !important;
  font-weight: 800 !important;
}

.ha-panel-head p,
.ha-resultados-head p {
  margin: 0 !important;
  color: #687b8e !important;
  font-size: 13px !important;
}

.ha-panel-cerrar {
  padding: 10px 15px;

  border: 1px solid #dce8f2 !important;
  border-radius: 9px;

  background: #f2f7fb !important;
  color: #49657c !important;

  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

/* =====================================
   DIEZ CICLOS
===================================== */

.ha-ciclos-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.ha-ciclo {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  min-width: 0;
  min-height: 165px;
  padding: 18px;

  border: 1px solid #dce8f2 !important;
  border-radius: 14px;

  background: #ffffff !important;
  text-align: left;
  cursor: pointer;

  transition: .25s ease;
}

.ha-ciclo:hover,
.ha-ciclo.activo {
  border-color: #1268b3 !important;
  background: #eff8ff !important;
  box-shadow: 0 8px 22px rgba(18,104,179,.1);
}

.ha-ciclo-numero {
  position: absolute;
  top: 15px;
  right: 15px;
  color: #b0c5d6;
  font-size: 11px;
  font-weight: 800;
}

.ha-ciclo-icono {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  max-width: 48px !important;
  max-height: 48px !important;
  flex: 0 0 48px !important;

  margin-bottom: 13px;
  border-radius: 12px;

  background: linear-gradient(
    135deg,
    #2187db,
    #1268b3
  );

  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
}

.ha-ciclo strong {
  color: #173a54;
  font-size: 17px;
  font-weight: 800;
}

.ha-ciclo small {
  margin-top: 5px;
  color: #687b8e;
  font-size: 11px;
}

.ha-ciclo-flecha {
  position: absolute;
  right: 15px;
  bottom: 13px;
  color: #1268b3;
  font-size: 18px;
}

/* =====================================
   TARJETAS DE DOCUMENTOS
===================================== */

.ha-documentos {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.ha-documento {
  display: flex;
  align-items: center;
  gap: 17px;

  padding: 18px;
  border: 1px solid #e0e7ee;
  border-radius: 12px;

  background: #ffffff;
  box-shadow: 0 4px 15px rgba(19,52,77,.055);
}

.ha-documento-icono {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  flex: 0 0 52px !important;

  border-radius: 12px;
  background: #fff0f0;
  color: #df3f3f;
}

.ha-documento-icono svg {
  display: block !important;

  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  min-height: 27px !important;
  max-width: 27px !important;
  max-height: 27px !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.ha-documento-contenido {
  flex: 1;
  min-width: 0;
}

.ha-documento-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 8px;
}

.ha-documento-tag,
.ha-documento-periodo {
  padding: 4px 8px;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 800;
}

.ha-documento-tag {
  background: #dff0ff;
  color: #0874d4;
}

.ha-documento-periodo {
  background: #fff3db;
  color: #a96710;
}

.ha-documento-contenido h4 {
  margin: 0 !important;
  color: #173a54 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

/* BOTONES */

.ha-documento-acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ha-accion {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 39px;
  padding: 9px 13px;

  border: 0 !important;
  border-radius: 8px;

  font-family: inherit;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  cursor: pointer;
}

.ha-accion-ver {
  background: #e8f4fd !important;
  color: #1268b3 !important;
}

.ha-accion-ver:hover {
  background: #d5eaf9 !important;
  color: #053a61 !important;
}

.ha-accion-pdf {
  background: #df3f3f !important;
  color: #ffffff !important;
}

.ha-accion-pdf:hover {
  background: #c52d2d !important;
  color: #ffffff !important;
}

/* =====================================
   MENSAJE SIN HORARIOS
===================================== */

.ha-vacio {
  padding: 35px 20px;
  border: 1px dashed #cbddeb;
  border-radius: 12px;
  background: #f8fbfe;
  text-align: center;
}

.ha-vacio-icono {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 65px;
  height: 65px;
  margin: 0 auto 15px;

  border-radius: 16px;
  background: #eaf5fd;
}

.ha-vacio-icono svg {
  display: block !important;

  width: 33px !important;
  height: 33px !important;
  min-width: 33px !important;
  min-height: 33px !important;
  max-width: 33px !important;
  max-height: 33px !important;

  fill: none !important;
  stroke: #1268b3 !important;
  stroke-width: 1.8 !important;
}

.ha-vacio h4 {
  margin: 0 0 10px !important;
  color: #173a54 !important;
  font-size: 18px !important;
}

.ha-vacio p {
  margin: 0 !important;
  color: #687b8e !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
}

/* NOTA */

.ha-consulta-nota {
  margin-top: 28px;
  padding: 18px 21px;

  border-left: 4px solid #f7c843;
  border-radius: 9px;

  background: #f2f8fd;
  color: #49657c;

  font-size: 13px;
  line-height: 1.7;
}

/* =====================================
   MODAL PDF
===================================== */

.ha-modal[hidden] {
  display: none !important;
}

body.ha-modal-abierto {
  overflow: hidden !important;
}

.ha-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;

  display: flex !important;
  align-items: center;
  justify-content: center;

  padding: 18px;
  background: rgba(4,22,39,.82);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.ha-modal-contenido {
  display: flex;
  flex-direction: column;

  width: min(1100px, 100%);
  height: min(92vh, 900px);
  height: min(92dvh, 900px);

  overflow: hidden;
  border-radius: 17px;

  background: #ffffff;
  box-shadow: 0 25px 75px rgba(0,0,0,.35);
}

/* CABECERA MODAL */

.ha-modal-cabecera {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;

  padding: 18px 24px;

  background: linear-gradient(
    110deg,
    #053a61,
    #1268b3
  );
}

.ha-modal-cabecera > div {
  min-width: 0;
}

.ha-modal-cabecera span {
  display: block;
  margin-bottom: 7px;

  color: #f7c843;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
}

.ha-modal-cabecera h3 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: 19px !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
}

.ha-modal-cerrar {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 39px !important;
  height: 39px !important;
  min-width: 39px !important;

  padding: 0 !important;

  border: 1px solid rgba(255,255,255,.3) !important;
  border-radius: 10px;

  background: rgba(255,255,255,.13) !important;
  color: #ffffff !important;

  font-size: 27px !important;
  line-height: 1 !important;
  cursor: pointer;
}

.ha-modal-cerrar:hover {
  background: rgba(255,255,255,.25) !important;
}

/* VISOR PDF */

.ha-modal-cuerpo {
  flex: 1;
  min-height: 0;
  background: #e8edf2;
}

.ha-modal-cuerpo iframe {
  display: block !important;

  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;

  background: #ffffff;
}

/* PIE DEL MODAL */

.ha-modal-pie {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;

  padding: 15px 22px;

  border-top: 1px solid #e0e7ee;
  background: #ffffff;
}

.ha-modal-descargar,
.ha-modal-volver {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 41px;
  padding: 10px 17px;

  border-radius: 9px;

  font-size: 12px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  cursor: pointer;
}

.ha-modal-descargar {
  border: 1px solid #df3f3f !important;
  background: #df3f3f !important;
  color: #ffffff !important;
}

.ha-modal-descargar:hover {
  background: #bd2b2b !important;
  color: #ffffff !important;
}

.ha-modal-volver {
  border: 1px solid #dce8f2 !important;
  background: #f2f7fb !important;
  color: #173a54 !important;
}

/* =====================================
   RESPONSIVE TABLET
===================================== */

@media (max-width: 1024px) {

  .ha-programas {
    grid-template-columns: 1fr;
  }

  .ha-ciclos-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

}

/* =====================================
   RESPONSIVE MÓVIL
===================================== */

@media (max-width: 767px) {

  .ha-consulta {
    padding: 55px 16px 65px;
  }

  .ha-ciclos-panel,
  .ha-resultados {
    padding: 20px 14px;
  }

  .ha-ciclos-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
  }

  .ha-ciclo {
    min-height: 155px;
    padding: 15px;
  }

  .ha-documento {
    flex-wrap: wrap;
    gap: 12px;
    padding: 14px;
  }

  .ha-documento-acciones {
    width: 100%;
  }

  .ha-accion {
    flex: 1;
  }

  .ha-panel-head h3,
  .ha-resultados-head h3 {
    font-size: 22px !important;
  }

  /* MODAL MÓVIL */

  .ha-modal {
    padding: 8px;
  }

  .ha-modal-contenido {
    width: 100%;
    height: 96vh;
    height: 96dvh;
    border-radius: 12px;
  }

  .ha-modal-cabecera {
    padding: 14px;
  }

  .ha-modal-cabecera h3 {
    font-size: 15px !important;
  }

  .ha-modal-pie {
    padding: 12px;
    gap: 8px;
  }

  .ha-modal-descargar,
  .ha-modal-volver {
    flex: 1;
    padding: 10px 8px;
    font-size: 11px !important;
  }

}

@media (max-width: 380px) {

  .ha-ciclos-grid {
    grid-template-columns: 1fr;
  }

}

/* ACCESIBILIDAD */

.ha-consulta button:focus-visible,
.ha-consulta a:focus-visible {
  outline: 3px solid #f7c843;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {

  .ha-consulta button {
    transition: none !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-06a47a5 *//* NAVEGACIÓN INFERIOR - SÍLABOS ACADÉMICOS */

.san-nav,
.san-nav * {
  box-sizing: border-box;
}

.san-nav {
  width: 100%;
  padding: 65px 20px 75px;
  background: #f2f7fb;
  border-top: 1px solid #e0eaf3;
}

.san-container {
  max-width: 1180px;
  margin: 0 auto;
}

.san-heading {
  max-width: 740px;
  margin: 0 auto 35px;
  text-align: center;
}

.san-kicker {
  display: inline-block;
  margin-bottom: 12px;
  color: #1268b3;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.3px;
}

.san-heading h2 {
  margin: 0 0 14px !important;
  color: #12344d !important;
  font-size: clamp(25px, 3vw, 34px) !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

.san-heading p {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
}

/* TARJETAS */

.san-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.san-card {
  display: flex;
  align-items: center;
  gap: 15px;
  min-width: 0;
  min-height: 128px;
  padding: 22px 19px;

  background: #fff;
  border: 1px solid #dce8f2;
  border-radius: 16px;

  box-shadow: 0 7px 24px rgba(19,52,77,.055);
  text-decoration: none !important;
  transition: .25s ease;
}

.san-card:hover {
  transform: translateY(-5px);
  border-color: #1268b3;
  box-shadow: 0 14px 35px rgba(19,52,77,.12);
}

.san-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 53px !important;
  height: 53px !important;
  min-width: 53px !important;
  min-height: 53px !important;
  max-width: 53px !important;
  max-height: 53px !important;
  flex: 0 0 53px !important;

  border-radius: 14px;
  background: #e9f4fc;
  color: #1268b3;
}

.san-icon svg {
  display: block !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.san-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.san-content small {
  color: #1268b3;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
}

.san-content strong {
  color: #173a54;
  font-size: 16px;
  line-height: 1.3;
  font-weight: 800;
}

.san-content > span {
  color: #687b8e;
  font-size: 11px;
  line-height: 1.5;
}

.san-arrow {
  align-self: flex-start;
  color: #1268b3;
  font-size: 20px;
  font-weight: 700;
}

/* TARJETA DESTACADA */

.san-featured {
  background: linear-gradient(135deg, #07528f, #1268b3);
  border-color: #1268b3;
}

.san-featured .san-icon {
  background: rgba(255,255,255,.15);
  color: #f7c843;
}

.san-featured .san-content small,
.san-featured .san-arrow {
  color: #f7c843;
}

.san-featured .san-content strong {
  color: #fff;
}

.san-featured .san-content > span {
  color: rgba(255,255,255,.82);
}

.san-featured:hover {
  border-color: #f7c843;
}

/* ENLACE INFERIOR */

.san-bottom {
  margin-top: 32px;
  text-align: center;
}

.san-bottom a {
  color: #1268b3 !important;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none !important;
}

.san-bottom a:hover {
  color: #053a61 !important;
  text-decoration: underline !important;
}

/* RESPONSIVE */

@media (max-width: 1024px) {
  .san-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 650px) {
  .san-nav {
    padding: 50px 16px 60px;
  }

  .san-grid {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .san-card {
    min-height: 105px;
    padding: 18px 16px;
  }

  .san-content strong {
    font-size: 15px;
  }
}

.san-card:focus-visible,
.san-bottom a:focus-visible {
  outline: 3px solid #f7c843;
  outline-offset: 4px;
}/* End custom CSS */