/* ══════════════════════════════════════════════════════════════
   Klarrro — site-shell.css · HABILLAGE COMMUN du site vitrine
   Nav en pilule, menu burger, pied de page court (Nuit & Jour × Wizz).
   Source unique (vague 2.0) : extrait d'index.css et de pro.css.
   HTML : scripts/site-shell/partials/*.html, posé entre marqueurs par
   scripts/site-shell/stamp-shell.py (à la racine du dépôt).
   Variante or (organisateurs) : [data-shell="pro"] sur l'en-tête, le menu et le pied.
   À charger EN DERNIER dans le <head> : à spécificité égale, l'habillage
   l'emporte sur les feuilles héritées des pages.
   Jetons : base.css (Nuit par défaut, Jour sous [data-theme="light"]).
   Rien ici ne touche au contenu des pages.
   ══════════════════════════════════════════════════════════════ */

/* ── Jetons locaux : ceux d'index.css, limités à l'habillage (les pages hors landing ne les ont pas) ── */
.sticky-header,.nav-mobile-menu,.nav-mobile-backdrop,.site-footer,.shell-spacer{
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;
  --maxw:1200px;--measure:65ch;
  --press:cubic-bezier(.34,1.56,.64,1);
  --hairline:color-mix(in srgb,var(--text) 14%,transparent);
  --gutter:clamp(16px,4.2vw,48px);
}

/* ── Remises à zéro limitées à l'habillage, sans poids (:where) : les pages ont parfois des règles a{} globales ── */
.sticky-header,.nav-mobile-menu,.site-footer{--shell-font:'DM Sans',-apple-system,BlinkMacSystemFont,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}
:where(.sticky-header,.nav-mobile-menu,.site-footer) a{color:inherit;text-decoration:none}
:where(.sticky-header,.nav-mobile-menu,.site-footer) p{margin:0}
:where(.sticky-header,.nav-mobile-menu,.site-footer) button{-webkit-appearance:none;appearance:none;margin:0}
:where(.sticky-header) img{max-width:100%}
.sticky-header,.nav-mobile-menu,.nav-mobile-backdrop,.site-footer{-webkit-tap-highlight-color:transparent}
.sticky-header :focus-visible,.nav-mobile-menu :focus-visible{outline:2px solid var(--nav-text);outline-offset:3px;border-radius:6px}
.site-footer :focus-visible{outline:2px solid var(--rose-ink);outline-offset:3px;border-radius:6px}
.site-footer[data-shell="pro"] :focus-visible{outline-color:var(--gold-ink)}

/* ── Logo : « rrr » animés en rose de marque (le O jamais rose) ── */
.r-grr{color:var(--brand-rose);display:inline-block;animation:grr 2.8s ease-in-out infinite;will-change:transform}
.r-grr.r2{animation-delay:.09s}
.r-grr.r3{animation-delay:.18s}
@keyframes grr{0%,100%{transform:translate(0,0) rotate(0deg) scaleY(1)}4%{transform:translate(-1.5px,1px) rotate(-3deg) scaleY(1.08)}8%{transform:translate(1.5px,-1px) rotate(3deg) scaleY(.94)}12%{transform:translate(-1px,1.5px) rotate(-2deg) scaleY(1.05)}16%{transform:translate(1px,-.5px) rotate(2deg) scaleY(.97)}20%{transform:translate(-.5px,.5px) rotate(-1deg) scaleY(1.02)}22%,98%{transform:translate(0,0) rotate(0deg) scaleY(1)}}

/* ── Lien d'évitement ── */
.skip-link{position:absolute;left:-999px;top:0;z-index:var(--z-max,9999);display:inline-flex;align-items:center;min-height:44px;padding:.6rem 1rem;border-radius:0 0 10px 0;background:var(--rose-fill);color:var(--on-rose);font-weight:700;transform:none}
.skip-link:focus{left:0}
.skip-link[data-shell="pro"]{background:var(--gold-fill);color:var(--on-gold)}

