.ebmnt1-contact {
  background-color: var(--ebmnt1-background-contact);
}

.ebmnt1-contact__inner {
  background-color: var(--ebmnt1-background-contact-inner);
}

/* No form: three fully clickable orange action cards (reference: who-we-serve__form-inner-wrap) */
.ebmnt1-contact__list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
}

.ebmnt1-contact__list > li {
  display: flex;
  flex: 1 1 0;
}

.ebmnt1-contact-card {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  min-height: 11rem;
  padding: 1.875rem;
  border-radius: var(--ebmnt1-radius-card);
  border-start-start-radius: var(--ebmnt1-radius-contact-corner);
  background-color: var(--ebmnt1-background-contact-card);
  overflow: hidden;
  text-align: start;
  transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-easing-standard);
}

/* Two-corner fill sweep, same behavior as the buttons */
.ebmnt1-contact-card::before,
.ebmnt1-contact-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 50%;
  height: 0;
  visibility: hidden;
  opacity: 0;
  background-color: var(--ebmnt1-background-contact-card-sweep);
  transition: all var(--ebmnt1-duration-button-sweep) ease-in-out;
}

.ebmnt1-contact-card::before {
  inset-block-start: 0;
  inset-inline-start: 0;
}

.ebmnt1-contact-card::after {
  inset-block-end: 0;
  inset-inline-end: 0;
}

.ebmnt1-contact-card:hover {
  transform: translateY(calc(var(--ebmnt1-offset-hover-lift) * 1.25));
  box-shadow: var(--ebmnt1-shadow-card-hover);
}

.ebmnt1-contact-card:hover::before,
.ebmnt1-contact-card:hover::after {
  width: 100%;
  height: 100%;
  visibility: visible;
  opacity: 1;
}

.ebmnt1-contact-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: var(--ebmnt1-radius-circle);
  background-color: var(--ebmnt1-background-contact-icon);
  color: var(--ebmnt1-icon-contact);
  transition: all var(--ebmnt1-duration-medium) var(--ebmnt1-easing-standard);
}

.ebmnt1-contact-card__icon .ebmnt1-icon {
  font-size: 1.75rem;
}

.ebmnt1-contact-card:hover .ebmnt1-contact-card__icon {
  background-color: var(--ebmnt1-background-contact-icon-hover);
  color: var(--ebmnt1-icon-contact-hover);
}

.ebmnt1-contact-card:hover .ebmnt1-contact-card__icon .ebmnt1-icon {
  animation: ebmnt1-wobble-horizontal 1s ease-in-out 1;
}

.ebmnt1-contact-card__head {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  width: 100%;
}

.ebmnt1-contact-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.ebmnt1-contact-card__title {
  margin-block-start: 0.5rem;
  color: var(--ebmnt1-text-contact-title);
  font-size: var(--ebmnt1-font-size-contact-title);
  font-weight: var(--ebmnt1-font-weight-semibold);
  line-height: 1.4;
}

.ebmnt1-contact-card__detail {
  color: var(--ebmnt1-text-contact-detail);
  font-weight: var(--ebmnt1-font-weight-semibold);
}

.ebmnt1-contact-card__text {
  color: var(--ebmnt1-text-contact-body);
  font-size: var(--ebmnt1-font-size-body-small);
}

.ebmnt1-contact-card__arrow {
  margin-inline-start: auto;
  margin-block-start: 0.5rem;
  color: var(--ebmnt1-icon-contact-arrow);
  transition: transform var(--ebmnt1-duration-medium) var(--ebmnt1-easing-standard);
}

.ebmnt1-contact-card:hover .ebmnt1-contact-card__arrow {
  transform: translateX(calc(var(--ebmnt1-offset-hover-icon) * -1));
}

@media (min-width: 1024px) {
  .ebmnt1-contact__list {
    flex-direction: row;
    gap: 1.875rem;
  }
}
