/* ============================================================
   GenCom Cinematic v3 — Interactive 3D depth (no WebGL)
   Cards & key images tilt in 3D toward the cursor with real
   perspective + a soft lift and sheen. Desktop pointer only;
   fully disabled on touch and reduced-motion. Loads after v2.
   ============================================================ */

@media (min-width: 992px) and (pointer: fine){

  /* the element JS tilts */
  .gc-tilt{
    transition: transform .18s cubic-bezier(.22,.8,.26,.99), box-shadow .3s ease;
    transform-style: preserve-3d;
    will-change: transform;
  }
  /* smoother, slightly longer ease when the cursor leaves (reset) */
  .gc-tilt.gc-tilt-reset{
    transition: transform .55s cubic-bezier(.22,.8,.26,.99), box-shadow .4s ease;
  }
  /* depth shadow while actively tilting */
  .gc-tilt.gc-tilt-active{
    box-shadow: 0 30px 60px -28px rgba(14,17,22,.45) !important;
  }

  /* moving sheen that follows the cursor across a tilting card */
  .gc-tilt .gc-sheen{
    position:absolute; inset:0; pointer-events:none; z-index:5;
    border-radius:inherit; opacity:0; transition:opacity .25s ease;
    background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),
              rgba(255,255,255,.28), rgba(255,255,255,0) 45%);
    mix-blend-mode:soft-light;
  }
  .gc-tilt.gc-tilt-active .gc-sheen{ opacity:1; }
}

/* never on touch / reduced motion */
@media (prefers-reduced-motion: reduce){
  .gc-tilt{ transition:none !important; transform:none !important; }
  .gc-tilt .gc-sheen{ display:none !important; }
}