.room-card {
  overflow: hidden;
  transition: transform .32s cubic-bezier(.2,.75,.25,1), box-shadow .32s ease;
}

.room-image {
  transform: scale(1.001);
  transition: transform .55s cubic-bezier(.2,.75,.25,1), filter .4s ease;
  will-change: transform;
}

.room-body {
  position: relative;
  z-index: 2;
  background: #fff;
}

@media (hover: hover) and (pointer: fine) {
  .room-card:hover,
  .room-card:focus-within {
    transform: translateY(-7px);
    box-shadow: 0 24px 54px rgba(9,23,34,.16);
  }

  .room-card:hover .room-image,
  .room-card:focus-within .room-image {
    transform: scale(1.075);
    filter: saturate(1.06) contrast(1.03);
  }

  .room-card:hover .room-body > a,
  .room-card:focus-within .room-body > a {
    border-color: var(--gold);
    background: var(--gold);
    color: var(--navy);
  }
}

.room-body > a {
  transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

@media (prefers-reduced-motion: reduce) {
  .room-card,
  .room-image,
  .room-body > a {
    transition: none;
  }

  .room-card:hover,
  .room-card:focus-within,
  .room-card:hover .room-image,
  .room-card:focus-within .room-image {
    transform: none;
  }
}
