/* ══════════════════════════════════════════════════════════════════════════
   VISUANCE — DESIGN SYSTEM (self-made, plugin-driven)
   Servi par le mu-plugin "visuance-design".
   CLAIR PAR DÉFAUT · bascule SOMBRE automatique (prefers-color-scheme).
   Skin du thème marlab + Elementor + harmonisation des sections bespoke .vsw/.vwp.
   Scopé sous body.vis-on → zéro impact wp-admin, gain de cascade sur le thème.
   ════════════════════════════════════════════════════════════════════════════ */

/* ══════════ TOKENS — CLAIR (défaut) ══════════ */
body.vis-on{
  --f-display:'Space Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --f-body:'Space Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  /* marque Visuance : encre navy + accent cyan */
  --ink:#111a45;            /* navy marque (titres) */
  --ink-2:#1b2456;
  --accent:#1296c9;         /* cyan profond — AA sur blanc (liens/texte) */
  --accent-br:#3ecbf5;      /* cyan vif marque (halos, accents) */
  --accent-2:#08bff6;
  --accent-glow:rgba(62,203,245,.40);

  /* surfaces & texte (clair) */
  --bg:#f6f8fb;             /* fond page */
  --bg-soft:#eef2f8;
  --surface:#ffffff;
  --surface-2:#f3f6fb;
  --panel:rgba(255,255,255,.82);
  --line:rgba(17,26,69,.12);
  --line-soft:rgba(17,26,69,.07);
  --txt:#39435f;            /* corps */
  --txt-strong:#111a45;     /* fort */
  --txt-mute:rgba(57,67,95,.62);

  /* chrome navbar */
  --nav-glass:rgba(255,255,255,.82);
  --nav-glass-brd:rgba(17,26,69,.10);
  --nav-shadow:0 10px 34px -18px rgba(17,26,69,.45);
  --nav-link:#1b2456;
  --nav-link-on-hero:#ffffff;

  /* boutons */
  --btn-grad:linear-gradient(118deg,#3ecbf5 0%,#1296c9 60%,#2f6bff 130%);
  --btn-ink:#06223a;
  --card-shadow:0 18px 46px -30px rgba(17,26,69,.45);
  --radius:16px;
  --ease:cubic-bezier(.16,1,.3,1);

  color-scheme:light;
}

/* ══════════ TOKENS — SOMBRE : AUTO (système) OU toggle manuel (.vis-dark) ══════════
   .vis-light force le clair même en système sombre ; .vis-dark force le sombre. */
@media (prefers-color-scheme:dark){
  html:not(.vis-light) body.vis-on{
    --ink:#eaf0fb;--ink-2:#dfe8fa;--accent:#5fd2f7;--accent-br:#3ecbf5;--accent-2:#08bff6;--accent-glow:rgba(62,203,245,.45);
    --bg:#06070d;--bg-soft:#0b0d16;--surface:#0f1220;--surface-2:#111422;--panel:rgba(14,16,26,.78);
    --line:rgba(255,255,255,.10);--line-soft:rgba(255,255,255,.06);
    --txt:rgba(226,233,247,.82);--txt-strong:#f3f7ff;--txt-mute:rgba(206,216,236,.55);
    --nav-glass:rgba(8,10,18,.70);--nav-glass-brd:rgba(120,200,245,.14);--nav-shadow:0 14px 40px -20px rgba(0,0,0,.7);--nav-link:#e7eefb;
    --card-shadow:0 22px 60px -34px rgba(0,0,0,.8);color-scheme:dark;
  }
}
html.vis-dark body.vis-on{
  --ink:#eaf0fb;--ink-2:#dfe8fa;--accent:#5fd2f7;--accent-br:#3ecbf5;--accent-2:#08bff6;--accent-glow:rgba(62,203,245,.45);
  --bg:#06070d;--bg-soft:#0b0d16;--surface:#0f1220;--surface-2:#111422;--panel:rgba(14,16,26,.78);
  --line:rgba(255,255,255,.10);--line-soft:rgba(255,255,255,.06);
  --txt:rgba(226,233,247,.82);--txt-strong:#f3f7ff;--txt-mute:rgba(206,216,236,.55);
  --nav-glass:rgba(8,10,18,.70);--nav-glass-brd:rgba(120,200,245,.14);--nav-shadow:0 14px 40px -20px rgba(0,0,0,.7);--nav-link:#e7eefb;
  --card-shadow:0 22px 60px -34px rgba(0,0,0,.8);color-scheme:dark;
}

/* ══════════ FOND GLOBAL — pilote html/body (tue le gap noir mobile) ══════════
   « html body » bat les `body{background:#050508}` injectés plus bas dans le DOM. */
html body.vis-on{background:var(--bg);color:var(--txt);font-family:var(--f-body)}
html body.vis-on.vis-home #site,
html body.vis-on.vis-home #content{background:var(--bg)}
body.vis-on #site{overflow-x:clip}
body.vis-on ::selection{background:var(--accent-glow);color:var(--txt-strong)}

/* liens & titres (hors zones bespoke qui gèrent leur propre style) */
body.vis-on #content a:not(.button):not(.elementor-button):not([class*="paoc"]):not(.vsw a):not(.vwp a){color:var(--accent)}
body.vis-on h1,body.vis-on h2,body.vis-on h3,body.vis-on h4{color:var(--txt-strong);font-family:var(--f-display)}

/* ══════════════════════════════════════════════════════════════════════════
   NAVBAR PREMIUM (skin du header marlab : #site-header + #site-header-sticky)
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #site-header,
body.vis-on #site-header-sticky{transition:background .4s var(--ease),box-shadow .4s var(--ease),backdrop-filter .4s var(--ease),border-color .4s var(--ease)}

/* entête transparent (au-dessus du hero) : on garde la transparence, on raffine */
body.vis-on #site-header.header-transparent{background:transparent;box-shadow:none;border-bottom:1px solid transparent}
body.vis-on #site-header.header-transparent .site-header-inner{padding-top:6px;padding-bottom:6px}

/* Verre dépoli rendu via ::before (PAS de backdrop-filter sur le header lui-même,
   sinon il rogne/casse le méga-menu en position absolue au scroll). */
body.vis-on #site-header{overflow:visible}
body.vis-on #site-header:not(.header-transparent){background:transparent!important}
body.vis-on #site-header:not(.header-transparent)::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--nav-glass);
  -webkit-backdrop-filter:saturate(160%) blur(16px);backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid var(--nav-glass-brd);box-shadow:var(--nav-shadow);
}

/* liens de menu — premium, espacés, soulignage accent animé
   ID-scopé (#site-header) = bat le blanc-sur-transparent de marlab.
   Texte = var(--nav-link) : FONCÉ en clair (hero clair), CLAIR en sombre. */
body.vis-on #site-header .navigator .menu-primary > li > a,
body.vis-on #site-header-sticky .navigator .menu-primary > li > a{
  font-family:var(--f-body);font-weight:600;letter-spacing:.2px;
  position:relative;color:var(--nav-link);transition:color .25s var(--ease)
}
body.vis-on .navigator .menu-primary > li > a:after{
  content:"";position:absolute;left:0;right:auto;bottom:-4px;height:2px;width:0;
  background:linear-gradient(90deg,var(--accent-br),var(--accent-2));
  border-radius:2px;transition:width .3s var(--ease);opacity:.95
}
/* soulignage animé = SURVOL uniquement (pas la page courante) */
body.vis-on .navigator .menu-primary > li:hover > a:after{width:100%}
body.vis-on .navigator .menu-primary > li.current-menu-item > a:after,
body.vis-on .navigator .menu-primary > li.current_page_item > a:after{width:0}
body.vis-on #site-header .navigator .menu-primary > li:hover > a,
body.vis-on #site-header-sticky .navigator .menu-primary > li:hover > a{color:var(--accent)}
/* page courante = simplement la police en bleu clair du thème, AUCUN surlignage */
body.vis-on .navigator .menu-primary > li.current-menu-item > a,
body.vis-on .navigator .menu-primary > li.current_page_item > a,
body.vis-on .navigator .menu-primary > li.current-menu-parent > a,
body.vis-on .navigator .menu-primary > li.current-menu-ancestor > a{color:var(--accent-br)!important;background:none!important;box-shadow:none!important}
body.vis-on .navigator .menu-primary > li.current-menu-item,
body.vis-on .navigator .menu-primary > li.current_page_item{background:none!important}

