/* ==========================================================================
   SEMA Marine — Responsive global (< 768px), toutes pages FR & EN
   Chargé après styles.css par includes/head.php. Charte Noir & Orange.
   Module dédié : styles.css (historique, > 4 000 lignes) n'est plus alourdi.
   ========================================================================== */

@media (max-width: 767px) {
  /* --- Marges de sécurité : aucun texte collé aux bords --- */
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* --- Centrage des surtitres orange, titres et intertitres de section --- */
  main .section-title,
  main .section-headline,
  main h2.section-title,
  main .two-cols > div > h3 {
    text-align: center;
  }

  main .section-headline {
    margin-left: auto;
    margin-right: auto;
  }

  /* --- Boutons d'action isolés centrés (ex. « En savoir plus sur l'entreprise ») --- */
  main a.btn {
    display: flex;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  main .hero-actions {
    justify-content: center;
  }

  main .hero-actions a.btn {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }

  /* --- Footer intégralement centré --- */
  footer.site-footer {
    text-align: center;
  }

  footer.site-footer .footer-grid {
    grid-template-columns: 1fr;
    gap: 34px;
    justify-items: center;
  }

  footer.site-footer .footer-brand,
  footer.site-footer .footer-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  footer.site-footer .footer-brand-link {
    justify-content: center;
  }

  footer.site-footer .footer-tagline {
    margin-left: auto;
    margin-right: auto;
  }

  footer.site-footer .footer-contacts {
    align-items: center;
  }

  footer.site-footer .footer-contact {
    justify-content: center;
  }

  .footer-col h4::after {
    margin: 8px auto 0;
  }

  footer.site-footer .footer-links {
    width: 100%;
    text-align: center;
  }

  footer.site-footer .footer-links-zones {
    columns: 2;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

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

  footer.site-footer .footer-bottom-links {
    justify-content: center;
  }
}
