/* ——— Footer de l'identité (Michel, 16/10, capture à l'appui) ———
   Fond nuit, la texture des affiches tramée en deux bleus (assets/ui/foot-chaos.png, outils/texture-footer.py) : fixe,
   sans animation, un peu chaotique. Le grand mot-symbole crème, la phrase, l'adresse, puis les liens.
   Tout s'aligne sur la marge de la page (.page-width), comme le header et le contenu. */
.site-footer.pied{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;
 min-height:100svh;margin-top:clamp(70px,9vw,120px);padding:0;background:#08084b;color:#f2f3fe}
.site-footer.pied::before,.site-footer.pied::after{display:none!important}
.pied-trame{position:absolute;inset:0;z-index:-1;background:#08084b url(../assets/ui/foot-chaos.png) 50% 50%/cover no-repeat;image-rendering:pixelated}
.pied-inner{width:100%;padding-top:clamp(110px,14vh,170px);padding-bottom:clamp(26px,3.4vh,38px)}
/* Le mot-symbole, en crème : la forme vient du SVG d'origine, rien n'est redessiné. */
.pied-logo{display:block;width:min(68vw,1180px)}
.pied-logo-signe{display:block;aspect-ratio:2228/651;background:#f0ebe5;
 -webkit-mask:url(../assets/zokomo-ink.svg) 0 0/100% 100% no-repeat;mask:url(../assets/zokomo-ink.svg) 0 0/100% 100% no-repeat}
.pied-phrase{margin:clamp(56px,8vh,100px) 0 0;font-size:clamp(18px,1.55vw,25px);line-height:1.3;color:#9396d6;letter-spacing:-.01em}
.pied-mail{display:inline-block;margin-top:clamp(28px,4vh,52px);font-family:"Inter Display",Arial,sans-serif;font-weight:600;
 font-size:clamp(40px,6.1vw,104px);line-height:1;letter-spacing:-.055em;color:#f2f3fe;text-decoration:none;overflow-wrap:anywhere;transition:color .3s ease}
.pied-mail:hover,.pied-mail:focus-visible{color:#ff4fa8}
.pied-bas{display:flex;justify-content:space-between;align-items:baseline;gap:24px 40px;flex-wrap:wrap;margin-top:clamp(36px,5vh,60px);padding-top:clamp(28px,3.6vh,44px);border-top:1px solid rgb(186 191 250 / .16)}
.pied-bas nav{display:flex;flex-wrap:wrap;gap:12px clamp(22px,2.6vw,46px);font-size:clamp(15px,1.15vw,19px)}
.pied-bas nav a{color:#f2f3fe;text-decoration:none;transition:color .25s ease}
.pied-bas nav a:hover,.pied-bas nav a:focus-visible{color:#ff4fa8}
.pied-signature{display:flex;align-items:baseline;gap:24px;font-size:clamp(15px,1.15vw,19px);color:#babffa}
.pied-signature button{border:0;background:none;padding:0;font:inherit;font-size:.78em;color:#9396d6;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.pied-signature button:hover{color:#f2f3fe}
.site-footer.pied :focus-visible{outline:2px solid #ff4fa8;outline-offset:4px}
@media(max-width:760px){
 .site-footer.pied{min-height:auto}
 .pied-inner{padding-top:90px}
 .pied-logo{width:100%}
 .pied-phrase{margin-top:44px}
 .pied-mail{font-size:clamp(28px,9.4vw,46px)}
 .pied-bas{flex-direction:column;align-items:flex-start}
 .pied-signature{flex-direction:column;gap:12px}
}