/* sous-menus : carte douce */
body.vis-on .navigator .menu-primary .sub-menu{
  background:var(--surface);border:1px solid var(--line);
  box-shadow:var(--card-shadow);border-radius:12px;overflow:hidden;padding:6px
}
body.vis-on .navigator .menu-primary .sub-menu li a{color:var(--nav-link);border-radius:8px;transition:background .2s,color .2s}
body.vis-on .navigator .menu-primary .sub-menu li a:hover{background:var(--surface-2);color:var(--accent)}

/* bouton « Obtenir un devis » → pill premium */
body.vis-on .header-info-text a,
body.vis-on .header-info-text a.paoc-popup-button{
  display:inline-flex;align-items:center;gap:.5em;
  background:var(--btn-grad);color:#06223a!important;font-weight:700;letter-spacing:.3px;
  padding:.72em 1.35em;border-radius:999px;border:0;
  box-shadow:0 10px 26px -12px var(--accent-glow);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),filter .25s
}
body.vis-on .header-info-text a:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px var(--accent-glow);filter:saturate(115%)}

/* icône recherche + hamburger : teinte cohérente */
body.vis-on .menu-extras .search-box > a i,
body.vis-on .off-canvas-toggle span{transition:color .25s,background .25s}
body.vis-on #site-header .menu-extras .search-box > a i,
body.vis-on #site-header-sticky .menu-extras .search-box > a i{color:var(--nav-link)}
/* hamburger (mobile) visible sur fond clair */
body.vis-on #site-header .off-canvas-toggle span,
body.vis-on #site-header .off-canvas-toggle span:before,
body.vis-on #site-header .off-canvas-toggle span:after{background:var(--nav-link)!important}

/* ══════════════════════════════════════════════════════════════════════════
   SÉLECTEUR DE LANGUE (injecté par visuance.js dans .menu-extras)
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-lang{position:relative;display:flex;align-items:center;margin-left:4px}
body.vis-on .vis-lang__btn{
  display:inline-flex;align-items:center;gap:.45em;cursor:pointer;
  font-family:var(--f-body);font-weight:700;font-size:12.5px;letter-spacing:.6px;
  color:var(--nav-link);background:transparent;border:1px solid var(--line);
  border-radius:999px;padding:.42em .7em;transition:all .25s var(--ease)
}
/* sélecteur de langue : suit --nav-link (foncé en clair, clair en sombre) */
body.vis-on .vis-lang__btn:hover{border-color:var(--accent-br);color:var(--accent)}
body.vis-on .vis-lang__flag{font-size:14px;line-height:1}
body.vis-on .vis-lang__menu{
  position:absolute;top:calc(100% + 10px);right:0;min-width:148px;z-index:9999;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--card-shadow);padding:6px;opacity:0;visibility:hidden;
  transform:translateY(-6px);transition:all .22s var(--ease)
}
body.vis-on .vis-lang.open .vis-lang__menu{opacity:1;visibility:visible;transform:none}
body.vis-on .vis-lang__menu a{
  display:flex;align-items:center;gap:.6em;padding:.52em .6em;border-radius:8px;
  color:var(--nav-link)!important;font-weight:600;font-size:13.5px;text-decoration:none
}
body.vis-on .vis-lang__menu a:hover{background:var(--surface-2);color:var(--accent)!important}
body.vis-on .vis-lang__menu a.is-active{color:var(--accent)!important;font-weight:800}

/* ══════════════════════════════════════════════════════════════════════════
   BOUTONS génériques (.button, Elementor) — cohérents 2 modes
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #content .button:not(.search-submit),
body.vis-on #content .elementor-button{
  border-radius:999px;font-weight:700;letter-spacing:.3px;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),filter .25s
}
body.vis-on #content .button.accent,
body.vis-on #content .elementor-button-primary{
  background:var(--btn-grad);color:#06223a;border:0;box-shadow:0 12px 28px -14px var(--accent-glow)
}
body.vis-on #content .button:hover,
body.vis-on #content .elementor-button:hover{transform:translateY(-2px);filter:saturate(112%)}

/* ══════════════════════════════════════════════════════════════════════════
   SECTIONS BESPOKE .vsw / .vwp : harmonisation (seams propres, pas de clash)
   Elles sont sombres par design → en CLAIR on les présente comme des bandes
   cinématiques intentionnelles (séparateur accent), en SOMBRE elles sont natives.
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vsw,body.vis-on .vwp{position:relative;scroll-margin-top:90px}
/* liseré accent en haut de chaque bande sombre pour un raccord premium en clair */
@media (prefers-color-scheme:light){
  body.vis-on .vsw::before,body.vis-on .vwp::before{
    content:"";position:absolute;left:0;right:0;top:0;height:1px;
    background:linear-gradient(90deg,transparent,var(--accent-glow),transparent);opacity:.7
  }
}
/* garde-fou : pas de débordement horizontal sur ces blocs */
body.vis-on .vsw,body.vis-on .vwp{max-width:100vw;overflow-x:clip}

/* ══════════════════════════════════════════════════════════════════════════
   FOOTER marlab — retire l'image de démo externe (mar.21lab.co), skin propre
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #site-footer{
  background-image:none!important;
  background:#101a3d!important;color:rgba(255,255,255,.74);position:relative
}
body.vis-on #site-footer:before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--accent-br),transparent);opacity:.6
}
body.vis-on #site-footer a{color:rgba(255,255,255,.82)}
body.vis-on #site-footer a:hover{color:var(--accent-br)}
@media (prefers-color-scheme:dark){
  html:not(.vis-light) body.vis-on #site-footer{background:#05070f!important;border-top:1px solid rgba(255,255,255,.08)}
}
html.vis-dark body.vis-on #site-footer{background:#05070f!important;border-top:1px solid rgba(255,255,255,.08)}

/* ══════════════════════════════════════════════════════════════════════════
   ANIMATIONS reveal (ajoutées par visuance.js : .vis-reveal → .is-in)
   ════════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:no-preference){
  body.vis-on .vis-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
  body.vis-on .vis-reveal.is-in{opacity:1;transform:none}
}

/* ══════════════════════════════════════════════════════════════════════════
   FIX GAP MOBILE + ajustements responsive header
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:900px){
  /* aucun espace résiduel en haut : le contenu démarre au ras */
  body.vis-on #content{margin-top:0}
  body.vis-on.vis-home #content > *:first-child{margin-top:0!important}
  /* sur mobile, l'entête transparent reste lisible : léger voile si pas de hero sombre */
  body.vis-on #site-header .site-header-inner{padding-top:10px;padding-bottom:10px}
}

/* ══════════════════════════════════════════════════════════════════════════
   ACCUEIL (.vis-root) — composants light-default + dark-auto
   100% piloté par les tokens → zéro dark-on-dark / white-on-white.
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-root{font-family:var(--f-body);color:var(--txt);line-height:1.6;font-size:16px}
body.vis-on .vis-root *,body.vis-on .vis-root *::before,body.vis-on .vis-root *::after{box-sizing:border-box}
body.vis-on .vis-root img{max-width:100%;display:block}
body.vis-on .vis-root strong{color:var(--txt-strong);font-weight:700}
body.vis-on .vis-wrap{max-width:1200px;margin:0 auto;padding:0 24px;position:relative;z-index:2}
body.vis-on .vis-wrap--narrow{max-width:860px}
body.vis-on .vis-section{padding:clamp(56px,8vw,110px) 0;position:relative}
body.vis-on .vis-center{text-align:center;margin-top:42px}
body.vis-on .vis-accent{color:var(--accent)}
body.vis-on .vis-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent-br);margin-right:.55em;box-shadow:0 0 0 4px var(--accent-glow)}

/* en-têtes de section */
body.vis-on .vis-head{max-width:760px;margin:0 auto 48px;text-align:center}
body.vis-on .vis-kicker{display:inline-block;font-family:var(--f-body);font-weight:700;font-size:12px;letter-spacing:2.4px;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
body.vis-on .vis-kicker--light{color:var(--accent-br)}
body.vis-on .vis-h2{font-family:var(--f-display);font-weight:700;font-size:clamp(28px,4.4vw,46px);line-height:1.08;letter-spacing:-.5px;color:var(--txt-strong);margin:0}
body.vis-on .vis-sub{margin:16px auto 0;color:var(--txt-mute);font-size:17px;max-width:640px}
body.vis-on .vis-eyebrow{display:inline-flex;align-items:center;gap:.6em;font-weight:700;font-size:12.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--accent)}
body.vis-on .vis-eyebrow i{width:26px;height:2px;background:linear-gradient(90deg,var(--accent-br),transparent);border-radius:2px}

