/* RHVA V120 - Uniform card image frames for homepage + all subpage gallery/cards
   Fixes taller mixed-ratio images such as AI Automation Support.
   Scope is intentionally limited to service/specialization/gallery cards only. */

:root {
  --rhva-v120-card-image-height: clamp(218px, 19vw, 246px);
}

/* Main current card systems: homepage V100 cards + subpage uniform popup cards */
html body .rhv-home-v100-card .rhv-card-image,
html body .rhv-home-v100-card .rhv-home-v100-media,
html body .rhv-uniform-card.rhv-popup-card .rhv-card-image,
html body .rhv-uniform-card.rhv-popup-card .rhv-home-v100-media,
html body .service-card.rhv-image-card .rhv-card-image,
html body .service-card.rhv-final-gallery-card .rhv-card-image,
html body .service-card.rhv-image-card .rhv-home-v100-media,
html body .service-card.rhv-final-gallery-card .rhv-home-v100-media {
  height: var(--rhva-v120-card-image-height) !important;
  min-height: var(--rhva-v120-card-image-height) !important;
  max-height: var(--rhva-v120-card-image-height) !important;
  width: calc(100% + 56px) !important;
  margin: -28px -28px 22px -28px !important;
  overflow: hidden !important;
  border-radius: 28px 28px 0 0 !important;
  display: block !important;
  background: #eef8fb !important;
}

html body .rhv-home-v100-card .rhv-card-image img,
html body .rhv-home-v100-card .rhv-home-v100-media img,
html body .rhv-uniform-card.rhv-popup-card .rhv-card-image img,
html body .rhv-uniform-card.rhv-popup-card .rhv-home-v100-media img,
html body .service-card.rhv-image-card .rhv-card-image img,
html body .service-card.rhv-final-gallery-card .rhv-card-image img,
html body .service-card.rhv-image-card .rhv-home-v100-media img,
html body .service-card.rhv-final-gallery-card .rhv-home-v100-media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* Legacy/direct-image fallback if a card still uses direct <img> instead of a wrapper. */
html body .service-card.rhv-image-card > img:first-child,
html body .service-card.rhv-final-gallery-card > img:first-child,
html body .service-card > img.service-card-img:first-child,
html body .rhv-home-v100-card > img:first-child,
html body .rhv-uniform-card.rhv-popup-card > img:first-child {
  width: calc(100% + 56px) !important;
  height: var(--rhva-v120-card-image-height) !important;
  min-height: var(--rhva-v120-card-image-height) !important;
  max-height: var(--rhva-v120-card-image-height) !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin: -28px -28px 22px -28px !important;
  border-radius: 28px 28px 0 0 !important;
  display: block !important;
}

/* Tablet: keep uniform but slightly taller for better image presence. */
@media (max-width: 980px) {
  :root { --rhva-v120-card-image-height: clamp(220px, 31vw, 270px); }
}

/* Phone: keep one clean size and avoid awkward tall last card. */
@media (max-width: 640px) {
  :root { --rhva-v120-card-image-height: 230px; }

  html body .rhv-home-v100-card .rhv-card-image,
  html body .rhv-home-v100-card .rhv-home-v100-media,
  html body .rhv-uniform-card.rhv-popup-card .rhv-card-image,
  html body .rhv-uniform-card.rhv-popup-card .rhv-home-v100-media,
  html body .service-card.rhv-image-card .rhv-card-image,
  html body .service-card.rhv-final-gallery-card .rhv-card-image,
  html body .service-card.rhv-image-card .rhv-home-v100-media,
  html body .service-card.rhv-final-gallery-card .rhv-home-v100-media,
  html body .service-card.rhv-image-card > img:first-child,
  html body .service-card.rhv-final-gallery-card > img:first-child,
  html body .service-card > img.service-card-img:first-child,
  html body .rhv-home-v100-card > img:first-child,
  html body .rhv-uniform-card.rhv-popup-card > img:first-child {
    width: calc(100% + 44px) !important;
    margin: -22px -22px 20px -22px !important;
    border-radius: 24px 24px 0 0 !important;
  }
}