/* ==========================================================================
   SIRMAI — KPIs adaptados a página interior (con menú lateral)
   --------------------------------------------------------------------------
   El CSS global de .section-indicadores (style.css, BATCH 11) está pensado para
   el HOME a ancho completo: grid de 4 columnas + margin-top negativo para
   pegarse al banner + números gigantes (clamp hasta 4.25rem).

   En esta página interior el contenido vive dentro de .main-default.con-sidebar
   (ancho reducido por el menú lateral) y NO hay banner. Con el CSS del home, los
   números se partían ("4.732" -> "4.7" / "32") y el 5º KPI caía suelto.

   Este override está SCOPEADO a .main-default (solo páginas interiores), así que
   NO afecta el home. Mantiene la identidad visual (números naranja, labels
   verdes); NO redefine la paleta :root ni la tipografía base.
   ========================================================================== */

.main-default .section-indicadores {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
    gap: clamp(20px, 2.5vw, 32px) !important;
    margin-top: 0 !important;                 /* no hay banner al cual pegarse */
    padding: clamp(24px, 3vw, 40px) 0 !important;
}

.main-default .section-indicadores .indicador-box {
    border-left: none !important;             /* los separadores verticales se rompen al envolver */
    padding: 0 8px !important;
    text-align: center !important;
    min-width: 0 !important;
    display: flex !important;                 /* contenido anclado arriba → todos los números a la misma altura */
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

/* El número (h3) ocupa una franja de altura fija para que el label arranque
   igual en todos, sin importar cuántas líneas tenga el texto de arriba. */
.main-default .section-indicadores .indicador-box h3 {
    margin-bottom: 8px !important;
}

.main-default .section-indicadores .indicador-box h3 {
    white-space: nowrap !important;           /* el número NUNCA se parte */
    font-size: clamp(1.8rem, 2.6vw, 2.4rem) !important;
}

/* Móvil (≤600px, breakpoint del proyecto): 2 columnas, números sin partirse */
@media (max-width: 600px) {
    .main-default .section-indicadores {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 24px 12px !important;
    }
    .main-default .section-indicadores .indicador-box h3 {
        font-size: clamp(1.7rem, 7vw, 2.2rem) !important;
    }
}