/* FONT OPTIMIZATION - OPTIMIZACIÓN DE FUENTES PARA PREVENIR LAYOUT SHIFT */

/* Configuración de font-display para todas las fuentes */
@font-face {
  font-family: 'Bootstrap Icons';
  font-display: swap;
}

/* Prevenir layout shift en elementos de texto críticos */
.display-5,
.display-6,
.fs-5,
.lead,
.process-title,
.step-title,
.cta-title {
  font-display: swap;
  font-size-adjust: 0.5;
  contain: layout style;
  min-height: 1.2em;
  display: block;
}

/* Reservar espacio para fuentes que pueden cambiar */
.fw-bold,
.fw-normal,
.fw-light {
  font-display: swap;
  contain: layout style;
  min-width: 1em;
}

/* Optimizar carga de iconos */
.bi {
  font-display: swap;
  contain: layout style;
  min-width: 1em;
  display: inline-block;
}

/* Prevenir layout shift en elementos con texto dinámico */
.text-center,
.text-left,
.text-right {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto específicos del proceso */
.process-subtitle,
.step-description,
.cta-description {
  font-display: swap;
  contain: layout style;
  min-height: 2em;
  display: block;
}

/* Optimizar elementos de estadísticas */
.stat-number,
.stat-label {
  font-display: swap;
  contain: layout style;
  min-height: 1.5em;
  display: block;
}

/* Optimizar elementos de beneficios */
.benefit {
  font-display: swap;
  contain: layout style;
  min-height: 1.5em;
  display: flex;
  align-items: center;
}

/* Optimizar elementos de badges */
.process-badge {
  font-display: swap;
  contain: layout style;
  min-height: 2.5em;
  display: inline-flex;
  align-items: center;
}

/* Optimizar elementos de números */
.step-number {
  font-display: swap;
  contain: layout style;
  min-width: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Optimizar elementos de iconos */
.step-icon {
  font-display: swap;
  contain: layout style;
  min-width: 60px;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Optimizar botones */
.btn-primary,
.btn-secondary {
  font-display: swap;
  contain: layout style;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Optimizar elementos de texto con clases Bootstrap */
.fs-1, .fs-2, .fs-3, .fs-4, .fs-5, .fs-6 {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de peso */
.fw-bold, .fw-bolder, .fw-normal, .fw-light, .fw-lighter {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de alineación */
.text-start, .text-center, .text-end, .text-justify {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de transformación */
.text-uppercase, .text-lowercase, .text-capitalize {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de decoración */
.text-decoration-none, .text-decoration-underline, .text-decoration-line-through {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de línea */
.lh-1, .lh-sm, .lh-base, .lh-lg {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de espaciado */
.ls-1, .ls-tight, .ls-wide {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de color */
.text-primary, .text-secondary, .text-success, .text-danger, .text-warning, .text-info, .text-light, .text-dark {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de opacidad */
.opacity-0, .opacity-25, .opacity-50, .opacity-75, .opacity-100 {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de visibilidad */
.visible, .invisible {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de cursor */
.cursor-pointer, .cursor-default, .cursor-move, .cursor-not-allowed {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de selección */
.user-select-all, .user-select-auto, .user-select-none {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de eventos */
.pe-auto, .pe-none {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de z-index */
.z-0, .z-1, .z-2, .z-3 {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de float */
.float-start, .float-end, .float-none {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de clear */
.clearfix {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de object-fit */
.object-fit-contain, .object-fit-cover, .object-fit-fill, .object-fit-none, .object-fit-scale-down {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de object-position */
.object-position-center, .object-position-top, .object-position-bottom, .object-position-start, .object-position-end {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de overflow */
.overflow-auto, .overflow-hidden, .overflow-visible, .overflow-scroll {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de overflow-x/y */
.overflow-x-auto, .overflow-x-hidden, .overflow-x-visible, .overflow-x-scroll,
.overflow-y-auto, .overflow-y-hidden, .overflow-y-visible, .overflow-y-scroll {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de resize */
.resize {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de min/max width/height */
.min-vw-100, .min-vh-100, .vw-100, .vh-100 {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de aspect-ratio */
.ratio, .ratio-1x1, .ratio-4x3, .ratio-16x9, .ratio-21x9 {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de fixed-top/bottom */
.fixed-top, .fixed-bottom {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de sticky-top */
.sticky-top {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de d-print */
.d-print-block, .d-print-inline, .d-print-inline-block, .d-print-none {
  font-display: swap;
  contain: layout style;
}

/* Optimizar elementos de texto con clases de d-* responsive */
@media (min-width: 576px) {
  .d-sm-block, .d-sm-inline, .d-sm-inline-block, .d-sm-flex, .d-sm-none {
    font-display: swap;
    contain: layout style;
  }
}

@media (min-width: 768px) {
  .d-md-block, .d-md-inline, .d-md-inline-block, .d-md-flex, .d-md-none {
    font-display: swap;
    contain: layout style;
  }
}

@media (min-width: 992px) {
  .d-lg-block, .d-lg-inline, .d-lg-inline-block, .d-lg-flex, .d-lg-none {
    font-display: swap;
    contain: layout style;
  }
}

@media (min-width: 1200px) {
  .d-xl-block, .d-xl-inline, .d-xl-inline-block, .d-xl-flex, .d-xl-none {
    font-display: swap;
    contain: layout style;
  }
}

@media (min-width: 1400px) {
  .d-xxl-block, .d-xxl-inline, .d-xxl-inline-block, .d-xxl-flex, .d-xxl-none {
    font-display: swap;
    contain: layout style;
  }
}