@charset "UTF-8";
/* CSS Document */

@media only screen and (min-width: 768px) {
	/* ==========================================
   HERO HEADER
   ========================================== */
	header.hero-header {
        background-attachment: fixed;
    }
    .header_tag {
        margin-top: 10rem;
        font-size: 1.2rem;
    }
    .header_slogan {
        font-size: 4.2rem;
        line-height: 1.15;
    }

    .header_descripcion {
        font-size: 1.8rem;
    }

    .header_btn_catalogo {
        margin-bottom: 8rem;
        font-size: 1.6rem;
    }
	/* ==========================================
	HOME
	========================================== */
	.home_division {
	}
	.home_division hr {
		max-width: 100px;
		margin-top: 2rem;
	}
	#home_iconos_grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 3rem;
		margin-top: 6rem;
		width: 100%;
	}
	#home_partners_grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 4rem 8rem;
		margin-top: 3rem;
	}
	/* ==========================================
	CONTACTO
	========================================== */
	.contacto_grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem;
		margin-top: 4rem;
	}
	/* ==========================================
	PRODUCTOS
	========================================== */
	.productos_grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
		margin-top: 3rem;
	}
	
	/* ==========================================
	NOSOTROS
	========================================== */
	.nostros_grid_dos {
		grid-template-columns: repeat(2, 1fr);
	}
	.nostros_grid_cuatro {
		grid-template-columns: repeat(2, 1fr);
	}
	/* ==========================================
	PARTNERS
	========================================== */
	.partners_grid_dos {
		grid-template-columns: repeat(2, 1fr);
		gap: 8rem;
		margin-top: 6rem;
	}
	/* ==========================================
	FOOTER
	========================================== */
	.footer_grid {
		grid-template-columns: auto 20% 25% auto;
		gap: 4rem;
	}
	/* ==========================================
	   APLICACIONES
	   ========================================== */
	.aplicaciones_descripcion {
		padding-bottom: 10rem;
	}

	
}

@media only screen and (min-width: 1024px) {
	/* ==========================================
	HERO HEADER
	========================================== */
	.hero-header img {
		width: 100%;
	}
	.header_slogan {
		width: 60%;
		margin-top: 5rem;
		color: var(--neutral);
	}
	.header_descripcion {
		width: 60%;
		margin-top: 3rem;
		font-size: 1.6rem;
		color: var(--neutral);
	}
	/* ==========================================
	HOME
	========================================== */
	#home_iconos_grid {
		grid-template-columns: repeat(5, 1fr);
		gap: 3rem;
		margin-top: 5rem;
	}
	#home_iconos_grid img:hover {
		transform: scale(1.1);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	#home_partners_grid {
		gap: 4rem 12rem;
	}
	#home_partners_grid img:hover {
		transform: scale(1.1);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	/* ==========================================
	CONTACTO
	========================================== */
	.contacto_grid {
		grid-template-columns: repeat(4, 1fr);
		gap: 4rem;
		margin-top: 4rem;
	}
	
	/* ==========================================
   PRODUCTOS
   ========================================== */
	.productos_grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 2rem;
		margin-top: 4rem;
	}
	.producto:hover {
		border: 1px solid var(--primario);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.producto_img:hover {
		background-color: transparent;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.producto_img img:hover {
		transform: scale(1.1);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	
	.btn_ver_mas:hover {
		background-color: var(--primario, #D32F2F);
		color: var(--blanco);
		transition: background-color 0.3s ease;
	}
	/* ==========================================
	NOSOTROS
	========================================== */
	.nostros_grid_cuatro {
		grid-template-columns: repeat(4, 1fr);
	}
	.nostros_grid_dos div:hover img {
		transform: translateY(-1rem); 
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.nostros_grid_cuatro div:hover img {
		transform: translateY(-1rem); 
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	/* ==========================================
	PRIVACIDAD
	========================================== */
	.privacidad_grid {
		grid-template-columns: 30% auto;
		gap: 4rem;
	}
	/* ==========================================
	PRODUCTOS COMPLETOS
	========================================== */
	.producto_final_grid {
		position: relative;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10rem;
		width: 100%;
		margin: auto;
		padding: 3rem;
		margin-top: 3rem;
	}
	.producto_final_grid_img:hover {
		transform: scale(1.1);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.producto_solicitar_cotizacion:hover {
		background-color: var(--secundario);
		color: var(--terciario);
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.producto_texto_informacion_grid span {
		font-weight: 800;
		font-size: 2.5rem;
	}
}