/* ── Boutons ─────────────────────────────────────────────────────────────── */
body.vis-on .vis-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--f-body);font-weight:700;font-size:15px;letter-spacing:.3px;padding:.92em 1.7em;border-radius:999px;cursor:pointer;border:1.5px solid transparent;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s,color .25s,filter .25s;text-decoration:none;white-space:nowrap}
body.vis-on .vis-btn--lg{padding:1.05em 2.1em;font-size:16px}
body.vis-on .vis-btn--primary{background:var(--btn-grad);color:#06223a;box-shadow:0 14px 30px -14px var(--accent-glow)}
body.vis-on .vis-btn--primary:hover{transform:translateY(-2px);box-shadow:0 20px 40px -16px var(--accent-glow);filter:saturate(112%)}
body.vis-on .vis-btn--ghost{background:transparent;color:var(--txt-strong);border-color:var(--line)}
body.vis-on .vis-btn--ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
body.vis-on .vis-btn--light-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.28)}
body.vis-on .vis-btn--light-ghost:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.55);transform:translateY(-2px)}

/* ── HERO ────────────────────────────────────────────────────────────────── */
body.vis-on .vis-hero{position:relative;padding:clamp(120px,16vw,180px) 0 clamp(60px,8vw,96px);overflow:hidden;
  background:radial-gradient(ellipse 120% 80% at 50% -20%,#e0effb 0%,transparent 60%),linear-gradient(168deg,#eef4fb 0%,var(--bg) 55%,#e8f1fb 100%)}
body.vis-on .vis-hero__glow{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 40% 50% at 88% 12%,var(--accent-glow) 0%,transparent 55%),radial-gradient(ellipse 36% 44% at 6% 92%,rgba(124,84,224,.12) 0%,transparent 55%);opacity:.7}
body.vis-on .vis-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,5vw,72px);align-items:center}
body.vis-on .vis-hero__title{font-family:var(--f-display);font-weight:700;font-size:clamp(40px,7vw,76px);line-height:.98;letter-spacing:-1.5px;color:var(--txt-strong);margin:18px 0 0}
body.vis-on .vis-hero__lead{margin:22px 0 0;font-size:clamp(17px,2vw,20px);color:var(--txt);max-width:560px}
body.vis-on .vis-hero__sub{margin:14px 0 0;font-size:16px;color:var(--txt-mute);max-width:540px}
body.vis-on .vis-hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin:30px 0 0}
body.vis-on .vis-hero__trust{list-style:none;margin:34px 0 0;padding:24px 0 0;border-top:1px solid var(--line-soft);display:flex;flex-wrap:wrap;gap:26px}
body.vis-on .vis-hero__trust li{font-size:13px;color:var(--txt-mute);line-height:1.4}
body.vis-on .vis-hero__trust strong{display:block;font-family:var(--f-display);font-size:18px;color:var(--txt-strong);letter-spacing:.3px}

