/* A consistent, understated photographic response across the resort story. */
@media (hover: hover) and (pointer: fine) {
  .image-motion:not(.managed-photo) {
    --image-x: 50%;
    --image-y: 50%;
    background-position: var(--image-x) var(--image-y);
    background-size: 104%;
    isolation: isolate;
    overflow: hidden;
    position: relative;
    transition: background-position .45s ease-out, background-size 1.1s cubic-bezier(.2,.7,.2,1);
  }
  .image-motion:not(.managed-photo):hover { background-size: 112%; }
  .image-motion:not(.managed-photo)::after {
    background: radial-gradient(circle at var(--image-x) var(--image-y), rgba(255,250,231,.19), rgba(255,250,231,0) 34%);
    content: '';
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity .5s ease;
    z-index: 0;
  }
  .image-motion:not(.managed-photo):hover::after { opacity: 1; }
  .image-motion > div,
  .image-motion > span { position: relative; z-index: 1; }

  .managed-photo { overflow: hidden; }
  .managed-photo img { transition: transform 1.1s cubic-bezier(.2,.7,.2,1), filter .7s ease; }
  .managed-photo:hover img { filter: saturate(1.08) contrast(1.03); transform: scale(1.06); }
}

@media (prefers-reduced-motion: reduce) {
  .image-motion,
  .image-motion::after,
  .managed-photo img { transition: none !important; }
}