/* ============================================================
   STOIC HEALTHCARE — responsive.css
   Media queries for mobile-first responsive design
   ============================================================ */

/* ── BASE RESPONSIVE - Prevent overflow ── */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

/* ── LARGE DESKTOPS (≥1400px) ── */
@media (min-width: 1400px) {
  .hero-title { font-size: 4.2rem; }
  .container { max-width: 1320px; }
}

/* ── DESKTOPS (≥1200px) ── */
@media (min-width: 1200px) {
  .navbar-brand img { height: 48px; }
}

/* ── TABLETS + SMALL DESKTOPS (≤991px) ── */
@media (max-width: 991px) {
  .hero-swiper { height: 100vh; min-height: 580px; }
  .hero-title  { font-size: 2.2rem; }
  .hero-img-side { display: none !important; }
  #mainNav { padding: .6rem 0; }
  .navbar-nav { padding: 1rem 0; }
  .nav-link { padding: .5rem 0 !important; border-radius: 0; }
  .nav-link::after { left: 0; right: 0; }
  .d-flex.align-items-center.gap-2 { margin-top: 1rem; }

  .section-pad { padding: 3.5rem 0; }
  .cta-banner  { padding: 2.5rem; }

  .hero-float { display: none; }

  .timeline { padding-left: 2rem; }
  .tl-dot   { left: -2rem; }
}

/* ── TABLETS (≤767px) ── */
@media (max-width: 767px) {
  .hero-swiper    { height: auto; min-height: 100svh; }
  .hero-content   { padding-top: 90px; padding-bottom: 3rem; }
  .hero-title     { font-size: 1.95rem; text-align: center; }
  .hero-sub       { font-size: .95rem; text-align: center; }
  .hero-btns      { gap: .5rem; justify-content: center; }
  .hero-badge     { justify-content: center; }
  .hero-stats     { gap: 1.2rem; justify-content: center; }
  .hero-stat .num { font-size: 1.5rem; }
  .btn-primary-grad,
  .btn-outline-white { padding: .75rem 1.5rem; font-size: .88rem; }

  .section-title  { font-size: 1.7rem; text-align: center; }
  .section-sub    { text-align: center; margin-left: auto; margin-right: auto; }
  .section-pad    { padding: 3rem 0; }
  .stats-strip    { padding: 1.8rem; }
  .stat-item .stat-num { font-size: 2.1rem; }

  .cta-banner     { padding: 2rem 1.5rem; border-radius: 16px; text-align: center; }
  .process-strip  { padding: 2rem 1.2rem; border-radius: 16px; }

  .form-card      { padding: 1.8rem 1.2rem; }
  .map-wrap       { height: 280px; }

  .parallax-section { min-height: 360px; }

  .about-hero-section  { min-height: auto; padding: 100px 0 3rem; }
  .contact-hero-section { min-height: auto; padding: 100px 0 3rem; }
  .contact-hero-section::after { height: 40px; }

  /* Footer responsive */
  .footer-bottom { flex-direction: column; text-align: center; gap: .5rem; }
  #mainFooter { text-align: center; }
  #mainFooter h6 { text-align: center; }
  #mainFooter a { text-align: center; justify-content: center; }
  #mainFooter .footer-social { justify-content: center; }
  #mainFooter .col-lg-4,
  #mainFooter .col-lg-3,
  #mainFooter .col-lg-2 { text-align: center; margin-bottom: 1.5rem; }

  .ticker-inner { gap: 2rem; }
  .ticker-item  { font-size: .75rem; }

  .wa-float        { width: 48px; height: 48px; }
  .wa-float svg    { width: 22px; height: 22px; }
  .scroll-top-btn  { width: 40px; height: 40px; }

  .emergency-strip { padding: 1.5rem; border-radius: var(--radius); flex-direction: column; text-align: center; }
  .emergency-strip .d-flex { justify-content: center !important; }

  /* Quick features - stack on mobile */
  .feature-icon-box { margin-bottom: 1rem; }

  /* Service cards */
  .service-card { margin-bottom: 1rem; }

  /* Testimonials */
  .testi-card { margin-bottom: 1rem; }

  /* Contact info cards */
  .contact-info-card { text-align: center; flex-direction: column; align-items: center; }
  .ci-icon { margin-bottom: 0.5rem; }

  /* Process cards */
  .pstrip-item { margin-bottom: 1.5rem; }
  .pstrip-item:last-child { margin-bottom: 0; }

  /* Why choose us */
  .why-card { margin-bottom: 1rem; }

  /* Team cards */
  .team-card { margin-bottom: 1rem; }

  /* Equipment cards */
  .equip-card { margin-bottom: 1rem; }

  /* CTA section */
  .cta-banner .row { text-align: center; }
  .cta-banner .d-flex { justify-content: center !important; flex-wrap: wrap; }

  /* Form section */
  .form-card h4 { text-align: center; }
  .form-card .form-subtitle { text-align: center; }
}

