/* ==========================================================================
   AROZEN CARE — LABORATORY PAGE (laboratory.html)
   Kept in its own file per spec. Reuses global tokens/utilities from
   home.css (:root vars, .container, .btn/.btn-primary/.btn-outline/
   .btn-lg, header/nav, .text-gradient, the fadeUpIn/fadeIn keyframes,
   and the global prefers-reduced-motion reset) — this file only adds
   page-specific rules, same pattern as about.css/services.css.
   Mobile-first; desktop switch at 900px, matching the breakpoint used
   site-wide.
   Section map: S1. Hero
   ========================================================================== */

/* ===== LABORATORY SECTION 1 — HERO ===== */
/* Mobile: a single centered-ish column — copy first, image below the
   buttons. Desktop (900px+): a standard 2-column split — copy left,
   image right, vertically centered — with the image held in a simple
   rounded/shadowed frame (no floating cards, no aspect-ratio cropping)
   so it reads as part of the layout. Same structural pattern as
   .about-hero in about.css, adapted with laboratory-hero-* names since
   all CSS for this section must live in this file. */
.laboratory-hero {
  position: relative;
  overflow: hidden;
  padding-block: 2.5rem 3rem;
  background: var(--color-bg);
}

/* Subtle line/grid texture + soft blue/teal ambient glow, masked toward
   the top-right — same decorative language as Home/About's hero
   background. */
.laboratory-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    radial-gradient(ellipse 60% 50% at 88% 10%, rgba(38, 59, 143, 0.07) 0%, transparent 70%),
    radial-gradient(ellipse 55% 50% at 8% 95%, rgba(91, 199, 176, 0.08) 0%, transparent 70%),
    linear-gradient(rgba(38, 59, 143, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 59, 143, 0.05) 1px, transparent 1px);
  background-size: auto, auto, 42px 42px, 42px 42px;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 85% 15%, #000 0%, transparent 72%);
  mask-image: radial-gradient(ellipse 70% 60% at 85% 15%, #000 0%, transparent 72%);
}

.laboratory-hero-inner {
  position: relative;
  z-index: 1;
}

/* Mobile-first: single column, everything centered */
.laboratory-hero-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
}

.laboratory-hero-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  text-align: center;
  opacity: 0;
  animation: fadeUpIn 0.8s var(--ease) both;
}

.laboratory-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-secondary-dark);
  margin: 0 0 1rem;
}

.laboratory-hero-heading {
  max-width: 22ch;
  margin-inline: auto;
  font-size: clamp(2.1rem, 6vw, 3.2rem);
  font-weight: 700;
  line-height: 1.18;
  color: var(--color-text);
  margin-bottom: 1.5rem;
}

.laboratory-hero-text {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--color-text-muted);
  max-width: 52ch;
  margin: 0 auto 1.75rem;
}

.laboratory-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.9rem;
}

.laboratory-hero-actions .btn span {
  display: inline-block;
  margin-left: 0.4rem;
  transition: transform 0.25s var(--ease);
}

.laboratory-hero-actions .btn:hover span,
.laboratory-hero-actions .btn:focus-visible span {
  transform: translateX(4px);
}

/* Image: simple, integrated rounded frame — soft shadow, no offset
   panel, no floating badges. width:100%/height:auto (no forced
   aspect-ratio) keeps the image at its true native proportions, so
   nothing is ever cropped out of the composition — same approach as
   .about-hero-image in about.css. */
.laboratory-hero-media {
  width: 100%;
  max-width: 420px;
  opacity: 0;
  animation: fadeIn 1s var(--ease) 0.15s both;
}

.laboratory-hero-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}

/* Fallback shown if the image fails to load — same graceful pattern
   used across the rest of the site */
.laboratory-hero-image.laboratory-hero-image--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 3 / 4;
  background: linear-gradient(155deg, var(--color-primary) 0%, var(--color-secondary-dark) 100%);
  color: rgba(255, 255, 255, 0.85);
  font-family: var(--font-heading);
  font-size: 0.95rem;
  text-align: center;
  padding: 2rem;
}

/* --------------------------------------------------------------------------
   LABORATORY SECTION 1 — RESPONSIVE
   -------------------------------------------------------------------------- */
/* Matches the same extra breakpoint about-hero-actions uses in
   about.css for this exact concern (button row wrapping) */
@media (min-width: 600px) {
  .laboratory-hero-actions {
    flex-wrap: nowrap;
  }
}

/* 900px+ matches the breakpoint used site-wide: switch to the standard
   2-column layout, left-align the copy, and vertically center the
   image alongside it */
