/*
 * FIX ARRAY responsive media precision layer.
 *
 * Neutral fallbacks preserve all existing layouts. Elementor only changes
 * position/offset/zoom when an editor sets the corresponding control.
 * Individual CSS transform properties intentionally coexist with legacy hover
 * transforms, parallax and card motion instead of replacing them.
 */

/*
 * Service Hero: focal point and fine offsets share one crop coordinate system.
 * This avoids moving the entire media box with translate and makes X/Y behave
 * identically for images and self-hosted videos on every responsive device.
 */
.elementor-widget-fixarray-service-hero .fixarray-service-hero__image,
.elementor-widget-fixarray-service-hero .fixarray-service-hero__image-video,
.elementor-widget-fixarray-service-hero .fixarray-service-hero__image.fixarray-media-video {
  object-position:
    calc(var(--fax-service-hero-focal-x, 50%) + var(--fax-service-hero-media-offset-x, 0px))
    calc(var(--fax-service-hero-focal-y, 50%) + var(--fax-service-hero-media-offset-y, 0px));
  scale: var(--fax-service-hero-media-zoom, 1);
  transform-origin:
    var(--fax-service-hero-focal-x, 50%)
    var(--fax-service-hero-focal-y, 50%);
}

/* Action Cards: widget-wide responsive defaults + optional per-card overrides. */
.elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media img,
.elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media .fixarray-media-video,
.elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media img,
.elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media .fixarray-media-video {
  object-position: var(--fax-card-media-position-d, var(--fax-action-media-position));
  translate:
    var(--fax-card-media-offset-x-d, var(--fax-action-media-offset-x, 0px))
    var(--fax-card-media-offset-y-d, var(--fax-action-media-offset-y, 0px));
  scale: var(--fax-card-media-zoom-d, var(--fax-action-media-zoom, 1));
  transform-origin: var(--fax-card-media-position-d, var(--fax-action-media-position, 50% 50%));
}

/* Ziclope galleries use the same model: global responsive base + per-shot override. */
.elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot img,
.elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot .fixarray-media-video {
  object-position: var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position));
  translate:
    var(--fax-ziclope-shot-media-offset-x-d, var(--fax-ziclope-gallery-media-offset-x, 0px))
    var(--fax-ziclope-shot-media-offset-y-d, var(--fax-ziclope-gallery-media-offset-y, 0px));
  scale: var(--fax-ziclope-shot-media-zoom-d, var(--fax-ziclope-gallery-media-zoom, 1));
  transform-origin: var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position, 50% 50%));
}

@media (max-width: 1024px) {
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media img,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media .fixarray-media-video,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media img,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media .fixarray-media-video {
    object-position: var(--fax-card-media-position-t, var(--fax-card-media-position-d, var(--fax-action-media-position)));
    translate:
      var(--fax-card-media-offset-x-t, var(--fax-card-media-offset-x-d, var(--fax-action-media-offset-x, 0px)))
      var(--fax-card-media-offset-y-t, var(--fax-card-media-offset-y-d, var(--fax-action-media-offset-y, 0px)));
    scale: var(--fax-card-media-zoom-t, var(--fax-card-media-zoom-d, var(--fax-action-media-zoom, 1)));
    transform-origin: var(--fax-card-media-position-t, var(--fax-card-media-position-d, var(--fax-action-media-position, 50% 50%)));
  }

  .elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot img,
  .elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot .fixarray-media-video {
    object-position: var(--fax-ziclope-shot-media-position-t, var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position)));
    translate:
      var(--fax-ziclope-shot-media-offset-x-t, var(--fax-ziclope-shot-media-offset-x-d, var(--fax-ziclope-gallery-media-offset-x, 0px)))
      var(--fax-ziclope-shot-media-offset-y-t, var(--fax-ziclope-shot-media-offset-y-d, var(--fax-ziclope-gallery-media-offset-y, 0px)));
    scale: var(--fax-ziclope-shot-media-zoom-t, var(--fax-ziclope-shot-media-zoom-d, var(--fax-ziclope-gallery-media-zoom, 1)));
    transform-origin: var(--fax-ziclope-shot-media-position-t, var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position, 50% 50%)));
  }
}

