/* ============================================
   MedPark BD — Mobile Responsive Overrides
   Targets inline styles via parent selectors
   ============================================ */

/* ---- NAV ---- */
@media (max-width: 900px) {
  #desktop-nav { display: none !important; }
  #menu-btn { display: flex !important; }
}

/* ---- CONTAINER ---- */
@media (max-width: 768px) {
  .container { padding: 0 16px !important; }
}

/* ---- HERO ---- */
@media (max-width: 768px) {
  section.hero-gradient,
  section[style*="min-height:90vh"],
  section[style*="min-height: 90vh"] {
    min-height: auto !important;
    padding: 60px 0 40px !important;
  }
  /* Hero text container */
  section.hero-gradient .container > div,
  section[style*="min-height:90vh"] .container > div {
    max-width: 100% !important;
  }
}

/* ---- ALL GRIDS: stack on mobile ---- */
@media (max-width: 640px) {
  /* Any inline grid that uses repeat or fr columns */
  [style*="display:grid"],
  [style*="display: grid"] {
    grid-template-columns: 1fr !important;
  }

  /* Exceptions: keep auto 1fr for icon+text pairs at narrower breakpoint */
  [style*="grid-template-columns:auto 1fr"],
  [style*="grid-template-columns: auto 1fr"] {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }
}

