/* Connexion : mise en page intégrale sur une hauteur d'écran.
   La page défile seulement si le contenu ne peut réellement pas tenir
   (petit écran, clavier virtuel ou formulaire de demande d'accès déployé). */
html.login-fullscreen{height:100%}
body.login-fullscreen{
  min-height:100vh;
  min-height:100dvh;
  height:100vh;
  height:100dvh;
  display:flex;
  flex-direction:column;
  overflow-x:clip;
  overflow-y:auto;
}
body.login-fullscreen>.header{
  flex:0 0 auto;
  height:clamp(64px,10dvh,88px);
}
body.login-fullscreen>main{
  flex:1 0 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
  gap:clamp(12px,2.5dvh,26px);
  padding:clamp(10px,2dvh,25px) 0;
  margin:0 auto;
}
body.login-fullscreen .hero{
  flex:0 0 auto;
  margin:0 auto;
}
body.login-fullscreen .hero h1{
  font-size:clamp(35px,6vw,58px);
}
body.login-fullscreen .hero p{margin-top:7px}
body.login-fullscreen #login-section{
  flex:0 0 auto;
  margin:0 auto;
  padding:clamp(18px,2.5dvh,25px);
}
body.login-fullscreen #login-section h2{
  margin-bottom:clamp(8px,1.6dvh,16px);
}
body.login-fullscreen #login-form{
  gap:clamp(9px,1.5dvh,16px);
}
body.login-fullscreen .access-request-entry{margin-top:clamp(9px,1.6dvh,17px)}
body.login-fullscreen>footer{
  flex:0 0 auto;
  padding:10px 12px;
}
@media (max-height:660px){
  body.login-fullscreen>main{padding:8px 0;gap:9px}
  body.login-fullscreen .hero h1{font-size:38px}
  body.login-fullscreen .hero p{font-size:13px}
  body.login-fullscreen #login-section{padding:14px 19px}
  body.login-fullscreen #login-form{gap:9px}
  body.login-fullscreen #login-section .field input{height:41px}
  body.login-fullscreen>footer{padding:6px 12px}
}
@media (max-width:640px){
  body.login-fullscreen>main{width:calc(100% - 28px)}
  body.login-fullscreen .hero h1{font-size:clamp(35px,9vw,47px)}
  body.login-fullscreen .hero p{font-size:13px}
}