/* ============================================================================
   Webena V9 · entrée + pied de page
   Inspiré de la V2, sans réintroduire l'ancien système de navigation.
   ============================================================================ */

/* Petite animation d'entrée, une fois par session. */
.wb-v9-entry{
  position:fixed;inset:0;z-index:1200;
  display:grid;place-items:center;
  background:#F7F3EF;
  opacity:1;visibility:visible;
  transition:opacity .78s cubic-bezier(.22,.8,.3,1),visibility .78s;
}
.wb-v9-entry.is-out{opacity:0;visibility:hidden;pointer-events:none}
.wb-v9-entry__in{width:min(72vw,330px);text-align:center}
.wb-v9-entry img{
  display:block;width:100%;height:auto;
  opacity:0;transform:translateY(9px) scale(.985);
  animation:wbV9Logo 1.15s cubic-bezier(.22,.8,.3,1) .12s forwards;
}
.wb-v9-entry__rule{
  width:0;height:1px;margin:24px auto 0;
  background:#C8A36A;
  animation:wbV9Rule 1.05s cubic-bezier(.22,.8,.3,1) .42s forwards;
}
body.wb-v9-entry-lock{overflow:hidden}
@keyframes wbV9Logo{to{opacity:1;transform:none}}
@keyframes wbV9Rule{to{width:100%}}

