.ebmnt1-hero {
  background-color: var(--ebmnt1-background-hero);
  background-image: var(--ebmnt1-background-hero-gradient);
  overflow: hidden;
}

/* Soft-light triangles that slide left and right */
.ebmnt1-hero__shape {
  position: absolute;
  z-index: 0;
  display: none;
  mix-blend-mode: soft-light;
  pointer-events: none;
  animation: ebmnt1-left-right 4s ease-in-out infinite;
}

.ebmnt1-hero__shape--one,
.ebmnt1-hero__shape--two {
  inset-block-start: 0;
  inset-inline-start: 0;
  clip-path: polygon(100% 0, 0 0, 50% 50%, 100% 100%);
}

.ebmnt1-hero__shape--three,
.ebmnt1-hero__shape--four {
  inset-block-end: 0;
  inset-inline-start: 0;
  clip-path: polygon(100% 0, 50% 50%, 0 100%, 100% 100%);
}

.ebmnt1-hero__shape--one {
  width: 35.625rem;
  height: 50%;
  background-color: var(--ebmnt1-background-hero-shape-strong);
}

.ebmnt1-hero__shape--two {
  width: 36.875rem;
  height: 53%;
  background-color: var(--ebmnt1-background-hero-shape-soft);
}

.ebmnt1-hero__shape--three {
  width: 35.625rem;
  height: 50%;
  background-color: var(--ebmnt1-background-hero-shape-strong);
}

.ebmnt1-hero__shape--four {
  width: 36.875rem;
  height: 53%;
  background-color: var(--ebmnt1-background-hero-shape-soft);
}

.ebmnt1-hero__inner {
  align-items: stretch;
  background-color: var(--ebmnt1-background-hero-inner);
}

.ebmnt1-hero__band {
  align-items: stretch;
  gap: 1.875rem;
  padding-block: var(--ebmnt1-layout-hero-padding-top) 0;
}

.ebmnt1-hero__content {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}

.ebmnt1-hero__tagline {
  color: var(--ebmnt1-text-hero-tagline);
  font-size: var(--ebmnt1-font-size-hero-tagline);
  font-weight: var(--ebmnt1-font-weight-bold);
  line-height: 1;
}

.ebmnt1-hero__title {
  color: var(--ebmnt1-text-hero-title);
  font-size: var(--ebmnt1-font-size-hero-title);
  font-weight: var(--ebmnt1-font-weight-bold);
  line-height: 1.35;
}

.ebmnt1-hero__title-accent {
  color: var(--ebmnt1-text-hero-title-accent);
}

.ebmnt1-hero__text {
  max-width: 38rem;
  color: var(--ebmnt1-text-hero-body);
  font-size: var(--ebmnt1-font-size-hero-body);
}

.ebmnt1-hero__actions {
  --ebmnt1-size-button-icon: 2.25rem;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
}

.ebmnt1-hero__actions .ebmnt1-button {
  gap: 0.375rem;
  min-width: 0;
  padding: 0.25rem 0.75rem 0.25rem 0.25rem;
  font-size: var(--ebmnt1-font-size-button-compact);
}

/* Hero buttons sweep white on hover, so the text must turn orange to stay readable */
.ebmnt1-hero__actions .ebmnt1-button::before,
.ebmnt1-hero__actions .ebmnt1-button::after {
  background-color: var(--ebmnt1-background-hero-button-sweep);
}

.ebmnt1-hero__actions .ebmnt1-button:hover {
  color: var(--ebmnt1-text-hero-button-hover);
}

.ebmnt1-hero__actions .ebmnt1-button--whatsapp:hover {
  color: var(--ebmnt1-text-button-whatsapp-hover);
}
/* Feature cards: always 2 x 2, in the normal flow, never floating over the image */
.ebmnt1-hero__features {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  width: 100%;
}

.ebmnt1-hero-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.625rem;
  flex: 0 0 calc(50% - 0.375rem);
  padding: 0.75rem;
  border: 2px solid var(--ebmnt1-border-hero-card);
  border-radius: var(--ebmnt1-radius-card-large);
  background-color: var(--ebmnt1-background-hero-card);
  text-align: start;
  transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-easing-standard);
}

.ebmnt1-hero-card:hover {
  transform: translateY(var(--ebmnt1-offset-hover-lift));
  border-color: var(--ebmnt1-border-hero-card-hover);
}

.ebmnt1-hero-card__head {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.ebmnt1-hero-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--ebmnt1-size-hero-card-icon);
  height: var(--ebmnt1-size-hero-card-icon);
  border: 1px solid var(--ebmnt1-border-hero-card-icon);
  border-radius: var(--ebmnt1-radius-circle);
  color: var(--ebmnt1-icon-hero-card);
}

.ebmnt1-hero-card__title {
  color: var(--ebmnt1-text-hero-card-title);
  font-size: var(--ebmnt1-font-size-hero-card-title);
  font-weight: var(--ebmnt1-font-weight-semibold);
  line-height: 1.4;
}

.ebmnt1-hero-card__text {
  color: var(--ebmnt1-text-hero-card-body);
  font-size: var(--ebmnt1-font-size-hero-card-text);
  line-height: 1.6;
}
/* Worker cut-out: bobs up and down */
.ebmnt1-hero__media {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-self: center;
  width: 100%;
  max-width: 34rem;
}

.ebmnt1-hero__image {
  width: 100%;
  animation: ebmnt1-top-bottom 3s ease-in-out infinite;
}

@media (min-width: 425px) {
  .ebmnt1-hero__actions {
    --ebmnt1-size-button-icon: 2.75rem;
    gap: 1rem;
  }

  .ebmnt1-hero__actions .ebmnt1-button {
    gap: 0.875rem;
    padding: 0.375rem 1.5rem 0.375rem 0.375rem;
    font-size: var(--ebmnt1-font-size-button);
  }
}

@media (min-width: 768px) {
  :root {
    --ebmnt1-layout-hero-padding-top: 4.5rem;
  }

  .ebmnt1-hero__shape {
    display: block;
  }

  .ebmnt1-hero__band {
    gap: 3.125rem;
  }

  .ebmnt1-hero__features {
    flex-wrap: nowrap;
    flex-direction: row;
  }

  .ebmnt1-hero__features {
    flex-wrap: wrap;
  }
}

@media (min-width: 1024px) {
  :root {
    --ebmnt1-size-hero-media-width: clamp(30rem, 50vw, 59rem);
  }

  .ebmnt1-hero__inner {
    min-height: 40rem;
  }

  .ebmnt1-hero__band {
    padding-block-end: var(--ebmnt1-layout-hero-padding-top);
  }

  .ebmnt1-hero__content {
    align-items: flex-start;
    width: 52%;
    margin-inline-end: -3.125rem;
    text-align: start;
  }

  .ebmnt1-hero__actions {
    justify-content: flex-start;
    width: auto;
  }

  .ebmnt1-hero__media {
    position: absolute;
    inset-block-end: calc(var(--ebmnt1-size-hero-media-width) * -0.18);
    inset-inline-end: calc(var(--ebmnt1-size-hero-media-width) * -0.265);
    width: var(--ebmnt1-size-hero-media-width);
    max-width: none;
  }
}