/* Gas charge page. It builds on installation.css (grid, numbered figure, highlight layers); this file holds only
   the outdoor unit scene: one view, so no camera move, and the frame keeps the render proportions (square on phones). */
.mx .xc__fig { aspect-ratio: 3 / 2; }
.mx .xc__view { inset: 0; width: auto; height: auto; }
/* Phones: a square frame shows the whole height and drops the empty floor on the left */
@media (max-width: 600px) {
  .mx .xc__fig { aspect-ratio: 1 / 1; }
  .mx .xc__view { inset: auto; left: -30%; top: 0; width: 150%; height: 100%; }
}

/* Generated from the render data (render3d/compose.py, gen_gx.py): hotspots and masks */
.xc__view[data-view="carga"] .xc-hot--1 { left: 59.58%; top: 57.19%; }
.xc__view[data-view="carga"] .xc-hot--2 { left: 52.0%; top: 36.12%; }
.xc__view[data-view="carga"] .xc-hot--3 { left: 51.58%; top: 74.25%; }
.xc__view[data-view="carga"] .xc-hot--4 { left: 77.17%; top: 63.62%; }
.xc__view[data-view="carga"] .xc-hot--5 { left: 56.88%; top: 48.75%; }
.xc__view[data-view="carga"] .xc-hot--6 { left: 31.92%; top: 39.12%; }
.xc__view[data-view="carga"][data-show="1"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-1.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-1.png); }
.xc__view[data-view="carga"][data-show="2"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-2.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-2.png); }
.xc__view[data-view="carga"][data-show="3"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-3.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-3.png); }
.xc__view[data-view="carga"][data-show="4"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-4.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-4.png); }
.xc__view[data-view="carga"][data-show="5"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-5.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-5.png); }
.xc__view[data-view="carga"][data-show="6"] :is(.xc__lift, .xc__tint, .xc__glow > span) { -webkit-mask-image: url(/assets/img/carga-gas-3d/gx-mask-6.png); mask-image: url(/assets/img/carga-gas-3d/gx-mask-6.png); }