/* Banners completos: conservar la proporción original (1600x500, la misma que se
   indica al subir la imagen en el panel admin), sin zoom ni recorte. */
.hero .hero-slider{height:auto;aspect-ratio:1600 / 500;max-width:1600px;margin-inline:auto}
.hero .hero-slide{background-size:contain;background-repeat:no-repeat;pointer-events:none}
.hero .hero-slide.active{pointer-events:auto}
.hero .hero-caption{left:6%;max-width:44%}
.hero .hero-caption h1{font-size:clamp(26px,3.3vw,54px)}
.hero .hero-caption p{font-size:clamp(13px,1.1vw,17px)}
@media(max-width:650px){
  .hero .hero-slider{aspect-ratio:1600 / 500;height:auto}
  .hero .hero-slider.has-caption{aspect-ratio:auto;height:calc(100vw * 500 / 1600 + 240px)}
  .hero .hero-slide{background-position:center top;background-size:100% auto}
  .hero .hero-caption{top:calc(100vw * 500 / 1600);left:0;max-width:none;width:100%;height:240px;padding:20px 44px 32px;transform:none;background:var(--navy)}
  .hero .hero-caption h1{font-size:28px;margin:12px 0 8px}
  .hero .hero-caption p{font-size:14px;margin:0}
  .hero .hero-arrow{top:calc(100vw * 250 / 1600);width:32px;height:44px}
  .hero .hero-arrow.left{left:4px}
  .hero .hero-arrow.right{right:4px}
}