/* ══════════════ NAV EN PILULE (liens et bascules à partir de 1024 px) ══════════════ */
.sticky-header{position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);left:16px;right:16px;bottom:auto;z-index:var(--z-header,100);max-width:1200px;margin:0 auto;padding:0;background:none;border:0;transform-origin:50% 0;transition:transform 260ms var(--press);-webkit-backdrop-filter:none;backdrop-filter:none}
.sticky-header.is-scrolled{transform:translateY(-4px) scale(.97)}
nav.pnav{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;margin:0;padding:6px 6px 6px 18px;background:var(--nav-bg);color:var(--nav-text);border:1px solid var(--nav-line);border-radius:var(--r-full);font-family:var(--shell-font);font-size:16px;line-height:1.55}
nav.pnav::before{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--nav-bg-solid);opacity:0;transition:opacity .3s ease}
.sticky-header.is-scrolled nav.pnav::before{opacity:1}
:root:not([data-theme="light"]) nav.pnav{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.pnav{--seg-fg:color-mix(in srgb,var(--nav-text) 78%,transparent);--seg-bg:color-mix(in srgb,var(--nav-text) 8%,transparent);--seg-line:color-mix(in srgb,var(--nav-text) 14%,transparent);--seg-on-bg:var(--nav-text);--seg-on-fg:var(--nav-bg-solid)}

.nb{display:flex;align-items:center;gap:.55rem;min-height:44px;flex-shrink:0;color:var(--nav-text)}
.nb .ni{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--rose-fill);box-shadow:none}
.nb .ni img{width:19px;height:19px;object-fit:contain}
.nb .nn{font-family:'Playfair Display',Georgia,serif;font-size:1.24rem;font-weight:800;line-height:1.55;letter-spacing:-.5px;white-space:nowrap;color:var(--nav-text)}
.nb .nn .r-grr{color:var(--brand-rose)}
.nb-pro{flex-shrink:0;padding:2px 6px;border:1px solid color-mix(in srgb,var(--gold-fill) 50%,transparent);border-radius:6px;font-family:'DM Sans',sans-serif;font-size:.875rem;font-weight:800;line-height:1.55;letter-spacing:.12em;color:var(--gold-fill)}

.nav-links,.nav-right{display:none}
.nav-links{gap:2px;align-items:center}
.nav-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:var(--r-sm);font-size:.9375rem;font-weight:600;color:color-mix(in srgb,var(--nav-text) 84%,transparent);background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-size:0 2px;background-position:12px calc(100% - 8px);transition:background-size .25s ease,color var(--t)}
.nav-links a.is-current,.nav-links a[aria-current="page"]{color:var(--nav-text);background-size:calc(100% - 24px) 2px}
.nav-links .nav-orga{color:var(--gold-fill)}
@media (hover:hover) and (pointer:fine){.nav-links a:hover{color:var(--nav-text);background-size:calc(100% - 24px) 2px}.nav-links .nav-orga:hover{color:var(--gold-fill)}}
.nav-right{gap:8px;align-items:center}
.nav-right .lang-switch{display:none}
.btn-nav-cta{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:var(--r-full);font-weight:700;font-size:.9375rem;white-space:nowrap;color:var(--on-rose);background:var(--rose-fill)}
/* Lien secondaire « Espace organisateur » (variante or) : icône discrète dans la pilule
   (nom accessible + infobulle), libellé complet dans le menu et le pied de page */
.nav-space{display:none;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:var(--r-full);color:color-mix(in srgb,var(--nav-text) 78%,transparent)}
.nav-space svg{width:20px;height:20px}
@media (hover:hover) and (pointer:fine){.nav-space:hover{color:var(--nav-text);background:color-mix(in srgb,var(--nav-text) 8%,transparent)}}

