@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/bricolage-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/bricolage-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C0,U+A720-A7FF}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+20A0-20AB,U+20AD-20C0,U+A720-A7FF}
:root{
    --fond:#14081c; --fond-bord:#07050b; --texte:#ffffff; --gris:#c8c8cd; --gris-2:#8d8a96;
    --orange:#f97316; --violet:#6b21a8; --ligne:rgba(255,255,255,.10); --carte:rgba(255,255,255,.035);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:400;color:var(--texte);
    background:radial-gradient(120% 80% at 50% 0%, var(--fond) 0%, var(--fond-bord) 70%) fixed, var(--fond-bord);
    line-height:1.55;font-size:17px;-webkit-font-smoothing:antialiased;
  }
  .wrap{max-width:1040px;margin:0 auto;padding:0 24px}
  em{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:0}
  .o{color:var(--orange)}
  a{color:inherit}

  /* en-tête */
  header{display:flex;justify-content:space-between;align-items:center;padding:22px 0}
  .marque{font-weight:800;font-size:20px;letter-spacing:-.02em}
  .marque span{color:var(--gris-2);font-weight:400;margin-left:8px;font-size:15px}
  .nav-haut{display:flex;justify-content:flex-end;gap:18px;white-space:nowrap}
  @media (max-width:520px){.nav-haut .large{display:none}}
  .lien-discret{color:var(--gris);font-size:15px;text-decoration:none;border-bottom:1px solid var(--ligne);padding-bottom:2px}

  /* ouverture */
  .ouverture{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center;padding:56px 0 72px}
  h1{font-weight:800;font-size:clamp(40px,6.2vw,72px);line-height:1.02;letter-spacing:-.035em}
  h1 em{font-size:1.04em}
  .sous-titre{color:var(--gris);font-size:19px;max-width:34ch;margin:22px 0 32px}
  .actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
  .bouton{
    display:inline-block;background:var(--orange);color:#1a0a02;font-weight:600;font-size:17px;
    padding:15px 26px;border-radius:999px;text-decoration:none;transition:transform .15s ease, box-shadow .15s ease
  }
  .bouton:hover{color:#fff;font-weight:800;transform:translateY(-1px);box-shadow:0 8px 30px rgba(249,115,22,.45)}
  .bouton:focus-visible{outline:2px solid #fff;outline-offset:3px}
  .precision{color:var(--gris-2);font-size:14px}
  .orbe-zone{display:flex;justify-content:center}
  .orbe{
    width:min(300px,70vw);aspect-ratio:1;border-radius:50%;
    background:url(/assets/boussole.svg) center/contain no-repeat;
    box-shadow:0 0 90px rgba(107,33,168,.55), 0 0 160px rgba(249,115,22,.18);
    animation:respire 6s ease-in-out infinite
  }
  @keyframes respire{50%{transform:scale(1.03);box-shadow:0 0 110px rgba(107,33,168,.65),0 0 190px rgba(249,115,22,.24)}}
  @media (prefers-reduced-motion:reduce){.orbe{animation:none}}

  /* tableau d'embarquement */
  @property --angle{syntax:"<angle>";initial-value:0deg;inherits:false}
  .embarquement{
    position:relative;border-radius:24px;padding:1px;
    background:conic-gradient(from var(--angle), rgba(249,115,22,.0) 0deg, rgba(249,115,22,.85) 60deg, rgba(107,33,168,.9) 140deg, rgba(107,33,168,0) 220deg, rgba(249,115,22,0) 360deg);
    animation:tour 9s linear infinite;
  }
  @keyframes tour{to{--angle:360deg}}
  .embarquement-int{
    position:relative;border-radius:23px;overflow:hidden;padding:28px 32px 26px;
    background:
      radial-gradient(90% 140% at 100% 0%, rgba(107,33,168,.28), transparent 60%),
      radial-gradient(70% 120% at 0% 100%, rgba(249,115,22,.10), transparent 60%),
      #0d0713;
  }
  .embarquement-int::before{ /* grain discret */
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  }
  .emb-haut{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px;position:relative}
  .emb-titre{font-weight:600;font-size:15px;color:var(--gris)}
  .emb-titre b{color:var(--texte);font-weight:600}
  .statut{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--texte);
    padding:6px 12px;border-radius:999px;background:rgba(249,115,22,.12);border:1px solid rgba(249,115,22,.35)}
  .statut i{width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 0 rgba(249,115,22,.7);animation:pouls 1.8s ease-out infinite}
  @keyframes pouls{70%{box-shadow:0 0 0 8px rgba(249,115,22,0)}100%{box-shadow:0 0 0 0 rgba(249,115,22,0)}}
  .emb-corps{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;position:relative}

  .horloge{display:flex;align-items:flex-start;gap:14px}
  .groupe{display:flex;flex-direction:column;align-items:center;gap:10px}
  .paire{display:flex;gap:6px}
  .unite{font-size:12px;color:var(--gris-2);letter-spacing:.02em}
  .deux-points{font-weight:800;font-size:40px;line-height:84px;color:rgba(255,255,255,.25)}
  .volet{
    --h:84px;--w:58px;position:relative;width:var(--w);height:var(--h);perspective:500px;
    font-weight:800;font-size:58px;font-variant-numeric:tabular-nums;color:#fff;
    border-radius:12px;box-shadow:0 14px 30px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.06);
  }
  .volet span{position:absolute;left:0;right:0;height:50%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
  .volet b{display:block;height:var(--h);line-height:var(--h);text-align:center;font-weight:800}
  .volet .h,.volet .vh{top:0;border-radius:12px 12px 0 0;transform-origin:50% 100%;
    background:linear-gradient(180deg,#2c1a3b 0%,#22142e 100%)}
  .volet .b,.volet .vb{bottom:0;border-radius:0 0 12px 12px;transform-origin:50% 0%;
    background:linear-gradient(180deg,#1d1127 0%,#170d20 100%)}
  .volet .b b,.volet .vb b{transform:translateY(-50%)}
  .volet::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.65);z-index:5}
  .volet .vh,.volet .vb{z-index:3;visibility:hidden}
  .volet.bascule .vh{visibility:visible;animation:replie .26s ease-in forwards}
  .volet.bascule .vb{visibility:visible;animation:deplie .26s ease-out .26s both}
  @keyframes replie{from{transform:rotateX(0)}to{transform:rotateX(-90deg)}}
  @keyframes deplie{from{transform:rotateX(90deg)}to{transform:rotateX(0)}}
  .volet.secondes{color:var(--orange)}

  .emb-prix{border-left:1px solid var(--ligne);padding-left:40px}
  .emb-prix .montant{font-weight:800;font-size:54px;line-height:1;letter-spacing:-.03em}
  .emb-prix .montant small{font-size:18px;font-weight:600;color:var(--gris);letter-spacing:0;margin-left:6px}
  .emb-prix .ensuite{color:var(--gris);font-size:15px;margin-top:8px}
  .emb-prix .ensuite s{color:var(--gris-2)}
  .emb-prix .ensuite b{color:var(--texte);font-weight:700}
  .jauge{margin-top:20px}
  .jauge-rail{height:4px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
  .jauge-plein{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--violet),var(--orange));transition:width 1s linear}
  .jauge-bornes{display:flex;justify-content:space-between;font-size:12px;color:var(--gris-2);margin-top:8px}
  .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

  @media (prefers-reduced-motion:reduce){
    .embarquement{animation:none}
    .statut i{animation:none}
    .volet.bascule .vh,.volet.bascule .vb{animation:none;visibility:hidden}
  }
  @media (max-width:820px){
    .embarquement-int{padding:22px 18px 20px}
    .emb-corps{grid-template-columns:1fr;gap:24px}
    .emb-prix{border-left:0;border-top:1px solid var(--ligne);padding:22px 0 0}
    .emb-corps > *{min-width:0}
    .horloge{gap:8px;justify-content:center}
    .paire{gap:4px}
    .volet{--h:50px;--w:31px;font-size:32px;border-radius:8px}
    .volet .h,.volet .vh{border-radius:8px 8px 0 0}
    .volet .b,.volet .vb{border-radius:0 0 8px 8px}
    .deux-points{display:none}
    .unite{font-size:11px}
    .emb-prix .montant{font-size:44px}
  }

  section{padding:88px 0;border-top:1px solid var(--ligne)}
  section:first-of-type{border-top:0}
  h2{font-weight:800;font-size:clamp(30px,4vw,44px);line-height:1.08;letter-spacing:-.03em;max-width:22ch;margin-bottom:28px}
  .intro{color:var(--gris);max-width:58ch;margin-bottom:36px}

  /* douleurs */
  .douleurs{list-style:none;display:grid;gap:22px;max-width:760px}
  .douleurs li{font-size:22px;line-height:1.35;padding-left:26px;position:relative}
  .douleurs li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:var(--orange)}
  .douleurs li span{display:block;color:var(--gris);font-size:16px;margin-top:6px}
  .constat{display:grid;gap:26px;max-width:780px}
  .constat p{font-size:21px;line-height:1.45;color:var(--gris)}
  .constat p b{color:var(--texte);font-weight:600}
  .constat p.chute{color:var(--texte);font-size:23px;padding-left:20px;border-left:2px solid var(--orange)}
  @media (max-width:820px){ .constat p{font-size:18px} .constat p.chute{font-size:20px} }

  /* histoire */
  .histoire{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:48px;align-items:center}
  /* duo avant / aujourd'hui : la cuisine en retrait et désaturée, le présent en avant et en couleur */
  .duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  .duo-photo{position:relative;margin:0;border-radius:20px;overflow:hidden;border:1px solid var(--ligne);background:#120a1a}
  .duo-photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
  .duo-photo figcaption{position:absolute;inset:auto 0 0 0;padding:44px 14px 13px;font-size:14px;line-height:1.3;color:var(--texte);
    background:linear-gradient(180deg,transparent,rgba(13,5,20,.92) 62%)}
  .duo-photo figcaption b{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--gris-2);margin-bottom:3px}
  .duo-photo.avant{margin-top:34px;rotate:-2deg}
  .duo-photo.avant img{filter:grayscale(.85) contrast(1.05) brightness(.82)}
  .duo-photo.apres{rotate:1.5deg;border-color:rgba(249,115,22,.55);box-shadow:0 18px 60px rgba(107,33,168,.45),0 0 0 1px rgba(249,115,22,.25)}
  .duo-photo.apres figcaption b{color:var(--orange)}
  .portrait{
    aspect-ratio:4/5;border-radius:18px;background:linear-gradient(160deg,#2b1640,#120a1a);
    border:1px solid var(--ligne);display:flex;align-items:flex-end;justify-content:center;
    color:var(--gris-2);font-size:13px;padding:14px;text-align:center
  }
  .histoire p{color:var(--gris);max-width:60ch;margin-bottom:16px}
  .histoire p.fort{color:var(--texte);font-size:22px;line-height:1.35}

  /* contenu */
  .bord{display:grid;grid-template-columns:1fr 1fr;gap:56px}
  .liste-sobre{list-style:none;border-top:1px solid var(--ligne)}
  .liste-sobre li{padding:16px 0;border-bottom:1px solid var(--ligne)}
  .liste-sobre li b{font-weight:600}
  .liste-sobre li span{display:block;color:var(--gris);font-size:15px;margin-top:2px}
  .chantier{
    margin-top:36px;padding:22px 24px;border-radius:16px;background:rgba(249,115,22,.07);border:1px solid rgba(249,115,22,.55);max-width:760px
  }
  .chantier p{color:var(--gris)}
  .chantier p b{color:var(--texte);font-weight:600}

  /* paliers */
  .paliers{width:100%;border-collapse:collapse;margin:8px 0 36px}
  .paliers th,.paliers td{text-align:left;padding:18px 12px;border-bottom:1px solid var(--ligne);vertical-align:top}
  .paliers th{color:var(--gris-2);font-weight:400;font-size:14px}
  .paliers td.prix{font-weight:800;font-size:24px;letter-spacing:-.02em;white-space:nowrap}
  .paliers tr.actif td{background:rgba(249,115,22,.08)}
  .paliers tr.actif td:first-child{box-shadow:inset 3px 0 0 var(--orange)}
  .paliers tr.passe td{color:var(--gris-2)}
  .etiquette{display:inline-block;font-size:12px;color:#1a0a02;background:var(--orange);border-radius:999px;padding:2px 9px;margin-left:8px;vertical-align:middle}
  .petit{color:var(--gris-2);font-size:14px}

  /* preuves */
  .vide{border:1px dashed rgba(255,255,255,.22);border-radius:16px;padding:28px;color:var(--gris-2);text-align:center}

  /* faq */
  details{border-bottom:1px solid var(--ligne);max-width:780px}
  details:first-of-type{border-top:1px solid var(--ligne)}
  summary{cursor:pointer;list-style:none;padding:20px 36px 20px 0;font-weight:600;font-size:19px;position:relative}
  summary::-webkit-details-marker{display:none}
  summary::after{content:"+";position:absolute;right:4px;top:16px;color:var(--orange);font-weight:400;font-size:26px;transition:transform .2s}
  details[open] summary::after{transform:rotate(45deg)}
  details p{color:var(--gris);padding:0 0 22px;max-width:66ch}

  .final{--roue:min(1160px,230vw);text-align:center;position:relative;isolation:isolate;overflow:hidden;
    min-height:calc(var(--roue) * .5);display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:90px;padding-bottom:90px}
  /* barre à roue en fond, vue de très près : la moitié haute, le bas sort du cadre. Elle tourne très lentement. */
  .final::before{content:"";position:absolute;z-index:-1;left:50%;bottom:calc(var(--roue) / -2);width:var(--roue);aspect-ratio:1;
    translate:-50% 0;background:url(/assets/barre.svg) center/contain no-repeat;opacity:.3;
    -webkit-mask-image:radial-gradient(closest-side,#000 70%,transparent 100%);mask-image:radial-gradient(closest-side,#000 70%,transparent 100%);
    animation:barre 90s linear infinite}
  .final::after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(closest-side at 50% 50%,rgba(20,8,28,.7),transparent 75%)}
  @keyframes barre{to{rotate:360deg}}
  @media (prefers-reduced-motion:reduce){.final::before{animation:none}}
  .final h2{margin:0 auto 18px}
  .final .intro{margin:0 auto 30px}

  footer{border-top:1px solid var(--ligne);padding:32px 0 48px;color:var(--gris-2);font-size:14px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between}
  footer nav{display:flex;gap:20px;flex-wrap:wrap}
  footer a{text-decoration:none}

  @media (max-width:820px){
    body{font-size:16px}
    .ouverture{grid-template-columns:1fr;gap:28px;padding:28px 0 48px}
    .orbe-zone{order:-1}
    .orbe{width:150px}
    .histoire{grid-template-columns:1fr;gap:28px}
    .duo{max-width:440px}
    .bord{grid-template-columns:1fr;gap:36px}
    section{padding:64px 0}
    .douleurs li{font-size:19px}
    .paliers th:nth-child(3),.paliers td:nth-child(3){display:none}
  }

/* --- pilote : éléments dynamiques --- */
[hidden]{display:none !important}
.marque{text-decoration:none;color:inherit}
.marque b{font-weight:800}
.bouton.secondaire{background:transparent;color:var(--texte);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.bouton[aria-disabled="true"],.bouton:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
button.bouton{border:0;cursor:pointer;font-family:inherit}
.paliers tr.passe td{color:var(--gris-2)}
.etiquette.grise{background:rgba(255,255,255,.12);color:var(--gris)}
.avis{max-width:1040px;margin:12px auto 0;padding:12px 18px;border-radius:12px;background:rgba(249,115,22,.1);border:1px solid rgba(249,115,22,.3);color:var(--texte);font-size:15px}
.portrait img{width:100%;height:100%;object-fit:cover;border-radius:18px}

/* fenêtres */
dialog.fenetre{
  margin:auto;max-width:520px;width:calc(100% - 32px);border:0;border-radius:22px;padding:0;color:var(--texte);
  background:linear-gradient(160deg,#21132d 0%,#150b1d 70%);box-shadow:0 30px 90px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,255,255,.08)
}
dialog.fenetre::backdrop{background:rgba(7,5,11,.72);backdrop-filter:blur(4px)}
.fenetre form{padding:28px 28px 24px;display:flex;flex-direction:column;gap:16px}
.fenetre h3{font-weight:800;font-size:26px;letter-spacing:-.025em;line-height:1.1}
.fenetre .recap{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--ligne);font-size:15px}
.fenetre .recap dt{color:var(--gris-2)}
.fenetre .recap dd{font-weight:600}
.case{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-size:15px;color:var(--gris);cursor:pointer}
.case input{appearance:none;width:22px;height:22px;border-radius:7px;margin-top:1px;border:1.5px solid rgba(255,255,255,.4);background:transparent;display:grid;place-items:center;cursor:pointer}
.case input:checked{background:var(--orange);border-color:var(--orange)}
.case input:checked::after{content:"";width:10px;height:6px;border-left:2px solid #1a0a02;border-bottom:2px solid #1a0a02;transform:rotate(-45deg) translate(1px,-1px)}
.case input:focus-visible{outline:2px solid #fff;outline-offset:2px}
.case a{color:var(--texte)}
.champ-saisie{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--gris)}
.champ-saisie input{font:inherit;font-size:16px;color:var(--texte);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:12px 14px}
.champ-saisie input:focus{outline:none;border-color:var(--orange)}
.fenetre .actions{justify-content:space-between}
.fenetre .fermer{background:none;border:0;color:var(--gris);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.erreur{color:#ffb38a;font-size:14px;min-height:1em}
.erreur a{color:#fff;font-weight:600;text-decoration:underline;white-space:nowrap}
.merci{color:var(--texte);font-size:16px}

/* code des participants du Summit */
.code-summit{margin-top:26px;max-width:420px}
.code-summit label{display:block;font-size:14px;color:var(--gris);margin-bottom:8px}
.code-ligne{display:flex;gap:10px;flex-wrap:wrap}
.code-ligne input{flex:1;min-width:150px;font:inherit;font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--texte);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:12px 18px}
.code-ligne input::placeholder{letter-spacing:0;text-transform:none;color:var(--gris-2)}
.code-ligne input:focus{outline:none;border-color:var(--orange)}
.code-retour{font-size:14px;margin-top:8px;min-height:1.4em;color:var(--gris)}
.code-retour.ok{color:#7ee0a3;font-weight:600}
.code-retour.non{color:#ff9d8a}
#champs-inscription{display:grid;gap:12px;margin:4px 0 14px}
#champs-inscription[hidden],.case[hidden],.code-ligne[hidden]{display:none}
.montant small:empty{display:none}

/* scène du prix : le prix public, barré, puis « Gratuit ». La mise en page est celle de la fin de l'animation :
   le prix réduit en haut, « Gratuit » et le champ du code dessous. Seules des transformations sont animées. */
.scene-prix{--bas:clamp(70px,11vw,130px);position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  min-height:clamp(420px,52vw,540px);padding:40px 20px 44px;margin:8px 0 10px;border-radius:32px;border:1px solid var(--ligne);
  background:radial-gradient(90% 120% at 50% 0%,rgba(107,33,168,.34),transparent 62%),linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))}
.scene-halo{position:absolute;z-index:-1;left:50%;top:52%;width:min(620px,110%);aspect-ratio:1;translate:-50% -50%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(249,115,22,.5),rgba(180,56,122,.22) 45%,transparent 72%);opacity:0;scale:.5}
.prix-public,.offert{display:flex;flex-direction:column;align-items:center}
.prix-public{gap:10px;opacity:0;transform-origin:50% 0;margin-bottom:clamp(-96px,-8.6vw,-58px)}
.pp-etiquette{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--gris-2)}
.pp-ligne{position:relative;display:inline-block;padding:0 .12em}
.pp-montant{display:inline-flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:0 .16em;font-weight:800;font-size:clamp(64px,13vw,148px);line-height:1;letter-spacing:-.045em}
.pp-montant small{font-size:.2em;font-weight:500;letter-spacing:0;color:var(--gris)}
.pp-mois{font-size:clamp(18px,2.3vw,26px);color:var(--gris)}
.pp-mois b{color:var(--texte);font-weight:700}
.rature{position:absolute;inset:-6% -4%;width:108%;height:112%;overflow:visible;pointer-events:none}
.rature path{fill:none;stroke:var(--orange);stroke-width:9;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 14px rgba(249,115,22,.7))}
.rature path+path{stroke:#ffd2ad;stroke-width:4;opacity:.85}
.offert{gap:8px;opacity:0;width:100%}
.offert-mot{font-weight:800;font-size:clamp(76px,16vw,184px);line-height:.95;letter-spacing:-.05em;padding:0 .06em .08em;
  background:linear-gradient(100deg,#ffd2ad 0%,var(--orange) 28%,#ffe9d6 46%,var(--orange) 60%,#b4387a 100%);background-size:220% 100%;background-position:100% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 10px 40px rgba(249,115,22,.35))}
.offert-pour{font-size:clamp(19px,2.6vw,30px);font-weight:700;max-width:34ch}
.offert-detail{font-size:15px;color:var(--gris);margin-top:6px}
.offert .code-summit{margin:18px auto 0;width:100%;max-width:400px}
.offert .code-summit label{text-align:center;color:var(--texte);font-weight:600}
.offert .code-ligne{justify-content:center}
.offert .code-retour{text-align:center;min-height:0}
.offert #cta-scene{margin-top:16px}
.offert #cta-scene[hidden],.lien-discret[hidden]{display:none}
.lien-discret.sans-code{display:inline-block;margin-top:18px}

.scene-prix.joue .prix-public{animation:pp-entree .7s cubic-bezier(.2,.8,.2,1) forwards, pp-recul .7s cubic-bezier(.6,0,.2,1) 2s forwards}
.scene-prix.joue .rature path{animation:rature .45s cubic-bezier(.7,0,.3,1) 1.35s forwards}
.scene-prix.joue .rature path+path{animation-delay:1.5s}
.scene-prix.joue .offert{animation:offert-entree .8s cubic-bezier(.2,1.5,.35,1) 2.25s both}
.scene-prix.joue .offert-mot{animation:reflet 1.6s ease-out 2.7s forwards}
.scene-prix.joue .scene-halo{animation:halo-prix 1.2s ease-out 2.2s forwards, halo-souffle 5s ease-in-out 3.4s infinite}
@keyframes pp-entree{from{opacity:0;translate:0 calc(var(--bas) + 18px)}to{opacity:1;translate:0 var(--bas)}}
@keyframes pp-recul{from{opacity:1;translate:0 var(--bas);scale:1;filter:none}to{opacity:.34;translate:0 0;scale:.52;filter:saturate(.4)}}
@keyframes rature{to{stroke-dashoffset:0}}
@keyframes offert-entree{from{opacity:0;scale:.6;translate:0 40px}to{opacity:1;scale:1;translate:0 0}}
@keyframes reflet{to{background-position:0 0}}
@keyframes halo-prix{to{opacity:1;scale:1}}
@keyframes halo-souffle{50%{opacity:.7;scale:1.06}}
/* arrivée par un bouton « j'entre mon code » : pas d'attente, l'état final tout de suite */
.scene-prix.vite .prix-public,.scene-prix.vite .rature path,.scene-prix.vite .offert,.scene-prix.vite .offert-mot,.scene-prix.vite .scene-halo{animation-duration:.25s!important;animation-delay:0s!important}

/* sans offre (code plus accepté) : le prix seul, sans rature */
.scene-prix.sans-offre .rature,.scene-prix.sans-offre .offert,.scene-prix.sans-offre .scene-halo{display:none}
.scene-prix.sans-offre{--bas:0px}
.scene-prix.sans-offre .prix-public{margin-bottom:0}
.scene-prix.sans-offre.joue .prix-public{animation:pp-entree .7s cubic-bezier(.2,.8,.2,1) forwards}
@media (prefers-reduced-motion:reduce){
  .scene-prix .prix-public,.scene-prix .rature path,.scene-prix .offert,.scene-prix .offert-mot,.scene-prix .scene-halo{animation-duration:.01s!important;animation-delay:0s!important;animation-iteration-count:1!important}
}

/* bloc décision : compte à rebours, prix, bouton */
#decision .actions{margin-top:26px}
