/* =========================================================
   Gujarat Hospital — Homepage
   Rebuilt from doctor-approved static prototype.
   Brand mapping: prototype "navy" -> --gh-primary-dark (maroon),
   prototype "orange" -> --gh-gold (accent). Layout, spacing and
   component structure follow the approved design 1:1.
   ========================================================= */

:root {
  --gh-primary: #892728;        /* brand maroon */
  --gh-primary-dark: #892728;
  --gh-deep: #5E1719;           /* deep burgundy for gradients and dark bands */
  --gh-orange: #EE7D05;         /* primary action only (pass 60 palette) */
  --gh-orange-hover: #BE6404;
  --gh-gold: #C98A2E;           /* warm gold: labels, numbers, dividers */
  --gh-gold-hover: #A8711F;
  --gh-gold-light: #E9C27A;
  --gh-gold-soft: #FBF1E6;      /* soft gold tint */
  --gh-red: #B3261E;
  --gh-ivory: #FAF6F0;
  --gh-text: #2a2422;
  --gh-muted: #6B5F5A;
  --gh-light: #FAF6F0;
  --gh-border: #E6DACB;
  --gh-white: #ffffff;
  --gh-radius: 12px;
  --gh-shadow: 0 4px 20px rgba(74,21,23,0.07);
  --gh-shadow-lg: 0 12px 40px rgba(74,21,23,0.12);
  --gh-container: 1200px;
}

.gh-home * , .gh-home *::before, .gh-home *::after { box-sizing: border-box; }
.gh-home { color: var(--gh-text); background: var(--gh-white); line-height: 1.6; font-family: 'Montserrat', sans-serif; }
.gh-home a { text-decoration: none; color: inherit; }
.gh-home img { max-width: 100%; display: block; }
.gh-home ul { list-style: none; margin: 0; padding: 0; }
.gh-home button, .gh-home input, .gh-home select, .gh-home textarea { font-family: inherit; }
.gh-container { width: 100%; max-width: var(--gh-container); margin: 0 auto; padding: 0 20px; }

