/* INTRODUCCION */

.introduccion {
    margin-top: 5%;
}

.introduccion-texto {
    color: black;
    font-size: clamp(14px, 1.8vw + 0.5rem, 22px);
    font-weight: 400;
    word-wrap: break-word;
    max-width: 900px;
    text-align: justify;

    display: flex;
    align-items: center;
}

.introduccion-preguntas {
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pregunta {
    color: #691B32;
    font-size: clamp(18px, 2.5vw + 0.5rem, 30px);
    font-weight: 700;
    word-wrap: break-word;
    text-align: center;
    width: 60%;
}

.respuesta {
    color: black;
    font-size: clamp(10px, 1.2vw + 0.3rem, 15px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 50%;
    margin-bottom: 3%;
    margin-top: 3%;
}

.boton-info {
    margin-bottom: 3%;
    width: 100%;
    display: contents;
}

.boton-info button {
    width: 35%;
    height: 50px;
    background: #691B32;
    color: white;
    font-size: clamp(10px, 1.2vw + 0.3rem, 15px);
    font-weight: 400;
    word-wrap: break-word;
    border-radius: 33px;
    border: none;
}

/* MODELO BANCARIO */

.modelo {
    margin-top: 5%;
}

.div-modelo-titulo {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.modelo-titulo {
    color: #691B32;
    font-size: clamp(26px, 3vw + 1rem, 50px);
    font-weight: 700;
    word-wrap: break-word;
}

.modelo-texto {
    color: black;
    font-size: clamp(12px, 1.5vw + 0.5rem, 20px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
}

.div-modelo-burbuja svg {
    margin-left: 7%;
    width: 150%;
}

/*  DETALLE DE LA ARQUITECTURA */

.det-sub-menu {
    margin-top: 2%;
}

.det-sub-menu .nav-link {
    color: #691B32;
    font-size: clamp(12px, 1.5vw + 0.5rem, 20px);
}

.det-sub-menu .nav-link:hover {
    color: #691B32;
    font-size: clamp(14px, 1.8vw + 0.5rem, 22px);
}

.det-sub-menu .nav-link.act {
    color: #691B32;
    font-weight: bold;
    font-size: clamp(14px, 1.8vw + 0.5rem, 22px);
}

.det-division {
    margin-top: 5%;
}

/* ARQUITECTURA ALTO NIVEL */

.detalle-arquitectura {
    display: flex;
    flex-direction: column;
}

.detalle-titulo {
    color: #691B32;
    font-size: clamp(26px, 3vw + 1rem, 45px);
    font-weight: 700;
    word-wrap: break-word;
}

.detalle-imagen {
    width: auto;
}

.detalle-imagen img {
    width: 100%;
}


.alto-nivel {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nivel-titulo {
    color: #691B32;
    font-size: clamp(20px, 2.5vw + 1rem, 34px);
    font-weight: 700;
    word-wrap: break-word;
    margin-bottom: 5%;
}

.nivel-texto {
    color: black;
    font-size: clamp(12px, 1.5vw + 0.5rem, 20px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 75%;
}

/* ARQUITECTURA NIVEL TECNOLOGICO */

.nivel-tec-imagen img {
    width: 100%;
}

.nivel-tec {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.nivel-tec-titulo {
    color: #691B32;
    font-size: clamp(18px, 2.5vw + 0.5rem, 30px);
    font-weight: 700;
    word-wrap: break-word;
    text-align: center;
    margin-bottom: 5%;
}

.nivel-tec-texto {
    color: black;
    font-size: clamp(16px, 1.5vw + 0.5rem, 25px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 85%;
}

/* NUEVOS DESARROLLOS */

.desarrollo-imagen img {
    width: 100%;
}

.nivel-desarrollo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.desarrollo-titulo {
    color: #691B32;
    font-size: clamp(18px, 2.5vw + 0.5rem, 30px);
    font-weight: 700;
    word-wrap: break-word;
    text-align: center;
    margin-bottom: 5%;
}

.desarrollo-texto {
    color: black;
    font-size: clamp(16px, 1.5vw + 0.5rem, 25px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 85%;
}

/* INTEGRACION CON SISTEMAS LEGADOS */

.integracion-imagen img {
    width: 100%;
}

.nivel-integracion {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.integracion-titulo {
    color: #691B32;
    font-size: clamp(18px, 2.5vw + 0.5rem, 30px);
    font-weight: 700;
    word-wrap: break-word;
    text-align: center;
    margin-bottom: 5%;
}

.integracion-texto {
    color: black;
    font-size: clamp(16px, 1.5vw + 0.5rem, 25px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 85%;
}

/* NUBE */

.nube-imagen img {
    width: 100%;
}

.nivel-nube {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.nube-titulo {
    color: #691B32;
    font-size: clamp(18px, 2.5vw + 0.5rem, 30px);
    font-weight: 700;
    word-wrap: break-word;
    text-align: center;
    margin-bottom: 5%;
}

.nube-texto {
    color: black;
    font-size: clamp(16px, 1.5vw + 0.5rem, 25px);
    font-weight: 400;
    word-wrap: break-word;
    text-align: justify;
    width: 85%;
}