/* Pied de page Webena. */
.wb-v9-footer{
  width:100%;background:#1F1F1F;color:#F7F3EF;
  padding:clamp(52px,7vw,86px) clamp(20px,4vw,64px) 30px;
}
.wb-v9-footer__inner{width:min(100%,1440px);margin:0 auto}
.wb-v9-footer__grid{
  display:grid;grid-template-columns:minmax(260px,1.45fr) repeat(3,minmax(150px,.8fr));
  gap:clamp(32px,5vw,72px);align-items:start;
}
.wb-v9-footer__brand img{
  display:block;width:auto;height:clamp(54px,5.5vw,72px);
  filter:brightness(0) invert(1);opacity:.98;
}
.wb-v9-footer__brand p{
  margin:20px 0 0;max-width:37ch;
  font:400 13px/1.8 var(--wb-sans,Montserrat,Arial,sans-serif);
  color:rgba(247,243,239,.66);
}
.wb-v9-footer h2{
  margin:3px 0 16px;font:500 10px/1.2 var(--wb-sans,Montserrat,Arial,sans-serif);
  letter-spacing:.22em;text-transform:uppercase;color:#A89F95;
}
.wb-v9-footer nav{display:grid;gap:4px}
.wb-v9-footer a{
  width:max-content;max-width:100%;padding:6px 0;
  color:rgba(247,243,239,.78);text-decoration:none;
  font:400 13px/1.45 var(--wb-sans,Montserrat,Arial,sans-serif);
  transition:color .28s ease;
}
.wb-v9-footer a:hover,.wb-v9-footer a:focus-visible{color:#C8A36A}
.wb-v9-footer__bar{
  margin-top:clamp(38px,5vw,58px);padding-top:20px;
  border-top:1px solid rgba(247,243,239,.13);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  color:rgba(247,243,239,.46);
  font:400 10.5px/1.6 var(--wb-sans,Montserrat,Arial,sans-serif);
  letter-spacing:.025em;
}
@media(max-width:900px){
  .wb-v9-footer__grid{grid-template-columns:1.35fr 1fr 1fr;}
  .wb-v9-footer__brand{grid-column:1/-1;max-width:520px}
}
@media(max-width:620px){
  .wb-v9-footer{padding-left:22px;padding-right:22px}
  .wb-v9-footer__grid{grid-template-columns:1fr 1fr;gap:30px 22px}
  .wb-v9-footer__brand{grid-column:1/-1}
  .wb-v9-footer__grid>div:last-child{grid-column:1/-1}
  .wb-v9-footer__bar{display:grid;gap:6px}
}
@media(prefers-reduced-motion:reduce){
  .wb-v9-entry{display:none!important}
  .wb-v9-entry img,.wb-v9-entry__rule{animation:none!important}
}


/* ============================================================================
   V9.1 · alignements + bloc fondateur
   ============================================================================ */

/* Le logo remplace le portrait provisoire sur l'accueil et la page Histoire.
   Aucun cadre ni fond : le logo reste posé directement sur la couleur de section. */
.founder-photo.founder-photo--logo{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  padding:clamp(12px,2vw,28px)!important;
  background:transparent!important;
  border:0!important;
  text-align:center!important;
}
.founder-photo.founder-photo--logo img{
  display:block!important;
  width:min(86%,430px)!important;
  height:auto!important;
  margin:0 auto!important;
  object-fit:contain!important;
}

/* Entrée : centrage réel du logo et de son trait, indépendamment de la taille. */
.wb-v9-entry__in{
  display:grid;
  justify-items:center;
  align-items:center;
  width:min(76vw,340px);
  margin:auto;
}
.wb-v9-entry img{
  width:100%;
  max-width:340px;
  margin-inline:auto;
}
.wb-v9-entry__rule{justify-self:center}

/* Footer : mêmes axes pour toutes les colonnes et aucun décalage de contenu. */
.wb-v9-footer,.wb-v9-footer *{box-sizing:border-box}
.wb-v9-footer__inner{width:min(100%,1360px);margin-inline:auto}
.wb-v9-footer__grid>div{min-width:0;align-self:start}
.wb-v9-footer__brand>a{display:inline-flex;align-items:center;justify-content:flex-start}
.wb-v9-footer__brand img{margin:0}
.wb-v9-footer nav{justify-items:start;align-content:start}
.wb-v9-footer h2,.wb-v9-footer a{margin-left:0;margin-right:0}

/* Tablette : le bloc marque est centré, les trois colonnes restent équilibrées. */
@media(max-width:900px){
  .wb-v9-footer__brand{text-align:center;justify-self:center;width:min(100%,560px)}
  .wb-v9-footer__brand>a{justify-content:center}
  .wb-v9-footer__brand img{margin-inline:auto}
  .wb-v9-footer__brand p{margin-left:auto;margin-right:auto}
  .wb-v9-footer__grid>div:not(.wb-v9-footer__brand){justify-self:center;width:max-content;max-width:100%}
}

/* Mobile : un axe central unique évite les menus visuellement décalés. */
@media(max-width:620px){
  .wb-v9-footer__grid{grid-template-columns:1fr!important;text-align:center}
  .wb-v9-footer__brand,.wb-v9-footer__grid>div,.wb-v9-footer__grid>div:last-child{
    grid-column:1!important;
    justify-self:center!important;
    width:100%!important;
  }
  .wb-v9-footer nav{justify-items:center}
  .wb-v9-footer a{width:max-content;margin-inline:auto}
  .wb-v9-footer__bar{justify-items:center;text-align:center}
  .founder-photo.founder-photo--logo{padding:10px 0!important}
  .founder-photo.founder-photo--logo img{width:min(82%,300px)!important}
}


/* ============================================================================
   V9.2 · centrage CTA + Duafe Histoire
   ============================================================================ */

/* Le dernier CTA de l'accueil possède un axe central indépendant du reste
   des grilles de la page : titre, texte et lien partagent exactement le même centre. */
.home-contact{
  width:100%!important;
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
}
.home-contact>div{
  width:min(100%,900px)!important;
  max-width:900px!important;
  margin-inline:auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}
.home-contact h2{
  width:min(100%,13ch)!important;
  margin:0 auto!important;
  text-align:center!important;
}
.home-contact p{
  width:min(100%,62ch)!important;
  max-width:62ch!important;
  margin:24px auto 0!important;
  text-align:center!important;
}
.home-contact a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  margin:18px auto 0!important;
}

/* Histoire : le Duafe remplace la photo de mariage, sans carte ni fond ajouté. */
.page-photo.page-photo--duafe{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:auto!important;
  min-height:clamp(260px,34vw,470px)!important;
  aspect-ratio:auto!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
}
.page-photo.page-photo--duafe img{
  display:block!important;
  width:min(58%,320px)!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:auto!important;
}
@media(max-width:700px){
  .home-contact h2{width:min(100%,11ch)!important}
  .home-contact p{width:min(100%,46ch)!important}
  .page-photo.page-photo--duafe{min-height:220px!important}
  .page-photo.page-photo--duafe img{width:min(48vw,230px)!important}
}