/* ===== CANONICAL HEADER/FOOTER (unified) — data-canonical-hf ===== */
:root{--ease:cubic-bezier(.22,1,.36,1);--shadow-xs:0 1px 2px rgba(10,14,10,.04);--shadow-green:0 10px 32px rgba(22,163,74,.28);--radius-pill:999px;--peach:#fb923c;}
.nav{position:sticky;top:0;z-index:90;background:rgba(254,255,254,.85);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid transparent;transition:border-color .2s,background .2s;padding-top:env(safe-area-inset-top);}
[data-theme="dark"] .nav{background:rgba(10,14,10,.85);}
.nav__row{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1200px;margin:0 auto;padding:14px max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left));}
.nav__brand{display:flex;align-items:center;gap:10px;text-decoration:none;}
.nav__brand img{height:36px;width:auto;}
.logo-dark{display:none;}
[data-theme="dark"] .logo-light{display:none;}
[data-theme="dark"] .logo-dark{display:block;}
.nav__links{display:none;gap:4px;}
.nav__link{padding:10px 14px;border-radius:var(--radius-pill);font-weight:600;font-size:.92rem;color:var(--ink-2);transition:background .15s,color .15s;text-decoration:none;}
.nav__link:hover{background:var(--gray-soft);color:var(--ink);}
.nav__link[aria-current="page"]{background:var(--green-soft);color:var(--green-dark);}
.nav__right{display:flex;align-items:center;gap:8px;}
.nav__icon-btn{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:background .15s;color:var(--ink-2);background:none;border:none;cursor:pointer;}
.nav__icon-btn:hover{background:var(--gray-soft);}
.nav__icon-btn svg{width:20px;height:20px;}
.nav__cta{display:none;}
.nav__burger{display:inline-flex;flex-direction:column;gap:5px;padding:12px;background:none;border:none;cursor:pointer;}
.nav__burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .3s;}
.nav.menu-open .nav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav.menu-open .nav__burger span:nth-child(2){opacity:0;}
.nav.menu-open .nav__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;min-height:48px;border-radius:var(--radius-pill);font-weight:700;font-size:.95rem;transition:transform .2s var(--ease),box-shadow .2s,background .2s;white-space:nowrap;user-select:none;text-decoration:none;cursor:pointer;border:none;}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--green);color:#fff;box-shadow:var(--shadow-green);}
.btn-primary:hover{background:var(--green-dark);}
.btn-ghost{background:var(--card);color:var(--ink);border:1.5px solid var(--border);}
.btn-ghost:hover{border-color:var(--ink);}
.btn-lg{padding:18px 32px;font-size:1.05rem;min-height:56px;}
.drawer{position:fixed;top:64px;right:0;bottom:0;left:0;width:100%;max-width:100%;background:var(--bg);z-index:130;transform:translateX(100%);transition:transform .35s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;overflow:hidden;}
.drawer.open{transform:translateX(0);}
.nav.menu-open ~ .ck, body.drawer-open .ck{display:none !important;}
.drawer__backdrop{position:fixed;top:64px;right:0;bottom:0;left:0;background:rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .3s;z-index:129;}
.drawer__social-section{padding:16px 20px 12px;border-bottom:1px solid var(--border);flex-shrink:0;}
.drawer__section-label{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--gray);margin-bottom:10px;}
.drawer__social{display:flex;gap:8px;justify-content:space-between;}
.drawer__social a{width:100%;max-width:56px;height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;background:var(--gray-soft);color:var(--ink-2);text-decoration:none;transition:background .15s,color .15s,transform .15s;flex:1;}
.drawer__social a:hover,.drawer__social a:focus-visible{background:var(--green-soft);color:var(--green-dark);transform:translateY(-2px);outline:none;}
.drawer__social svg{width:22px;height:22px;fill:currentColor;}
.drawer__nav-primary{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:4px 0;}
.drawer__nav-primary a{display:flex;align-items:center;gap:14px;padding:14px 20px;font-size:1.1rem;font-weight:600;color:var(--ink);border-bottom:1px solid var(--border);min-height:56px;text-decoration:none;font-family:inherit;}
.drawer__nav-primary a[aria-current="page"]{background:var(--green-soft);color:var(--green-dark);border-left:4px solid var(--green);padding-left:16px;}
.drawer__nav-primary a:hover,.drawer__nav-primary a:focus-visible{background:var(--gray-soft);outline:none;}
.drawer__nav-icon{width:24px;height:24px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;color:var(--green-dark);}
.drawer__nav-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.drawer__nav-chevron{margin-left:auto;color:var(--gray);font-size:1.4rem;line-height:1;font-family:-apple-system,system-ui,sans-serif;}
.drawer__nav-secondary{padding:14px 20px;border-top:1px solid var(--border);flex-shrink:0;}
.drawer__nav-secondary a{display:block;padding:8px 0;font-size:.98rem;color:var(--ink-2);min-height:40px;line-height:24px;text-decoration:none;font-family:inherit;font-weight:500;}
.drawer__nav-secondary a:hover,.drawer__nav-secondary a:focus-visible{color:var(--green-dark);outline:none;}
.drawer__legal{padding:12px 20px;border-top:1px solid var(--border);text-align:center;font-size:.85rem;color:var(--gray);flex-shrink:0;}
.drawer__legal a{color:var(--gray);text-decoration:none;padding:6px 4px;display:inline-block;min-height:32px;line-height:20px;}
.drawer__legal a:hover,.drawer__legal a:focus-visible{color:var(--ink);outline:none;}
.drawer__cta-sticky{padding:12px 20px;padding-bottom:max(14px,env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px;flex-shrink:0;}
.drawer__cta-sticky .btn{width:100%;}
body.drawer-open{overflow:hidden;position:fixed;width:100%;top:0;left:0;right:0;}
.footer{background:#0b0f0d;color:rgba(255,255,255,.78);padding:56px 0 24px;padding-bottom:max(24px,env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden;text-align:left;margin-top:64px;}
.footer::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--green),#4ade80,var(--peach),var(--green));background-size:200% 100%;animation:footerSheen 8s linear infinite;}
@keyframes footerSheen{to{background-position:200% 0;}}
.footer::after{content:"";position:absolute;bottom:-120px;left:50%;transform:translateX(-50%);width:600px;height:300px;background:radial-gradient(circle,rgba(22,163,74,.16),transparent 70%);pointer-events:none;}
[data-theme="dark"] .footer{background:#14191c;border-top-color:rgba(255,255,255,.12);}
.footer .wrap{max-width:1200px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-right)) 0 max(20px,env(safe-area-inset-left));position:relative;z-index:1;}
.footer__grid{display:grid;grid-template-columns:1fr;gap:32px;margin-bottom:40px;}
.footer__brand{display:flex;align-items:center;gap:10px;color:#fff;font-family:'Bricolage Grotesque',sans-serif;font-weight:900;font-size:1.4rem;margin-bottom:12px;}
.footer__brand img{height:32px;width:auto;}
.footer__desc{color:rgba(255,255,255,.7);font-size:.9rem;line-height:1.6;margin-bottom:18px;}
.footer__social{display:flex;gap:10px;margin-bottom:24px;}
.footer__social a{width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.07);display:inline-flex;align-items:center;justify-content:center;color:#fff;transition:transform .2s var(--ease),background .25s,box-shadow .25s;}
[data-theme="dark"] .footer__social a{background:rgba(255,255,255,.12);}
.footer__social a svg{width:20px;height:20px;fill:currentColor;}
.footer__social a:hover{transform:translateY(-3px);}
.footer__social a.ig:hover{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);box-shadow:0 10px 24px rgba(220,39,67,.45);}
.footer__social a.fb:hover{background:#1877f2;box-shadow:0 10px 24px rgba(24,119,242,.45);}
.footer__social a.tt:hover{background:#010101;color:#25f4ee;box-shadow:0 10px 24px rgba(0,0,0,.6);}
.footer__social a.yt:hover{background:#ff0000;box-shadow:0 10px 24px rgba(255,0,0,.45);}
.footer__social a.li:hover{background:#0a66c2;box-shadow:0 10px 24px rgba(10,102,194,.45);}
.footer__col h4{color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px;}
.footer__col a{display:block;padding:6px 0;font-size:.92rem;color:rgba(255,255,255,.7);transition:color .15s;text-decoration:none;}
.footer__col a:hover{color:#fff;}
.footer__bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;flex-direction:column;gap:12px;font-size:.82rem;text-align:center;align-items:center;}
.footer__bottom .pill{display:inline-flex;align-items:center;gap:6px;background:rgba(34,197,94,.12);color:#86efac;padding:5px 12px;border-radius:999px;font-weight:600;}
.footer__legal-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;}
.footer__legal-links a{color:rgba(255,255,255,.78);transition:color .15s;text-decoration:none;}
.footer__legal-links a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.footer__legal-links span{opacity:.4;}
.footer__love{display:inline-flex;align-items:center;gap:5px;}
.footer__heart{display:inline-block;animation:heartbeat 1.6s ease-in-out infinite;}
@keyframes heartbeat{0%,100%{transform:scale(1);}12%{transform:scale(1.25);}24%{transform:scale(1);}36%{transform:scale(1.18);}}
@media (min-width:768px){.nav__links{display:flex;}.nav__cta{display:inline-flex;}.nav__burger{display:none;}.drawer{max-width:380px;left:auto;border-left:1px solid var(--border);}.nav.menu-open ~ .drawer__backdrop{opacity:1;pointer-events:auto;}.footer__grid{grid-template-columns:2fr 1fr 1fr 1fr 1fr;}.footer__bottom{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px 20px;text-align:left;}.footer__legal-links{order:-1;flex-basis:100%;}}
@media (prefers-reduced-motion:reduce){.drawer{transition:none;}.footer__heart{animation:none;}.footer::before{animation:none;}}
/* ===== CANONICAL HEADER/FOOTER END ===== */

/* ===== COOKIE BANNER (Loi 25) ===== */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:120;background:var(--card,#fff);color:var(--ink,#0a0e0a);border:1px solid var(--border,#e5e7eb);border-radius:22px;box-shadow:0 24px 60px rgba(10,14,10,.20);padding:18px;display:flex;flex-direction:column;gap:14px;transform:translateY(180%);transition:transform .5s cubic-bezier(.22,1,.36,1);}

/* ===== AUDIT-AB: table-wrap mobile + reveal + related (v20260613) ===== */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:18px 0;border-radius:12px;background:linear-gradient(90deg,transparent 90%,rgba(10,14,10,.06));}
.table-wrap table{min-width:560px;margin:0;}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1);}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.06s}.reveal.d2{transition-delay:.12s}.reveal.d3{transition-delay:.18s}
.related{margin-top:56px;}
.related .wrap{max-width:860px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left)) 0 max(20px,env(safe-area-inset-right));}
.related h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.5rem;letter-spacing:-.02em;color:var(--ink);margin-bottom:4px;}
.related__grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:18px;}
@media(min-width:680px){.related__grid{grid-template-columns:repeat(3,1fr);}}
.related__card{display:block;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;text-decoration:none;transition:transform .2s,box-shadow .2s;min-height:48px;}
.related__card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.related__card strong{display:block;color:var(--ink);margin-bottom:6px;font-size:.98rem;}
.related__card span{color:var(--gray);font-size:.86rem;line-height:1.5;}
.page-updated{font-size:.82rem;color:var(--gray);margin-top:10px;}
@media (prefers-reduced-motion:reduce){.reveal,.reveal.in{opacity:1!important;transform:none!important;transition:none!important;}}

