.image-container img {
    filter: grayscale(100%);
    width: 100%;
    height: auto;
    display: block;
    transition: filter 0.3s ease-in-out; /* Añadir transición para suavizar el cambio de brillo */
}

.image-container {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.image-container::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom, 
        rgba(0, 0, 0, 1) 0%, 
        rgba(0, 0, 0, 0) 50%, 
        rgba(0, 0, 0, 1) 100%
    );
}

/* Estilos para la sección del título */
.full-screen-title {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    margin: 3rem 0;
}

.full-screen-title h1 {
    margin-left: 7rem;
    font-size: 4em;
    padding-right: 40rem;
    line-height: 0.9;
}

/* Estilos para la sección de texto centrado */
.centered-text {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1rem 0;
}

.centered-text h2 {
    margin: 0;
    font-weight: bold;
    padding-left: 24rem;
    padding-right: 24rem;
}

/* Estilos para la sección de texto inferior */
.bottom-text {
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 20px; /* Ajustar padding según necesidad */
}

.number-section {
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 20px;
    margin: 0px 8rem;
}


.count {
    display: block;
    font-size: 2em;
}

.number-div {
    text-align: center; /* Centrar todo en el div */
}

.number-div p{
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 0;
}

.desc-div {
    text-align: center; /* Centrar todo en el div */
}

.desc-div p{
    font-size: 14px;
	padding-left: 10px;	
    margin-bottom: 0;
}

.count-unit {
    display: flex;
    justify-content: center; /* Centrar horizontalmente */
    align-items: baseline; /* Alinear el número y la unidad en la línea base */
    font-size: 2em; /* Ajustar el tamaño de fuente según necesidad */
}

.unit {
    margin-left: 0.5em; /* Ajustar el espacio entre el número y la unidad */
}

.image-container-2 {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-top: 3rem;
}

.image-container-2 img {
    width: 100%;
    display: block;
}

.image-container-2::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        to bottom,
        rgb(0, 0, 0)0%,
        rgb(0, 0, 0,0.7)30%,
        rgba(0, 0, 0, 0) 50%,
        rgba(0, 0, 0, 0.7)85%,
        rgb(0, 0, 0) 100%
    );
    pointer-events: none;
}

.split-section {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
}

.split-section .image,
.split-section .text {
    flex: 1;
    width: 50%;
}

.split-section .image img {
    width: 100%;
    display: block;
}

.split-section .text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.split-section .text .text-content {
    padding: 0px 8rem;
}

.split-section.reverse {
    flex-direction: row-reverse;
}

.split-section .text h2 {
    font-size: 2.5rem;
    margin-top: 0;
}
.image-opacity img {
    opacity: 0.75; /* Ajusta este valor según tus necesidades */
}
.footer {
    background-color: #333;
    color: #fff;
    display: flex;
    justify-content: space-between;
    padding: 20px;
}

.footer-content {
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    margin: auto;
}

.footer-form {
    flex: 1;
    padding: 40px 45px;
    margin-left: auto; /* Añadido margen automático a la izquierda */
    border-radius: 10px; /* Agregado border-radius al contenedor del formulario */
}

.footer-form form {
    display: flex;
    flex-direction: column;
}

.footer-form input,
.footer-form textarea {
    margin-bottom: 10px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px; /* Agregado border-radius a los campos de entrada */
    font-size: 1.1em; /* Aumentado el tamaño de la fuente */
}

.footer-form .cta-button {
    background-color: red;
    color: #fff;
    padding: 8px 16px; /* Hacer el botón más pequeño */
    border: none;
    cursor: pointer;
    align-self: flex-end; /* Alineado a la derecha */
}

.checkbox {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.footer-info{
    width: 50%;
}
.sub-footer {
    background-color: #000000; /* Cambia este valor al color de fondo que prefieras */
    color: #ecf0f1; /* Cambia este valor al color de texto que prefieras */
    text-align: center;
    font-size: 14px;
}

.sub-footer .content {
    max-width: 1200px;
    margin: auto;
    padding: 0 20px;
}

.sub-footer a {
    color: #ecf0f1; /* Cambia este valor al color de enlace que prefieras */
    text-decoration: none;
}

.sub-footer a:hover {
    text-decoration: underline;
}


.image-container3 img {
    width: 100%;
    height: auto;
    display: block;
    transition: filter 0.3s ease-in-out; /* Añadir transición para suavizar el cambio de brillo */
}

.image-container3 {
    position: relative;
    width: 100%;
    margin: 0;
    margin-top: 10rem;
    margin-bottom: 10rem;
    padding: 0;
    overflow: hidden;
}

.image-container3::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom, 
        rgba(0, 0, 0, 1) 0%, 
        rgba(0, 0, 0, 0) 50%, 
        rgba(0, 0, 0, 1) 100%
    );
}

.escoltek-product-display {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px;
    margin-top: 5rem;
    margin-bottom: 3rem;
}

.product-description {
    width: 28%;
    padding-left: 7rem;
}

.product-description p {
    font-size: 1.2rem;
}

.product-images {
    width: 60%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.image-detail {
    text-align: center;
    margin-right: 3rem;
}

.image-detail img {
    max-width: 100%;
    height: 13rem;
    border-radius: 14%;
}

.image-detail h2 {
    margin-top: 10px;
}

.footer-logo {
    width: 200px;
	height: 200px;
}