/* TARIFIA — identité visuelle « Émeraude & Or », tirée du logo (anneau orange, cœur vert, T doré). Chargée en dernier. */
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url(/fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url(/fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url(/fonts/poppins-700.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-weight:800;font-display:swap;src:url(/fonts/poppins-800.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:400;font-display:swap;src:url(/fonts/inter-400.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:500;font-display:swap;src:url(/fonts/inter-500.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:600;font-display:swap;src:url(/fonts/inter-600.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:700;font-display:swap;src:url(/fonts/inter-700.woff2) format("woff2")}

:root{
  --b-em-900:#04291a;--b-em-800:#063521;--b-em-700:#08452b;--b-em-600:#0b5d3b;--b-em-500:#10794c;--b-em-400:#1a9a61;
  --b-or-700:#b45f00;--b-or-600:#d97400;--b-or-500:#f08c00;--b-or-400:#ffa31a;--b-gold:#ffc35c;--b-gold-2:#ffdc93;
  --b-ivory:#fdf8ee;--b-ink:#0d1f17;
  --b-ring:linear-gradient(135deg,#ffb238 0%,#f08c00 45%,#c76a00 100%);
  --b-gold-grad:linear-gradient(180deg,#ffe2a1 0%,#ffc35c 45%,#e89a1c 100%);
  --b-card:linear-gradient(160deg,rgb(255 255 255/.075),rgb(255 255 255/.02));
  --b-line:rgb(255 195 92/.28);
  --b-shadow:0 18px 40px -18px rgb(0 0 0/.55),0 2px 0 rgb(0 0 0/.12);
  --b-r:18px;
}

/* ---------- Base ---------- */
html body{font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:.005em}
html body :is(h1,h2,h3,h4,.x-welcome,.head__eyebrow,.hero__eyebrow,.x-brand,.x-count,.g-card__title){font-family:"Poppins","Inter",system-ui,sans-serif;letter-spacing:-.01em}
html body :is(h1,h2){font-weight:800}
html body :is(h3,h4){font-weight:700}

/* Fond sombre : émeraude profonde avec halos orange/or comme l'anneau du logo */
:root[data-theme="dark"],:root[data-theme="dark"] body{background-color:var(--b-em-800)!important}
:root[data-theme="dark"] body{background:
  radial-gradient(900px 520px at 85% -8%,rgb(240 140 0/.20),transparent 60%),
  radial-gradient(700px 600px at -10% 30%,rgb(26 154 97/.28),transparent 60%),
  radial-gradient(900px 700px at 50% 110%,rgb(255 195 92/.10),transparent 60%),
  linear-gradient(180deg,var(--b-em-700) 0%,var(--b-em-800) 45%,var(--b-em-900) 100%) fixed!important;color:var(--b-ivory)}
:root[data-theme="dark"] .x-3d-bg{opacity:.55}

/* Fond clair : ivoire chaud, accents émeraude et or */
:root[data-theme="light"] body{background:
  radial-gradient(800px 480px at 90% -10%,rgb(240 140 0/.12),transparent 60%),
  radial-gradient(700px 600px at -10% 35%,rgb(16 121 76/.10),transparent 60%),
  linear-gradient(180deg,#fffaf1,#f7efe0) fixed!important;color:var(--b-ink)}

/* ---------- En-tête ---------- */
html body .nav.glass{background:linear-gradient(180deg,rgb(6 53 33/.92),rgb(4 41 26/.88))!important;-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 1px 0 rgb(255 195 92/.35),0 10px 30px -14px rgb(0 0 0/.6)!important;border-bottom:0!important}
html body .nav.glass::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--b-ring);opacity:.95}
html body .x-brand{gap:10px;color:#fff!important;font-weight:800;font-size:1.12rem;letter-spacing:.06em}
html body .x-brand__mark{width:34px!important;height:34px!important;border-radius:50%!important;background:url(/logo-pdf.jpg) center/cover no-repeat!important;
  box-shadow:0 0 0 2px rgb(255 195 92/.55),0 6px 14px -4px rgb(240 140 0/.6)!important}
html body .x-brand__mark::before,html body .x-brand__mark::after{display:none!important}
html body .x-brand>span:last-child{background:var(--b-gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
html body .nav.glass .seg a{color:rgb(253 248 238/.82)!important;border-radius:999px;font-weight:600}
html body .nav.glass .seg a[aria-current="true"]{background:var(--b-ring)!important;color:#1a0f00!important;box-shadow:0 4px 12px -4px rgb(240 140 0/.7)}

/* ---------- Boutons ---------- */
html body .btn{border-radius:14px!important;font-family:"Poppins","Inter",sans-serif;font-weight:700!important;letter-spacing:.01em;transition:transform .15s ease,box-shadow .2s ease,filter .2s}
html body .btn:active{transform:translateY(1px) scale(.99)}
html body :is(.btn--orange,.x-go,.x-cta,.btn.x-go){background:var(--b-ring)!important;border:0!important;color:#1d1000!important;
  box-shadow:inset 0 1px 0 rgb(255 255 255/.55),inset 0 -2px 0 rgb(0 0 0/.15),0 10px 22px -10px rgb(240 140 0/.85)!important;text-shadow:0 1px 0 rgb(255 255 255/.35)}
html body :is(.btn--orange,.x-go,.x-cta):hover{filter:brightness(1.06);box-shadow:inset 0 1px 0 rgb(255 255 255/.6),0 14px 26px -10px rgb(240 140 0/.95)!important}
:root[data-theme="dark"] .btn:not(.btn--orange):not(.x-go):not(.x-cta):not(.btn--danger):not(.btn--green){background:rgb(255 255 255/.06)!important;color:var(--b-ivory)!important;
  border:1px solid var(--b-line)!important;box-shadow:none!important}
:root[data-theme="light"] .btn:not(.btn--orange):not(.x-go):not(.x-cta):not(.btn--danger):not(.btn--green){background:#fff!important;color:var(--b-em-600)!important;border:1px solid rgb(11 93 59/.25)!important;box-shadow:0 4px 12px -8px rgb(11 93 59/.4)!important}
html body .btn--green{background:linear-gradient(135deg,var(--b-em-400),var(--b-em-600))!important;color:#fff!important;border:0!important}

/* ---------- Cartes, panneaux, encadrés ---------- */
:root[data-theme="dark"] :is(.cards>div,.x-panel,.callout,.step,.breakdown,.x-simbox,.x-vhbox,.chart,.g-card,#stats>div,.table-wrap){
  background:var(--b-card)!important;border:1px solid var(--b-line)!important;border-radius:var(--b-r)!important;box-shadow:var(--b-shadow)!important;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
:root[data-theme="light"] :is(.cards>div,.x-panel,.callout,.step,.breakdown,.x-simbox,.x-vhbox,.chart,#stats>div,.table-wrap){
  background:#fff!important;border:1px solid rgb(240 140 0/.22)!important;border-radius:var(--b-r)!important;box-shadow:0 14px 30px -18px rgb(11 61 39/.35)!important}

/* Compteurs : chiffres dorés */
html body #stats>div{position:relative;overflow:hidden}
html body #stats>div::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--b-ring)}
html body #stats>div>:first-child{font-family:"Poppins",sans-serif;font-weight:800!important;font-size:clamp(1.6rem,6vw,2.1rem);
  background:var(--b-gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;text-shadow:none!important;filter:drop-shadow(0 2px 6px rgb(0 0 0/.35))}
:root[data-theme="light"] #stats>div>:first-child{background:linear-gradient(180deg,var(--b-em-500),var(--b-em-700));-webkit-background-clip:text;background-clip:text}
html body #stats>div>:last-child{font-weight:600;opacity:.92;text-shadow:none!important}
html body #stats>div *{transform:none!important}
:root[data-theme="light"] #stats>div>:first-child{filter:none}

/* ---------- Intro / héros ---------- */
html body .x-intro{background:
  radial-gradient(600px 300px at 100% 0%,rgb(240 140 0/.25),transparent 60%),
  linear-gradient(150deg,var(--b-em-500) 0%,var(--b-em-600) 40%,var(--b-em-800) 100%)!important;
  border:1px solid rgb(255 195 92/.4)!important;border-bottom:0!important;border-radius:24px!important;position:relative;overflow:hidden;
  box-shadow:0 24px 50px -22px rgb(0 0 0/.7),inset 0 1px 0 rgb(255 255 255/.12)!important}
html body .x-intro::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--b-ring)}
html body .x-intro .hero__eyebrow{background:rgb(4 41 26/.55)!important;color:var(--b-gold)!important;border:1px solid rgb(255 195 92/.5);box-shadow:none!important;border-radius:999px!important;font-weight:700;letter-spacing:.08em}
html body .x-intro h1{color:#fff!important;text-shadow:0 2px 14px rgb(0 0 0/.35)}
html body .x-intro h1 span{background:var(--b-gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent!important}
html body .x-intro .x-welcome__sub{color:rgb(253 248 238/.92)!important}
html body .x-intro .x-welcome__sub strong{color:var(--b-gold)!important}
html body .x-intro .hero__meta{color:rgb(253 248 238/.7)!important}

/* ---------- Titres de rubriques ---------- */
html body .head__eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.74rem}
:root[data-theme="dark"] .head__eyebrow{color:var(--b-gold)!important;background:rgb(255 195 92/.10);border:1px solid rgb(255 195 92/.35)}
:root[data-theme="light"] .head__eyebrow{color:var(--b-or-700)!important;background:rgb(240 140 0/.10);border:1px solid rgb(240 140 0/.3)}
:root[data-theme="dark"] .head h2{color:#fff}
:root[data-theme="light"] .head h2{color:var(--b-em-700)}
html body .head h2::after{content:"";display:block;width:64px;height:4px;margin-top:12px;border-radius:4px;background:var(--b-ring)}
:root[data-theme="dark"] .head__sub{color:rgb(253 248 238/.78)!important}

/* ---------- Formulaires ---------- */
html body :is(input,select,textarea){border-radius:12px!important;transition:border-color .15s,box-shadow .15s}
:root[data-theme="dark"] :is(input,select,textarea){background:rgb(4 41 26/.65)!important;border:1px solid rgb(255 195 92/.3)!important;color:#fff!important}
:root[data-theme="light"] :is(input,select,textarea){background:#fff!important;border:1px solid rgb(11 93 59/.25)!important;color:var(--b-ink)!important}
html body :is(input,select,textarea):focus{outline:none!important;border-color:var(--b-or-500)!important;box-shadow:0 0 0 3px rgb(240 140 0/.28)!important}
html body .x-field,html body .x-label{font-weight:600}

/* ---------- Bandeau abonnement, accès réservé ---------- */
html body .x-ben,html body .x-gate{background:
  radial-gradient(500px 260px at 100% 0%,rgb(240 140 0/.22),transparent 60%),
  linear-gradient(160deg,var(--b-em-500),var(--b-em-800))!important;border:1px solid rgb(255 195 92/.4)!important;border-radius:24px!important;
  box-shadow:0 24px 50px -24px rgb(0 0 0/.7),inset 0 -4px 0 var(--b-or-500)!important}
html body .x-gate h2,html body .x-ben h2{color:#fff!important}
html body .x-gate__price,html body .x-ben__eye{color:var(--b-gold)!important;font-weight:800}

/* ---------- Totaux ---------- */
html body .row--total{border-radius:12px;background:linear-gradient(90deg,rgb(240 140 0/.18),rgb(255 195 92/.06))!important;border:1px solid rgb(240 140 0/.45)}
:root[data-theme="dark"] .row--total dd{color:var(--b-gold)!important;font-family:"Poppins",sans-serif;font-weight:800}
:root[data-theme="light"] .row--total dd{color:var(--b-or-700)!important;font-family:"Poppins",sans-serif;font-weight:800}

/* ---------- Barre du bas ---------- */
html body .x-tabbar{background:linear-gradient(180deg,rgb(6 53 33/.94),rgb(4 41 26/.97))!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgb(255 195 92/.3)!important;box-shadow:0 -10px 30px -12px rgb(0 0 0/.6),inset 0 2px 0 rgb(240 140 0/.9)!important}
html body .x-tabbar :is(a,button){color:rgb(253 248 238/.75)!important;font-weight:600}
html body .x-tabbar :is(a,button)[aria-current="page"],html body .x-tabbar .is-on{color:var(--b-gold)!important}
html body .x-tabbar__ico{border-radius:12px}

/* ---------- Pied de page, feuille « Plus » ---------- */
html body .foot{background:linear-gradient(180deg,transparent,rgb(4 41 26/.6))!important;border-top:1px solid rgb(255 195 92/.25)}
:root[data-theme="light"] .foot{background:linear-gradient(180deg,transparent,rgb(240 140 0/.06))!important}
:root[data-theme="dark"] .x-sheet{background:linear-gradient(180deg,var(--b-em-700),var(--b-em-900))!important;border:1px solid var(--b-line)!important;color:var(--b-ivory)}
html body .x-sheet a{border-radius:14px}

/* ---------- Tableaux ---------- */
:root[data-theme="dark"] thead th{color:var(--b-gold)!important;font-family:"Poppins",sans-serif;letter-spacing:.03em}
html body tbody tr{transition:background .15s}
:root[data-theme="dark"] tbody tr:hover{background:rgb(255 195 92/.06)}

/* ---------- Assistante IA ---------- */
html body .x-ai__head{background:linear-gradient(150deg,var(--b-em-500),var(--b-em-800))!important;box-shadow:inset 0 -3px 0 var(--b-or-500)}

/* Liens */
:root[data-theme="dark"] .link,:root[data-theme="dark"] main a:not(.btn):not([class]){color:var(--b-gold)}

/* Respect des préférences d'animation */
@media (prefers-reduced-motion:reduce){html body .btn{transition:none}}

/* ===== Couche 3D professionnelle ===== */
html body .main{perspective:1400px}
/* Cartes en relief : biseau doré, profondeur, inclinaison au survol/au doigt */
html body :is(.cards>div,#stats>div,.x-panel,.breakdown,.x-simbox,.x-vhbox,.callout,.step,.table-wrap,.x-intro,.x-ben,.x-gate){
  transform-style:preserve-3d;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;will-change:transform;
  box-shadow:0 1px 0 rgb(255 226 161/.35) inset,0 -6px 0 rgb(0 0 0/.22) inset,0 6px 0 var(--b-em-900),0 10px 0 rgb(240 140 0/.55),0 30px 50px -18px rgb(0 0 0/.75)!important}
:root[data-theme="light"] :is(.cards>div,#stats>div,.x-panel,.breakdown,.x-simbox,.x-vhbox,.callout,.step,.table-wrap){
  box-shadow:0 1px 0 #fff inset,0 -5px 0 rgb(11 93 59/.08) inset,0 6px 0 #e9dcc4,0 9px 0 rgb(240 140 0/.45),0 26px 40px -18px rgb(11 61 39/.45)!important}
html body .x-tilt-on{--lift:1}
html body :is(.cards>div,#stats>div,.x-panel)>*{transform:translateZ(calc(var(--lift,0) * 28px));transition:transform .35s}
/* Reflet lumineux qui suit l'inclinaison */
html body :is(.cards>div,#stats>div,.x-intro,.x-ben,.x-gate){position:relative;overflow:hidden}
html body :is(.cards>div,#stats>div,.x-intro,.x-ben,.x-gate)::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:radial-gradient(420px 220px at var(--gx,30%) var(--gy,0%),rgb(255 226 161/.22),transparent 60%);mix-blend-mode:screen}
/* Titres extrudés en relief doré */
:root[data-theme="dark"] :is(.head h2,.x-intro h1,.x-gate h2,.x-ben h2){text-shadow:0 1px 0 #0a4a30,0 2px 0 #08402a,0 3px 0 #063521,0 4px 0 #052c1c,0 5px 0 #b45f00,0 10px 18px rgb(0 0 0/.55)!important}
:root[data-theme="light"] .head h2{text-shadow:0 1px 0 #f7d79a,0 2px 0 #f2c26b,0 3px 0 #e9a53a,0 8px 14px rgb(11 61 39/.25)}
/* Boutons 3D : bloc biseauté qui s'enfonce */
html body :is(.btn--orange,.x-go,.x-cta){box-shadow:inset 0 2px 0 rgb(255 255 255/.6),inset 0 -3px 0 rgb(120 60 0/.35),0 5px 0 #a35400,0 12px 22px -8px rgb(240 140 0/.8)!important;transform:translateY(0)}
html body :is(.btn--orange,.x-go,.x-cta):active{transform:translateY(4px)!important;box-shadow:inset 0 2px 0 rgb(255 255 255/.5),0 1px 0 #a35400,0 4px 10px -4px rgb(240 140 0/.7)!important}
:root[data-theme="dark"] .btn:not(.btn--orange):not(.x-go):not(.x-cta):not(.btn--danger){box-shadow:inset 0 1px 0 rgb(255 226 161/.25),0 4px 0 var(--b-em-900),0 10px 18px -8px rgb(0 0 0/.6)!important}
/* Champs creusés */
:root[data-theme="dark"] :is(input,select,textarea){box-shadow:inset 0 3px 8px rgb(0 0 0/.45),inset 0 -1px 0 rgb(255 226 161/.15)!important}
/* Logo d'en-tête : pièce 3D qui tourne */
html body .x-brand__mark{animation:b-coin 9s cubic-bezier(.6,0,.4,1) infinite;transform-style:preserve-3d}
@keyframes b-coin{0%,70%{transform:rotateY(0)}85%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}
/* Barre du bas flottante en relief */
html body .x-tabbar{box-shadow:inset 0 2px 0 rgb(240 140 0/.9),inset 0 1px 0 rgb(255 226 161/.3),0 -2px 0 var(--b-em-900),0 -18px 40px -12px rgb(0 0 0/.7)!important}
html body .x-tabbar :is(a,button)[aria-current="page"] .x-tabbar__ico,html body .x-tabbar .is-on .x-tabbar__ico{transform:translateY(-6px) scale(1.08);box-shadow:0 4px 0 #a35400,0 10px 16px -6px rgb(240 140 0/.8)}
/* Apparition en profondeur au défilement */
html body .x-rise{opacity:0;transform:perspective(1000px) translateY(40px) rotateX(14deg)}
html body .x-rise.is-in{opacity:1;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){html body *{animation:none!important}html body .x-rise{opacity:1;transform:none}}
html body .x-intro h1 span{text-shadow:none!important;filter:drop-shadow(0 3px 0 #7a3f00) drop-shadow(0 8px 10px rgb(0 0 0/.5))}

/* ===== Cartes d'action 3D aux couleurs du logo (les deux thèmes) ===== */
html:root[data-theme] body main:not(#_) .cards{gap:22px!important}
html:root[data-theme] body main:not(#_) .cards>div{
  background-color:#0b5d3b!important;background-image:radial-gradient(120% 90% at 100% 0%,rgb(240 140 0/.35),transparent 55%),radial-gradient(90% 80% at 0% 100%,rgb(255 199 64/.18),transparent 60%),linear-gradient(150deg,#13804f 0%,#0b5d3b 45%,#063a25 100%)!important;
  border:2px solid transparent!important;border-radius:24px!important;padding:22px 20px 20px 96px!important;min-height:150px;color:#fff!important;
  background-clip:padding-box!important;outline:2px solid rgb(255 199 64/.55);outline-offset:-2px;
  box-shadow:inset 0 2px 0 rgb(255 226 161/.45),inset 0 -8px 16px rgb(0 0 0/.3),0 7px 0 #063a25,0 12px 0 #d97a00,0 34px 46px -16px rgb(4 40 24/.8)!important}
html:root[data-theme] body main:not(#_) .cards>div h3{color:#ffd56b!important;font:800 1.18rem/1.2 Poppins,sans-serif!important;letter-spacing:-.01em;text-shadow:0 2px 0 #063a25,0 3px 0 #a35400,0 8px 14px rgb(0 0 0/.5)!important}
html:root[data-theme] body main:not(#_) .cards>div p{color:rgb(255 255 255/.9)!important}
html:root[data-theme] body main:not(#_) .cards>div::before{position:absolute;left:18px;top:22px;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;font-size:28px;
  background:radial-gradient(circle at 35% 30%,#ffe9a8,#ffb020 45%,#d97a00 80%);border:3px solid #fff3cf;
  box-shadow:inset 0 -5px 0 rgb(120 60 0/.35),inset 0 3px 0 rgb(255 255 255/.7),0 5px 0 #8a4700,0 12px 18px -4px rgb(0 0 0/.55);transform:translateZ(40px)}
html:root[data-theme] body main:not(#_) .cards>div:nth-child(1)::before{content:"🔎"}html:root[data-theme] body main:not(#_) .cards>div:nth-child(2)::before{content:"🧮"}
html:root[data-theme] body main:not(#_) .cards>div:nth-child(3)::before{content:"🚗"}html:root[data-theme] body main:not(#_) .cards>div:nth-child(4)::before{content:"📦"}
html:root[data-theme] body main:not(#_) .cards>div:nth-child(5)::before{content:"📋"}html:root[data-theme] body main:not(#_) .cards>div:nth-child(6)::before{content:"🤝"}
html:root[data-theme] body main:not(#_) .cards>div:nth-child(n+7)::before{content:"⭐"}
html:root[data-theme] body main:not(#_) .cards>div .btn{background:linear-gradient(180deg,#ffc94a,#f39200 60%,#d97a00)!important;color:#3a1d00!important;border:0!important;border-radius:999px!important;font-weight:800!important;
  box-shadow:inset 0 2px 0 rgb(255 255 255/.65),inset 0 -3px 0 rgb(120 60 0/.35),0 5px 0 #8a4700,0 12px 20px -8px rgb(0 0 0/.6)!important}
html:root[data-theme] body main:not(#_) .cards>div .btn::after{content:" →"}
html:root[data-theme] body main:not(#_) .cards>div .btn:active{transform:translateY(4px)!important;box-shadow:inset 0 2px 0 rgb(255 255 255/.5),0 1px 0 #8a4700!important}
@media (max-width:380px){html:root[data-theme] body main:not(#_) .cards>div{padding-left:20px!important;padding-top:96px!important}}

/* (bande défilante : voir « Ticker NYSE » en fin de fichier) */
/* ===== Réactivité au premier toucher ===== */
html,body,a,button,[role="button"],.btn,input,select,label{touch-action:manipulation}
a,button,.btn,[role="button"]{-webkit-tap-highlight-color:rgb(243 146 0/.25)}
@media (hover:none){html body :is(.cards>div,#stats>div,.x-panel,.breakdown,.x-simbox,.x-vhbox,.callout,.step,.table-wrap,.x-intro,.x-ben,.x-gate){transform:none!important;transition:box-shadow .2s!important}
  html body :is(.cards>div,#stats>div,.x-panel)>*{transform:none!important}}
/* Éléments cliquables immobiles : un seul toucher suffit */
html:root body:not(#_) :is(.btn,button,a,.cards>div,.x-tabbar,.x-tabbar *,.theme-btn,#stats>div,.x-panel,.callout,.step):not(.x-brand__mark){animation:none!important}
html:root body:not(#_) .x-rise{opacity:1!important;transform:none!important}
/* ===== Tous les panneaux en 3D émeraude, couleurs du logo (les deux thèmes) ===== */
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.x-lock,.card,.g-card){
  background-color:#0b5d3b!important;
  background-image:radial-gradient(110% 80% at 100% 0%,rgb(240 140 0/.28),transparent 55%),radial-gradient(90% 70% at 0% 100%,rgb(255 199 64/.14),transparent 60%),linear-gradient(155deg,#13804f 0%,#0b5d3b 50%,#063a25 100%)!important;
  color:#fff!important;border:0!important;border-radius:24px!important;outline:2px solid rgb(255 199 64/.55);outline-offset:-2px;
  box-shadow:inset 0 2px 0 rgb(255 226 161/.45),inset 0 -8px 16px rgb(0 0 0/.3),0 7px 0 #063a25,0 12px 0 #d97a00,0 34px 46px -16px rgb(4 40 24/.75)!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.x-lock,.card,.g-card) :is(p,span,li,td,dd,dt,label,small,div,.row,.fineprint){color:rgb(255 255 255/.88)!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.x-lock,.card,.g-card) :is(h2,h3,h4,strong,b,th,.step__eyebrow,.step__num,legend){color:#ffd56b!important;-webkit-text-fill-color:#ffd56b!important;background:none!important;text-shadow:0 2px 0 #063a25,0 4px 10px rgb(0 0 0/.45)!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div) :is(.row,tr){border-color:rgb(255 199 64/.25)!important}
html:root body:not(#_) :is(.breakdown,.x-simbox,.x-vhbox,.x-panel) .row--total{background:linear-gradient(180deg,#ffc94a,#f39200 60%,#d97a00)!important;border-radius:16px!important;
  box-shadow:inset 0 2px 0 rgb(255 255 255/.6),inset 0 -3px 0 rgb(120 60 0/.35),0 5px 0 #8a4700,0 12px 20px -8px rgb(0 0 0/.6)!important}
html:root body:not(#_) .row--total :is(*,strong,span,small,b){color:#3a1d00!important;-webkit-text-fill-color:#3a1d00!important;text-shadow:none!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card) :is(input,select,textarea){background:#fffaf0!important;color:#0b3d27!important;-webkit-text-fill-color:#0b3d27!important;border:2px solid rgb(255 199 64/.7)!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card) a:not(.btn){color:#ffd56b!important}
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card) .btn:not(.x-go):not(.x-cta):not(.btn--orange){background:linear-gradient(180deg,#1a9a60,#0b5d3b)!important;color:#fff!important;border:1px solid rgb(255 199 64/.6)!important;box-shadow:inset 0 1px 0 rgb(255 226 161/.4),0 4px 0 #04291a!important}
/* Titres en dégradé doré : relief net (pas d'ombre floue derrière le texte transparent) */
html:root body:not(#_) :is(.callout h2,.callout h3,.callout__lead,.head h2,.x-intro h1){text-shadow:none!important;filter:drop-shadow(0 2px 0 #063a25) drop-shadow(0 3px 0 #a35400) drop-shadow(0 8px 10px rgb(0 0 0/.45))}

/* ===== Équilibre des couleurs du logo : autant d'orange que de vert ===== */
:root{--o-card:radial-gradient(110% 80% at 0% 0%,rgb(255 236 170/.55),transparent 55%),radial-gradient(90% 70% at 100% 100%,rgb(11 93 59/.22),transparent 60%),linear-gradient(155deg,#ffbf3a 0%,#f39200 50%,#c96a00 100%)}
/* Une carte / un panneau sur deux en orange, socle vert */
html:root body:not(#_) main .cards>div:nth-child(even),
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.card,.g-card):nth-child(even){
  background-color:#f39200!important;background-image:var(--o-card)!important;outline-color:rgb(11 93 59/.6)!important;
  box-shadow:inset 0 2px 0 rgb(255 255 255/.6),inset 0 -8px 16px rgb(120 60 0/.25),0 7px 0 #a35400,0 12px 0 #0b5d3b,0 34px 46px -16px rgb(4 40 24/.7)!important}
html:root body:not(#_) main .cards>div:nth-child(even) :is(p,small,span),
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.card,.g-card):nth-child(even) :is(p,span,li,td,dd,dt,label,small,div,.row,.fineprint){color:#2b1500!important}
html:root body:not(#_) main .cards>div:nth-child(even) h3,
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,#stats>div,.aside,.chart,.card,.g-card):nth-child(even) :is(h2,h3,h4,strong,b,th,.step__eyebrow,.step__num,legend){color:#063a25!important;-webkit-text-fill-color:#063a25!important;text-shadow:0 1px 0 rgb(255 255 255/.7),0 3px 8px rgb(120 60 0/.35)!important}
html:root body:not(#_) :is(#stats>div,.stat):nth-child(even) :is(strong,b,h2,h3,[class*="num"],[class*="val"]){color:#063a25!important;-webkit-text-fill-color:#063a25!important}
/* Médaillon et bouton inversés sur les cartes orange : vert émeraude */
html:root body:not(#_) main .cards>div:nth-child(even)::before{background:radial-gradient(circle at 35% 30%,#3fd08a,#13804f 45%,#063a25 85%)!important;border-color:#ffe2a1!important;box-shadow:inset 0 -5px 0 rgb(0 0 0/.3),inset 0 3px 0 rgb(255 255 255/.4),0 5px 0 #04291a,0 12px 18px -4px rgb(0 0 0/.5)!important}
html:root body:not(#_) main .cards>div:nth-child(even) .btn,
html:root body:not(#_) :is(.breakdown,.step,.x-panel,.x-simbox,.x-vhbox,.aside,.card):nth-child(even) .btn{background:linear-gradient(180deg,#1fae6c,#0b5d3b 60%,#063a25)!important;color:#fff!important;border:0!important;box-shadow:inset 0 2px 0 rgb(255 255 255/.4),inset 0 -3px 0 rgb(0 0 0/.3),0 5px 0 #04291a,0 12px 20px -8px rgb(0 0 0/.55)!important}
html:root body:not(#_) :is(.breakdown,.x-simbox,.x-vhbox,.x-panel):nth-child(even) .row--total{background:linear-gradient(180deg,#1fae6c,#0b5d3b 60%,#063a25)!important;box-shadow:inset 0 2px 0 rgb(255 255 255/.4),0 5px 0 #04291a!important}
html:root body:not(#_) :is(.breakdown,.x-simbox,.x-vhbox,.x-panel):nth-child(even) .row--total :is(*,strong,span,small,b){color:#ffd56b!important;-webkit-text-fill-color:#ffd56b!important}
/* En-tête et barre du bas : deux blocs émeraude, écritures blanches en 3D (demande utilisateur 2026-10-20) */
html:root body:not(#_) header.nav,html:root body:not(#_) header.nav.glass,html:root body:not(#_) .x-tabbar{
 background:radial-gradient(120% 140% at 20% 0%,rgb(80 220 150/.35),transparent 55%),linear-gradient(160deg,#1fa86a 0%,#13804f 35%,#0b5d3b 70%,#063a25 100%)!important;
 background-color:#0b5d3b!important;border:1px solid rgb(120 255 190/.35)!important;
 box-shadow:inset 0 2px 0 rgb(200 255 225/.45),inset 0 -4px 0 rgb(0 0 0/.25),0 6px 0 #04291a,0 14px 30px -10px rgb(0 0 0/.65)!important}
html:root body:not(#_) header.nav{border-radius:0 0 22px 22px!important;border-top:0!important;border-bottom:1px solid rgb(120 255 190/.35)!important}
html:root body:not(#_) header.nav::after{display:none!important}
html:root body:not(#_) .x-tabbar{border-radius:22px!important;box-shadow:inset 0 2px 0 rgb(200 255 225/.45),inset 0 -4px 0 rgb(0 0 0/.25),0 -4px 0 #04291a,0 -14px 30px -10px rgb(0 0 0/.6)!important}
html:root body:not(#_) :is(header.nav,.x-tabbar) :is(a,span,strong,b,i,small,button,.x-tab2):not(.x-tabbar__ico):not(.x-tabbar__ico *):not(.x-brand__mark){
 color:#fff!important;-webkit-text-fill-color:#fff!important;background-clip:border-box!important;-webkit-background-clip:border-box!important;
 text-shadow:0 1px 0 #b9dcc9,0 2px 0 #6fa98a,0 3px 0 #2f6b4f,0 4px 5px rgb(0 0 0/.5)!important}
html:root body:not(#_) :is(header.nav,.x-tabbar) :is(.x-tabbar__ico,.x-tabbar__ico *){text-shadow:none!important}
html:root body:not(#_) .x-brand > span:not(.x-brand__mark){font-weight:900!important;letter-spacing:.06em!important}
/* Fond : halos vert et orange de même intensité */
:root[data-theme="dark"] body:not(#_){background:radial-gradient(70% 45% at 0% 0%,rgb(19 128 79/.55),transparent 70%),radial-gradient(70% 45% at 100% 100%,rgb(243 146 0/.45),transparent 70%),radial-gradient(60% 40% at 100% 20%,rgb(243 146 0/.30),transparent 70%),radial-gradient(60% 40% at 0% 80%,rgb(19 128 79/.40),transparent 70%),#04170f!important;background-attachment:fixed!important}
:root[data-theme="light"] body:not(#_){background:radial-gradient(70% 45% at 0% 0%,rgb(19 128 79/.22),transparent 70%),radial-gradient(70% 45% at 100% 100%,rgb(243 146 0/.24),transparent 70%),radial-gradient(60% 40% at 100% 20%,rgb(243 146 0/.18),transparent 70%),radial-gradient(60% 40% at 0% 80%,rgb(19 128 79/.18),transparent 70%),#fff8ec!important;background-attachment:fixed!important}
/* Pièces « Pourquoi s'abonner » en damier vert / orange */
html:root body:not(#_) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--a{background:radial-gradient(circle at 30% 25%,#ffc04a,#f39200 55%,#b86400)!important;color:#2b1500!important;border-color:#0b5d3b!important}
html:root body:not(#_) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--a :is(*,strong,p,span,small){color:#063a25!important;-webkit-text-fill-color:#063a25!important;text-shadow:0 1px 0 rgb(255 255 255/.6)!important}
html:root body:not(#_) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--a .x-coin__ico{background:radial-gradient(circle at 35% 30%,#3fd08a,#13804f 50%,#063a25)!important}
html:root body:not(#_) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--b{background:radial-gradient(circle at 30% 25%,#1d8a5b,#0b5d3b 55%,#06301f)!important;color:#fff!important}
html:root body:not(#_) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--b :is(*,strong,p,span){color:#fff!important;-webkit-text-fill-color:#fff!important}
/* Compteurs orange : chiffres verts lisibles */
html:root body:not(#_) .stat:nth-child(even) :is(.stat__fig,.stat__label){color:#063a25!important;-webkit-text-fill-color:#063a25!important;background:none!important;text-shadow:0 1px 0 rgb(255 255 255/.6)!important}
/* Encadrés (statut, infos) : orange en relief, texte net */
html:root body:not(#_) .callout:not(.x-ben){background:var(--o-card)!important;background-color:#f39200!important;border:0!important;border-radius:24px!important;outline:2px solid rgb(11 93 59/.6);outline-offset:-2px;
  box-shadow:inset 0 2px 0 rgb(255 255 255/.6),inset 0 -8px 16px rgb(120 60 0/.25),0 7px 0 #a35400,0 12px 0 #0b5d3b,0 34px 46px -16px rgb(4 40 24/.6)!important}
html:root body:not(#_) .callout:not(.x-ben) :is(p,span,li,div,small,strong,b,.callout__head,.callout__lead,h2,h3){color:#2b1500!important;-webkit-text-fill-color:#2b1500!important;text-shadow:none!important;filter:none!important;background:none}
html:root body:not(#_) .callout:not(.x-ben) :is(.callout__head,h2,h3,strong){color:#063a25!important;-webkit-text-fill-color:#063a25!important}
html:root body:not(#_) .callout:not(.x-ben) .btn{background:linear-gradient(180deg,#1fae6c,#0b5d3b 60%,#063a25)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;box-shadow:inset 0 2px 0 rgb(255 255 255/.4),0 5px 0 #04291a!important}
html:root body:not(#_) .callout:not(.x-ben) .btn *{color:#fff!important;-webkit-text-fill-color:#fff!important}
html:root body:not(#_) header.nav .x-brand > span:not(.x-brand__mark){background:none!important;background-image:none!important}

/* ===== Ticker style NYSE / Times Square ===== */
@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/robotomono-var.woff2) format("woff2")}
html body .x-tick{position:sticky;top:var(--x-tick-top,0);z-index:40;display:flex;align-items:stretch;height:42px;margin:0 0 6px;overflow:hidden;
  background:#050505;border-top:1px solid #2a2a2a;border-bottom:1px solid #2a2a2a;box-shadow:inset 0 1px 0 rgb(255 255 255/.04),0 6px 14px -8px rgb(0 0 0/.7);
  color:#fff;font:600 14px/42px "Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-variant-numeric:tabular-nums;letter-spacing:0;-webkit-font-smoothing:antialiased;text-shadow:none}
html body .x-tick__lbl{flex:none;display:flex;align-items:center;gap:7px;padding:0 11px 0 12px;background:#000;border-right:1px solid #333;color:#fff;font:700 10.5px/1 "Roboto Mono",ui-monospace,monospace;letter-spacing:.12em;box-shadow:6px 0 10px -4px #000;position:relative;z-index:1}
html body .x-tick__lbl::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#ff3b30;box-shadow:0 0 0 0 rgb(255 59 48/.7);animation:x-pulse 1.6s ease-out infinite}
@keyframes x-pulse{0%{box-shadow:0 0 0 0 rgb(255 59 48/.75)}70%{box-shadow:0 0 0 7px rgb(255 59 48/0)}100%{box-shadow:0 0 0 0 rgb(255 59 48/0)}}
html body .x-tick__vp{flex:1;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent);mask:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}
html body .x-tick__tr{display:flex;width:max-content;animation:x-scroll 300s linear infinite;will-change:transform;transform:translate3d(0,0,0)}
html body .x-tick__tr>div{display:flex;align-items:center;white-space:nowrap}
html body .x-tick:hover .x-tick__tr,html body .x-tick.is-held .x-tick__tr{animation-play-state:paused}
@keyframes x-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
html body .x-tick .q{display:inline-flex;align-items:baseline;gap:7px;padding:0 15px;border-right:1px solid #262626;line-height:42px;color:#fff}
html body .x-tick .q b{color:#fff;font-weight:700;letter-spacing:.02em}
html body .x-tick .q span{color:#e6e6e6;font-weight:500}
html body .x-tick .q small{color:#8a8a8a;font-weight:500;font-size:11px}
html body .x-tick .q i{font-style:normal;font-weight:700}
html body .x-tick .q i.up{color:#00d26a}html body .x-tick .q i.dn{color:#ff3b30}html body .x-tick .q i.eq{color:#9a9a9a}
html body .x-tick .sec{display:inline-flex;align-items:center;padding:0 12px;height:22px;margin:0 6px 0 12px;border:1px solid #3a3a3a;border-radius:3px;color:#ffb300;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1}
@media (max-width:420px){html body .x-tick{font-size:13px}html body .x-tick .q{padding:0 12px;gap:6px}}
@media (prefers-reduced-motion:reduce){html body .x-tick__tr{animation-duration:900s!important}}

/* ===== Drapeau ivoirien animé + bouton hymne ===== */
.x-civ{flex:none;position:relative;display:inline-flex;align-items:center;width:46px;height:40px;margin:0 8px 0 0;padding:0;border:0;background:none!important;box-shadow:none!important;cursor:pointer;-webkit-tap-highlight-color:transparent}
.x-civ__pole{position:absolute;left:3px;top:4px;bottom:3px;width:2.5px;border-radius:2px;background:linear-gradient(90deg,#8a6a1c,#f6dd8a 45%,#a07a22);box-shadow:1px 0 2px rgb(0 0 0/.4)}
.x-civ__pole::before{content:"";position:absolute;left:-2px;top:-4px;width:6.5px;height:6.5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6c9,#d9a93a 55%,#7a5614)}
.x-civ__flag{position:absolute;left:5px;top:6px;width:36px;height:24px;display:flex;filter:drop-shadow(0 2px 2px rgb(0 0 0/.35))}
.x-civ__flag i{--a:var(--a0);flex:1 1 0;height:100%;position:relative;background:linear-gradient(90deg,#F77F00 0 33.334%,#FFFFFF 33.334% 66.667%,#009E60 66.667% 100%);background-size:36px 100%;background-position:calc(var(--i) * -2px) 0;
  animation:x-wave 1.5s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.085s);will-change:transform;transform:translate3d(0,calc(var(--a) * -1),0)}
.x-civ__flag i::after{content:"";position:absolute;inset:0;background:#000;opacity:0;animation:x-shade 1.5s ease-in-out infinite alternate;animation-delay:inherit}
.x-civ__flag i:first-child{border-radius:1px 0 0 1px}.x-civ__flag i:last-child{border-radius:0 1px 1px 0}
@keyframes x-wave{from{transform:translate3d(0,calc(var(--a) * -1),0)}to{transform:translate3d(0,var(--a),0)}}
@keyframes x-shade{0%{opacity:.26}50%{opacity:.04}100%{opacity:0}}
.x-civ__snd{position:absolute;right:-2px;bottom:-1px;width:15px;height:15px;border-radius:50%;display:grid;place-items:center;background:#063a25;border:1px solid rgb(255 255 255/.55);box-shadow:0 1px 3px rgb(0 0 0/.5)}
.x-civ__snd svg{width:10px;height:10px;fill:#fff;stroke:#fff}
.x-civ .x-civ__off{display:none}.x-civ.is-muted .x-civ__on{display:none}.x-civ.is-muted .x-civ__off{display:block}
.x-civ:not(.is-muted).is-playing .x-civ__snd{animation:x-sndp 1.2s ease-in-out infinite}
@keyframes x-sndp{50%{box-shadow:0 0 0 3px rgb(255 179 0/.35),0 1px 3px rgb(0 0 0/.5)}}
.x-civ:focus-visible{outline:2px solid #ffb347;outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){.x-civ__flag i,.x-civ__flag i::after{animation-duration:4s}.x-civ__flag i{--a:calc(var(--a0) * .4)}}
/* Place pour le drapeau sur téléphone */
@media (max-width:440px){html:root body:not(#_) header.nav .theme-lbl{margin-right:6px!important;padding:6px 8px!important;gap:3px!important;font-size:10px!important;letter-spacing:.03em!important}
  html:root body:not(#_) header.nav .theme-lbl small{display:none!important}}
@media (max-width:390px){html:root body:not(#_) header.nav .theme-lbl i{display:none!important}html:root body:not(#_) header.nav .theme-lbl{padding:5px 7px!important;font-size:9.5px!important;letter-spacing:0!important;margin-right:2px!important}.x-civ{margin:0 2px 0 0;width:41px}}
@media (max-width:350px){html:root body:not(#_) header.nav .theme-lbl{display:none!important}.x-civ{margin-left:auto}}

/* ===== 2026-10-20 : en-têtes de rubriques en bloc émeraude, textes blancs en relief (lisibles en sombre ET clair) ===== */
html:root body:not(#_) .x-tab > .head{position:relative;isolation:isolate;overflow:hidden;padding:22px 24px;border-radius:var(--r-l,22px);
  background:linear-gradient(160deg,#1fa86a 0%,#13804f 34%,#0b5d3b 68%,#063a25 100%)!important;border:1px solid rgb(255 201 74/.55)!important;color:#fff!important;
  box-shadow:inset 0 1px 0 rgb(255 255 255/.28),inset 0 -4px 0 #f08c00,0 4px 0 #04291a,0 18px 36px -12px rgb(6 58 37/.55)!important}
html:root body:not(#_) .x-tab > .head h2{color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;
  text-shadow:0 1px 0 #b9dcc9,0 2px 0 #6fa98a,0 3px 0 #2f6b4f,0 4px 6px rgb(0 0 0/.5)!important}
html:root body:not(#_) .x-tab > .head .head__eyebrow{color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important;background:rgb(0 0 0/.2)!important;border:1px solid rgb(255 201 74/.5)!important;text-shadow:0 1px 1px rgb(0 0 0/.45)!important}
html:root body:not(#_) .x-tab > .head :is(.head__sub,p:not(.head__eyebrow),li,span:not(.x-ico),small,strong){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 2px rgb(0 0 0/.35)}
html:root body:not(#_) .x-tab > .head a:not(.btn){color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important}
/* Cartes « Réservé aux abonnés » : même relief blanc */
html:root body:not(#_) .x-gate h2{color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 0 #b9dcc9,0 2px 0 #6fa98a,0 3px 0 #2f6b4f,0 4px 6px rgb(0 0 0/.5)!important}
html:root body:not(#_) .x-gate{border:1px solid rgb(255 201 74/.45)}

/* ===== 2026-10-20 : bandeau EN DIRECT pleine largeur, plus haut, texte plus grand ===== */
html,body{overflow-x:clip}
html body .x-tick{width:100vw!important;max-width:none!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;border-radius:0!important;
  height:60px;font-size:20px;line-height:60px}
html body .x-tick .q{line-height:60px;gap:10px;padding:0 20px}
html body .x-tick .q small{font-size:14px}
html body .x-tick .sec{height:30px;font-size:13px;padding:0 14px}
html body .x-tick__lbl{font-size:13px;padding:0 14px 0 16px;gap:9px}
html body .x-tick__lbl::before{width:9px;height:9px}
@media (max-width:420px){html body .x-tick{font-size:20px;height:58px;line-height:58px}html body .x-tick .q{line-height:58px;padding:0 16px;gap:8px}html body .x-tick__lbl{font-size:12px;padding:0 10px 0 12px}}
@media (min-width:900px){html body .x-tick{height:68px;line-height:68px;font-size:24px}html body .x-tick .q{line-height:68px;padding:0 24px;gap:12px}html body .x-tick .q small{font-size:15px}html body .x-tick__lbl{font-size:14px;padding:0 18px 0 20px}html body .x-tick .sec{height:34px;font-size:14px}}

/* ==================== 2026-10-20 lisibilité ====================
   Règles uniques, deux thèmes : texte sur vert = blanc (relief 3D pour chiffres/titres, ombre légère pour le corps),
   texte sur orange/or = brun très foncé #2a1400, texte sur fond clair = encre #10261b / émeraude #0b5d3b. */
:root{--l-3d:0 1px 0 #b9dcc9,0 2px 0 #6fa98a,0 3px 0 #2f6b4f,0 4px 6px rgb(0 0 0/.5);--l-soft:0 1px 2px rgb(0 0 0/.45);--l-hi:0 1px 0 rgb(255 255 255/.35);--l-ink:#2a1400}
/* Compteurs de l'accueil : fini le texte en dégradé (vert sur vert en clair) */
html:root body:not(#_):not(#__) #stats>div .stat__fig,html:root body:not(#_):not(#__) #stats>div>:first-child{
 background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;filter:none!important;
 color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-3d)!important}
html:root body:not(#_):not(#__) #stats>div:not(:nth-child(even)) :is(.stat__label,span:not(.stat__fig),p){color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) #stats>div:nth-child(even) .stat__fig,html:root body:not(#_):not(#__) #stats>div:nth-child(even)>:first-child{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) #stats>div:nth-child(even) :is(.stat__label,span:not(.stat__fig),p){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;opacity:1!important;font-weight:700!important;text-shadow:var(--l-hi)!important}
/* Panneaux verts : titres et valeurs en blanc 3D (au lieu de l'or pâle) */
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,.aside,.chart,.x-lock,.card,.g-card,.x-gate):not(:nth-child(even)) :is(h2,h3,h4,th,legend,.step__num):not(.row--total *):not(.btn *){
 color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important;text-shadow:var(--l-3d)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,.aside,.chart,.x-lock,.card,.g-card):not(:nth-child(even)) :is(strong,b):not(.row--total *):not(.btn *){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,.aside,.chart,.x-lock,.card,.g-card):not(:nth-child(even)) :is(p,li,td,dd,dt,label,small,.fineprint):not(.row--total *):not(.btn *):not(.x-bad):not(.x-ok){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) :is(.step__eyebrow,.head__eyebrow){color:#fff0c4!important;-webkit-text-fill-color:#fff0c4!important;text-shadow:0 1px 2px rgb(0 0 0/.55)!important}
/* Panneaux orange : brun très foncé */
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,.aside,.chart,.card,.g-card):nth-child(even) :is(h2,h3,h4,th,legend,.step__num,strong,b):not(.row--total *):not(.btn *){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.stat,.aside,.chart,.card,.g-card):nth-child(even) :is(p,li,td,dd,dt,label,small,span,.fineprint):not(.row--total *):not(.btn *):not(.btn):not(.chip):not(.chip *){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.aside,.card):nth-child(even) .step__eyebrow{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) main .cards>div:nth-child(even) :is(h3,p:not(:has(.btn))){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
/* Lignes totales : orange dans un panneau vert, vert dans un panneau orange */
html:root body:not(#_):not(#__) .row--total :is(*,strong,span,small,b,dt,dd){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.x-simbox,.x-vhbox,.x-panel):nth-child(even) .row--total :is(*,strong,span,small,b,dt,dd){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
/* Volets <details> orange du simulateur : titre foncé */
html:root body:not(#_):not(#__) details.x-field--wide>summary{color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:800!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) details.x-field--wide:nth-child(even)>summary{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) details.x-field--wide:not(:nth-child(even))>:is(p,.fineprint){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
/* Entrées : texte encre sur champ clair, indications lisibles ; champ foncé (thème sombre) = texte clair */
:root[data-theme="dark"] body:not(#_):not(#__) :is(input,textarea)::placeholder{color:rgb(255 255 255/.68)!important;-webkit-text-fill-color:rgb(255 255 255/.68)!important;opacity:1!important}
:root[data-theme="light"] body:not(#_):not(#__) :is(input,select,textarea){color:#10261b!important;-webkit-text-fill-color:#10261b!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card) :is(input,select,textarea){color:#10261b!important;-webkit-text-fill-color:#10261b!important}
:root[data-theme="light"] body:not(#_):not(#__) :is(input,textarea)::placeholder,html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card) :is(input,textarea)::placeholder{color:#55645b!important;-webkit-text-fill-color:#55645b!important;opacity:1!important}
html:root body:not(#_):not(#__) .x-bad{color:#ffc2c2!important;-webkit-text-fill-color:#ffc2c2!important;text-shadow:none!important;font-weight:700}
:root[data-theme="light"] body:not(#_):not(#__) .x-bad{color:#8a1010!important;-webkit-text-fill-color:#8a1010!important}
/* Ailleurs sur fond clair (thème clair) : encre et liens émeraude */
:root[data-theme="light"] body:not(#_):not(#__) main>section>:is(p.fineprint,.fineprint),:root[data-theme="light"] body:not(#_):not(#__) .x-field:not(.x-panel *):not(.x-simbox *):not(.x-vhbox *):not(.breakdown *):not(.card *):not(.step *):not(.aside *){color:#10261b!important;-webkit-text-fill-color:#10261b!important}
:root[data-theme="light"] body:not(#_):not(#__) main>section>.fineprint a,:root[data-theme="light"] body:not(#_):not(#__) .foot a.link{color:#0b5d3b!important;-webkit-text-fill-color:#0b5d3b!important;font-weight:700}
html:root body:not(#_):not(#__) .x-ai__note{color:#3e4d45!important}
/* Héros : « avant tout achat ? » en blanc 3D, souligné or */
html:root body:not(#_):not(#__) .x-welcome>span{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;filter:none!important;
 color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-3d)!important;text-decoration:underline 3px #ffc94a;text-underline-offset:5px;text-decoration-skip-ink:none}
html:root body:not(#_):not(#__) .x-intro :is(.hero__meta,.x-welcome__sub){color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important;text-shadow:var(--l-soft)!important}
/* Pièces « Pourquoi s'abonner » : face verte = blanc, face orange = brun foncé */
html:root body:not(#_):not(#__) .x-ben li:not(:nth-child(4n+2)):not(:nth-child(4n+3)) .x-coin__f--a :is(strong,p,b,span:not(.x-coin__ico)){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) .x-ben li:not(:nth-child(4n+2)):not(:nth-child(4n+3)) .x-coin__f--a .x-coin__hint{color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important}
html:root body:not(#_):not(#__) .x-ben li:not(:nth-child(4n+2)):not(:nth-child(4n+3)) .x-coin__f--b :is(strong,p,b,span:not(.x-coin__ico)),
html:root body:not(#_):not(#__) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--a :is(strong,p,b,span:not(.x-coin__ico)){color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) .x-ben li:is(:nth-child(4n+2),:nth-child(4n+3)) .x-coin__f--b :is(strong,p,b,span:not(.x-coin__ico)){color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:var(--l-soft)!important}
html:root body:not(#_):not(#__) .x-ben .x-ben__eye{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important}
/* Barre du haut : interrupteur SOMBRE / CLAIR sur pastille foncée */
html:root body:not(#_):not(#__) .theme-lbl{background:rgb(4 41 26/.6)!important;box-shadow:inset 0 1px 0 rgb(255 255 255/.2)!important}
html:root body:not(#_):not(#__) .theme-lbl :is(b,i){opacity:1!important;text-shadow:0 1px 2px rgb(0 0 0/.55)!important;color:#d9efe3!important;-webkit-text-fill-color:#d9efe3!important}
html:root body:not(#_):not(#__) .theme-lbl b.on{color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important}
/* Barre de navigation du bas : libellés nets, blancs, gras ; plus d'inclinaison 3D qui floute le texte */
html:root body:not(#_):not(#__) .x-tabbar{transform:none!important}
html:root body:not(#_):not(#__) .x-tabbar>:is(a,button){gap:3px!important;padding:0 2px!important;animation:none!important}
html:root body:not(#_):not(#__) .x-tabbar>:is(a,button)>span:not(.x-tabbar__ico){color:#fff!important;-webkit-text-fill-color:#fff!important;font:700 12px/1.15 "Inter",system-ui,sans-serif!important;letter-spacing:.01em!important;
 text-shadow:0 1px 2px rgb(0 0 0/.55)!important;-webkit-font-smoothing:antialiased;max-width:100%!important;white-space:normal;text-wrap:balance;overflow-wrap:normal;word-break:keep-all;text-align:center}
html:root body:not(#_):not(#__) .x-tabbar>[aria-current="page"]>span:not(.x-tabbar__ico){color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important;font-weight:800!important}
html:root body:not(#_):not(#__) .x-tabbar>[aria-current="page"]{background:rgb(4 41 26/.45)!important;box-shadow:inset 0 0 0 1px rgb(255 201 74/.35)!important}
@media (max-width:480px){html:root body:not(#_):not(#__) .x-tabbar>:is(a,button)>span:not(.x-tabbar__ico){font-size:10.5px!important;letter-spacing:0!important}}
@media (max-width:360px){html:root body:not(#_):not(#__) .x-tabbar>:is(a,button)>span:not(.x-tabbar__ico){font-size:9.5px!important}}
/* Bouton « Télécharger l'application » (orange) */
html:root body:not(#_):not(#__) #x-install{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;font-weight:800!important;text-shadow:var(--l-hi)!important}
/* Pied de page */
:root[data-theme="dark"] body:not(#_):not(#__) .foot{color:#e8f3ed!important;background-color:#0a4a30!important}
:root[data-theme="dark"] body:not(#_):not(#__) .foot :is(p,span,small){color:#e8f3ed!important;-webkit-text-fill-color:#e8f3ed!important;text-shadow:var(--l-soft)!important}
:root[data-theme="dark"] body:not(#_):not(#__) .foot strong{color:#fff!important}
:root[data-theme="dark"] body:not(#_):not(#__) .foot a.link{color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important;font-weight:700}
:root[data-theme="light"] body:not(#_):not(#__) .foot :is(p,span,small){color:#10261b!important;-webkit-text-fill-color:#10261b!important}
:root[data-theme="light"] body:not(#_):not(#__) .foot strong{color:#0b5d3b!important}
html:root body:not(#_):not(#__) .foot nav a{font-weight:700!important}
:root[data-theme="dark"] body:not(#_):not(#__) .foot nav a{color:#fff!important;-webkit-text-fill-color:#fff!important}
:root[data-theme="light"] body:not(#_):not(#__) .foot nav a{color:#0b5d3b!important;-webkit-text-fill-color:#0b5d3b!important}
html:root body:not(#_):not(#__) .x-brand>span:not(.x-brand__mark){text-shadow:var(--l-3d)!important}
html:root body:not(#_):not(#__) .theme-lbl small{color:var(--l-ink)!important;-webkit-text-fill-color:var(--l-ink)!important;font-weight:800!important;text-shadow:var(--l-hi)!important}
html:root body:not(#_):not(#__) :is(.breakdown,.step,.x-panel,.table-wrap,.x-simbox,.x-vhbox,.aside,.x-lock,.card):not(:nth-child(even)) .btn:not(.x-go):not(.x-cta):not(.btn--orange){background:linear-gradient(180deg,#147a4b,#0b5d3b)!important}
:root[data-theme="light"] body:not(#_):not(#__) .foot nav a{color:#08402a!important;-webkit-text-fill-color:#08402a!important}
html:root body:not(#_):not(#__) .x-intro .x-welcome__sub strong{color:#ffc94a!important;-webkit-text-fill-color:#ffc94a!important}
/* ==================== fin 2026-10-20 lisibilité ==================== */