/* Gawagi mobile layout fix — Appointment & Why Choose Us */
html, body { max-width: 100%; overflow-x: hidden; }

/* Prevent long contact values, headings and grid children from escaping cards. */
.ge-reason > *,
.container-xxl .row > [class*="col-"],
.container-xxl .bg-light,
.container-xxl form,
.container-xxl form .row { min-width: 0; }

.ge-reason h5,
.ge-reason p,
.ge-section-title,
.ge-lead,
.container-xxl h1,
.container-xxl h2,
.container-xxl h5,
.container-xxl p,
.container-xxl span { overflow-wrap: anywhere; word-break: normal; }

@media (max-width: 767.98px) {
  /* Why choose us */
  .ge-reasons { gap: 14px; }
  .ge-reason {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100%;
  }
  .ge-reason .ge-num {
    width: 44px !important;
    min-width: 44px;
    height: 44px !important;
  }
  .ge-reason h5 {
    font-size: 1rem;
    line-height: 1.35;
    margin-top: 1px;
  }
  .ge-reason p {
    font-size: .9rem;
    line-height: 1.55;
  }
  .ge-section-title {
    font-size: clamp(1.45rem, 7vw, 2rem) !important;
    line-height: 1.18 !important;
  }
  .ge-lead { font-size: .94rem; line-height: 1.65; }

  /* Appointment contact cards */
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 {
    padding: 1rem !important;
    gap: 12px;
    align-items: center !important;
  }
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 > .ms-4 {
    margin-left: 12px !important;
    min-width: 0;
    flex: 1 1 auto;
  }
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 h5 {
    font-size: clamp(.9rem, 4vw, 1.1rem);
    line-height: 1.35;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 p {
    margin-bottom: .3rem !important;
    font-size: .82rem;
  }

  /* Appointment form card */
  .container-xxl .bg-light.rounded.h-100.d-flex.align-items-center.p-5 {
    padding: 1rem !important;
    width: 100%;
    overflow: hidden;
  }
  .container-xxl .bg-light.rounded.h-100.d-flex.align-items-center.p-5 > form {
    width: 100%;
    max-width: 100%;
  }
  .container-xxl form .form-control,
  .container-xxl form .form-select,
  .container-xxl form textarea,
  .container-xxl form button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  /* Keep Bootstrap's negative row margins inside the card. */
  .container-xxl form .row {
    --bs-gutter-x: .75rem;
    --bs-gutter-y: .75rem;
    margin-left: calc(var(--bs-gutter-x) * -.5);
    margin-right: calc(var(--bs-gutter-x) * -.5);
  }
}

@media (max-width: 420px) {
  .container-xxl.py-5 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .container-xxl > .container { padding-left: 14px; padding-right: 14px; }
  .ge-reason { grid-template-columns: 40px minmax(0, 1fr) !important; gap: 10px !important; }
  .ge-reason .ge-num { width: 40px !important; min-width: 40px; height: 40px !important; }
  .ge-reason .ge-num i { font-size: .85rem; }
  .ge-reason .ge-num b { font-size: .62rem; }
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 { padding: .85rem !important; }
  .container-xxl .bg-light.rounded.d-flex.align-items-center.p-5 > .d-flex.flex-shrink-0 {
    width: 44px !important; height: 44px !important; min-width: 44px;
  }
}