/* ====================================================
    Responsive
==================================================== */
/* Desktop 1200 - up */
@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }
}

/* Normal desktop :992px. (Laptop 14") */
@media (min-width: 992px) and (max-width: 1199px) {
    /* Global */
    h1 {
        font-size: 30px;
    }
    h2 {
        font-size: 26px;
    }
    h3 {
        font-size: 22px;
    }
    h4 {
        font-size: 20px;
    }
    h5 {
        font-size: 18px;
    }
    h6 {
        font-size: 16px;
    }

}

 
/* Tablet device :768px. */
@media (min-width: 768px) and (max-width: 991px) {
    /* Global */
    body {
        font-size: 14px;
    }
    h1 {
        font-size: 26px;
    }
    h2 {
        font-size: 22px;
    }
    h3 {
        font-size: 20px;
    }
    h4 {
        font-size: 18px;
    }
    h5 {
        font-size: 16px;
    }
    h6 {
        font-size: 15px;
    }
    p {
        font-size: 14px;
    }

}

 
/* small mobile :320px. */
@media (max-width: 767px) {
    /* Global */
    body {
        font-size: 14px;
    }
    h1 {
        font-size: 24px;
    }
    h2 {
        font-size: 20px;
    }
    h3 {
        font-size: 18px;
    }
    h4 {
        font-size: 17px;
    }
    h5 {
        font-size: 16px;
    }
    h6 {
        font-size: 14px;
    }
    p {
        font-size: 14px;
    }

}

.ltn__main-menu > ul {
    justify-content: flex-end;
}

/* ==== Custom Responsive Overrides for Service Cards ==== */
@media (max-width: 767.98px) {
    .service-card {
      flex-direction: column;
    }
    .card-icon-left {
      width: 100%;
      height: 80px;
      justify-content: center;
      align-items: center;
    }
    .card-icon-left i {
      font-size: 1.8rem;
    }
    .card-text-area {
      padding: 1rem;
      text-align: center;
    }
  }


/* ==== WHY CHOOSE US: Mobile-only 2-up row, perfectly centered ==== */
@media (max-width: 767.98px) {
  /* Center the whole image group and remove fixed height */
  .why-choose-us-img-stack {
    height: auto !important;              /* override inline 380px */
    margin: 24px auto 0 !important;       /* center horizontally */
    max-width: 620px;                      /* keep a nice readable width */
    padding: 0 12px;                       /* small side padding */
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;    /* center the pair */
    align-items: stretch !important;
    gap: 12px;                              /* space between the two images */
  }

  /* Kill absolute positioning from prior styles and make two equal cards */
  .why-choose-us-img-stack .img-box {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;

    flex: 0 1 46%;                          /* two columns */
    width: 46% !important;
    min-width: 0;                            /* prevent overflow */
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0,0,0,.15);

    /* Keep equal heights for both cards regardless of image ratio */
    aspect-ratio: 4 / 5;                     /* tweak to 3/4 or 1/1 if you prefer */
  }

  /* Make sure both images fill their card cleanly */
  .why-choose-us-img-stack .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;                       /* crop elegantly */
    display: block;
  }

  /* Slightly tighter section padding on phones */
  .ltn__why-choose-us-area.pt-120 { padding-top: 70px; }
  .ltn__why-choose-us-area.pb-120 { padding-bottom: 70px; }
}
