.annonce{
  display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:nowrap;
  background:var(--encre);color:#fff;
  padding:9px var(--marge);min-height:46px;
  text-decoration:none;position:relative;z-index:45;
  overflow:visible;
}
.annonce .souffle{position:absolute;inset:0;overflow:hidden;pointer-events:none}

.annonce .souffle::after{
  content:"";position:absolute;top:0;bottom:0;width:38%;
  background:linear-gradient(90deg,transparent,rgba(255,196,0,.13),transparent);
  transform:translateX(-120%);
  animation:souffle 5.5s ease-in-out infinite;
}
@keyframes souffle{0%,62%{transform:translateX(-120%)}100%{transform:translateX(380%)}}

.annonce .lot{
  display:flex;align-items:center;gap:7px;position:relative;z-index:1;min-width:0;
  font-size:13px;font-weight:600;letter-spacing:-.02em;white-space:nowrap;
}

.annonce .lots-minis{position:relative;width:64px;height:30px;flex:none}
.annonce .pastille-lot{position:absolute;left:0;top:0;width:46px;height:30px}
.annonce .pastille-tel{
  position:absolute;left:40px;top:0;z-index:3;
  width:24px;height:44px;transform:rotate(-7deg);

  filter:drop-shadow(0 0 1.5px rgba(10,10,12,.95)) drop-shadow(0 6px 11px rgba(0,0,0,.6));
}
.annonce .pastille-lot img,.annonce .pastille-tel img{
  width:100%;height:100%;object-fit:contain;display:block;
}
.annonce .lot b{font-weight:800;color:var(--jaune)}

.chrono{display:flex;align-items:center;gap:3px;position:relative;z-index:1;flex:none}
.chrono i{
  display:flex;align-items:baseline;gap:1px;font-style:normal;
  background:rgba(255,255,255,.1);border-radius:6px;padding:4px 5px;
}
.chrono i b{font-size:13px;font-weight:800;color:var(--jaune);font-variant-numeric:tabular-nums;line-height:1}
.chrono i span{font-size:9px;font-weight:700;color:#8E8E9A;line-height:1}
.chrono i.sec b{animation:bat-sec 1s steps(1) infinite}
@keyframes bat-sec{0%,60%{opacity:1}61%,100%{opacity:.62}}

@media (max-width:459px){
  .annonce .lot .texte-long{display:none}
}
@media (max-width:399px){
  .annonce{gap:7px;padding:8px 12px}
  .annonce .lot{font-size:12px;gap:6px}
  .chrono i{padding:4px 5px}
  .chrono i b{font-size:12px}
}
@media (max-width:359px){
  .annonce .lot{font-size:11px}

  .annonce .lots-minis{width:54px;height:25px}
  .annonce .pastille-lot{width:38px;height:25px}
  .annonce .pastille-tel{left:32px;top:1px;width:22px;height:40px}
  .chrono{gap:2px}
  .chrono i{padding:4px 3px}
  .chrono i b{font-size:11px}
}

.entete-site{
  position:sticky;top:0;z-index:40;
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--filet);
  transition:box-shadow .25s ease, border-color .25s ease;
}
.entete-site.compacte{
  box-shadow:0 4px 20px rgba(10,10,12,.07);
  border-bottom-color:transparent;
}
.entete-site .dedans{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  height:60px;padding:0 var(--marge);max-width:520px;margin:0 auto;
  transition:height .25s ease;
}
.entete-site.compacte .dedans{height:52px}

.marque{display:flex;flex-direction:column;gap:3px;flex:none}
.marque .nom{font-size:15.5px;font-weight:800;letter-spacing:-.04em;line-height:1}
.marque .sous{
  display:flex;align-items:center;gap:5px;
  font-size:8.5px;font-weight:800;letter-spacing:.13em;color:var(--gris);line-height:1;
}
.marque .sous i{width:4px;height:4px;border-radius:50%;background:var(--rouge);flex:none}

