/* La Nutri Digestiva · V4.3 · Sólo hero: retrato exacto aprobado por Giselle. */
/* La fotografía proviene del panel 02 ORIGINAL, sin regeneración facial ni retoques. */
.hero{
  background:#f8f7f2!important;
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.hero>.hero-art{
  position:absolute!important;
  display:block!important;
  inset:0 0 auto auto!important;
  width:clamp(480px,49%,660px)!important;
  height:100%!important;
  margin:0!important;
  object-fit:cover!important;
  object-position:center 17%!important;
  opacity:1!important;
  filter:none!important;
  image-rendering:auto!important;
  z-index:0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 19%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 19%,#000 100%);
}
/* Suaviza sólo el borde de unión con los textos; el rostro permanece intacto. */
.hero::after{
  content:"";
  position:absolute;
  display:block!important;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,
    #f8f7f2 0%,
    rgba(248,247,242,.99) 27%,
    rgba(248,247,242,.87) 39%,
    rgba(248,247,242,.45) 50%,
    rgba(248,247,242,0) 61%)!important;
}
.hero .hero-inner{position:relative!important;z-index:2;min-height:478px;}
.hero .hero-content{position:relative;z-index:2;}
@media(min-width:1500px){
  .hero>.hero-art{width: min(45%,680px)!important;object-position:center 19%!important;}
}
@media(min-width:631px) and (max-width:1024px){
  .hero>.hero-art{width:55%!important;object-position:center 16%!important;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 35%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 35%,#000 100%);}
  .hero::after{background:linear-gradient(90deg,#f8f7f2 0%,rgba(248,247,242,.99) 28%,rgba(248,247,242,.88) 40%,rgba(248,247,242,.24) 62%,transparent 75%)!important;}
}
@media(max-width:630px){
  .hero{display:flex!important;flex-direction:column!important;min-height:0!important;}
  .hero>.hero-art{
    position:relative!important;
    inset:auto!important;
    order:0!important;
    width:100%!important;
    height:clamp(285px,82vw,360px)!important;
    object-fit:cover!important;
    object-position:center 8%!important;
    opacity:1!important;
    filter:none!important;
    margin:0!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  .hero::after{display:none!important;content:none!important;}
  .hero .hero-inner{order:1!important;min-height:0!important;padding-top:0!important;}
  .hero-content{padding-top:22px!important;}
}
