/* =========================================================
   SÉRIE 07 — feuille unique
   Dark franc · accents néon lime + magenta · grille dense
   ========================================================= */

:root{
  --bg:#07080A;
  --card:#0E1014;
  --card-2:#151922;
  --line:#232935;
  --line-soft:#1A1F28;
  --ink:#F2F4F7;          /* 18.2:1 sur --bg */
  --muted:#9AA3B2;        /*  7.9:1 sur --bg */
  --dim:#6B7280;          /* décoratif uniquement, jamais de texte utile */
  --lime:#B4FF39;         /* 16.5:1 sur --bg */
  --lime-dim:#7FB329;
  --mag:#FF5FAF;          /*  7.2:1 sur --bg */
  --mag-raw:#FF3D9A;      /* bordures / remplissages décoratifs */
  --radius:12px;
  --bar-h:104px;
  --maxw:1200px;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background-color:var(--bg);
  background-image:radial-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:26px 26px;
  background-position:-1px -1px;
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  padding-bottom:calc(var(--bar-h) + 18px + env(safe-area-inset-bottom));
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; height:auto; display:block}
a{color:var(--lime); text-underline-offset:3px}
a:hover{color:#C8FF5C}
hr{border:0;border-top:1px solid var(--line);margin:34px 0}

:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:3px;
  border-radius:4px;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--lime); color:#07080A; padding:10px 16px;
  font-family:var(--mono); font-weight:700; font-size:.8rem;
}
.skip:focus{left:8px; top:8px}

.wrap{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:16px}
@media (min-width:760px){ .wrap{padding-inline:28px} }

/* ---------------------------------------------------- type */
h1,h2,h3,h4{margin:0; font-weight:900; letter-spacing:-.035em; line-height:.95}
h1{font-size:clamp(2.9rem,13vw,6.2rem); text-transform:uppercase}
h2{font-size:clamp(1.6rem,5.2vw,2.6rem); text-transform:uppercase; letter-spacing:-.03em}
h3{font-size:clamp(1.05rem,3vw,1.3rem); letter-spacing:-.02em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}

.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}
.kicker{
  font-family:var(--mono); font-size:.72rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--muted);
  margin:0 0 14px;
}
.kicker .on{color:var(--lime)}
.lead{color:var(--muted); font-size:clamp(1rem,2.4vw,1.12rem); max-width:62ch}
.sm{font-size:.85rem}
.xs{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}