.entete-droite{display:flex;align-items:center;gap:10px;min-width:0}
.entete-prix{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex:none}
.entete-prix .vrai{font-size:16px;font-weight:900;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.entete-prix .fois{font-size:8.5px;font-weight:800;letter-spacing:.11em;color:var(--gris);line-height:1}

.mini-cta{
  display:flex;align-items:center;gap:6px;flex:none;
  background:var(--bleu);color:#fff;border-radius:10px;
  padding:11px 13px;font-size:13px;font-weight:700;letter-spacing:-.03em;
  box-shadow:0 3px 0 #0040C4;white-space:nowrap;
  transition:transform .08s ease, box-shadow .08s ease;
}
.mini-cta:active{transform:translateY(3px);box-shadow:none}
.mini-cta .fl{
  width:15px;height:15px;border-radius:50%;background:rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:900;
}

@media (max-width:389px){
  .marque .nom{font-size:14.5px}
  .marque .an{display:none}
    .entete-prix .vrai{font-size:14.5px}
    .mini-cta{font-size:12px;padding:9px 10px}
  .entete-droite{gap:7px}
  .entete-site .dedans{gap:8px}
}
@media (max-width:339px){
    .mini-cta .fl{display:none}
}

.progres{
  position:absolute;left:0;bottom:-1px;height:2.5px;width:0;
  background:var(--bleu);border-radius:0 2px 2px 0;
  transition:width .12s linear;
}

.hero{position:relative;padding:26px 0 14px}

body{padding-bottom:var(--h-barre,62px)}

.titre{font-size:clamp(28px,8.7vw,46px);line-height:.94}
.titre .g{color:var(--gris);display:block}
.mot{
  position:relative;display:inline-block;color:var(--encre);padding:0 3px;margin-left:2px;
  isolation:isolate;
}
.mot::after{
  content:"";position:absolute;left:0;right:0;bottom:-.08em;height:.76em;
  background:var(--jaune);z-index:-1;
}
.chapo{margin-top:16px;font-size:15px}

@media (max-height:720px){
  .entete-site .dedans{height:52px}
  .hero{padding-top:12px;padding-bottom:8px}
  .titre{font-size:clamp(25px,7.9vw,38px)}
  .chapo{margin-top:11px;font-size:14px}
  .points{margin-top:8px}
  .ruban{padding:9px 0}
}
@media (max-height:620px){
  .entete-site .dedans{height:48px}
  .hero{padding-top:8px;padding-bottom:4px}
  .titre{font-size:clamp(23px,7.4vw,34px)}
  .chapo{margin-top:8px;font-size:13px}
  .points{margin-top:6px}
  .ruban{padding:5px 0}
}

.scene{
  --ech:.9;
  --hs:min(500px, calc(100lvh - 378px));
  --h:calc(var(--hs) * var(--ech));

  --dy:calc((var(--hs) - var(--h)) / 2 + 4px);
  position:relative;margin-top:4px;display:flex;justify-content:center;
  height:var(--hs);
}
.scene[data-k="serie"]{--amb:var(--rouge)}
.scene[data-k="son"]  {--amb:var(--vert)}

.tache{
  position:absolute;top:calc(var(--dy) + var(--h) * .09);left:50%;aspect-ratio:1;
  width:calc(66% * var(--ech));max-width:calc(330px * var(--ech));transform:translateX(-50%);border-radius:50%;
  background:var(--amb);z-index:0;
  transition:background .66s ease, transform .66s cubic-bezier(.22,1.1,.36,1);
}
.tache::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:linear-gradient(to bottom,rgba(255,255,255,0) 58%,#fff 94%);
}

.tel{

  position:relative;z-index:2;margin-top:var(--dy);
  width:calc(var(--h) * 390 / 800);
  height:var(--h);
  filter:drop-shadow(0 18px 34px rgba(10,10,12,.26));
  touch-action:pan-y;
}
.tel .cadre{position:absolute;inset:0;width:100%;height:100%;z-index:10;pointer-events:none}
.ecran{
  position:absolute;
  left:calc(var(--h) * 19 / 800);
  top:calc(var(--h) * 16 / 800);
  width:calc(var(--h) * 354 / 800);
  height:calc(var(--h) * 769 / 800);
  border-radius:calc(var(--h) * 44 / 800);
  overflow:hidden;background:#000;

  font-size:calc(var(--h) * 354 / 800 / 390 * 16);
}
.capture{width:100%;height:100%;object-fit:cover}

.statut{
  position:absolute;top:0;left:0;right:0;z-index:10;height:3.13em;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 1.63em;font-size:.94em;font-weight:700;letter-spacing:-.02em;
}
.statut .sig{display:flex;align-items:center;gap:.3em}
.statut .ic{width:1.1em;height:1.1em}
.statut .bat{width:1.6em;height:.8em;border:1.3px solid currentColor;border-radius:.22em;position:relative;opacity:.92}
.statut .bat::before{content:"";position:absolute;inset:1.3px;background:currentColor;border-radius:.08em}
.statut .bat::after{content:"";position:absolute;right:-.22em;top:.22em;bottom:.22em;width:.11em;background:currentColor;border-radius:0 .09em .09em 0}

.barre-accueil{
  position:absolute;left:50%;transform:translateX(-50%);bottom:.5em;z-index:12;
  width:34.5%;height:.31em;border-radius:.31em;background:rgba(255,255,255,.85);
}

.ecran{perspective:900px;perspective-origin:50% 50%}
.vue{
  position:absolute;inset:0;opacity:0;
  transform:translateX(88%) rotateY(-26deg) scale(.9);
  transform-origin:left center;
  transition:transform .72s cubic-bezier(.22,1.02,.32,1), opacity .3s ease .08s;
  will-change:transform,opacity;backface-visibility:hidden;
}
.vue.actif{opacity:1;transform:translateX(0) rotateY(0) scale(1)}
.vue.sortie{
  opacity:0;transform:translateX(-34%) rotateY(22deg) scale(.82);
  transform-origin:right center;
  transition:transform .55s cubic-bezier(.45,0,.75,.35), opacity .34s ease;
}

.tel{transition:transform .5s cubic-bezier(.22,1.1,.36,1)}
.scene.bascule .tel{transform:scale(.982)}
.scene.bascule .tache{transform:translateX(-50%) scale(1.07)}

.v-serie{background:#000}
.v-serie .fond{position:absolute;inset:0}
.v-serie .fond img{width:100%;height:100%;object-fit:cover}
.v-serie .ombre{
  position:absolute;inset:0;z-index:2;
  background:linear-gradient(to bottom,rgba(0,0,0,.42),transparent 14%,transparent 50%,rgba(0,0,0,.7));
}
.v-serie .statut{color:#fff}

.v-serie .onglets{
  position:absolute;top:3.88em;left:0;right:0;z-index:4;
  display:flex;align-items:center;justify-content:center;gap:1.38em;padding-right:2.5em;
  color:rgba(255,255,255,.65);font-size:1.06em;font-weight:600;letter-spacing:-.01em;
  text-shadow:0 1px 3px rgba(0,0,0,.35);
}
.v-serie .onglets b{color:#fff;font-weight:700;position:relative}
.v-serie .onglets b::after{content:"";position:absolute;left:.1em;right:.1em;bottom:-.4em;height:.13em;background:#fff;border-radius:.13em}
.v-serie .loupe{position:absolute;top:3.75em;right:1em;z-index:4;width:1.38em;height:1.38em;background:#fff;opacity:.92;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35))}

.v-serie .actions{
  position:absolute;right:.63em;bottom:5.94em;z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:1.13em;
  color:#fff;font-size:.75em;font-weight:600;text-align:center;
}
.v-serie .actions > span{display:flex;flex-direction:column;align-items:center;gap:.4em;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}
.v-serie .actions .ic{width:2.67em;height:2.67em}
.v-serie .actions .coeur{color:#FE2C55;animation:bat 3s ease-in-out infinite}
@keyframes bat{0%,88%,100%{transform:scale(1)}92%{transform:scale(1.18)}96%{transform:scale(1.04)}}

.v-serie .avatar{position:relative;width:3.83em;height:3.83em;margin-bottom:.5em}
.v-serie .avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:1.5px solid #fff}
.v-serie .avatar .plus{
  position:absolute;left:50%;bottom:-.58em;transform:translateX(-50%);
  width:1.67em;height:1.67em;border-radius:50%;background:#FE2C55;
  display:flex;align-items:center;justify-content:center;
}
.v-serie .avatar .plus .ic{width:.92em;height:.92em;background:#fff}

.v-serie .disque{
  width:3.33em;height:3.33em;border-radius:50%;
  background:linear-gradient(135deg,#333,#000);
  display:flex;align-items:center;justify-content:center;
  animation:tourne 5s linear infinite;
}
.v-serie .disque .ic{width:1.33em;height:1.33em;background:#fff}
@keyframes tourne{to{transform:rotate(360deg)}}

.v-serie .bas{position:absolute;left:.88em;right:5.13em;bottom:5.63em;z-index:4;color:#fff}
.v-serie .bas .cpt{font-size:.94em;font-weight:700;letter-spacing:-.01em;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.v-serie .bas .txt{font-size:.88em;font-weight:400;line-height:1.32;margin-top:.3em;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.v-serie .bas .son{display:flex;align-items:center;gap:.36em;font-size:.81em;font-weight:500;margin-top:.55em;text-shadow:0 1px 4px rgba(0,0,0,.45)}
.v-serie .bas .son .ic{width:1em;height:1em;flex:none}

.navbar{
  position:absolute;left:0;right:0;bottom:2.13em;z-index:5;height:3.06em;
  display:flex;align-items:center;justify-content:space-around;padding:0 .5em;
  color:#fff;font-size:.63em;font-weight:600;
}
.navbar span{display:flex;flex-direction:column;align-items:center;gap:.35em;opacity:.65}
.navbar span.on{opacity:1}
.navbar .ic{width:2.38em;height:2.38em}
.navbar .creer{
  width:4.3em;height:2.8em;border-radius:.72em;background:#fff;
  display:flex;align-items:center;justify-content:center;position:relative;opacity:1;
}
.navbar .creer::before{content:"";position:absolute;left:-.3em;top:.2em;bottom:.2em;width:1.1em;border-radius:.6em;background:#25F4EE}
.navbar .creer::after{content:"";position:absolute;right:-.3em;top:.2em;bottom:.2em;width:1.1em;border-radius:.6em;background:#FE2C55}
.navbar .creer .ic{width:1.5em;height:1.5em;background:#0A0A0C;position:relative;z-index:2}

.v-son{background:linear-gradient(to bottom,#4a241d 0%,#20140f 44%,#121212 80%);color:#fff}
.v-son .statut{color:#fff}
.v-son .corps{display:flex;flex-direction:column;height:100%;padding:4.13em 1.5em 3.88em}

.v-son .entete-son{display:flex;align-items:center;justify-content:space-between;gap:.75em}
.v-son .entete-son .ic{width:1.5em;height:1.5em;flex:none}
.v-son .entete-son .ou{font-size:.69em;font-weight:600;letter-spacing:.13em;color:#D0D0D0;text-align:center;line-height:1.45;min-width:0}
.v-son .entete-son .ou b{display:block;font-size:1.18em;letter-spacing:.02em;color:#fff;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.v-son .pochette{
  width:100%;aspect-ratio:1;border-radius:.5em;overflow:hidden;
  margin:1.5em 0 2em;box-shadow:0 1.5em 3em rgba(0,0,0,.5);
}
.v-son .pochette img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}

.v-son .titre-ligne{display:flex;align-items:flex-start;justify-content:space-between;gap:1em}
.v-son .titre-ligne .t{font-size:1.5em;font-weight:700;letter-spacing:-.03em;line-height:1.15}
.v-son .titre-ligne .a{font-size:1em;color:#B3B3B3;margin-top:.15em;font-weight:400}
.v-son .titre-ligne .rond{
  width:1.5em;height:1.5em;border-radius:50%;background:#1DB954;flex:none;margin-top:.5em;
  display:flex;align-items:center;justify-content:center;
}
.v-son .titre-ligne .rond .ic{width:.95em;height:.95em;background:#000}

.v-son .piste-son{height:.25em;border-radius:.25em;background:#535353;margin:1.75em 0 .5em;position:relative}
.v-son .piste-son i{position:absolute;left:0;top:0;bottom:0;background:#fff;border-radius:.25em;width:18%;animation:lit 26s linear infinite}
@keyframes lit{from{width:14%}to{width:86%}}
.v-son .piste-son i::after{content:"";position:absolute;right:-.28em;top:50%;transform:translateY(-50%);width:.75em;height:.75em;border-radius:50%;background:#fff}
.v-son .tps{display:flex;justify-content:space-between;font-size:.69em;color:#B3B3B3;font-variant-numeric:tabular-nums}

.v-son .cmd{display:flex;align-items:center;justify-content:space-between;margin-top:1.5em}
.v-son .cmd .ic{width:2.13em;height:2.13em;background:#fff}
.v-son .cmd .petit{width:1.5em;height:1.5em;background:#fff;opacity:.85}
.v-son .cmd .gros{width:4em;height:4em;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}
.v-son .cmd .gros .ic{width:1.63em;height:1.63em;background:#000;margin-left:.08em}

.v-son .pied-son{display:flex;align-items:center;justify-content:space-between;gap:.75em;margin-top:auto;padding-top:1.75em}
.v-son .pied-son .ic{width:1.25em;height:1.25em;background:#B3B3B3;flex:none}
.v-son .pied-son .gains{display:flex;align-items:center;gap:.4em;font-size:.75em;font-weight:700;color:#1DB954;white-space:nowrap}
.v-son .pied-son .gains .lg{width:1.2em;height:1.2em;flex:none}

.etiq{
  position:absolute;z-index:5;
  display:flex;align-items:center;gap:calc(7px * var(--ech));
  background:#fff;border:calc(3px * var(--ech)) solid var(--encre);
  border-radius:calc(11px * var(--ech));
  padding:calc(6px * var(--ech)) calc(11px * var(--ech));
  box-shadow:calc(4px * var(--ech)) calc(4px * var(--ech)) 0 var(--encre);
  font-size:calc(12.5px * var(--ech));
  font-weight:800;letter-spacing:-.02em;white-space:nowrap;
  opacity:0;pointer-events:none;
  transition:opacity .3s ease, transform .6s cubic-bezier(.22,1.1,.36,1);
}
.etiq .lg{width:calc(14px * var(--ech));height:calc(14px * var(--ech));flex:none}
.etiq b{font-weight:800;font-variant-numeric:tabular-nums}
.etiq[data-i="0"]{left:8px;bottom:calc(100% - var(--dy) - var(--h) * .597);transform:translateY(22px) scale(.9) rotate(-5deg)}
.etiq[data-i="1"]{right:8px;top:calc(var(--dy) + var(--h) * .382);transform:translateY(22px) scale(.9) rotate(4deg)}
.etiq.on{opacity:1}
.etiq[data-i="0"].on{transform:translateY(0) scale(1) rotate(-5deg)}
.etiq[data-i="1"].on{transform:translateY(0) scale(1) rotate(4deg)}
.etiq .lg-tiktok{color:var(--encre)}
.etiq .lg-spotify{color:#1DB954}

.points{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px}
.points button{
  width:7px;height:7px;border-radius:50%;background:#D5D5DD;padding:0;
  transition:width .3s ease,background .3s ease;
}
.points button.on{width:22px;border-radius:4px;background:var(--encre)}

.ruban{
  overflow:hidden;background:#fff;
  border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);
  padding:15px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
}
.ruban-piste{display:flex;gap:10px;width:max-content;animation:glisse 30s linear infinite}
@keyframes glisse{to{transform:translateX(-50%)}}
.ruban:hover .ruban-piste{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.ruban-piste{animation:none}}

.gar{
  display:flex;align-items:center;gap:7px;flex:none;
  background:#fff;border:2px solid var(--encre);border-radius:10px;
  padding:7px 11px;box-shadow:2.5px 2.5px 0 var(--encre);
  font-size:12px;font-weight:700;letter-spacing:-.025em;white-space:nowrap;
}
.gar .ic{width:14px;height:14px;flex:none;color:var(--c)}
.gar b{font-weight:800;color:var(--c)}

.sec{padding:52px 0 52px;position:relative}
.sec.gris{background:#F7F7FA}
.sec.gris + .sec.gris{padding-top:0}

.surtitre{
  display:flex;align-items:center;gap:10px;margin-bottom:14px;
  font-size:11.5px;font-weight:800;letter-spacing:.15em;
  color:var(--cs,var(--gris));
}
.surtitre .filet{width:24px;height:2px;background:currentColor;flex:none;border-radius:2px}
.surtitre b{font-weight:800;opacity:.45}

.sec.nuit{background:var(--encre);color:#fff}
.sec.nuit .titre-sec .g{color:#9A9AA6}
.sec.nuit .surtitre{color:var(--jaune)}

.titre-sec{font-weight:800;font-size:clamp(27px,7.4vw,44px);line-height:.98;letter-spacing:-.04em}
.titre-sec .g{color:var(--gris);display:block}
.sec .chapo{margin-top:12px}

.releve{
  margin-top:24px;background:var(--encre);color:#fff;
  border-radius:20px;padding:18px 16px 16px;
  box-shadow:0 20px 44px rgba(10,10,12,.26);
}
.releve-tete{
  display:flex;align-items:baseline;justify-content:space-between;
  padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.14);
}
.releve-tete .mois{font-size:11px;font-weight:700;letter-spacing:.16em;color:#8E8E9A}
.releve-tete .nb{font-size:12.5px;font-weight:600;color:#8E8E9A}

.lignes{list-style:none;margin:0;padding:0}

.ligne:last-child{border-bottom:0}
.ligne{
  display:flex;align-items:center;gap:12px;padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  opacity:0;transform:translateY(12px);
  transition:opacity .5s ease, transform .5s cubic-bezier(.22,1,.36,1);
  transition-delay:calc(var(--i) * .09s);
}
.releve.vu .ligne{opacity:1;transform:none}

.ligne .vig{
  width:44px;height:44px;border-radius:11px;overflow:hidden;flex:none;
  display:flex;align-items:center;justify-content:center;
}
.ligne .vig img{width:100%;height:100%;object-fit:cover}
.ligne .vig .ic{width:20px;height:20px;background:#fff}
.ligne .tx{flex:1;min-width:0}
.ligne .tx b{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.02em}
.ligne .tx span{
  display:block;font-size:12px;color:#8E8E9A;margin-top:2px;font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ligne .mt{
  font-size:15.5px;font-weight:800;letter-spacing:-.03em;color:#2BE07C;
  font-variant-numeric:tabular-nums;flex:none;
}

.total{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-top:14px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);
}
.total span{font-size:13px;font-weight:600;color:#8E8E9A}
.total b{font-size:28px;font-weight:900;letter-spacing:-.04em;font-variant-numeric:tabular-nums}

.note{
  display:flex;gap:9px;margin-top:16px;
  font-size:14px;line-height:1.4;color:var(--gris);font-weight:500;
}
.note .ic{width:16px;height:16px;flex:none;margin-top:2px;background:var(--vert)}
.note b{color:var(--encre);font-weight:700}

.demo{margin-top:24px}

.demo-qui{
  display:flex;align-items:center;gap:8px;margin-bottom:11px;
  font-size:10.5px;font-weight:800;letter-spacing:.14em;color:var(--gris);
}
.demo-qui i{width:18px;height:2px;background:currentColor;border-radius:2px;flex:none}

.demo-bloc{border:1.5px solid var(--filet);border-radius:16px;padding:16px}
.demo-toi{background:#fff}
.demo-phrase{
  font-size:15px;line-height:1.5;font-weight:500;color:var(--encre);
  padding-left:13px;border-left:3px solid var(--bleu);
}
.demo-pied{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:15px;padding-top:13px;border-top:1px solid var(--filet);
}
.demo-note{font-size:12.5px;color:var(--gris);font-weight:500;line-height:1.3}
.envoyer{
  display:flex;align-items:center;gap:6px;flex:none;
  background:var(--bleu);color:#fff;border-radius:9px;
  padding:9px 13px;font-size:13.5px;font-weight:700;letter-spacing:-.02em;
  box-shadow:0 2px 0 #0040C4;
  transition:transform .08s ease, box-shadow .08s ease;
}
.envoyer:active{transform:translateY(2px);box-shadow:none}
.envoyer .ic{width:14px;height:14px;background:#fff}
.envoyer[disabled]{background:#E4E4EB;color:var(--gris);box-shadow:none}
.envoyer[disabled] .ic{background:var(--gris)}

.demo-entre{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:12px 0;opacity:0;transition:opacity .3s ease;
}
.demo-entre.on{opacity:1}
.demo-entre .ic{width:17px;height:17px;background:var(--gris)}
.demo-entre span{font-size:11.5px;font-weight:700;color:var(--gris);letter-spacing:-.01em}

.demo-machine{
  background:#F7F7FA;border-color:transparent;
  max-height:0;padding-top:0;padding-bottom:0;overflow:hidden;border-width:0;
  transition:max-height .55s cubic-bezier(.22,1,.36,1), padding .45s ease;
}
.demo-machine.ouverte{max-height:440px;padding:16px;border-width:1.5px}
.demo-machine ol{list-style:none;margin:0;padding:0;counter-reset:ep}
.demo-machine li{
  counter-increment:ep;display:flex;align-items:baseline;gap:10px;
  padding:9px 0;font-size:14.5px;font-weight:600;letter-spacing:-.02em;line-height:1.3;
  opacity:0;transform:translateY(6px);
  transition:opacity .35s ease, transform .35s ease;
  transition-delay:calc(var(--i) * .1s);
}
.demo-machine li + li{border-top:1px solid #E7E7EE}
.demo-machine.ouverte li{opacity:1;transform:none}
.demo-machine li::before{
  content:counter(ep);flex:none;
  width:19px;height:19px;border-radius:6px;background:var(--bleu);color:#fff;
  font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;
}
.suite{
  display:flex;gap:9px;margin-top:20px;
  font-size:14.5px;line-height:1.45;color:var(--gris);font-weight:500;
}
.suite .ic{width:16px;height:16px;flex:none;margin-top:3px;background:var(--vert)}
.suite b{color:var(--encre);font-weight:700}

.rail{
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  margin-top:22px;
}
.rail::-webkit-scrollbar{display:none}
.rail-piste{display:flex;gap:12px;padding:0 var(--marge) 4px;width:max-content}

.facon{
  scroll-snap-align:center;flex:none;width:268px;position:relative;
  border-radius:20px;overflow:hidden;background:#fff;
  border:1.5px solid var(--filet);border-top:3px solid var(--c);
}
.facon-img{position:relative;background:#fff}
.facon-img img{width:100%;height:auto;display:block}

.facon-no{
  position:absolute;left:12px;top:12px;z-index:2;
  background:#fff;border:2px solid var(--encre);border-radius:8px;
  box-shadow:2.5px 2.5px 0 var(--encre);
  font-size:12px;font-weight:900;letter-spacing:.02em;color:var(--c);
  padding:4px 8px;line-height:1;
}
.facon-prix{
  position:absolute;right:12px;bottom:-14px;z-index:3;
  display:flex;align-items:baseline;gap:5px;
  background:var(--c);color:#fff;
  border:2px solid var(--encre);border-radius:10px;
  box-shadow:3px 3px 0 var(--encre);
  padding:7px 11px;transform:rotate(-2.5deg);
}
.facon-prix b{font-size:18px;font-weight:900;letter-spacing:-.04em;line-height:1}
.facon-prix span{font-size:10.5px;font-weight:700;opacity:.92;line-height:1}

.facon-tx{padding:26px 16px 16px}
.facon-tx h3{font-size:19px;font-weight:800;letter-spacing:-.035em;line-height:1.1}
.facon-tx p{font-size:14px;color:var(--gris);margin-top:6px;line-height:1.4;min-height:39px}
.facon-duree{
  display:flex;align-items:center;gap:7px;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--filet);
  font-size:12.5px;font-weight:700;color:var(--encre);
}
.facon-duree .ic{width:14px;height:14px;background:var(--c);flex:none}
.facon-duree em{font-style:normal;font-weight:500;color:var(--gris)}

.points-rail{margin-top:18px}
.points-rail button{cursor:pointer}
.points-rail button.on{background:var(--c)}

.lot-visuel{position:relative;margin-top:20px}

.lot-badge{
  position:absolute;z-index:3;
  display:flex;align-items:center;gap:6px;
  background:#fff;color:var(--encre);
  border:2.5px solid var(--encre);border-radius:10px;
  box-shadow:3px 3px 0 var(--encre);
  padding:6px 10px;font-size:11.5px;font-weight:800;letter-spacing:-.025em;
  white-space:nowrap;
}
.lot-badge i{width:16px;height:16px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:9.5px;font-weight:900;color:#fff;background:var(--encre)}
.lot-badge.un{left:3%;top:4%;transform:rotate(-4deg)}
.lot-badge.un i{background:var(--jaune);color:var(--encre)}
.lot-badge.deux{right:3%;top:17%;transform:rotate(4deg)}
@media (max-width:359px){
  .lot-badge{font-size:10.5px;padding:5px 8px}
  .lot-badge i{width:14px;height:14px;font-size:9px}
}
.lot-img{
  display:block;margin:0;width:100%;
  max-width:none;height:auto;
  background:#fff;border-radius:20px;
}
.sec.gris .lot-img{box-shadow:0 2px 0 rgba(10,10,12,.04), 0 14px 34px rgba(10,10,12,.07)}

.lot-panneau{
  margin-top:-18px;position:relative;z-index:2;
  background:#fff;border:2.5px solid var(--encre);border-radius:20px;
  box-shadow:6px 6px 0 var(--encre);
  padding:18px 16px 16px;
}

.lot-liste{list-style:none;margin:0;padding:0 0 4px;border-bottom:2px dashed #E2E2EA}
.lot-liste li{display:flex;align-items:center;gap:11px;padding:11px 0}
.lot-liste li + li{border-top:1px solid var(--filet)}
.lot-rang{
  width:22px;height:22px;border-radius:50%;flex:none;
  background:var(--encre);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:11.5px;font-weight:800;
}
.lot-liste li:first-child .lot-rang{background:var(--jaune);color:var(--encre)}
.lot-nom{flex:1;min-width:0;font-size:15.5px;font-weight:800;letter-spacing:-.035em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lot-val{font-size:12.5px;font-weight:600;color:var(--gris);white-space:nowrap;flex:none}
.lot-val b{font-weight:800;color:var(--encre)}

.lot-label{
  display:flex;align-items:center;gap:8px;margin:16px 0 10px;
  font-size:10.5px;font-weight:800;letter-spacing:.15em;color:var(--gris);
}
.lot-label i{width:16px;height:2px;background:currentColor;border-radius:2px;flex:none}
.lot-label em{font-style:normal;color:var(--rouge)}

.rebours{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.case{background:var(--encre);border-radius:12px;padding:10px 0 8px;text-align:center}
.case b{
  display:block;font-size:26px;font-weight:900;letter-spacing:-.045em;color:var(--jaune);
  font-variant-numeric:tabular-nums;line-height:1;
}
.case span{display:block;font-size:9.5px;font-weight:700;letter-spacing:.1em;color:#8E8E9A;margin-top:5px}
.rebours.urgent .case b{color:var(--rouge)}

.sec.nuit .case{background:#1B1B22;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}

.lot-panneau .cta{margin-top:16px}
.lot-panneau .sous-cta{margin-top:10px}

.lot-etapes{list-style:none;margin:22px 0 0;padding:0;counter-reset:et}
.lot-etapes li{
  counter-increment:et;position:relative;display:flex;align-items:flex-start;gap:12px;
  padding:9px 0;font-size:14.5px;line-height:1.4;font-weight:500;color:var(--gris);
}

.lot-etapes li:not(:last-child)::after{
  content:"";position:absolute;left:11px;top:33px;bottom:-9px;width:2px;
  background:repeating-linear-gradient(to bottom,#D4D4DE 0 4px,transparent 4px 8px);
}
.lot-etapes li::before{
  content:counter(et);flex:none;position:relative;z-index:1;
  width:24px;height:24px;border-radius:50%;background:var(--encre);color:#fff;
  font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;
}
.lot-etapes b{color:var(--encre);font-weight:700}

.recois{
  margin-top:-18px;position:relative;z-index:2;
  background:#fff;border:2.5px solid var(--encre);border-radius:20px;
  box-shadow:6px 6px 0 var(--encre);overflow:hidden;
}
.recois-chiffres{display:grid;grid-template-columns:1fr 1fr}
.recois-chiffres .bloc{padding:15px 16px 16px}
.recois-chiffres .bloc:nth-child(odd){border-right:1px solid var(--filet)}
.recois-chiffres .bloc:nth-child(-n+2){border-bottom:1px solid var(--filet)}

.recois-chiffres b{
  display:flex;align-items:baseline;gap:5px;
  font-size:27px;font-weight:900;letter-spacing:-.05em;line-height:1;color:var(--encre);
}
.recois-chiffres b em{font-style:normal;font-size:15px;font-weight:800;letter-spacing:-.03em}
.recois-chiffres b.gain{color:var(--vert)}
.recois-chiffres span{
  display:block;font-size:12.5px;color:var(--gris);font-weight:600;
  margin-top:7px;line-height:1.3;
}

.recois-plus{border-top:1px solid var(--filet);background:#FAFAFC;padding:4px 16px 10px}
.recois-plus ul{list-style:none;margin:0;padding:0}
.recois-plus li{
  display:flex;align-items:flex-start;gap:10px;padding:11px 0;
  font-size:13.5px;font-weight:600;line-height:1.4;
}
.recois-plus li + li{border-top:1px solid var(--filet)}
.recois-plus .ic{width:15px;height:15px;flex:none;margin-top:2px;background:var(--vert)}

.offre{
  margin-top:22px;border:2.5px solid var(--encre);border-radius:20px;overflow:hidden;
  box-shadow:6px 6px 0 var(--encre);background:#fff;
}
.offre-tete{
  background:var(--encre);color:#fff;padding:13px 16px;
  display:flex;align-items:center;gap:10px;
}
.offre-tete .q{font-size:13.5px;font-weight:700;letter-spacing:-.02em}
.offre-corps{padding:18px 16px 16px}

.offre-prix{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.offre-prix .p{font-size:clamp(38px,11vw,46px);font-weight:900;letter-spacing:-.05em;line-height:1;white-space:nowrap}
.offre-sous{font-size:13.5px;color:var(--gris);font-weight:600;margin-top:7px}

.inclus{list-style:none;margin:17px 0 0;padding:0}
.inclus li{
  display:flex;align-items:center;gap:10px;padding:11px 0;
  font-size:14.5px;font-weight:600;line-height:1.35;
}
.inclus li + li{border-top:1px solid var(--filet)}
.inclus .ic{width:16px;height:16px;flex:none;background:var(--vert)}
.inclus b{font-weight:800}

.offre .cta{margin-top:17px}
.offre .sous-cta{margin-top:11px}

.paiements{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:13px}
.paiements .pm{
  width:42px;height:28px;flex:none;
  border:1px solid #DCDCE6;border-radius:6px;background:#fff;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.paiements .pm img{width:100%;height:100%;object-fit:contain;display:block;padding:3px}
.paiements .pm.ap img{padding:1px;transform:scale(1.5)}

.offre-urgence{
  display:flex;align-items:flex-start;gap:9px;margin-top:16px;
  font-size:13.5px;line-height:1.4;color:var(--gris);font-weight:600;
}
.offre-urgence .ic{width:16px;height:16px;flex:none;margin-top:2px;background:var(--rouge)}
.offre-urgence b{color:var(--encre);font-weight:800}

.faq{margin-top:20px;border-top:1px solid var(--filet)}
.faq details{border-bottom:1px solid var(--filet)}
.faq summary{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:16px 0;cursor:pointer;list-style:none;
  font-size:15px;font-weight:700;letter-spacing:-.025em;line-height:1.3;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{width:17px;height:17px;flex:none;background:var(--gris);transition:transform .25s ease}
.faq details[open] summary .ic{transform:rotate(180deg)}
.faq .rep{padding:0 0 18px;font-size:14.5px;line-height:1.5;color:var(--gris);max-width:36ch}
.faq .rep b{color:var(--encre);font-weight:700}

.final{text-align:center;padding:52px 0 44px}
.final .titre-sec{text-align:center}
.final .surtitre{justify-content:center}

.final-phrase{
  font-size:16px;line-height:1.5;color:#9A9AA6;font-weight:500;
  margin:16px auto 0;max-width:30ch;
}
.final-phrase b{color:#fff;font-weight:700}

.troupe{display:flex;justify-content:center;margin:26px 0 0}
.troupe span{
  width:54px;height:54px;border-radius:50%;overflow:hidden;flex:none;
  border:2.5px solid var(--encre);background:#fff;
  box-shadow:0 6px 16px rgba(0,0,0,.4);
}
.troupe span + span{margin-left:-14px}
.troupe img{width:100%;height:100%;object-fit:cover;transform:scale(1.35)}
.troupe-txt{font-size:13px;font-weight:600;color:#8E8E9A;margin-top:12px}
.troupe-txt b{color:#fff;font-weight:800}

.final .rebours{margin-top:26px}
.final-avant{
  font-size:11px;font-weight:800;letter-spacing:.15em;color:var(--jaune);
  margin-top:12px;
}
.final .cta{margin-top:18px}
.final .sous-cta{color:#8E8E9A}
.final .sous-cta b{color:#fff}
.final .sous-cta .pt{background:#4A4A55}

.barre-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);
  border-top:1px solid var(--filet);
  box-shadow:0 -6px 24px rgba(10,10,12,.09);
  padding:9px var(--marge);
  padding-bottom:calc(9px + env(safe-area-inset-bottom));
}
.barre-cta .dedans{
  display:flex;align-items:center;gap:11px;
  max-width:520px;margin:0 auto;
}
.barre-cta .vignette{
  width:44px;height:44px;flex:none;border-radius:10px;overflow:hidden;
  background:#fff;border:1px solid var(--filet);
}
.barre-cta .vignette img{width:100%;height:100%;object-fit:cover;transform:scale(1.15)}
.barre-cta .quoi{flex:1;min-width:0}
.barre-cta .quoi b{
  display:block;font-size:13.5px;font-weight:800;letter-spacing:-.03em;line-height:1.15;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.barre-cta .quoi .prix{
  display:flex;align-items:baseline;gap:6px;margin-top:3px;
  font-size:11.5px;font-weight:600;color:var(--gris);
}
.barre-cta .quoi .prix em{font-style:normal;font-size:14px;font-weight:800;color:var(--encre);letter-spacing:-.03em}
.cta-barre{
  display:flex;align-items:center;gap:6px;flex:none;
  background:var(--bleu);color:#fff;border-radius:11px;
  padding:12px 14px;font-size:14px;font-weight:700;letter-spacing:-.025em;
  box-shadow:0 3px 0 #0040C4;white-space:nowrap;
  transition:transform .08s ease, box-shadow .08s ease;
}
.cta-barre:active{transform:translateY(3px);box-shadow:none}
.cta-barre .fl{
  width:16px;height:16px;border-radius:50%;background:rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;
}

@media (max-width:379px){
  .barre-cta .quoi .recu{display:none}
}
@media (max-width:339px){
  .barre-cta .vignette{display:none}
  .cta-barre{padding:12px 12px;font-size:13.5px}
}