/* panneau hero "3 en 1" */
body.vis-on .vis-panel{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--card-shadow);position:relative}
body.vis-on .vis-panel::before{content:"";position:absolute;inset:0;border-radius:22px;padding:1px;background:linear-gradient(150deg,var(--accent-glow),transparent 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.6}
body.vis-on .vis-panel__head{display:flex;align-items:center;gap:10px;padding:6px 6px 16px}
body.vis-on .vis-panel__badge{font-family:var(--f-display);font-weight:700;font-size:13px;letter-spacing:1px;color:#06223a;background:var(--btn-grad);padding:3px 11px;border-radius:999px}
body.vis-on .vis-panel__url{font-size:11.5px;color:var(--txt-mute);letter-spacing:.3px;flex:1;text-align:right}
body.vis-on .vis-xcard{display:block;padding:15px 16px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line-soft);margin-bottom:10px;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s;border-left:3px solid var(--xc,var(--accent))}
body.vis-on .vis-xcard:hover{transform:translateX(4px);box-shadow:0 12px 26px -18px rgba(17,26,69,.4);border-color:var(--xc,var(--accent))}
body.vis-on .vis-xcard__k{display:block;font-family:var(--f-display);font-weight:700;font-size:16px;color:var(--txt-strong);letter-spacing:.2px}
body.vis-on .vis-xcard__v{display:block;font-size:12.5px;color:var(--txt-mute);margin-top:3px}
body.vis-on .vis-xcard--cyan{--xc:#1296c9}
body.vis-on .vis-xcard--amber{--xc:#d98a1e}
body.vis-on .vis-xcard--violet{--xc:#7c54e0}
body.vis-on .vis-panel__foot{padding:10px 6px 4px;font-size:12px;color:var(--txt-mute);display:flex;align-items:center}

/* ── Grilles & cartes ────────────────────────────────────────────────────── */
body.vis-on .vis-grid{display:grid;gap:22px}
body.vis-on .vis-grid--3{grid-template-columns:repeat(3,1fr)}
body.vis-on .vis-card{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px;text-decoration:none;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;box-shadow:0 4px 18px -12px rgba(17,26,69,.25)}
body.vis-on .vis-card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--cc,var(--accent));transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
body.vis-on .vis-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(17,26,69,.5);border-color:color-mix(in srgb,var(--cc,var(--accent)) 45%,var(--line))}
body.vis-on .vis-card:hover::before{transform:scaleX(1)}
body.vis-on .vis-card__ic{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:13px;font-size:22px;color:var(--cc,var(--accent));background:color-mix(in srgb,var(--cc,var(--accent)) 12%,transparent);margin-bottom:18px}
body.vis-on .vis-card__t{font-family:var(--f-display);font-weight:700;font-size:21px;color:var(--txt-strong);margin:0 0 10px;letter-spacing:.2px}
body.vis-on .vis-card__d{font-size:15px;color:var(--txt);margin:0 0 18px;flex:1}
body.vis-on .vis-card__tag{font-size:11.5px;letter-spacing:.4px;color:var(--txt-mute);text-transform:uppercase;font-weight:600;margin-bottom:14px}
body.vis-on .vis-card__link{font-weight:700;font-size:14px;color:var(--cc,var(--accent));transition:gap .2s}
body.vis-on .vis-card--cyan{--cc:#1296c9}
body.vis-on .vis-card--amber{--cc:#d98a1e}
body.vis-on .vis-card--violet{--cc:#7c54e0}

/* ── POURQUOI ────────────────────────────────────────────────────────────── */
body.vis-on .vis-why{background:linear-gradient(180deg,var(--bg),var(--bg-soft))}
body.vis-on .vis-why__col{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:32px 28px;position:relative;box-shadow:0 4px 18px -12px rgba(17,26,69,.22)}
body.vis-on .vis-why__n{position:absolute;top:22px;right:26px;font-family:var(--f-display);font-size:46px;font-weight:700;color:var(--accent);opacity:.16;line-height:1}
body.vis-on .vis-why__k{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
body.vis-on .vis-why__t{font-family:var(--f-display);font-weight:700;font-size:22px;color:var(--txt-strong);margin:0 0 12px}
body.vis-on .vis-why__d{font-size:15px;color:var(--txt);margin:0}

/* ── PROCESS ─────────────────────────────────────────────────────────────── */
body.vis-on .vis-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:vs}
body.vis-on .vis-step{position:relative;padding:30px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 18px -12px rgba(17,26,69,.22)}
body.vis-on .vis-step__n{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;font-family:var(--f-display);font-weight:700;font-size:19px;color:#06223a;background:var(--btn-grad);margin-bottom:16px;box-shadow:0 10px 22px -12px var(--accent-glow)}
body.vis-on .vis-step__t{font-family:var(--f-display);font-weight:700;font-size:18px;color:var(--txt-strong);margin:0 0 10px;line-height:1.2}
body.vis-on .vis-step__d{font-size:14px;color:var(--txt-mute);margin:0}

/* ── FAQ ─────────────────────────────────────────────────────────────────── */
body.vis-on .vis-faq__list{display:flex;flex-direction:column;gap:12px}
body.vis-on .vis-faq__item{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .25s,box-shadow .25s}
body.vis-on .vis-faq__item[open]{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:var(--card-shadow)}
body.vis-on .vis-faq__item summary{list-style:none;cursor:pointer;padding:20px 56px 20px 22px;font-family:var(--f-display);font-weight:700;font-size:17.5px;color:var(--txt-strong);position:relative;transition:color .2s}
body.vis-on .vis-faq__item summary::-webkit-details-marker{display:none}
body.vis-on .vis-faq__item summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);font-size:24px;font-weight:400;color:var(--accent);transition:transform .3s var(--ease)}
body.vis-on .vis-faq__item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
body.vis-on .vis-faq__item summary:hover{color:var(--accent)}
body.vis-on .vis-faq__a{padding:0 22px 22px;font-size:15px;color:var(--txt)}
body.vis-on .vis-faq__a p{margin:0}

/* ── CTA FINALE (bande profonde — contraste premium, blanc sur navy = voulu) ─ */
body.vis-on .vis-cta{background:linear-gradient(150deg,#0c1740 0%,#0a1335 50%,#11183f 100%);overflow:hidden;text-align:center}
body.vis-on .vis-cta__glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 50% 60% at 50% -10%,rgba(62,203,245,.22),transparent 60%),radial-gradient(ellipse 40% 50% at 90% 110%,rgba(124,84,224,.18),transparent 55%)}
body.vis-on .vis-cta__inner{max-width:760px;margin:0 auto;text-align:center}
body.vis-on .vis-cta__title{font-family:var(--f-display);font-weight:700;font-size:clamp(32px,5.4vw,56px);line-height:1.04;letter-spacing:-.6px;color:#fff;margin:6px 0 0}
body.vis-on .vis-cta .vis-accent{color:var(--accent-br)}
body.vis-on .vis-cta__lead{color:rgba(225,234,250,.82);font-size:18px;margin:20px auto 0;max-width:600px}
body.vis-on .vis-cta__btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:34px 0 0}
body.vis-on .vis-cta__rea{margin:26px 0 0;font-size:13.5px;color:rgba(205,216,238,.62);display:flex;align-items:center;justify-content:center}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width:980px){
  body.vis-on .vis-hero__grid{grid-template-columns:1fr;gap:40px}
  body.vis-on .vis-hero__panel{max-width:460px}
  body.vis-on .vis-grid--3{grid-template-columns:repeat(2,1fr)}
  body.vis-on .vis-steps{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  body.vis-on .vis-grid--3,body.vis-on .vis-steps{grid-template-columns:1fr}
  body.vis-on .vis-hero{padding-top:clamp(104px,26vw,150px)}
  body.vis-on .vis-hero__cta .vis-btn,body.vis-on .vis-cta__btns .vis-btn{flex:1 1 auto}
  body.vis-on .vis-wrap{padding:0 18px}
}

/* ── DARK AUTO : ajustements spécifiques accueil ─────────────────────────── */
@media (prefers-color-scheme:dark){
  body.vis-on .vis-hero{background:radial-gradient(ellipse 120% 80% at 50% -20%,#0c1a33 0%,transparent 60%),linear-gradient(168deg,#080b14 0%,var(--bg) 55%,#0a0e1a 100%)}
  body.vis-on .vis-why{background:linear-gradient(180deg,var(--bg),#090c15)}
  body.vis-on .vis-card,body.vis-on .vis-why__col,body.vis-on .vis-step,body.vis-on .vis-faq__item,body.vis-on .vis-panel{background:var(--surface);border-color:var(--line)}
  body.vis-on .vis-xcard{background:rgba(255,255,255,.03)}
  body.vis-on .vis-cta{background:linear-gradient(150deg,#0a1230 0%,#070a1c 50%,#0b1130 100%)}
}

/* ══════════════════════════════════════════════════════════════════════════
   PAGE CONTACT (.vis-contact-root) + FORMULAIRE maison — light/dark auto
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-hero--compact{padding:clamp(118px,15vw,168px) 0 clamp(20px,4vw,40px)}
body.vis-on .vis-contact-head{max-width:760px}
body.vis-on .vis-contact-head .vis-hero__lead{margin-left:0}

body.vis-on .vis-contact__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(28px,4vw,56px);align-items:start}

/* — Colonne infos — */
body.vis-on .vis-contact__h{font-family:var(--f-display);font-weight:700;font-size:clamp(22px,3vw,28px);color:var(--txt-strong);margin:0 0 12px;line-height:1.12}
body.vis-on .vis-contact__intro{color:var(--txt-mute);font-size:15.5px;margin:0 0 26px}
body.vis-on .vis-contact__list{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:14px}
body.vis-on .vis-contact__item{display:grid;grid-template-columns:46px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:0 4px 18px -14px rgba(17,26,69,.25);transition:transform .25s var(--ease),border-color .25s,box-shadow .25s}
body.vis-on .vis-contact__item:hover{transform:translateX(3px);border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 14px 30px -20px rgba(17,26,69,.4)}
body.vis-on .vis-contact__ic{grid-row:1 / span 2;width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;font-size:20px;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
body.vis-on .vis-contact__k{font-size:11.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--txt-mute)}
body.vis-on .vis-contact__v{font-family:var(--f-display);font-weight:700;font-size:18px;color:var(--txt-strong);text-decoration:none;transition:color .2s}
a.vis-contact__v:hover{color:var(--accent)}
body.vis-on .vis-contact__rea{display:flex;flex-direction:column;gap:9px}
body.vis-on .vis-contact__rea p{margin:0;font-size:14.5px;color:var(--txt);display:flex;align-items:flex-start;gap:9px}
body.vis-on .vis-tick{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:var(--btn-grad);color:#06223a;font-size:12px;font-weight:800;margin-top:1px}

/* — Carte formulaire — */
body.vis-on .vis-formwrap{position:relative}
body.vis-on .vis-form{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:clamp(24px,3.5vw,40px);box-shadow:var(--card-shadow);position:relative;overflow:hidden}
body.vis-on .vis-form::before{content:"";position:absolute;left:0;top:0;height:4px;width:100%;background:var(--btn-grad)}
body.vis-on .vis-form__title{font-family:var(--f-display);font-weight:700;font-size:clamp(21px,2.6vw,26px);color:var(--txt-strong);margin:6px 0 4px}
body.vis-on .vis-form__sub{font-size:13.5px;color:var(--txt-mute);margin:0 0 22px}
body.vis-on .vis-req{color:var(--accent)}
body.vis-on .vis-field{display:flex;flex-direction:column;margin-bottom:16px}
body.vis-on .vis-field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
body.vis-on .vis-field label{font-size:13px;font-weight:700;letter-spacing:.2px;color:var(--txt-strong);margin-bottom:7px}
body.vis-on .vis-field input,
body.vis-on .vis-field select,
body.vis-on .vis-field textarea{
  font-family:var(--f-body);font-size:15px;color:var(--txt-strong);
  background:var(--surface-2);border:1.5px solid var(--line);border-radius:11px;
  padding:.78em .95em;width:100%;transition:border-color .2s,box-shadow .2s,background .2s;-webkit-appearance:none;appearance:none
}
body.vis-on .vis-field textarea{resize:vertical;min-height:120px;line-height:1.55}
body.vis-on .vis-field select{cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--accent) 50%),linear-gradient(135deg,var(--accent) 50%,transparent 50%);background-position:calc(100% - 20px) center,calc(100% - 14px) center;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}
body.vis-on .vis-field input::placeholder,
body.vis-on .vis-field textarea::placeholder{color:var(--txt-mute);opacity:.8}
body.vis-on .vis-field input:focus,
body.vis-on .vis-field select:focus,
body.vis-on .vis-field textarea:focus{outline:none;border-color:var(--accent);background:var(--surface);box-shadow:0 0 0 4px var(--accent-glow)}
body.vis-on .vis-form__submit{width:100%;margin-top:6px}
body.vis-on .vis-form__status{margin:14px 0 0;font-size:14.5px;font-weight:600;text-align:center;min-height:1.2em;transition:color .2s}
body.vis-on .vis-form__status.is-ok{color:#15a06a}
body.vis-on .vis-form__status.is-err{color:#e0533b}
body.vis-on .vis-form__status.is-load{color:var(--txt-mute)}
body.vis-on .vis-form__legal{margin:16px 0 0;font-size:12px;color:var(--txt-mute);text-align:center;line-height:1.5}

body.vis-on .vis-cta--slim{padding:clamp(44px,6vw,72px) 0}
body.vis-on .vis-cta--slim .vis-cta__title{font-size:clamp(26px,4vw,40px)}

@media (max-width:880px){
  body.vis-on .vis-contact__grid{grid-template-columns:1fr;gap:30px}
}
@media (max-width:560px){
  body.vis-on .vis-field-row{grid-template-columns:1fr}
}
@media (prefers-color-scheme:dark){
  body.vis-on .vis-form,body.vis-on .vis-contact__item{background:var(--surface);border-color:var(--line)}
  body.vis-on .vis-field input,body.vis-on .vis-field select,body.vis-on .vis-field textarea{background:rgba(255,255,255,.04)}
  body.vis-on .vis-field input:focus,body.vis-on .vis-field select:focus,body.vis-on .vis-field textarea:focus{background:rgba(255,255,255,.06)}
  body.vis-on .vis-form__status.is-ok{color:#3fd99a}
  body.vis-on .vis-form__status.is-err{color:#ff7a63}
}

/* ══════════════════════════════════════════════════════════════════════════
   FOOTER — liens légaux à droite du copyright (plus de bandeau noir) + bouton
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #site-footer .footer-copyright-inner{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px}
body.vis-on .vis-legal{margin-left:auto;display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px;font-family:var(--f-body)}
body.vis-on .vis-legal a{color:rgba(255,255,255,.72);text-decoration:none;transition:color .2s;letter-spacing:.2px}
body.vis-on .vis-legal a:hover{color:var(--accent-br)}
body.vis-on .vis-legal__sep{color:rgba(255,255,255,.28)}
/* bouton blanc invisible du footer → pill cyan premium */
body.vis-on #site-footer .button.white,
body.vis-on #site-footer a.button.white{
  background:var(--btn-grad)!important;color:#06223a!important;border:0!important;
  border-radius:999px;padding:.72em 1.5em;font-weight:700;letter-spacing:.3px;
  box-shadow:0 10px 26px -12px var(--accent-glow);transition:transform .25s var(--ease),filter .25s;display:inline-block
}
body.vis-on #site-footer .button.white:hover{transform:translateY(-2px);filter:saturate(112%)}
@media (max-width:680px){
  body.vis-on #site-footer .footer-copyright-inner{justify-content:center;text-align:center}
  body.vis-on .vis-legal{margin-left:0;justify-content:center}
}

/* ══════════════════════════════════════════════════════════════════════════
   PAGES LÉGALES (.vis-legalpage) — prose lisible clair/sombre
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-legalpage{padding:clamp(112px,14vw,160px) 0 clamp(48px,7vw,90px)}
body.vis-on .vis-legalpage .vis-wrap{max-width:820px}
body.vis-on .vis-legalpage h1{font-family:var(--f-display);font-size:clamp(28px,4.5vw,42px);color:var(--txt-strong);margin:0 0 8px;letter-spacing:-.5px}
body.vis-on .vis-legalpage .vis-legalpage__upd{color:var(--txt-mute);font-size:13.5px;margin:0 0 34px}
body.vis-on .vis-legalpage h2{font-family:var(--f-display);font-size:clamp(19px,2.6vw,24px);color:var(--txt-strong);margin:34px 0 10px}
body.vis-on .vis-legalpage p,body.vis-on .vis-legalpage li{color:var(--txt);font-size:15.5px;line-height:1.72}
body.vis-on .vis-legalpage ul{margin:0 0 14px;padding-left:22px}
body.vis-on .vis-legalpage a{color:var(--accent);font-weight:600}
body.vis-on .vis-legalpage strong{color:var(--txt-strong)}

/* ══════════════════════════════════════════════════════════════════════════
   SÉLECTEUR DE LANGUE (Nilume Translate : .ntr-dd) — premium navbar, clair/sombre
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .ntr-menu-switcher{position:relative;display:flex;align-items:center;list-style:none;margin:0 0 0 4px}
body.vis-on .ntr-dd-toggle{display:inline-flex;align-items:center;gap:.42em;cursor:pointer;font-family:var(--f-body);font-weight:700;font-size:12.5px;letter-spacing:.6px;color:var(--nav-link);background:transparent;border:1px solid var(--line);border-radius:999px;padding:.42em .78em;transition:all .25s var(--ease)}
body.vis-on .ntr-dd-toggle:hover{border-color:var(--accent-br);color:var(--accent)}
body.vis-on .ntr-dd-flag{font-size:14px;line-height:1}
body.vis-on .ntr-dd-caret{transition:transform .25s var(--ease)}
body.vis-on .ntr-dd.open .ntr-dd-caret{transform:rotate(180deg)}
body.vis-on .ntr-dd-menu{position:absolute;top:calc(100% + 12px);right:0;min-width:165px;z-index:99999;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--card-shadow);padding:6px;margin:0;list-style:none;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .22s var(--ease)}
/* ouverture pilotée par la classe .open (JS) uniquement — PAS :focus-within (le bouton
   garde le focus après clic → empêchait la fermeture au re-clic) */
body.vis-on .ntr-dd.open .ntr-dd-menu{opacity:1;visibility:visible;transform:none}
body.vis-on .ntr-dd-menu li{margin:0}
body.vis-on .ntr-dd-menu a{display:flex;align-items:center;gap:.6em;padding:.55em .62em;border-radius:8px;color:var(--nav-link)!important;font-weight:600;font-size:13.5px;text-decoration:none;transition:background .2s,color .2s}
body.vis-on .ntr-dd-menu a:hover{background:var(--surface-2);color:var(--accent)!important}
body.vis-on .ntr-dd-menu a.ntr-dd-active{color:var(--accent)!important;font-weight:800}

/* ══════════════════════════════════════════════════════════════════════════
   STYLE TECHNOLOGIQUE (.vsw/.vwp/.vap) — CLAIR par défaut · SOMBRE auto/toggle
   Les blocs bespoke définissent leurs couleurs en :root (inline). On les surcharge
   via html:root (spécificité (0,1,1) > :root (0,1,0)) → bascule propre. .vsw a des
   fonds EN DUR → on les repointe sur des tokens (donc ils flippent aussi).
   ════════════════════════════════════════════════════════════════════════════ */
/* — Tokens bespoke : CLAIR (défaut) — */
html:root{
  --c-dark:#eef2f8;--c-panel:rgba(255,255,255,.92);--c-panel2:#ffffff;
  --c-border:rgba(17,26,69,.12);--c-text:rgba(40,52,80,.84);--c-strong:#111a45;
  --c-muted:rgba(60,72,100,.55);--c-cyan:#1296c9;--c-amber:#c47f17;--c-violet:#6f49d6;
  --vsw-grid:rgba(17,26,69,.05);
  --vsw-bg1:radial-gradient(ellipse 80% 65% at 92% 8%,rgba(62,203,245,.18) 0%,transparent 55%),linear-gradient(150deg,#eef4fb 0%,#f6f9fd 55%,#e9f1fb 100%);
  --vsw-bg2:radial-gradient(ellipse 65% 55% at 6% 12%,rgba(255,175,30,.15) 0%,transparent 55%),linear-gradient(155deg,#fbf4e8 0%,#f7f9fc 55%,#eef3fb 100%);
  --vsw-bg3:radial-gradient(ellipse 70% 60% at 92% 8%,rgba(140,80,255,.15) 0%,transparent 55%),linear-gradient(145deg,#f1ecfb 0%,#f6f7fd 55%,#eef2fb 100%);
  --vsw-feat:rgba(255,255,255,.78);--vsw-feat-h:#ffffff;
  --vsw-title:rgba(17,26,69,.12);--vsw-tagline:#111a45;--vsw-desc:rgba(40,52,80,.74);--vsw-num:rgba(17,26,69,.14);
  --vsw-ctrl-bg:rgba(255,255,255,.85);--vsw-ctrl-tx:rgba(40,52,80,.8);
  --vsw-cta-bg:linear-gradient(118deg,#3ecbf5,#1296c9 60%,#2f6bff 130%);--vsw-cta-tx:#06223a;
}
/* — Tokens bespoke : SOMBRE (système, sauf .vis-light) = valeurs d'origine — */
@media (prefers-color-scheme:dark){html:root:not(.vis-light){
  --c-dark:#050508;--c-panel:rgba(10,10,18,.97);--c-panel2:rgba(14,14,24,.97);
  --c-border:rgba(62,203,245,.07);--c-text:rgba(200,196,212,.72);--c-strong:rgba(230,226,242,.94);
  --c-muted:rgba(150,146,168,.5);--c-cyan:rgba(62,203,245,.9);--c-amber:rgba(255,175,30,.9);--c-violet:rgba(140,80,255,.9);
  --vsw-grid:rgba(62,203,245,.04);
  --vsw-bg1:radial-gradient(ellipse 80% 65% at 92% 8%,rgba(62,203,245,.10) 0%,transparent 52%),linear-gradient(150deg,#070a12,#04060c 55%,#080b14);
  --vsw-bg2:radial-gradient(ellipse 65% 55% at 6% 12%,rgba(255,175,30,.12) 0%,transparent 52%),linear-gradient(155deg,#0e0800,#090500 55%,#0d0800);
  --vsw-bg3:radial-gradient(ellipse 70% 60% at 92% 8%,rgba(140,80,255,.14) 0%,transparent 52%),linear-gradient(145deg,#070312,#040110 55%,#080415);
  --vsw-feat:rgba(10,10,18,.95);--vsw-feat-h:rgba(18,18,28,.98);
  --vsw-title:rgba(232,228,240,.20);--vsw-tagline:rgba(235,228,240,.92);--vsw-desc:rgba(200,195,215,.62);--vsw-num:rgba(255,255,255,.16);
  --vsw-ctrl-bg:rgba(10,10,18,.85);--vsw-ctrl-tx:rgba(210,205,225,.8);
  --vsw-cta-bg:rgba(230,226,240,.96);--vsw-cta-tx:#050508;
}}
/* — Tokens bespoke : SOMBRE forcé (toggle .vis-dark) — */
html.vis-dark:root{
  --c-dark:#050508;--c-panel:rgba(10,10,18,.97);--c-panel2:rgba(14,14,24,.97);
  --c-border:rgba(62,203,245,.07);--c-text:rgba(200,196,212,.72);--c-strong:rgba(230,226,242,.94);
  --c-muted:rgba(150,146,168,.5);--c-cyan:rgba(62,203,245,.9);--c-amber:rgba(255,175,30,.9);--c-violet:rgba(140,80,255,.9);
  --vsw-grid:rgba(62,203,245,.04);
  --vsw-bg1:radial-gradient(ellipse 80% 65% at 92% 8%,rgba(62,203,245,.10) 0%,transparent 52%),linear-gradient(150deg,#070a12,#04060c 55%,#080b14);
  --vsw-bg2:radial-gradient(ellipse 65% 55% at 6% 12%,rgba(255,175,30,.12) 0%,transparent 52%),linear-gradient(155deg,#0e0800,#090500 55%,#0d0800);
  --vsw-bg3:radial-gradient(ellipse 70% 60% at 92% 8%,rgba(140,80,255,.14) 0%,transparent 52%),linear-gradient(145deg,#070312,#040110 55%,#080415);
  --vsw-feat:rgba(10,10,18,.95);--vsw-feat-h:rgba(18,18,28,.98);
  --vsw-title:rgba(232,228,240,.20);--vsw-tagline:rgba(235,228,240,.92);--vsw-desc:rgba(200,195,215,.62);--vsw-num:rgba(255,255,255,.16);
  --vsw-ctrl-bg:rgba(10,10,18,.85);--vsw-ctrl-tx:rgba(210,205,225,.8);
  --vsw-cta-bg:rgba(230,226,240,.96);--vsw-cta-tx:#050508;
}
/* — Overrides .vsw (fonds & textes EN DUR → via tokens) — */
body.vis-on .vsw-slide[data-s="1"] .vsw-bg{background:var(--vsw-bg1)}
body.vis-on .vsw-slide[data-s="2"] .vsw-bg{background:var(--vsw-bg2)}
body.vis-on .vsw-slide[data-s="3"] .vsw-bg{background:var(--vsw-bg3)}
body.vis-on .vsw-title{color:var(--vsw-title)}
body.vis-on .vsw-tagline{color:var(--vsw-tagline)}
body.vis-on .vsw-desc{color:var(--vsw-desc)}
body.vis-on .vsw-desc strong{color:var(--c-strong)}
body.vis-on .vsw-num{color:var(--vsw-num)}
body.vis-on .vsw-feat{background:var(--vsw-feat);border:1px solid var(--c-border)}
body.vis-on .vsw-feat:hover{background:var(--vsw-feat-h)}
body.vis-on .vsw-feat__title{color:var(--c-strong)}
body.vis-on .vsw-feat__desc{color:var(--c-text)}
body.vis-on .vsw-feat__desc strong{color:var(--c-strong)}
body.vis-on .vsw-cta{background:var(--vsw-cta-bg)!important;color:var(--vsw-cta-tx)!important}
body.vis-on .vsw-nav-btn,body.vis-on .vsw-dot-arrow,body.vis-on .vsw-pause{background:var(--vsw-ctrl-bg);color:var(--vsw-ctrl-tx)}
body.vis-on .vsw-counter,body.vis-on .vsw-scroll span{color:var(--c-muted)}

/* ══════════════════════════════════════════════════════════════════════════
   TOGGLE THÈME (bouton soleil/lune injecté dans la barre d'icônes)
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-left:4px;cursor:pointer;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--nav-link);transition:all .25s var(--ease);padding:0}
body.vis-on .vis-theme-toggle:hover{border-color:var(--accent-br);color:var(--accent)}
body.vis-on .vis-theme-toggle svg{width:18px;height:18px;display:block}
body.vis-on .vis-theme-toggle .vis-ic-moon{display:none}
body.vis-on .vis-theme-toggle .vis-ic-sun{display:block}
html.vis-dark body.vis-on .vis-theme-toggle .vis-ic-moon{display:block}
html.vis-dark body.vis-on .vis-theme-toggle .vis-ic-sun{display:none}
@media (prefers-color-scheme:dark){html:not(.vis-light) body.vis-on .vis-theme-toggle .vis-ic-moon{display:block}html:not(.vis-light) body.vis-on .vis-theme-toggle .vis-ic-sun{display:none}}

/* ══════════════════════════════════════════════════════════════════════════
   FOOTER — flèche « remonter » ne doit plus chevaucher les liens légaux
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #site-footer .footer-copyright-inner{padding-right:62px;position:relative}
body.vis-on #site-footer .go-to-top,
body.vis-on #site-footer .go-to-top a{z-index:5}
@media (max-width:680px){body.vis-on #site-footer .footer-copyright-inner{padding-right:0;padding-bottom:54px}}

/* ══════════════════════════════════════════════════════════════════════════
   BOUTONS NON ARRONDIS (style net / technologique) — override global
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .vis-btn,
body.vis-on #content .button,
body.vis-on #content .elementor-button,
body.vis-on .header-info-text a,
body.vis-on .header-info-text a.paoc-popup-button,
body.vis-on #site-footer .button,
body.vis-on #site-footer .button.white,
body.vis-on .vis-form__submit,
body.vis-on .vsw-cta,
body.vis-on .vsw [class*="cta"],
body.vis-on .vwp [class*="cta"],
body.vis-on .vwp [class*="btn"],
body.vis-on .vis-lang__btn,
body.vis-on .ntr-dd-toggle{border-radius:2px!important}

/* ══════════════════════════════════════════════════════════════════════════
   PAGES REFAITES (.vis-clean) — masque la titlebar marlab (.content-header)
   → la page démarre directement avec notre héros, comme les autres.
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-clean .content-header{display:none!important}

/* ══════════════════════════════════════════════════════════════════════════
   PAGES PRESTA — composants .vwp-* (piliers/stats/sections) + slides .vsw 1→9
   Fonds EN DUR (pas les tokens) → on les force via des tokens clair/sombre.
   Cartes lisibles, sections claires ; les bandes "écran"/CTA restent sombres (voulu).
   ════════════════════════════════════════════════════════════════════════════ */
html:root{
  --vwp-card:rgba(255,255,255,.94);--vwp-card-h:#ffffff;
  --vwp-sect:radial-gradient(ellipse 70% 60% at 100% 0%,rgba(62,203,245,.06),transparent 55%),radial-gradient(ellipse 60% 55% at 0% 100%,rgba(124,84,224,.05),transparent 55%);
  --vsw-bgl:radial-gradient(ellipse 80% 65% at 88% 10%,rgba(62,203,245,.14) 0%,transparent 55%),linear-gradient(150deg,#eef4fb 0%,#f6f9fd 55%,#e9f1fb 100%);
}
@media (prefers-color-scheme:dark){html:root:not(.vis-light){
  --vwp-card:rgba(11,9,20,.96);--vwp-card-h:rgba(16,13,28,.98);
  --vwp-sect:radial-gradient(ellipse 70% 60% at 100% 0%,rgba(62,203,245,.05),transparent 55%);
  --vsw-bgl:radial-gradient(ellipse 80% 65% at 88% 10%,rgba(62,203,245,.10) 0%,transparent 52%),linear-gradient(150deg,#070a12,#04060c 55%,#080b14);
}}
html.vis-dark:root{
  --vwp-card:rgba(11,9,20,.96);--vwp-card-h:rgba(16,13,28,.98);
  --vwp-sect:radial-gradient(ellipse 70% 60% at 100% 0%,rgba(62,203,245,.05),transparent 55%);
  --vsw-bgl:radial-gradient(ellipse 80% 65% at 88% 10%,rgba(62,203,245,.10) 0%,transparent 52%),linear-gradient(150deg,#070a12,#04060c 55%,#080b14);
}
/* toutes les slides du slider (1→9) */
body.vis-on .vsw-slide .vsw-bg{background:var(--vsw-bgl)!important}
/* racine .vwp = base (token --c-dark déjà flippé) */
body.vis-on .vwp{background:var(--c-dark)}
/* sections : on neutralise les gros gradients sombres → halo subtil sur la base */
body.vis-on .vwp-hero,body.vis-on .vwp-services,body.vis-on .vwp-process,
body.vis-on .vwp-pillars,body.vis-on .vwp-stats,body.vis-on .vwp-faq{background:var(--vwp-sect)!important}
/* cartes lisibles (le texte est déjà passé en foncé via --c-text) */
body.vis-on .vwp-pillar,body.vis-on .vwp-stat,body.vis-on .vwp-service,
body.vis-on .vwp-step,body.vis-on .vwp-faq-item{background:var(--vwp-card)!important;border:1px solid var(--c-border)}
body.vis-on .vwp-pillar:hover,body.vis-on .vwp-service:hover,body.vis-on .vwp-faq-item:hover{background:var(--vwp-card-h)!important}

/* ══════════════════════════════════════════════════════════════════════════
   NAVBAR — garder celle DU HAUT (toggle/langue/recherche) même au scroll.
   On masque le header flottant dépouillé de marlab et on fixe #site-header.
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on #site-header-sticky{display:none!important}
body.vis-on #site-header{position:fixed!important;top:0;left:0;right:0;width:100%;z-index:990;overflow:visible}
/* au scroll : verre dépoli via ::before (pas de filtre sur le header → méga-menu OK) */
body.vis-on.vis-scrolled #site-header.header-transparent{background:transparent!important}
body.vis-on.vis-scrolled #site-header::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--nav-glass);
  -webkit-backdrop-filter:saturate(160%) blur(16px);backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid var(--nav-glass-brd);box-shadow:var(--nav-shadow)
}

/* ══════════════════════════════════════════════════════════════════════════
   MICRO-FIXES : méga-menu promo · surlignage navbar · CTA bas accueil
   ════════════════════════════════════════════════════════════════════════════ */
/* (1) Méga-menu À Propos : widget promo (titre + texte) thémé clair/sombre */
body.vis-on .navigator .sub-menu .widget-title,
body.vis-on .navigator .megamenu .widget-title{color:var(--txt-strong)!important;font-family:var(--f-display)}
body.vis-on .navigator .sub-menu .textwidget,
body.vis-on .navigator .sub-menu .textwidget p,
body.vis-on .navigator .megamenu .textwidget,
body.vis-on .navigator .megamenu .textwidget p{color:var(--txt)!important}
body.vis-on .navigator .sub-menu .textwidget strong{color:var(--txt-strong)!important}
body.vis-on .navigator .sub-menu .textwidget a{color:var(--accent)!important}

/* (2) Navbar : ZÉRO fond/boîte sur les items dans TOUS les états (ID-scopé = priorité max).
       La page courante garde juste sa police bleu clair (réglée plus haut). */
body.vis-on #site-header .navigator .menu-primary > li > a,
body.vis-on #site-header .navigator .menu-primary > li:hover > a,
body.vis-on #site-header .navigator .menu-primary > li.megamenu:hover > a,
body.vis-on #site-header .navigator .menu-primary > li.menu-item-has-children:hover > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-item > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-parent > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-ancestor > a,
body.vis-on #site-header .navigator .menu-primary > li.current_page_item > a{background:transparent!important;background-color:transparent!important;box-shadow:none!important}

/* (3) CTA bas (.vwp-cta-final) : clair en clair, sombre en sombre */
html:root{--vwp-cta-bg:radial-gradient(ellipse 65% 80% at 50% 0%,rgba(62,203,245,.12),transparent 60%),linear-gradient(160deg,#e9f1fb 0%,#f4f7fc 60%,#e9f0fb 100%)}
@media (prefers-color-scheme:dark){html:root:not(.vis-light){--vwp-cta-bg:radial-gradient(ellipse 65% 80% at 50% 0%,rgba(62,203,245,.10),transparent 60%),linear-gradient(160deg,#0a0e1a,#05070f 60%,#0a0e1c)}}
html.vis-dark:root{--vwp-cta-bg:radial-gradient(ellipse 65% 80% at 50% 0%,rgba(62,203,245,.10),transparent 60%),linear-gradient(160deg,#0a0e1a,#05070f 60%,#0a0e1c)}
body.vis-on .vwp-cta-final{background:var(--vwp-cta-bg)!important}
body.vis-on .vwp-cta-final [class*="title"],
body.vis-on .vwp-cta-final h2{color:var(--c-strong)}

/* ══════════════════════════════════════════════════════════════════════════
   CORRECTIFS FINAUX NAVBAR + CTA (priorité max, supersèdent les essais précédents)
   ════════════════════════════════════════════════════════════════════════════ */
/* (a) Dropdown / méga-menu : panneau CLAIR + texte FONCÉ en TOUS modes (le dropdown est blanc) */
body.vis-on #site-header .navigator .menu-primary .sub-menu{background:#ffffff!important;border:1px solid rgba(17,26,69,.12)!important;box-shadow:0 20px 48px -26px rgba(17,26,69,.45)!important}
body.vis-on #site-header .navigator .menu-primary .sub-menu li > a,
body.vis-on #site-header .navigator .menu-primary .sub-menu .widget-title,
body.vis-on #site-header .navigator .menu-primary .sub-menu .textwidget,
body.vis-on #site-header .navigator .menu-primary .sub-menu .textwidget p{color:#1b2456!important}
body.vis-on #site-header .navigator .menu-primary .sub-menu .textwidget strong{color:#0f1740!important}
body.vis-on #site-header .navigator .menu-primary .sub-menu li > a:hover,
body.vis-on #site-header .navigator .menu-primary .sub-menu .textwidget a{color:#1296c9!important}

/* (b) Soulignage = dégradé, piloté par OPACITÉ (mécanisme marlab) : SURVOL seul, JAMAIS la page courante */
body.vis-on #site-header .navigator .menu-primary > li > a:after{background:linear-gradient(90deg,var(--accent-br),var(--accent-2))!important;height:2px!important;left:0!important;right:0!important;bottom:0!important;width:auto!important;opacity:0!important;transition:opacity .25s ease!important}
body.vis-on #site-header .navigator .menu-primary > li:hover > a:after{opacity:1!important}
body.vis-on #site-header .navigator .menu-primary > li.current-menu-item > a:after,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-parent > a:after,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-ancestor > a:after,
body.vis-on #site-header .navigator .menu-primary > li.current_page_item > a:after,
body.vis-on #site-header .navigator .menu-primary > li.current_page_ancestor > a:after{opacity:0!important}

/* (c) Page courante = police bleu clair, AUCUN fond/boîte/soulignage */
body.vis-on #site-header .navigator .menu-primary > li.current-menu-item > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-parent > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-ancestor > a,
body.vis-on #site-header .navigator .menu-primary > li.current_page_item > a,
body.vis-on #site-header .navigator .menu-primary > li.current_page_ancestor > a{color:var(--accent-br)!important;background:transparent!important;box-shadow:none!important}

/* (d) Méga-menu COMPLET en mode flottant : aucun clipping (le panneau fait 900px) */
body.vis-on #site-header,
body.vis-on #site-header .site-header-inner,
body.vis-on #site-header .navigator,
body.vis-on #site-header .navigator .menu-primary{overflow:visible!important}
body.vis-on #site-header .navigator .menu-primary > li.megamenu > .sub-menu{z-index:9999!important}

/* (e) CTA bas accueil : fallback clair garanti même si le token échoue */
body.vis-on .vwp-cta-final{background:var(--vwp-cta-bg,linear-gradient(160deg,#e9f1fb 0%,#f4f7fc 60%,#e9f0fb 100%))!important}

/* ══════════════════════════════════════════════════════════════════════════
   CORRECTIFS NAVBAR v2 — méga-menu lisible partout + ZÉRO surlignage/boîte
   ════════════════════════════════════════════════════════════════════════════ */
/* (1) Méga-menu : TOUT le texte foncé & lisible (titres de colonnes inclus, qui étaient pâles) */
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu li > a,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .widget-title,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .textwidget,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .textwidget p,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu *{color:#1b2456!important;opacity:1!important}
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu > li > a,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .widget-title{font-weight:700!important;color:#0f1740!important}
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .textwidget strong{color:#0f1740!important}
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu li > a:hover,
body.vis-on #site-header .navigator .menu-primary .megamenu .sub-menu .textwidget a{color:#1296c9!important}

/* (2) NUKE total du surlignage : aucun fond/boîte/ombre/sélection sur les liens du menu (tous états) */
body.vis-on #site-header .navigator .menu-primary li > a,
body.vis-on #site-header .navigator .menu-primary li:hover > a,
body.vis-on #site-header .navigator .menu-primary li:focus-within > a,
body.vis-on #site-header .navigator .menu-primary li > a:hover,
body.vis-on #site-header .navigator .menu-primary li > a:focus,
body.vis-on #site-header .navigator .menu-primary li > a:active,
body.vis-on #site-header .navigator .menu-primary li.current-menu-item > a,
body.vis-on #site-header .navigator .menu-primary li.current-menu-parent > a,
body.vis-on #site-header .navigator .menu-primary li.current-menu-ancestor > a,
body.vis-on #site-header .navigator .menu-primary li.current_page_item > a,
body.vis-on #site-header .navigator .menu-primary li.current_page_ancestor > a{background:transparent!important;background-color:transparent!important;background-image:none!important;box-shadow:none!important;border-radius:0!important}
/* sélection de texte sur la navbar : discrète, jamais une grosse boîte */
body.vis-on #site-header .navigator ::selection{background:rgba(62,203,245,.22)!important;color:inherit!important}
/* la page courante : marquée UNIQUEMENT par la couleur de police (bleu clair) */
body.vis-on #site-header .navigator .menu-primary > li.current-menu-item > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-parent > a,
body.vis-on #site-header .navigator .menu-primary > li.current-menu-ancestor > a,
body.vis-on #site-header .navigator .menu-primary > li.current_page_item > a,
body.vis-on #site-header .navigator .menu-primary > li.current_page_ancestor > a{color:var(--accent-br)!important}
/* soulignage marlab (::after) : visible au survol uniquement */
body.vis-on #site-header .navigator .menu-primary > li > a:after{opacity:0!important}
body.vis-on #site-header .navigator .menu-primary > li:hover > a:after{opacity:1!important}

/* ══════════════════════════════════════════════════════════════════════════
   NAVBAR — BLOC FINAL UNIQUE (supersède tous les essais précédents)
   Cible les 2 headers (.site-header + .site-header-sticky), 100% thème-aware,
   !important sur le critique. Règle : texte lisible · dropdown suit le thème ·
   page courante = police bleu clair · zéro boîte (sélection désactivée).
   ════════════════════════════════════════════════════════════════════════════ */
body.vis-on .site-header,body.vis-on .site-header-sticky{overflow:visible!important}
/* verre dépoli thème-aware (clair frosté en clair, sombre frosté en sombre) */
body.vis-on .site-header:not(.header-transparent)::before,
body.vis-on.vis-scrolled .site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--nav-glass);-webkit-backdrop-filter:saturate(160%) blur(16px);backdrop-filter:saturate(160%) blur(16px);border-bottom:1px solid var(--nav-glass-brd);box-shadow:var(--nav-shadow)}

/* MENU : texte forcé LISIBLE (navy en clair / clair en sombre), aucune boîte, pas de sélection */
body.vis-on .navigator .menu-primary > li > a{color:var(--nav-link)!important;background:transparent!important;background-color:transparent!important;box-shadow:none!important;border-radius:0!important;-webkit-user-select:none;user-select:none}
body.vis-on .navigator .menu-primary > li:hover > a{color:var(--accent)!important}
/* page courante = police bleu clair, rien d'autre */
body.vis-on .navigator .menu-primary > li.current-menu-item > a,
body.vis-on .navigator .menu-primary > li.current-menu-parent > a,
body.vis-on .navigator .menu-primary > li.current-menu-ancestor > a,
body.vis-on .navigator .menu-primary > li.current_page_item > a,
body.vis-on .navigator .menu-primary > li.current_page_ancestor > a{color:var(--accent-br)!important;background:transparent!important}
/* soulignage marlab : survol seul */
body.vis-on .navigator .menu-primary > li > a:after{opacity:0!important}
body.vis-on .navigator .menu-primary > li:hover > a:after{opacity:1!important}
/* sélection de texte sur la navbar : discrète (jamais une grosse boîte) */
body.vis-on .site-header ::selection,body.vis-on .site-header-sticky ::selection{background:rgba(62,203,245,.25)!important;color:inherit!important}

/* DROPDOWN / méga-menu : THÈME-AWARE (clair: panneau blanc+texte foncé / sombre: panneau sombre+texte clair) */
body.vis-on .navigator .menu-primary .sub-menu{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:var(--card-shadow)!important}
body.vis-on .navigator .menu-primary .sub-menu li > a,
body.vis-on .navigator .menu-primary .sub-menu .widget-title,
body.vis-on .navigator .menu-primary .sub-menu .textwidget,
body.vis-on .navigator .menu-primary .sub-menu .textwidget p,
body.vis-on .navigator .menu-primary .sub-menu *{color:var(--txt-strong)!important;opacity:1!important}
body.vis-on .navigator .menu-primary .sub-menu li > a:hover,
body.vis-on .navigator .menu-primary .sub-menu .textwidget a{color:var(--accent)!important}