@font-face{font-family:"Malinton";font-weight:100;font-display:swap;src:url(polices/malinton-thin.woff2) format("woff2")}
@font-face{font-family:"Malinton";font-weight:300;font-display:swap;src:url(polices/malinton-light.woff2) format("woff2")}
@font-face{font-family:"Malinton";font-weight:700;font-display:swap;src:url(polices/malinton-bold.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:400;font-display:swap;src:url(polices/dmsans-regular.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:500;font-display:swap;src:url(polices/dmsans-medium.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-weight:700;font-display:swap;src:url(polices/dmsans-bold.woff2) format("woff2")}
/* Charte graphique V2 de Causer Consentement : violet #664BF2, blanc, teintes 80/40/10 %, secondaires #1B3683 et #5BBEEE */
:root{
  --violet:#664bf2; --violet-80:#856ff5; --violet-40:#c2b7fa; --violet-10:#f0edfe;
  --nuit:#1b3683; --ciel:#5bbeee; --encre:#16121f; --doux:#4a4760; --blanc:#fff;
  --trait:2.5px solid var(--encre);
  --titre:"Malinton","DM Sans",system-ui,sans-serif; --texte:"DM Sans",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font-family:var(--texte);color:var(--encre);background:var(--blanc);line-height:1.55;font-size:17px}
a{color:inherit}
img{max-width:100%;display:block}
.bord{max-width:1160px;margin:0 auto;padding-left:20px;padding-right:20px}
.cache{position:absolute;width:0;height:0;overflow:hidden}
.fin{font-weight:100}

/* Fond liquide recréé en code (fond-code.js), image d'origine en secours */
.liquide-sec{position:relative;isolation:isolate;overflow:hidden;background:var(--violet) url(fond/liquide.webp) center/cover;color:#fff}
.liquide-sec>canvas.liquide{position:absolute;inset:0;width:100%;height:100%;z-index:-1;opacity:0;transition:opacity .6s}
.liquide-sec>canvas.liquide.pret{opacity:1}

/* Menu */
.menu{position:sticky;top:0;z-index:10;background:var(--violet);color:#fff;border-bottom:var(--trait)}
.menu .bord{display:flex;align-items:center;gap:22px;min-height:68px}
.logo{display:block;line-height:0;color:inherit}
.logo svg{height:36px;width:auto}
.menu nav{display:flex;gap:24px;margin-left:auto;font-weight:500;font-size:15px}
.menu nav a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.menu nav a:hover{border-color:currentColor}

.btn{display:inline-block;font-family:var(--texte);font-weight:700;font-size:16px;text-decoration:none;padding:12px 24px;border-radius:999px;border:var(--trait);background:#fff;color:var(--encre);cursor:pointer;transition:transform .15s}
.btn:hover{transform:rotate(-2deg) scale(1.04)}
.btn.noir{background:var(--encre);color:#fff}
.btn.violet{background:var(--violet);color:#fff}
.btn.lilas{background:var(--violet-40)}

.maquette{position:fixed;left:12px;bottom:12px;z-index:30;background:var(--encre);color:#fff;font-size:12px;padding:6px 12px;border-radius:999px}
.maquette a{color:var(--violet-40)}

@media (max-width:900px){
  .menu nav{display:none}
  .menu .btn{margin-left:auto;padding:9px 16px;font-size:14px}
  .logo svg{height:30px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
