.letracolor{
    color: #2626fe !important;
}
.letracolor2{
    color: #003399 !important;
}
.letrasmll{
    font-size: 11px !important};
}
.btn-outline-purple {
    --bs-btn-color: #007bff;
    --bs-btn-border-color: #007bff;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #007bff;
    --bs-btn-hover-border-color: #007bff;
    --bs-btn-focus-shadow-rgb: 111, 66, 193;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #007bff;
    --bs-btn-active-border-color: #007bff;
}

/* Clase para convertir secciones oscuras a blancas */
.white-mode-section-body {
    background-color: #ffffff !important;
}

.white-mode-section {
    background-color: #ffffff !important;
    color: #333333 !important;
}



/* Ajuste de encabezados y párrafos dentro de secciones blancas */
.white-mode-section h2, 
.white-mode-section h3, 
.white-mode-section h4, 
.white-mode-section p, 
.white-mode-section span,
.white-mode-section .inspeccion-description,
.white-mode-section .inspeccion-app-item p,
.white-mode-section .inspeccion-solicitamos-text p {
    color: #333333 !important;
}

/* Mantener elementos que deben seguir siendo oscuros o morados */
.white-mode-section .section-title-blu,
.white-mode-section .inspeccion-app-item i,
.white-mode-section .inspeccion-solicitamos-icon {
    color: #0000ff !important;
}

/* Ajuste para tarjetas dentro de secciones blancas */
.white-mode-section .drone-card {
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
}

.white-mode-section .capacity-box {
    background: #ffffff !important;
    border: 1px solid #ddd !important;
}

.white-mode-section .capacity-box .liters {
    color: #333333 !important;
}



/*** Áreas de Capacitación ***/
.areasdeinspeccion-section {
    background-color: #ffffff;
    padding: 0px 0;
}
.areasdeinspeccion-section .container { position: relative; z-index: 1; }


.areasdeinspeccion-section .card {
    border-radius: 15px;
    border: 1px solid #eef2f7 !important;
    overflow: visible; /* Crucial para que el icono se monte sobre la imagen */
    transition: none !important; /* Eliminado cualquier movimiento en hover */
}

.areasdeinspeccion-section .card-img-top {
    height: 160px;
    object-fit: cover;
}

/* El círculo azul */
.areasdeinspeccion-section .icon-circle {
    width: 60px;
    height: 60px;
    background-color: #0d6efd;
    color: #ffffff;
    border-radius: 50%;
    
    /* Centrado interno del icono */
    display: flex;
    align-items: center;
    justify-content: center;
    
    font-size: 28px;
    
    /* Posicionamiento: -30px sube la mitad de su alto, 20px a la izquierda */
    margin: -30px 0 15px 20px; 
    
    border: 4px solid #ffffff;
    position: relative;
    z-index: 10;
    padding: 0 !important;
}

/* Forzar el centrado del icono dentro del círculo */
.areasdeinspeccion-section .icon-circle i {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important; /* Elimina los márgenes que causan el desfase */
    line-height: 1 !important;
}

.areasdeinspeccion-section .card-body {
    padding: 0 20px 20px 20px;
    text-align: left;
}

.areasdeinspeccion-section .card-title {
    text-align: left;
    font-weight: 500;
    color: #1a1a1a;
    font-size: 18px;
    margin-bottom: 15px;
}

.areasdeinspeccion-section .card-text {
    text-align: left;
    color: #4a4a4a;
    font-size: 16px;
    margin-bottom: 8px !important;
}

.areasdeinspeccion-section .list-unstyled {
    margin-bottom: 10px !important;
}

.areasdeinspeccion-section .list-unstyled li {
    font-size: 15px;
    color: #333;
    margin-bottom: 8px;
    display: flex;
    align-items: center; 
}

/* Reduce el margen entre cada ítem de la lista */
.areasdeinspeccion-section .list-unstyled li {
    margin-bottom: 2px !important; /* Ajusta este número para acercar las líneas */
}

