/* NPC ePix Stage captions v1.1.7
   Phones: portrait only. Tablets: portrait and landscape.
   Override ePix's 700ms horizontal inner-box reveal with a zero-delay
   vertical entrance. A deliberate image tap dismisses downward. */
@media screen and (max-width: 767px) and (orientation: portrait),
       screen and (min-width: 768px) and (max-width: 1024px),
       screen and (min-width: 1025px) and (max-width: 1366px) and (pointer: coarse) {

  /* Override initial theme hidden state of the wrapper. Keep placement
     from gallery-styling.css (including phone bottom/right positioning). */
  body .post-gallery-wrap.stage .stage-slider > .panel.current .caption-wrap.caption-hover {
    display: block !important;
    visibility: visible !important;
    opacity: 1;
    animation: none !important;
    transition: none !important;
    transform: none;
    pointer-events: auto !important;
  }

  /* ePix actually hides and animates these inner .caption blocks using
     translateX(200%). Override their transform and delay individually. */
  body .post-gallery-wrap.stage .stage-slider > .panel.current .caption-wrap.caption-hover > .caption,
  body .post-gallery-wrap.stage .stage-slider > .panel.current .gridimg-wrap:hover .caption-wrap.caption-hover > .caption {
    visibility: visible !important;
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    transition: none !important;
    -webkit-transition: none !important;
    transition-delay: 0s !important;
    animation: none !important;
  }

  /* Animate appearance only when the slide becomes active.
     Animations start immediately; no 700ms ePix transition wait. */
  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-enter .caption-wrap.caption-hover {
    animation: npc-caption-rise-in 260ms cubic-bezier(.2,.8,.2,1) both !important;
    -webkit-animation: npc-caption-rise-in 260ms cubic-bezier(.2,.8,.2,1) both !important;
  }

  @keyframes npc-caption-rise-in {
    from { opacity: 0; transform: translate3d(0, 22px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
  }

  /* Dismiss on tap: move entire wrapper down, not sideways.
     All constituent title/body blocks travel together. */
  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-dismissed .caption-wrap.caption-hover,
  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-dismissed .caption-wrap.caption-hover:hover {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translate3d(0, 120%, 0) !important;
    -webkit-transform: translate3d(0, 120%, 0) !important;
    transition: transform 320ms ease-in, opacity 320ms ease-in,
                visibility 0s linear 320ms !important;
    -webkit-transition: -webkit-transform 320ms ease-in, opacity 320ms ease-in,
                visibility 0s linear 320ms !important;
    pointer-events: none !important;
  }

  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-dismissed .caption-wrap.caption-hover > .caption {
    animation: none !important;
    -webkit-animation: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-enter .caption-wrap.caption-hover,
  body .post-gallery-wrap.stage .stage-slider > .panel.current.npc-caption-dismissed .caption-wrap.caption-hover {
    animation: none !important;
    -webkit-animation: none !important;
    transition: none !important;
    -webkit-transition: none !important;
  }
}