/* Citivet frame tokens — brand-navy stroke + hard offset */
:root {
  --citivet-frame-stroke-width: 0.1rem;
  --citivet-frame-stroke: var(--citivet-frame-stroke-width) solid var(--base-color-brand--navy, #2d3277);
  --citivet-frame-shadow: 5px 5px 0 0 var(--base-color-brand--navy, #2d3277);
  --citivet-frame-border-soft: color-mix(
    in srgb,
    var(--base-color-brand--navy, #2d3277) 25%,
    transparent
  );
  --citivet-frame-inner-stroke: 1px solid var(--citivet-frame-border-soft);
  --citivet-button-radius: 0.75rem;
}

/* Framed cards — homepage + site-wide rollout */
.home_services .service-card,
.services_facilities .service-card,
.google-reviews_card,
.section_technology-preview .technology-preview_grid .technology-preview_card,
.specials_offer,
.careers_listing,
.section_cta .content_cta,
.section_contacts .branch-card,
.section_team .team-card,
.gallery-card,
.wp-card,
.wp-plan-card,
.wp-benefit-card,
.wp-lifestage-card,
.wp-nav-card,
.technology-benefits_card,
.section_veterinary-technology .veterinary-technology_machine-block {
  border: var(--citivet-frame-stroke);
  box-shadow: var(--citivet-frame-shadow);
  overflow: visible;
  transition: transform 0.25s ease-out;
}

.home_services .service-card:hover,
.services_facilities .service-card:hover,
.section_technology-preview .technology-preview_grid .technology-preview_card:hover,
a.google-reviews_card:hover,
.section_contacts .branch-card:hover,
.section_team .team-card:hover,
.gallery-card:hover,
.wp-card:hover,
.wp-benefit-card:hover,
.wp-lifestage-card:hover,
a.wp-nav-card:hover,
.technology-benefits_card:hover,
.section_veterinary-technology .veterinary-technology_machine-block:hover {
  transform: translate(-2px, -2px);
  box-shadow: var(--citivet-frame-shadow);
}

/* Help you can trust + Google reviews + careers — thin navy frame, tonal-blue fill */
.home_services .service-card,
.home_google-reviews a.google-reviews_card,
.careers_listing {
  background-color: var(--base-color-brand--tonal-blue, #dbdff4);
}

/* Careers bay pocket — light-blue card pops off tonal-blue fill */
#home-careers .careers_listing {
  background-color: var(--base-color-brand--light-blue, #e9ebf8);
}

.home_services .service-card,
.services_facilities .service-card {
  overflow: visible;
  justify-content: flex-start;
}

.home_services .service-card .service-image,
.services_facilities .service-card .service-image {
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  align-self: auto;
  border-top-left-radius: calc(2rem - var(--citivet-frame-stroke-width));
  border-top-right-radius: calc(2rem - var(--citivet-frame-stroke-width));
  overflow: hidden;
}

.home_services .service-text,
.services_facilities .service-text {
  flex: 0 0 auto;
  width: 100%;
  border-bottom-left-radius: calc(2rem - var(--citivet-frame-stroke-width));
  border-bottom-right-radius: calc(2rem - var(--citivet-frame-stroke-width));
}

.home_services .service-text h3,
.services_facilities .service-text h3 {
  overflow-wrap: break-word;
}

.section_technology-preview .technology-preview_grid .technology-preview_card .technology-preview_image {
  border-top-left-radius: calc(1rem - var(--citivet-frame-stroke-width));
  border-top-right-radius: calc(1rem - var(--citivet-frame-stroke-width));
  overflow: hidden;
}

.specials_offer {
  overflow: visible;
  background-color: var(--base-color-brand--light-blue);
}

.specials_offer-media {
  overflow: hidden;
  border-top-left-radius: calc(1.25rem - var(--citivet-frame-stroke-width));
  border-bottom-left-radius: calc(1.25rem - var(--citivet-frame-stroke-width));
}

.specials_offer-media img {
  border-top-left-radius: calc(1.25rem - var(--citivet-frame-stroke-width));
  border-bottom-left-radius: calc(1.25rem - var(--citivet-frame-stroke-width));
}

@media (max-width: 61.99rem) {
  .specials_offer-media,
  .specials_offer-media img {
    border-bottom-left-radius: 0;
    border-top-right-radius: calc(1.25rem - var(--citivet-frame-stroke-width));
  }
}

.section_cta .content_cta {
  overflow: visible;
}

.section_cta .cta-image {
  width: auto;
  height: auto;
  aspect-ratio: auto;
  align-self: stretch;
  border: 0;
  box-shadow: none;
  overflow: hidden;
  border-radius: calc(1.25rem - var(--citivet-frame-stroke-width)) 0 0 calc(1.25rem - var(--citivet-frame-stroke-width));
}

.section_cta .cta-image img {
  border-radius: calc(1.25rem - var(--citivet-frame-stroke-width)) 0 0 calc(1.25rem - var(--citivet-frame-stroke-width));
}

@media (max-width: 61.99rem) {
  .section_cta .cta-image,
  .section_cta .cta-image img {
    border-radius: calc(1.25rem - var(--citivet-frame-stroke-width)) calc(1.25rem - var(--citivet-frame-stroke-width)) 0 0;
  }
}

/* Extra grid gap so offsets do not collide */
.home_services .service-cards,
.services_facilities .service-cards {
  gap: 1.25rem;
}

/* Desktop: 6-across rectangular cards — square image, label below (live-site shape) */
@media (min-width: 62rem) {
  .home_services .service-card,
  .services_facilities .service-card {
    min-width: 0;
  }

  .home_services .service-card .service-image,
  .services_facilities .service-card .service-image {
    flex: 0 0 auto;
    aspect-ratio: 1;
    height: auto;
    min-height: 0;
  }

  .home_services .service-text,
  .services_facilities .service-text {
    padding: 0.75rem 0.5rem 0.85rem;
  }

  .home_services .service-text h3,
  .services_facilities .service-text h3 {
    font-size: 1rem;
    line-height: 1.25;
  }

  .home_services .service-text h3.text-size-small,
  .services_facilities .service-text h3.text-size-small {
    font-size: 0.85rem;
  }
}

/* 2-col tablet: smaller titles so long labels wrap inside the frame */
@media (max-width: 47.99rem) {
  .home_services .service-text h3,
  .services_facilities .service-text h3 {
    font-size: 1.2rem;
  }
}

/* Home services: 2-up grid on mobile */
@media (max-width: 47.99rem) {
  .home_services .service-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Phone: tighten card copy in 2-col grid */
@media (max-width: 29.99rem) {
  .home_services .service-text {
    padding: 0.5rem 0.4rem 0.65rem;
  }

  .home_services .service-text h3 {
    font-size: 0.85rem;
    line-height: 1.2;
  }
}

.section_technology-preview .technology-preview_grid {
  gap: 1.75rem;
}