/* ── Background tile ─────────────────────────────────── */
/* Movement is GSAP-driven — no CSS transition (composited CSS
   transitions stall on some pages). */
.ens-directional__tile {
  background-color: var(--ens-directional-bg, currentColor);
  opacity: var(--ens-directional-opacity, 0.08);
}

/* ── Image directional colour reveal ────────────────── */
.ens-directional__img-wrap {
  position: relative;
  display: inline-block;
  overflow: hidden;
  line-height: 0;
}

/* Original image → grayscale */
.ens-directional__img-gray {
  filter: grayscale(1);
}

/* Colour clone — sits on top, revealed via clip-path */
.ens-directional__img-color {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  will-change: clip-path;
}