
/* Scope styles to this service page only */
.svc-page {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: center;
  align-items: flex-start;
  max-width: 1400px;
  padding-top: 20px;
  padding-bottom: 20px;
  margin: 0 auto;
}

.svc-page section {
  text-align: left;
  width: 45%;
  padding: 5px;
}

/* Image styling only for this page's content images */
.svc-page .svc-image {
  margin-top: 15px;
  filter: drop-shadow(15px 15px 10px #0000004d);
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 85%;
  height: auto;
}

@media (max-width: 980px) {
  .svc-page section {
    width: 100%;
  }
}

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
  .svc-page * { transition: none !important; animation: none !important; }
}

/* ===========================
   SERVICE PAGES – RESPONSIVE
   =========================== */

/* Base layout polish */
.svc-page {
  gap: 1.5rem;                 /* space between sections */
  line-height: 1.55;
}
.svc-page h2 { margin: 0.25rem 0 0.75rem; }
.svc-page ul, .svc-page ol { margin: 0; padding-left: 1.25rem; }
.svc-page .related-services { margin-top: 2rem; border-top: 1px solid #e6e6e6; padding-top: 1.25rem; }

/* CTA spacing (uses your existing button classes) */
.svc-page #cta-title + p { margin-bottom: 0.5rem; }
.svc-page .LinkRequestAppointmentButton,
.svc-page .HeaderPatientPortalButton { display: inline-block; margin: 0.25rem 0.4rem 0 0; }

/* Content image */
.svc-page .svc-image { max-width: 85%; height: auto; }

/* Medium breakpoint: stack sections, widen image */
@media (max-width: 980px) {
  .svc-page { padding: 10px 16px; }
  .svc-page section { width: 100%; }
  .svc-page .svc-image { max-width: 100%; }
}

/* Small breakpoint: tighten spacing, larger list touch targets */
@media (max-width: 640px) {
  .svc-page { gap: 1.25rem; }
  .svc-page h2 { font-size: 1.25rem; }
  .svc-page li { margin-bottom: 0.35rem; }
}

/* Respect reduced-motion (defensive – in case anything slips through) */
@media (prefers-reduced-motion: reduce) {
  .svc-page * { transition: none !important; animation: none !important; }
}

/* ===========================
   SERVICE PAGES – PRINT
   =========================== */
@media print {
  /* Page basics */
  body {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    color: #000;
    background: #fff !important;
    font: 11pt/1.45 system-ui, Segoe UI, Arial, sans-serif;
  }

  /* Hide global chrome (adjust selectors if yours differ) */
  #header,
  .TopMenuOuter,
  .HeaderRequestAppointmentButton,
  .HeaderPatientPortalButton,
  .footer-primary,
  .footer-secondary,
  .TopRequestAppointmentOuter,
  .swiper,
  .swiperTopPadding { display: none !important; }

  /* Focus on article content */
  .svc-page {
    max-width: none;
    padding: 0;
    gap: 0.75rem;
  }
  .svc-page section { width: 100% !important; break-inside: avoid; }

  /* Clean visuals for print */
  .svc-page .svc-image {
    max-width: 100% !important;
    filter: none !important;      /* remove drop shadow */
    box-shadow: none !important;
  }

  /* Headings & spacing */
  .svc-page h1 { font-size: 18pt; margin: 0 0 8pt; }
  .svc-page h2 { font-size: 14pt; margin: 10pt 0 6pt; }
  .svc-page h3 { font-size: 12pt; margin: 8pt 0 4pt; }
  .svc-page p, .svc-page li { font-size: 11pt; }

  /* Links: show URL after text */
  .svc-page a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 9pt;
  }
  /* Internal links: omit url clutter */
  .svc-page a[href^="/"]:after { content: ""; }

  /* Buttons render as plain links */
  .LinkRequestAppointmentButton,
  .HeaderPatientPortalButton {
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    color: #000 !important;
    text-decoration: underline !important;
  }

  /* Page breaks (optional) */
  .svc-page #faq-title { page-break-before: always; }
  .svc-page ol, .svc-page ul { break-inside: avoid; }
}

.breadcrumb-nav {
  font-size: 0.9rem;
  margin: 1rem auto 1.5rem;
  max-width: 1400px;
  padding: 0 1rem;
  color: #444;
}
.breadcrumb-nav ol {
  list-style: none;
  padding: 0; margin: 0;
  display: flex; flex-wrap: wrap;
}
.breadcrumb-nav li + li:before {
  content: "›";
  color: #999;
  margin: 0 0.5em;
}
.breadcrumb-nav a { color: #0066cc; text-decoration: none; }
.breadcrumb-nav a:hover, .breadcrumb-nav a:focus { text-decoration: underline; }
@media (max-width: 640px) {
  .breadcrumb-nav { font-size: 0.85rem; margin: 0.75rem 0 1rem; }
}
