/* =========================================================
   Waldo-bis — thème inspiré de moffi.io + animations
   (chargé après style.css, il en surcharge les variables et composants)
   ========================================================= */
:root{
  --navy:#074DCE;          /* bleu MOFFI : CTA, liens, mots clés */
  --blue:#074DCE; --blue-d:#053ea8; --ink:#03225C; --violet:#536DFE; --coral:#F44336;
  --lilac:#C5CBEC; --soft:#F4F6FC; --line:#E4E6F5; --muted:#5A6A93;
  --p-lilac:#B494FF; --p-pink:#FF94F4; --p-cyan:#94ECFF; --p-green:#45C6AA;
  --grad-border:linear-gradient(140deg,#B494FF 23%,#FF94F4 39%,#94ECFF 61%,#074DCE 81%);
  --radius:16px; --radius-sm:10px; --btn-radius:10px;
  --shadow:0 12px 32px -18px rgba(3,34,92,.28),0 2px 8px rgba(3,34,92,.05);
  --shadow-lg:0 30px 70px -30px rgba(7,77,206,.35);
  --ease:cubic-bezier(.22,1,.36,1);
}
body{color:#252B36}
h1,h2,h3{color:var(--ink);font-weight:700;letter-spacing:-.025em}
h1{font-size:clamp(2.4rem,5.4vw,4rem);line-height:1.08}
/* Mots surlignés : bleu MOFFI uni (comme moffi.io) */
h1 strong,h2 strong{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--blue)}
.eyebrow{color:var(--blue);letter-spacing:.14em}
.subhead{color:var(--violet)}
a{color:var(--blue)}

/* ---------- Barre de progression de lecture ---------- */
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:100;transform-origin:0 50%;transform:scaleX(0);background:var(--grad-border)}