.areasdeinspeccion-section .list-unstyled li i {
    color: #0d6efd;
    margin-right: 8px;
    font-weight: bold;
}

.areasdeinspeccion-section .ver-mas {
    color: #0d6efd;
    font-weight: bold;
    text-decoration: none;
    font-size: 16px;
    display: block;
    margin-top: auto;
}

@media (max-width: 767px) {
    .areasdeinspeccion-section {
        padding: 40px 0;
    }
}

/**************************/



/************************/
.inspeccion-section { 
    position: relative; 
    min-height: 100vh; 
    display: flex; 
    align-items: center;
    padding: 80px 0; 
}

.inspeccion-bg { 
    position: absolute; 
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    object-fit: cover; 
    z-index: 0; 
}

.container { 
    position: relative; 
    z-index: 2; /* El contenido va encima */
}



/* Texto */
.badge-producto { color: #0000ff; font-weight: 700; letter-spacing: 2px; font-size: 15px; display: block; margin-bottom: 10px; }
.inspeccion-title { font-size: 48px; font-weight: 800; color: white; margin-bottom: 20px; }
.inspeccion-title span { color: #0000ff; }
.inspeccion-lead { font-size: 22px; font-weight: 600; color: #0000ff; margin-bottom: 20px; }
.inspeccion-description { color: #ddd; font-size: 16px; line-height: 24px; max-width: 500px; }

/* Caja de especificaciones */
.specs-panel {
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(5px);
    border: 1px solid #333;
    padding: 30px;
    border-radius: 12px;
}

.spec-row {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid #333;
}
.spec-row:last-child { border: none; }
.spec-row i { font-size: 24px; color: #0000ff; width: 30px; text-align: center; }
.spec-row small { display: block; font-weight: 300; color: #0000ff; font-size: 15px; letter-spacing: 1px; text-transform: uppercase; }
.spec-row h4 { margin: 0; font-size: 18px; color: #fff; }

/* Botones */
.btn-lg { padding: 12px 25px; font-size: 15px; }
/*.btn-danger { background-color: #0000ff; border: none; }*/
.btn-outline-light:hover { background-color: #fff; color: #000; }




/* Sección 02 Aplicaciones */
/* Asegurar que el contenedor sea flexible */
.inspeccion-applications-section-icos {
    padding: 60px 0;
    background-color: #ffffff; /* Fondo blanco como en la imagen */
    color: #105abb;
}

.contenedor-aplicaciones {
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 40px 20px;
}

.item-aplicacion {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px 10px;
    margin-bottom: 2px; /* Espacio extra entre filas en móvil */
}

.item-aplicacion i {
    font-size: 40px;
    color: #0d6efd;
    margin-bottom: 15px;
}

.item-aplicacion h5 {
    font-size: 16px;
    font-weight: 700;
    color: #333333;
    margin-bottom: 8px;
}

.item-aplicacion p {
    font-size: 14px;
    line-height: 18px;
    color: #666666;
    margin: 0;
}

/* Responsividad fija en píxeles */
@media (max-width: 992px) {
    .item-aplicacion {
        padding: 15px 5px;
    }
}

/* En móviles (hasta 576px), las filas tendrán 2 columnas por el col-6 del HTML */
@media (max-width: 576px) {
    .item-aplicacion {
        margin-bottom: 20px;
    }
    .item-aplicacion i {
        font-size: 32px; /* Un poco más pequeño en móvil para evitar encimarse */
    }
}
/*******************************/



/*******************************************************/
/***********Parte 04 de Drones de Inspeciion *********************/
.product-dron-inspection { padding: 80px 0; background-color: #ffffff; }

.section-title { font-size: 24px; font-weight: 700; color: #003399; }

.dron-card {
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.dron-card h3 { font-size: 18px !important; }

.dron-title { font-size: 20px; font-weight: 700; color: #003399; margin-bottom: 5px; }

.dron-subtitle { font-size: 14px; color: #666; margin-bottom: 20px; }

.dron-img { width: 100%; height: auto; margin-bottom: 20px; }

.dron-specs {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    font-size: 14px;
    color: #333;
}

.dron-specs li {
    margin-bottom: 10px;
    display: flex;
    align-items: flex-start;
}

.dron-specs li::before {
    content: "✓";
    color: #003399;
    font-weight: bold;
    margin-right: 10px;
}

.dron-link {
    margin-top: auto;
    text-decoration: none;
    color: #003399;
    font-weight: 600;
    font-size: 14px;
}
/**************************************/



/***********************************/

/***********************************/









/*******************/
/* Forzar cuadrícula de 8 columnas exactas */
.inspeccion-app8-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 10px;
    text-align: center;
    border: 1px solid #222;
    padding: 20px;
    border-radius: 12px;
    width: 100%;
}

.inspeccion-app-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.inspeccion-app-item i {
    font-size: 30px; 
    color: #0000ff;
}

.inspeccion-app-item p {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    margin: 0;
    color: #ccc;
}

/* Responsividad */
@media (max-width: 1200px) {
    .inspeccion-app8-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 576px) {
    .inspeccion-app8-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
/*******************/



/*********************************/
/* --- 1. SECCIÓN CTA (Fondo blanco, recuadro azul marino) --- */
.seccion-cta-carrera {
    background-color: #ffffff !important;
    padding: 60px 20px !important;
    width: 100%;
}

.seccion-cta-carrera .dmx-contenedor-interno {
    background-color: #001233 !important;
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 40px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

.seccion-cta-carrera h3 { font-size: 24px !important; color: #ffffff !important; margin: 0 0 5px 0 !important; font-weight: 700 !important; }
.seccion-cta-carrera p { font-size: 16px !important; color: #ffffff !important; margin: 0 !important; opacity: 0.9; }

.seccion-cta-carrera .dmx-icono-box {
    background-color: #0d6efd !important;
    width: 60px !important;
    height: 60px !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.seccion-cta-carrera .dmx-icono-box i { font-size: 30px !important; color: #ffffff !important; }

/* --- 2. SECCIÓN APLICACIONES (Lista con iconos) --- */
.aplicacion-industria-seccion { padding: 80px 0; background-color: #ffffff; }
.seccion-titulo { font-size: 20px; font-weight: 700; color: #003399; margin-bottom: 30px; }

.app-item {
    display: flex;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid #eeeeee;
    font-size: 16px;
    color: #333333;
}
.app-item i { margin-right: 15px; color: #003399; font-size: 20px; }

/* --- 3. SECCIÓN INDUSTRIAS (Tarjetas con icono inferior) --- */
.industrias-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; }
.industria-card { position: relative; height: 500px; border-radius: 10px; overflow: hidden; }
.industria-card img { width: 100%; height: 100%; object-fit: cover; }

.card-footer-info {
    position: absolute;
    bottom: 15px;
    left: 10px;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 600;
}
.card-footer-info i { font-size: 22px; }

/* --- RESPONSIVIDAD (Píxeles) --- */
@media (max-width: 992px) {
    .industrias-grid { grid-template-columns: repeat(5, 1fr); }
    .seccion-cta-carrera .dmx-contenedor-interno { flex-direction: column !important; text-align: center !important; }
}

@media (max-width: 768px) {
    .industrias-grid { grid-template-columns: repeat(3, 1fr); }
}

/***
 * @media (max-width: 576px) {
    .industrias-grid { grid-template-columns: 3fr; }
    */
    /* Ajuste opcional: Si quieres que las tarjetas no sean tan altas en móvil */
    @media (max-width: 576px) {
        .industria-card {
            height: 250px; /* Altura más cómoda para 2 columnas en celular */
        }
        .seccion-cta-carrera .btn-lg { width: 100% !important; }
}
/*********************************/


/************* seccion 03 *************/
.inspeccion-how-it-works { background: #0a0a0a; padding: 10px 0; color: #ffffff; }

.section-title { color: #ffffff; font-size: 28px; margin-bottom: 20px; border-left: 4px solid #0000ff; padding-left: 15px; font-weight: bold; }
.section-title-blu { color: #0000ff; font-size: 28px; margin-bottom: 20px; border-left: 4px solid #0000ff; padding-left: 15px; font-weight: bold; }

.section-desc { font-size: 15px; color: #cccccc; margin-bottom: 40px; line-height: 24px; }

/* Flujo de proceso compacto */
.process-flow { 
    display: flex; 
    justify-content: flex-start; 
    align-items: flex-start;
    gap: 10px; 
}

.step { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    text-align: center; 
    width: 60px;
}

/* El círculo */
.step i, .step-icon-svg { 
    width: 50px; 
    height: 50px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    border-radius: 50%; 
    border: 1px solid #0000ff; 
    background: #111; 
    margin-bottom: 10px; 
    color: #0000ff;
    font-size: 20px;
}

/* El SVG interno */
.step-icon-svg svg { width: 22px; height: 22px; fill: #0000ff; }

.step span { font-size: 15px; line-height: 14px; color: #ffffff; }

.sequence-arrow { 
    display: flex; 
    align-items: center; 
    margin-top: 15px; 
    color: #0000ff; 
}

/* Panel de capacidades */
.capabilities-panel { 
    display: grid; 
    grid-template-columns: repeat(5, 1fr);
    gap: 15px; 
    background: #111; 
    padding: 20px; 
    border-radius: 12px; 
}
.cap-main-img { grid-column: span 5; margin-bottom: 15px; }
.cap-main-img img { width: 100%; border-radius: 8px; }

.cap-item { display: flex; flex-direction: column; align-items: center; text-align: center; }
.cap-item i { font-size: 32px; color: #0000ff; margin-bottom: 8px; }
.cap-item span { font-size: 15px; line-height: 15px; }

@media (max-width: 992px) {
    .process-flow { flex-wrap: wrap; justify-content: center; }
    .capabilities-panel { grid-template-columns: repeat(3, 1fr); }
    .cap-main-img { grid-column: span 3; }
}

/**********************/
.drone-lineup { background: #0a0a0a; color: #ffffff; padding: 80px 0; }

.section-title { color: #ffffff; margin-bottom: 50px; font-weight: bold; border-left: 4px solid #0000ff; padding-left: 15px; }

.drone-card { 
    background: #111; 
    border: 1px solid #222; 
    padding: 25px; 
    border-radius: 12px; 
    text-align: center;
    transition: transform 0.3s ease, border-color 0.3s ease;
    height: 100%;
}

.drone-card:hover { border-color: #0000ff; transform: translateY(-10px); }

.drone-card h3 { font-size: 22px; margin-bottom: 5px; }
.model-id { color: #0000ff; font-size: 15px; display: block; margin-bottom: 20px; font-weight: bold; }

.capacity-box { 
    background: #0a0a0a; 
    padding: 15px; 
    margin: 20px 0; 
    border: 1px solid #333; 
}
.txtblucolor { color: #0000ff !important; }
.capacity-box small { display: block; color: #888; font-size: 15px; margin-bottom: 5px; }

.capacity-box .liters { font-size: 28px; font-weight: bold; color: white; }

.specs { 
    list-style: none; 
    padding: 0; 
    text-align: left; 
    font-size: 15px; 
    color: #cccccc; 
    margin-bottom: 30px; 
}
.specs li { margin-bottom: 10px; display: flex; align-items: center; }

.btn-tech { 
    display: block; 
    background: #0000ff; 
    color: white; 
    padding: 12px; 
    text-decoration: none; 
    border-radius: 6px; 
    font-weight: bold; 
    text-transform: uppercase;
    font-size: 15px;
}
.btn-tech:hover { background: #011a39; color: white; }

/* Ajustes Responsive */
@media (max-width: 768px) {
    .drone-lineup { padding: 40px 0; }
    .drone-card { margin-bottom: 20px; }
}

/*************** 05 mini items**********************/
.inspeccion-applications-section {
    background-color: #ffffff;
    padding: 10px 10px;
    color: #105abb;
}

.inspeccion-section-title {
    color: #ffffff;
    font-size: 28px;
    margin-bottom: 10px;
    border-left: 4px solid #0000ff;
    padding-left: 15px;
    font-weight: bold;
}

.inspeccion-section-title-blu {
    color: #ffffff;
    font-size: 28px;
    margin-bottom: 10px;
    border-left: 4px solid #0000ff;
    padding-left: 15px;
    font-weight: bold;
}

.inspeccion-applications-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 20px;
    align-items: start;
}

.inspeccion-app-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.inspeccion-app-item i {
    font-size: 28px;
    color: #0000ff;
    margin-bottom: 10px;
}

.inspeccion-app-item p {
    font-size: 15px;
    line-height: 1.2;
    color: #cccccc;
    margin: 10px 0 0 0;
    max-width: 120px;
    font-weight: 300;
    letter-spacing: 0.2px;
}

@media (max-width: 1024px) {
    .inspeccion-applications-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 40px 20px;
    }
}

@media (max-width: 600px) {
    .inspeccion-applications-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/*************** SECCIÓN FINAL - SOLICITAR COTIZACIÓN *********************/
.inspeccion-solicitamos-section {
    background-color: #0a0a0a;
    padding: 10px 0;
}

.inspeccion-solicitamos-card {
    background: #111;
    border: 1px solid #222;
    border-radius: 12px;
    padding: 10px 10px;
    display: flex;
    align-items: center;
    gap: 30px;
}

.inspeccion-solicitamos-icon {
    font-size: 40px;
    color: #0000ff;
}

.inspeccion-solicitamos-text {
    flex-grow: 1;
}

.inspeccion-solicitamos-text h3 {
    font-size: 20px;
    margin: 0 0 5px 0;
    color: #ffffff;
}

.inspeccion-solicitamos-text p {
    font-size: 15px;
    margin: 0;
    color: #cccccc;
}

/* Botón CTA */
.btn-cta {
    background-color: #0000ff;
    color: #ffffff;
    border: none;
    padding: 15px 30px;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 6px;
    transition: background 0.3s;
    text-decoration: none;
}

.btn-cta:hover {
    background-color: #011a39;
    color: #ffffff;
}

@media (max-width: 768px) {
    .inspeccion-solicitamos-card {
        flex-direction: column;
        text-align: center;
        padding: 30px 20px;
    }
    .inspeccion-solicitamos-icon { margin-bottom: 10px; }
}



/********Numeros estadisticas*****************/
.number-stats-section {
    padding: 10px 0;
    background-color: #ffffff; /* Fondo de la página detrás del marco */
}

.stats-wrapper {
    background-color: #011a39;
    border: 2px solid #0a1f44; /* Azul Navy oscuro */
    border-radius: 15px;
    padding: 10px 10px;
    box-shadow: 0 10px 10px rgba(0,0,0,0.05);
}

.number-stats-section i {
    color: #007bff; /* Tu azul característico */
}

.number-stats-section h3 {
    margin-bottom: 5px;
    color: #1a1a1a; /* Texto oscuro para contraste en fondo blanco */
}

.number-stats-section p {
    margin-bottom: 0;
    font-weight: 600;
    color: #555;
}

/* Divisores verticales solo en Desktop */
@media (min-width: 768px) {
    .stats-wrapper .row > div:not(:last-child) {
        border-right: 1px solid #e0e0e0;
    }
}
/*************************/


/*********Porque Capacitarte**************************/
/* Sección de Propuesta de Valor - Estilos diferenciados */
.seccion-propuesta-valor {
  padding: 40px 20px;
  background-color: #ffffff;
  width: 100%;
  box-sizing: border-box;
}

.seccion-propuesta-valor .dmx-contenedor {
  max-width: 1200px;
  margin: 10 auto;
}

/********se agrego**************/
.dmx-contenedor-cta {
    background-color: #000f29; /* Color de fondo oscuro */
    padding: 40px;             /* Aumentado de 40px a 50px (10px adicionales en los 4 lados) */
    border-radius: 16px;
    margin-bottom: 20px;      /* Opcional: para separar esta sección de la siguiente */
}

.col-cta-ajustada {
    /* Aumentamos el padding para dar aire interno a la columna */
    padding-top: 20px !important; 
    padding-bottom: 20px !important;
}

/* Ajustamos el botón para que no empuje tanto hacia abajo si es necesario */
.col-cta-ajustada .btn {
    margin-bottom: 30px !important; /* Separación clara entre botón e iconos */
}

.dmx-icono-box {
    background-color: #0d6efd;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 16px;
    flex-shrink: 0;
}
.cta-title-small {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.icon-small { font-size: 12px; line-height: 1.2; }
.icon-small i { font-size: 24px; color: #888; }

/* Ajustes responsivos */
@media (max-width: 992px) {
    .border-lg-start { border-left: none !important; margin-top: 20px; padding-top: 20px; border-top: 1px solid #333; }
    .text-lg-end { text-align: center !important; }
}
/**********************/



/* Títulos con tonos de azul */
.seccion-propuesta-valor h2 {
  font-size: 1.6rem;
  color: #002060; /* Azul oscuro */
  margin-bottom: 20px;
  line-height: 1.2;
}

.seccion-propuesta-valor .dmx-item h3 {
  font-size: 1.1rem;
  color: #002060;
  margin: 15px 0 10px 0;
}

/* Texto de párrafos y listas (mínimo 15px) */
.seccion-propuesta-valor p, 
.seccion-propuesta-valor .dmx-lista-check li {
  font-size: 16px;
  line-height: 1.6;
  color: #333;
}

/* Lista con iconos de palomitas azules */
.seccion-propuesta-valor .dmx-lista-check {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}

.seccion-propuesta-valor .dmx-lista-check li {
  margin-bottom: 12px;
  padding-left: 30px;
  position: relative;
}

.seccion-propuesta-valor .dmx-lista-check li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #0056b3; /* Azul medio para los iconos */
  font-weight: bold;
  font-size: 18px;
}

/* Grid de imágenes */
.seccion-propuesta-valor .dmx-galeria-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 25px;
  margin-top: 30px;
}

.seccion-propuesta-valor .dmx-item img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  display: block;
}

/* Tablets (min-width: 768px) */
@media (min-width: 768px) {
  .seccion-propuesta-valor .dmx-galeria-grid { 
    grid-template-columns: repeat(3, 1fr); 
  }
}

/* Desktop (min-width: 1024px) */
@media (min-width: 1024px) {
  .seccion-propuesta-valor .dmx-contenedor {
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 50px;
    align-items: start;
  }
  .seccion-propuesta-valor .dmx-galeria-grid {
    margin-top: 0;
  }
}

/* --- FIN: Estilos exclusivos para la sección propuesta de valor --- */
/***********************************/




/***********************************/
/* --- INICIO: Estilos exclusivos para la sección CTA carrera --- */
/*********************
.seccion-cta-carrera {
  background-color: #001233; 
  padding: 40px 20px;
  border-radius: 12px;
  color: #ffffff;
}
.dmx-cta-contenedor {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: center;
}
.dmx-cta-info {
  display: flex;
  align-items: center;
  gap: 20px;
}
.dmx-cta-icono {
  width: 50px;
  height: 50px;
  background-color: #0056b3;
  border-radius: 8px;
}
.dmx-cta-texto h3 {
  font-size: 1.5rem;
  margin: 0;
}
.dmx-cta-texto p {
  font-size: 16px;  
  margin: 5px 0 0 0;
  opacity: 0.9;
}
.dmx-cta-botones {
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: 100%;
}
.dmx-btn {
  padding: 15px 25px;
  text-decoration: none;
  text-align: center;
  border-radius: 6px;
  font-weight: bold;
  font-size: 16px;
  transition: 0.3s;
}
.dmx-btn-primario {
  background-color: #0056b3;
  color: white;
}
.dmx-btn-secundario {
  border: 1px solid white;
  color: white;
}
 
@media (min-width: 768px) {
  .dmx-cta-contenedor {
    flex-direction: row;
    justify-content: space-between;
  }
  .dmx-cta-botones {
    flex-direction: row;
    width: auto;
  }
}
/* --- FIN: Estilos exclusivos para la sección CTA carrera --- */
/***********************************/


/*********************/
/* --- INICIO: Estilos consolidados y finales para la sección CTA --- */

/* Contenedor principal: Fondo oscuro, padding y disposición flex */
.seccion-cta-carrera {
    background-color: #001233 !important;
    padding: 20px 20px !important;
    border-radius: 10px !important;
    margin: 0px auto !important;
    max-width: 1200px !important;
    width: 95% !important;
    display: flex !important;
    flex-direction: row !important; /* Mantiene todo en una línea */
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
}

/* Ajuste del bloque que contiene el icono y el texto */
.seccion-cta-carrera .d-flex.align-items-center.gap-3 {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
}

/* El recuadro del icono (el virrete) */
.seccion-cta-carrera .bg-primary {
    background-color: #0d6efd !important;
    padding: 15px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Tipografía: Títulos y párrafos con tamaño garantizado */
.seccion-cta-carrera h3 {
    font-size: 24px !important;
    color: #ffffff !important;
    margin: 0 0 5px 0 !important;
}

.seccion-cta-carrera p {
    font-size: 16px !important;
    color: #ffffff !important;
    margin: 0 !important;
    opacity: 0.9;
}

/* Área de los botones: En línea siempre en escritorio */
.seccion-cta-carrera .d-flex.flex-column.flex-sm-row.gap-3 {
    display: flex !important;
    flex-direction: row !important; /* Forzado a fila */
    gap: 15px !important;
    flex-shrink: 0 !important;
}

/* Ajustes responsivos para tablets y móviles */
@media (max-width: 991px) {
    .seccion-cta-carrera {
        flex-direction: column !important;
        text-align: center !important;
        padding: 25px !important;
    }

    .seccion-cta-carrera .d-flex.align-items-center.gap-3 {
        flex-direction: column !important;
    }

    .seccion-cta-carrera .d-flex.flex-column.flex-sm-row.gap-3 {
        flex-direction: column !important;
        width: 100% !important;
    }

    .seccion-cta-carrera .btn-lg {
        width: 100% !important;
        margin: 0 !important;
    }
}

/* --- Corrección para icono cuadrado --- */

.seccion-cta-carrera .dmx-icono-box {
    /* Color de fondo azul */
    background-color: #0d6efd !important; 
    
    /* MEDIDAS FIJAS PARA EL CUADRADO */
    width: 60px !important;  
    height: 60px !important; 
    
    /* Asegura que sea un cuadrado perfecto */
    aspect-ratio: 1 / 1 !important; 
    
    /* Bordes redondeados */
    border-radius: 8px !important; 
    
    /* Centrado Flexbox */
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    
    /* Eliminamos cualquier padding que pudiera deformarlo */
    padding: 0 !important; 
    
    /* Evita que se encoja en pantallas pequeñas */
    flex-shrink: 0 !important; 
}

.seccion-cta-carrera .dmx-icono-box i.bi-mortarboard {
    /* TAMAÑO FIJO DEL ICONO */
    font-size: 40px !important; 
    color: #ffffff !important; 
    
    /* Altura de línea para ayudar al centrado vertical */
    line-height: 1 !important; 
}

.dmx-icono-box i{
    font-size: 32px!important;
}

/* --- Fin corrección --- */

/* --- FIN: Estilos consolidados y finales para la sección CTA --- */
/* --- FIN: Corrección de layout --- */
/*********************/