/* =========================================================
   First Solution Enterprise — Responsive Overrides
   Mobile-first breakpoints layered on top of style.css
   ========================================================= */

/* Prevent any horizontal overflow globally.
   overflow-x: clip (not "hidden") is intentional: setting overflow-x to
   "hidden" forces overflow-y to compute as "auto" on the same box, which
   turns body/html into a scroll container and breaks position:sticky on
   .site-header. "clip" is excluded from that forcing rule, so vertical
   scrolling and the sticky header both keep working normally. */
html, body {
  max-width: 100%;
  overflow-x: clip;
}

/* ---------- Base (mobile, < 576px) ---------- */
.nav-main,
.header-actions .btn-brand.d-desktop-only {
  display: none;
}

.floating-call-btn {
  display: inline-flex;
}

.hero {
  text-align: center;
}

.hero-cta-group {
  justify-content: center;
}

.hero-text {
  margin-inline: auto;
}

.hero-visual {
  margin-top: 2rem;
}

.steps-row {
  row-gap: 1.5rem;
}

.contact-panel {
  margin-top: 2rem;
}

.footer-bottom {
  flex-direction: column;
  text-align: center;
}

/* ---------- Small devices (>= 576px) ---------- */
@media (min-width: 576px) {
  .hero-cta-group {
    justify-content: flex-start;
  }
}

/* ---------- Tablets (>= 768px) ---------- */
@media (min-width: 768px) {
  .hero {
    text-align: left;
  }

  .hero-text {
    margin-inline: 0;
  }
}

/* ---------- Laptops / small desktop (>= 992px) ---------- */
@media (min-width: 992px) {
  .nav-main {
    display: flex;
  }

  .navbar-toggler-custom,
  .mobile-menu {
    display: none !important;
  }

  .header-actions .btn-brand.d-desktop-only {
    display: inline-flex;
  }

  .floating-call-btn {
    display: none !important;
  }
}

/* ---------- Large desktop (>= 1200px) ---------- */
@media (min-width: 1200px) {
  .section {
    padding-block: clamp(4rem, 6vw, 7rem);
  }
}

/* ---------- Extra-large desktop (>= 1440px) ---------- */
@media (min-width: 1440px) {
  .container,
  .container-lg,
  .container-xl {
    max-width: 1260px;
  }
}

/* ---------- Fine-tuning for very small phones (<= 375px) ---------- */
@media (max-width: 375px) {
  .hero-heading {
    font-size: 1.85rem;
  }

  .section-title {
    font-size: 1.5rem;
  }

  .btn-lg {
    padding: 0.75rem 1.4rem;
    font-size: 0.95rem;
  }

  .cta-section {
    padding: 1.75rem;
  }
}

/* ---------- Landscape phones ---------- */
@media (max-width: 991.98px) and (orientation: landscape) {
  .mobile-menu {
    padding-bottom: 4rem;
  }
}

/* ---------- Print ---------- */
@media print {
  .site-header,
  .floating-call-btn,
  .back-to-top-btn,
  .cta-section,
  .site-footer,
  .mobile-menu {
    display: none !important;
  }
}