/* ── MOBILE (≤575px) ── */
@media (max-width: 575px) {
  .hero-title { font-size: 1.7rem; }
  .section-title { font-size: 1.5rem; }
  .hero-stats { gap: .8rem; flex-wrap: wrap; }
  .hero-btns { flex-direction: column; align-items: center; }
  .hero-btns .btn-primary-grad,
  .hero-btns .btn-outline-white { width: 100%; max-width: 280px; justify-content: center; }

  .sc-img  { height: 180px; }
  .ec-img  { height: 160px; }
  .team-card .tc-img { height: 180px; }

  .cta-banner { text-align: center; }
  .cta-banner .d-flex { justify-content: center !important; }

  .faq-q { font-size: .88rem; }
  .award-badge { flex-direction: row; }

  .stats-strip .row > div { margin-bottom: .5rem; }

  #mainFooter .col-sm-6 { margin-bottom: 2rem; }

  .navbar-brand img { height: 38px; }

  /* Form elements full width */
  .form-card .col-md-6,
  .form-card .col-12 { margin-bottom: 0.5rem; }

  /* Section headers */
  .section-badge { display: flex; justify-content: center; }
  .divider-grad { margin-left: auto; margin-right: auto; }

  /* Hero content row */
  .hero-content .row { text-align: center; }
  .hero-content .row .col-lg-6,
  .hero-content .row .col-lg-7 { text-align: center; }

  /* Quick enquiry section */
  .contact-info-card { width: 100%; }

  /* Feature boxes */
  .feature-icon-box { padding: 1.5rem 1rem; }
}

/* ── VERY SMALL MOBILE (≤380px) ── */
@media (max-width: 380px) {
  .hero-title { font-size: 1.5rem; }
  .btn-primary-grad, .btn-outline-white { padding: .7rem 1.2rem; font-size: .85rem; width: 100%; }
  .hero-stats { flex-direction: column; gap: .6rem; }
  .section-badge { font-size: .68rem; }
  
  .hero-btns { padding: 0 1rem; }
  .hero-content { padding-left: 0.75rem; padding-right: 0.75rem; }
}

/* ── HIGH DPI / RETINA ── */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  #mainNav { border-bottom-width: 0.5px; }
}

/* ── PRINT ── */
@media print {
  #pageLoader, .wa-float, .scroll-top-btn, #mainNav { display: none !important; }
  body { color: #000; }
  a { color: #000; }
  .hero-swiper { height: auto !important; }
  .hero-bg, .hero-overlay { display: none; }
}

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
}

/* ── DARK MODE BASIC ── */
@media (prefers-color-scheme: dark) {
  /* Keep site light - healthcare should feel clean and clinical */
  /* Override only if explicitly added .dark-mode class */
}
/* ===== MOBILE FOOTER STABILIZER ===== */
@media (max-width: 768px) {

  /* Center all columns */
  #mainFooter .row > div {
    text-align: center;
  }

  /* Center links */
  #mainFooter a,
  #mainFooter p,
  #mainFooter h6 {
    justify-content: center !important;
    text-align: center;
  }

  /* Allow wrapping (prevents breaking) */
  #mainFooter a,
  #mainFooter p {
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: normal !important;
  }

  /* Fix d-flex links */
  #mainFooter a.d-flex {
    align-items: center !important;
    justify-content: center !important;
  }

  /* Center icons + text spacing */
  #mainFooter i {
    margin-right: 6px !important;
  }

  /* Center social icons */
  .footer-social {
    justify-content: center !important;
  }

  /* Footer bottom center */
  .footer-bottom {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center;
  }

  /* Prevent column overflow */
  #mainFooter .col-lg-2,
  #mainFooter .col-lg-3,
  #mainFooter .col-lg-4 {
    min-width: 0;
  }

  /* Floating buttons move up so they don't overlap */
  .wa-float,
  .scroll-top-btn {
    bottom: 80px;
  }

}
.footer-social a:hover i {
  color: #fff !important;
}