/* ---- STATS BAR: 2 col on mobile ---- */
@media (max-width: 640px) {
  .stats-bar [style*="display:flex"][style*="justify-content:space"] {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .stats-bar > div > div {
    flex: 1 1 45% !important;
  }
}

/* ---- FLEX ROWS: wrap on mobile ---- */
@media (max-width: 640px) {
  [style*="display:flex"][style*="gap"] {
    flex-wrap: wrap !important;
  }
  /* Hero CTA buttons: full width */
  section.hero-gradient [style*="display:flex"] a,
  section[style*="background:linear-gradient"] [style*="display:flex"] a[style*="padding:14px"] {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }
}

/* ---- SPECIALTIES: icon+text cards ---- */
@media (max-width: 640px) {
  [style*="grid-template-columns:auto 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:auto 1fr"] > div:first-child {
    margin: 0 auto 12px !important;
  }
}

/* ---- ABOUT: 2-col layout ---- */
@media (max-width: 900px) {
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 2fr"],
  [style*="grid-template-columns: 1fr 2fr"],
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- CONTACT: 2-col ---- */
@media (max-width: 900px) {
  .container > div[style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- PATIENT STORIES: gallery ---- */
@media (max-width: 480px) {
  [style*="grid-template-columns:repeat(auto-fill,minmax(200px"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ---- SECTIONS: reduce padding on mobile ---- */
@media (max-width: 768px) {
  section[style*="padding:64px 0"],
  section[style*="padding: 64px 0"],
  section[style*="padding:80px 0"],
  section[style*="padding: 80px 0"] {
    padding: 40px 0 !important;
  }
  section[style*="padding:48px 0"],
  section[style*="padding: 48px 0"] {
    padding: 32px 0 !important;
  }
}

/* ---- TYPOGRAPHY: scale down headings ---- */
@media (max-width: 640px) {
  h1[style*="font-size:clamp"],
  h2[style*="font-size:2rem"],
  h2[style*="font-size: 2rem"],
  h2[style*="font-size:2.2rem"],
  h2[style*="font-size:2.5rem"],
  h2[style*="font-size:3rem"] {
    font-size: 1.6rem !important;
  }
  p[style*="font-size:1.1rem"],
  p[style*="font-size: 1.1rem"],
  p[style*="font-size:1.2rem"] {
    font-size: 0.95rem !important;
  }
}

/* ---- CARDS: full padding on mobile ---- */
@media (max-width: 640px) {
  [style*="padding:36px"],
  [style*="padding: 36px"],
  [style*="padding:32px"],
  [style*="padding: 32px"] {
    padding: 20px 16px !important;
  }
  [style*="padding:28px 24px"],
  [style*="padding: 28px 24px"] {
    padding: 20px 16px !important;
  }
}

/* ---- APPOINTMENT PAGE ---- */
@media (max-width: 768px) {
  .appointment-grid {
    grid-template-columns: 1fr !important;
  }
  .form-grid-2 {
    grid-template-columns: 1fr !important;
  }
}

/* ---- HOW IT WORKS: timeline ---- */
@media (max-width: 640px) {
  .timeline-item {
    padding-left: 48px !important;
  }
}

/* ---- FOOTER: stack on mobile ---- */
@media (max-width: 640px) {
  footer .container[style*="display:grid"] {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  footer [style*="display:grid"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- STATS NUMBER BAR ---- */
@media (max-width: 640px) {
  [style*="display:flex"][style*="justify-content:space-around"],
  [style*="display:flex"][style*="justify-content:space-evenly"] {
    flex-wrap: wrap !important;
    gap: 16px !important;
  }
  [style*="display:flex"][style*="justify-content:space-around"] > div,
  [style*="display:flex"][style*="justify-content:space-evenly"] > div {
    flex: 1 1 40% !important;
    text-align: center !important;
  }
}

/* ---- TRUST BADGES ---- */
@media (max-width: 640px) {
  [style*="grid-template-columns:repeat(auto-fit,minmax(140px"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ---- WHATSAPP BUTTON: ensure visible ---- */
@media (max-width: 640px) {
  .wa-float,
  a[href*="wa.me"][style*="position:fixed"] {
    padding: 14px !important;
    border-radius: 50% !important;
    bottom: 16px !important;
    right: 16px !important;
  }
  .wa-float span:not(svg *),
  a[href*="wa.me"][style*="position:fixed"] span {
    display: none !important;
  }
}

/* ---- VIDEO GRID: single col on mobile ---- */
@media (max-width: 640px) {
  [style*="grid-template-columns:repeat(auto-fit,minmax(340px"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- CONTACT CARDS GRID ---- */
@media (max-width: 640px) {
  [style*="grid-template-columns:repeat(auto-fit,minmax(260px"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---- REMOVE OVERFLOW on mobile ---- */
@media (max-width: 768px) {
  body { overflow-x: hidden; }
  .container { overflow-x: hidden; }
  section { overflow-x: hidden; }
}

/* ---- NAV HEIGHT on mobile ---- */
@media (max-width: 768px) {
  #main-nav .container {
    height: 60px !important;
  }
  #main-nav .container > a {
    font-size: 1.2rem !important;
  }
}

/* ---- HERO: adjust inner content spacing ---- */
@media (max-width: 640px) {
  [style*="padding:80px 0 64px"],
  [style*="padding:64px 0 48px"] {
    padding: 40px 0 32px !important;
  }
  /* CTA button row */
  [style*="display:flex;flex-wrap:wrap;gap:16px"] {
    flex-direction: column !important;
  }
  [style*="display:flex;flex-wrap:wrap;gap:16px"] a,
  [style*="display:flex;flex-wrap:wrap;gap:16px"] button {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ---- MAP: height on mobile ---- */
@media (max-width: 640px) {
  iframe[src*="google.com/maps"] {
    height: 260px !important;
  }
}

/* ---- OFFICE HOURS table ---- */
@media (max-width: 640px) {
  [style*="display:flex;justify-content:space-between"] {
    flex-direction: column !important;
    gap: 4px !important;
  }
}

/* ---- ABOUT 2-col specific ---- */
@media (max-width: 900px) {
  .about-2col { grid-template-columns: 1fr !important; }
}

/* ---- CONTACT 2-col specific ---- */
@media (max-width: 900px) {
  .contact-2col { grid-template-columns: 1fr !important; }
}

/* ---- SPECIALTIES icon+text cards ---- */
@media (max-width: 640px) {
  .specialty-cat-card {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    padding: 20px 16px !important;
  }
  .specialty-cat-card > div:first-child {
    margin: 0 auto 12px !important;
  }
  .specialty-cat-card ul {
    text-align: left !important;
  }
}