/* Burger : 2 barres qui se croisent */
.nav-burger{position:relative;display:block;flex-shrink:0;width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:var(--r-full);cursor:pointer}
.nav-burger span{position:absolute;display:block;left:12px;right:12px;width:auto;height:3px;margin:0;border-radius:3px;background:var(--nav-text);opacity:1;transition:transform 380ms var(--press)}
.nav-burger span:nth-child(1){top:17px}
.nav-burger span:nth-child(2){top:24px}
.nav-burger.open span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.nav-burger.open span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}

/* Barre de lecture : 2 px en bas de la pilule (scaleX piloté par site-shell.js) */
.nav-progress{position:absolute;left:24px;right:24px;bottom:3px;height:2px;border-radius:2px;background:var(--brand-rose);transform-origin:0 50%;transform:scaleX(0);pointer-events:none}

/* Pilule complète à partir de 1024 px (mesuré : FR, EN et ES tiennent de 1024 à 1920 dans les deux variantes) */
@media (min-width:1024px){.nav-links,.nav-right{display:flex}.nav-burger{display:none}.nav-space{display:inline-grid}}
@media (min-width:1200px){.nav-right .lang-switch{display:inline-flex}}

/* ══════════════ SÉLECTEURS LANGUE ET THÈME (pilule segmentée) ══════════════ */
.nav-mobile-menu{--seg-fg:color-mix(in srgb,var(--nav-text) 80%,transparent);--seg-bg:color-mix(in srgb,var(--nav-text) 8%,transparent);--seg-line:color-mix(in srgb,var(--nav-text) 16%,transparent);--seg-on-bg:var(--nav-text);--seg-on-fg:var(--nav-bg-solid)}
.footer-prefs{--seg-fg:var(--text2);--seg-bg:var(--surface);--seg-line:var(--border2);--seg-on-bg:var(--text);--seg-on-fg:var(--bg)}
.lang-switch,.theme-switch{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--r-full);background:var(--seg-bg);border:1px solid var(--seg-line)}
.lang-switch .lang-btn{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 8px;border:none;background:none;box-shadow:none;color:var(--seg-fg);font-family:'DM Sans',sans-serif;font-weight:700;font-size:.875rem;line-height:1;letter-spacing:.02em;border-radius:var(--r-full);cursor:pointer}
@media (hover:hover) and (pointer:fine){.lang-switch .lang-btn:hover:not(.active){color:var(--seg-on-bg);background:transparent}}
.lang-switch .lang-btn.active{color:var(--seg-on-fg);background:var(--seg-on-bg);box-shadow:none}
.theme-switch .theme-toggle-btn{width:44px;height:44px;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:none;background:none;box-shadow:none;color:var(--seg-fg);border-radius:var(--r-full);cursor:pointer}
.theme-switch .theme-toggle-btn svg{width:18px;height:18px}
.theme-switch .theme-toggle-btn.active{color:var(--seg-on-fg);background:var(--seg-on-bg)}

/* ══════════════ MENU (< 1024 px) : panneau arrondi qui descend de la pilule ══════════════
   Panneau et voile sont FRÈRES dans <body>, hors de la pilule : un ancêtre
   transform / filter / backdrop-filter piègerait leur position:fixed.
   Verrou de défilement sur <html> (jamais sur body : il casserait les sticky). */