@media (min-width: 900px) {
  .laboratory-hero {
    padding-block: 4rem 4.5rem;
  }

  .laboratory-hero-row {
    flex-direction: row;
    align-items: center;
    gap: 4.5rem;
  }

  .laboratory-hero-copy {
    align-items: flex-start;
    text-align: left;
    flex: 1.05;
  }

  .laboratory-hero-heading,
  .laboratory-hero-text {
    margin-inline: 0;
  }

  .laboratory-hero-heading {
    max-width: 26ch;
    margin-bottom: 1.75rem;
  }

  .laboratory-hero-actions {
    justify-content: flex-start;
  }

  .laboratory-hero-media {
    flex: 0.95;
    max-width: none;
    align-self: center;
  }
}
/* ===== LABORATORY HERO — EQUAL BUTTON SIZE ===== */

.laboratory-hero-actions {
  display: flex;
  gap: 16px;
  align-items: center;
}

.laboratory-hero-actions .btn {
  width: 292px;
  min-width: 292px;
  height: 68px;
  min-height: 68px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}


.laboratory-hero-actions .btn {
  width: 260px;
  min-width: 260px;
  height: 60px;
  min-height: 60px;
}

@media (max-width: 600px) {
  .laboratory-hero-actions .btn {
    width: 100%;
    max-width: 250px;
    height: 60px;
    min-height: 60px;
  }
}

/* LABORATORY — S2: DIAGNOSTIC SERVICES */
/* Mobile: single column throughout, everything centered (card body
   text stays left-aligned within its own list for readability, same
   established pattern used across the rest of the site). Desktop
   (900px+): a 3-column card grid and a 3-column benefits row, matching
   the breakpoint used site-wide. */
.lab-services {
  position: relative;
  overflow: hidden;
  padding-block: 3.5rem 4rem;
  background: var(--color-white);
}

/* Subtle blue/teal ambient background fade */
.lab-services-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(circle at 92% 6%, rgba(38, 59, 143, 0.05) 0%, transparent 42%),
    radial-gradient(circle at 4% 96%, rgba(91, 199, 176, 0.06) 0%, transparent 42%);
}

.lab-services-inner {
  position: relative;
  z-index: 1;
}

.lab-services-header {
  max-width: 680px;
  margin: 0 auto 2.5rem;
  text-align: center;
}

.lab-services-eyebrow {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-secondary-dark);
  margin: 0 0 0.9rem;
}

.lab-services-heading {
  font-family: var(--font-heading);
  font-size: clamp(1.7rem, 4.6vw, 2.4rem);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 1rem;
}

.lab-services-intro {
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--color-text-muted);
  margin: 0;
}

/* --- Service cards: Blood Tests, Ultrasound, CT Scan -------------------- */
.lab-services-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  max-width: 1180px;
  margin: 0 auto 3.5rem;
}

.lab-service-card {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  text-align: center;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease), box-shadow 0.3s var(--ease), border-color 0.3s var(--ease);
}

.lab-services-grid.is-visible .lab-service-card {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger each card's reveal */
.lab-service-card:nth-child(1) { transition-delay: 0s; }
.lab-service-card:nth-child(2) { transition-delay: 0.1s; }
.lab-service-card:nth-child(3) { transition-delay: 0.2s; }

/* Scoped under .is-visible so this rule's specificity matches (and
   wins over) the reveal rule above — same fix used for .service-card
   in services.css and .blog-card in blogs.css. */
.lab-services-grid.is-visible .lab-service-card:hover,
.lab-services-grid.is-visible .lab-service-card:focus-within {
  transform: translateY(-4px);
  border-color: var(--color-secondary);
  box-shadow: var(--shadow-md);
}

/* Blood Tests — the primary/highlighted service: white background,
   accent border, a top accent bar and a small "Most Popular" badge, so
   it reads as the lead card while staying in the same 3-column grid as
   the two supporting services. */
.lab-service-card--primary {
  background: var(--color-white);
  border-color: var(--color-secondary);
  box-shadow: var(--shadow-md);
}

.lab-service-card--primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
}

.lab-services-grid.is-visible .lab-service-card--primary:hover,
.lab-services-grid.is-visible .lab-service-card--primary:focus-within {
  box-shadow: var(--shadow-lg);
}

.lab-service-card-badge {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  margin: 0;
  font-family: var(--font-heading);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-white);
  background: var(--color-primary);
  padding: 0.3rem 0.7rem;
  border-radius: var(--radius-full);
}

.lab-service-card-media {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.lab-service-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* CT Scan's icon-only media — no verified photo asset exists for this
   service, so a clean medical icon is used instead, in the same
   aspect-ratio footprint as the two photo cards for visual consistency. */
.lab-service-card-media--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(155deg, rgba(38, 59, 143, 0.08) 0%, rgba(91, 199, 176, 0.1) 100%);
}

.lab-service-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--color-white);
  color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.lab-service-card-icon svg {
  width: 34px;
  height: 34px;
}

.lab-service-card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.75rem 1.5rem;
}

