/* responsive overrides only; keeps existing design and plain HTML/CSS */

/* Base safe tweaks that don't change the look */
img,
video {
  max-width: 100%;
  height: auto;
}

/* Header navigation responsiveness */
@media (max-width: 768px) {
  header .footer-links {
    flex-wrap: wrap;
    gap: 12px !important;
    padding: 1rem 0 !important;
  }
  header .footer-links li {
    flex: 1 1 100%;
    text-align: center;
  }
  /* Dropdown: make submenu flow in document on small screens for easier tap targets */
  header .dropdown-content {
    position: static !important;
    min-width: 0 !important;
    box-shadow: none !important;
    width: 100%;
  }
}

/* Hero heading and CTA */
@media (max-width: 1024px) {
  .heading-sec {
    /* Scale down large heading safely */
    font-size: clamp(28px, 5vw, 42px) !important;
    line-height: 1.2;
    text-align: center;
  }
}

@media (max-width: 768px) {
  /* Some pages position this absolutely with a fixed top; on mobile we center stack */
  .second.headingMain {
    position: static !important;
    top: auto !important;
    transform: none !important;
    padding: 1.5rem 1rem;
    text-align: center;
  }
  .btn {
    width: 100%;
    max-width: 360px;
  }
}

/* Popup modal sizing */
@media (max-width: 768px) {
  .popup {
    width: 92vw !important;
    max-width: 520px;
    max-height: 90vh;
    overflow: auto;
    padding: 16px !important;
  }
}

/* Form container and inputs in popup */
@media (max-width: 991px) {
  /* Ensure the form grid collapses full-width */
  #Formulaire83616 [class*="col-"] {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  #Formulaire83616 {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 12px;
  }
}

@media (max-width: 768px) {
  /* Make inputs full-width inside the popup */
  #popup .input-xlarge,
  #popup input[type="text"],
  #popup input[type="email"],
  #popup input[type="password"],
  #popup textarea {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Large call-to-action button inside the popup should fit mobile width */
  #popup .btn-xlarge,
  #popup .btn {
    width: 100% !important;
    box-sizing: border-box;
  }
}

/* Tiny devices adjustments */
@media (max-width: 480px) {
  .heading-sec {
    font-size: clamp(22px, 7vw, 32px) !important;
  }
  header .footer-links {
    gap: 8px !important;
  }
}