/* Service photography stays in its native layout: motion adds depth without
   adding a scroll runway, clipping copy, or changing product/logo framing. */
#sherbimet[data-service-motion="ready"] .service-photo-card {
  position: relative;
  isolation: isolate;
  transform: perspective(1100px) translateY(var(--service-lift, 0px)) rotateX(var(--service-rx, 0deg)) rotateY(var(--service-ry, 0deg));
  transform-origin: 50% 58%;
  transition: transform .65s cubic-bezier(.2,.8,.2,1), border-color .4s, box-shadow .65s, background .4s;
}
#sherbimet[data-service-motion="ready"] .service-photo-card::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  background: radial-gradient(420px circle at var(--service-light-x, 50%) var(--service-light-y, 0%), #b9edff17, transparent 66%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s;
}
#sherbimet[data-service-motion="ready"] .service-photo-card:is(:focus-visible, [data-service-selected="true"]) {
  border-color: #55d8f1aa;
  box-shadow: 0 15px 40px #000e1e36, inset 0 0 0 1px #42d3f012;
}
#sherbimet[data-service-motion="ready"] .service-photo-card:is(:focus-visible, [data-service-selected="true"])::before {
  opacity: 1;
}
#sherbimet[data-service-motion="ready"] .service-photo-media::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #21c5e7, #bdeff9 54%, #21c5e7);
  box-shadow: 0 -2px 16px #21c5e740;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .75s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
}
#sherbimet[data-service-motion="ready"] .service-photo-card:is(:focus-visible, [data-service-selected="true"]) .service-photo-media::after {
  transform: scaleX(1);
}
#sherbimet[data-service-motion="ready"] .service-photo-number {
  transition: background .45s, color .45s, border-color .45s;
}
#sherbimet[data-service-motion="ready"] .service-photo-card[data-service-selected="true"] .service-photo-number {
  color: #c8f5ff;
  border-color: #5cdbf3a6;
}
#sherbimet[data-service-motion="ready"] .service-photo-copy h3 {
  transition: color .4s;
}
#sherbimet[data-service-motion="ready"] .service-photo-card[data-service-selected="true"] .service-photo-copy h3 {
  color: #bdeff9;
}
#sherbimet[data-service-motion="ready"] .service summary {
  position: relative;
  background: linear-gradient(90deg, #21c5e70a, transparent 76%);
  background-size: 0% 100%;
  background-repeat: no-repeat;
  transition: background-size .65s cubic-bezier(.22,1,.36,1);
}
#sherbimet[data-service-motion="ready"] .service:is([open], :focus-within) summary {
  background-size: 100% 100%;
}
#sherbimet[data-service-motion="ready"] .service-plus {
  transition: transform .55s cubic-bezier(.22,1,.36,1), border-color .35s, color .35s;
}
#sherbimet[data-service-motion="ready"] .service[open] .service-plus {
  transform: rotate(180deg);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #sherbimet[data-service-motion="ready"] .service-photo-card:hover {
    --service-lift: -5px;
    border-color: #52d2ee9c;
    box-shadow: 0 22px 42px #000c1d4a, 0 3px 12px #000c1d26;
    transition-duration: .2s, .4s, .65s, .4s;
  }
  #sherbimet[data-service-motion="ready"] .service-photo-card:hover::before {
    opacity: 1;
  }
  #sherbimet[data-service-motion="ready"] .service-photo-card:hover .service-photo-media::after {
    transform: scaleX(1);
  }
  #sherbimet[data-service-motion="ready"] .service-photo-card:hover .service-photo-copy h3 {
    color: #bdeff9;
  }
  /* Preserve specialist contain-fitting, battery labels and approved logo overlays. */
  #sherbimet[data-service-motion="ready"] .service-photo-card:not([data-service-target="ev-charging"]):not([data-service-target="battery-storage"]):not([data-service-target="consultancy-lifecycle"]) .service-photo-media > img {
    transition: transform 1.2s cubic-bezier(.22,1,.36,1);
  }
  #sherbimet[data-service-motion="ready"] .service-photo-card:not([data-service-target="ev-charging"]):not([data-service-target="battery-storage"]):not([data-service-target="consultancy-lifecycle"]):hover .service-photo-media > img {
    transform: scale(1.035);
  }
  #sherbimet[data-service-motion="ready"] .service summary:hover {
    background-size: 100% 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  #sherbimet[data-service-motion="ready"] .service-photo-card {
    transform: none;
  }
  #sherbimet[data-service-motion="ready"] :is(.service-photo-card, .service-photo-number, .service-photo-copy h3, .service summary, .service-plus),
  #sherbimet[data-service-motion="ready"] .service-photo-card::before,
  #sherbimet[data-service-motion="ready"] .service-photo-media::after {
    transition: none;
  }
  #sherbimet[data-service-motion="ready"] .service[open] .service-plus {
    transform: none;
  }
}
/* The site's existing manual motion switch has the same authority as the OS. */
body.motion-paused #sherbimet[data-service-motion="ready"] .service-photo-card,
body.motion-paused #sherbimet[data-service-motion="ready"] .service[open] .service-plus {
  transform: none;
}
body.motion-paused #sherbimet[data-service-motion="ready"] :is(.service-photo-card, .service-photo-number, .service-photo-copy h3, .service summary, .service-plus),
body.motion-paused #sherbimet[data-service-motion="ready"] .service-photo-card::before,
body.motion-paused #sherbimet[data-service-motion="ready"] .service-photo-media::after,
body.motion-paused #sherbimet[data-service-motion="ready"] .service-photo-card .service-photo-media > img {
  transition: none;
}
body.motion-paused #sherbimet[data-service-motion="ready"] .service-photo-card:not([data-service-target="ev-charging"]):not([data-service-target="battery-storage"]):not([data-service-target="consultancy-lifecycle"]):hover .service-photo-media > img {
  transform: none;
}