/* Keep the original COB photographs; their frames follow the photographed scene. */
html:root body[data-cob-gallery="wcob"] #content .wc-product figure {
  aspect-ratio: auto;
  background: transparent;
}
html:root body[data-cob-gallery="wcob"] #content .wc-product figure img {
  width: 100%;
  height: auto !important;
  object-fit: contain !important;
}

/* This original IP67 photograph includes white export margins. A wide crop
   shows the same waterproof strip and end cap without those margins. */
html:root body[data-cob-gallery="ip67"] #content .wc-product figure {
  aspect-ratio: 1.36;
  overflow: hidden;
}
html:root body[data-cob-gallery="ip67"] #content .wc-product figure img {
  width: 100%;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 50% 48% !important;
}

/* The catalogue has a portrait card and a separate phone photograph. Crop
   only the bordered original; the other COB and WCOB photos stay untouched. */
html:root body #content .as-side-slider .elementor-testimonial__image img[src*="33a8dba23663939a"] {
  transform: scale(1.28) !important;
  transform-origin: center !important;
}
html:root body #content .as-slider-background img[src*="33a8dba23663939a"] {
  transform: scale(1.28) !important;
  transform-origin: center !important;
}
html:root body #content #pm-mobile-panel .pm-feature-photo[src*="33a8dba23663939a"] {
  transform: scale(1.28) !important;
  transform-origin: center !important;
  clip-path: inset(10% 0);
}

/* The tablet gallery keeps its two images, now in photographic proportions.
   The existing desktop presentation continues to own its animation. */
@media (max-width: 1024px) {
  /* Crop the same original in the small-screen hero too. The foreground
     gradient finishes before its lower export margin enters the picture. */
  html:root body[data-cob-gallery="ip67"] #content .pe-hero {
    background-image: linear-gradient(180deg, transparent 32svh, #090c10 56svh), url('assets/tasmy-2026/zdjecia/33a8dba23663939a.webp') !important;
    background-size: 100% 100%, max(100vw, 70svh) auto !important;
    background-position: center, center calc(max(100vw, 70svh) * -.085) !important;
    background-repeat: no-repeat !important;
    background-color: #090c10 !important;
  }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase :is(.mdw-card-portfolio-image-left,.mdw-card-portfolio-image-right) {
    height: auto !important;
    aspect-ratio: 3 / 2;
    min-width: 0;
  }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .elementor-widget-image .elementor-widget-container {
    height: 100% !important;
    border-radius: 14px !important;
  }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .elementor-widget-image img {
    object-fit: cover !important;
    border-radius: 14px !important;
  }
}
@media (max-width: 600px) {
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .pm-showcase-window {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .mdw-card-portfolio-image-left { order: 1; }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .mdw-card-portfolio-image-right { order: 2; }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .pm-reveal-copy { order: 3; margin-top: 8px !important; }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase :is(.mdw-card-portfolio-image-left,.mdw-card-portfolio-image-right) {
    aspect-ratio: auto;
  }
  html:root body:is([data-cob-gallery="standard"],[data-cob-gallery="digital"]) #content .pm-shared-showcase .elementor-widget-image img {
    display: block;
    width: 100% !important;
    height: auto !important;
  }
}

/* Each real session gets a large photograph and four visible, named views. */
html:root body[data-cob-gallery] #content .pc-product-gallery {
  min-width: 0;
  align-self: center;
}
html:root body[data-cob-gallery] #content .pc-product-gallery .pc-gallery-stage {
  margin: 0;
  aspect-ratio: auto;
  overflow: visible;
  background: transparent;
}
html:root body[data-cob-gallery] #content .pc-gallery-stage > a {
  position: relative;
  display: block;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 10px;
  background: #080a0d;
}
html:root body[data-cob-gallery] #content .pc-gallery-stage > a img {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0;
}
html:root body[data-cob-gallery] #content .pc-gallery-expand {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  background: #090c10b8;
  border: 1px solid #ffffff40;
  border-radius: 50%;
  color: #fff;
  font: 19px/1 Arial, sans-serif;
}
html:root body[data-cob-gallery] #content .pc-gallery-stage figcaption {
  min-height: 3.3em;
  padding: 12px 0 0;
  font: 400 13px/1.55 Manrope, Arial, sans-serif;
  color: #abb8c2;
  text-align: left;
}
html:root body[data-cob-gallery] #content .pc-gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
html:root body[data-cob-gallery] #content .pc-gallery-thumb {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 0;
  padding: 0 0 9px;
  overflow: hidden;
  border: 1px solid #ffffff23;
  border-radius: 7px;
  background: #ffffff04;
  box-shadow: none;
  color: #aebac4;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
html:root body[data-cob-gallery] #content .pc-gallery-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  margin: 0 0 8px;
  border-radius: 0;
}
html:root body[data-cob-gallery] #content .pc-gallery-thumb span {
  display: block;
  width: 100%;
  padding: 0 5px;
  font: 400 11px/1.4 Manrope, Arial, sans-serif;
  text-align: center;
  white-space: normal;
}
html:root body[data-cob-gallery] #content .pc-gallery-thumb:is(:hover,[aria-pressed="true"]) {
  border-color: #df9b6b;
  background: #df9b6b12;
  color: #fff;
}
html:root body[data-cob-gallery] #content :is(.pc-gallery-thumb,.pc-gallery-stage > a):focus-visible {
  outline: 2px solid #efb084;
  outline-offset: 4px;
}
@media (max-width: 600px) {
  html:root body[data-cob-gallery] #content .pc-gallery-thumbs { gap: 7px; margin-top: 10px; }
  html:root body[data-cob-gallery] #content .pc-gallery-thumb span { font-size: 10px; padding: 0 3px; }
  html:root body[data-cob-gallery] #content .pc-gallery-stage figcaption { font-size: 12px; }
}