html.menu-open{overflow:hidden}
html.menu-open .sticky-header{z-index:9998}
.nav-mobile-backdrop{position:fixed;inset:0;z-index:9996;background:var(--scrim);opacity:0;visibility:hidden;touch-action:none;transition:opacity .3s ease,visibility 0s linear .3s}
.nav-mobile-backdrop.open{opacity:1;visibility:visible;transition:opacity .3s ease}
.nav-mobile-menu{position:fixed;z-index:9997;top:calc(env(safe-area-inset-top,0px) + 74px);left:16px;right:16px;bottom:auto;max-width:560px;margin:0 auto;max-height:calc(100svh - env(safe-area-inset-top,0px) - 90px);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:.15rem;padding:.75rem 1rem calc(1.25rem + env(safe-area-inset-bottom,0px));border-radius:28px;background:var(--nav-bg-solid);color:var(--nav-text);border:1px solid var(--nav-line);box-shadow:var(--shadow-float);font-family:var(--shell-font);font-size:16px;line-height:1.55;text-align:start;transform-origin:50% 0;transform:translateY(-8px) scale(.96);opacity:0;visibility:hidden;transition:transform 380ms var(--press),opacity .2s ease,visibility 0s linear 380ms}
.nav-mobile-menu.open{transform:none;opacity:1;visibility:visible;transition:transform 380ms var(--press),opacity .2s ease}
.mm-nav{display:flex;flex-direction:column}
.mm-link{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);min-height:64px;padding:var(--s1) 0;border-bottom:1px solid color-mix(in srgb,var(--nav-text) 14%,transparent);color:var(--nav-text);font-family:'DM Sans',sans-serif;font-weight:900;font-size:clamp(1.6rem,8vw,2.4rem);line-height:.95;letter-spacing:-.025em;text-transform:uppercase}
.nav-mobile-menu .mm-link{color:var(--nav-text)}
.nav-mobile-menu .mm-link--gold{color:var(--gold-fill)}
.nav-mobile-menu .mm-link--alt{font-size:clamp(1.25rem,6vw,1.75rem);color:color-mix(in srgb,var(--nav-text) 80%,transparent)}
.mm-txt{--split-step:6ms;position:relative;display:inline-block;min-width:0}
.mm-link.is-current .mm-txt::after,.mm-link[aria-current="page"] .mm-txt::after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:4px;border-radius:2px;background:var(--brand-rose)}
.mm-arrow{flex-shrink:0;width:28px;height:28px;transition:transform .3s var(--press)}
.mm-link:active .mm-arrow{transform:translateX(6px)}
@media (hover:hover) and (pointer:fine){.mm-link:hover .mm-arrow{transform:translateX(6px)}}
.mm-link:active{transform:scale(.985)}
.nav-mobile-menu .mm-cta{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;max-width:none;min-height:52px;padding:14px 24px;border:none;border-radius:var(--r-md);font-family:'DM Sans',sans-serif;font-weight:700;font-size:1rem;line-height:1.2;color:var(--on-rose);background:var(--rose-fill);box-shadow:var(--shadow-cta);cursor:pointer}
.mm-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s1)}
/* Titres du menu : lettres en cascade à chaque ouverture (découpage par site-shell.js) */
.mm-txt .split .lw{white-space:nowrap}
.mm-txt .split .lc{display:inline-block}
.mm-txt .split-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nav-mobile-menu.open .mm-txt.is-in .lc{animation:shellLetter .3s cubic-bezier(.23,1,.32,1) backwards;animation-delay:calc(var(--i,0) * var(--split-step,14ms) + var(--split-start,0ms))}
@keyframes shellLetter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (min-width:1024px){.nav-mobile-menu,.nav-mobile-backdrop{display:none}}

/* ══════════════ RESSORT : retour au toucher, survol soigné (desktop) ══════════════ */
.btn-nav-cta,.lang-btn,.theme-toggle-btn,.mm-link,.nav-burger,.nav-mobile-menu .mm-cta{transition:transform 260ms var(--press),background-color var(--t),box-shadow var(--t),background-size .25s ease}
@media (hover:hover) and (pointer:fine){.btn-nav-cta:hover,.nav-mobile-menu .mm-cta:hover{transform:translateY(-2px) scale(1.02)}}
.btn-nav-cta:active,.lang-btn:active,.theme-toggle-btn:active,.nav-burger:active,.nav-mobile-menu .mm-cta:active{transform:scale(.97)}
.lang-btn:active,.theme-toggle-btn:active,.nav-burger:active{background:color-mix(in srgb,currentColor 14%,transparent)}
.site-footer .sf-links a:active,.site-footer .sf-legal-links a:active,.sf-logo:active,.nb:active,.nav-links a:active{opacity:.64}

