/* ETHNOS R802 — finition géométrique inscription étapes 05 à 08.
   Base canonique : R801.
   Périmètre strict : aération/centrage 05, centrage 06/07/08,
   retours 06/07 sous les panneaux et CTA 06 conforme au bouton orange ETHNOS.
   Aucun contrat métier, API, validation ni JavaScript modifié. */
:root{
  --r802-orange:#ee8d55;
  --r802-orange-top:#ffad7a;
  --r802-orange-dark:#c96d3d;
  --r802-ink:#071826;
}

/* -------------------------------------------------------------------------- */
/* 05 — NOS VALEURS : un peu plus d'air, sans retrouver les grands vides.    */
/* -------------------------------------------------------------------------- */
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .joinCardBody{
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .joinView[data-view="values"]:not([hidden]){
  box-sizing:border-box !important;
  width:100% !important;
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  padding:18px clamp(20px,3vw,54px) 22px !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .valuesWorkspace.valuesWorkspaceR775{
  box-sizing:border-box !important;
  width:min(1480px,100%) !important;
  max-width:1480px !important;
  margin:auto !important;
  padding:34px clamp(22px,2vw,32px) !important;
  gap:16px !important;
  min-height:0 !important;
  height:auto !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .valuesBackOutsideR800{
  width:min(1480px,100%) !important;
  margin:0 auto !important;
}

/* -------------------------------------------------------------------------- */
/* 06 — NOTRE MODÈLE : bloc centré + retour réellement sous le bloc.          */
/* -------------------------------------------------------------------------- */
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .joinCardBody{
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .joinView[data-view="payment"]:not([hidden]){
  box-sizing:border-box !important;
  width:100% !important;
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  padding:18px clamp(20px,3vw,54px) 24px !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentWorkspace.paymentWorkspaceR775{
  box-sizing:border-box !important;
  width:min(1500px,100%) !important;
  max-width:1500px !important;
  margin:0 auto !important;
  flex:0 0 auto !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFooterOutsideR802{
  box-sizing:border-box !important;
  width:min(1500px,100%) !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 auto !important;
  padding:0 !important;
  border:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFooterOutsideR802 .joinBack{
  width:auto !important;
  min-width:210px !important;
  min-height:46px !important;
  height:auto !important;
  padding:0 24px !important;
  font-size:14px !important;
}

/* Le CTA "Poursuivre" reprend explicitement le bouton orange officiel. */
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFreeFooterR775 .joinContinue{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:250px !important;
  min-height:48px !important;
  height:48px !important;
  padding:0 24px !important;
  border:1px solid rgba(255,211,183,.92) !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,var(--r802-orange-top) 0%,var(--r802-orange) 100%) !important;
  color:var(--r802-ink) !important;
  box-shadow:0 1px 0 var(--r802-orange-dark),0 3px 5px rgba(0,0,0,.11) !important;
  filter:none !important;
  font-size:14px !important;
  font-weight:750 !important;
  line-height:1 !important;
  text-shadow:none !important;
  white-space:nowrap !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFreeFooterR775 .joinContinue:not(:disabled):hover{
  filter:brightness(1.025) !important;
  transform:translateY(-1px) !important;
  box-shadow:0 2px 0 var(--r802-orange-dark),0 4px 6px rgba(0,0,0,.12) !important;
}

/* -------------------------------------------------------------------------- */
/* 07 — VÉRIFICATION E-MAIL : panneau centré/compact + Retour sous le panneau. */
/* -------------------------------------------------------------------------- */
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .joinCardBody{
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .joinView[data-view="email-verification"]:not([hidden]){
  box-sizing:border-box !important;
  width:100% !important;
  min-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:14px !important;
  padding:18px clamp(20px,3vw,54px) 24px !important;
  overflow:visible !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .emailVerificationPanel{
  box-sizing:border-box !important;
  width:min(1080px,100%) !important;
  max-width:1080px !important;
  margin:0 auto !important;
  padding:36px 44px !important;
  max-height:none !important;
  overflow:visible !important;
  flex:0 0 auto !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .emailVerificationBackOutsideR802{
  box-sizing:border-box !important;
  width:min(1080px,100%) !important;
  margin:0 auto !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .emailVerificationBackOutsideR802 .joinBack{
  min-width:170px !important;
  min-height:46px !important;
  padding:0 24px !important;
}

/* -------------------------------------------------------------------------- */
/* 08 — VALIDATION : bloc final centré dans la surface utile.                 */
/* -------------------------------------------------------------------------- */
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-validated"] .joinCardBody,
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="official-pending"] .joinCardBody{
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-validated"] .joinView[data-view="email-validated"]:not([hidden]),
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="official-pending"] .joinView[data-view="official-pending"]:not([hidden]){
  box-sizing:border-box !important;
  width:100% !important;
  min-height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px clamp(20px,3vw,54px) !important;
}
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-validated"] .emailValidatedPanel,
body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="official-pending"] .emailValidatedPanel{
  box-sizing:border-box !important;
  width:min(960px,100%) !important;
  max-width:960px !important;
  margin:auto !important;
}

/* -------------------------------------------------------------------------- */
/* Responsive : sur écrans bas, le scroll prend le relais sans couper le haut.*/
/* -------------------------------------------------------------------------- */
@media (max-width:1100px){
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .joinView[data-view="values"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .joinView[data-view="payment"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .joinView[data-view="email-verification"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-validated"] .joinView[data-view="email-validated"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="official-pending"] .joinView[data-view="official-pending"]:not([hidden]){
    padding-left:18px !important;
    padding-right:18px !important;
  }
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .emailVerificationPanel{
    padding:28px 24px !important;
  }
}
@media (max-width:760px){
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFreeFooterR775{
    grid-template-columns:1fr !important;
  }
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .paymentFreeFooterR775 .joinContinue{
    width:100% !important;
    min-width:0 !important;
  }
}
@media (max-height:880px){
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="values"] .joinView[data-view="values"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="payment"] .joinView[data-view="payment"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-verification"] .joinView[data-view="email-verification"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="email-validated"] .joinView[data-view="email-validated"]:not([hidden]),
  body[data-etnos-build="r776"] .joinPage .joinCard[data-current-view="official-pending"] .joinView[data-view="official-pending"]:not([hidden]){
    justify-content:flex-start !important;
  }
}