/* ── THEME CONTRAST WCAG AA (2026-06-13) ── */
:root{--green-dark:#166534;}
[data-theme="dark"]{--green-dark:#4ade80;--gray:#a9b2bd;}
[data-theme="dark"] .btn-primary:hover{background:#22c55e;color:#06210f;}

/* ═══════ DESIGN POLISH — artistique "waw" (2026-06-13) ═══════ */
:root{ --ease-out:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1); }

/* — Hero aurora vivante (décoratif, GPU, derrière le contenu) — */
.hero, .dl-hero{ position:relative; }
.hero > *, .dl-hero > *{ position:relative; z-index:1; }
.hero::before, .dl-hero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(38% 48% at 18% 26%, rgba(34,197,94,.26), transparent 70%),
    radial-gradient(34% 44% at 82% 22%, rgba(251,146,60,.20), transparent 70%),
    radial-gradient(44% 52% at 64% 82%, rgba(34,197,94,.20), transparent 72%);
  background-size:180% 180%; background-repeat:no-repeat;
  animation:jr-aurora 24s ease-in-out infinite;
}
[data-theme="dark"] .hero::before, [data-theme="dark"] .dl-hero::before{
  background:
    radial-gradient(40% 50% at 18% 26%, rgba(34,197,94,.30), transparent 70%),
    radial-gradient(34% 44% at 82% 20%, rgba(74,222,128,.16), transparent 70%),
    radial-gradient(46% 54% at 64% 84%, rgba(34,197,94,.18), transparent 72%);
  background-size:180% 180%;
}
@keyframes jr-aurora{0%,100%{background-position:0% 50%}25%{background-position:100% 30%}50%{background-position:60% 100%}75%{background-position:22% 72%}}

/* — Boutons : sheen + halo (waw) — */
.btn{ transition:transform .18s var(--ease-out), box-shadow .25s var(--ease-out), background .2s; }
.btn:active{ transform:scale(.97); }
.btn:focus-visible, .btn-primary:focus-visible, .btn-ghost:focus-visible{ outline:3px solid rgba(34,197,94,.55); outline-offset:2px; }
@media (hover:hover){
  .btn-primary{ position:relative; overflow:hidden; }
  .btn-primary::after{ content:""; position:absolute; top:-50%; left:-130%; width:55%; height:200%;
    background:linear-gradient(115deg, transparent, rgba(255,255,255,.5), transparent);
    transform:skewX(-18deg); transition:left .6s var(--ease-out); pointer-events:none; }
  .btn-primary:hover::after{ left:150%; }
  .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 18px 46px rgba(22,163,74,.45); }
  .btn-ghost:hover{ transform:translateY(-2px); box-shadow:0 12px 32px rgba(10,14,10,.12); }
}

