/* ========================================================
   ACS — Responsive overrides for tablet & mobile
   Breakpoints: ≤767px mobile | 768–1023px tablet
   ======================================================== */

/* ---- Hamburger button (hidden on desktop) ---- */
.nav-hamburger {
  display: none;
  background: none;
  border: 1px solid #D6E0EC;
  border-radius: 8px;
  padding: 9px 11px;
  cursor: pointer;
  color: #0A2540;
  line-height: 0;
  flex-shrink: 0;
}

/* ---- Mobile ≤767px ---- */
@media (max-width: 767px) {

  /* Nav: show hamburger, hide links & actions by default */
  .nav-hamburger {
    display: flex;
    align-items: center;
    margin-left: auto;
  }

  .nav-links {
    display: none !important;
    width: 100%;
    order: 10;
  }

  .nav-actions {
    display: none !important;
    width: 100%;
    order: 11;
  }

  /* Nav: open state */
  #acs-nav.nav-open .nav-links {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 6px 0 !important;
    border-top: 1px solid #E3EAF1;
  }

  #acs-nav.nav-open .nav-links a {
    padding: 12px 2px !important;
    border-bottom: 1px solid #F0F4F8;
    font-size: 16px !important;
  }

  #acs-nav.nav-open .nav-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 12px 0 14px !important;
    align-items: stretch !important;
  }

  #acs-nav.nav-open .nav-actions > a {
    text-align: center;
    display: block;
    box-sizing: border-box;
  }

  /* Reduce L/R padding on all section inner wrappers
     DC runtime adds spaces: max-width: 1200px (not max-width:1200px) */
  [style*="max-width: 1200px"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Hero h1 */
  section h1 {
    font-size: 30px !important;
    line-height: 1.1 !important;
  }

  /* Hero sub-text */
  section h1 + p {
    font-size: 16px !important;
  }

  /* Hide index hero float badge on mobile (avoids overflow) */
  .hero-badge {
    display: none !important;
  }

  /* Stats numbers — DC uses spaces too */
  [style*="font-size: 46px"] {
    font-size: 32px !important;
  }

  /* CTA box — class added to the inner dark box in each page */
  .acs-cta-box {
    padding: 32px 20px !important;
  }

  /* Services page pillar card header padding */
  [style*="padding: 34px 40px"] {
    padding: 20px 16px !important;
  }

  /* h2 section headings */
  [style*="font-size: 42px"] { font-size: 28px !important; }
  [style*="font-size: 38px"] { font-size: 26px !important; }

  /* Footer */
  footer {
    padding: 40px 0 24px !important;
  }

  /* Footer email: break long strings only */
  footer span {
    overflow-wrap: break-word;
  }

  /* Contact form fields: single column on mobile */
  form [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* Partners grid — 2 columns on mobile */
  [style*="minmax(150px"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Pillars — single column on mobile */
  .pillars-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ---- Tablet 768–1023px ---- */
@media (min-width: 768px) and (max-width: 1023px) {

  /* Slight L/R padding reduction */
  [style*="max-width: 1200px"] {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  /* Hero h1 */
  section h1 {
    font-size: 40px !important;
  }

  /* CTA box */
  .acs-cta-box {
    padding: 48px 36px !important;
  }

  /* Services pillar headers */
  [style*="padding: 34px 40px"] {
    padding: 28px 28px !important;
  }

  /* Pillars — 2 columns on tablet */
  .pillars-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
