/* =====================================================================
   TABLET RESPONSIVE FIX
   Purpose: Make "tablet mode" (roughly 576px - 1024px viewport width,
   e.g. iPad portrait/landscape, Android tablets) render using the SAME
   layout as mobile mode, instead of the old in-between tablet design.
   This file is auto-generated by combining the existing mobile-only
   media query rules from style.css / client-mobile-final.css / donate.css
   and re-applying them across the tablet width range. It is loaded LAST
   so it wins the cascade. Nothing else in the site was changed.
   ===================================================================== */

@media (min-width: 576px) and (max-width: 1024px) {

  .hero-title {white-space: normal !important;}

  .hero-title .hl {white-space: normal !important;}


  .zigzag-timeline {padding-left: 30px !important;}

  .zigzag-line {left: 10px !important; transform: none !important;}

  .zigzag-item,
  .zigzag-item.right {width: 100% !important; left: 0 !important; padding-left: 30px !important; padding-right: 0 !important; justify-content: flex-start !important; text-align: left !important;}

  .zigzag-item.left .zigzag-dot,
  .zigzag-item.right .zigzag-dot {left: 1px !important; right: auto !important;}

  .zigzag-content {max-width: 100% !important;}


  .testimonial-viewport {height: 340px !important;}

  .testimonial-card-wrap {width: 250px !important;}

  .test-nav {display: none !important;}


  .contact-info-row {padding: 20px !important;}

  .map-embed {height: 300px !important;}

  .map-caption {flex-direction: column !important; align-items: flex-start !important; text-align: left !important;}


  .brand-text strong {font-size: 1.35rem !important;}

  .logo-mark {width: 44px !important; height: 44px !important;}

  .hero-title {font-size: 3.1rem !important;}

  .identity-board {padding: 22px !important; border-radius: 24px !important;}

  .identity-board h2 {font-size: 3.1rem !important;}

  .doctor-grid {grid-template-columns: 1fr !important;}

  .doctor-image {height: 330px !important;}

  .section-title {font-size: 2.15rem !important;}

  .impact-card {padding: 22px !important;}

  .impact-card b {font-size: 2.25rem !important;}

  .marquee-text {font-size: 3.4rem !important;}

  .section-space {padding: 32px 0 !important;}

  .testimonial-card {width: 270px !important;}


  .hero-stat-strip {gap: 16px !important; padding: 16px 20px !important; border-radius: 24px !important;}

  .hero-stat-divider {display: none !important;}


  .doctor-grid {grid-template-columns: 1fr !important;}

  .doctor-image {height: 310px !important;}



  .zigzag-item.left.drop-in,
  .zigzag-item.right.drop-in {transform: translateX(-40px) !important;}


  .activity-nav {width: 38px !important; height: 38px !important;}


  .news-card-item {flex: 0 0 min(88vw, 380px) !important; width: min(88vw, 380px) !important; max-width: min(88vw, 380px) !important;}

  #news .news-slider {padding-bottom: 8px !important;}

  #news .news-viewport {overflow: visible !important;}

  #news .news-track {display: flex !important; gap: 14px !important; padding: 4px 2px 6px !important; will-change: transform !important;}

  #news .news-card-item {flex: 0 0 min(88vw, 380px) !important; width: min(88vw, 380px) !important; max-width: min(88vw, 380px) !important; scroll-snap-align: center !important;}

  #news .social-news-card {min-height: 470px !important; border-radius: 16px !important;}


  .social-stick {right: 12px !important; bottom: 76px !important; gap: 10px !important;}

  .social-stick-btn {width: 44px !important; height: 44px !important; font-size: 1.05rem !important; box-shadow: 0 10px 22px rgba(8, 42, 79, .22) !important;}

  .back-to-top {right: 12px !important; bottom: 12px !important; width: 44px !important; height: 44px !important;}


  .hero-title {font-size: 2.5rem !important;}

  .hero-subtitle {font-size: 1rem !important;}

  .about-text-col {padding: 24px !important; text-align: left !important;}

  .about-media img {height: 280px !important;}

  .activity-viewport {min-height: 940px !important;}

  .news-cover,
  .news-img-rotator,
  .activity-feature-card img {height: 220px !important;}

  .section-space {padding: 32px 0 !important;}


  .hero-v2 .row {padding-top: 42px !important;}

  .hero-copy {padding-inline: 18px !important;}

  .hero-v2 .hero-kicker {font-size: .62rem !important; padding: 8px 12px !important;}

  .hero-v2 .hero-title {font-size: clamp(2.35rem, 14vw, 3.25rem) !important; line-height: 1.05 !important; margin-top: 22px !important;}

  .hero-v2 .hero-title .hl {white-space: normal !important;}

  .hero-v2 .hero-subtitle {font-size: .98rem !important; line-height: 1.65 !important;}

  .hero-actions {gap: 12px !important; margin-top: 24px !important;}

  .hero-v2 .hero-actions .btn {width: 100% !important; min-height: 52px !important; font-size: 1rem !important;}

  .hero-v2 .hero-key-row span {width: 100% !important; justify-content: center !important; padding: 12px 16px !important;}

  .hero-doctor-img {max-height: 390px !important;}

  .hero-doctor-wrap {width: 94vw !important;}

  .hero-v2:before {font-size: 40vw !important; bottom: -3vw !important; opacity: .75 !important;}


  .hero-top-gap {display: none !important;}


  html {scroll-padding-top: 76px !important;}

  .navbar {min-height: 68px !important;}

  .navbar-brand {min-width: 0 !important; gap: 0px !important;}

  .logo-mark {width: 44px !important; height: 44px !important; border-radius: 14px !important;}

  .brand-text strong {font-size: 1.35rem !important;}

  .brand-text small {font-size: .58rem !important; max-width: 190px !important; white-space: normal !important; line-height: 1.15 !important;}

  .hero-v2 .row {padding-top: 38px !important;}

  .hero-copy {padding-inline: 16px !important;}

  .hero-v2 .hero-kicker {font-size: .58rem !important; padding: 7px 10px !important; letter-spacing: .04em !important;}

  .hero-v2 .hero-title {font-size: clamp(2.05rem, 10.8vw, 2.9rem) !important; line-height: 1.1 !important; white-space: normal !important; margin-top: 20px !important;}

  .hero-v2 .hero-title .hl {white-space: nowrap !important;}

  .hero-v2 .hero-subtitle {font-size: .96rem !important; line-height: 1.62 !important;}

  .hero-actions {display: grid !important; grid-template-columns: 1fr !important; gap: 11px !important; margin-top: 22px !important;}

  .hero-v2 .hero-actions .btn {width: 100% !important; min-height: 50px !important; font-size: .98rem !important;}

  .hero-v2 .hero-key-row {display: grid !important; grid-template-columns: 1fr !important; width: 100% !important;}

  .hero-v2 .hero-key-row span {width: 100% !important; justify-content: center !important; font-size: .94rem !important; padding: 11px 14px !important;}

  .hero-doctor-wrap {width: 92vw !important;}

  .hero-doctor-img {max-height: 360px !important; max-width: 100% !important;}

  .hero-v2:before {font-size: 42vw !important; bottom: -4vw !important;}

  .section-space {padding: 32px 0 !important;}

  .contact-heading {text-align: left !important;}


  #activities .section-heading {padding-right: 8px !important;}

  #activities .activity-slider,
  #activities .activity-dots {display: none !important;}

  .activity-mobile-strip {display: flex !important; gap: 16px !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; -webkit-overflow-scrolling: touch !important; padding: 8px 6px 22px !important; margin-top: 24px !important; scrollbar-width: none !important;}

  .activity-mobile-strip::-webkit-scrollbar {display: none !important;}

  .activity-mobile-card {flex: 0 0 84% !important; scroll-snap-align: start !important; background: #fff !important; border: 1px solid var(--line) !important; border-radius: 24px !important; box-shadow: var(--shadow) !important; overflow: hidden !important; min-height: 405px !important;}

  .activity-mobile-card img {width: 100% !important; height: 205px !important; object-fit: cover !important; display: block !important;}

  .activity-mobile-card span {display: inline-block !important; margin: 18px 20px 6px !important; color: var(--red) !important; font-weight: 800 !important; font-size: .72rem !important; text-transform: uppercase !important; letter-spacing: .08em !important;}

  .activity-mobile-card h5 {margin: 0 20px 10px !important; color: var(--navy) !important; font-weight: 800 !important; line-height: 1.35 !important; font-size: 1.02rem !important;}

  .activity-mobile-card p {margin: 0 20px 22px !important; color: var(--muted) !important; line-height: 1.65 !important; font-size: .9rem !important;}

  .activity-mobile-text {padding-top: 18px !important; min-height: 245px !important;}

  #news .news-viewport {overflow: hidden !important; padding: 4px 4px 20px !important; scrollbar-width: none !important;}

  #news .news-track {gap: 16px !important; align-items: stretch !important;}

  #news .news-card-item {flex: 0 0 84% !important; min-width: 84% !important; scroll-snap-align: start !important;}

  #news .news-controls {display: none !important;}

  #news .news-card.news-image-card {min-height: 430px !important; border-radius: 24px !important;}

  #news .news-cover,
  #news .news-img-rotator {height: 205px !important;}

  #news .news-body {padding: 20px !important;}

  #news .news-body h5 {font-size: 1rem !important;}

  #news .news-body p {font-size: .88rem !important; line-height: 1.55 !important;}


  #gallery .activity-mobile-strip {gap: 16px !important; padding: 8px 6px 22px !important; margin-top: 24px !important;}

  #gallery .activity-mobile-card {flex-basis: 84% !important; min-width: 84% !important;}

  #gallery .activity-mobile-card img {height: 205px !important;}


  .hero-clean.hero-v2 {min-height: 100vh !important; padding: 82px 0 32px !important;}

  .hero-clean .hero-title {font-size: clamp(2.05rem, 11vw, 3.15rem) !important; line-height: 1.08 !important; margin-bottom: 18px !important;}

  .hero-clean .hero-info-card {margin-top: 22px !important; width: 100% !important; max-width: 360px !important; line-height: 1.45 !important;}

  .hero-clean .hero-actions {display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 360px !important;}

  .vision-mission-wide {padding-inline: 18px !important; padding-block: 34px !important;}

  .vm-wide-item {gap: 14px !important;}

  .vm-wide-icon {width: 48px !important; height: 48px !important; border-radius: 16px !important;}

  .vm-wide-item h5 {font-size: 1.25rem !important;}

  .vm-wide-item p {font-size: .96rem !important; line-height: 1.7 !important;}


  .hero-layout-row {padding-top: 120px !important;}

  .hero-text-col {padding-top: 36px !important;}

  .hero-clean .hero-title {font-size: clamp(2.05rem, 11vw, 3.1rem) !important; line-height: 1.08 !important;}

  .hero-clean .hero-info-card {width: 100% !important; max-width: 360px !important; padding: 16px 18px !important; font-size: .98rem !important;}

  .hero-clean .hero-actions {display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 360px !important; margin-top: 44px !important;}

  .hero-doctor-frame {width: 92vw !important;}

  .hero-doctor-frame .hero-doctor-img {max-height: 345px !important;}


  .hero-clean .hero-title {font-size: clamp(1.55rem, 7.2vw, 2.25rem) !important; white-space: nowrap !important; gap: .12em !important; letter-spacing: -.05em !important;}

  .hero-clean .typing-subtitle {font-size: 1rem !important; line-height: 1.65 !important; max-width: 360px !important;}


  .hero-clean .hero-title.split-title {font-size: clamp(1.7rem, 8vw, 2.3rem) !important; white-space: normal !important; flex-wrap: wrap !important; line-height: 1.15 !important; gap: .08em !important; row-gap: .05em !important;}


  .hero-clean .hero-title.split-title {font-size: clamp(1.55rem, 8.2vw, 2.45rem) !important; line-height: 1.08 !important; gap: .14em !important;}

  .hero-clean .typing-subtitle {font-size: .98rem !important; line-height: 1.62 !important; text-align: left !important; max-width: 100% !important;}

  .hero-clean .hero-doctor-frame {width: 92vw !important;}

  .hero-clean .hero-doctor-img {max-height: 360px !important;}


  .hero-clean #heroTypingSubtitle.typing-subtitle {max-width: 100% !important; min-height: 2.9em !important; text-align: left !important; font-size: .8rem !important; line-height: 1.55 !important; white-space: normal !important;}



  .hero-clean .hero-actions .btn.hero-btn-primary,
  .hero-clean .hero-actions .btn.hero-btn-secondary {width: 100% !important; font-size: 1rem !important; padding: 12px 22px !important; min-height: 48px !important;}


  .vision-mission-wide {padding: 36px 22px !important; border-radius: 8px !important;}

  .vm-wide-item h5 {font-size: 1.22rem !important;}

  .vm-wide-item p {font-size: .98rem !important; line-height: 1.75 !important;}



  .hero-clean .hero-actions .btn.hero-btn-primary,
  .hero-clean .hero-actions .btn.hero-btn-secondary {font-size: .88rem !important; padding: 13px 26px !important; min-height: 48px !important;}


  .vision-mission-wide .vm-card.vm-wide-item {padding: 24px 20px !important;}

  .vm-card-header h5 {font-size: 1.22rem !important;}

  .vision-mission-wide .vm-card p {font-size: .98rem !important; line-height: 1.75 !important;}


  .hero-hospital-bg {background-size: auto 148% !important; background-position: 72% 6% !important;}


  .hero-layout-row {padding-top: 92px !important; padding-bottom: 48px !important;}

  .hero-clean .hero-info-card {margin-top: 24px !important;}

  .hero-clean .hero-actions {margin-top: 28px !important;}


  .hero.hero-v2.hero-clean {display: flex !important; flex-direction: column !important; align-items: stretch !important; height: auto !important; min-height: auto !important; background: #0d3050 !important;}

  .hero-hospital-bg {display: none !important;}

  .hero-layout-row {padding-top: 0 !important; padding-bottom: 0 !important; min-height: auto !important;}

  .hero-text-col {padding-top: 0 !important; min-height: auto !important;}

  .hero-clean .hero-clean-content {padding-top: 36px !important; padding-bottom: 46px !important;}

  .hero-mobile-visual {display: block !important; order: -1 !important; position: relative !important; width: 100% !important; height: 300px !important; margin-top: 74px !important; margin-bottom: -52px !important; background-image: url('../assets/images/home-hero-original-face-hd.png') !important; background-size: cover !important; background-position: center 14% !important; background-repeat: no-repeat !important;}

  .hero-mobile-visual:after {content: "" !important; position: absolute !important; inset: 0 !important; background: linear-gradient(180deg, rgba(13, 48, 80, 0) 0%, rgba(13, 48, 80, 0) 40%, rgba(13, 48, 80, .28) 62%, rgba(13, 48, 80, .68) 80%, rgba(13, 48, 80, .92) 92%, #0d3050 100%) !important;}

  .hero-clean .hero-clean-content {position: relative !important; z-index: 2 !important;}



  .hero-clean .hero-actions,
  .hero-v2 .hero-actions,
  .hero-actions {gap: 10px !important; max-width: 400px !important; align-items: stretch !important;}

  .hero-clean .hero-actions .btn,
  .hero-v2 .hero-actions .btn {padding: 8px 6px !important; font-size: .78rem !important; line-height: 1.3 !important; min-height: 48px !important; height: auto !important; white-space: normal !important; text-align: center !important; /* Wrap onto a new line only at a space, never mid-word,
       so "Consultation" stays whole (e.g. "Book a" / "Consultation") */
    word-break: keep-all !important; overflow-wrap: normal !important; hyphens: none !important;}


  .hero.hero-v2.hero-clean {min-height: 100vh !important; height: 100vh !important;}

  .hero-hospital-bg {background-image: url('../assets/images/home-hero-original-face-hd.png') !important; background-size: cover !important; background-position: center top !important;}

  .hero-layout-row {height: 100vh !important; min-height: 100vh !important; padding-top: 68px !important;}

  .hero-text-col {min-height: calc(100vh - 68px) !important; padding: 0 18px !important;}

  .hero-clean .hero-clean-content {transform: translateY(76px) !important; max-width: 520px !important;}

  .hero-v2 .hero-title {font-size: clamp(1.62rem, 6.2vw, 2.25rem) !important; line-height: 1.04 !important; margin-bottom: 20px !important;}

  .hero-v2 .hero-subtitle {max-width: 92vw !important; font-size: clamp(.72rem, 2.25vw, .86rem) !important; line-height: 1.55 !important;}

  .hero-clean .hero-info-card {margin-top: 18px !important; min-height: 42px !important; min-width: min(310px, 78vw) !important; padding: 8px 14px !important; border-radius: 15px !important; font-size: .72rem !important;}

  .hero-clean .hero-actions,
  .hero-v2 .hero-actions,
  .hero-actions {max-width: min(380px, 88vw) !important; gap: 12px !important; margin-top: 22px !important;}

  .hero-clean .hero-actions .btn,
  .hero-v2 .hero-actions .btn {min-height: 42px !important; padding: 6px 8px !important; font-size: clamp(.62rem, 2.2vw, .72rem) !important; white-space: nowrap !important; word-break: normal !important; overflow-wrap: normal !important;}


  .hero.hero-v2.hero-clean {height: 100vh !important; min-height: 100vh !important;}

  .hero-text-col {min-height: calc(100vh - 68px) !important; align-items: flex-end !important;}

  .hero-clean .hero-clean-content {transform: none !important; padding-bottom: 34px !important;}

  .hero-v2 .hero-title {margin-bottom: 16px !important;}

  .hero-clean .hero-info-card {margin-top: 16px !important;}

  .hero-clean .hero-actions,
  .hero-v2 .hero-actions,
  .hero-actions {margin-top: 20px !important;}


  .impact-strip {gap: 14px !important; padding: 24px 0 !important;}

  .impact-strip-item {flex: 1 1 42% !important; padding: 22px 14px !important;}

  .impact-strip-item b {font-size: 1.6rem !important; font-weight: 500 !important;}

  .impact-strip-item i {font-size: 1.25rem !important;}

  .impact-strip-item span {font-size: 0.95rem !important; font-weight: 700 !important;}


  .modi-news-body {flex-direction: column !important; padding: 6px 18px 22px !important;}

  .modi-news-image {flex: 0 0 auto !important; width: 100% !important;}

  .modi-news-image img {height: 200px !important;}


  .hero-clean .hero-title.split-title-v2 {font-size: clamp(1.05rem, 5.6vw, 1.9rem) !important; max-width: 100% !important; letter-spacing: -.015em !important;}


  .crusade-svg {display: none !important;}

  .crusade-track:before {left: 20px !important; transform: none !important; border-left: 2.6px dotted rgba(255, 255, 255, .55) !important;}

  .crusade-row,
  .crusade-row.row-left,
  .crusade-row.row-right {grid-template-columns: 40px 1fr !important; grid-template-areas: "node card" !important; margin-bottom: 22px !important;}

  .crusade-node {display: none !important;}

  .crusade-row.row-left .crusade-card,
  .crusade-row.row-right .crusade-card {grid-column: 2 !important; margin-left: 14px !important; margin-right: 0 !important;}

  .crusade-spacer {display: none !important;}


  .hero-mobile-visual {background-position: center 20% !important;}


  .hero-clean .hero-title.split-title-v2 {font-size: clamp(1rem, 5vw, 1.7rem) !important; text-align: center !important;}

  .split-title-v2 .title-left,
  .split-title-v2 .title-right {text-align: center !important; white-space: nowrap !important;}



  .hero-doctor-line,
  .hero-doctor-quals {text-align: center !important; margin-left: auto !important; margin-right: auto !important;}


  .hero-doctor-line {font-size: 1.4rem !important;}

  .hero-doctor-quals {font-size: 1.1rem !important; margin-top: 2px !important;}


  #about .about-subtitle-headline.about-title-animated {white-space: normal !important; font-size: .92rem !important; padding: 0 10px !important;}


  .vm-card-new {padding: 38px 24px 28px !important;}

  .vm-card-new .vm-card-header {margin-top: -40px !important;}

  .vm-card-new .vm-wide-icon {width: 50px !important; height: 50px !important;}

  .vm-card-new .vm-wide-icon i {font-size: 1.2rem !important;}


  .slogan-strip {margin: 44px 0 !important;}

  .slogan-strip-inner {min-height: auto !important;}

  .slogan-strip-copy {padding: 28px 22px 32px !important; max-width: 100% !important; text-align: center !important; align-items: center !important;}

  .slogan-strip-copy p {max-width: 100% !important;}


  .doctor-featured .doctor-info h5 {font-size: 1.15rem !important;}

  .doctor-featured .doctor-quals {font-size: .95rem !important;}


  .section-title {font-size: 2.8rem !important;}

  .hero-v2 .hero-doctor-line {font-size: 1.4rem !important;}

  .hero-v2 .hero-doctor-quals {font-size: 1.1rem !important; display: block !important; margin-left: 0 !important; margin-top: 4px !important;}


  .footer-new .footer-bottom-bar .site-container {gap: 8px !important;}

  .footer-new .footer-bottom-bar p {white-space: normal !important; display: block !important;}


  .section-space {padding: 32px 0 !important;}


  .slogan-strip-inner {display: flex !important; flex-direction: column-reverse !important; align-items: stretch !important; min-height: auto !important;}

  .slogan-strip-content {max-width: 100% !important; padding: 32px 24px !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important;}

  .slogan-strip-photo {position: relative !important; width: 100% !important; height: 220px !important; border-radius: 0 !important;}

  .slogan-strip-photo img {-webkit-mask-image: linear-gradient(to top, #000 55%, transparent 95%) !important; mask-image: linear-gradient(to top, #000 55%, transparent 95%) !important;}


  .slogan-strip-inner {min-height: auto !important;}

  .slogan-strip-content {max-width: 100% !important;}

  .slogan-strip-photo {width: 100% !important; height: 260px !important;}

  .slogan-strip-photo img {-webkit-mask-image: none !important; mask-image: none !important;}


  .timeline-grid {display: flex !important; flex-direction: column !important; gap: 16px !important; position: relative !important;}

  .timeline-grid::before {content: "" !important; position: absolute !important; left: 50% !important; top: 16px !important; bottom: 16px !important; border-left: 3px dotted rgba(14, 165, 233, 0.55) !important; transform: translateX(-50%) !important; z-index: 0 !important;}


  .slogan-strip-author {align-items: center !important;}


  .slogan-strip-compact .slogan-strip-inner {min-height: auto !important; border-radius: 0 !important; flex-direction: column-reverse !important;}

  .slogan-strip-compact .slogan-strip-content {max-width: 100% !important; padding: 32px 16px !important;}

  .slogan-strip-compact .slogan-line-1 {white-space: normal !important;}

  .slogan-strip-compact .slogan-strip-photo {width: 100% !important; height: 240px !important;}

  .slogan-strip-compact .slogan-strip-photo img {max-height: 240px !important;}


  #programs .program-grid {grid-template-columns: 1fr !important; gap: 0 !important; padding: 0 !important; margin-left: 0 !important; width: 100% !important; max-width: 100% !important;}


  .contact-cards-row {grid-template-columns: 1fr !important; align-items: stretch !important;}

  .contact-card-item {max-width: 100% !important; width: 100% !important;}


  .tl-desktop {display: none !important;}

  .tl-mobile {display: block !important; position: relative !important; padding-left: 36px !important;}

  /* Vertical dotted line on the left */
  .tl-mobile::before {content: "" !important; position: absolute !important; left: 12px !important; top: 8px !important; bottom: 8px !important; width: 2px !important; background: repeating-linear-gradient(to bottom,
        #9fb6c7 0px,
        #9fb6c7 6px,
        transparent 6px,
        transparent 14px) !important; border-radius: 2px !important;}

  .tl-mobile-item {position: relative !important; margin-bottom: 24px !important;}

  .tl-mobile-item:last-child {margin-bottom: 0 !important;}

  /* Milestone dot on the vertical line */
  .tl-mobile-dot {position: absolute !important; left: -29px !important; top: 18px !important; width: 14px !important; height: 14px !important; background: #6aa3c8 !important; border: 3px solid #fff !important; border-radius: 50% !important; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18) !important; z-index: 3 !important;}

  /* Cards are full width */
  .tl-card {width: 100% !important;}


  .story-img-wrap {min-height: 230px !important;}

  .story-text-col {padding: 24px 20px !important;}

  .story-headline {font-size: 1.05rem !important;}

  .story-timeline-wrap {padding-bottom: 56px !important;}

  .story-timeline-card {min-width: 84vw !important;}


  .spot-section {padding-top: 60px !important; padding-bottom: 24px !important;}

  .spot-photo-strip {height: 280px !important;}

  .spot-card {margin-top: 0 !important; margin-bottom: 16px !important; border-radius: 14px !important;}

  .spot-card-left {padding: 24px 20px !important;}

  .spot-card-right {padding: 24px 20px !important;}

  .spot-stat-row {gap: 0 !important;}

  .spot-stat {padding: 16px 20px !important;}

  .spot-stat-sep {display: none !important;}

  .spot-stat-n {font-size: 1.8rem !important;}


  #news .news-track {display: flex !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; padding: 4px 0 16px !important; gap: 14px !important;}

  #news .news-card-item {flex: 0 0 90% !important; scroll-snap-align: center !important; max-width: 90% !important;}

  .social-news-card {min-height: 440px !important; border-radius: 14px !important;}

  .social-news-card header {padding: 12px 14px !important;}

  .social-news-card .card-media-wrapper img {height: 210px !important;}

  .social-news-card .social-slide-copy {padding: 12px 14px 14px !important;}

  .social-news-card .platform-action-bar {padding: 8px 14px !important;}

  .testimonial-strip-item {width: 330px !important; padding: 16px !important;}

  .testimonial-strip-item img {width: 58px !important; height: 58px !important; flex-basis: 58px !important;}

  #contact .contact-card-item {padding: 24px 20px !important;}

  .testimonial-stripe::before,
  .testimonial-stripe::after {width: 28px !important;}


  .slogan-strip-hd {min-height: 410px !important; background-position: 68% center !important;}

  .slogan-strip-content {max-width: 72% !important; padding: 20px 0 20px 8px !important;}

  .slogan-strip-content .slogan-line-2 {font-size: .86rem !important;}

  #programs .program-cover {height: 285px !important; min-height: 285px !important;}

  .testimonial-stripe {min-height: 320px !important; padding: 32px 22px 54px !important;}

  .testimonial-slides {min-height: 220px !important;}

  .testimonial-slide p {font-size: .9rem !important;}

  #news .news-card-item {flex-basis: 88% !important; height: 490px !important;}

  #news .social-news-card {height: 490px !important;}

  #news .card-media-wrapper,
  #news .instagram-card .card-media-wrapper,
  #news .newspaper-content-stack .card-media-wrapper {height: 220px !important; min-height: 220px !important;}

  .cta-band-light .row {text-align: center !important;}

  .cta-band-light h2,
  .cta-band-light p {text-align: center !important;}

  .cta-ecg-line {margin: 10px auto 0 !important;}


  .managed-content-grid {grid-template-columns: 1fr !important;}

  .managed-gallery-grid {grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}

  .managed-testimonials-grid {grid-template-columns: 1fr !important;}


  .hero-doctor-overlay {width: 90% !important; height: 70% !important; opacity: 0.4 !important;}

  .slogan-strip-content {text-align: center !important; padding-top: 20px !important; padding-bottom: 20px !important;}


  :root {--section-gap: 20px !important;}

  .hero-hospital-bg {background-position: 68% center !important;}

  .hero-v2::before {background: linear-gradient(90deg, rgba(7, 35, 64, .9) 0%, rgba(7, 35, 64, .68) 58%, rgba(7, 35, 64, .12) 100%) !important;}

  .slogan-banner {overflow: hidden !important;}

  .slogan-banner img {width: 100% !important; height: auto !important;}


  .section-title,
  .section-heading .section-title,
  .story-title-nowrap,
  .contact-title-nowrap {font-size: clamp(1.55rem, 7vw, 2rem) !important; white-space: normal !important;}
  
  .about-title-nowrap {font-size: clamp(1.15rem, 5vw, 1.8rem) !important; white-space: nowrap !important;}

  .section-heading > p,
  .section-heading .text-muted,
  .programs-client-subtitle {font-size: 1.05rem !important;}

  .slogan-banner.slogan-strip {min-height: 350px !important; background-position: 62% center !important;}

  .slogan-banner.slogan-strip::before {background: linear-gradient(90deg, rgba(238, 248, 255, .88) 0%, rgba(226, 241, 255, .80) 62%, rgba(213, 233, 251, .45) 100%) !important;}

  .slogan-content-new {width: 86% !important; padding-top: 28px !important; padding-bottom: 28px !important;}

  .slogan-content-new h2 {font-size: clamp(2rem, 10vw, 2.8rem) !important; white-space: normal !important;}

  .slogan-author-new p {max-width: 310px !important;}


  #news .social-post-slide {display: flex !important;}

  #news .social-post-slide .card-media-wrapper {height: 220px !important; min-height: 220px !important;}


  .gallery-filters {flex-wrap: nowrap !important; justify-content: flex-start !important; overflow-x: auto !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; width: 100% !important; padding-bottom: 5px !important; gap: 8px !important;}
  .gallery-filters::-webkit-scrollbar {display: none !important;}
  .filter-btn {padding: 8px 16px !important; font-size: 0.8rem !important; flex: 0 0 auto !important;}

  .gallery-desktop-grid {display: none !important;}

  .gallery-mobile-slider {display: block !important; width: 100% !important;}

  .gallery-mobile-scroll {width: 100% !important; overflow-x: auto !important; scroll-behavior: smooth !important; scroll-snap-type: x mandatory !important; scrollbar-width: none !important;}
  .gallery-mobile-scroll::-webkit-scrollbar {display: none !important;}

  .gallery-mobile-track {display: flex !important; gap: 12px !important; width: max-content !important; padding: 4px 2px 16px !important;}

  .gallery-slide-mobile {flex: 0 0 calc(100vw - 60px) !important; width: calc(100vw - 60px) !important; height: 260px !important; scroll-snap-align: center !important;}

  .gallery-mobile-nav-wrapper {display: flex !important; justify-content: center !important; gap: 8px !important; margin-top: 6px !important;}

  .gallery-mobile-nav {width: 40px !important; height: 40px !important; border-radius: 50% !important; border: 1px solid #bfd3e3 !important; background: #fff !important; color: #0d3d6f !important; display: grid !important; place-items: center !important; box-shadow: 0 4px 10px rgba(0,0,0,0.08) !important; cursor: pointer !important;}
  
  .gallery-mobile-nav:disabled {opacity: 0.3 !important;}

  /* Stripes Mobile Layout Optimization */
  .impact-stripe {min-height: auto !important; padding: 30px 0 !important;}
  .impact-stripe-inner {flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 20px !important;}
  .impact-stripe-copy {width: 100% !important; text-align: center !important;}
  .impact-stripe h2 {font-size: 1.35rem !important; line-height: 1.25 !important; white-space: normal !important; letter-spacing: -0.02em !important; margin-bottom: 14px !important;}
  .impact-stripe p {font-size: 0.88rem !important; margin-top: 0 !important; margin-bottom: 10px !important; line-height: 1.7 !important;}
  .impact-ecg {margin-top: 14px !important; margin-bottom: 2px !important;}
  .impact-stripe-button {width: auto !important; min-width: 200px !important; align-self: center !important; margin-top: 10px !important;}
  .team-stripe-flex {flex-direction: column !important;}
  .team-stripe-copy-left {text-align: center !important;}


  .slogan-banner.slogan-strip {min-height: auto !important; padding: 16px 0 20px !important;}

  .slogan-layout-new {grid-template-columns: 1fr !important; grid-template-rows: auto auto !important; row-gap: 12px !important; column-gap: 0 !important;}

  .slogan-doctor-new {order: -1 !important; justify-content: center !important; min-height: auto !important; align-items: center !important;}

  .slogan-layout-new .slogan-content-new {width: auto !important; padding-top: 4px !important; padding-bottom: 0 !important;}

  .slogan-content-new h2 {font-size: clamp(1.55rem, 7.2vw, 2.05rem) !important; line-height: 1.2 !important; white-space: normal !important;}

  .slogan-subtitle {font-size: .84rem !important; margin-top: 0 !important; margin-bottom: 15px !important;}

  .slogan-author-new h3 {font-size: .94rem !important;}

  .slogan-author-new p {max-width: 100% !important; font-size: .72rem !important; line-height: 1.5 !important;}

  .slogan-doctor-new img {width: 100% !important; max-width: 100% !important; max-height: none !important; height: auto !important; object-position: center bottom !important;}


  #news .news-viewport {width: 100% !important; overflow: visible !important;}

  #news .news-track {width: 100% !important; display: flex !important; gap: 14px !important; padding: 4px 0 16px !important; overflow-x: auto !important; scroll-snap-type: x mandatory !important; scrollbar-width: none !important;}

  #news .news-track::-webkit-scrollbar {display: none !important;}

  #news .news-card-item {flex: 0 0 calc(100vw - 30px) !important; width: calc(100vw - 30px) !important; max-width: calc(100vw - 30px) !important; height: 510px !important; scroll-snap-align: start !important;}

  #news .social-news-card {width: 100% !important; height: 510px !important;}

  #news .social-post-slide .card-media-wrapper {height: 220px !important; min-height: 220px !important;}

  #news .social-slide-copy {padding: 12px 14px 10px !important;}

  #news .platform-action-bar {padding: 9px 14px !important;}


  #home .hero-clean-content {padding-left: 14px !important; padding-right: 14px !important;}
  #home .hero-title {font-size: clamp(1.55rem, 7.2vw, 2.15rem) !important; line-height: 1.12 !important;}
  #home .hero-doctor-line {margin-top: 1rem !important;}
  #home .hero-doctor-line > span:first-child {font-size: 1.25rem !important;}
  #home .hero-doctor-quals {font-size: .88rem !important; line-height: 1.45 !important;}
  #home .hero-actions {gap: 10px !important;}
  #home .hero-actions .btn {min-width: 148px !important; min-height: 48px !important; padding: 12px 15px !important; font-size: .82rem !important;}

  .doctor-top-card .doctor-profile {min-height: auto !important;}
  #testimonials .testimonial-stripe {border-radius: 18px !important;}
  #testimonials .testimonial-strip-head {padding: 14px 16px !important;}
  #testimonials .testimonial-strip-head a {font-size: .72rem !important;}


  .cadf-new-loader-img {width: 70px !important;}
  .cadf-new-loader-ring {width: 110px !important; height: 110px !important;}


  .donate-hero-impact {margin-top: 25px !important;}
  .new-impact-grid {grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important;}
  .new-impact-item {padding: 16px 10px !important;}


  #programs .program-grid {grid-template-columns: 1fr !important; gap: 16px !important; border-radius: 0 !important; border: none !important; max-width: 100% !important; margin: 0 !important; width: 100% !important; padding: 0 12px !important;}
  #programs .program-box {border-radius: 12px !important;}
  #programs .site-container {padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important;}

.gallery-desktop-shell{display:none!important;}


  /* INDEX: render the approved mobile composition exactly below the navbar. */
  #home.hero-v2 {position: relative !important; width: 100% !important; height: calc(100vw * 2.16106) !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; background: #06264c !important;}

  #home .hero-hospital-bg {position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; background-image: url('../assets/images/index-mobile-client-approved.png') !important; background-position: center top !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; background-color: #06264c !important; filter: none !important; transform: none !important; opacity: 1 !important;}

  #home .hero-hospital-bg::before,
  #home .hero-hospital-bg::after,
  #home .hero-mobile-gradient,
  #home .hero-mobile-photo,
  #home .hero-mobile-visual,
  #home .gemini-star-cover {display: none !important; content: none !important;}

  #home .hero-layout-container,
  #home .hero-layout-container > .site-container,
  #home .hero-layout-row,
  #home .hero-text-col {position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important;}

  #home .hero-clean-content {position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; min-height: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; display: block !important;}

  /* The approved artwork already contains all visible typography. */
  #home .hero-title,
  #home .hero-doctor-line {position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; opacity: 0 !important; pointer-events: none !important;}

  /* Keep the two artwork buttons fully functional without redrawing them. */
  #home.hero-v2 .hero-actions {position: absolute !important; left: 11.4% !important; right: 11.4% !important; bottom: 3.55% !important; width: auto !important; height: 14.15% !important; margin: 0 !important; padding: 0 !important; display: grid !important; grid-template-columns: 1fr !important; grid-template-rows: 1fr 1fr !important; gap: 8.5% !important; z-index: 5 !important;}

  #home.hero-v2 .hero-actions .btn {width: 100% !important; height: 100% !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: transparent !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; opacity: 1 !important;}

  /* DONATE: image begins below navbar with deliberate head clearance. */
  .donate-hero-wrap.hospital-campaign-hero {position: relative !important; min-height: max(690px, calc(100svh - 68px)) !important; margin-top: 0 !important; overflow: hidden !important; background: #0d2a4e !important;}

  .hospital-campaign-hero .donate-hero-bg {position: absolute !important; inset: 0 !important; background-image: url('../assets/images/mobile-hero-clean-client-centered.png') !important; background-position: center 34px !important; background-size: 91% auto !important; background-repeat: no-repeat !important; background-color: #dceaf5 !important; filter: none !important; transform: none !important; animation: none !important;}

  .hospital-campaign-hero .donate-hero-bg::after {content: '' !important; display: block !important; position: absolute !important; inset: 0 !important; background: linear-gradient(
      to bottom,
      rgba(13,42,78,0) 0%,
      rgba(13,42,78,0) 42%,
      rgba(13,42,78,.25) 54%,
      rgba(13,42,78,.88) 70%,
      #0d2a4e 100%
    ) !important; z-index: 1 !important;}

  .hospital-campaign-hero .donate-hero-overlay {display: none !important;}

  .hospital-campaign-hero .donate-hero-body {position: relative !important; z-index: 3 !important; min-height: max(690px, calc(100svh - 68px)) !important; display: flex !important; align-items: flex-end !important; justify-content: center !important; padding: 0 18px 54px !important; text-align: center !important;}

  .hospital-campaign-hero .donate-hero-inner {width: 100% !important; max-width: 440px !important; margin: 0 auto !important; transform: none !important; text-align: center !important;}

  .hospital-campaign-hero .donate-hero-title {width: 100% !important; margin: 0 auto !important; font-family: 'Inter', Arial, Helvetica, sans-serif!important; font-size: clamp(2.18rem, 10.8vw, 3rem) !important; font-weight: 750 !important; line-height: 1.04 !important; letter-spacing: -.035em !important; text-align: center !important; text-shadow: 0 3px 12px rgba(0,0,0,.28) !important;}
  
  .navbar-brand .dynamic-logo-img { height: 78px !important; margin-left: 12px !important; }
}