/* Shared art direction for the MARO Red Sea Selected Work card. */
.work-card--maro .work-card-img {
  object-position: 50% 52%;
  filter: saturate(.9) contrast(1.08) brightness(.82);
}

.work-card--maro::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(4, 16, 30, .38) 0%, rgba(4, 16, 30, .02) 34%, transparent 55%),
    linear-gradient(0deg, rgba(2, 10, 18, .72) 0%, rgba(2, 10, 18, .08) 38%, transparent 60%);
  pointer-events: none;
}

.work-card-maro-poster {
  position: absolute;
  inset: 0;
  z-index: 2;
  color: #fff;
  pointer-events: none;
}

.work-card-maro-kicker {
  position: absolute;
  top: 7.5%;
  left: 7%;
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, .76);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .24em;
  direction: ltr;
}

.work-card-maro-kicker::before {
  content: '';
  width: 22px;
  height: 2px;
  background: #ef765e;
}

.work-card-maro-title {
  position: absolute;
  top: 11.5%;
  left: 6.5%;
  color: #fff;
  font-size: clamp(52px, 5.25vw, 72px);
  font-weight: 880;
  line-height: .78;
  letter-spacing: -.065em;
  text-shadow: 0 7px 30px rgba(0, 8, 16, .34);
  direction: ltr;
}

.work-card-maro-title span {
  display: block;
  margin-top: .62em;
  padding-left: .15em;
  color: rgba(255, 255, 255, .92);
  font-size: .24em;
  font-weight: 720;
  letter-spacing: .46em;
  line-height: 1;
}

.work-card-maro-statement {
  position: absolute;
  left: 7%;
  bottom: 28.5%;
  max-width: 250px;
  color: #fff;
  font-size: clamp(19px, 1.75vw, 25px);
  font-weight: 780;
  line-height: .98;
  letter-spacing: -.045em;
  text-shadow: 0 4px 24px rgba(0, 8, 16, .76);
}

.work-card-maro-statement span {
  display: block;
  font-weight: 430;
  font-style: italic;
}

.work-card--maro .work-card-inner {
  z-index: 3;
}

.work-card--maro .work-card-img,
.work-card--maro .work-card-maro-title,
.work-card--maro .work-card-maro-statement {
  transition: transform .55s cubic-bezier(.22, .61, .36, 1);
}

.work-card--maro:hover .work-card-img {
  transform: scale(1.055);
}

.work-card--maro:hover .work-card-maro-title,
.work-card--maro:hover .work-card-maro-statement {
  transform: translateY(-4px);
}

[dir='rtl'] .work-card-maro-statement {
  right: 7%;
  left: auto;
  text-align: right;
}

@media (prefers-reduced-motion: reduce) {
  .work-card--maro .work-card-img,
  .work-card--maro .work-card-maro-title,
  .work-card--maro .work-card-maro-statement {
    transition: none;
  }
}