/* Sostenibilidad — extiende los estilos comunes definidos en historia.css */

.hero-sustainability{
  min-height:560px;
  height:42.5vw;
  max-height:820px;
  background:
    linear-gradient(180deg,rgba(5,17,39,.10) 0%,rgba(5,17,39,.04) 42%,rgba(5,17,39,.22) 100%),
    url("sostenibilidad-hero.jpg") center 48%/cover no-repeat;
}
.hero-sustainability .hero-title{
  left:100px;
  bottom:64px;
  font-size:clamp(52px,4.3vw,82px);
  letter-spacing:.2px;
}

.sustainability-intro{padding:112px 0 122px}
.sustainability-intro .intro-grid{
  grid-template-columns:1.02fr .98fr;
  gap:110px;
}
.sustainability-intro h2{
  color:#555;
  font-size:clamp(36px,3.3vw,58px);
  font-weight:900;
  line-height:1.16;
  letter-spacing:-.7px;
}
.sustainability-intro p{
  color:#626262;
  font-size:clamp(17px,1.35vw,21px);
  line-height:1.66;
}

.sustainability-item{padding:80px 0 92px}
.sustainability-item+.sustainability-item{border-top:2px solid #a9a9a9}
.sustainability-grid{
  display:grid;
  grid-template-columns:.38fr .62fr;
  gap:100px;
  align-items:start;
}
.sustainability-label{
  display:flex;
  align-items:flex-start;
  gap:26px;
  color:#555;
  font-size:clamp(34px,2.6vw,48px);
  font-weight:900;
  line-height:1.05;
  letter-spacing:-.6px;
}
.sustainability-label::before{
  content:"";
  width:25px;
  height:25px;
  margin-top:.2em;
  flex:0 0 auto;
  background:var(--blue);
}
.sustainability-item p{
  color:var(--blue);
  font-size:clamp(40px,3.75vw,68px);
  font-weight:300;
  line-height:1.18;
  letter-spacing:-.4px;
}

.sustainability-cta{padding:38px 0 138px;text-align:center}
.sustainability-cta .cta{padding:18px 46px}

@media (max-width:1100px){
  .sustainability-intro .intro-grid{gap:60px}
  .sustainability-grid{gap:54px}
}
@media (max-width:900px){
  .hero-sustainability{min-height:500px;height:68vw}
  .hero-sustainability .hero-title{left:34px;bottom:46px}
  .sustainability-intro{padding:78px 0 84px}
  .sustainability-intro .intro-grid{grid-template-columns:1fr;gap:38px}
  .sustainability-item{padding:58px 0 66px}
  .sustainability-grid{grid-template-columns:1fr;gap:34px}
  .sustainability-item p{font-size:clamp(36px,6.3vw,54px)}
  .sustainability-cta{padding:22px 0 104px}
}
@media (max-width:560px){
  .hero-sustainability{min-height:440px;height:105vw;background-position:center 48%}
  .hero-sustainability .hero-title{left:22px;bottom:36px;font-size:32px}
  .sustainability-intro{padding:62px 0 66px}
  .sustainability-intro h2{font-size:33px}
  .sustainability-intro p{font-size:16px;line-height:1.62}
  .sustainability-item{padding:48px 0 56px}
  .sustainability-label{font-size:32px;gap:18px}
  .sustainability-label::before{width:18px;height:18px}
  .sustainability-item p{font-size:34px;line-height:1.16}
  .sustainability-cta{padding:12px 22px 82px}
  .sustainability-cta .cta{width:100%}
}