/* Real, local imagery, rendered without scaled or tilted image layers. */
#cards .service-photo{position:relative;display:block;isolation:isolate;height:clamp(210px,22vw,270px);overflow:hidden;background:#edf3f8;border-bottom:1px solid var(--line);text-decoration:none;flex:none}
.service-photo>img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--photo-x,50%) var(--photo-y,50%)}
.service-photo.product-preview>img{object-position:center 20%}
.service-photo-index,.service-photo-arrow{position:absolute;top:16px;z-index:1;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--navy);box-shadow:0 2px 8px #122f4920;font-size:11px;font-weight:500}
.service-photo-index{inset-inline-start:16px}.service-photo-arrow{inset-inline-end:16px;font-size:19px;transition:background .25s,color .25s,transform .25s}
.service-photo:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.card:hover .service-photo:after,.card:focus-within .service-photo:after{transform:scaleX(1)}
.card:hover .service-photo-arrow,.card:focus-within .service-photo-arrow{background:var(--navy);color:#fff;transform:translate(2px,-2px)}
.service-sample{position:absolute;bottom:12px;inset-inline-end:14px;font-size:10px;padding:4px 8px;border-radius:5px;color:#4e6e87;background:#fffffff2;border:1px solid #dbe7f0}
.service-photo:focus-visible{outline:3px solid var(--cyan);outline-offset:-4px}
html[lang=ar] .service-photo-arrow{transform:scaleX(-1)}html[lang=ar] .card:hover .service-photo-arrow{transform:scaleX(-1) translate(2px,-2px)}
@media(max-width:680px){#cards .service-photo{height:230px}.service-photo-index,.service-photo-arrow{top:14px}.service-photo-index{inset-inline-start:14px}.service-photo-arrow{inset-inline-end:14px}}
@media(prefers-reduced-motion:reduce){.service-photo:after,.service-photo-arrow{transition:none!important}}