/* ---------------------------------------------------- header */
.top{
  position:sticky; top:0; z-index:60;
  background:rgba(7,8,10,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.top-in{display:flex; align-items:center; gap:14px; height:58px}
.brand{
  display:flex; align-items:center; gap:9px;
  font-family:var(--sans); font-weight:900; font-size:1.02rem;
  letter-spacing:-.02em; text-transform:uppercase;
  color:var(--ink); text-decoration:none; white-space:nowrap;
}
.brand:hover{color:var(--ink)}
.brand .chip{
  font-family:var(--mono); font-size:.72rem; font-weight:800;
  background:var(--lime); color:#07080A;
  padding:3px 6px; border-radius:4px; letter-spacing:0;
}
.nav{margin-left:auto; display:flex; gap:2px}
.nav a{
  font-family:var(--mono); font-size:.72rem; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); text-decoration:none;
  padding:8px 9px; border-radius:6px;
}
.nav a:hover{color:var(--ink); background:var(--card-2)}
.nav a[aria-current="page"]{color:#07080A; background:var(--lime)}
@media (max-width:400px){ .nav a{padding:8px 6px; letter-spacing:.08em} .brand{font-size:.92rem} }

/* ---------------------------------------------------- sections */
section{padding:46px 0}
@media (min-width:760px){ section{padding:64px 0} }
.sec-head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:22px}
.sec-head .num{
  font-family:var(--mono); font-size:.72rem; font-weight:800;
  color:var(--lime); letter-spacing:.15em;
  border:1px solid var(--lime-dim); border-radius:4px; padding:3px 7px;
}
.rule{height:1px; background:var(--line); border:0; margin:0}

/* ---------------------------------------------------- surfaces */
.panel{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:20px;
}
.panel-lime{border-color:var(--lime-dim); box-shadow:0 0 0 1px rgba(180,255,57,.10), 0 0 34px -18px rgba(180,255,57,.5)}

/* ---------------------------------------------------- buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--mono); font-size:.82rem; font-weight:800;
  letter-spacing:.11em; text-transform:uppercase;
  padding:14px 20px; border-radius:8px;
  border:1px solid transparent; cursor:pointer; text-decoration:none;
  transition:transform .12s ease, background .15s ease, border-color .15s ease;
  min-height:48px;
}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--lime); color:#07080A; border-color:var(--lime)}
.btn-primary:hover{background:#C8FF5C; color:#07080A}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--lime-dim); color:var(--lime)}
.btn-block{width:100%}
@media (prefers-reduced-motion:reduce){ .btn{transition:none} .btn:active{transform:none} }

/* ---------------------------------------------------- hero */
.hero{padding:34px 0 8px}
.hero h1{color:var(--ink)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .hero h1{
    background:linear-gradient(178deg,#FFFFFF 18%,#AEB6C4 100%);
    -webkit-background-clip:text; background-clip:text;
    color:transparent; -webkit-text-fill-color:transparent;
  }
}
@media (forced-colors:active){
  .hero h1{color:CanvasText; -webkit-text-fill-color:CanvasText; background:none}
  .holo{background:Canvas; border:1px solid CanvasText}
}
.hero-sub{margin-top:18px; max-width:56ch; color:var(--muted); font-size:clamp(1rem,2.6vw,1.15rem)}

.hero-grid{display:grid; gap:12px; margin-top:26px}
@media (min-width:900px){ .hero-grid{grid-template-columns:1.15fr .85fr; align-items:stretch} }

/* le chiffre central : 7 % */
.rate-hero{
  position:relative; overflow:hidden;
  background:var(--card); border:1px solid var(--lime-dim); border-radius:var(--radius);
  padding:26px 20px 22px;
  box-shadow:0 0 0 1px rgba(180,255,57,.08), 0 0 60px -30px rgba(180,255,57,.85);
}
.rate-hero::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 90% at 12% 108%, rgba(180,255,57,.16), transparent 62%);
  pointer-events:none;
}
.rate-hero > *{position:relative}
.rate-big{
  font-family:var(--mono); font-weight:800; color:var(--lime);
  font-size:clamp(4.2rem,19vw,8.2rem); line-height:.84;
  letter-spacing:-.06em; font-variant-numeric:tabular-nums;
  text-shadow:0 0 42px rgba(180,255,57,.32);
  display:block;
}
.rate-cap{margin-top:14px; font-size:clamp(1rem,3vw,1.22rem); font-weight:700; letter-spacing:-.01em; line-height:1.25}
.rate-note{margin-top:10px; color:var(--muted); font-size:.9rem; max-width:44ch}
.formula{
  display:inline-block; margin-top:16px;
  font-family:var(--mono); font-size:.8rem; font-weight:700; color:var(--lime);
  border:1px solid var(--lime-dim); border-radius:6px; padding:7px 11px;
  letter-spacing:.04em;
}

.buy{display:flex; flex-direction:column; gap:14px; justify-content:space-between}
.price-row{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap}
.price-now{font-family:var(--mono); font-weight:800; font-size:clamp(2rem,7vw,2.7rem); letter-spacing:-.04em; color:var(--ink)}
.price-was{font-family:var(--mono); font-size:1rem; color:var(--muted); text-decoration:line-through}
.price-off{
  font-family:var(--mono); font-size:.72rem; font-weight:800; letter-spacing:.1em;
  background:var(--mag-raw); color:#07080A; padding:4px 7px; border-radius:4px;
}
.spec-list{list-style:none; margin:0; padding:0; display:grid; gap:0}
.spec-list li{
  display:flex; justify-content:space-between; gap:14px;
  padding:9px 0; border-bottom:1px solid var(--line-soft);
  font-size:.88rem;
}
.spec-list li:last-child{border-bottom:0}
.spec-list b{font-family:var(--mono); font-weight:700; font-size:.82rem; color:var(--ink); text-align:right}
.spec-list span{color:var(--muted)}