/* ---------- Header façon moffi.io ---------- */
.site-header{background:rgba(255,255,255,.92);border-bottom:1px solid transparent}
.site-header.scrolled{border-color:var(--line);box-shadow:0 10px 30px -24px rgba(3,34,92,.45)}
.nav-bar{height:80px}
.nav-links>li>a,.menu-btn{font-size:1.02rem;font-weight:500;color:var(--ink);border-radius:8px}
.nav-links>li>a.active,.nav-links>li>.menu-btn.active{color:var(--blue)}
.nav-links>li>a.active::after,.nav-links>li>.menu-btn.active::after{background:var(--blue);height:2px}
.menu-btn .icon{transition:transform .25s var(--ease)}
.has-menu.open>.menu-btn .icon,.has-menu:hover>.menu-btn .icon{transform:rotate(180deg)}
/* Méga-menu */
.submenu.mega{display:grid;grid-template-columns:1fr 1fr;gap:4px;min-width:560px;padding:12px;border-radius:16px;border:1px solid var(--line);transform:translateY(8px) scale(.98);transform-origin:20% 0}
.has-menu.open .submenu.mega,.has-menu:focus-within .submenu.mega{transform:none}
@media (hover:hover){.has-menu:hover .submenu.mega{transform:none}}
.mega-link{display:flex!important;gap:12px;align-items:flex-start;padding:12px!important;border-radius:12px!important;transition:background .2s,transform .2s var(--ease)}
.mega-link:hover{background:var(--soft)}
.mega-link strong{display:block;color:var(--ink);font-weight:700;font-size:.98rem}
.mega-link small{display:block;color:var(--muted);font-size:.84rem;font-weight:400;line-height:1.35;margin-top:2px}
.mega-link.active strong{color:var(--blue)}
.mega-ico{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#EEF1FF,#FBEFFF);color:var(--blue);transition:transform .3s var(--ease)}
.mega-link:hover .mega-ico{transform:scale(1.06)}
.mega-ico .icon{width:22px;height:22px}
.mega-cta{grid-column:1/-1;display:flex!important;align-items:center;gap:10px;margin-top:6px;padding:14px 16px!important;border-radius:12px!important;color:#fff!important;background:linear-gradient(110deg,var(--blue),#536DFE 60%,#B494FF);background-size:200% 100%;font-weight:700;transition:background-position .6s var(--ease)}
.mega-cta:hover{background-position:100% 0;text-decoration:none}
.mega-cta small{font-weight:400;opacity:.85;margin-right:auto}
@media (max-width:920px){.submenu.mega{display:none;grid-template-columns:1fr;min-width:0;padding:0 0 0 4px;transform:none}.has-menu.open .submenu.mega{display:grid}}
html{overflow-x:clip}

/* ---------- Boutons : formes moffi + animations qui donnent envie ---------- */
.btn{border-radius:var(--btn-radius);font-weight:700;letter-spacing:-.005em;position:relative;overflow:hidden;isolation:isolate;transition:transform .25s var(--ease),box-shadow .3s var(--ease),background-color .3s,color .3s}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 10px 24px -10px rgba(7,77,206,.7)}
.btn-primary:hover{background:var(--blue-d);transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(7,77,206,.75)}
.btn-primary:active{transform:translateY(0) scale(.98)}
/* reflet lumineux qui balaie le bouton */
.btn-primary::before{content:"";position:absolute;inset:-2px auto -2px -60%;width:40%;z-index:-1;background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 5s var(--ease) infinite}

@keyframes shine{0%,75%{left:-60%}100%{left:130%}}
.btn-primary .icon{transition:transform .3s var(--ease)}
.btn-primary:hover .icon{transform:translateX(5px)}
/* halo pulsé sur le bouton démo du menu */
.btn-pulse{overflow:visible}
.btn-pulse::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(7,77,206,.55);animation:pulse-ring 2.8s ease-out infinite;z-index:-2}
@keyframes pulse-ring{0%{box-shadow:0 0 0 0 rgba(7,77,206,.5)}70%,100%{box-shadow:0 0 0 14px rgba(7,77,206,0)}}
/* bouton à bordure dégradée animée (comme « Sign in » sur moffi.io) */
.btn-secondary,.btn-ghost,.btn-outline-grad{color:var(--ink);border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad-border) border-box;background-size:100% 100%,250% 250%;animation:grad-move 6s linear infinite}
.btn-secondary:hover,.btn-ghost:hover,.btn-outline-grad:hover{transform:translateY(-2px);box-shadow:0 14px 28px -16px rgba(180,148,255,.9);background:linear-gradient(#FBF9FF,#FBF9FF) padding-box,var(--grad-border) border-box;background-size:100% 100%,250% 250%}
@keyframes grad-move{0%{background-position:0 0,0% 50%}50%{background-position:0 0,100% 50%}100%{background-position:0 0,0% 50%}}
.btn-light{background:#fff;color:var(--blue)}

.btn-light:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(0,0,0,.35)}
.btn-outline-light:hover{transform:translateY(-2px)}
/* onde au clic */
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.55);animation:ripple .7s var(--ease);pointer-events:none;z-index:0}
.btn-secondary .ripple,.btn-ghost .ripple,.btn-outline-grad .ripple{background:rgba(180,148,255,.35)}
@keyframes ripple{to{transform:scale(3.2);opacity:0}}
/* boutons « magnétiques » : la position est pilotée en JS via --tx/--ty */

/* ---------- Pastille d'annonce (hero) ---------- */
.announce{display:inline-flex;align-items:center;gap:10px;flex-wrap:nowrap;max-width:100%;margin:0 0 22px;padding:7px 8px 7px 12px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid var(--line);color:var(--ink);font-size:.9rem;box-shadow:0 8px 24px -16px rgba(7,77,206,.6);backdrop-filter:blur(8px);transition:transform .3s var(--ease),box-shadow .3s}
.announce:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 14px 30px -16px rgba(7,77,206,.7)}
.announce .icon{color:var(--blue);animation:twinkle 2.4s ease-in-out infinite}
.announce strong{padding:4px 10px;border-radius:999px;background:var(--blue);color:#fff;font-size:.82rem;white-space:nowrap}
@keyframes twinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.25) rotate(18deg)}}
.hero-solo .announce{margin-left:auto;margin-right:auto}

