.atencion-hero {
  position: relative;
  isolation: isolate;
  min-height: 560px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #e5d2ad url("/assets/atencion-hero.webp") center 48% / cover no-repeat;
}

.atencion-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, #f6f2e9ee 0%, #f6f2e9df 36%, #f6f2e9a6 57%, #f6f2e90a 100%),
    linear-gradient(0deg, #183c3820, #f6f2e910);
}

.atencion-hero-copy {
  width: min(880px, 100%);
  padding: 34px 42px 40px;
  border-radius: 8px;
  background: linear-gradient(90deg, #f6f2e9e8 0%, #f6f2e9d9 78%, #f6f2e900 100%);
}

.atencion-hero h1 {
  max-width: 820px;
}

@media (max-width: 850px) {
  .atencion-hero {
    min-height: 650px;
    align-items: flex-start;
    background-position: 58% center;
  }

  .atencion-hero::before {
    background: linear-gradient(180deg, #f6f2e9f2 0%, #f6f2e9e6 48%, #f6f2e956 100%);
  }

  .atencion-hero-copy {
    padding: 22px 24px 34px;
    background: linear-gradient(180deg, #f6f2e9ec 0%, #f6f2e9d8 82%, #f6f2e900 100%);
  }
}