/* ---------------------------------------------------- tuiles de taux */
.rates{display:grid; gap:10px; grid-template-columns:1fr}
@media (min-width:640px){ .rates{grid-template-columns:repeat(3,1fr)} }
.rate-tile{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; position:relative; overflow:hidden;
}
.rate-tile .t-lab{font-family:var(--mono); font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--muted)}
.rate-tile .t-val{
  font-family:var(--mono); font-weight:800; font-size:clamp(2.4rem,9vw,3.3rem);
  line-height:1; letter-spacing:-.05em; margin:10px 0 4px; font-variant-numeric:tabular-nums;
}
.rate-tile .t-sub{font-size:.83rem; color:var(--muted)}
.rate-tile .t-each{
  margin-top:12px; padding-top:11px; border-top:1px solid var(--line-soft);
  font-family:var(--mono); font-size:.76rem; color:var(--ink); letter-spacing:.02em;
}
.rate-tile .t-each em{font-style:normal; color:var(--muted)}
.tile-c .t-val{color:var(--ink)}
.tile-p .t-val{color:var(--mag)}
.tile-r{border-color:var(--lime-dim); box-shadow:0 0 34px -20px rgba(180,255,57,.8)}
.tile-r .t-val{color:var(--lime)}

.bar-100{display:flex; height:16px; border:1px solid var(--line); border-radius:6px; overflow:hidden; margin-top:14px; background:var(--card)}
.bar-100 i{display:block; height:100%}
.bar-c{width:70%; background:#3A4252}
.bar-p{width:23%; background:var(--mag-raw)}
.bar-r{width:7%; background:var(--lime)}
.bar-key{display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:10px; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.bar-key i{display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:6px; vertical-align:baseline}

/* ---------------------------------------------------- table chiffrée */
.tbl-scroll{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--card); -webkit-overflow-scrolling:touch}
table.data{width:100%; border-collapse:collapse; min-width:520px; font-family:var(--mono); font-size:.84rem; font-variant-numeric:tabular-nums}
table.data caption{caption-side:top; text-align:left; padding:14px 16px 0; color:var(--muted); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase}
table.data th, table.data td{padding:11px 14px; text-align:right; border-bottom:1px solid var(--line-soft); white-space:nowrap}
table.data th:first-child, table.data td:first-child{text-align:left}
table.data thead th{
  font-size:.68rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); border-bottom:1px solid var(--line);
}
table.data tbody tr:last-child td{border-bottom:0}
table.data td.hi{color:var(--lime); font-weight:700}
table.data tr.now td{background:rgba(180,255,57,.07)}
table.data tr.now td:first-child{box-shadow:inset 3px 0 0 var(--lime)}

/* ---------------------------------------------------- cartes du pool */
.pool-grid{display:grid; gap:10px; grid-template-columns:repeat(2,1fr)}
@media (min-width:620px){ .pool-grid{grid-template-columns:repeat(3,1fr)} }
@media (min-width:960px){ .pool-grid{grid-template-columns:repeat(5,1fr); gap:12px} }

.tcard{
  position:relative; display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--line); border-radius:10px;
  overflow:hidden; isolation:isolate;
}
.tcard::after{
  content:""; position:absolute; inset:0; border-radius:10px; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.tcard .win{position:relative; aspect-ratio:1/1; background:var(--card-2); overflow:hidden}
.tcard .win img{width:100%; height:100%; object-fit:cover}
.tcard .meta{padding:10px 11px 12px; display:flex; flex-direction:column; gap:5px}
.tcard .code{font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:.13em; color:var(--muted)}
.tcard .nm{font-weight:900; font-size:.98rem; letter-spacing:-.02em; text-transform:uppercase; line-height:1.05}
.tcard .desc{font-size:.76rem; color:var(--muted); line-height:1.35}
.tcard .pct{
  margin-top:4px; display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-family:var(--mono); font-size:.74rem; font-weight:700; font-variant-numeric:tabular-nums;
}
.tcard .pct .lab{font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); font-weight:700}

.tier{
  position:absolute; top:8px; left:8px; z-index:2;
  font-family:var(--mono); font-size:.6rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 6px; border-radius:4px; background:rgba(7,8,10,.86); border:1px solid var(--line); color:var(--ink);
}
.tier-p{border-color:var(--mag-raw); color:var(--mag)}
.tier-r{border-color:var(--lime); color:var(--lime)}