@media (max-width: 767px) {
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media img,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__media .fixarray-media-video,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media img,
  .elementor-widget-fixarray-action-cards .fixarray-action-cards .fixarray-action-card .fixarray-action-card__audience-media .fixarray-media-video {
    object-position: var(--fax-card-media-position-m, var(--fax-card-media-position-t, var(--fax-card-media-position-d, var(--fax-action-media-position))));
    translate:
      var(--fax-card-media-offset-x-m, var(--fax-card-media-offset-x-t, var(--fax-card-media-offset-x-d, var(--fax-action-media-offset-x, 0px))))
      var(--fax-card-media-offset-y-m, var(--fax-card-media-offset-y-t, var(--fax-card-media-offset-y-d, var(--fax-action-media-offset-y, 0px))));
    scale: var(--fax-card-media-zoom-m, var(--fax-card-media-zoom-t, var(--fax-card-media-zoom-d, var(--fax-action-media-zoom, 1))));
    transform-origin: var(--fax-card-media-position-m, var(--fax-card-media-position-t, var(--fax-card-media-position-d, var(--fax-action-media-position, 50% 50%))));
  }

  .elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot img,
  .elementor-widget-fixarray-ziclope-product .fixarray-ziclope-product .fixarray-ziclope-product__shot .fixarray-media-video {
    object-position: var(--fax-ziclope-shot-media-position-m, var(--fax-ziclope-shot-media-position-t, var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position))));
    translate:
      var(--fax-ziclope-shot-media-offset-x-m, var(--fax-ziclope-shot-media-offset-x-t, var(--fax-ziclope-shot-media-offset-x-d, var(--fax-ziclope-gallery-media-offset-x, 0px))))
      var(--fax-ziclope-shot-media-offset-y-m, var(--fax-ziclope-shot-media-offset-y-t, var(--fax-ziclope-shot-media-offset-y-d, var(--fax-ziclope-gallery-media-offset-y, 0px))));
    scale: var(--fax-ziclope-shot-media-zoom-m, var(--fax-ziclope-shot-media-zoom-t, var(--fax-ziclope-shot-media-zoom-d, var(--fax-ziclope-gallery-media-zoom, 1))));
    transform-origin: var(--fax-ziclope-shot-media-position-m, var(--fax-ziclope-shot-media-position-t, var(--fax-ziclope-shot-media-position-d, var(--fax-ziclope-gallery-media-position, 50% 50%))));
  }
}

/* Service FAQ: visual-card width is independent from the media crop/zoom. */
.elementor-widget-fixarray-service-faq .fixarray-service-faq--has-visual.fixarray-service-faq--visual-right .fixarray-service-faq__layout {
  grid-template-columns:
    minmax(0, calc(100% - var(--fax-faq-visual-width, 40%) - var(--fax-faq-layout-gap, 64px)))
    minmax(0, var(--fax-faq-visual-width, 40%));
}

.elementor-widget-fixarray-service-faq .fixarray-service-faq--has-visual.fixarray-service-faq--visual-left .fixarray-service-faq__layout {
  grid-template-columns:
    minmax(0, var(--fax-faq-visual-width, 40%))
    minmax(0, calc(100% - var(--fax-faq-visual-width, 40%) - var(--fax-faq-layout-gap, 64px)));
}

@media (max-width: 900px) {
  .elementor-widget-fixarray-service-faq .fixarray-service-faq--has-visual.fixarray-service-faq--visual-right .fixarray-service-faq__layout,
  .elementor-widget-fixarray-service-faq .fixarray-service-faq--has-visual.fixarray-service-faq--visual-left .fixarray-service-faq__layout {
    grid-template-columns: minmax(0, 1fr);
  }
}