/* Hero inicial */

.hero {
	height: 90vh;
	background: url('../Imagenes/gruahome.png') center/cover no-repeat;
	display: flex;
	align-items: center;
	padding-left: 70px;
	margin-top: 90px;
}

.overlay {
	background: rgba(255, 255, 255, 0.88);
	padding: 45px;
	border-radius: 20px;
	max-width: 600px;
}

.overlay h1 {
	font-family: 'Oswald', sans-serif;
	color: #e53434;
	margin-bottom: 12px;
	font-size: 40px;
}

.overlay h2 {
	font-family: 'Montserrat', sans-serif;
	color: #333333;
	font-size: 18px;
	margin-bottom: 20px;
	opacity: 0.85;
}

.overlay p {
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	color: #333333;
	margin-bottom: 12px;
	opacity: 0.85;
	line-height: 1.4;
}

/* Asistencia */

.asistencia {
	width:100%;
	background: #ffffff;
	display: flex;
	justify-content: center;
	padding: 20px 80px;
}

.asistencia-contenido {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 1500px;
	gap: 180px;
}

.asistencia-imagen img {
	width: 100%;
	max-width: 700px;
	border-radius: 60px;
	object-fit: cover;
	height: 400px;
	padding: 10px 20px 0;
}

.asistencia-texto {
	background: #f5f5f5;
	padding: 40px;
	max-width: 700px;
	min-height: 300px;
	text-align: center;
}

.asistencia-texto h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 28px;
	color: #e53434;
	margin-bottom: 20px;
	opacity: 0.85;
}

.asistencia-texto p {
	font-family: 'Montserrat', sans-serif;
	font-size: 18px;
	color: #333333;
	opacity: 0.85;
	max-width: 550px;
	line-height: 1.6;
}

.titulo-icono {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 15px;
}

.icono-asistencia {
	width: 90px;
	height: 90px;
	object-fit:contain;
}

/* Biografía */

.biografía {
	min-height: 100vh;
	background: url('../Imagenes/nave.jpeg') center/cover no-repeat;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 70px;
	margin-top: 90px;
}

.información-empresa {
	display: flex;
	width: 90%;
	max-width: 1200px;
	box-shadow: 0 20px 50px rgba(0,0,0,0.4);
	overflow: hidden;
}

.información-izquierda {
	flex: 2;
	background: #f5f5f5ea;
	padding: 50px;
}

.información-izquierda h2 {
	font-family: 'Oswald', sans-serif;
	font-size: 32px;
	margin-bottom: 20px;
	color: #333333;
}

.información-izquierda h3 {
	margin-top: 25px;
	margin-bottom: 10px;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	color: #333333;
	line-height: 1.6;
	margin-bottom: 15px;
}

.información-izquierda p {
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	color: #333333;
	line-height: 1.6;
	margin-bottom: 15px;
}

.información-izquierda ul {
	padding-left: 20px;
	margin-bottom: 15px;
	font-family: 'Montserrat', sans-serif;
}

.información-izquierda li {
	margin-bottom: 6px;
	font-size: 14px;
	font-family: 'Montserrat', sans-serif;
}

.información-derecha {
	flex: 1;
	background: #e53434ea;
	color: white;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.información-derecha h3 {
	font-family: 'Montserrat', sans-serif;
	margin-bottom: 15px;
	font-size: 18px;
}

.información-derecha p {
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 20px;
	font-family: 'Montserrat', sans-serif;
}

.información-derecha ul {
	padding-left: 20px;
	font-family: 'Montserrat', sans-serif;
}
.información-derecha li {
	margin-bottom: 10px;
	font-size: 14px;
	font-family: 'Montserrat', sans-serif;
}

/* Responsive */

@media (max-width: 768px) {

    /* Hero */

    .hero {
        height: auto;
        min-height: 100svh;
        padding: 20px;
        padding-top: 30px;
        align-items: center;
        justify-content: center;
    }

    .overlay {
        max-width: 100%;
        width: 100%;
        padding: 25px;
        margin: 0;
    }

    .overlay h1 { font-size: 26px; }
    .overlay h2 { font-size: 14px; }
    .overlay p  { font-size: 13px; }

    /* Asistencia */
    .asistencia { padding: 30px 20px; }

    .asistencia-contenido {
        flex-direction: column;
        gap: 30px;
    }

    .asistencia-imagen img {
        width: 100%;
        max-width: 100%;
        height: 220px;
        border-radius: 20px;
        padding: 0;
    }

    .asistencia-texto {
        padding: 25px;
        max-width: 100%;
        min-height: unset;
    }

    .asistencia-texto h2 { font-size: 20px; }
    .asistencia-texto p  { font-size: 15px; max-width: 100%; }
    .titulo-icono { justify-content: center; }

    /* Biografía */

    .biografía {
        padding: 40px 20px;
        margin-top: 0;
        min-height: unset;
    }

    .información-empresa {
        flex-direction: column;
        width: 100%;
    }

    .información-izquierda { padding: 30px 20px; }
    .información-izquierda h2 { font-size: 24px; }
    .información-derecha { padding: 30px 20px; }

    /* Footer */

    .footer-logo img {
        width: 100%;
        max-width: 280px;
    }

    .footer-contenido {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer-servicios ul { padding: 0; }
}

@media (max-width: 480px) {
    .overlay h1 { font-size: 20px; }
    .overlay h2 { font-size: 12px; }
    .overlay p  { font-size: 12px; }

    .asistencia-imagen img { height: 180px; }
    .asistencia-texto h2   { font-size: 17px; }
    .información-izquierda h2 { font-size: 20px; }
    .información-derecha h3   { font-size: 15px; }
}