/* Responsive header pages publiques : accueil, account, guide, contact */

#myrmidon-common-header,
.myrmidon-public-app-header{
  max-width:100vw!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}

#myrmidon-common-header *,
.myrmidon-public-app-header *{
  box-sizing:border-box!important;
}

#myrmidon-common-header nav,
.myrmidon-public-app-header nav{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:clamp(8px, 1vw, 18px)!important;
  align-items:center!important;
  justify-content:flex-end!important;
}

#myrmidon-common-header a,
.myrmidon-public-app-header a{
  font-size:clamp(12px, 1vw, 15px)!important;
  white-space:nowrap!important;
}

#myrmidon-common-header img,
.myrmidon-public-app-header img{
  max-height:clamp(34px, 5vw, 58px)!important;
  width:auto!important;
}

#myrmidon-common-header h1,
#myrmidon-common-header .brand-title,
.myrmidon-public-app-header h1,
.myrmidon-public-app-header .brand-title{
  font-size:clamp(18px, 2vw, 30px)!important;
  white-space:nowrap!important;
}

/* Écrans moyens */
@media(max-width:900px){
  #myrmidon-common-header,
  .myrmidon-public-app-header{
    min-height:auto!important;
    padding:10px 14px!important;
  }

  #myrmidon-common-header nav,
  .myrmidon-public-app-header nav{
    justify-content:center!important;
  }
}

/* Petits écrans : header en deux lignes propre */
@media(max-width:650px){
  #myrmidon-common-header,
  .myrmidon-public-app-header{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    gap:10px!important;
    text-align:center!important;
  }

  #myrmidon-common-header nav,
  .myrmidon-public-app-header nav{
    width:100%!important;
    justify-content:center!important;
  }
}

/* ==========================================
   HEADER PUBLIC RESPONSIVE MYRMIDON
   ========================================== */

@media (max-width: 1200px){

  .myrmidon-public-app-header{
      display:flex !important;
      flex-wrap:wrap !important;
      align-items:center !important;
      justify-content:space-between !important;
      gap:12px !important;
      padding:12px 20px !important;
      min-height:auto !important;
  }

  .myrmidon-public-app-header nav{
      width:100% !important;
      display:flex !important;
      flex-wrap:wrap !important;
      justify-content:center !important;
      gap:10px !important;
      margin-top:8px !important;
  }

  .myrmidon-public-app-header nav a{
      flex:0 0 auto !important;
  }
}

@media (max-width: 900px){

  .myrmidon-public-app-header{
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;
      gap:12px !important;
      text-align:center !important;
      padding:14px !important;
  }

  .myrmidon-public-app-header nav{
      width:100% !important;
      display:flex !important;
      flex-wrap:wrap !important;
      justify-content:center !important;
      gap:8px !important;
  }

  .myrmidon-public-app-header nav a{
      font-size:13px !important;
  }
}