.lab-service-card-number {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  color: var(--color-secondary-dark);
  margin: 0 0 0.6rem;
}

.lab-service-card-title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 1.15rem;
  line-height: 1.35;
  color: var(--color-text);
  margin: 0 0 0.65rem;
}

.lab-service-card-desc {
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  margin: 0 0 1.1rem;
}

/* Bullet list stays left-aligned for readability, even though the card
   header above it is centered — same convention used for editorial
   lists throughout the rest of the site. */
.lab-service-card-list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.lab-service-card-list li {
  position: relative;
  padding-left: 1.35rem;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--color-text);
  text-align: left;
}

.lab-service-card-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-secondary);
}

/* --- Special benefits: a smaller, premium feature area tied to the
   Blood Tests service above ----------------------------------------- */
.lab-benefits {
  max-width: 1000px;
  margin: 0 auto 3.5rem;
  padding: 2rem 1.5rem;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  text-align: center;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}

.lab-benefits.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.lab-benefits-heading {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 3.2vw, 1.5rem);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 1.75rem;
}

.lab-benefits-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  margin-bottom: 1.5rem;
}

.lab-benefit-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lab-benefit-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 0.85rem;
  border-radius: 50%;
  background: rgba(38, 59, 143, 0.08);
  color: var(--color-primary);
  transition: background-color 0.25s var(--ease), color 0.25s var(--ease), transform 0.25s var(--ease);
}

.lab-benefit-item:hover .lab-benefit-icon {
  background: var(--color-primary);
  color: var(--color-white);
  transform: translateY(-2px);
}

.lab-benefit-icon svg {
  width: 20px;
  height: 20px;
}

.lab-benefit-title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 1rem;
  color: var(--color-text);
  margin: 0 0 0.4rem;
}

.lab-benefit-desc {
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--color-text-muted);
  max-width: 26ch;
  margin: 0 auto;
}

.lab-benefits-note {
  font-size: 0.85rem;
  font-style: italic;
  color: var(--color-text-muted);
  margin: 0;
}

/* --- Closing CTA / trust strip ------------------------------------------ */
.lab-trust-strip {
  max-width: 720px;
  margin: 0 auto;
  padding: 2.25rem 1.75rem;
  background: linear-gradient(155deg, var(--color-primary) 0%, var(--color-secondary-dark) 100%);
  border-radius: var(--radius-md);
  text-align: center;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}

.lab-trust-strip.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.lab-trust-heading {
  font-family: var(--font-heading);
  font-size: clamp(1.3rem, 3.4vw, 1.6rem);
  font-weight: 700;
  color: var(--color-white);
  margin: 0 0 0.6rem;
}

.lab-trust-services {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 0.5rem;
}

.lab-trust-line {
  font-size: 0.92rem;
  color: rgba(255, 255, 255, 0.75);
  margin: 0 0 1.5rem;
}

.lab-trust-strip .btn-primary {
  background: var(--color-white);
  color: var(--color-primary);
}

.lab-trust-strip .btn-primary:hover,
.lab-trust-strip .btn-primary:focus-visible {
  background: rgba(255, 255, 255, 0.9);
  color: var(--color-primary);
}

.lab-trust-strip .btn span {
  display: inline-block;
  margin-left: 0.4rem;
  transition: transform 0.25s var(--ease);
}

.lab-trust-strip .btn:hover span,
.lab-trust-strip .btn:focus-visible span {
  transform: translateX(4px);
}

/* --------------------------------------------------------------------------
   LABORATORY SECTION 2 — RESPONSIVE
   -------------------------------------------------------------------------- */
@media (min-width: 900px) {
  .lab-services {
    padding-block: 5rem 5.5rem;
  }

  .lab-services-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .lab-benefits-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* Mobile optimization for diagnostic trust CTA */
@media (max-width: 768px) {
  .lab-trust-strip {
    padding: 38px 22px !important;
    margin: 0 12px !important;
    border-radius: 22px !important;
  }

  .lab-trust-heading {
    font-size: 25px !important;
    line-height: 1.35 !important;
    margin-bottom: 16px !important;
  }

  .lab-trust-services {
    font-size: 16px !important;
    line-height: 1.5 !important;
    margin-bottom: 12px !important;
  }

  .lab-trust-line {
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin-bottom: 20px !important;
  }

  .lab-trust-strip .btn-primary {
    width: auto !important;
    max-width: 100% !important;
    min-height: 46px !important;
    padding: 11px 20px !important;
    font-size: 14px !important;
    border-radius: 25px !important;
    white-space: nowrap;
  }
}

/* Small mobile screens */
@media (max-width: 480px) {
  .lab-trust-strip {
    padding: 32px 16px !important;
    margin: 0 10px !important;
  }

  .lab-trust-heading {
    font-size: 23px !important;
  }

  .lab-trust-services {
    font-size: 15px !important;
  }

  .lab-trust-line {
    font-size: 14px !important;
  }

  .lab-trust-strip .btn-primary {
    padding: 10px 18px !important;
    font-size: 13px !important;
    min-height: 44px !important;
  }
}

/* SECTION 3 — DIAGNOSTIC JOURNEY */
/* Premium vertical process timeline — no cards, no images. Mobile and
   desktop share the same single-column, left-aligned structure (a
   numbered marker + connecting line on the left, step content on the
   right); "balanced centered" on desktop is achieved by capping the
   timeline's own max-width and centering that column on the page,
   not by changing the per-step layout. */
.lab-journey {
  position: relative;
  overflow: hidden;
  padding-block: 3.5rem 4rem;
  background: var(--color-bg);
}

/* Subtle teal/blue ambient background fade, same decorative language
   as the rest of this page */
.lab-journey-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(circle at 8% 8%, rgba(38, 59, 143, 0.05) 0%, transparent 42%),
    radial-gradient(circle at 94% 92%, rgba(91, 199, 176, 0.07) 0%, transparent 42%);
}