/* ---------- HERO ---------- */
.gh-hero {
  position: relative;
  background: linear-gradient(120deg, #f6efe6 0%, #faf6f0 50%, #f6efe6 100%);
  min-height: 460px;
  display: flex; align-items: center;
  overflow: hidden;
}
.gh-hero-content {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 40px; align-items: center;
  padding: 50px 0 100px;
  position: relative; z-index: 2;
}
.gh-hero-quote {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(18px, 2.2vw, 22px);
  font-weight: 500; color: var(--gh-primary-dark);
  line-height: 1.55; margin-bottom: 24px; max-width: 540px;
}
.gh-hero-quote strong { color: var(--gh-gold-light); font-weight: 700; }
.gh-hero-name { font-size: 17px; font-weight: 700; color: var(--gh-primary-dark); }
.gh-hero-role { font-size: 14px; color: var(--gh-muted); }
.gh-hero-visual { position: relative; display: flex; justify-content: flex-end; }
.gh-hero-photo {
  width: 100%; max-width: 320px; aspect-ratio: 3/3.6;
  background: linear-gradient(165deg, #d8c9bd, #c2ab9a);
  border-radius: 16px 16px 0 0;
  display: grid; place-items: center;
  font-size: 90px; color: rgba(255,255,255,0.5);
  box-shadow: var(--gh-shadow-lg);
  overflow: hidden;
}
.gh-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.gh-hero-badge {
  position: absolute; top: 12px; right: -8px;
  background: white; border-radius: 10px;
  padding: 12px 14px; box-shadow: var(--gh-shadow-lg);
  text-align: center; width: 135px; z-index: 5;
}
.gh-hero-badge .stars { color: var(--gh-gold); font-size: 11px; letter-spacing: 1.5px; margin-bottom: 3px; }
.gh-hero-badge strong { display: block; font-size: 11.5px; font-weight: 800; color: var(--gh-primary-dark); line-height: 1.25; }
.gh-hero-badge span { font-size: 10.5px; color: var(--gh-muted); }

/* ---------- SEARCH BAR ---------- */
.gh-search-section { position: relative; z-index: 50; margin-top: -48px; padding: 0 20px; }
.gh-search-bar {
  max-width: var(--gh-container); margin: 0 auto;
  background: white; border-radius: 14px;
  box-shadow: 0 10px 40px rgba(74,21,23,0.14);
  display: flex; align-items: stretch; overflow: hidden;
  border: 1px solid rgba(74,21,23,0.06);
}
.gh-search-input { flex: 1; display: flex; align-items: center; padding: 0 18px; gap: 10px; }
.gh-search-input svg { width: 18px; height: 18px; color: #a89a8f; flex-shrink: 0; }
.gh-search-input input {
  border: none; outline: none; font-size: 14.5px;
  width: 100%; height: 56px; background: transparent; color: var(--gh-text);
}
.gh-search-input input::placeholder { color: #a89a8f; }
.gh-search-actions { display: flex; }
.gh-search-btn {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  padding: 0 24px; font-size: 13.5px; font-weight: 600;
  border: none; cursor: pointer; white-space: nowrap; transition: background 0.2s;
}
.gh-search-btn.find { background: var(--gh-orange); color: white; }
.gh-search-btn.find:hover { background: var(--gh-gold-hover); }
.gh-search-btn.book { background: white; color: var(--gh-primary-dark); border-left: 1px solid var(--gh-border); }
.gh-search-btn.book:hover { background: var(--gh-light); }

/* ---------- QUICK SERVICES ---------- */
.gh-quick-services { padding: 32px 0 12px; background: white; }
.gh-services-row { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
@media (min-width: 1024px) {
    .gh-services-row { justify-content: space-between; overflow-x: visible; }
}
.gh-services-row::-webkit-scrollbar { display: none; }
.gh-service-item {
  flex: 0 0 auto; width: 138px;
  background: var(--gh-ivory); border-radius: 14px;
  padding: 16px 12px 14px;
  display: flex; flex-direction: column; gap: 10px;
  transition: all 0.22s; border: 1px solid transparent; position: relative;
}
.gh-service-item:hover { background: white; border-color: var(--gh-border); box-shadow: var(--gh-shadow); transform: translateY(-2px); }
.gh-service-icon {
  width: 38px; height: 38px; background: white; border-radius: 10px;
  display: grid; place-items: center; font-size: 17px;
  box-shadow: 0 2px 6px rgba(74,21,23,0.06);
}
.gh-service-item span { font-size: 12.5px; font-weight: 600; color: var(--gh-text); line-height: 1.3; }
.gh-service-item .arrow { position: absolute; top: 14px; right: 10px; color: var(--gh-gold); font-size: 12px; opacity: 0; transition: opacity 0.2s; }
.gh-service-item:hover .arrow { opacity: 1; }

/* ---------- SHARED SECTION STYLES ---------- */
.gh-section { padding: 64px 0; }
.gh-section-label { font-size: 12.5px; font-weight: 600; color: var(--gh-gold); margin-bottom: 6px; letter-spacing: 0.3px; }
.gh-section-title { font-family: 'Montserrat', sans-serif; font-size: clamp(22px, 2.8vw, 30px); font-weight: 700; color: var(--gh-primary-dark); line-height: 1.25; margin-bottom: 10px; }
.gh-section-desc { font-size: 14.5px; color: var(--gh-muted); max-width: 520px; margin-bottom: 32px; }
.gh-text-center { text-align: center; }
.gh-text-center .gh-section-desc { margin-left: auto; margin-right: auto; }
.gh-bg-soft { background: var(--gh-ivory); }

/* ---------- DEPARTMENTS ---------- */
.gh-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.gh-dept-card { background: white; border-radius: 14px; padding: 24px 20px; border: 1px solid var(--gh-border); transition: all 0.25s; display: flex; flex-direction: column; align-items: center; text-align: center; }
.gh-dept-card:hover { box-shadow: var(--gh-shadow-lg); border-color: transparent; transform: translateY(-4px); }
.gh-dept-icon { width: 46px; height: 46px; background: var(--gh-gold-soft); border-radius: 12px; display: grid; place-items: center; margin-bottom: 14px; }
.gh-dept-icon svg { width: 24px; height: 24px; color: var(--gh-primary-dark); }
.gh-dept-card h3 { font-size: 16px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 8px; }
.gh-dept-card p { font-size: 13px; color: var(--gh-muted); flex: 1; margin-bottom: 14px; line-height: 1.55; }
.gh-dept-meta { font-size: 11.5px; font-weight: 600; color: var(--gh-gold); margin-bottom: 10px; }
.gh-dept-link { font-size: 13px; font-weight: 600; color: var(--gh-primary-dark); }
.gh-dept-link:hover { color: var(--gh-deep); }

/* ---------- TABS / CONDITIONS-PROCEDURES-TECH ---------- */
.gh-tabs { display: flex; gap: 8px; margin-bottom: 22px; flex-wrap: wrap; }
.gh-tab-btn {
  padding: 8px 16px; border-radius: 100px; border: 1.5px solid var(--gh-border);
  background: white; font-size: 12.5px; font-weight: 600; color: var(--gh-muted);
  cursor: pointer; transition: all 0.2s;
}
.gh-tab-btn.active, .gh-tab-btn:hover { background: var(--gh-orange); color: white; border-color: var(--gh-orange); }
.gh-cond-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.gh-cond-card {
  background: white; border: 1px solid var(--gh-border); border-radius: 14px;
  padding: 22px 18px 18px; transition: all 0.25s; text-align: center;
  display: flex; flex-direction: column; align-items: center;
}
.gh-cond-card:hover { border-color: transparent; box-shadow: var(--gh-shadow-lg); transform: translateY(-3px); }
.gh-cond-icon { width: 56px; height: 56px; margin-bottom: 14px; display: flex; align-items: center; justify-content: center; }
.gh-cond-icon svg { width: 48px; height: 48px; }
.gh-cond-card h4 { font-size: 13.5px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 6px; line-height: 1.3; }
.gh-cond-card p { font-size: 12px; color: var(--gh-muted); line-height: 1.45; }

/* ---------- WHY / MODEL-OF-CARE GRIDS ---------- */
.gh-why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.gh-why-card { background: white; border-radius: 12px; padding: 20px 14px; text-align: center; border: 1px solid var(--gh-border); transition: all 0.2s; }
.gh-why-card:hover { border-color: var(--gh-gold); box-shadow: var(--gh-shadow); }
.gh-why-num { width: 32px; height: 32px; background: var(--gh-gold-soft); color: var(--gh-gold); border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 12px; margin: 0 auto 10px; }
.gh-why-card h4 { font-size: 13px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 4px; }
.gh-why-card p { font-size: 12px; color: var(--gh-muted); line-height: 1.4; }

/* ---------- DOCTOR SEARCH ---------- */
.gh-doc-search {
  max-width: 480px; margin: 0 auto 32px;
  background: white; border: 1.5px solid var(--gh-border); border-radius: 10px;
  display: flex; align-items: center; gap: 10px; padding: 0 16px;
}
.gh-doc-search svg { width: 18px; height: 18px; color: #a89a8f; flex-shrink: 0; }
.gh-doc-search input {
  border: none; outline: none; font-size: 14px;
  width: 100%; height: 46px; background: transparent; color: var(--gh-text);
}
.gh-doc-noresults { text-align: center; color: var(--gh-muted); font-size: 14px; padding: 24px 0 0; }
.gh-doc-noresults button {
  background: none; border: none; color: var(--gh-primary-dark); font-weight: 600;
  cursor: pointer; text-decoration: underline; font-size: 14px; padding: 0; margin-left: 4px;
}

/* ---------- DOCTORS ---------- */
.gh-doc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gh-doc-card { background: white; border-radius: 14px; overflow: hidden; border: 1px solid var(--gh-border); transition: all 0.25s; }
.gh-doc-card:hover { box-shadow: var(--gh-shadow-lg); transform: translateY(-4px); }
.gh-doc-photo { height: 200px; background: linear-gradient(160deg, #ece3d9, #d8c9bd); display: grid; place-items: center; font-size: 60px; color: #a89a8f; overflow: hidden; }
.gh-doc-photo img { width: 100%; height: 100%; object-fit: cover; }
.gh-doc-info { padding: 18px; }
.gh-doc-info h3 { font-size: 15.5px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 2px; }
.gh-doc-spec { font-size: 12px; font-weight: 600; color: var(--gh-gold); margin-bottom: 8px; }
.gh-doc-info p { font-size: 12.5px; color: var(--gh-muted); margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gh-doc-link { font-size: 12.5px; font-weight: 600; color: var(--gh-primary-dark); }
.gh-doc-link:hover { color: var(--gh-deep); }

/* ---------- INFRASTRUCTURE ---------- */
.gh-infra-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gh-infra-card { background: white; border: 1px solid var(--gh-border); border-radius: 14px; padding: 22px; display: flex; gap: 16px; transition: all 0.2s; }
.gh-infra-card:hover { box-shadow: var(--gh-shadow); }
.gh-infra-num { font-size: 30px; font-weight: 800; color: var(--gh-gold); opacity: 0.25; line-height: 1; }
.gh-infra-card h3 { font-size: 15.5px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 6px; }
.gh-infra-card p { font-size: 13px; color: var(--gh-muted); margin-bottom: 10px; }
.gh-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.gh-tags span { font-size: 10.5px; background: var(--gh-gold-soft); color: var(--gh-gold); padding: 3px 8px; border-radius: 100px; font-weight: 600; }

/* ---------- PATIENT JOURNEY (dark band) ---------- */
.gh-process { background: var(--gh-primary-dark); color: white; max-width: none; margin: 0; }
.gh-process .gh-section-label { color: #e7c98f; }
.gh-process .gh-section-title { color: white; }
.gh-process .gh-heading-black { color: #ffffff; }
.gh-process .gh-section-desc { color: rgba(255,255,255,0.68); }
.gh-process-steps { display: flex; justify-content: space-between; gap: 8px; margin-top: 36px; position: relative; }
.gh-process-steps::before { content: ''; position: absolute; top: 20px; left: 6%; right: 6%; height: 2px; background: rgba(255,255,255,0.14); }
.gh-process-step { text-align: center; position: relative; z-index: 1; flex: 1; }
.gh-step-circle { width: 42px; height: 42px; background: var(--gh-gold); border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 13px; margin: 0 auto 10px; border: 3px solid var(--gh-primary-dark); }
.gh-process-step h4 { font-size: 13px; font-weight: 700; margin-bottom: 3px; }
.gh-process-step p { font-size: 11.5px; opacity: 0.68; }

/* ---------- REVIEWS ---------- */
.gh-rating-row { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }
.gh-rating-score { font-size: 40px; font-weight: 800; color: var(--gh-primary-dark); }
.gh-rating-stars { color: var(--gh-gold); font-size: 15px; letter-spacing: 1.5px; }
.gh-rating-text { font-size: 13px; color: var(--gh-muted); }
.gh-rating-text a { color: var(--gh-primary-dark); font-weight: 600; }
.gh-reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gh-reviews-track-wrap { overflow: hidden; width: 100%; cursor: grab; user-select: none; }
.gh-reviews-track-wrap.gh-dragging { cursor: grabbing; }
.gh-reviews-track { display: flex; gap: 16px; width: max-content; padding: 4px 0 12px; will-change: transform; }
.gh-review-card { background: white; border-radius: 12px; padding: 18px; border: 1px solid var(--gh-border); flex: 0 0 auto; width: 320px; transition: box-shadow 0.3s ease; }
.gh-review-card:hover { box-shadow: 0 12px 30px rgba(74,21,23,0.12); }
.gh-review-header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.gh-review-avatar { width: 34px; height: 34px; background: var(--gh-gold-soft); color: var(--gh-gold); border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 12px; }
.gh-review-name { font-weight: 700; font-size: 13px; color: var(--gh-primary-dark); }
.gh-review-verified { font-size: 10.5px; color: #2e7d3f; font-weight: 600; }
.gh-review-card p { font-size: 12.5px; color: var(--gh-muted); line-height: 1.5; }

/* ---------- FAQ ---------- */
.gh-faq-list { max-width: 660px; margin: 0 auto; }
.gh-faq-item { border-bottom: 1px solid var(--gh-border); }
.gh-faq-question {
  width: 100%; background: none; border: none; padding: 15px 0;
  font-size: 14.5px; font-weight: 600; color: var(--gh-primary-dark);
  text-align: left; cursor: pointer;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.gh-faq-question::after { content: '+'; font-size: 18px; color: var(--gh-gold); font-weight: 400; }
.gh-faq-item.open .gh-faq-question::after { content: '\2212'; }
.gh-faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.gh-faq-item.open .gh-faq-answer { max-height: 220px; }
.gh-faq-answer p { padding-bottom: 14px; font-size: 13.5px; color: var(--gh-muted); }

/* ---------- APPOINTMENT ---------- */
.gh-appt-section { background: linear-gradient(135deg, #C98A2E, #892728); color: white; padding: 56px 0; }
.gh-appt-grid { display: grid; grid-template-columns: 1fr; gap: 28px; }
.gh-appt-cta-row { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.gh-appt-cta-row > div:first-child { min-width: 0; flex: 1 1 280px; }
.gh-appt-cta-row h2 { margin-bottom: 4px; }
.gh-appt-cta-row p { margin-bottom: 0; max-width: 480px; }
.gh-appt-section h2 { font-family: 'Montserrat', sans-serif; font-size: clamp(20px, 2.6vw, 26px); font-weight: 700; margin-bottom: 8px; }
.gh-appt-section p { opacity: 0.92; margin-bottom: 18px; font-size: 14.5px; }
.gh-appt-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.gh-btn-white { display: inline-flex; align-items: center; height: 42px; padding: 0 20px; background: white; color: var(--gh-primary-dark); border-radius: 10px; font-size: 13.5px; font-weight: 600; transition: background 0.2s; }
.gh-btn-white:hover { background: #f4ede4; }
.gh-btn-ghost { display: inline-flex; align-items: center; height: 42px; padding: 0 20px; background: transparent; color: white; border: 1.5px solid rgba(255,255,255,0.55); border-radius: 10px; font-size: 13.5px; font-weight: 600; transition: all 0.2s; }
.gh-btn-ghost:hover { background: rgba(255,255,255,0.12); border-color: white; }
.gh-appt-form { background: white; border-radius: 14px; padding: 32px; color: var(--gh-text); }
.gh-appt-form label { display: block; font-size: 12.5px; font-weight: 600; margin-bottom: 5px; color: var(--gh-primary-dark); }
.gh-appt-form input, .gh-appt-form select, .gh-appt-form textarea {
  width: 100%; height: 42px; border: 1.5px solid var(--gh-border); border-radius: 8px;
  padding: 0 12px; font-size: 13.5px; margin-bottom: 12px; outline: none; transition: border-color 0.2s;
}
.gh-appt-form textarea { height: auto; padding: 10px 12px; resize: vertical; }
.gh-appt-form input:focus, .gh-appt-form select:focus, .gh-appt-form textarea:focus { border-color: var(--gh-gold); }
.gh-btn-submit { width: 100%; height: 46px; background: var(--gh-primary-dark); color: white; border: none; border-radius: 10px; font-size: 14.5px; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.gh-btn-submit:hover { background: var(--gh-primary); }

/* ---------- LOCATION ---------- */
.gh-loc-card { display: grid; grid-template-columns: 1fr 1.2fr; gap: 0; background: white; border-radius: 14px; overflow: hidden; border: 1px solid var(--gh-border); box-shadow: var(--gh-shadow); }
.gh-loc-img { min-height: 260px; background-size: cover; background-position: center; }
.gh-loc-body { padding: 24px; }
.gh-loc-body h3 { font-size: 17px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 14px; }
.gh-loc-row { display: flex; gap: 8px; margin-bottom: 10px; font-size: 13.5px; color: var(--gh-muted); align-items: flex-start; }
.gh-loc-row svg { flex-shrink: 0; margin-top: 2px; color: var(--gh-gold); }
.gh-loc-body .gh-btn-dir { display: inline-flex; margin-top: 10px; height: 40px; padding: 0 18px; background: var(--gh-primary-dark); color: white; border-radius: 8px; font-size: 13px; font-weight: 600; align-items: center; }
.gh-loc-body .gh-btn-dir:hover { background: var(--gh-gold-hover); }
.gh-loc-map { margin-top: 16px; border-radius: 10px; overflow: hidden; border: 1px solid var(--gh-border); }
.gh-loc-map iframe { width: 100%; height: 220px; border: 0; display: block; }

/* ---------- MOBILE NAV (added — approved prototype's toggle had no handler) ---------- */
.gh-mobile-toggle { display: none; background: none; border: none; font-size: 22px; cursor: pointer; color: var(--gh-primary-dark); }
.gh-mobile-nav-list { display: none; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
  .gh-grid-3, .gh-doc-grid, .gh-why-grid, .gh-reviews-grid { grid-template-columns: repeat(2, 1fr); }
  .gh-infra-grid, .gh-appt-grid, .gh-loc-card { grid-template-columns: 1fr; }
  .gh-hero-content { grid-template-columns: 1fr; }
  .gh-hero-visual { justify-content: center; }
  .gh-hero-photo { max-width: 240px; }
  .gh-process-steps::before { display: none; }
  .gh-process-steps { flex-wrap: wrap; gap: 18px; }
  .gh-process .gh-section-title { font-size: 19px; line-height: 1.45; }
}
@media (max-width: 768px) {
  .gh-main-nav-desktop { display: none; }
  .gh-mobile-toggle { display: block; }
  .gh-mobile-nav-list.open { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--gh-border); }
  .gh-mobile-nav-list.open a { display: block; padding: 12px 0; border-bottom: 1px solid var(--gh-border); font-size: 14px; font-weight: 500; }
  .gh-grid-3, .gh-doc-grid, .gh-why-grid, .gh-reviews-grid { grid-template-columns: 1fr; }
  .gh-search-bar { flex-direction: column; }
  .gh-search-actions { flex-direction: column; }
  .gh-search-btn { height: 46px; }
  .gh-search-btn.book { border-left: none; border-top: 1px solid var(--gh-border); }
  .gh-section { padding: 48px 0; }
  .gh-hero-content { padding: 36px 0 80px; }
}

/* Force-fix: Call button text was rendering invisible (white-on-white) in
   the appointment section. This wins over anything else via !important. */
.gh-appt-section a.gh-btn-white {
    color: #4A1517 !important;
}

body.home .gh-footer { margin-top: 0; }

/* ---------- SUPPORT SPECIALISTS ---------- */
.gh-support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gh-support-card { background: white; border-radius: 14px; padding: 22px; border: 1px solid var(--gh-border); text-align: center; transition: all 0.25s; }
.gh-support-card:hover { box-shadow: var(--gh-shadow); transform: translateY(-3px); }
.gh-support-icon { font-size: 40px; margin-bottom: 10px; }
.gh-support-card h4 { font-size: 15px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 2px; }
.gh-support-qual { font-size: 11px; color: var(--gh-muted); margin-bottom: 4px; }
.gh-support-dept { font-size: 12px; font-weight: 600; color: var(--gh-gold); margin-bottom: 8px; }
.gh-support-card p { font-size: 12.5px; color: var(--gh-muted); line-height: 1.5; margin: 0; }
@media (max-width: 1024px) {
  .gh-support-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .gh-support-grid { grid-template-columns: 1fr; }
}

/* ---------- FACILITIES SHOWCASE (auto-scrolling carousel) ---------- */
.gh-facilities-showcase { padding-bottom: 20px; overflow: hidden; }
.gh-facilities-track-wrap {
    overflow: hidden;
    width: 100%;
    cursor: grab;
    user-select: none;
}
.gh-facilities-track-wrap.gh-dragging { cursor: grabbing; }
.gh-facilities-track {
    display: flex;
    gap: 20px;
    width: max-content;
    padding: 4px 0 20px;
    will-change: transform;
}
.gh-facility-card {
    flex: 0 0 auto;
    width: 280px;
    background: white;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--gh-border);
    box-shadow: var(--gh-shadow);
    transition: box-shadow 0.3s ease;
}
.gh-facility-card:hover {
    box-shadow: 0 16px 36px rgba(74,21,23,0.15);
}
.gh-facility-card-media {
    height: 160px;
    background-size: cover;
    background-position: center;
    background-color: var(--gh-bg-sand);
}
.gh-facility-card-icon {
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    background: var(--gh-bg-sand);
}
.gh-facility-card-body { padding: 18px; }
.gh-facility-card-body h4 { font-size: 15.5px; font-weight: 700; color: var(--gh-primary-dark); margin-bottom: 2px; }
.gh-facility-card-sub { font-size: 11.5px; font-weight: 600; color: var(--gh-gold); margin-bottom: 8px; }
.gh-facility-card-body p { font-size: 12.5px; color: var(--gh-muted); line-height: 1.5; margin: 0; }

@media (max-width: 768px) {
    .gh-facility-card { width: 240px; }
}

/* Subtle branches-link note beneath Main Branch address */
.gh-loc-branches-note {
    font-size: 12.5px;
    color: var(--gh-muted);
    margin: 6px 0 14px;
}
.gh-loc-branches-note a {
    color: var(--gh-primary-dark);
    font-weight: 600;
    text-decoration: none;
}
.gh-loc-branches-note a:hover {
    text-decoration: underline;
}

/* ---------- VISIT US: satellite OPD cards on the homepage (Phase 2) ----------
   Card styles themselves (.gh-branch-*) live in style.css and are shared with
   the Branches page. Only homepage-specific spacing and conflict fixes here. */
.gh-visit-satellites { margin-top: 44px; }
.gh-visit-satellites .gh-branch-section-title { text-align: center; margin: 0 0 16px; }
.gh-visit-satellites .gh-branch-note { margin-top: 0; margin-bottom: 24px; }
.gh-visit-satellites .gh-branch-grid,
.gh-visit-satellites .gh-branch-card { min-width: 0; }
.gh-visit-satellites .gh-branch-address { overflow-wrap: anywhere; }
/* homepage.css loads after style.css, so its 220px .gh-loc-map iframe rule would
   otherwise beat the 150px small-map rule on the satellite cards */
.gh-loc-map.gh-loc-map-sm { margin-top: 4px; margin-bottom: 12px; }
.gh-loc-map.gh-loc-map-sm iframe { height: 150px; }
/* no fade-in on the homepage, so the Branches-page stagger delay must not slow the hover */
.gh-visit-satellites .gh-branch-grid .gh-branch-card:nth-child(n) { transition-delay: 0s; }

/* ---------- HERO v5 (pass 62, 62b, 62c, 62d, 62e, 62f, 62g, 63, 64) - markup + slide data: inc/gh-hero-slides.php ----------
   Premium full-bleed hero: the photo spans the whole slide, the text sits on a deep-maroon fade on the left, one orange button,
   one outline button, at most one small label on the picture. The team slide is a row of portraits. A quiet proof line sits under it.
   Phones/tablets: picture on top (full width), text below on maroon. Desktop (900px+): one full-height slide. */
.gh-hc { position: relative; isolation: isolate; background: linear-gradient(135deg, var(--gh-deep) 0%, var(--gh-primary-dark) 100%); color: #fff; overflow: hidden; }
.gh-hc-stage { position: relative; z-index: 1; display: grid; }
.gh-hc-slide { grid-area: 1 / 1; min-width: 0; position: relative; display: flex; flex-direction: column; background: none !important; opacity: 0; visibility: hidden; transition: opacity 0.8s ease, visibility 0s linear 0.8s; }
.gh-hc-slide.is-active { opacity: 1; visibility: visible; z-index: 1; transition: opacity 0.8s ease; }
.gh-hc-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(135deg, #4A1012 0%, #6F1F21 100%); }
.gh-hc-img, .gh-hc-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; border: 0; }
.gh-hc-fit-contain .gh-hc-img, .gh-hc-fit-contain .gh-hc-video { object-fit: contain; }
.gh-hc-type-image .gh-hc-media::after, .gh-hc-type-video .gh-hc-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(60,10,12,0) 55%, rgba(60,10,12,0.75) 100%); }
/* team slide background (pass 64): deep maroon on the left to a lighter maroon on the right, a soft gold-tinted glow behind the portraits,
   and a very faint dot texture - white text stays on the dark side */
.gh-hc-slide.gh-hc-type-doctors::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(ellipse 60% 70% at 78% 50%, rgba(201,138,46,0.22) 0%, rgba(201,138,46,0) 70%), linear-gradient(112deg, #4A1012 0%, #6E1D1F 42%, #8E2B2B 78%, #A03A33 100%); }
.gh-hc-slide.gh-hc-type-doctors::after { content: ""; position: absolute; inset: 0; z-index: 0; background-image: radial-gradient(rgba(255,255,255,0.07) 1px, transparent 1.4px); background-size: 20px 20px; -webkit-mask-image: linear-gradient(90deg, transparent 35%, rgba(0,0,0,0.9) 100%); mask-image: linear-gradient(90deg, transparent 35%, rgba(0,0,0,0.9) 100%); pointer-events: none; }
.gh-hc-type-doctors .gh-hc-media, .gh-hc-type-doctors .gh-hc-panel, .gh-hc-type-doctors .gh-hc-chip { position: relative; z-index: 1; }
/* the one label */
.gh-hc-chip { position: absolute; z-index: 3; right: 16px; top: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 7px; border-radius: 999px; background: rgba(255,255,255,0.94); color: var(--gh-primary-dark, #892728); font-size: 12.5px; font-weight: 700; line-height: 1.2; box-shadow: 0 8px 22px rgba(0,0,0,0.25); backdrop-filter: blur(6px); }
.gh-hc-chip-ico { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); border: 1px solid var(--gh-line, #E6DACB); flex: 0 0 auto; }
.gh-hc-chip-ico .gh-ico { width: 13px; height: 13px; }
/* text */
.gh-hc-panel { flex: 1 1 auto; display: flex; padding: 24px 0 84px; }
.gh-hc-panel-inner { width: 100%; }
.gh-hc-text { max-width: 640px; }
.gh-hc-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gh-gold-light); margin-bottom: 14px; }
.gh-hc-eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--gh-gold, #C98A2E); }
.gh-hc-title { font-size: clamp(27px, 7vw, 36px); line-height: 1.12; font-weight: 800; color: #fff; margin: 0 0 12px; letter-spacing: -0.015em; }
.gh-hc-sub { font-size: 15px; line-height: 1.55; color: rgba(255,255,255,0.86); margin: 0; max-width: 520px; }
.gh-hc-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; }
.gh-hc-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; margin: 0; border-radius: 10px; background: var(--gh-orange); color: #fff !important; font-size: 15px; font-weight: 700; text-decoration: none; box-shadow: 0 10px 24px rgba(238,125,5,0.30); transition: background 0.2s ease, transform 0.2s ease; }
.gh-hc-cta:hover, .gh-hc-cta:focus-visible { background: var(--gh-gold-hover, #BE6404); transform: translateY(-2px); }
.gh-hc-cta-outline { background: transparent !important; border: 1.5px solid rgba(255,255,255,0.55); color: #fff !important; box-shadow: none; }
.gh-hc-cta-outline:hover, .gh-hc-cta-outline:focus-visible { background: rgba(255,255,255,0.12) !important; border-color: #fff; }
/* team slide: a row of portraits */
.gh-hc-type-doctors .gh-hc-media { aspect-ratio: auto; min-height: 0; background: none; padding: 28px 16px 8px; display: flex; justify-content: center; }
.gh-hc-team { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 10px; max-width: 420px; }
.gh-hc-doc { display: flex; flex-direction: column; align-items: center; width: 104px; text-decoration: none; color: #fff; }
.gh-hc-doc-photo { display: block; width: 92px; height: 92px; border-radius: 50%; overflow: hidden; background: rgba(255,255,255,0.12); border: 3px solid rgba(255,255,255,0.55); box-shadow: 0 10px 24px rgba(0,0,0,0.3); transition: border-color 0.2s ease, transform 0.2s ease; }
.gh-hc-doc-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; display: block; }
.gh-hc-doc-plus { display: grid; place-items: center; width: 100%; height: 100%; font-size: 18px; font-weight: 800; color: var(--gh-gold-light); background: rgba(255,255,255,0.08); }
.gh-hc-doc-name { display: block; margin-top: 8px; font-size: 12.5px; font-weight: 700; line-height: 1.25; text-align: center; color: #fff; }
/* one doctor enlarged at a time (pass 62g): hover on desktop, tap on touch screens (.is-zoomed set by homepage.js); smooth, name stays visible */
.gh-hc-doc { position: relative; transition: z-index 0s linear 0.35s; }
.gh-hc-doc-photo { transition: border-color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease; }
.gh-hc-doc-name { transition: transform 0.35s ease, color 0.35s ease; }
.gh-hc-doc.is-zoomed, .gh-hc-doc:focus-visible { z-index: 5; transition-delay: 0s; }
.gh-hc-doc.is-zoomed .gh-hc-doc-photo, .gh-hc-doc:focus-visible .gh-hc-doc-photo { border-color: var(--gh-gold); transform: translateY(-8px) scale(1.22); box-shadow: 0 18px 40px rgba(0,0,0,0.45); }
.gh-hc-doc.is-zoomed .gh-hc-doc-name, .gh-hc-doc:focus-visible .gh-hc-doc-name { transform: translateY(6px); color: var(--gh-gold-light, #E9C27A); text-decoration: underline; text-decoration-color: var(--gh-gold, #C98A2E); text-underline-offset: 3px; }
@media (hover: hover) {
    .gh-hc-doc:hover { z-index: 5; transition-delay: 0s; }
    .gh-hc-doc:hover .gh-hc-doc-photo { border-color: var(--gh-gold); transform: translateY(-8px) scale(1.22); box-shadow: 0 18px 40px rgba(0,0,0,0.45); }
    .gh-hc-doc:hover .gh-hc-doc-name { transform: translateY(6px); color: var(--gh-gold-light, #E9C27A); text-decoration: underline; text-decoration-color: var(--gh-gold, #C98A2E); text-underline-offset: 3px; }
}
/* controls */
.gh-hc-controls { position: absolute; z-index: 5; left: 0; right: 0; bottom: 30px; display: flex; align-items: center; justify-content: center; gap: 6px; pointer-events: none; }
.gh-hc-controls > * { pointer-events: auto; }
.gh-hc-btn { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.4); background: rgba(0,0,0,0.25); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; transition: background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease; }
.gh-hc-btn:hover, .gh-hc-btn:focus-visible { background: var(--gh-gold); border-color: var(--gh-gold); }
.gh-hc-dots { display: flex; align-items: center; gap: 2px; }
.gh-hc-dot { width: 26px; height: 38px; padding: 0; border: 0; background: transparent; cursor: pointer; position: relative; }
.gh-hc-dot::before { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: rgba(255,255,255,0.45); transition: background 0.2s ease, width 0.2s ease, margin 0.2s ease, border-radius 0.2s ease; }
.gh-hc-dot.is-active::before { background: var(--gh-orange); width: 24px; margin-left: -12px; border-radius: 6px; }
.gh-hc-btn:focus-visible, .gh-hc-dot:focus-visible, .gh-hc-cta:focus-visible, .gh-hc-doc:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.gh-hc-pause .gh-hc-ico-play { display: none; }
.gh-hc-pause[aria-pressed="true"] .gh-hc-ico-play { display: block; }
.gh-hc-pause[aria-pressed="true"] .gh-hc-ico-pause { display: none; }
@media (max-width: 480px) { .gh-hc-ctas { flex-direction: column; align-items: stretch; } .gh-hc-cta { width: 100%; } }
@media (max-width: 899px) { .gh-hc-type-doctors .gh-hc-media { padding-top: 64px; } .gh-hc-proof { gap: 8px 18px; } .gh-hc-proof li + li::before { display: none; } }
@media (min-width: 600px) {
    .gh-hc-media { aspect-ratio: 21 / 9; }
    .gh-hc-team { max-width: none; }
    .gh-hc-doc { width: 104px; }
    .gh-hc-doc-photo { width: 96px; height: 96px; }
}
@media (min-width: 900px) {
    .gh-hc-slide { display: block; min-height: clamp(540px, 46vw, 680px); }
    .gh-hc-media { position: absolute; inset: 0; aspect-ratio: auto; }
    .gh-hc-type-image .gh-hc-media::after, .gh-hc-type-video .gh-hc-media::after { background: linear-gradient(90deg, rgba(74,16,18,0.97) 0%, rgba(74,16,18,0.90) 30%, rgba(74,16,18,0.55) 55%, rgba(74,16,18,0.18) 78%, rgba(74,16,18,0.05) 100%), linear-gradient(180deg, rgba(74,16,18,0) 60%, rgba(74,16,18,0.55) 100%); }
    .gh-hc-panel { position: relative; z-index: 2; min-height: clamp(540px, 46vw, 680px); padding: 40px 0 110px; align-items: center; pointer-events: none; }
    /* the text panel covers the whole slide; let the pointer through to the portraits/picture, but keep the buttons clickable (pass 62f) */
    .gh-hc-panel a, .gh-hc-panel button { pointer-events: auto; }
    .gh-hc-type-doctors .gh-hc-media { z-index: 1; }
    .gh-hc-text { max-width: 600px; }
    .gh-hc-eyebrow { font-size: 12px; margin-bottom: 18px; }
    .gh-hc-title { font-size: clamp(36px, 3.4vw, 52px); margin-bottom: 16px; text-shadow: 0 2px 18px rgba(0,0,0,0.25); }
    .gh-hc-sub { font-size: 17.5px; max-width: 600px; }
    .gh-hc-ctas { margin-top: 28px; gap: 12px; }
    .gh-hc-cta { min-height: 52px; padding: 0 26px; font-size: 15.5px; }
    .gh-hc-chip { top: auto; bottom: 80px; right: max(20px, calc((100vw - 1200px) / 2 + 20px)); font-size: 13.5px; padding: 8px 16px 8px 8px; }
    .gh-hc-chip-ico { width: 28px; height: 28px; }
    .gh-hc-chip-ico .gh-ico { width: 15px; height: 15px; }
    /* team slide (pass 63): large portraits in two staggered rows - top row a touch bigger - on a faint gold ring; names readable */
    .gh-hc-type-doctors .gh-hc-media { position: absolute; inset: 0 max(20px, calc((100vw - 1200px) / 2 + 20px)) 0 auto; width: min(660px, 56vw); padding: 0; align-items: center; justify-content: center; background: radial-gradient(ellipse at 50% 50%, rgba(201,138,46,0.20) 0%, rgba(201,138,46,0) 62%); }
    .gh-hc-type-doctors .gh-hc-media::before { content: ""; position: absolute; left: 50%; top: 50%; width: min(560px, 48vw); height: min(560px, 48vw); margin: calc(min(560px, 48vw) / -2) 0 0 calc(min(560px, 48vw) / -2); border-radius: 50%; border: 1px solid rgba(233,194,122,0.22); box-shadow: inset 0 0 80px rgba(201,138,46,0.10); pointer-events: none; }
    .gh-hc-team { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 18px 14px; max-width: none; position: relative; }
    .gh-hc-doc { width: 104px; margin: 0; }
    .gh-hc-doc-photo { width: 92px; height: 92px; border-width: 4px; border-color: rgba(255,255,255,0.85); box-shadow: 0 14px 30px rgba(0,0,0,0.38); }
    .gh-hc-doc:nth-child(-n+4) { width: 118px; }
    .gh-hc-doc:nth-child(-n+4) .gh-hc-doc-photo { width: 106px; height: 106px; }
    /* the doctor photos are wide desk shots, so zoom in on the face inside the circle (pass 62b/62e) */
    .gh-hc-doc-photo img { transform: scale(var(--gh-zoom, 1.7)); transform-origin: 50% 30%; }
    .gh-hc-doc-photo img[style*="--gh-zoom:1"] { object-position: 50% 50%; transform-origin: 50% 50%; }
    /* names always visible under the portraits (pass 62c) - the whole portrait + name links to the doctor's profile */
    .gh-hc-doc-name { font-size: 13.5px; font-weight: 700; margin-top: 10px; color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,0.35); }
    .gh-hc-type-doctors .gh-hc-text { max-width: min(560px, calc(100% - min(660px, 56vw) - 16px)); }
    .gh-hc-type-doctors .gh-hc-chip { bottom: 70px; }
    .gh-hc-slide.gh-hc-type-doctors { min-height: clamp(620px, 50vw, 700px); }
    .gh-hc-type-doctors .gh-hc-panel { min-height: clamp(620px, 50vw, 700px); }
}
@media (min-width: 900px) and (max-width: 1099px) {
    .gh-hc-team { gap: 14px 8px; }
    .gh-hc-doc { width: 96px; }
    .gh-hc-doc-photo { width: 84px; height: 84px; }
    .gh-hc-doc:nth-child(-n+4) { width: 108px; }
    .gh-hc-doc:nth-child(-n+4) .gh-hc-doc-photo { width: 96px; height: 96px; }
    .gh-hc-doc-name { font-size: 12.5px; }
}
@media (min-width: 1200px) {
    .gh-hc-team { gap: 22px 18px; }
    .gh-hc-doc { width: 130px; }
    .gh-hc-doc-photo { width: 116px; height: 116px; }
    .gh-hc-doc:nth-child(-n+4) { width: 150px; }
    .gh-hc-doc:nth-child(-n+4) .gh-hc-doc-photo { width: 138px; height: 138px; }
    .gh-hc-doc-name { font-size: 14px; }
    /* controls bottom-left; arrows appear on hover */
    .gh-hc-controls { left: max(20px, calc((100vw - 1200px) / 2 + 20px)); right: auto; bottom: 44px; justify-content: flex-start; }
    .gh-hc-prev, .gh-hc-next { opacity: 0; }
    .gh-hc:hover .gh-hc-prev, .gh-hc:hover .gh-hc-next, .gh-hc-prev:focus-visible, .gh-hc-next:focus-visible, .gh-hc-controls:focus-within .gh-hc-btn { opacity: 1; }
}
@media (min-width: 1200px) { .gh-qa-label { white-space: nowrap; } }
@media (min-width: 900px) {
    /* the fixed Call / WhatsApp / Book toolbar stays out of the way until the hero has scrolled off (class set by homepage.js) */
    .gh-sticky-toolbar { transition: transform 0.35s ease, opacity 0.35s ease; }
    body.gh-hero-in-view .gh-sticky-toolbar { transform: translateY(140%); opacity: 0; pointer-events: none; }
}
@media (prefers-reduced-motion: reduce) {
    .gh-hc-slide, .gh-hc-slide.is-active, .gh-hc-cta, .gh-hc-doc, .gh-hc-doc-photo, .gh-hc-doc-photo img, .gh-hc-doc-name, .gh-sticky-toolbar, .gh-hc-btn { transition: none; }
    .gh-hc-prev, .gh-hc-next { opacity: 1; }
}

/* proof line (pass 62): the page h1 and the five confirmed facts as one quiet strip on cream, no card */
.gh-hc-strip { position: relative; z-index: 3; background: var(--gh-bg-ivory, #faf6ef); border-bottom: 1px solid var(--gh-border, #e3d9cc); padding: 16px 0 18px; }
.gh-hc-strip-inner { display: flex; flex-direction: column; gap: 10px; }
.gh-hc-strip h1.gh-hc-strip-h1 { margin: 0; padding: 0; font-size: inherit; font-weight: inherit; line-height: 1.35; font-family: inherit; letter-spacing: normal; text-transform: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.gh-hc-strip h1.gh-hc-strip-h1 .gh-hc-strip-name { font-size: 15px; font-weight: 800; color: var(--gh-primary-dark, #892728); }
.gh-hc-strip h1.gh-hc-strip-h1 .gh-hc-strip-sep { display: none; font-size: 14px; font-weight: 700; color: var(--gh-gold, #C98A2E); }
.gh-hc-strip h1.gh-hc-strip-h1 .gh-hc-strip-role { font-size: 13px; font-weight: 500; color: var(--gh-muted, #6B5F5A); }
.gh-hc-proof { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; }
.gh-hc-proof li { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--gh-primary-dark, #892728); white-space: nowrap; }
.gh-hc-proof li + li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--gh-gold, #C98A2E); margin: 0 12px; }
.gh-hc-proof .gh-ico { color: var(--gh-gold, #C98A2E); flex: 0 0 auto; }
@media (min-width: 900px) {
    .gh-hc-strip { padding: 14px 0 16px; }
    .gh-hc-strip-inner { gap: 8px; }
    .gh-hc-strip h1.gh-hc-strip-h1 .gh-hc-strip-sep { display: inline; }
}

/* ---------- QUICK ACTIONS v2 (replaces the old .gh-quick-services strip) ----------
   Old strip: a flex row of fixed 138px cards with overflow-x:auto, so on phones the
   7 cards ran 1026px wide inside a ~350px row and had to be scrolled sideways.
   New strip: cards wrap and share the row width, so every card always fits the screen.
   Phones: 2 per row, icon above label, arrow top-right (the odd last card spans the row).
   Tablets: 4 + 3.  Desktop: all 7 in one row. Words are never broken mid-word. */
.gh-qa { padding: 28px 0 8px; background: #fff; }
.gh-home .gh-qa-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.gh-qa-item { flex: 1 1 calc(50% - 5px); min-width: 0; display: flex; }
.gh-qa-card { position: relative; flex: 1 1 auto; min-width: 0; min-height: 104px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px 12px; background: linear-gradient(180deg, #fff 0%, var(--gh-ivory, #FAF6F0) 100%); border: 1px solid var(--gh-border, #E6DACB); border-radius: 14px; box-shadow: 0 1px 2px rgba(74,21,23,0.04); color: var(--gh-text, #2a2422); overflow: hidden; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; -webkit-tap-highlight-color: transparent; }
.gh-qa-card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--gh-gold); transform: scaleX(0); transform-origin: left; transition: transform 0.28s ease; }
.gh-qa-icon { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-primary-dark, #892728); transition: background 0.22s ease, color 0.22s ease, transform 0.22s ease; }
.gh-qa-label { max-width: 100%; font-size: clamp(12.5px, 3.6vw, 13.5px); font-weight: 700; line-height: 1.25; color: var(--gh-primary-dark, #892728); }
.gh-qa-arrow { position: absolute; top: 14px; right: 12px; display: grid; place-items: center; color: var(--gh-gold); transition: transform 0.22s ease; }
.gh-qa-card:hover, .gh-qa-card:focus-visible { transform: translateY(-3px); border-color: rgba(238,125,5,0.55); box-shadow: 0 10px 24px rgba(74,21,23,0.10); }
.gh-qa-card:hover::after, .gh-qa-card:focus-visible::after { transform: scaleX(1); }
.gh-qa-card:hover .gh-qa-icon, .gh-qa-card:focus-visible .gh-qa-icon { background: var(--gh-primary-dark, #892728); color: #fff; transform: scale(1.06); }
.gh-qa-card:hover .gh-qa-arrow, .gh-qa-card:focus-visible .gh-qa-arrow { transform: translate(2px, -2px); }
.gh-qa-card:active { transform: translateY(0) scale(0.985); box-shadow: 0 2px 6px rgba(74,21,23,0.08); }
.gh-qa-card:focus-visible { outline: 3px solid #E9C27A; outline-offset: 2px; }
/* phones: an odd last card takes the full row, laid out sideways so it does not look stretched */
@media (max-width: 599px) {
    .gh-qa-item:last-child:nth-child(odd) { flex-basis: 100%; }
    .gh-qa-item:last-child:nth-child(odd) .gh-qa-card { flex-direction: row; align-items: center; min-height: 64px; padding: 10px 40px 10px 12px; }
    .gh-qa-item:last-child:nth-child(odd) .gh-qa-arrow { top: 50%; margin-top: -8px; }
}
@media (min-width: 600px) {
    .gh-qa-item { flex-basis: calc(25% - 7.5px); }
}
@media (min-width: 1024px) {
    .gh-qa { padding: 32px 0 12px; }
    .gh-home .gh-qa-list { flex-wrap: nowrap; gap: 12px; }
    .gh-qa-item { flex: 1 1 0; }
    .gh-qa-card { gap: 12px; min-height: 116px; padding: 16px 14px; }
    .gh-qa-icon { width: 44px; height: 44px; }
    .gh-qa-label { font-size: 13px; }
}
@media (min-width: 1200px) {
    .gh-qa-label { font-size: 13.5px; }
}
@media (prefers-reduced-motion: reduce) {
    .gh-qa-card, .gh-qa-card::after, .gh-qa-icon, .gh-qa-arrow { transition: none; }
    .gh-qa-card:hover, .gh-qa-card:focus-visible { transform: none; }
    .gh-qa-card:hover .gh-qa-icon, .gh-qa-card:hover .gh-qa-arrow { transform: none; }
}

/* ---------- CONDITIONS / PROCEDURES / TECHNOLOGY v2 ----------
   Desktop: 4 cards per row (Technology has 3 items, so that tab uses 3).
   Tablet: 2 per row.  Phones: 1 per row, icon beside the text so cards stay compact.
   All three lists are in the page HTML (the old version kept two of them only in a
   script tag); the tabs just show and hide them. Cards are not links, so they carry
   no arrow - nothing on them pretends to be clickable. */
.gh-cpt-tabs { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 6px; margin: 0 0 24px; background: var(--gh-ivory, #FAF6F0); border: 1px solid var(--gh-border, #E6DACB); border-radius: 999px; max-width: 100%; }
.gh-cpt-tab { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent; color: var(--gh-primary-dark, #892728); font-size: 14px; font-weight: 700; cursor: pointer; transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; -webkit-tap-highlight-color: transparent; }
.gh-cpt-count { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; border-radius: 999px; background: #fff; border: 1px solid var(--gh-border, #E6DACB); font-size: 11.5px; font-weight: 700; color: var(--gh-muted, #6B5F5A); transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.gh-cpt-tab:hover { background: #fff; }
.gh-cpt-tab.is-active { background: var(--gh-primary-dark, #892728); color: #fff; box-shadow: 0 4px 12px rgba(137,39,40,0.25); }
.gh-cpt-tab.is-active .gh-cpt-count { background: var(--gh-orange); border-color: var(--gh-orange); color: #fff; }
.gh-cpt-tab:focus-visible, .gh-cpt-panel:focus-visible { outline: 3px solid #E9C27A; outline-offset: 2px; }
.gh-cpt-panel[hidden] { display: none; }
.gh-cpt-panel { border-radius: 16px; }
.gh-home .gh-cpt-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.gh-cpt-card { position: relative; min-width: 0; display: flex; align-items: flex-start; gap: 14px; padding: 16px; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 16px; box-shadow: 0 1px 2px rgba(74,21,23,0.04); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; }
.gh-cpt-card::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px; background: linear-gradient(90deg, #C98A2E, var(--gh-primary-dark, #892728)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease; }
.gh-cpt-icon { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-primary-dark, #892728); transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease; }
.gh-cpt-icon svg { width: 38px; height: 38px; display: block; }
.gh-cpt-text { min-width: 0; }
.gh-home .gh-cpt-title { margin: 2px 0 4px; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--gh-primary-dark, #892728); }
.gh-home .gh-cpt-desc { margin: 0; font-size: 13px; line-height: 1.5; color: var(--gh-muted, #6B5F5A); }
@media (hover: hover) {
    .gh-cpt-card:hover { transform: translateY(-4px); border-color: rgba(238,125,5,0.45); box-shadow: 0 14px 30px rgba(74,21,23,0.10); }
    .gh-cpt-card:hover::before { transform: scaleX(1); }
    .gh-cpt-card:hover .gh-cpt-icon { background: var(--gh-primary-dark, #892728); color: #fff; transform: scale(1.06); }
}
.gh-cpt-panel.is-entering .gh-cpt-card { animation: ghCptIn 0.35s ease both; }
.gh-cpt-panel.is-entering .gh-cpt-card:nth-child(2) { animation-delay: 0.03s; }
.gh-cpt-panel.is-entering .gh-cpt-card:nth-child(3) { animation-delay: 0.06s; }
.gh-cpt-panel.is-entering .gh-cpt-card:nth-child(4) { animation-delay: 0.09s; }
.gh-cpt-panel.is-entering .gh-cpt-card:nth-child(n+5) { animation-delay: 0.12s; }
@keyframes ghCptIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 599px) {
    .gh-cpt-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 5px; border-radius: 16px; }
    .gh-cpt-tab { justify-content: center; gap: 6px; padding: 0 6px; font-size: 12.5px; border-radius: 12px; min-width: 0; }
}
@media (max-width: 479px) {
    .gh-cpt-count { display: none; }
}
@media (min-width: 600px) {
    .gh-home .gh-cpt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}
@media (min-width: 1024px) {
    .gh-home .gh-cpt-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
    .gh-home .gh-cpt-grid-technology { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gh-cpt-card { flex-direction: column; gap: 14px; padding: 22px 20px; }
    .gh-cpt-icon { width: 60px; height: 60px; border-radius: 16px; }
    .gh-cpt-icon svg { width: 44px; height: 44px; }
    .gh-home .gh-cpt-title { font-size: 15.5px; margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .gh-cpt-card, .gh-cpt-card::before, .gh-cpt-icon, .gh-cpt-tab, .gh-cpt-count { transition: none; }
    .gh-cpt-card:hover, .gh-cpt-card:hover .gh-cpt-icon { transform: none; }
    .gh-cpt-panel.is-entering .gh-cpt-card { animation: none; }
}

/* ---------- ABOUT v2 ("Gujarat Gastro & Vascular Hospital" section) ----------
   Desktop: building photo left, text + four cards right.  Below 1024px: stacked. */
.gh-about { position: relative; background: radial-gradient(900px 420px at 0% 0%, rgba(238,125,5,0.07), transparent 60%), linear-gradient(180deg, #fff 0%, var(--gh-ivory, #FAF6F0) 100%); overflow: hidden; }
.gh-about-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: center; }
.gh-about-visual { position: relative; max-width: 560px; width: 100%; margin: 0 auto; padding: 0 14px 14px 0; }
.gh-about-visual::before { content: ""; position: absolute; right: 0; bottom: 0; width: 72%; height: 78%; border-radius: 22px; background: linear-gradient(135deg, var(--gh-primary-dark, #892728), #5c1a1b); }
.gh-about-visual::after { content: ""; position: absolute; left: -18px; top: -18px; width: 120px; height: 120px; background-image: radial-gradient(rgba(238,125,5,0.55) 1.6px, transparent 1.7px); background-size: 14px 14px; z-index: 0; }
.gh-about-photo { position: relative; z-index: 1; aspect-ratio: 5 / 4; border-radius: 20px; overflow: hidden; background: #e9e0d6; box-shadow: 0 18px 40px rgba(74,21,23,0.18); }
.gh-home .gh-about-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.gh-about-chip { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: #fff; color: var(--gh-primary-dark, #892728); font-size: 12.5px; font-weight: 700; box-shadow: 0 8px 22px rgba(74,21,23,0.16); }
.gh-about-chip .gh-ico { color: var(--gh-gold); }
.gh-about-chip-a { left: 14px; top: 14px; }
.gh-about-chip-b { right: 28px; bottom: 28px; }
.gh-about-body { min-width: 0; }
.gh-about-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gh-gold); margin-bottom: 10px; }
.gh-about-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--gh-gold); }
.gh-home .gh-about-title { font-size: clamp(24px, 3vw, 34px); line-height: 1.2; margin: 0 0 12px; }
.gh-home .gh-about-intro { font-size: 15px; line-height: 1.7; color: var(--gh-muted, #6B5F5A); margin: 0 0 24px; max-width: 620px; }
.gh-home .gh-about-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; }
.gh-about-card { position: relative; min-width: 0; padding: 18px 18px 18px 74px; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 16px; box-shadow: 0 1px 2px rgba(74,21,23,0.04); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; }
.gh-about-card::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 0 3px 3px 0; background: var(--gh-gold); transform: scaleY(0.35); transform-origin: center; transition: transform 0.3s ease; }
.gh-about-icon { position: absolute; left: 18px; top: 18px; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-primary-dark, #892728); transition: background 0.25s ease, color 0.25s ease; }
.gh-about-num { position: absolute; right: 14px; top: 6px; font-size: 34px; font-weight: 800; line-height: 1; color: rgba(137,39,40,0.07); }
.gh-home .gh-about-card-title { margin: 0 0 4px; font-size: 15px; font-weight: 700; color: var(--gh-primary-dark, #892728); }
.gh-home .gh-about-card-text { margin: 0; font-size: 13px; line-height: 1.55; color: var(--gh-muted, #6B5F5A); }
@media (hover: hover) {
    .gh-about-card:hover { transform: translateY(-3px); border-color: rgba(238,125,5,0.45); box-shadow: 0 12px 26px rgba(74,21,23,0.10); }
    .gh-about-card:hover::before { transform: scaleY(1); }
    .gh-about-card:hover .gh-about-icon { background: var(--gh-primary-dark, #892728); color: #fff; }
    .gh-about-visual:hover .gh-about-photo img { transform: scale(1.04); }
}
@media (min-width: 600px) {
    .gh-home .gh-about-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}
@media (min-width: 1024px) {
    .gh-about-grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 56px; }
    .gh-about-visual { margin: 0; }
}

/* ---------- Scroll reveal (shared) ----------
   Elements with data-gh-reveal fade up once when they enter the screen. The hidden state
   only applies after homepage.js adds .gh-reveal-on to <html>, so without JavaScript,
   or with reduced motion, everything is simply visible. */
.gh-reveal-on [data-gh-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 0.55s ease, transform 0.55s ease; }
.gh-reveal-on [data-gh-reveal].is-revealed { opacity: 1; transform: none; }
.gh-reveal-on .gh-about-card[data-gh-reveal]:nth-child(2) { transition-delay: 0.06s; }
.gh-reveal-on .gh-about-card[data-gh-reveal]:nth-child(3) { transition-delay: 0.12s; }
.gh-reveal-on .gh-about-card[data-gh-reveal]:nth-child(4) { transition-delay: 0.18s; }
.gh-reveal-on .gh-about-card.is-revealed { transition: opacity 0.55s ease, transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) {
    .gh-about-card, .gh-about-card::before, .gh-about-icon, .gh-about-photo img { transition: none; }
    .gh-about-card:hover, .gh-about-visual:hover .gh-about-photo img { transform: none; }
}

/* ---------- SPECIALISTS v2 ("Meet the Specialists Behind Your Care") ----------
   Desktop with a mouse: three cards per row at a fixed height. The doctor under the
   pointer (or holding keyboard focus) grows, the two beside it give way, and the bio and
   profile link appear. Row height never changes, so nothing below the section moves.
   Touch screens, tablets and phones: no hover exists, so every card shows its details. */
.gh-spec-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.gh-spec-row { display: contents; }
.gh-spec-card { position: relative; min-width: 0; display: flex; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 16px; overflow: hidden; box-shadow: 0 1px 2px rgba(74,21,23,0.04); }
.gh-spec-photo { position: relative; flex: 0 0 38%; min-height: 150px; background: linear-gradient(160deg, #ece3d9, #d8c9bd); overflow: hidden; }
.gh-home .gh-spec-photo img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 30%; display: block; transition: transform 0.6s ease; }
/* pass 93: portrait crops - keep the face in the top part of the card, clear of the name overlay */
.gh-home .gh-spec-photo img.gh-spec-portrait { object-position: 50% 18%; }
.gh-spec-nophoto { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(137,39,40,0.35); }
.gh-spec-info { flex: 1 1 auto; min-width: 0; padding: 14px 14px 14px 16px; display: flex; flex-direction: column; justify-content: center; }
.gh-home .gh-spec-name { margin: 0 0 2px; font-size: 15.5px; font-weight: 700; line-height: 1.25; color: var(--gh-primary-dark, #892728); }
.gh-spec-role { font-size: 12.5px; font-weight: 600; color: var(--gh-gold); margin-bottom: 6px; }
.gh-home .gh-spec-bio { margin: 0 0 8px; font-size: 12.5px; line-height: 1.5; color: var(--gh-muted, #6B5F5A); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gh-home a.gh-spec-link { display: inline-flex; align-items: center; min-height: 32px; font-size: 13px; font-weight: 700; color: var(--gh-primary-dark, #892728); }
.gh-home a.gh-spec-link:hover { color: var(--gh-deep); }
.gh-spec-link:focus-visible { outline: 3px solid #E9C27A; outline-offset: 2px; border-radius: 4px; }
.gh-spec-card .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (min-width: 600px) {
    .gh-spec-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .gh-spec-card { flex-direction: column; }
    .gh-spec-photo { flex: 0 0 auto; min-height: 0; aspect-ratio: 3 / 2; }
    .gh-spec-info { padding: 16px 18px 18px; justify-content: flex-start; }
}
@media (min-width: 1024px) {
    .gh-spec-grid { display: flex; flex-direction: column; gap: 18px; }
    .gh-spec-row { display: flex; gap: 18px; height: 440px; }
    .gh-spec-card { flex: 1 1 0; display: block; border: 0; border-radius: 18px; box-shadow: 0 6px 18px rgba(74,21,23,0.10); transition: flex-grow 0.5s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease; }
    .gh-spec-photo { position: absolute; inset: 0; aspect-ratio: auto; }
    .gh-spec-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,8,8,0) 38%, rgba(20,8,8,0.55) 68%, rgba(20,8,8,0.9) 100%); transition: opacity 0.3s ease; }
    .gh-spec-info { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 22px; color: #fff; display: block; }
    .gh-home .gh-spec-name { color: #fff; font-size: 18px; text-shadow: 0 1px 8px rgba(0,0,0,0.35); }
    .gh-spec-role { color: #FFC27A; margin-bottom: 0; }
    .gh-home .gh-spec-bio { color: rgba(255,255,255,0.92); font-size: 13px; margin: 10px 0 10px; max-width: 460px; }
    .gh-home a.gh-spec-link { color: #fff; background: var(--gh-primary-dark); padding: 0 16px; min-height: 38px; border-radius: 8px; transition: background 0.2s ease; }
    .gh-home a.gh-spec-link:hover { color: #fff; background: var(--gh-gold-hover, #BE6404); }
    /* while the search box is filtering, fall back to a plain 3-column grid so a single match is not stretched */
    .gh-spec-grid.is-filtering { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
    .gh-spec-grid.is-filtering .gh-spec-row { display: contents; }
    .gh-spec-grid.is-filtering .gh-spec-card { height: 440px; }
}
@media (min-width: 1024px) and (hover: hover) {
    .gh-spec-more { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease; }
    .gh-spec-more-inner { min-height: 0; overflow: hidden; }
    .gh-spec-grid:not(.is-filtering) .gh-spec-card:hover, .gh-spec-grid:not(.is-filtering) .gh-spec-card:focus-within { flex-grow: 1.9; }
    .gh-spec-card:hover, .gh-spec-card:focus-within { box-shadow: 0 18px 40px rgba(74,21,23,0.22); }
    .gh-spec-card:hover .gh-spec-photo img, .gh-spec-card:focus-within .gh-spec-photo img { transform: scale(1.05); }
    .gh-spec-card:hover .gh-spec-more, .gh-spec-card:focus-within .gh-spec-more { grid-template-rows: 1fr; opacity: 1; }
    /* the two neighbours dim slightly so the active doctor clearly leads */
    .gh-spec-row:hover .gh-spec-card:not(:hover) .gh-spec-photo::after, .gh-spec-row:focus-within .gh-spec-card:not(:focus-within) .gh-spec-photo::after { background: linear-gradient(180deg, rgba(20,8,8,0.25) 0%, rgba(20,8,8,0.6) 60%, rgba(20,8,8,0.92) 100%); }
}
@media (prefers-reduced-motion: reduce) {
    .gh-spec-card, .gh-spec-photo img, .gh-spec-more, .gh-spec-photo::after { transition: none !important; }
    .gh-spec-grid .gh-spec-card:hover, .gh-spec-grid .gh-spec-card:focus-within { flex-grow: 1 !important; }
    .gh-spec-card:hover .gh-spec-photo img, .gh-spec-card:focus-within .gh-spec-photo img { transform: none; }
}

/* ---------- WHY US v2 ("Why Gujarat Gastro & Vascular Hospital") ----------
   Four numbered feature cards. Desktop: 4 in a row, joined by a thin line behind the
   icons so they read as one model of care. Tablet: 2 per row. Phones: 1 per row. */
.gh-home .gh-whyx-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.gh-whyx-card { position: relative; min-width: 0; padding: 20px 18px 20px 82px; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 18px; box-shadow: 0 1px 2px rgba(74,21,23,0.04); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; }
.gh-whyx-card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, #C98A2E, var(--gh-primary-dark, #892728)); transform: scaleX(0); transform-origin: left; transition: transform 0.35s ease; }
.gh-whyx-icon { position: absolute; left: 18px; top: 20px; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--gh-primary-dark, #892728), #5c1a1b); color: #fff; box-shadow: 0 6px 14px rgba(137,39,40,0.28), 0 0 0 5px var(--gh-gold-soft, #FBF1E6); transition: transform 0.25s ease, box-shadow 0.25s ease; }
.gh-whyx-num { position: absolute; right: 14px; top: 8px; font-size: 44px; font-weight: 800; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(238,125,5,0.35); transition: color 0.3s ease, -webkit-text-stroke-color 0.3s ease; }
.gh-home .gh-whyx-title { margin: 2px 66px 6px 0; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--gh-primary-dark, #892728); }
.gh-home .gh-whyx-text { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--gh-muted, #6B5F5A); }
@media (hover: hover) {
    .gh-whyx-card:hover { transform: translateY(-5px); border-color: rgba(238,125,5,0.45); box-shadow: 0 16px 34px rgba(74,21,23,0.12); }
    .gh-whyx-card:hover::after { transform: scaleX(1); }
    .gh-whyx-card:hover .gh-whyx-icon { transform: scale(1.07); box-shadow: 0 8px 18px rgba(137,39,40,0.34), 0 0 0 5px rgba(238,125,5,0.25); }
    .gh-whyx-card:hover .gh-whyx-num { color: rgba(238,125,5,0.16); -webkit-text-stroke-color: rgba(238,125,5,0.7); }
}
@media (min-width: 600px) {
    .gh-home .gh-whyx-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (min-width: 1024px) {
    .gh-home .gh-whyx-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
    .gh-home .gh-whyx-grid::before { content: ""; position: absolute; left: 8%; right: 8%; top: 53px; border-top: 2px dashed rgba(137,39,40,0.18); }
    .gh-whyx-card { padding: 28px 20px 24px; text-align: left; }
    .gh-whyx-icon { position: relative; left: auto; top: auto; width: 56px; height: 56px; margin-bottom: 18px; }
    .gh-whyx-num { right: 16px; top: 22px; font-size: 52px; }
    .gh-home .gh-whyx-title { margin: 0 0 8px; font-size: 16.5px; }
}
.gh-reveal-on .gh-whyx-card[data-gh-reveal]:nth-child(2) { transition-delay: 0.07s; }
.gh-reveal-on .gh-whyx-card[data-gh-reveal]:nth-child(3) { transition-delay: 0.14s; }
.gh-reveal-on .gh-whyx-card[data-gh-reveal]:nth-child(4) { transition-delay: 0.21s; }
.gh-reveal-on .gh-whyx-card.is-revealed { transition: opacity 0.55s ease, transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) {
    .gh-whyx-card, .gh-whyx-card::after, .gh-whyx-icon, .gh-whyx-num { transition: none; }
    .gh-whyx-card:hover, .gh-whyx-card:hover .gh-whyx-icon { transform: none; }
}

/* ---------- APPOINTMENT v2 ("Ready to Talk to a Specialist?") ----------
   Desktop (1024px+): information panel left, form card right. Below that: information,
   then the form. The form itself (fields, validation, submission) is untouched. */
.gh-appt-section.gh-apptx { position: relative; padding: 64px 0; color: #fff; background: radial-gradient(700px 380px at 8% 0%, rgba(238,125,5,0.28), transparent 62%), linear-gradient(135deg, #892728 0%, #5c1a1b 100%); overflow: hidden; }
.gh-apptx::after { content: ""; position: absolute; right: -60px; bottom: -60px; width: 280px; height: 280px; background-image: radial-gradient(rgba(255,255,255,0.16) 1.6px, transparent 1.7px); background-size: 16px 16px; pointer-events: none; }
.gh-apptx-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.gh-apptx-info { min-width: 0; }
.gh-apptx-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #FFC27A; margin-bottom: 10px; }
.gh-apptx-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--gh-gold); }
.gh-home .gh-apptx h2 { font-size: clamp(26px, 3.2vw, 38px); line-height: 1.15; font-weight: 800; margin: 0 0 12px; color: #fff; }
.gh-home .gh-apptx .gh-apptx-lead { font-size: 15.5px; line-height: 1.65; opacity: 0.95; margin: 0 0 22px; max-width: 520px; }
.gh-home .gh-apptx-contacts { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 0 0 22px; padding: 0; list-style: none; }
.gh-apptx-contacts li { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); }
.gh-apptx-ico { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: var(--gh-gold); color: #fff; }
.gh-apptx-ctext { min-width: 0; display: flex; flex-direction: column; font-size: 15px; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
.gh-apptx-clabel { font-size: 11.5px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: rgba(255,255,255,0.72); }
.gh-home .gh-apptx-contacts a { color: #fff; text-decoration: none; }
.gh-home .gh-apptx-contacts a:hover, .gh-home .gh-apptx-contacts a:focus-visible { color: #FFC27A; text-decoration: underline; }
.gh-apptx a.gh-btn-white { color: #892728 !important; height: 46px; font-weight: 700; }
.gh-apptx .gh-btn-ghost { height: 46px; font-weight: 700; }
.gh-apptx a:focus-visible { outline: 3px solid #FFC27A; outline-offset: 2px; border-radius: 6px; }
.gh-apptx-formcard { container-type: inline-size; min-width: 0; border-radius: 20px; padding: 24px 18px; box-shadow: 0 24px 60px rgba(0,0,0,0.28); border-top: 5px solid var(--gh-gold); }
.gh-apptx-formhead { margin: 0 0 18px; padding-bottom: 14px; border-bottom: 1px solid var(--gh-border, #E6DACB); }
.gh-home .gh-apptx-formhead h3 { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gh-primary-dark, #892728); }
.gh-apptx-formcard .fluentform { max-width: none; }
/* in a narrow card the form's own two-column field grid goes to one column, whatever the screen size */
@container (max-width: 520px) {
    .gh-apptx-formcard .fluentform fieldset { grid-template-columns: 1fr; gap: 0; }
    .gh-apptx-formcard .fluentform .ff-el-group { margin-bottom: 16px; }
}
@media (min-width: 600px) {
    .gh-home .gh-apptx-contacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gh-apptx-formcard { padding: 30px 28px; }
}
@media (min-width: 1024px) {
    .gh-appt-section.gh-apptx { padding: 80px 0; }
    .gh-apptx-grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 44px; }
    .gh-home .gh-apptx-contacts { grid-template-columns: minmax(0, 1fr); }
    .gh-apptx-info { padding-top: 8px; }
}

/* ---------- SECTION LABELS v2 (the small label above each section heading) ----------
   Was plain orange text. Now a pill with a soft background and a live dot; it slides in
   when the section scrolls into view and a light sweep passes over it every few seconds. */
.gh-home .gh-section-label, .gh-home .gh-about-eyebrow, .gh-home .gh-apptx-eyebrow { position: relative; display: inline-flex; align-items: center; gap: 9px; padding: 7px 16px 7px 12px; margin: 0 0 14px; border-radius: 999px; background: linear-gradient(135deg, #FBF1E6 0%, #F4E6D2 100%); border: 1px solid rgba(201,138,46,0.38); color: #8A5A14; font-size: 12px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; line-height: 1.2; overflow: hidden; box-shadow: none; }
.gh-home .gh-section-label::before, .gh-home .gh-about-eyebrow::before, .gh-home .gh-apptx-eyebrow::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--gh-gold); box-shadow: none; animation: none; }
.gh-home .gh-section-label::after, .gh-home .gh-about-eyebrow::after, .gh-home .gh-apptx-eyebrow::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0) 100%); transform: skewX(-18deg); animation: none; display: none; pointer-events: none; }
/* on the maroon bands the pill goes translucent */
.gh-home .gh-process .gh-section-label, .gh-home .gh-apptx-eyebrow { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.28); color: var(--gh-gold-light); box-shadow: none; }
.gh-home .gh-process .gh-section-label::after, .gh-home .gh-apptx-eyebrow::after { background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.28) 50%, rgba(255,255,255,0) 100%); }
@keyframes ghLabelPulse { 0% { box-shadow: 0 0 0 0 rgba(238,125,5,0.55); } 70% { box-shadow: 0 0 0 8px rgba(238,125,5,0); } 100% { box-shadow: 0 0 0 0 rgba(238,125,5,0); } }
@keyframes ghLabelSweep { 0%, 62% { left: -60%; } 100% { left: 130%; } }
.gh-reveal-on .gh-section-label, .gh-reveal-on .gh-about-eyebrow, .gh-reveal-on .gh-apptx-eyebrow { opacity: 0; transform: translateY(12px) scale(0.96); transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
.gh-reveal-on .gh-section-label.is-revealed, .gh-reveal-on .gh-about-eyebrow.is-revealed, .gh-reveal-on .gh-apptx-eyebrow.is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .gh-home .gh-section-label::before, .gh-home .gh-about-eyebrow::before, .gh-home .gh-apptx-eyebrow::before, .gh-home .gh-section-label::after, .gh-home .gh-about-eyebrow::after, .gh-home .gh-apptx-eyebrow::after { animation: none; }
    .gh-home .gh-section-label::after, .gh-home .gh-about-eyebrow::after, .gh-home .gh-apptx-eyebrow::after { display: none; }
}

/* ---------- CONDITIONS / PROCEDURES: 5 cards per row on desktop (was 4) ---------- */
@media (min-width: 1024px) {
    .gh-home .gh-cpt-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
    .gh-home .gh-cpt-grid-technology { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gh-cpt-card { padding: 20px 16px; }
    .gh-home .gh-cpt-title { font-size: 14.5px; }
    .gh-home .gh-cpt-desc { font-size: 12.5px; }
}
@media (min-width: 1200px) {
    .gh-cpt-card { padding: 22px 18px; }
    .gh-home .gh-cpt-title { font-size: 15px; }
}

/* =====================================================================================
   REDESIGN PASS 8 - Departments v2, CPT v3, Capabilities v2, FAQ v2
   ===================================================================================== */

/* ---------- DEPARTMENTS v2 ---------- */
.gh-home .gh-deptx-desc { max-width: 760px; margin-left: auto; margin-right: auto; }
.gh-home .gh-deptx-desc + .gh-deptx-desc { margin-top: 8px; }
.gh-home .gh-deptx-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin: 0; padding: 0; list-style: none; }
.gh-deptx-card { position: relative; min-width: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 20px; overflow: hidden; box-shadow: 0 2px 6px rgba(74,21,23,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }
.gh-deptx-head { position: relative; padding: 22px 22px 20px; color: #fff; background: linear-gradient(135deg, #892728 0%, #5c1a1b 100%); overflow: hidden; }
.gh-deptx-card:nth-child(2) .gh-deptx-head { background: linear-gradient(135deg, #a3352a 0%, #6e1f1c 100%); }
.gh-deptx-card:nth-child(3) .gh-deptx-head { background: linear-gradient(135deg, #7a2236 0%, #4f1626 100%); }
.gh-deptx-head::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle, rgba(238,125,5,0.45), rgba(238,125,5,0) 70%); transition: transform 0.5s ease; }
.gh-deptx-icon { position: relative; z-index: 1; width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.28); margin-bottom: 14px; transition: transform 0.3s ease, background 0.3s ease; }
.gh-deptx-num { position: absolute; z-index: 1; right: 20px; top: 16px; font-size: 40px; font-weight: 800; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,0.45); }
.gh-home .gh-deptx-name { position: relative; z-index: 1; margin: 0 0 8px; font-size: 19px; line-height: 1.3; font-weight: 800; color: #fff; }
.gh-deptx-count { position: relative; z-index: 1; display: inline-block; padding: 4px 11px; border-radius: 999px; background: rgba(255,255,255,0.16); font-size: 11.5px; font-weight: 700; letter-spacing: 0.02em; }
.gh-deptx-body { flex: 1 1 auto; padding: 20px 22px 6px; }
.gh-home .gh-deptx-text { margin: 0 0 16px; font-size: 14px; line-height: 1.65; color: var(--gh-muted, #6B5F5A); }
.gh-deptx-listlabel { font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-primary-dark, #892728); margin-bottom: 10px; }
.gh-home .gh-deptx-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.gh-deptx-chips li { padding: 6px 11px; border-radius: 999px; background: var(--gh-gold-soft, #FBF1E6); border: 1px solid rgba(238,125,5,0.22); font-size: 12.5px; font-weight: 600; color: #5a3a2e; line-height: 1.25; }
.gh-deptx-chips .gh-deptx-chip-more { background: #fff; border-style: dashed; color: var(--gh-muted, #6B5F5A); }
.gh-deptx-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 16px 22px 0; padding: 16px 0 20px; border-top: 1px solid var(--gh-border, #E6DACB); }
.gh-deptx-lead { display: flex; flex-direction: column; min-width: 0; }
.gh-deptx-leadlabel { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--gh-muted, #6B5F5A); }
.gh-deptx-leadname { font-size: 14.5px; font-weight: 700; color: var(--gh-primary-dark, #892728); }
.gh-home a.gh-deptx-link { display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 0 16px; border-radius: 10px; background: var(--gh-primary-dark); color: #fff; font-size: 13.5px; font-weight: 700; text-decoration: none; transition: background 0.2s ease; }
.gh-home a.gh-deptx-link:hover { background: var(--gh-gold-hover, #BE6404); color: #fff; }
.gh-deptx-link .gh-ico { transition: transform 0.25s ease; }
.gh-deptx-link:focus-visible { outline: 3px solid var(--gh-primary-dark, #892728); outline-offset: 2px; }
.gh-deptx-card .screen-reader-text, .gh-faqx .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (hover: hover) {
    .gh-deptx-card:hover { transform: translateY(-6px); border-color: rgba(238,125,5,0.45); box-shadow: 0 22px 44px rgba(74,21,23,0.14); }
    .gh-deptx-card:hover .gh-deptx-head::after { transform: scale(1.5); }
    .gh-deptx-card:hover .gh-deptx-icon { transform: scale(1.08) rotate(-4deg); background: var(--gh-primary-dark); }
    .gh-deptx-link:hover .gh-ico { transform: translate(2px, -2px); }
}
@media (min-width: 700px) { .gh-home .gh-deptx-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gh-deptx-card:nth-child(3) { grid-column: 1 / -1; } }
@media (min-width: 1024px) { .gh-home .gh-deptx-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } .gh-deptx-card:nth-child(3) { grid-column: auto; } }
.gh-reveal-on .gh-deptx-card[data-gh-reveal]:nth-child(2) { transition-delay: 0.08s; }
.gh-reveal-on .gh-deptx-card[data-gh-reveal]:nth-child(3) { transition-delay: 0.16s; }
.gh-reveal-on .gh-deptx-card.is-revealed { transition: opacity 0.55s ease, transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; transition-delay: 0s; }

/* ---------- CPT v3: intro strip + cards with an extra information line; every row is full ---------- */
.gh-cptx-intro { display: flex; align-items: center; justify-content: space-between; gap: 18px 28px; flex-wrap: wrap; margin: 0 0 22px; padding: 18px 20px; border-radius: 16px; background: linear-gradient(135deg, #FFF6EA 0%, #FBEBD6 100%); border: 1px solid rgba(238,125,5,0.25); }
.gh-home .gh-cptx-intro p { flex: 1 1 420px; margin: 0; font-size: 14.5px; line-height: 1.7; color: #4a3d36; }
.gh-home a.gh-cptx-cta { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 10px; background: var(--gh-primary-dark, #892728); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; transition: background 0.2s ease, transform 0.2s ease; }
.gh-home a.gh-cptx-cta:hover { background: #6e1f20; color: #fff; transform: translateY(-2px); }
.gh-cptx-cta:focus-visible { outline: 3px solid #E9C27A; outline-offset: 2px; }
.gh-home .gh-cptx-grid { --gh-cpt-gap: 14px; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gh-cpt-gap); margin: 0; padding: 0; list-style: none; }
.gh-cptx-card { position: relative; box-sizing: border-box; min-width: 0; flex: 0 0 100%; display: grid; grid-template-columns: 52px minmax(0, 1fr); column-gap: 14px; align-content: start; padding: 16px; background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 16px; box-shadow: 0 1px 2px rgba(74,21,23,0.04); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; }
.gh-cptx-card::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px; background: linear-gradient(90deg, #C98A2E, var(--gh-primary-dark, #892728)); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease; }
.gh-cptx-card .gh-cpt-icon { grid-row: 1 / span 2; }
.gh-home .gh-cptx-title { margin: 2px 0 4px; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--gh-primary-dark, #892728); }
.gh-home .gh-cptx-desc { margin: 0; font-size: 13px; line-height: 1.5; color: var(--gh-muted, #6B5F5A); }
.gh-cptx-more { grid-column: 1 / -1; margin-top: 12px; padding-top: 11px; border-top: 1px dashed var(--gh-border, #E6DACB); font-size: 12.5px; line-height: 1.5; color: #4a3d36; }
.gh-cptx-morelabel { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-gold); margin-bottom: 2px; }
.gh-home .gh-cptx-note { margin: 18px 0 0; font-size: 12.5px; color: var(--gh-muted, #6B5F5A); }
.gh-home .gh-cptx-note a { color: var(--gh-primary-dark, #892728); font-weight: 600; }
@media (hover: hover) {
    .gh-cptx-card:hover { transform: translateY(-4px); border-color: rgba(238,125,5,0.45); box-shadow: 0 14px 30px rgba(74,21,23,0.10); }
    .gh-cptx-card:hover::before { transform: scaleX(1); }
    .gh-cptx-card:hover .gh-cpt-icon { background: var(--gh-primary-dark, #892728); color: #fff; transform: scale(1.06); }
}
.gh-cpt-panel.is-entering .gh-cptx-card { animation: ghCptIn 0.35s ease both; }
.gh-cpt-panel.is-entering .gh-cptx-card:nth-child(2) { animation-delay: 0.03s; }
.gh-cpt-panel.is-entering .gh-cptx-card:nth-child(3) { animation-delay: 0.06s; }
.gh-cpt-panel.is-entering .gh-cptx-card:nth-child(4) { animation-delay: 0.09s; }
.gh-cpt-panel.is-entering .gh-cptx-card:nth-child(n+5) { animation-delay: 0.12s; }
@media (min-width: 600px) { .gh-cptx-card { flex-basis: calc((100% - var(--gh-cpt-gap)) / 2); } }
@media (min-width: 1024px) {
    .gh-home .gh-cptx-grid { --gh-cpt-gap: 16px; }
    .gh-cptx-card { flex-basis: calc((100% - (var(--gh-cpt-cols) - 1) * var(--gh-cpt-gap)) / var(--gh-cpt-cols)); display: flex; flex-direction: column; padding: 20px 18px; }
    .gh-cptx-card .gh-cpt-icon { margin-bottom: 14px; }
    .gh-cptx-more { margin-top: auto; padding-top: 12px; }
    .gh-home .gh-cptx-desc { margin-bottom: 12px; }
}

/* ---------- CAPABILITIES v2 ---------- */
.gh-capx-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.gh-capx-card { position: relative; min-width: 0; padding: 26px 24px; border-radius: 22px; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.gh-capx-dark { color: #fff; background: radial-gradient(520px 300px at 100% 0%, rgba(238,125,5,0.35), transparent 65%), linear-gradient(135deg, #892728 0%, #4f1617 100%); box-shadow: 0 18px 40px rgba(74,21,23,0.22); }
.gh-capx-light { background: linear-gradient(180deg, #fff 0%, var(--gh-ivory, #FAF6F0) 100%); border: 1px solid var(--gh-border, #E6DACB); box-shadow: 0 2px 6px rgba(74,21,23,0.05); }
.gh-capx-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; padding-right: 64px; }
.gh-capx-icon { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; transition: transform 0.3s ease; }
.gh-capx-dark .gh-capx-icon { background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.28); }
.gh-capx-light .gh-capx-icon { background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-primary-dark, #892728); }
.gh-capx-badge { padding: 6px 12px; border-radius: 999px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.3; }
.gh-capx-dark .gh-capx-badge { background: var(--gh-gold); color: #fff; }
.gh-capx-light .gh-capx-badge { background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-primary-dark, #892728); border: 1px solid rgba(238,125,5,0.28); }
.gh-capx-num { position: absolute; right: 22px; top: 18px; font-size: 56px; font-weight: 800; line-height: 1; color: transparent; }
.gh-capx-dark .gh-capx-num { -webkit-text-stroke: 1.5px rgba(255,255,255,0.35); }
.gh-capx-light .gh-capx-num { -webkit-text-stroke: 1.5px rgba(238,125,5,0.35); }
.gh-home .gh-capx-title { margin: 0 0 10px; font-size: clamp(19px, 2.2vw, 24px); line-height: 1.25; font-weight: 800; }
.gh-home .gh-capx-dark .gh-capx-title { color: #fff; }
.gh-home .gh-capx-light .gh-capx-title { color: var(--gh-primary-dark, #892728); }
.gh-home .gh-capx-text { margin: 0 0 12px; font-size: 14.5px; line-height: 1.7; }
.gh-home .gh-capx-dark .gh-capx-text { color: rgba(255,255,255,0.92); }
.gh-home .gh-capx-light .gh-capx-text { color: var(--gh-muted, #6B5F5A); }
.gh-home .gh-capx-what { margin: 0 0 18px; padding: 12px 14px; border-radius: 12px; font-size: 13.5px; line-height: 1.65; }
.gh-home .gh-capx-dark .gh-capx-what { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.18); color: rgba(255,255,255,0.92); }
.gh-home .gh-capx-light .gh-capx-what { background: #fff; border: 1px solid var(--gh-border, #E6DACB); color: #4a3d36; }
.gh-home .gh-capx-points { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin: 0; padding: 0; list-style: none; }
.gh-capx-points li { display: flex; align-items: flex-start; gap: 9px; font-size: 14px; font-weight: 600; line-height: 1.4; }
.gh-capx-points .gh-ico { flex: 0 0 auto; margin-top: 2px; padding: 3px; width: 22px; height: 22px; box-sizing: border-box; border-radius: 50%; }
.gh-capx-dark .gh-capx-points .gh-ico { background: var(--gh-gold); color: #fff; }
.gh-capx-light .gh-capx-points .gh-ico { background: var(--gh-primary-dark, #892728); color: #fff; }
.gh-capx-also { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; margin-top: 18px; padding: 16px 20px; border-radius: 16px; background: #fff; border: 1px dashed rgba(137,39,40,0.3); }
.gh-capx-alsolabel { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-primary-dark, #892728); }
.gh-home .gh-capx-alsolist { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.gh-capx-alsolist li { padding: 6px 12px; border-radius: 999px; background: var(--gh-gold-soft, #FBF1E6); font-size: 13px; font-weight: 600; color: #5a3a2e; }
@media (hover: hover) { .gh-capx-card:hover { transform: translateY(-5px); } .gh-capx-light:hover { box-shadow: 0 18px 38px rgba(74,21,23,0.12); } .gh-capx-card:hover .gh-capx-icon { transform: scale(1.08) rotate(-4deg); } }
@media (min-width: 600px) { .gh-home .gh-capx-points { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gh-capx-card { padding: 32px 30px; } }
@media (min-width: 1024px) { .gh-capx-grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); gap: 22px; } }
.gh-reveal-on .gh-capx-card[data-gh-reveal]:nth-child(2) { transition-delay: 0.1s; }
.gh-reveal-on .gh-capx-card.is-revealed { transition: opacity 0.55s ease, transform 0.3s ease, box-shadow 0.3s ease; transition-delay: 0s; }

/* ---------- FAQ v2 ---------- */
.gh-faqx { background: linear-gradient(180deg, #fff 0%, var(--gh-ivory, #FAF6F0) 100%); }
.gh-faqx-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.gh-home .gh-faqx-lead { margin: 0 0 22px; font-size: 15px; line-height: 1.7; color: var(--gh-muted, #6B5F5A); max-width: 460px; }
.gh-faqx-help { padding: 22px; border-radius: 18px; color: #fff; background: radial-gradient(360px 200px at 100% 0%, rgba(238,125,5,0.35), transparent 65%), linear-gradient(135deg, #892728 0%, #5c1a1b 100%); box-shadow: 0 16px 36px rgba(74,21,23,0.2); }
.gh-faqx-helptitle { font-size: 18px; font-weight: 800; margin-bottom: 4px; }
.gh-home .gh-faqx-helptext { margin: 0 0 16px; font-size: 14px; color: rgba(255,255,255,0.9); }
.gh-faqx-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.gh-home a.gh-faqx-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 10px; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform 0.2s ease, background 0.2s ease; }
.gh-home a.gh-faqx-btn-call { background: #fff; color: #892728; }
.gh-home a.gh-faqx-btn-wa { background: #25D366; color: #fff; }
.gh-home a.gh-faqx-btn:hover { transform: translateY(-2px); }
.gh-faqx-btn:focus-visible { outline: 3px solid #FFC27A; outline-offset: 2px; }
.gh-faqx-list { display: grid; gap: 10px; min-width: 0; }
.gh-faqx-item { background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 14px; overflow: hidden; transition: border-color 0.25s ease, box-shadow 0.25s ease; }
.gh-faqx-item.is-open { border-color: rgba(238,125,5,0.5); box-shadow: 0 10px 26px rgba(74,21,23,0.09); }
.gh-home .gh-faqx-q { margin: 0; font-size: inherit; }
.gh-faqx-btnq { width: 100%; display: flex; align-items: center; gap: 14px; min-height: 58px; padding: 12px 16px; border: 0; background: transparent; text-align: left; font: inherit; font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--gh-primary-dark, #892728); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.gh-faqx-btnq:focus-visible { outline: 3px solid #E9C27A; outline-offset: -3px; border-radius: 14px; }
.gh-faqx-n { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-gold); font-size: 12.5px; font-weight: 800; transition: background 0.25s ease, color 0.25s ease; }
.gh-faqx-item.is-open .gh-faqx-n { background: var(--gh-primary-dark, #892728); color: #fff; }
.gh-faqx-qtext { flex: 1 1 auto; min-width: 0; }
.gh-faqx-chev { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--gh-border, #E6DACB); color: var(--gh-primary-dark, #892728); transition: transform 0.3s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.gh-faqx-item.is-open .gh-faqx-chev { transform: rotate(180deg); background: var(--gh-gold); border-color: var(--gh-gold); color: #fff; }
.gh-faqx-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s ease; }
.gh-faqx-item.is-open .gh-faqx-a { grid-template-rows: 1fr; }
.gh-faqx-ainner { min-height: 0; overflow: hidden; }
.gh-home .gh-faqx-ainner p { margin: 0; padding: 0 18px 18px 64px; font-size: 14.5px; line-height: 1.75; color: #4a3d36; }
@media (max-width: 479px) { .gh-home .gh-faqx-ainner p { padding-left: 18px; } .gh-faqx-btnq { gap: 10px; padding: 12px; font-size: 14.5px; } }
@media (min-width: 1024px) { .gh-faqx-grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 48px; } }
@media (prefers-reduced-motion: reduce) {
    .gh-deptx-card, .gh-deptx-head::after, .gh-deptx-icon, .gh-cptx-card, .gh-cptx-card::before, .gh-capx-card, .gh-capx-icon, .gh-faqx-a, .gh-faqx-chev, .gh-faqx-btn, .gh-cptx-cta { transition: none !important; }
    .gh-deptx-card:hover, .gh-cptx-card:hover, .gh-capx-card:hover { transform: none; }
    .gh-cpt-panel.is-entering .gh-cptx-card { animation: none; }
}

/* ---------- DEPARTMENTS v2.1: cards share row lines (header / body / footer align across the row);
   footer stacks "Led by" above a full-width button so names never wrap awkwardly ---------- */
@supports (grid-template-rows: subgrid) {
    @media (min-width: 700px) {
        .gh-home .gh-deptx-grid > .gh-deptx-card { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
        .gh-deptx-body { align-self: start; }
        .gh-deptx-foot { align-self: start; }
    }
}
.gh-deptx-foot { flex-direction: column; align-items: stretch; gap: 12px; }
.gh-deptx-lead { flex-direction: row; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.gh-deptx-leadlabel::after { content: ":"; }
.gh-home a.gh-deptx-link { justify-content: center; width: 100%; }
/* department names (pass 61a): may wrap to two lines ("Gastrointestinal Surgery & Robotic Surgery"); all three heads stay level */
@media (min-width: 700px) { .gh-home .gh-deptx-name { white-space: normal; min-height: 2.6em; display: flex; align-items: flex-end; } }
@media (min-width: 700px) and (max-width: 1099px) { .gh-home .gh-deptx-name { font-size: 15px; } }
@media (min-width: 1100px) and (max-width: 1199px) { .gh-home .gh-deptx-name { font-size: 16px; } }
@media (min-width: 1200px) { .gh-home .gh-deptx-name { font-size: 17px; } }
@media (min-width: 700px) and (max-width: 767px) { .gh-home .gh-deptx-name { font-size: 16px; } }

/* ---------- APPOINTMENT v2.1: fields can never push wider than the card ----------
   Root cause: grid tracks defined as 1fr (= minmax(auto,1fr)) let a field with wide intrinsic
   content (the Choices.js doctor dropdown, the date picker) stretch the track beyond the card.
   minmax(0,1fr) + min-width:0 down the chain caps every field at the card width. */
.gh-apptx-grid > * { min-width: 0; }
.gh-apptx-formcard .fluentform fieldset { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 768px) { .gh-apptx-formcard .fluentform fieldset { grid-template-columns: minmax(0, 1fr); } }
@container (max-width: 520px) { .gh-apptx-formcard .fluentform fieldset { grid-template-columns: minmax(0, 1fr); } }
.gh-apptx-formcard .fluentform .ff-el-group, .gh-apptx-formcard .fluentform .ff-el-input--content, .gh-apptx-formcard .fluentform .ff-el-input--label { min-width: 0; max-width: 100%; }
.gh-apptx-formcard .fluentform .choices, .gh-apptx-formcard .fluentform .choices__inner, .gh-apptx-formcard .fluentform .choices__list--dropdown { min-width: 0; max-width: 100%; box-sizing: border-box; }
.gh-apptx-formcard .fluentform .choices__list--single .choices__item, .gh-apptx-formcard .fluentform .choices__list--dropdown .choices__item { white-space: normal; overflow-wrap: anywhere; }
.gh-apptx-formcard .fluentform .ff-el-form-control, .gh-apptx-formcard .fluentform select, .gh-apptx-formcard .fluentform input, .gh-apptx-formcard .fluentform textarea, .gh-apptx-formcard .fluentform .flatpickr-input { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.gh-apptx-formcard .fluentform .ff-btn-submit { max-width: 100%; }
.gh-apptx-formcard { overflow: hidden; }

/* ---------- CARE v1: "Find the Right Care" (homepage block + /care/ pages) ---------- */
.gh-care-desc { max-width: 760px; margin-left: auto; margin-right: auto; }
.gh-care-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin: 0; padding: 0; list-style: none; }
.gh-care-card { position: relative; min-width: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid #E6DACB; border-radius: 20px; padding: 22px 20px 20px; box-shadow: 0 2px 6px rgba(74,21,23,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }
.gh-care-head { position: relative; padding-right: 56px; margin-bottom: 14px; }
.gh-care-icon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: #FBF1E6; color: #892728; margin-bottom: 12px; transition: background 0.3s ease, color 0.3s ease; }
.gh-care-num { position: absolute; right: 0; top: 0; font-size: 34px; font-weight: 800; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(238,125,5,0.4); }
.gh-care-title { margin: 0 0 4px; font-size: 19px; line-height: 1.3; font-weight: 800; }
.gh-care-title a { color: #892728; text-decoration: none; }
.gh-care-title a:hover { color: var(--gh-deep); }
.gh-care-tagline { margin: 0; font-size: 13px; line-height: 1.5; color: #6B5F5A; }
.gh-care-items { flex: 1 1 auto; display: grid; gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.gh-care-items li a { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 9px; background: #FAF6F0; color: #3a302c; font-size: 13.5px; font-weight: 600; line-height: 1.35; text-decoration: none; transition: background 0.2s ease, color 0.2s ease; }
.gh-care-items li a::before { content: ""; flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: var(--gh-gold); }
.gh-care-items li a:hover { background: #892728; color: #fff; }
.gh-care-link { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; min-height: 42px; padding: 0 14px; border-radius: 10px; background: #FBF1E6; color: #892728; font-size: 13.5px; font-weight: 700; text-decoration: none; transition: background 0.2s ease, color 0.2s ease; }
.gh-care-link:hover { background: var(--gh-primary-dark); color: #fff; }
@media (hover: hover) { .gh-care-card:hover { transform: translateY(-5px); border-color: rgba(238,125,5,0.45); box-shadow: 0 18px 38px rgba(74,21,23,0.12); } .gh-care-card:hover .gh-care-icon { background: #892728; color: #fff; } }
.gh-care-foot { margin-top: 26px; padding: 20px 22px; border-radius: 16px; background: linear-gradient(135deg, #FFF6EA 0%, #FBEBD6 100%); border: 1px solid rgba(238,125,5,0.25); display: grid; gap: 10px; }
.gh-care-symptoms { margin: 0; font-size: 14px; line-height: 1.7; color: #4a3d36; }
.gh-care-note { margin: 0; font-size: 12.5px; color: #6B5F5A; }
.gh-care-note a { color: #892728; font-weight: 600; }
.gh-care-cta { justify-self: start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 10px; background: #892728; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
.gh-care-cta:hover { background: #6e1f20; color: #fff; }
@media (min-width: 640px) { .gh-care-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .gh-care-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } }
.gh-reveal-on .gh-care-card[data-gh-reveal]:nth-child(2) { transition-delay: 0.06s; } .gh-reveal-on .gh-care-card[data-gh-reveal]:nth-child(3) { transition-delay: 0.12s; } .gh-reveal-on .gh-care-card[data-gh-reveal]:nth-child(4) { transition-delay: 0.06s; } .gh-reveal-on .gh-care-card[data-gh-reveal]:nth-child(5) { transition-delay: 0.12s; } .gh-reveal-on .gh-care-card[data-gh-reveal]:nth-child(6) { transition-delay: 0.18s; }
.gh-reveal-on .gh-care-card.is-revealed { transition: opacity 0.55s ease, transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) { .gh-care-card, .gh-care-icon, .gh-care-items li a, .gh-care-link { transition: none; } .gh-care-card:hover { transform: none; } }
/* care pages */
.gh-carep { background: #FAF6F0; padding-bottom: 40px; }
.gh-carep .gh-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.gh-carep .gh-docp-card { background: #fff; border: 1px solid #E6DACB; border-radius: 18px; padding: 24px; box-shadow: 0 2px 8px rgba(74,21,23,0.05); }
.gh-carep .gh-docp-card + .gh-docp-card { margin-top: 20px; }
.gh-carep .gh-docp-h2 { margin: 0 0 14px; font-size: 20px; font-weight: 800; color: #892728; }
.gh-carep .gh-docp-note { margin: 14px 0 0; font-size: 13px; line-height: 1.6; color: #6B5F5A; }
.gh-carep .gh-docp-emergency { background: #FFF4F4; border-color: rgba(137,39,40,0.3); } .gh-carep .gh-docp-emergency p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.65; color: #3a302c; } .gh-carep .gh-docp-emnums a { color: #892728; font-weight: 700; text-decoration: none; }
.gh-carep-hero { color: #fff; padding: 30px 0; background: radial-gradient(600px 320px at 100% 0%, rgba(238,125,5,0.30), transparent 65%), linear-gradient(135deg, #892728 0%, #4f1617 100%); }
.gh-carep-hero-inner { display: flex; align-items: center; gap: 18px; }
.gh-carep-icon { flex: 0 0 auto; width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.28); }
.gh-carep-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #FFD9A8; margin-bottom: 6px; }
.gh-carep-title { margin: 0 0 6px; font-size: clamp(26px, 3.6vw, 38px); line-height: 1.15; font-weight: 800; color: #fff; }
.gh-carep-tagline { margin: 0; font-size: 15px; color: rgba(255,255,255,0.9); }
.gh-carep-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; padding-top: 24px; }
.gh-carep-intro { margin: 0; font-size: 15px; line-height: 1.75; color: #3a302c; }
.gh-carep-list { margin: 0; display: grid; gap: 10px; }
.gh-carep-item { padding: 12px 14px; border-radius: 12px; background: #FAF6F0; border: 1px solid #E6DACB; scroll-margin-top: 120px; }
.gh-carep-item dt { font-size: 15px; font-weight: 800; color: #892728; margin-bottom: 4px; }
.gh-carep-item dd { margin: 0; font-size: 14px; line-height: 1.6; color: #3a302c; }
.gh-carep-item:target { border-color: var(--gh-gold); box-shadow: 0 0 0 3px rgba(238,125,5,0.2); }
.gh-carep-docs { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.gh-carep-docs a { display: flex; align-items: center; gap: 12px; text-decoration: none; padding: 8px; border-radius: 12px; }
.gh-carep-docs a:hover { background: #FAF6F0; }
.gh-carep-docs img, .gh-carep-docs .gh-docp-peer-noimg { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; object-position: top; flex: 0 0 auto; display: grid; place-items: center; background: #FBF1E6; color: #892728; }
.gh-carep-docs strong { display: block; font-size: 14.5px; color: #892728; } .gh-carep-docs em { display: block; font-style: normal; font-size: 12.5px; color: #6B5F5A; line-height: 1.4; }
.gh-carep-others { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.gh-carep-others a { display: block; padding: 8px 12px; border-radius: 9px; background: #FAF6F0; color: #892728; font-weight: 700; font-size: 13.5px; text-decoration: none; }
.gh-carep-others a:hover { background: #892728; color: #fff; }
@media (min-width: 1024px) { .gh-carep-body { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; align-items: start; } .gh-carep-hero { padding: 40px 0; } }


/* ---------- STEP 3: care CTA colour, emergency strip v2, journey v2, decide v1, FAQ page, footer address ---------- */
.gh-home a.gh-care-cta { color: #fff; }
.gh-home a.gh-care-cta:hover { color: #fff; }
/* emergency strip v2 */
.gh-emg { background: linear-gradient(135deg, #892728 0%, #5c1a1b 100%); border: 0; color: #fff; }
.gh-emg-inner { max-width: var(--gh-max-width, 1200px); margin: 0 auto; padding: 18px 20px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: center; }
.gh-emg-lead { display: flex; gap: 14px; align-items: flex-start; }
.gh-emg-icon { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--gh-red); color: #fff; box-shadow: 0 6px 16px rgba(0,0,0,0.25); }
.gh-emg-title { font-size: 16px; font-weight: 800; margin-bottom: 4px; }
.gh-emg-text { margin: 0; font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,0.88); }
.gh-emg-links { display: flex; flex-wrap: wrap; gap: 10px; }
.gh-emg-links a { display: flex; flex-direction: column; min-width: 0; padding: 9px 14px; border-radius: 12px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.28); color: #fff; text-decoration: none; transition: background 0.2s ease, transform 0.2s ease; }
.gh-emg-links a:hover { background: #fff; color: #892728; transform: translateY(-2px); }
.gh-emg-linklabel { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
.gh-emg-num { font-size: 15px; font-weight: 800; white-space: nowrap; }
@media (min-width: 900px) { .gh-emg-inner { grid-template-columns: minmax(0, 1fr) auto; gap: 24px; } .gh-emg-links a { min-width: 200px; } }
/* journey v2 */
.gh-home .gh-journey-steps { list-style: none; margin: 34px 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; counter-reset: none; }
.gh-journey-step { position: relative; padding: 16px 16px 16px 60px; border-radius: 14px; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); }
.gh-journey-num { position: absolute; left: 14px; top: 14px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--gh-gold); color: #fff; font-size: 12.5px; font-weight: 800; }
.gh-home .gh-journey-title { margin: 0 0 4px; font-size: 15px; font-weight: 800; color: #fff; }
.gh-home .gh-journey-text { margin: 0; font-size: 13px; line-height: 1.55; color: rgba(255,255,255,0.75); }
@media (min-width: 640px) { .gh-home .gh-journey-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (min-width: 1024px) { .gh-home .gh-journey-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } .gh-journey-step { padding: 20px 18px 18px 66px; } .gh-journey-num { left: 16px; top: 18px; } }
/* decide v1 */
.gh-decide { background: #fff; }
.gh-decide-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.gh-home .gh-decide-list { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.gh-decide-list li { display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; border-radius: 12px; background: #FAF6F0; border: 1px solid #E6DACB; font-size: 14.5px; line-height: 1.5; color: #3a302c; }
.gh-decide-list .gh-ico { flex: 0 0 auto; margin-top: 2px; width: 22px; height: 22px; padding: 3px; box-sizing: border-box; border-radius: 50%; background: #892728; color: #fff; }
.gh-decide-card { padding: 26px 24px; border-radius: 20px; color: #fff; background: radial-gradient(420px 240px at 100% 0%, rgba(238,125,5,0.35), transparent 65%), linear-gradient(135deg, #892728 0%, #5c1a1b 100%); box-shadow: 0 18px 40px rgba(74,21,23,0.22); }
.gh-decide-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--gh-gold); font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 12px; }
.gh-home .gh-decide-h3 { margin: 0 0 10px; font-size: 22px; font-weight: 800; color: #fff; }
.gh-home .gh-decide-card p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.65; color: rgba(255,255,255,0.92); }
.gh-home .gh-decide-bring { margin: 0 0 18px; padding-left: 20px; font-size: 14px; line-height: 1.7; color: rgba(255,255,255,0.92); }
.gh-home a.gh-decide-cta { display: inline-flex; align-items: center; gap: 6px; min-height: 46px; padding: 0 18px; border-radius: 12px; background: #fff; color: #892728; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform 0.2s ease; }
.gh-home a.gh-decide-cta:hover { transform: translateY(-2px); color: #892728; }
@media (min-width: 1024px) { .gh-decide-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 40px; } }
/* homepage FAQ: view-all link */
.gh-home a.gh-faqx-all { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 18px; font-size: 14px; font-weight: 700; color: #892728; }
.gh-home a.gh-faqx-all:hover { color: var(--gh-deep); }
/* FAQ page: accordion styles copied from the homepage block (homepage.css does not load here) */
/* ---------- FAQ v2 ---------- */
.gh-faqx { background: linear-gradient(180deg, #fff 0%, var(--gh-ivory, #FAF6F0) 100%); }
.gh-faqx-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.gh-faqpage .gh-faqx-lead { margin: 0 0 22px; font-size: 15px; line-height: 1.7; color: var(--gh-muted, #6B5F5A); max-width: 460px; }
.gh-faqx-help { padding: 22px; border-radius: 18px; color: #fff; background: radial-gradient(360px 200px at 100% 0%, rgba(238,125,5,0.35), transparent 65%), linear-gradient(135deg, #892728 0%, #5c1a1b 100%); box-shadow: 0 16px 36px rgba(74,21,23,0.2); }
.gh-faqx-helptitle { font-size: 18px; font-weight: 800; margin-bottom: 4px; }
.gh-faqpage .gh-faqx-helptext { margin: 0 0 16px; font-size: 14px; color: rgba(255,255,255,0.9); }
.gh-faqx-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.gh-faqpage a.gh-faqx-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 10px; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform 0.2s ease, background 0.2s ease; }
.gh-faqpage a.gh-faqx-btn-call { background: #fff; color: #892728; }
.gh-faqpage a.gh-faqx-btn-wa { background: #25D366; color: #fff; }
.gh-faqpage a.gh-faqx-btn:hover { transform: translateY(-2px); }
.gh-faqx-btn:focus-visible { outline: 3px solid #FFC27A; outline-offset: 2px; }
.gh-faqx-list { display: grid; gap: 10px; min-width: 0; }
.gh-faqx-item { background: #fff; border: 1px solid var(--gh-border, #E6DACB); border-radius: 14px; overflow: hidden; transition: border-color 0.25s ease, box-shadow 0.25s ease; }
.gh-faqx-item.is-open { border-color: rgba(238,125,5,0.5); box-shadow: 0 10px 26px rgba(74,21,23,0.09); }
.gh-faqpage .gh-faqx-q { margin: 0; font-size: inherit; }
.gh-faqx-btnq { width: 100%; display: flex; align-items: center; gap: 14px; min-height: 58px; padding: 12px 16px; border: 0; background: transparent; text-align: left; font: inherit; font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--gh-primary-dark, #892728); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.gh-faqx-btnq:focus-visible { outline: 3px solid #E9C27A; outline-offset: -3px; border-radius: 14px; }
.gh-faqx-n { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--gh-gold-soft, #FBF1E6); color: var(--gh-gold); font-size: 12.5px; font-weight: 800; transition: background 0.25s ease, color 0.25s ease; }
.gh-faqx-item.is-open .gh-faqx-n { background: var(--gh-primary-dark, #892728); color: #fff; }
.gh-faqx-qtext { flex: 1 1 auto; min-width: 0; }
.gh-faqx-chev { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--gh-border, #E6DACB); color: var(--gh-primary-dark, #892728); transition: transform 0.3s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.gh-faqx-item.is-open .gh-faqx-chev { transform: rotate(180deg); background: var(--gh-gold); border-color: var(--gh-gold); color: #fff; }
.gh-faqx-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s ease; }
.gh-faqx-item.is-open .gh-faqx-a { grid-template-rows: 1fr; }
.gh-faqx-ainner { min-height: 0; overflow: hidden; }
.gh-faqpage .gh-faqx-ainner p { margin: 0; padding: 0 18px 18px 64px; font-size: 14.5px; line-height: 1.75; color: #4a3d36; }
@media (max-width: 479px) { .gh-faqpage .gh-faqx-ainner p { padding-left: 18px; } .gh-faqx-btnq { gap: 10px; padding: 12px; font-size: 14.5px; } }
@media (min-width: 1024px) { .gh-faqx-grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 48px; } }

.gh-faqpage .gh-faqx-list { display: grid; gap: 10px; max-width: 900px; margin: 0 auto; }
.gh-faqpage-help { max-width: 900px; margin: 26px auto 0; }

/* ---------- JOURNEY v3: timeline with scroll-driven progress ---------- */
.gh-home .gh-journey-steps { display: none; }
.gh-jt { position: relative; margin-top: 40px; }
.gh-jt-track { position: absolute; left: 22px; top: 0; bottom: 0; width: 3px; border-radius: 3px; background: rgba(255,255,255,0.14); overflow: hidden; }
.gh-jt-fill { position: absolute; left: 0; top: 0; width: 100%; height: var(--gh-jt-progress, 0%); background: linear-gradient(180deg, #E9C27A, #C98A2E); box-shadow: 0 0 14px rgba(238,125,5,0.7); transition: height 0.25s linear; }
.gh-home .gh-jt-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.gh-jt-step { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 14px; align-items: start; outline: none; }
.gh-jt-node { position: relative; width: 46px; height: 46px; display: grid; place-items: center; }
.gh-jt-ring { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,0.35); background: #5c1a1b; transition: border-color 0.35s ease, background 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease; }
.gh-jt-num { position: relative; z-index: 1; font-size: 13px; font-weight: 800; color: rgba(255,255,255,0.8); transition: color 0.35s ease; }
.gh-jt-card { padding: 14px 16px; border-radius: 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); transition: background 0.35s ease, border-color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease; }
.gh-home .gh-jt-title { margin: 0 0 4px; font-size: 15px; font-weight: 800; color: #fff; }
.gh-home .gh-jt-text { margin: 0; font-size: 13px; line-height: 1.55; color: rgba(255,255,255,0.72); }
.gh-jt-step.is-active .gh-jt-ring { border-color: var(--gh-orange); background: var(--gh-orange); transform: scale(1.08); box-shadow: 0 0 0 8px rgba(238,125,5,0.18); }
.gh-jt-step.is-active .gh-jt-num { color: #fff; }
.gh-jt-step.is-active .gh-jt-card { background: rgba(255,255,255,0.12); border-color: rgba(238,125,5,0.6); box-shadow: 0 14px 30px rgba(0,0,0,0.22); }
.gh-jt-step.is-done .gh-jt-ring { border-color: var(--gh-gold); background: #5c1a1b; }
.gh-jt-step.is-done .gh-jt-num { color: #FFC27A; }
.gh-jt-step:hover .gh-jt-card, .gh-jt-step:focus-visible .gh-jt-card { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.35); transform: translateY(-2px); }
.gh-jt-step:focus-visible .gh-jt-ring { box-shadow: 0 0 0 4px #FFC27A; }
@keyframes ghJtPulse { 0% { box-shadow: 0 0 0 0 rgba(238,125,5,0.55); } 70% { box-shadow: 0 0 0 14px rgba(238,125,5,0); } 100% { box-shadow: 0 0 0 0 rgba(238,125,5,0); } }
.gh-jt-step.is-active .gh-jt-ring::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; animation: ghJtPulse 1.8s ease-out infinite; }
@media (min-width: 1200px) {
    .gh-jt { padding-top: 26px; }
    .gh-jt-track { left: 5.5%; right: 5.5%; top: 22px; bottom: auto; width: auto; height: 3px; }
    .gh-jt-fill { width: var(--gh-jt-progress, 0%); height: 100%; background: linear-gradient(90deg, #E9C27A, #C98A2E); transition: width 0.25s linear; }
    .gh-home .gh-jt-steps { grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 10px; }
    .gh-jt-step { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; justify-items: center; text-align: center; gap: 14px; }
    .gh-home .gh-jt-steps { align-items: stretch; }
    .gh-jt-node { width: 46px; height: 46px; margin-top: -4px; }
    .gh-jt-card { width: 100%; height: 100%; padding: 14px 8px; min-height: 160px; box-sizing: border-box; }
    .gh-home .gh-jt-title { font-size: 13px; overflow-wrap: anywhere; hyphens: auto; }
    .gh-home .gh-jt-text { font-size: 11.5px; }
}
@media (min-width: 1400px) { .gh-jt-card { padding: 16px 10px; } .gh-home .gh-jt-title { font-size: 14px; } .gh-home .gh-jt-text { font-size: 12.5px; } }
@media (prefers-reduced-motion: reduce) { .gh-jt-fill, .gh-jt-ring, .gh-jt-card, .gh-jt-num { transition: none; } .gh-jt-step.is-active .gh-jt-ring::after { animation: none; } }
/* heading consistency on care group heroes */
.gh-carep-title-a { color: #fff; } .gh-carep-title-b { color: #FFC27A; }

/* ---------- JOURNEY v4: alternating timeline, light background (replaces v3) ---------- */
.gh-home .gh-journey-v4 .gh-jt-track { left: 27px; right: auto; top: 0; bottom: 0; width: 3px; height: auto; background: #e6dbd0; }
.gh-home .gh-journey-v4 .gh-jt-fill { width: 100%; height: var(--gh-jt-progress, 0%); background: linear-gradient(180deg, #E9C27A, #C98A2E); box-shadow: 0 0 12px rgba(238,125,5,0.45); transition: height 0.25s linear; }
.gh-home .gh-journey-v4 .gh-jt-steps { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: start; }
.gh-home .gh-journey-v4 .gh-jt-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); grid-template-rows: auto; gap: 16px; align-items: start; justify-items: stretch; text-align: left; }
.gh-home .gh-journey-v4 .gh-jt-node { width: 56px; height: 56px; margin: 0; }
.gh-home .gh-journey-v4 .gh-jt-ring { border: 2px solid #e6dbd0; background: #fff; box-shadow: 0 6px 16px rgba(74,21,23,0.08); }
.gh-home .gh-journey-v4 .gh-jt-ico { position: relative; z-index: 1; color: #892728; display: grid; place-items: center; transition: color 0.35s ease; }
.gh-home .gh-journey-v4 .gh-jt-card { height: auto; min-height: 0; padding: 18px 20px; border-radius: 16px; background: #fff; border: 1px solid #e9e0d6; box-shadow: 0 8px 24px rgba(74,21,23,0.06); }
.gh-home .gh-journey-v4 .gh-jt-num { position: static; display: inline-block; margin-bottom: 6px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-gold); }
.gh-home .gh-journey-v4 .gh-jt-title { font-size: 17px; color: #1a1a1a; overflow-wrap: normal; hyphens: manual; margin: 0 0 6px; }
.gh-home .gh-journey-v4 .gh-jt-text { font-size: 14px; line-height: 1.6; color: #5a4f4a; }
.gh-home .gh-journey-v4 .gh-jt-step.is-active .gh-jt-ring { border-color: var(--gh-orange); background: var(--gh-orange); transform: scale(1.06); box-shadow: 0 0 0 8px rgba(238,125,5,0.16); }
.gh-home .gh-journey-v4 .gh-jt-step.is-active .gh-jt-ico { color: #fff; }
.gh-home .gh-journey-v4 .gh-jt-step.is-active .gh-jt-card { background: #fff; border-color: rgba(238,125,5,0.55); box-shadow: 0 16px 34px rgba(74,21,23,0.14); }
.gh-home .gh-journey-v4 .gh-jt-step.is-done .gh-jt-ring { border-color: var(--gh-gold); background: #fff; }
.gh-home .gh-journey-v4 .gh-jt-step.is-done .gh-jt-ico { color: var(--gh-gold); }
.gh-home .gh-journey-v4 .gh-jt-step:hover .gh-jt-card, .gh-home .gh-journey-v4 .gh-jt-step:focus-visible .gh-jt-card { background: #fff; border-color: rgba(137,39,40,0.35); transform: translateY(-2px); }
@media (min-width: 900px) {
    .gh-home .gh-journey-v4 .gh-jt { padding-top: 0; }
    .gh-home .gh-journey-v4 .gh-jt-track { left: 50%; margin-left: -1.5px; }
    .gh-home .gh-journey-v4 .gh-jt-steps { gap: 0; }
    .gh-home .gh-journey-v4 .gh-jt-step { grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1fr); gap: 0; margin-top: -26px; }
    .gh-home .gh-journey-v4 .gh-jt-step:first-child { margin-top: 0; }
    .gh-home .gh-journey-v4 .gh-jt-node { grid-column: 2; grid-row: 1; justify-self: center; align-self: start; margin-top: 22px; }
    .gh-home .gh-journey-v4 .gh-jt-step.is-left .gh-jt-card { grid-column: 1; grid-row: 1; }
    .gh-home .gh-journey-v4 .gh-jt-step.is-right .gh-jt-card { grid-column: 3; grid-row: 1; }
    .gh-home .gh-journey-v4 .gh-jt-card { position: relative; padding: 22px 24px; }
    .gh-home .gh-journey-v4 .gh-jt-card::after { content: ""; position: absolute; top: 40px; width: 14px; height: 14px; background: #fff; border: 1px solid #e9e0d6; transform: rotate(45deg); }
    .gh-home .gh-journey-v4 .gh-jt-step.is-left .gh-jt-card::after { right: -8px; border-left: 0; border-bottom: 0; }
    .gh-home .gh-journey-v4 .gh-jt-step.is-right .gh-jt-card::after { left: -8px; border-right: 0; border-top: 0; }
    .gh-home .gh-journey-v4 .gh-jt-step.is-active .gh-jt-card::after { border-color: rgba(238,125,5,0.55); }
}
@media (min-width: 1200px) { .gh-home .gh-journey-v4 .gh-jt-step { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); margin-top: -34px; } .gh-home .gh-journey-v4 .gh-jt-title { font-size: 18px; } }

/* ---------- JOURNEY v5: 3x3 pathway cards on white (replaces v3/v4 markup; those rules stay inert) ---------- */
.gh-home .gh-journey-v5 { background: #fff; }
.gh-home .gh-pj-grid { list-style: none; margin: 36px auto 0; padding: 0; max-width: 1160px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.gh-pj-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e9e0d6; border-radius: 16px; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; }
.gh-pj-visual { aspect-ratio: 16 / 7; background: #FAF6F0; display: grid; place-items: center; border-bottom: 1px solid #f0e8de; }
.gh-pj-visual img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gh-pj-ico { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 16px; background: #fff; border: 1px solid #ecdfcf; color: #892728; transition: transform 0.2s ease; }
.gh-pj-body { padding: 16px 18px 20px; }
.gh-pj-num { display: inline-block; margin-bottom: 6px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-gold); }
.gh-home .gh-pj-title { margin: 0 0 6px; font-size: 17px; font-weight: 800; color: #1a1a1a; line-height: 1.3; }
.gh-home .gh-pj-text { margin: 0; font-size: 14px; line-height: 1.6; color: #5a4f4a; }
@media (hover: hover) {
    .gh-pj-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(74,21,23,0.10); border-color: rgba(137,39,40,0.35); }
    .gh-pj-card:hover .gh-pj-ico { transform: translateY(-2px); }
}
@media (min-width: 640px) { .gh-home .gh-pj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } .gh-pj-visual { aspect-ratio: 16 / 8; } }
@media (min-width: 1024px) { .gh-home .gh-pj-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } .gh-pj-body { padding: 18px 20px 22px; } }
@media (prefers-reduced-motion: reduce) { .gh-pj-card, .gh-pj-ico { transition: none; } }

/* ---------- HOME VIDEOS v1: educational videos section on the homepage (player + cards styled by the doctor-page component in style.css) ---------- */
.gh-home .gh-hvid { background: #fff; }
.gh-home .gh-hvid-card { max-width: 1100px; margin: 0 auto; padding: 18px; border-radius: 20px; background: #FAF6F0; border: 1px solid #e9e0d6; box-shadow: 0 10px 30px rgba(74,21,23,0.06); }
.gh-home .gh-hvid .gh-vid-stage { background: #1a0f0f; }
.gh-home .gh-hvid .gh-vid-player { max-height: min(72vh, 620px); }
.gh-home .gh-hvid .gh-vid-card { background: #fff; }
.gh-home .gh-hvid .gh-vid-card.is-active { background: #fff; }
.gh-home .gh-hvid .gh-vid-short { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gh-home .gh-hvid-more { margin: 18px 0 0; text-align: center; }
.gh-home .gh-hvid-more a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: #892728; text-decoration: none; }
.gh-home .gh-hvid-more a:hover { color: var(--gh-deep); }
@media (min-width: 700px) { .gh-home .gh-hvid-card { padding: 22px; } }

/* ---------- HOME VIDEOS v2: phone layout = compact list rows (small thumb + text), tap-to-play badge on the featured player ---------- */
.gh-home .gh-hvid-playbtn { position: absolute; left: 50%; top: 50%; z-index: 3; width: 72px; height: 72px; margin: -36px 0 0 -36px; border: 0; border-radius: 50%; background: rgba(238,125,5,0.96); color: #fff; display: grid; place-items: center; cursor: pointer; box-shadow: 0 8px 24px rgba(0,0,0,0.35); transition: transform 0.2s ease, background 0.2s ease; }
.gh-home .gh-hvid-playbtn svg { margin-left: 4px; }
.gh-home .gh-hvid-playbtn:hover { background: #892728; transform: scale(1.06); }
.gh-home .gh-hvid-playbtn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.gh-home .gh-vid-stage.is-playing .gh-hvid-playbtn { display: none; }
.gh-home .gh-hvid .gh-vid-nowtitle { font-size: 14.5px; }
@media (max-width: 699px) {
    .gh-home .gh-hvid-card { padding: 12px; border-radius: 16px; }
    .gh-home .gh-hvid .gh-vid-stage { border-radius: 12px; }
    .gh-home .gh-hvid .gh-vid-now { margin: 10px 0 12px; }
    .gh-home .gh-hvid .gh-vid-cards { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .gh-home .gh-hvid .gh-vid-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 12px; row-gap: 2px; align-items: center; padding: 8px; border-radius: 12px; border-width: 1.5px; }
    .gh-home .gh-hvid .gh-vid-thumb { grid-row: 1 / span 3; width: 112px; border-radius: 8px; }
    .gh-home .gh-hvid .gh-vid-play { width: 32px; height: 32px; }
    .gh-home .gh-hvid .gh-vid-play svg { width: 16px; height: 16px; }
    .gh-home .gh-hvid .gh-vid-num { left: 5px; top: 5px; padding: 1px 5px; font-size: 10px; }
    .gh-home .gh-hvid .gh-vid-topic { font-size: 10.5px; }
    .gh-home .gh-hvid .gh-vid-short { font-size: 13px; line-height: 1.3; -webkit-line-clamp: 2; }
    .gh-home .gh-hvid .gh-vid-state { margin-top: 0; font-size: 10.5px; }
    .gh-home .gh-hvid .gh-vid-card:hover { transform: none; }
    .gh-home .gh-hvid-playbtn { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
    .gh-home .gh-hvid .gh-vid-overlay-title { display: none; } /* the title is shown under the player as 'Now selected' */
}

/* ---------- EMERGENCY BAND LIGHT v1 (pass 68a): light warm cream band, red accent bar + red icon, deep-maroon text, orange "What to do",
   phone numbers as solid emergency-red cards. Orange = action, red = emergency, maroon = brand/footer. Content and numbers unchanged. */
aside.gh-emg { background: linear-gradient(180deg, #FDF8F2 0%, #FAF1E8 100%); color: var(--gh-deep, #5E1719); border: 0; border-top: 1px solid var(--gh-line, #E6DACB); border-bottom: 1px solid var(--gh-line, #E6DACB); }
aside.gh-emg .gh-emg-lead { padding-left: 16px; border-left: 5px solid var(--gh-red, #B3261E); }
aside.gh-emg .gh-emg-icon { background: var(--gh-red, #B3261E); color: #fff; box-shadow: 0 6px 16px rgba(179,38,30,0.25); }
aside.gh-emg .gh-emg-title { color: var(--gh-deep, #5E1719); }
aside.gh-emg .gh-emg-text { color: #4a3330; }
aside.gh-emg .gh-emg-more { color: var(--gh-orange, #EE7D05); }
aside.gh-emg .gh-emg-more:hover { color: var(--gh-gold-hover, #BE6404); text-decoration: underline; }
aside.gh-emg .gh-emg-links a { background: var(--gh-red, #B3261E); border: 1px solid var(--gh-red, #B3261E); color: #fff; box-shadow: 0 6px 16px rgba(179,38,30,0.22); }
aside.gh-emg .gh-emg-links a:hover { background: #961F18; border-color: #961F18; color: #fff; transform: translateY(-2px); }
aside.gh-emg .gh-emg-linklabel { color: #FFD3CF; opacity: 1; }
aside.gh-emg .gh-emg-num { color: #fff; font-size: 16px; }

/* ---------- EMERGENCY BAND MOBILE v1 (pass 69b): below 900px the red accent bar spans the whole band (text + phone cards), the phone cards
   fill the width (two equal columns from 480px, one column below) instead of hanging left at content width. Desktop unchanged. */
@media (max-width: 899px) {
  aside.gh-emg .gh-emg-inner { border-left: 5px solid var(--gh-red, #B3261E); padding-left: 16px; margin: 0 20px; }
  aside.gh-emg .gh-emg-lead { padding-left: 0; border-left: 0; }
  aside.gh-emg .gh-emg-links { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
  aside.gh-emg .gh-emg-links a { width: 100%; min-width: 0; }
  aside.gh-emg .gh-emg-num { white-space: normal; }
}
@media (max-width: 479px) { aside.gh-emg .gh-emg-links { grid-template-columns: minmax(0, 1fr); } }

/* pass 83: the hovered team portrait grows by 22%; the end portraits of the top row reached past the media box and were cut off. The team
   slide media no longer clips (inactive slides are visibility:hidden, and the hero itself still clips at its own edges). */
.gh-hc-slide.gh-hc-type-doctors .gh-hc-media { overflow: visible; }

/* pass 84: all eight team portraits the same size (the top four used to be larger than the bottom four) - every doctor gets the former top-row size */
@media (min-width: 900px) { .gh-hc-type-doctors .gh-hc-doc { width: 118px; } .gh-hc-type-doctors .gh-hc-doc .gh-hc-doc-photo { width: 106px; height: 106px; } }
@media (min-width: 900px) and (max-width: 1099px) { .gh-hc-type-doctors .gh-hc-doc { width: 108px; } .gh-hc-type-doctors .gh-hc-doc .gh-hc-doc-photo { width: 96px; height: 96px; } }
@media (min-width: 1200px) { .gh-hc-type-doctors .gh-hc-doc { width: 150px; } .gh-hc-type-doctors .gh-hc-doc .gh-hc-doc-photo { width: 138px; height: 138px; } }
@media (min-width: 900px) { .gh-hc-type-doctors .gh-hc-team { max-width: 520px; margin-left: auto; margin-right: auto; } }
@media (min-width: 900px) and (max-width: 1099px) { .gh-hc-type-doctors .gh-hc-team { max-width: 460px; } }
@media (min-width: 1200px) { .gh-hc-type-doctors .gh-hc-team { max-width: 660px; } }

/* ---------- HOME CARDS v1 (pass 92): Departments + Find the Right Care as photo cards (same style as the /care/ hub), technology icon tiles ---------- */
.gh-deptx2-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.gh-deptx2-card { margin: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--gh-line, #E6DACB); border-radius: 22px; overflow: hidden; box-shadow: 0 14px 34px rgba(74,21,23,0.08); transition: transform .2s ease, box-shadow .2s ease; }
.gh-deptx2-card:hover { transform: translateY(-3px); box-shadow: 0 22px 44px rgba(74,21,23,0.13); }
.gh-deptx2-img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(135deg, #FDFAF6 0%, #F3E9DD 100%); }
.gh-deptx2-imgel { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.gh-deptx2-card:hover .gh-deptx2-imgel { transform: scale(1.04); }
.gh-deptx2-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(42,20,18,0) 45%, rgba(42,20,18,0.55) 100%); }
.gh-deptx2-num { position: absolute; z-index: 1; top: 12px; left: 12px; min-width: 38px; height: 38px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: rgba(255,255,255,0.94); color: #892728; font-size: 15px; font-weight: 800; }
.gh-deptx2-count { position: absolute; z-index: 1; left: 12px; bottom: 12px; padding: 6px 12px; border-radius: 999px; background: #892728; color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: 0.01em; }
.gh-deptx2-body { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; }
.gh-deptx2-head { display: flex; align-items: center; gap: 12px; }
.gh-deptx2-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: #FBF1E6; color: #892728; }
.gh-deptx2-name { margin: 0; font-size: 19px; line-height: 1.3; font-weight: 800; }
.gh-deptx2-name a { color: #892728; text-decoration: none; }
.gh-deptx2-text { margin: 0; font-size: 14.5px; line-height: 1.6; color: #4a3f3b; }
.gh-deptx2-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.gh-deptx2-chips li { padding: 5px 11px; border-radius: 999px; background: #FAF6F0; border: 1px solid #EADFD2; color: #2A2220; font-size: 13px; font-weight: 600; }
.gh-deptx2-chips .gh-deptx2-chip-all { padding: 0; background: none; border: 0; }
.gh-deptx2-chip-all a { display: inline-block; padding: 5px 11px; border-radius: 999px; background: #fff; border: 1px dashed #EE7D05; color: #892728; font-size: 13px; font-weight: 700; text-decoration: none; }
.gh-deptx2-foot { margin-top: auto; padding-top: 14px; border-top: 1px solid #F0E4D6; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.gh-deptx2-lead { display: flex; align-items: center; gap: 10px; }
.gh-deptx2-lead > span { display: flex; flex-direction: column; }
.gh-deptx2-leadphoto { flex: none; display: block; width: 48px; height: 48px; }
.gh-deptx2-leadphoto .gh-docphoto, .gh-deptx2-leadphoto .gh-docmono { box-sizing: border-box; width: 48px; height: 48px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 1px #EADFD2, 0 4px 10px rgba(74,21,23,0.14); }
.gh-deptx2-lead .gh-deptx-leadlabel { font-size: 11.5px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #8a7d77; }
.gh-deptx2-lead .gh-deptx-leadname { font-size: 15px; font-weight: 800; color: #2A2220; }
.gh-care2-grid .gh-careidx-count { text-transform: none; }
.gh-facility-card-tile { height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: radial-gradient(260px 160px at 85% 0%, rgba(255,255,255,0.16), transparent 60%), linear-gradient(150deg, #9b2f30 0%, #6b1f21 55%, #C85A12 130%); color: #fff; }
.gh-facility-card-tileico { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: 50%; background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.3); }
.gh-facility-card-tileico .gh-ico { color: #fff; }
.gh-facility-card-tilecap { padding: 0 14px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #F3D08F; text-align: center; }
@media (min-width: 760px) { .gh-deptx2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .gh-deptx2-grid, .gh-care2-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gh-deptx2-foot .screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ===== DEPT GROUPS (pass 103): two departments - Gastroenterology (medical + surgical unit) and Vascular & Endovascular Surgery ===== */
.gh-deptg-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.gh-deptg { min-width: 0; display: flex; flex-direction: column; gap: 16px; padding: 18px; border-radius: 26px; background: rgba(255,255,255,0.55); border: 1px solid var(--gh-line, #E6DACB); }
.gh-deptg-head { display: flex; align-items: center; gap: 14px; padding: 4px 4px 2px; }
.gh-deptg-ico { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 15px; background: linear-gradient(135deg, #892728 0%, #5E1719 100%); color: #fff; box-shadow: 0 8px 18px rgba(94,23,25,0.22); }
.gh-deptg-headtext { min-width: 0; }
.gh-deptg-kicker { font-size: 11.5px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gh-gold, #C98A2E); }
.gh-home .gh-deptg-title { margin: 2px 0 2px; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.25; font-weight: 800; color: #2A2220; }
.gh-home .gh-deptg-team { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.45; color: #6B5F5A; }
.gh-deptg .gh-deptg-grid { gap: 18px; }
.gh-deptx2-unit { align-self: flex-start; padding: 4px 10px; border-radius: 999px; background: #FBF1E6; border: 1px solid rgba(238,125,5,0.25); font-size: 11.5px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #892728; }
.gh-deptx2-name { font-size: 19px; line-height: 1.3; font-weight: 800; margin: 0; }
.gh-deptx2-team.gh-hub-avs { margin: 0; gap: 6px 10px; }
.gh-deptx2-team.gh-hub-avs a { width: 40px; height: 40px; }
.gh-deptx2-team .gh-hub-avs-label { font-size: 13px; }
@media (min-width: 760px) {
	.gh-deptg-gastroenterology .gh-deptg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gh-deptg-vascular .gh-deptg-grid { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
}
@media (min-width: 1100px) {
	.gh-deptg-wrap { grid-template-columns: minmax(0, 2.05fr) minmax(0, 1fr); gap: 22px; align-items: stretch; }
	.gh-deptg-gastroenterology .gh-deptg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gh-deptg-vascular .gh-deptg-grid { grid-template-columns: minmax(0, 1fr); max-width: none; flex: 1; }
	.gh-deptg .gh-deptg-grid > .gh-deptx2-card { height: 100%; }
}
@media (max-width: 759px) { .gh-deptg { padding: 12px; border-radius: 20px; } .gh-deptg-ico { width: 46px; height: 46px; } }

/* ===== CANCER CARE (pass 103): homepage block -> /cancer-care/ ===== */
.gh-cancerx { background: linear-gradient(180deg, #fff 0%, #FAF6F0 100%); }
.gh-cancerx-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: center; }
.gh-home .gh-cancerx-text .gh-section-title { text-align: left; margin-bottom: 12px; }
.gh-cancerx-text .gh-section-label { justify-content: flex-start; }
.gh-home .gh-cancerx-lead { margin: 0 0 18px; font-size: 15.5px; line-height: 1.7; color: #4a3f3b; max-width: 620px; }
.gh-home .gh-cancerx-organs { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.gh-cancerx-organs li { padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid #EADFD2; font-size: 13px; font-weight: 700; color: #5E1719; }
.gh-cancerx-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.gh-cancerx .gh-hub-btn-outline { border: 2px solid #892728; color: #892728; background: #fff; }
.gh-cancerx .gh-hub-btn-outline:hover { background: #892728; color: #fff; }
.gh-home .gh-cancerx-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.gh-cancerx-tile { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--gh-line, #E6DACB); border-top: 3px solid #EE7D05; box-shadow: 0 10px 26px rgba(74,21,23,0.06); }
.gh-cancerx-ico { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; background: #FBF1E6; color: #892728; }
.gh-home .gh-cancerx-tile h3 { margin: 0; font-size: 16.5px; font-weight: 800; color: #892728; line-height: 1.3; }
.gh-home .gh-cancerx-tile p { margin: 0; font-size: 14px; line-height: 1.6; color: #4a3f3b; }
@media (min-width: 640px) { .gh-home .gh-cancerx-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .gh-cancerx-grid { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: 48px; } }

/* ===== MOTTO (pass 103) ===== */
.gh-motto { margin: 0 0 22px; font-size: 14px; font-weight: 800; letter-spacing: 0.16em; color: #892728; display: inline-flex; align-items: center; gap: 10px; }
.gh-motto::before { content: ""; width: 28px; height: 2px; background: #EE7D05; flex: none; }
/* team slide: initials badge for a doctor without a portrait */
.gh-hc-doc-mono { display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, #8A3A33 0%, #5E1719 100%); color: #fff; font-size: 26px; font-weight: 800; letter-spacing: 0.04em; }

/* ===== PASS 103a ===== */
/* Our Departments: the doctors' sentence is the heading - a little smaller so it sits on two lines */
.gh-home .gh-deptx-title { max-width: 980px; margin-left: auto; margin-right: auto; font-size: clamp(22px, 2.6vw, 34px); line-height: 1.25; }
/* About (homepage): neutral soft sand, no orange tint */
.gh-about { background: linear-gradient(180deg, #F8F4EE 0%, #F2EBE2 100%); }
/* Department groups: both headings share one row height so the cards start level; icon aligned to the title */
.gh-deptg-head { align-items: flex-start; }
.gh-deptg-ico { margin-top: 4px; }
@media (min-width: 1100px) {
	.gh-deptg-wrap { grid-template-rows: auto 1fr; }
	.gh-deptg { display: grid; grid-template-rows: subgrid; grid-row: span 2; gap: 16px; }
	.gh-deptg-vascular .gh-deptg-title { font-size: 22px; }
}
/* 103d: the sand background runs edge to edge - an old style.css rule (.gh-about max-width 1200px) boxed the section in */
.gh-home .gh-about { max-width: none; margin-left: 0; margin-right: 0; }
/* 105e: phones and small tablets - the doctors slide (slide 4) listed its 8 doctors two to a row, which made it about 400px taller than
   the other slides. All slides share the tallest slide's height, so slides 1-3 showed a large empty maroon block under their buttons.
   The doctors now sit four to a row with smaller photos, so slide 4 is no taller than the others. */
@media (max-width: 899px) {
	.gh-hc-type-doctors .gh-hc-media { padding: 22px 12px 4px; }
	.gh-hc-type-doctors .gh-hc-team { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 6px; width: 100%; max-width: 440px; margin: 0 auto; }
	.gh-hc-type-doctors .gh-hc-doc, .gh-hc-type-doctors .gh-hc-doc:nth-child(-n+4) { width: auto; min-width: 0; }
	.gh-hc-type-doctors .gh-hc-doc .gh-hc-doc-photo, .gh-hc-type-doctors .gh-hc-doc:nth-child(-n+4) .gh-hc-doc-photo { width: 62px; height: 62px; border-width: 2px; }
	.gh-hc-type-doctors .gh-hc-doc-mono { font-size: 18px; }
	.gh-hc-type-doctors .gh-hc-doc-name { margin-top: 6px; font-size: 11px; line-height: 1.25; overflow-wrap: anywhere; }
	.gh-hc-type-doctors .gh-hc-doc.is-zoomed .gh-hc-doc-photo { transform: translateY(-4px) scale(1.12); }
}
@media (min-width: 600px) and (max-width: 899px) {
	.gh-hc-type-doctors .gh-hc-doc .gh-hc-doc-photo, .gh-hc-type-doctors .gh-hc-doc:nth-child(-n+4) .gh-hc-doc-photo { width: 88px; height: 88px; border-width: 3px; }
	.gh-hc-type-doctors .gh-hc-team { max-width: 560px; gap: 16px 10px; }
	.gh-hc-type-doctors .gh-hc-doc-name { font-size: 12.5px; }
}
@media (max-width: 899px) {
	/* any spare height on the doctors slide goes around the photos, not under the buttons */
	.gh-hc-type-doctors .gh-hc-media { flex: 1 1 auto; align-items: center; }
	.gh-hc-type-doctors .gh-hc-panel { flex: 0 0 auto; }
}
@media (max-width: 899px) {
	/* 105f: the same for every slide - the slides share one height, so a slide with less text (slide 1) gives its spare height to its
	   photo instead of leaving an empty band between its buttons and the slide arrows */
	.gh-hc-media { flex: 1 1 auto; }
	.gh-hc-panel { flex: 0 0 auto; }
	.gh-hc-media .gh-hc-img { height: 100%; }
}
@media (max-width: 899px) {
	/* 105g: on phones the doctors slide was maroon from top to bottom, unlike slides 1-3 (light photo on top, maroon text below).
	   The doctors now sit on a light sand panel in the same place as the photo on the other slides. */
	.gh-hc-type-doctors .gh-hc-media { background: linear-gradient(180deg, #FFF8EF 0%, #F6E6D3 100%); border-bottom: 1px solid rgba(137,39,40,0.12); }
	.gh-hc-type-doctors .gh-hc-doc-photo { border-color: #fff; box-shadow: 0 6px 16px rgba(94,23,25,0.22); }
	.gh-hc-type-doctors .gh-hc-doc-name { color: #5E1719; text-shadow: none; }
	.gh-hc-type-doctors .gh-hc-doc.is-zoomed .gh-hc-doc-name, .gh-hc-type-doctors .gh-hc-doc:focus-visible .gh-hc-doc-name { color: #892728; text-decoration-color: #C98A2E; }
	.gh-hc-type-doctors .gh-hc-doc.is-zoomed .gh-hc-doc-photo { border-color: #C98A2E; }
	.gh-hc-type-doctors .gh-hc-doc:focus-visible { outline-color: #892728; }
}
/* ===== PASS 106: Centres of Excellence cards + cancer steps (doctor's tracker) ===== */
.gh-deptx2-imglink { position: absolute; inset: 0; display: block; }
.gh-deptx2-links { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0 7px; padding: 7px 14px; max-width: calc(100% - 24px); }
.gh-deptx2-links a { color: #fff; text-decoration: none; }
.gh-deptx2-links a:hover, .gh-deptx2-links a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.gh-deptx2-links a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 4px; }
.gh-deptx2-foot { justify-content: flex-start; } /* 106b: button on the left, as before Pass 106 */
.gh-cancerx-tile-link { position: relative; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.gh-cancerx-tile-link h3 a { color: inherit; text-decoration: none; }
.gh-cancerx-tile-link h3 a::after { content: ""; position: absolute; inset: 0; border-radius: 18px; }
.gh-cancerx-tile-link:hover { transform: translateY(-3px); box-shadow: 0 16px 32px rgba(74,21,23,0.12); border-color: #E3C7A8; }
.gh-cancerx-tile-link:hover h3 a { text-decoration: underline; text-underline-offset: 3px; }
.gh-cancerx-tile-link:focus-within { outline: 3px solid #892728; outline-offset: 2px; }
.gh-cancerx-step { position: absolute; top: 16px; right: 18px; font-size: 30px; font-weight: 800; line-height: 1; color: #F3E2CE; }
@media (prefers-reduced-motion: reduce) { .gh-cancerx-tile-link { transition: none; } .gh-cancerx-tile-link:hover { transform: none; } }
/* 106: the doctor's tile labels are longer ("Medical Departments", "Advanced Technology") - let them wrap to two lines instead of being cut */
.gh-qa-label { white-space: normal !important; overflow-wrap: normal; word-break: normal; hyphens: none; }
@media (min-width: 1024px) { .gh-qa-label { padding-right: 4px; } }
/* 106a: the three Centres of Excellence cards line up row by row - unit, title, text, "What we treat", list, "See all" link and button.
   Root cause of the misalignment: each card stacked its parts freely, the Vascular card has no unit label, and the lists differ in
   length, so titles, labels and links sat at different heights. Now the cards share one set of rows (CSS subgrid) across both groups. */
.gh-deptx2-all { margin: 0; }
@media (min-width: 760px) {
	.gh-deptg .gh-deptg-grid { grid-template-rows: repeat(8, auto); row-gap: 0; }
	.gh-deptg .gh-deptg-grid > .gh-deptx2-card { display: grid; grid-template-rows: subgrid; grid-row: span 8; row-gap: 0; }
	.gh-deptx2-card > .gh-deptx2-img { grid-row: 1; align-self: stretch; height: auto; width: auto; max-width: 100%; min-width: 0; } /* the narrower Vascular photo fills the shared photo row too */
	.gh-deptx2-card > .gh-deptx2-body { grid-row: 2 / span 7; display: grid; grid-template-rows: subgrid; row-gap: 10px; }
	.gh-deptx2-body > .gh-deptx2-unit { grid-row: 1; align-self: start; justify-self: start; }
	.gh-deptx2-body > .gh-deptx2-head { grid-row: 2; align-self: start; }
	.gh-deptx2-body > .gh-deptx2-text { grid-row: 3; }
	.gh-deptx2-body > .gh-deptx2-text-top { grid-row: 1 / span 3; align-self: start; } /* pass 114: card without its own title - the text starts at the top, the lists below stay level */
	.gh-deptx2-body > .gh-deptx-listlabel { grid-row: 4; margin-bottom: 0; align-self: end; }
	.gh-deptx2-body > .gh-deptx2-chips { grid-row: 5; align-content: start; }
	.gh-deptx2-body > .gh-deptx2-all { grid-row: 6; align-self: start; }
	.gh-deptx2-body > .gh-deptx2-foot { grid-row: 7; margin-top: 0; align-self: end; }
}
@supports (grid-template-rows: subgrid) {
	@media (min-width: 1100px) {
		.gh-deptg-wrap { grid-template-rows: auto repeat(8, auto); row-gap: 0; }
		.gh-deptg { grid-row: span 9; row-gap: 0; }
		.gh-deptg-head { grid-row: 1; margin-bottom: 16px; }
		.gh-deptg .gh-deptg-grid { grid-row: 2 / span 8; grid-template-rows: subgrid; }
		.gh-deptg .gh-deptg-grid > .gh-deptx2-card { height: auto; }
	}
}
/* 107: one emergency number - the footer link spans the row, the Emergency page shows two cards */
aside.gh-emg .gh-emg-links { grid-template-columns: minmax(0, 1fr) !important; }
/* pass 112: quick tiles - icon and label centred in each tile (the arrow stays in the top-right corner) */
.gh-qa-card { align-items: center; justify-content: center; text-align: center; padding-left: 22px; padding-right: 22px; }
.gh-qa-label { text-align: center; }
@media (min-width: 1024px) { .gh-qa-label { padding-right: 0; } }
@media (max-width: 599px) {
    .gh-qa-item:last-child:nth-child(odd) .gh-qa-card { justify-content: center; padding-left: 40px; }
}

/* PASS 134: homepage intro line under the H1 strip */
.gh-hc-strip .gh-hc-strip-lead { margin: 0; font-size: 13.5px; line-height: 1.5; font-weight: 500; color: var(--gh-text, #3a2f2b); max-width: 62em; }