/* Responsive presentation only. Content, labels and destinations are shared.
   Reading sizes transition smoothly from phones through tablets to desktop. */
:root {
  --reading-size: clamp(1rem, calc(1.6364rem - .9091vw), 1.25rem);
  --support-size: clamp(1rem, calc(1.3182rem - .4545vw), 1.125rem);
  --label-size: clamp(.75rem, calc(1.3864rem - .9091vw), 1rem);
}

/* Useful controls are available on every screen size. */
.footer-brand { display:grid; justify-items:start; gap:20px; }
.footer-contact-action { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:48px; max-width:100%; padding:12px 16px; border:1px solid var(--forest); border-radius:8px; color:var(--forest); font-size:1rem; font-weight:700; }
.footer-contact-action span { flex:0 0 auto; }
.referral-jump { margin:0 0 28px; max-width:560px; }
.referral-jump label { display:block; margin-bottom:8px; font-weight:700; }
.referral-jump select { width:100%; min-height:56px; padding:12px; border:1px solid var(--forest); border-radius:8px; background:var(--paper); color:var(--forest); font:inherit; }
.referral-jump nav { display:flex; flex-wrap:wrap; gap:8px 24px; }
.referral-jump nav a { display:inline-flex; align-items:center; min-height:48px; }
.referral-row:focus { outline:2px solid var(--forest); outline-offset:4px; }
.referral-workflow li > span { flex:0 0 2ch; min-width:2ch; white-space:nowrap; overflow-wrap:normal; line-height:1.4; }
.preparation-contact { display:inline-flex; margin:12px 24px 20px; }
:where(body:not(.page-locations)) #main-content .faq-answer-link { display:inline-flex; align-items:center; min-height:48px; margin:8px 24px 12px; font-size:1rem; font-weight:700; text-decoration:underline; text-underline-offset:4px; }
:where(body:not(.page-locations)) #main-content .faq-list details[open] summary b { transform:none; }
:where(body:not(.page-locations)) #main-content .closing-section .eyebrow { color:#e5eee1; }
.clinic-context-copy { display:inline-flex; align-items:center; min-height:48px; padding:8px 16px; border:1px solid var(--forest); border-radius:999px; background:var(--paper); color:var(--forest); font:inherit; font-weight:600; }
.enquiry-embed { min-width:0; }
.patient-form-shell iframe { max-width:100%; min-width:0; }
.page-contact .patient-form-heading div > strong { font-size:1.5rem; line-height:1.25; }
.page-contact .patient-form-heading div > span { color:#e5eee1; }

/* Only the selection buttons receive tab layouts; nested actions keep their own layout. */
.page-services .service-return { display:flex; align-items:center; justify-content:center; width:100%; min-height:56px; margin-top:20px; padding:12px 16px; border:1px solid var(--forest); border-radius:8px; background:transparent; color:var(--forest); font:inherit; font-weight:700; text-align:center; }
.page-services .services:not(.has-service-tabs) .service-tabs-desktop { display:block; }
.page-services .services:not(.has-service-tabs) .service-tabs-mobile,
.page-services .services:not(.has-service-tabs) .service-tab-navigation { display:none; }
.page-services .services:not(.has-service-tabs) .diagnostic-service-tabs { display:block; }
.page-services .services:not(.has-service-tabs) .service-panel-stack { display:grid; gap:24px; }


@media (max-width:1120px) {
  body { font-size:var(--reading-size); }
  :where(body:not(.page-locations)) #main-content :where(p,li,dd,address) { font-size:var(--reading-size); line-height:1.6; }
  :where(body:not(.page-locations)) #main-content :where(small) { font-size:var(--support-size); line-height:1.5; }
  :where(body:not(.page-locations)) #main-content :where(.eyebrow,dt,label,.pathway-label,.checklist-heading,.referral-row-main > p,.breadcrumb) { font-size:var(--label-size); line-height:1.5; }
  :where(body:not(.page-locations)) #main-content :where(button,input,select,textarea,.button,.text-link,.hero-secondary-link,.referral-download,.clinic-referral) { font-size:var(--support-size); line-height:1.5; }
  :where(body:not(.page-locations)) #main-content :where(h1,h2,h3,h4,p,li,dd,address,summary,label) { overflow-wrap:anywhere; }
  :where(body:not(.page-locations)) #main-content .page-hero h1 { font-size:clamp(2.25rem,calc(1.6267rem + 1.4667vw),3.125rem); line-height:1.12; }
  .page-home #main-content h1 { font-size:clamp(2.5rem,calc(.8rem + 4vw),4rem); line-height:1.1; }
  :where(body:not(.page-locations)) #main-content :where(.button,.text-link,.hero-secondary-link,.referral-download,.clinic-referral) { min-height:3.5rem; height:auto; max-width:100%; padding-block:.75rem; white-space:normal; overflow-wrap:anywhere; }
  :where(body:not(.page-locations)) #main-content a[href^="tel:"] { min-width:0; white-space:normal; overflow-wrap:anywhere; }
  :where(body:not(.page-locations)) #main-content :where(.hero-route-note p,.hero-route-note strong,.patient-contact-note,.patient-contact-note span,.security-note,.team-group li span,.healthcare-network-grid strong) { font-size:var(--support-size); line-height:1.6; }
  :where(body:not(.page-locations)) #main-content .team-group li strong { font-size:var(--reading-size); }
  :where(body:not(.page-locations)) #main-content .faq-list summary,
  :where(body:not(.page-locations)) #main-content .referral-checklist strong { font-size:clamp(1.0625rem,calc(1.858rem - 1.1364vw),1.375rem); line-height:1.4; }
  :where(body:not(.page-locations)) #main-content .referral-checklist li p { font-size:var(--reading-size); }
  :where(body:not(.page-locations)) #main-content .referral-checklist li > span { flex-shrink:0; font-size:var(--label-size); }
  :where(body:not(.page-locations)) #main-content :where(.contact-clinic-card dd,.referral-row-contact dd) { font-size:var(--reading-size); white-space:normal; }
  :where(body:not(.page-locations)) #main-content .referral-workflow strong { font-size:1.375rem; line-height:1.4; }
  :where(body:not(.page-locations)) #main-content .referral-number { font-size:var(--label-size); }
  :where(body:not(.page-locations)) #main-content :where(.location-sidebar,.contact-clinic-picker,.contact-clinic-panels,.patient-contact-copy,.patient-form-shell) { min-width:0; }

  /* Match imported page scopes so the shared reading scale wins consistently. */
  .page-services #main-content > .page-hero ~ * { --text-body:var(--reading-size); --text-small:var(--support-size); --text-micro:var(--label-size); }
  .page-services #main-content > .page-hero ~ * :where(p,li,dd,address) { font-size:var(--reading-size); line-height:1.6; }
  .page-services #main-content > .page-hero ~ * :where(small) { font-size:var(--support-size); line-height:1.5; }
  .page-services #main-content > .page-hero ~ * :where(.eyebrow,dt,label,.service-tab-label,.clinic-popup-region) { font-size:var(--label-size); line-height:1.5; }
  .page-services #main-content > .page-hero ~ * :where(button,input,select,textarea,.button,.text-link) { font-size:var(--support-size); line-height:1.5; }
  .page-services #main-content .service-tab-copy strong { font-size:var(--reading-size); line-height:1.4; }
  .page-services #main-content .service-tab-copy small { font-size:var(--support-size); line-height:1.5; }
  .page-services #main-content .service-actions .button { min-height:3.5rem; height:auto; padding:.75rem 1rem; }
  body .mobile-menu > summary,
  body .mobile-menu nav a,
  body .mobile-menu .mobile-nav-group > summary { font-size:1.125rem; line-height:1.5; min-height:3.5rem; white-space:normal; }
  .mobile-menu nav { top:calc(100% + 8px); max-height:calc(100dvh - 96px); }
  .mobile-menu nav a.menu-referral-cta { display:flex; justify-content:space-between; gap:12px; padding:12px; margin-top:8px; border-radius:8px; background:var(--accent); color:var(--forest); }
  .site-footer .footer-nav a { min-height:48px; font-size:var(--support-size); line-height:1.5; overflow-wrap:anywhere; }
  .site-footer .footer-heading,
  .site-footer .footer-bottom { font-size:var(--label-size); line-height:1.5; }
}


/* Stack before the preparation columns' original minimum widths exceed the page. */
@media (max-width:1020px) {
  .page-patient-preparation .faq-shell,
  .page-patient-preparation .care-shell { grid-template-columns:minmax(0,1fr); gap:36px; }
  .page-patient-preparation .faq-intro { position:static; }
}

@media (max-width:680px) {
  :where(body:not(.page-locations)) #main-content h2 { font-size:2rem; line-height:1.18; }
  :where(body:not(.page-locations)) #main-content h3 { font-size:1.625rem; line-height:1.2; }
  :where(body:not(.page-locations)) #main-content h4 { font-size:1.5rem; line-height:1.25; }
  :where(body:not(.page-locations)) #main-content .section-shell { width:calc(100% - 40px); }
  :where(body:not(.page-locations)) #main-content :where(.pathway-grid,.quick-grid,.care-shell,.resources-grid,.visit-stages,.clinic-contact-layout) { grid-template-columns:minmax(0,1fr); }
  :where(body:not(.page-locations)) #main-content :where(.pathway-card,.resource-card,.info-panel,.contact-clinic-card,.referral-checklist) { padding:24px 20px; }
  :where(body:not(.page-locations)) #main-content :where(.page-actions,.pathway-actions,.closing-actions) { gap:.75rem; min-width:0; }
  /* Keep original.css's full-hero background image, crop and pale text overlay. */
  .page-home .hero-route-note { grid-template-columns:minmax(0,1fr); gap:.5rem; margin-top:20px; padding:20px; background:var(--paper); }
  .page-home .hero-route-note .route-note-mark { display:none; }
  .page-home .hero-route-note > a { grid-column:1; min-height:56px; white-space:normal; }
  .page-home .hero-route-note p { margin:0; }
  .page-home .hero-actions { display:flex; flex-direction:column; align-items:stretch; gap:.75rem; width:100%; }
  .page-home #main-content .hero-actions > a { width:100%; min-height:3.5rem; justify-content:center; padding:.75rem 1.25rem; font-size:var(--support-size); font-weight:700; }
  .page-home .home-pathway { min-height:0; }
  .page-home .quick-section { padding-block:0 48px; }
  .page-home .quick-grid { gap:32px; }
  .page-home .quick-link { padding:0; }
  :where(body:not(.page-locations)) #main-content .referral-checklist li { grid-template-columns:2.25rem minmax(0,1fr); gap:12px; min-height:0; }
  :where(body:not(.page-locations)) #main-content .referral-checklist li > span { width:2.25rem; height:2.25rem; }
  :where(body:not(.page-locations)) #main-content .checklist-heading { align-items:flex-start; gap:12px; flex-wrap:wrap; }
  :where(body:not(.page-locations)) #main-content .faq-list summary { grid-template-columns:minmax(0,1fr) 30px; }
  :where(body:not(.page-locations)) #main-content .referral-row { grid-template-columns:minmax(0,1fr); padding:24px 20px; gap:16px; }
  :where(body:not(.page-locations)) #main-content .referral-row :is(.referral-row-contact,.referral-row-actions) { grid-area:auto; }
  :where(body:not(.page-locations)) #main-content .referral-row-main h3,
  :where(body:not(.page-locations)) #main-content .contact-clinic-card h2 { font-size:1.5rem; line-height:1.25; }
  :where(body:not(.page-locations)) #main-content .referral-row-contact { grid-template-columns:minmax(0,1fr); }
  :where(body:not(.page-locations)) #main-content .referral-row-contact a[href^="tel:"] { display:inline-flex; align-items:center; min-height:48px; padding-block:8px; }
  .page-services #main-content .service-mobile-trigger { grid-template-columns:28px minmax(0,1fr) 18px; }
  .page-services #main-content .service-mobile-trigger .service-tab-index { display:block; }
  .page-services #main-content .service-detail-panel-mobile { margin-top:0; padding:24px 16px; }
  .page-services #main-content .service-detail-heading h2 { font-size:2rem; line-height:1.18; }
  .page-services #main-content :is(.service-quick-facts,.service-detail-grid) { grid-template-columns:minmax(0,1fr); gap:16px; }
  .page-services #main-content .service-quick-facts > div { grid-column:auto; padding:8px 0; }
  .page-services #main-content .service-detail-grid > div { padding:8px 0; }
  .page-services #main-content .service-mobile-trigger .service-tab-arrow { transform:none; }
  .page-contact .clinic-contact-layout { gap:24px; }
  .page-contact .clinic-contact-section,
  .page-contact .patient-contact-section { padding-block:32px; }
  .page-contact .patient-form-heading { padding:16px; }
  /* Microsoft Forms needs at least 320px; use the phone width instead of the inset text column. */
  .page-contact .patient-form-shell { width:calc(100% + 40px); margin-inline:-20px; border-radius:0; }
  .page-contact .form-recovery { padding:12px 16px; gap:12px; }
  .page-contact .form-recovery > a { width:100%; font-size:1rem; }
  .page-contact .form-recovery > button { font-size:1rem; }
  :is(.page-about,.page-services) .healthcare-network { padding-block:48px; }
  :is(.page-about,.page-services) .healthcare-network-intro h2 { font-size:2rem; }
  :is(.page-about,.page-services) .healthcare-network-intro > div:last-child p,
  :is(.page-about,.page-services) .healthcare-network-grid p { font-size:var(--reading-size); line-height:1.6; }
  :is(.page-about,.page-services) .healthcare-network-grid { gap:16px; margin-top:28px; }
  :is(.page-about,.page-services) .healthcare-network-grid > a { padding:24px 20px; min-height:0; }
  :is(.page-about,.page-services) .healthcare-network-grid h3 { margin:20px 0 14px; }
  .site-footer .footer-nav { grid-template-columns:minmax(0,1fr); gap:24px; }
  .site-footer .footer-nav > div:last-child { grid-column:auto; }
  .site-footer .footer-nav a { min-height:56px; }
}

