.somos-hero {
position: relative;
overflow: hidden;
padding: 80px 0 60px;
background: linear-gradient(160deg, var(--fondo) 0%, #dff0e4 50%, var(--verde-claro) 100%);
}
.somos-hero::before,
.somos-hero::after {
content: "";
position: absolute;
border-radius: 50%;
pointer-events: none;
z-index: 0;
}
.somos-hero::before {
top: -150px;
right: -100px;
width: 450px;
height: 450px;
background: radial-gradient(circle, rgba(0, 166, 75, 0.10) 0%, transparent 70%);
}
.somos-hero::after {
bottom: -80px;
left: -60px;
width: 300px;
height: 300px;
background: radial-gradient(circle, rgba(151, 201, 235, 0.15) 0%, transparent 70%);
}
.somos-hero > .container {
position: relative;
z-index: 1;
}
.somos-hero__fila {
display: grid;
grid-template-columns: 1fr 0.42fr;
align-items: center;
gap: 48px;
margin-bottom: 24px;
}
.somos-hero__fila--invertida {
grid-template-columns: 0.42fr 1fr;
}
.somos-hero__titulo {
margin-bottom: 20px;
font-size: 52px;
font-weight: 800;
line-height: 1.08;
}
.somos-hero__descripcion {
max-width: 550px;
font-size: 16px;
line-height: 1.8;
}
.somos-hero__figura {
margin: 0;
}
.somos-hero__figura img {
display: block;
width: 100%;
aspect-ratio: 1;
object-fit: cover;
border-radius: var(--radio-lg);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.10);
}
.somos-hero__recuadro {
padding: 28px 32px;
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(0, 166, 75, 0.15);
border-radius: 20px;
transition: var(--transicion);
}
.somos-hero__recuadro:hover {
border-color: var(--verde);
box-shadow: 0 8px 30px rgba(0, 166, 75, 0.08);
}
.somos-hero__recuadro p {
margin: 0;
font-size: 15px;
line-height: 1.8;
}
.somos-hero__frase {
max-width: 720px;
margin: 16px 0 0;
padding-left: 20px;
border-left: 3px solid var(--verde);
font-size: 15px;
font-style: italic;
line-height: 1.8;
}
@media (max-width: 968px) {
.somos-hero { padding: 60px 0 40px; }
.somos-hero__fila,
.somos-hero__fila--invertida {
grid-template-columns: 1fr;
gap: 28px;
}
.somos-hero__fila--invertida .somos-hero__figura { order: 2; }
.somos-hero__titulo { font-size: 38px; }
}
@media (max-width: 480px) {
.somos-hero__titulo { font-size: 30px; }
}
.somos-proposito {
padding: 100px 0;
background: var(--blanco);
}
.somos-proposito .titulo-seccion {
margin-bottom: 8px;
font-size: 40px;
}
.somos-proposito__texto {
max-width: 800px;
font-size: 16px;
line-height: 1.8;
}
.somos-proposito__figura {
margin: 32px 0 0;
}
.somos-proposito__figura img {
display: block;
width: 100%;
border-radius: 20px;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}
@media (max-width: 968px) {
.somos-proposito { padding: 70px 0; }
.somos-proposito .titulo-seccion { font-size: 32px; }
}
@media (max-width: 480px) {
.somos-proposito .titulo-seccion { font-size: 26px; }
}
.somos-valores {
position: relative;
overflow: hidden;
padding: 100px 0 40px;
background: var(--fondo);
}
.somos-valores::before {
content: "";
position: absolute;
inset: 0;
background-image: radial-gradient(circle at 2px 2px, rgba(0, 166, 75, 0.04) 1px, transparent 0);
background-size: 40px 40px;
pointer-events: none;
}
.somos-valores > .container {
position: relative;
z-index: 1;
}
.somos-valores__titulo {
display: block;
margin: 0 auto;
font-size: 40px;
text-align: center;
}
.somos-valores__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 28px;
margin-top: 40px;
}
.somos-valor {
position: relative;
padding: 40px 32px;
text-align: center;
background: var(--blanco);
border: 1px solid var(--borde);
border-radius: 24px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
overflow: hidden;
transition: var(--transicion);
}
.somos-valor::before {
content: "";
position: absolute;
inset: 0 0 auto;
z-index: 2;
height: 4px;
}
.somos-valor--azul::before  { background: var(--azul); }
.somos-valor--verde::before { background: var(--verde); }
.somos-valor--mixto::before { background: linear-gradient(90deg, var(--verde), var(--azul)); }
.somos-valor:hover {
transform: translateY(-8px);
border-color: rgba(0, 166, 75, 0.15);
box-shadow: 0 20px 60px rgba(0, 166, 75, 0.12);
}
.somos-valor__imagen {
display: block;
width: 80px;
height: 80px;
margin: 0 auto 16px;
border: 3px solid var(--verde-claro);
border-radius: 50%;
object-fit: cover;
box-shadow: 0 8px 24px rgba(0, 166, 75, 0.15);
transition: var(--transicion);
}
.somos-valor:hover .somos-valor__imagen {
transform: scale(1.1) rotate(5deg);
border-color: var(--verde);
}
.somos-valor__titulo {
margin-bottom: 12px;
font-size: 22px;
}
.somos-valor__texto {
max-width: 300px;
margin: 0 auto;
font-size: 14px;
line-height: 1.8;
}
@media (max-width: 968px) {
.somos-valores { padding: 70px 0 30px; }
.somos-valores__titulo { font-size: 32px; }
.somos-valores__grid {
grid-template-columns: 1fr;
gap: 20px;
}
}
@media (max-width: 480px) {
.somos-valores__titulo { font-size: 26px; }
}
.somos-cta {
position: relative;
overflow: hidden;
padding: 100px 0;
background: linear-gradient(135deg, var(--titular) 0%, #1a3d2a 100%);
}
.somos-cta__circulos {
position: absolute;
inset: 0;
pointer-events: none;
}
.somos-cta__circulo {
position: absolute;
border-radius: 50%;
background: var(--verde);
}
.somos-cta__circulo--1 {
top: -120px;
right: -80px;
width: 350px;
height: 350px;
opacity: 0.06;
}
.somos-cta__circulo--2 {
bottom: -80px;
left: -60px;
width: 250px;
height: 250px;
opacity: 0.04;
}
.somos-cta__interior {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 48px;
}
.somos-cta__titulo {
margin: 0 0 16px;
font-size: 36px;
font-weight: 800;
line-height: 1.2;
color: var(--blanco);
}
.somos-cta__titulo span { color: var(--verde); }
.somos-cta__texto {
max-width: 500px;
margin-bottom: 32px;
font-size: 16px;
line-height: 1.7;
color: rgba(255, 255, 255, 0.6);
}
.somos-cta__botones {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
.somos-cta__whatsapp {
display: flex;
align-items: center;
gap: 14px;
flex-shrink: 0;
padding: 20px 28px;
border: 1px solid rgba(37, 211, 102, 0.25);
border-radius: 20px;
background: rgba(37, 211, 102, 0.10);
color: var(--whatsapp);
transition: var(--transicion);
}
.somos-cta__whatsapp:hover {
background: var(--whatsapp);
border-color: var(--whatsapp);
color: var(--blanco);
transform: translateY(-3px);
box-shadow: 0 12px 30px rgba(37, 211, 102, 0.3);
}
.somos-cta__whatsapp svg {
width: 32px;
height: 32px;
flex-shrink: 0;
}
.somos-cta__whatsapp-etiqueta {
display: block;
font-size: 12px;
opacity: 0.8;
}
.somos-cta__whatsapp strong {
display: block;
font-size: 20px;
font-weight: 800;
}
@media (max-width: 968px) {
.somos-cta { padding: 70px 0; }
.somos-cta__interior {
flex-direction: column;
text-align: center;
}
.somos-cta__titulo { font-size: 28px; }
.somos-cta__texto { max-width: 100%; }
.somos-cta__botones { justify-content: center; }
}
@media (max-width: 480px) {
.somos-cta__botones { flex-direction: column; }
.somos-cta__botones .btn { justify-content: center; }
}