.lab-journey-inner {
  position: relative;
  z-index: 1;
}

.lab-journey-header {
  max-width: 680px;
  margin: 0 auto 3rem;
  text-align: center;
}

.lab-journey-eyebrow {
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-secondary-dark);
  margin: 0 0 0.9rem;
}

.lab-journey-heading {
  font-family: var(--font-heading);
  font-size: clamp(1.7rem, 4.6vw, 2.4rem);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 1rem;
}

.lab-journey-text {
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--color-text-muted);
  margin: 0;
}

/* --- Timeline -------------------------------------------------------- */
.lab-journey-timeline {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 640px;
}

.lab-journey-step {
  display: flex;
  /* align-items intentionally left at its default (stretch): the
     marker column (number + connecting line) needs to stretch to the
     same height as the step content, so the line's flex:1 below can
     fill exactly the space down to the next step's number, however
     tall this step's own text happens to be. */
  gap: 1.25rem;
  text-align: left;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}

#labJourneyTimeline.is-visible .lab-journey-step {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger each step's reveal */
.lab-journey-step:nth-child(1) { transition-delay: 0s; }
.lab-journey-step:nth-child(2) { transition-delay: 0.12s; }
.lab-journey-step:nth-child(3) { transition-delay: 0.24s; }
.lab-journey-step:nth-child(4) { transition-delay: 0.36s; }

.lab-journey-step-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

.lab-journey-step-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-white);
  border: 2px solid var(--color-secondary);
  color: var(--color-primary);
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 0.95rem;
}

/* Connecting line — stretches to fill the space down to the next
   step's marker; omitted after the last step in the HTML, so the
   timeline doesn't trail off past the final report step. */
.lab-journey-step-line {
  width: 2px;
  flex: 1;
  min-height: 2.5rem;
  margin-block: 0.5rem;
  background: linear-gradient(var(--color-secondary), rgba(91, 199, 176, 0.25));
}

.lab-journey-step-content {
  flex: 1;
  padding-bottom: 2.5rem;
}

.lab-journey-step:last-child .lab-journey-step-content {
  padding-bottom: 0;
}

.lab-journey-step-title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--color-text);
  margin: 0.55rem 0 0.5rem;
}

.lab-journey-step-desc {
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--color-text-muted);
  margin: 0;
}

.lab-journey-trust {
  margin: 3rem 0 0;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-secondary-dark);
  text-align: center;
}

/* --------------------------------------------------------------------------
   SECTION 3 — DIAGNOSTIC JOURNEY — RESPONSIVE (900px+, matching the
   breakpoint used site-wide)
   -------------------------------------------------------------------------- */
@media (min-width: 900px) {
  .lab-journey {
    padding-block: 5rem 5.5rem;
  }

  .lab-journey-step-number {
    width: 56px;
    height: 56px;
    font-size: 1.05rem;
  }

  .lab-journey-step-title {
    font-size: 1.2rem;
  }
}

/* LABORATORY — CLOSING TRUST STRIP WRAPPER */
/* .lab-trust-strip itself (defined earlier, under S2) is completely
   unchanged — this only adds the outer spacing it needs now that it
   sits directly before the footer instead of inside Section 2's own
   padding-block. Without this, the card would sit flush against
   Section 3 above and the footer below with no breathing room. */
.lab-trust-wrap {
  padding-block: 0 3.5rem;
  background: var(--color-bg);
}

@media (min-width: 900px) {
  .lab-trust-wrap {
    padding-block: 0 5rem;
  }
}




/* Laboratory Service Card Image */

.lab-service-card-media--icon {
  overflow: hidden;
  position: relative;
}

.lab-service-card-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
}