/* ══════════════ PIED DE PAGE COURT ══════════════
   Logo animé + slogan, 5 liens, Instagram, ligne légale, langue et thème.
   Toutes les cibles font au moins 44 px.
   Palette propre au pied de page (valeurs de base.css, Nuit puis Jour) : certaines pages
   héritées redéfinissent --bg / --text… sur :root en sombre seulement (event, 404,
   investir.css) ; sans cela le pied de page mélangerait les deux thèmes en Jour. */
.site-footer{--bg:#09090E;--surface:#16162C;--border2:rgba(255,255,255,0.13);--text:#EDE9F6;--text2:#ABA3C2;--muted:#8A839E;--muted2:#ADA6C0}
[data-theme="light"] .site-footer{--bg:#FAF9FC;--surface:#FFFFFF;--border2:rgba(26,26,46,.12);--text:#1A1A2E;--text2:#4A4660;--muted:#6B6580;--muted2:#6A6580}
.site-footer{position:static;display:block;margin:0;padding:var(--s6) var(--gutter) calc(var(--s4) + env(safe-area-inset-bottom,0px));background:var(--bg);border:0;border-top:1px solid var(--hairline);color:var(--text);font-family:var(--shell-font);font-size:16px;line-height:1.55;text-align:start}
.sf-inner{max-width:var(--maxw);margin:0 auto;display:grid;gap:var(--s4);justify-items:center;text-align:center}
.sf-brand{display:grid;gap:var(--s1);justify-items:center}
.sf-logo{display:inline-flex;align-items:center;min-height:44px;color:var(--text)}
.sf-name{font-family:'Playfair Display',Georgia,serif;font-weight:800;font-size:1.75rem;letter-spacing:-.5px;white-space:nowrap}
.sf-slogan{font-family:'Playfair Display',Georgia,serif;font-weight:800;font-size:1.125rem;line-height:1.3;color:var(--text)}
.sf-slogan .sl-acc{color:var(--rose-ink)}
.sf-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 var(--s1)}
.site-footer .sf-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-weight:600;font-size:1rem;color:var(--text);background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-size:0 2px;background-position:12px calc(100% - 9px);transition:background-size .25s ease}
.site-footer .sf-links a[aria-current="page"]{background-size:calc(100% - 24px) 2px}
@media (hover:hover) and (pointer:fine){.site-footer .sf-links a:hover{background-size:calc(100% - 24px) 2px}}
.site-footer .sf-links .sf-gold{color:var(--gold-ink)}
.sf-side{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--s2)}
.site-footer .sf-social{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line-strong);color:var(--text);transition:transform 260ms var(--press)}
.sf-social svg{width:20px;height:20px}
.sf-social:active{transform:scale(.94)}
@media (hover:hover) and (pointer:fine){.sf-social:hover{transform:translateY(-2px)}}
.footer-prefs{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s1)}
.sf-legal{max-width:var(--maxw);margin:var(--s4) auto 0;padding-top:var(--s3);border-top:1px solid var(--hairline);text-align:center}
.sf-legal-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 4px;font-size:.875rem;color:var(--muted2)}
.sf-legal-links span{display:inline-flex;align-items:center;justify-content:center;flex-basis:100%;min-height:44px;padding:0 8px}
.site-footer .sf-legal-links a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 6px;color:var(--text2)}
.site-footer .sf-legal-links a[aria-current="page"]{color:var(--text);text-decoration:underline;text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.site-footer .sf-legal-links a:hover{color:var(--text);text-decoration:underline;text-underline-offset:3px}}
.sf-recaptcha{max-width:var(--measure);margin:var(--s1) auto 0;font-size:.875rem;line-height:1.5;color:var(--muted)}
.site-footer .sf-recaptcha a{display:inline-block;padding:13px 2px;margin:-13px -2px;color:var(--muted2);text-decoration:underline}
.sf-credit{flex-basis:100%;margin:var(--s1) auto 0;font-size:.875rem;line-height:1.5;color:var(--muted)}
.site-footer .sf-credit a{display:inline-block;padding:13px 2px;margin:-13px -2px;color:var(--text2);text-decoration:underline;text-underline-offset:3px}
@media (min-width:1024px){
  .sf-inner{grid-template-columns:auto 1fr auto;align-items:center;justify-items:stretch;text-align:left}
  .sf-brand{justify-items:start}
  .sf-links{justify-content:center;flex-wrap:nowrap}
  .site-footer .sf-links a{padding:0 10px;white-space:nowrap}
  .sf-side{flex-wrap:nowrap}
  .sf-legal-links span{flex-basis:auto}
  .sf-legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;text-align:left}
  .sf-legal-links{justify-content:flex-start}
  .site-footer .sf-recaptcha{margin:0;max-width:52ch;text-align:right}
  .site-footer .sf-credit{margin:var(--s1) 0 0}
}

