.card:has(a[href*="/project/tabuk-fish-com/"] ) .photo,
.card:has(a[href*="/project/oalbrahim-com/"] ) .photo,
.card:has(a[href*="/project/rutall-com/"] ) .photo,
.card:has(a[href*="/project/jbk-cpa-com/"] ) .photo,
.card:has(a[href*="/project/tadamonfirm-com/"] ) .photo{height:auto!important;width:100%!important;max-width:100%;min-height:100%;bottom:auto!important;left:0!important;right:0!important;top:0;transform:translateY(0);transition:none!important;animation:dawaer-portfolio-tour 28s linear infinite!important;filter:none}
.card:has(a[href*="/project/tabuk-fish-com/"]):is(:hover,:focus-within) .photo,
.card:has(a[href*="/project/oalbrahim-com/"]):is(:hover,:focus-within) .photo,
.card:has(a[href*="/project/rutall-com/"]):is(:hover,:focus-within) .photo,
.card:has(a[href*="/project/jbk-cpa-com/"]):is(:hover,:focus-within) .photo,
.card:has(a[href*="/project/tadamonfirm-com/"]):is(:hover,:focus-within) .photo{animation-play-state:paused!important}
@keyframes dawaer-portfolio-tour{0%,8%,96%,100%{top:0;transform:translateY(0)}48%,60%{top:100%;transform:translateY(-100%)}}
.site-page-frame:has(img[src*="/tabuk-fish-com/"]){overflow:hidden!important}
.site-page-frame:has(img[src*="/tabuk-fish-com/"]) img{width:100%!important;height:auto!important;position:absolute!important;left:0;bottom:auto;transition:none!important;filter:none;animation:dawaer-portfolio-tour 28s linear infinite!important}
.site-page-frame:has(img[src*="/tabuk-fish-com/"]):is(:hover,:focus-within) img{animation-play-state:paused!important}
.site-page-frame:has(img[src*="/tabuk-fish-com/"])::after{display:none}
.site-page-frame:has(img[src*="/jbk-cpa-com/"]){overflow:hidden!important}
.site-page-frame:has(img[src*="/jbk-cpa-com/"]) img{width:100%!important;height:auto!important;position:absolute!important;left:0;bottom:auto;transition:none!important;filter:none;animation:dawaer-portfolio-tour 28s linear infinite!important}
.site-page-frame:has(img[src*="/jbk-cpa-com/"]):is(:hover,:focus-within) img{animation-play-state:paused!important}
.site-page-frame:has(img[src*="/jbk-cpa-com/"])::after{display:none}
@media(prefers-reduced-motion:reduce){.card:has(a[href*="/project/tabuk-fish-com/"] ) .photo,
.card:has(a[href*="/project/oalbrahim-com/"] ) .photo,
.card:has(a[href*="/project/rutall-com/"] ) .photo,
.card:has(a[href*="/project/jbk-cpa-com/"] ) .photo,
.card:has(a[href*="/project/tadamonfirm-com/"] ) .photo{animation:none!important}}

/* All website screenshots share one hover-only vertical preview. */
.card.card.site-card .photo.photo{animation:none!important;top:0;transform:translateY(0);height:auto!important;width:100%!important;min-height:100%;bottom:auto!important;left:0!important;right:0!important;transition:none!important;object-fit:initial}
@keyframes dawaer-card-hover-tour{0%,100%{top:0;transform:translateY(0)}48%,58%{top:100%;transform:translateY(-100%)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
.card.card.site-card:hover .photo.photo{animation:dawaer-card-hover-tour 18s linear infinite!important;animation-play-state:running!important;top:0;will-change:top,transform}
}