/* — Cards : lift teinté vert (waw) — */
@media (hover:hover){
  .feature,.value,.cred,.related__card,.vs-card,.sol,.prob,.case,.cat-card,.post-card,.step,.dl-step{
    transition:transform .24s var(--ease-out), box-shadow .28s var(--ease-out), border-color .25s; }
  .feature:hover,.value:hover,.cred:hover,.related__card:hover,.vs-card:hover,.sol:hover,.prob:hover,.case:hover,.cat-card:hover,.post-card:hover,.dl-step:hover{
    transform:translateY(-6px); box-shadow:0 22px 54px rgba(22,163,74,.18), 0 10px 24px rgba(10,14,10,.08); }
}

/* — Nav : soulignement révélé — */
@media (hover:hover){
  .nav__link{ position:relative; }
  .nav__link::after{ content:""; position:absolute; left:14px; right:14px; bottom:5px; height:2px; border-radius:2px;
    background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .26s var(--ease-out); }
  .nav__link:hover::after{ transform:scaleX(1); }
}

/* — Liens de contenu : soulignement qui s'épaissit (a11y: visible par défaut) — */
main p a:not(.btn), main li a:not(.btn){
  text-decoration:none; background:linear-gradient(currentColor,currentColor) no-repeat 0 100%;
  background-size:100% 1px; transition:background-size .25s var(--ease-out); }
@media (hover:hover){ main p a:not(.btn):hover, main li a:not(.btn):hover{ background-size:100% 2px; } }

/* — Reveal : blur-in feutré — */
.reveal{ opacity:0; transform:translateY(20px); filter:blur(5px);
  transition:opacity .6s var(--ease-out), transform .6s var(--ease-out), filter .6s var(--ease-out); }
.reveal.in{ opacity:1; transform:none; filter:none; }

/* — Accessibilité : mouvement réduit — */
@media (prefers-reduced-motion:reduce){
  .hero::before, .dl-hero::before{ animation:none; }
  .btn-primary::after{ display:none; }
  .reveal{ filter:none; transform:none; transition:opacity .3s ease; }
  .feature,.value,.cred,.related__card,.vs-card,.sol,.prob,.case,.cat-card,.post-card,.dl-step{ transition:none; }
}
/* ═══════ DESIGN POLISH END ═══════ */