/* ══════════════ VARIANTE OR (organisateurs) ══════════════ */
[data-shell="pro"] .nb .ni{background:var(--gold-fill)}
[data-shell="pro"] .nb .nn .r-grr{color:var(--gold-fill)}
[data-shell="pro"] .btn-nav-cta{color:var(--on-gold);background:var(--gold-fill)}
[data-shell="pro"] .nav-progress{background:var(--gold-fill)}
.sticky-header[data-shell="pro"] .lang-switch .lang-btn.active,.sticky-header[data-shell="pro"] .theme-switch .theme-toggle-btn.active,
.nav-mobile-menu[data-shell="pro"] .lang-switch .lang-btn.active,.nav-mobile-menu[data-shell="pro"] .theme-switch .theme-toggle-btn.active{color:var(--on-gold);background:var(--gold-fill)}
.nav-mobile-menu[data-shell="pro"] .mm-cta{color:var(--on-gold);background:var(--gold-fill);box-shadow:var(--shadow-cta-gold);white-space:nowrap}
.nav-mobile-menu[data-shell="pro"] .mm-link.is-current .mm-txt::after,.nav-mobile-menu[data-shell="pro"] .mm-link[aria-current="page"] .mm-txt::after{background:var(--gold-fill)}
.site-footer[data-shell="pro"] .r-grr{color:var(--gold-ink)}
.site-footer[data-shell="pro"] .sf-slogan .sl-acc{color:var(--gold-ink)}

/* ══════════════ PAGES HORS LANDING : la pilule est fixe, on réserve sa place ══════════════ */
.shell-spacer{display:block;height:calc(env(safe-area-inset-top,0px) + 84px)}
/* pages dont le <body> est une colonne flex centrée (404, event) : réserve et pied de page pleine largeur */
.shell-spacer,.site-footer{flex:none;align-self:stretch}

/* ══════════════ BASCULE DE THÈME EN CERCLE (View Transitions, site-shell.js) ══════════════ */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}

@media (prefers-reduced-motion:reduce){
  .sticky-header,.nav-burger span,.nav-mobile-menu,.nav-mobile-backdrop,.mm-arrow,.lang-btn,.theme-toggle-btn,.sf-social{transition:none!important}
  .btn-nav-cta,.mm-link,.nav-mobile-menu .mm-cta{transition:none!important;transform:none!important}
  .mm-txt .lc,.r-grr{animation:none!important}
}

/* ══════════════ BANDEAU DE CONSENTEMENT (consent.js) ══════════════
   Repris tel quel d'index.css (refonte, jetons Nuit/Jour de base.css) : toutes les pages
   de l'habillage chargent cette feuille, y compris celles qui n'ont plus index.css ni
   pro.css (tarifs, safe place, cas client, guides, licence chaîne, contact, article).
   Variante or sur les pages organisateurs (.pro-page), comme pro.css. */
