/* =========================================================================
   Adji Makka — ajustements responsives complémentaires
   (le système de base utilise déjà des unités fluides ; ce fichier couvre
   les cas particuliers aux très petites largeurs et aux très grandes)
   ========================================================================= */

@media (max-width: 479px) {
  :root {
    --header-height: 72px;
  }

  .site-header__logo img,
  .site-header__logo svg {
    height: 60px;
  }

  .hero__actions,
  .cta-section__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero__actions .btn,
  .cta-section__actions .btn {
    width: 100%;
  }

  .btn {
    padding-inline: 1.25rem;
  }

  .package-card__footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .site-footer__bottom {
    flex-direction: column;
  }
}

@media (min-width: 1440px) {
  :root {
    --container-max: 1320px;
  }
}

/* S'assure qu'aucun conteneur ne provoque de débordement horizontal */
html,
body {
  overflow-x: hidden;
}

img,
video,
svg {
  max-width: 100%;
}

table {
  display: block;
  overflow-x: auto;
  max-width: 100%;
}