/* ---------- Hero : dégradé pastel vivant + grille de « + » ---------- */
.hero{background:#fff;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-20%;z-index:-2;
  background:radial-gradient(40% 50% at 15% 35%,rgba(148,236,255,.45),transparent 70%),
             radial-gradient(35% 45% at 80% 20%,rgba(180,148,255,.45),transparent 70%),
             radial-gradient(30% 40% at 65% 85%,rgba(255,148,244,.30),transparent 70%),
             linear-gradient(180deg,#F5F3FF,#fff 85%);
  animation:aurora 18s ease-in-out infinite alternate}
.hero .plus-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.6;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56'%3E%3Cpath d='M28 23v10M23 28h10' stroke='%23536DFE' stroke-opacity='.22' stroke-width='1.2'/%3E%3C/svg%3E");
  -webkit-mask:radial-gradient(75% 65% at 50% 35%,#000 30%,transparent 80%);mask:radial-gradient(75% 65% at 50% 35%,#000 30%,transparent 80%)}
@keyframes aurora{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(2%,-1.5%,0)}}
.hero-media::before{display:none}
.hero-img,.hero-media .video{border-radius:18px;box-shadow:0 40px 80px -40px rgba(7,77,206,.45),0 0 0 1px rgba(197,203,236,.6)}
.float{animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -6px}}
/* curseur lumineux dans le hero */
.hero .glow{position:absolute;width:520px;height:520px;border-radius:50%;pointer-events:none;z-index:-1;left:var(--gx,50%);top:var(--gy,30%);transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(83,109,254,.16),transparent 60%);transition:left .25s ease-out,top .25s ease-out}
/* titre révélé mot par mot */
.split .w{display:inline-block;opacity:0;transform:translateY(.35em);animation:word-in .7s var(--ease) forwards;animation-delay:calc(var(--i) * 55ms + 100ms)}
@keyframes word-in{to{opacity:1;transform:none}}
.hero .lead,.hero .ctas,.hero .note,.hero .checks,.hero .announce,.hero .award{animation:fade-up .9s var(--ease) both}
.hero .announce{animation-delay:.05s}.hero .lead{animation-delay:.45s}.hero .checks{animation-delay:.55s}.hero .ctas{animation-delay:.65s}.hero .note{animation-delay:.8s}
.hero-media{animation:media-in 1.2s var(--ease) .3s both}
@keyframes fade-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes media-in{from{opacity:0;transform:translateY(40px) scale(.96)}to{opacity:1;transform:none}}

/* ---------- Logos clients dans un cadre givré (moffi.io) ---------- */
.trust{background:rgba(255,255,255,.6);border:1px solid rgba(228,230,245,.9);border-radius:24px;padding:28px 20px 22px;backdrop-filter:blur(10px);box-shadow:0 20px 50px -40px rgba(7,77,206,.6)}
.trust>p{color:var(--ink);font-size:1.05rem}
.client-logo{filter:grayscale(1) sepia(.3) hue-rotate(190deg) saturate(2.2);opacity:.6}

/* ---------- Titres de section : main dessinée qui s'anime ---------- */
.section-head .hand{display:block;height:52px;width:auto;margin:0 0 14px;filter:hue-rotate(-20deg) saturate(1.2)}
.section-head.center .hand{margin-left:auto;margin-right:auto}
.reveal.in .hand,.section-head.in .hand{animation:wave 1.4s var(--ease) .2s both}
@keyframes wave{0%{transform:rotate(0) scale(.6);opacity:0}40%{transform:rotate(-14deg) scale(1.05);opacity:1}60%{transform:rotate(10deg)}80%{transform:rotate(-5deg)}100%{transform:rotate(0) scale(1)}}