.consent-banner {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px;
  background: transparent;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}
/* Non bloquant : seule la carte reçoit les clics, la page reste utilisable derrière */
.consent-banner.consent-visible { opacity: 1; pointer-events: none; }
.consent-banner .consent-card { pointer-events: auto; }
.consent-banner.consent-closing { opacity: 0; pointer-events: none; }

.consent-card {
  width: 100%;
  max-width: 520px;
  background: var(--surface);
  border: 1px solid var(--border2);
  border-radius: var(--r-lg);
  padding: 24px;
  box-shadow: var(--shadow-lg);
  transform: translateY(20px);
  transition: transform .3s ease;
}
.consent-visible .consent-card { transform: translateY(0); }
.consent-closing .consent-card { transform: translateY(20px); }

.consent-header {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  color: var(--text);
  margin-bottom: 8px;
}
.consent-header span { display: none; } /* pictogramme emoji de consent.js : hors direction */

.consent-text {
  font-size: .9rem;
  color: var(--text2);
  line-height: 1.55;
  margin-bottom: 16px;
}

.consent-details { margin-bottom: 14px; }
.consent-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--r-sm);
  background: var(--surface2);
  border: 1px solid var(--border);
  margin-bottom: 8px;
  cursor: pointer;
  transition: background .15s;
}
@media (hover:hover) and (pointer:fine) { .consent-option:hover { background: color-mix(in srgb, var(--text) 6%, var(--surface2)); } }
.consent-option input[type="checkbox"] {
  accent-color: var(--rose-fill);
  width: 18px;
  height: 18px;
  margin-top: 2px;
  flex-shrink: 0;
}
.consent-option div { display: flex; flex-direction: column; gap: 2px; }
.consent-option strong { font-size: .88rem; color: var(--text); }
.consent-option span { font-size: .875rem; color: var(--muted); }

.consent-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.consent-save { margin-bottom: 8px; }

.consent-btn {
  flex: 1;
  min-width: 120px;
  min-height: 48px;
  padding: 10px 16px;
  border-radius: var(--r-md);
  border: none;
  font-family: 'DM Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji';
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}
@media (hover:hover) and (pointer:fine) { .consent-btn:hover { transform: translateY(-1px); } }
.consent-btn:active { transform: scale(.97); }

.consent-btn-accept {
  background: var(--rose-fill);
  color: var(--on-rose);
  box-shadow: var(--shadow-cta);
}

/* Même poids visuel que « Tout accepter » : refuser est aussi simple qu'accepter */
.consent-btn-necessary {
  background: var(--rose-fill);
  color: var(--on-rose);
  box-shadow: var(--shadow-cta);
}

.consent-btn-customize {
  background: transparent;
  color: var(--text2);
  border: 1px solid var(--border2);
}
@media (hover:hover) and (pointer:fine) { .consent-btn-customize:hover { background: color-mix(in srgb, var(--text) 4%, transparent); } }

.consent-footer {
  text-align: center;
  font-size: .875rem;
  color: var(--muted);
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.consent-footer a {
  color: var(--text2);
  text-decoration: underline;
  text-underline-offset: 2px;
}
@media (hover:hover) and (pointer:fine) { .consent-footer a:hover { color: var(--rose-ink); } }

@media (max-width: 480px) {
  .consent-card { padding: 18px; }
  .consent-actions { flex-direction: column; }
  .consent-btn { min-width: 100%; }
}
.pro-page .consent-option input[type="checkbox"]{accent-color:var(--gold-fill)}
.pro-page .consent-btn-accept,.pro-page .consent-btn-necessary{background:var(--gold-fill);color:var(--on-gold);box-shadow:var(--shadow-cta-gold)}
@media (hover:hover) and (pointer:fine){.pro-page .consent-footer a:hover{color:var(--gold-ink)}}