.card-c .pct b{color:var(--ink)}
.card-p{border-color:#4A2340}
.card-p .pct b{color:var(--mag)}
.card-r{border-color:var(--lime-dim)}
.card-r .pct b{color:var(--lime)}

/* ------------- effet holographique 100 % CSS (pièces rares) ------------- */
.tcard .win.holo, .holo{
  position:relative;
  background-color:#0A0C10;
  background-image:
    repeating-linear-gradient(115deg,
      rgba(255,61,154,.62) 0 11px,
      rgba(180,255,57,.58) 11px 22px,
      rgba(0,225,255,.58) 22px 33px,
      rgba(150,90,255,.62) 33px 44px),
    radial-gradient(120% 100% at 30% 0%, rgba(255,255,255,.20), transparent 60%);
  background-size:320% 320%, 100% 100%;
  background-position:0% 50%, 0 0;
  animation:holo-shift 9s linear infinite;
}
.tcard .win.holo::before, .holo::before{
  content:"";
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.34) 0 1px, transparent 1px 4px),
    linear-gradient(122deg, transparent 34%, rgba(255,255,255,.42) 50%, transparent 66%);
  background-size:100% 4px, 260% 100%;
  background-position:0 0, 120% 0;
  animation:holo-sweep 5.2s ease-in-out infinite;
  mix-blend-mode:screen;
}
.tcard .win.holo::after, .holo::after{
  content:attr(data-mark);
  position:absolute; inset:0; display:grid; place-items:center;
  font-family:var(--sans); font-weight:900; font-size:clamp(2.6rem,11vw,3.6rem);
  color:rgba(7,8,10,.82); letter-spacing:-.05em;
  text-shadow:0 1px 0 rgba(255,255,255,.22);
}
@keyframes holo-shift{ to{ background-position:320% 50%, 0 0 } }
@keyframes holo-sweep{ 0%{background-position:0 0,120% 0} 55%{background-position:0 0,-40% 0} 100%{background-position:0 0,-40% 0} }
.tcard:hover .win.holo, .tcard:focus-within .win.holo{animation-duration:3.4s}
@media (prefers-reduced-motion:reduce){
  .holo, .tcard .win.holo::before, .holo::before{animation:none}
  .holo{background-position:38% 50%, 0 0}
}

.silh{
  position:absolute; inset:0; display:grid; place-items:center; z-index:1; pointer-events:none;
}
.silh svg{width:56%; height:auto; opacity:.58}

/* ---------------------------------------------------- galerie ambiance */
.amb{display:grid; gap:10px; grid-template-columns:1fr}
@media (min-width:640px){ .amb{grid-template-columns:repeat(3,1fr)} }
.amb figure{margin:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--card)}
.amb img{aspect-ratio:1/1; object-fit:cover; width:100%; filter:brightness(.86) saturate(1.05)}
.amb figcaption{padding:10px 12px; font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}

/* ---------------------------------------------------- FAQ */
.faq{display:grid; gap:8px}
details.qa{background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden}
details.qa[open]{border-color:var(--lime-dim)}
details.qa summary{
  cursor:pointer; list-style:none; padding:15px 16px;
  font-weight:700; font-size:.98rem; letter-spacing:-.01em;
  display:flex; gap:12px; align-items:flex-start;
}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary::after{
  content:"+"; margin-left:auto; font-family:var(--mono); font-weight:800; color:var(--lime); font-size:1.15rem; line-height:1;
}
details.qa[open] summary::after{content:"–"}
details.qa .a{padding:0 16px 16px; color:var(--muted); font-size:.92rem}
details.qa .a p{margin-bottom:.7em}

/* ---------------------------------------------------- tunnel */
.rail{display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap}
.rail a{
  flex:1 1 96px; min-width:96px; text-decoration:none;
  border:1px solid var(--line); border-radius:8px; background:var(--card);
  padding:10px 12px; display:block;
}
.rail a[data-on="1"]{border-color:var(--lime-dim); background:rgba(180,255,57,.06)}
.rail .n{font-family:var(--mono); font-size:.68rem; font-weight:800; letter-spacing:.14em; color:var(--lime)}
.rail .l{display:block; margin-top:3px; font-size:.82rem; font-weight:700; color:var(--ink); letter-spacing:-.01em}

.step{border:1px solid var(--line); border-radius:var(--radius); background:var(--card); margin-bottom:12px; overflow:hidden}
.step-h{display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line)}
.step-n{
  flex:none; width:30px; height:30px; border-radius:7px;
  background:var(--lime); color:#07080A;
  font-family:var(--mono); font-weight:800; font-size:.9rem;
  display:grid; place-items:center;
}
.step-h h2{font-size:1.06rem; letter-spacing:-.02em}
.step-b{padding:18px}