/* ---------- Cartes : relief, lumière qui suit la souris ---------- */
.card,.step,.plan,.quote,.post-card,.video-card .video,.term,.keyfacts{border-radius:var(--radius)}
.card{border:1px solid var(--line);box-shadow:0 1px 0 rgba(3,34,92,.03);position:relative;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:rgba(83,109,254,.35)}
.card-icon{background:linear-gradient(135deg,#EEF1FF,#FDEFFF);color:var(--blue);border-radius:12px;transition:transform .5s var(--ease)}
.card:hover .card-icon{transform:scale(1.08)}
.cards.cols-3 .card:nth-child(3n+1),.cards.cols-4 .card:nth-child(4n+1){background:linear-gradient(180deg,#F1FBF8,#fff 60%)}
.cards.cols-3 .card:nth-child(3n+2),.cards.cols-4 .card:nth-child(4n+2){background:linear-gradient(180deg,#FFF3FE,#fff 60%)}
.cards.cols-3 .card:nth-child(3n),.cards.cols-4 .card:nth-child(4n+3){background:linear-gradient(180deg,#FFF8EE,#fff 60%)}
.card-link{color:var(--blue)}
.card-link .icon{transition:transform .3s var(--ease)}
.card:hover .card-link .icon{transform:translateX(5px)}

/* ---------- Sections ---------- */
.bg-soft{background:linear-gradient(180deg,#F7F7FE,#F4F6FC)}
.feature-img{border-radius:18px;box-shadow:0 30px 60px -40px rgba(7,77,206,.45);transition:transform .6s var(--ease)}

.icon-check{background:var(--blue)}
.stat{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.stat dd{background:none;color:var(--blue);-webkit-background-clip:initial;background-clip:initial;font-variant-numeric:tabular-nums}
.step{border:1px solid var(--line);transition:transform .4s var(--ease),box-shadow .4s}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.step-num{background:var(--blue);border-radius:10px}
.keyfacts{border-color:var(--line)}
.keyfacts>div{transition:background .2s}
.keyfacts>div:hover{background:#F8F9FF}

/* Témoignages pastel avec grands guillemets (moffi.io) */
.quote{box-shadow:none;border:1px solid var(--line);transition:transform .4s var(--ease),box-shadow .4s}
.quote:nth-child(3n+1){background:linear-gradient(160deg,#E9FBFF,#F5F2FF)}
.quote:nth-child(3n+2){background:linear-gradient(160deg,#F3EEFF,#FFF0FD)}
.quote:nth-child(3n){background:linear-gradient(160deg,#FFEFFC,#F3F6FF)}
.quote::before{content:"“";left:24px;right:auto;top:6px;font-size:5.5rem;color:#B494FF;opacity:.7}
.quote:nth-child(3n+1)::before{color:#45C6AA}.quote:nth-child(3n)::before{color:#FF94F4}
.quote{padding-top:76px}
.quote blockquote{margin-top:0;font-style:italic;color:#3A4566}
.quote:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.avatar{background:var(--blue)}

/* Tarifs */
.plan{border-radius:20px;transition:transform .4s var(--ease),box-shadow .4s}
.plan:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.plan-hi{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad-border) border-box;background-size:100% 100%,250% 250%;animation:grad-move 6s linear infinite}
.plan-badge{background:var(--blue)}
.price strong{color:var(--blue)}

/* FAQ : ouverture fluide */
.faq details{border-radius:12px;transition:box-shadow .3s,border-color .3s,background .3s}
.faq details:hover{border-color:rgba(83,109,254,.4)}
.faq details[open]{background:#FBFBFF}
.faq summary .icon{color:var(--blue)}
.faq .rich{animation:faq-open .45s var(--ease)}
@keyframes faq-open{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Bandeau CTA final : dégradé animé + bulles */
.cta-band{border-radius:28px;background:linear-gradient(120deg,#074DCE,#3D5BF0 35%,#7A62F6 65%,#074DCE);background-size:300% 300%;animation:band 12s ease-in-out infinite;box-shadow:0 40px 80px -40px rgba(7,77,206,.7)}
.cta-band::before,.cta-band::after{content:"";position:absolute;border-radius:50%;filter:blur(2px);opacity:.35;animation:bubble 9s ease-in-out infinite}
.cta-band::before{width:260px;height:260px;right:-60px;top:-90px;background:radial-gradient(circle,#FF94F4,transparent 65%)}
.cta-band::after{width:320px;height:320px;left:-100px;bottom:-140px;background:radial-gradient(circle,#94ECFF,transparent 65%);animation-delay:-4s}
.cta-band>*{position:relative;z-index:1}
.cta-band h2 strong{color:#FFE27A}
@keyframes band{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes bubble{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,20px) scale(1.15)}}

/* Contact */
.contact-card{border-radius:24px;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad-border) border-box;background-size:100% 100%,250% 250%;animation:grad-move 8s linear infinite}

/* Vidéos */
.video-play{background:var(--blue);color:#fff}
.video-play::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(255,255,255,.7);animation:pulse-ring-w 2.2s ease-out infinite}
@keyframes pulse-ring-w{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.5);opacity:0}}
.video-card .video{transition:transform .4s var(--ease),box-shadow .4s}
.video-card:hover .video{transform:translateY(-5px);box-shadow:var(--shadow-lg)}

/* Blog */
.post-card{transition:transform .45s var(--ease),box-shadow .45s}
.post-card:hover{transform:translateY(-4px)}
.post-img{overflow:hidden;display:block}
.post-img img{transition:transform .8s var(--ease)}
.post-card:hover .post-img img{transform:scale(1.06)}
.inline-cta{background:linear-gradient(120deg,#074DCE,#536DFE);border-radius:20px}

/* Glossaire */
.chip{background:#fff;border:1px solid var(--line);transition:all .25s var(--ease)}
.chip:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.term{transition:transform .3s var(--ease),box-shadow .3s}
.term:hover{box-shadow:var(--shadow)}

/* Footer */
.site-footer{background:#03225C}

/* CTA mobile collant */
.sticky-cta{border-radius:14px}

/* ---------- Apparitions au scroll (variantes) ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0s)}
.reveal.from-left{transform:translateX(-24px)}
.reveal.from-right{transform:translateX(24px)}
.reveal.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal,.split .w{opacity:1!important;transform:none!important;filter:none!important}
}

.mega-cta .icon{color:#fff;transition:transform .3s var(--ease)}
.mega-cta:hover .icon{transform:translateX(5px)}
@media (max-width:640px){.announce{flex-wrap:wrap;border-radius:16px}}


/* =========================================================
   Lisibilité au survol : chaque bouton garde un contraste fort
   (règles volontairement spécifiques pour écraser style.css)
   ========================================================= */
a.btn,a.btn:hover,a.btn:focus-visible,button.btn:hover{text-decoration:none}
a.btn-primary,a.btn-primary:visited{color:#fff}
a.btn-primary:hover,a.btn-primary:focus-visible{color:#fff;background:#053ea8}
a.btn-secondary,a.btn-ghost,a.btn-outline-grad{color:var(--ink)}
a.btn-secondary:hover,a.btn-ghost:hover,a.btn-outline-grad:hover,
a.btn-secondary:focus-visible,a.btn-ghost:focus-visible,a.btn-outline-grad:focus-visible{color:var(--ink)}
a.btn-light,a.btn-light:hover,a.btn-light:focus-visible{color:#074DCE;background:#fff}
a.btn-outline-light{color:#fff;border-color:rgba(255,255,255,.7);background:transparent;animation:none}
a.btn-outline-light:hover,a.btn-outline-light:focus-visible{color:#074DCE;background:#fff;border-color:#fff}
/* boutons secondaires posés sur fond bleu (encart CTA des articles, bandeau final) */
.inline-cta a.btn-secondary,.cta-band a.btn-secondary{color:#fff;background:transparent;border:2px solid rgba(255,255,255,.7);animation:none}
.inline-cta a.btn-secondary:hover,.cta-band a.btn-secondary:hover,
.inline-cta a.btn-secondary:focus-visible,.cta-band a.btn-secondary:focus-visible{color:#074DCE;background:#fff;border-color:#fff;box-shadow:none}
.inline-cta a.btn-primary{background:#fff;color:#074DCE}
.inline-cta a.btn-primary:hover{background:#EEF2FF;color:#053ea8}
/* menu : bandeau « Réserver une démo » du méga-menu */
.submenu a.mega-cta,.submenu a.mega-cta:visited{color:#fff;background:linear-gradient(110deg,#074DCE,#3D5BF0 60%,#6A5CF5);background-size:200% 100%}
.submenu a.mega-cta:hover,.submenu a.mega-cta:focus-visible{color:#fff;background:linear-gradient(110deg,#053ea8,#2E4BE0 60%,#5A4DE8);background-size:200% 100%;text-decoration:none}
.submenu a.mega-cta small{color:rgba(255,255,255,.85)}
/* liens du menu et du sélecteur de langue */
.nav-links>li>a:hover,.nav-links>li>.menu-btn:hover{color:var(--blue);background:#EEF2FF}
.submenu a:hover,.submenu a:focus-visible{color:var(--ink);background:#F2F4FD;text-decoration:none}
.submenu a[aria-current]:hover{color:var(--blue)}
/* pastille d'annonce et autres liens-boutons */
a.announce:hover{color:var(--ink)}
a.announce:hover strong{background:#053ea8;color:#fff}
.chip:hover,.chip:focus-visible{color:#fff;background:#074DCE;border-color:#074DCE}
.sticky-cta a.btn-primary:hover{color:#fff}
.site-footer a:hover{color:#fff;text-decoration:underline}
.card-link:hover{color:#053ea8}
.btn .ripple{z-index:-1}


/* =========================================================
   Les deux CTA toujours visibles : « Réserver une démo » + « Essayer gratuitement »
   ========================================================= */
/* Desktop : les deux boutons restent dans le menu à toutes les largeurs */
.nav-try{display:inline-flex!important}
.nav-try .lbl-short{display:none}
@media (max-width:1240px){
  .nav-try .lbl-long{display:none}.nav-try .lbl-short{display:inline}
  .nav{gap:14px}.nav-links>li>a,.menu-btn{padding:8px 9px;font-size:.96rem}
  .nav-actions{gap:8px}.nav-actions .btn-sm{padding:.55em .9em}
}
@media (max-width:1040px){.lang-btn span{display:none}}
/* Mobile / tablette : barre fixe en bas de l'écran avec les deux boutons, visible dès l'arrivée */
@media (max-width:920px){
  .sticky-duo{display:flex!important;transform:none!important;left:10px;right:10px;bottom:10px;padding:8px;gap:8px;justify-content:stretch}
  .sticky-duo .btn{flex:1;justify-content:center;padding:.8em .6em;font-size:.92rem;white-space:nowrap}
  body{padding-bottom:76px}
  .cookie{bottom:86px}
}
@media (min-width:921px){.sticky-duo{display:none!important}}
.page-404 .sticky-duo{display:none!important}

/* Menu mobile : le flou du header créait un bloc conteneur qui écrasait le menu à 48 px de haut */
@media (max-width:920px){
  .site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}
  .nav{position:fixed;top:80px;left:0;right:0;bottom:0;height:calc(100dvh - 80px);overscroll-behavior:contain;padding-bottom:110px}
  .nav-links>li{border-bottom:1px solid var(--line)}
  .lang .submenu{display:none}.lang.open .submenu{display:block}
  .nav-actions .nav-try .lbl-long{display:inline}.nav-actions .nav-try .lbl-short{display:none}
  .lang-btn span{display:inline}
  .mega-link{padding:10px 6px!important}
  body.menu-open .sticky-duo{display:none!important}
}

/* =========================================================
   Liens dans le contenu : toujours bien visibles
   ========================================================= */
main .rich a:not(.btn):not(.card-link), main .lead a:not(.btn), main .note a:not(.btn), main .keyfacts a,
main .table-wrap a, main .faq a, main .term a, main .tldr a, main .checks a, main .subhead a, main figcaption a, main .post-meta a{
  color:var(--link,#3B39C9);font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;
  text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);transition:color .15s,text-decoration-color .15s}
main .rich a:not(.btn):not(.card-link):hover, main .lead a:not(.btn):hover, main .note a:not(.btn):hover, main .keyfacts a:hover,
main .table-wrap a:hover, main .faq a:hover, main .term a:hover, main .tldr a:hover, main .checks a:hover, main figcaption a:hover, main .post-meta a:hover{
  color:var(--link-hover,#0D048B);text-decoration-color:currentColor}
/* sur fond foncé (bandeau final, encart des articles…) : liens blancs soulignés */
main .cta-band a:not(.btn), main .inline-cta a:not(.btn), main .bg-navy a:not(.btn){
  color:#fff!important;font-weight:700;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.65)}
main .cta-band a:not(.btn):hover, main .inline-cta a:not(.btn):hover, main .bg-navy a:not(.btn):hover{color:#FFE27A!important;text-decoration-color:#FFE27A}

:root{--link:#074DCE;--link-hover:#03225C}