.stepper{display:flex; align-items:stretch; gap:0; border:1px solid var(--line); border-radius:9px; overflow:hidden; background:var(--card-2); width:max-content}
.stepper button{
  width:52px; min-height:52px; border:0; background:transparent; color:var(--ink);
  font-family:var(--mono); font-size:1.35rem; font-weight:800; cursor:pointer; line-height:1;
}
.stepper button:hover:not(:disabled){background:var(--lime); color:#07080A}
.stepper button:disabled{color:var(--dim); cursor:not-allowed}
.stepper .val{
  min-width:76px; display:grid; place-items:center;
  font-family:var(--mono); font-weight:800; font-size:1.5rem; font-variant-numeric:tabular-nums;
  border-inline:1px solid var(--line);
}
.quick{display:flex; flex-wrap:wrap; gap:7px; margin-top:14px}
.quick button{
  font-family:var(--mono); font-size:.76rem; font-weight:700; letter-spacing:.06em;
  background:var(--card-2); color:var(--ink); border:1px solid var(--line);
  border-radius:7px; padding:9px 11px; cursor:pointer; min-height:40px;
}
.quick button:hover{border-color:var(--lime-dim); color:var(--lime)}
.quick button[aria-pressed="true"]{background:var(--lime); color:#07080A; border-color:var(--lime)}

.live{
  margin-top:18px; display:grid; gap:10px; grid-template-columns:1fr;
}
@media (min-width:620px){ .live{grid-template-columns:1.25fr 1fr 1fr} }
.live-cell{border:1px solid var(--line); border-radius:10px; background:var(--card-2); padding:14px}
.live-cell .lab{font-family:var(--mono); font-size:.66rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; color:var(--muted)}
.live-cell .v{font-family:var(--mono); font-weight:800; font-size:clamp(1.5rem,6vw,2rem); letter-spacing:-.04em; margin-top:7px; font-variant-numeric:tabular-nums; line-height:1}
.live-main{border-color:var(--lime-dim); background:rgba(180,255,57,.05)}
.live-main .v{color:var(--lime); font-size:clamp(2.2rem,10vw,3.1rem)}
.live-cell .fine{margin-top:7px; font-family:var(--mono); font-size:.68rem; color:var(--muted); letter-spacing:.04em}

.lines{list-style:none; margin:0; padding:0; font-family:var(--mono); font-size:.88rem; font-variant-numeric:tabular-nums}
.lines li{display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid var(--line-soft)}
.lines li span:first-child{color:var(--muted); font-family:var(--sans); font-size:.88rem}
.lines li.good span:first-child, .lines li.good b{color:var(--lime)}
.lines li.tot{border-bottom:0; padding-top:15px; margin-top:4px; border-top:1px solid var(--line)}
.lines li.tot span:first-child{color:var(--ink); font-weight:700; font-size:1rem}
.lines li.tot b{font-size:1.5rem; letter-spacing:-.03em}

.promo-row{display:flex; gap:8px; margin-top:16px; flex-wrap:wrap}
.promo-row input{
  flex:1 1 160px; min-width:0; min-height:48px;
  background:var(--card-2); border:1px solid var(--line); border-radius:8px;
  color:var(--ink); font-family:var(--mono); font-size:.86rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; padding:0 14px;
}
.promo-row input::placeholder{color:var(--dim); letter-spacing:.08em}
.promo-row input:focus-visible{border-color:var(--lime)}
.promo-msg{margin-top:10px; font-family:var(--mono); font-size:.78rem; letter-spacing:.03em; min-height:1.2em}
.promo-msg.ok{color:var(--lime)}
.promo-msg.no{color:var(--mag)}
.codes{display:grid; gap:8px; margin-top:16px}
.codes button{
  text-align:left; cursor:pointer; background:var(--card-2); border:1px dashed var(--line);
  border-radius:8px; padding:12px 14px; color:var(--ink); width:100%;
}
.codes button:hover{border-color:var(--lime-dim)}
.codes .c{font-family:var(--mono); font-weight:800; font-size:.9rem; letter-spacing:.14em; color:var(--lime)}
.codes .d{display:block; margin-top:3px; font-size:.8rem; color:var(--muted)}

.notice{
  border:1px solid var(--lime-dim); border-radius:10px; background:rgba(180,255,57,.06);
  padding:18px; margin-top:16px;
}
.notice h3{color:var(--lime); margin-bottom:9px}
.notice p{color:var(--ink); font-size:.92rem}

/* ---------------------------------------------------- barre panier fixe */
.cartbar{
  position:fixed; left:0; right:0; bottom:0; z-index:80;
  background:rgba(9,11,14,.96);
  backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom);
}
.cartbar-p{
  display:flex; align-items:center; gap:10px;
  padding:6px 16px; border-bottom:1px solid var(--line-soft);
  font-family:var(--mono); font-size:.68rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
  min-height:28px;
}
.cartbar-p b{color:var(--lime); font-variant-numeric:tabular-nums; font-size:.8rem; letter-spacing:.02em}
.cartbar-p .f{margin-left:auto; color:var(--dim); letter-spacing:.04em; text-transform:none}
@media (max-width:520px){ .cartbar-p .f{display:none} }

.cartbar-m{display:flex; align-items:center; gap:10px; padding:9px 16px 11px}
.cb-step{display:flex; align-items:center; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--card-2); flex:none}
.cb-step button{
  width:38px; height:40px; border:0; background:transparent; color:var(--ink);
  font-family:var(--mono); font-size:1.15rem; font-weight:800; cursor:pointer; line-height:1;
}
.cb-step button:hover:not(:disabled){background:var(--lime); color:#07080A}
.cb-step button:disabled{color:var(--dim); cursor:not-allowed}
.cb-step .n{min-width:34px; text-align:center; font-family:var(--mono); font-weight:800; font-size:1rem; font-variant-numeric:tabular-nums; border-inline:1px solid var(--line); line-height:40px}
.cb-tot{display:flex; flex-direction:column; line-height:1.1; min-width:0}
.cb-tot .l{font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.cb-tot .v{font-family:var(--mono); font-weight:800; font-size:1.08rem; letter-spacing:-.02em; font-variant-numeric:tabular-nums; white-space:nowrap}
.cb-cta{margin-left:auto; flex:none; padding:13px 15px; font-size:.74rem; letter-spacing:.09em; min-height:44px}
@media (max-width:360px){ .cb-cta{padding:13px 11px; letter-spacing:.05em} .cb-step button{width:34px} }

/* ---------------------------------------------------- footer */
.foot{border-top:1px solid var(--line); padding:34px 0 26px; margin-top:20px}
.foot-grid{display:grid; gap:22px; grid-template-columns:1fr}
@media (min-width:760px){ .foot-grid{grid-template-columns:1.4fr 1fr 1fr} }
.foot h4{font-family:var(--mono); font-size:.68rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:11px}
.foot ul{list-style:none; margin:0; padding:0; display:grid; gap:7px}
.foot a{color:var(--muted); text-decoration:none; font-size:.87rem}
.foot a:hover{color:var(--lime)}
.foot .legal{margin-top:24px; padding-top:18px; border-top:1px solid var(--line); font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; color:var(--dim); line-height:1.7}
.foot .legal b{color:var(--muted); font-weight:700}

/* ---------------------------------------------------- pages légales */
.doc{max-width:74ch}
.doc h2{margin:38px 0 12px; font-size:clamp(1.3rem,4vw,1.7rem)}
.doc h2:first-of-type{margin-top:8px}
.doc h3{margin:22px 0 8px; font-size:1rem; color:var(--lime); font-weight:800; letter-spacing:.01em; text-transform:uppercase; font-family:var(--mono)}
.doc p, .doc li{color:var(--muted); font-size:.93rem}
.doc ul{padding-left:18px; display:grid; gap:6px; margin:0 0 1em}
.doc b, .doc strong{color:var(--ink)}
.toc{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px}
.toc a{
  font-family:var(--mono); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid var(--line); border-radius:7px; padding:8px 11px; text-decoration:none; color:var(--muted);
}
.toc a:hover{border-color:var(--lime-dim); color:var(--lime)}

.pill{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--mono); font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid var(--line); border-radius:999px; padding:6px 12px; color:var(--muted);
}
.pill.on{border-color:var(--lime-dim); color:var(--lime)}
.pill .dot{width:6px; height:6px; border-radius:50%; background:var(--lime)}

.two{display:grid; gap:12px; grid-template-columns:1fr}
@media (min-width:820px){ .two{grid-template-columns:1fr 1fr} }
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}