/* Accueil : DA v2 C « Produit pop », sections C2 a C13, intro et transitions. */

/* ---------- Intro (construite puis demontee) ---------- */
.intro{display:none}
html.intro-on .intro{display:block;position:fixed;inset:0;z-index:400;background:var(--vert);overflow:hidden;cursor:pointer}
.intro-grid{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-wrap:wrap}
.intro-grid i{display:block;background:var(--creme);outline:1px solid rgba(31,61,52,.16);outline-offset:-1px}
.intro-grid i.stop{background:var(--orange)}
.intro-marker{position:absolute;left:0;top:0;display:grid;place-items:center;background:var(--blanc);border:var(--bd) solid var(--vert);box-shadow:5px 5px 0 var(--orange);border-radius:6px;z-index:2;transform-origin:0 0}
.intro-marker b{font:900 1rem/1 var(--ff);font-stretch:72%;color:var(--vert);white-space:nowrap;font-variant-numeric:tabular-nums}
.ld-art{position:absolute;inset:0}
.ld-count{position:absolute;left:var(--gut);bottom:clamp(16px,4vh,40px);z-index:4;display:flex;align-items:flex-end;gap:clamp(12px,2vw,28px);pointer-events:none}
.ld-mask{display:block;overflow:hidden;padding-top:.08em}
.ld-big{display:flex;align-items:flex-start;font:900 clamp(6rem,21vw,19rem)/.8 var(--ff);font-stretch:64%;color:var(--orange);-webkit-text-stroke:3px var(--vert);paint-order:stroke fill;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ld-big small{font-size:.34em;margin:.08em 0 0 .06em}
.ld-side{display:flex;flex-direction:column;gap:12px;padding-bottom:.6em}
.ld-label{align-self:flex-start;font-weight:800;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--creme);background:var(--vert);border:2px solid var(--creme);padding:6px 10px;border-radius:4px}
.ld-label i{font-style:normal}
.ld-blocks{position:relative;width:16px;height:16px}
.ld-blocks span{position:absolute;left:0;top:0;width:16px;height:16px;background:var(--orange);border:2px solid var(--vert)}
.ld-blocks span span{left:calc(100% + 2px);top:-2px;transform-origin:left center}
.ld-skip{position:absolute;right:var(--gut);bottom:clamp(16px,4vh,40px);z-index:6}
@media (max-width:640px){.ld-skip{top:16px;bottom:auto}.ld-big{font-size:8.5rem}}
html.intro-on .hero h1{visibility:hidden}
html.intro-on .hero [data-hero],html.intro-on .hero-est{opacity:0}
/* Sans intro, le titre est visible des le premier affichage (LCP) : il n'est cache que pendant l'intro (ligne au-dessus). */
html.js-anim .hero [data-hero],html.js-anim .hero-est{opacity:0}
.blk-wrap{position:relative;display:block;width:max-content;max-width:100%}
.blk{position:absolute;left:0;top:4%;width:101%;height:96%;pointer-events:none;transform:scaleX(0);transform-origin:left center}
.blk--o{background:var(--orange);z-index:3}
.blk--v{background:var(--vert);z-index:2}

/* ---------- C2 ouverture ---------- */
.hero{position:relative;z-index:1;padding:clamp(22px,3.2vw,44px) 0 clamp(80px,8vw,120px)}
.hero-dim{position:absolute;inset:0;background:var(--nuit);opacity:0;pointer-events:none;z-index:5}
.hero-in{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:clamp(28px,4vw,64px);align-items:center}
.hero .tag{margin-bottom:18px}
.hero h1{font-size:clamp(2.7rem,5.1vw,5.5rem);color:var(--vert)}
.hero .sub{font-size:clamp(1.04rem,1.3vw,1.2rem);font-weight:500;max-width:46ch;margin-top:20px}
.hero .wa-line{margin-top:12px;font-size:.95rem;display:flex;flex-wrap:wrap;gap:6px 18px}
.hero-prices{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.hero-prices li{display:flex;flex-direction:column;gap:2px;padding:8px 12px;background:var(--blanc);border:2px solid var(--vert);border-radius:8px;box-shadow:3px 3px 0 var(--vert)}
.hero-prices li:first-child{box-shadow:3px 3px 0 var(--orange)}
.hero-prices span{font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--vert)}
.hero-prices b{font:900 1.3rem/1 var(--ff);font-stretch:78%;color:var(--encre)}
.hero-prices a{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit}
.promises{display:flex;flex-wrap:wrap;gap:8px 18px;margin:16px 0 0;padding:0;list-style:none;font-weight:700;font-size:.9rem;color:var(--vert)}
.promises li{display:flex;align-items:center;gap:7px}
.promises li::before{content:"";width:9px;height:9px;background:var(--orange);border:2px solid var(--vert);transform:rotate(45deg)}
.promises li.eq-li::before{display:none}
.eq{display:inline-flex;align-items:flex-end;gap:2px;width:20px;height:15px}
.eq i{display:block;flex:1;height:100%;background:var(--orange);outline:1px solid var(--vert);transform-origin:50% 100%;transform:scaleY(.5)}
.eq i:nth-child(2){transform:scaleY(.85)}
.eq i:nth-child(3){transform:scaleY(.6)}
.eq i:nth-child(4){transform:scaleY(.35)}
@media (prefers-reduced-motion:no-preference){
  .eq i{animation:eq 1.1s ease-in-out infinite alternate}
  .eq i:nth-child(2){animation-duration:.8s;animation-delay:-.3s}
  .eq i:nth-child(3){animation-duration:1.3s;animation-delay:-.6s}
  .eq i:nth-child(4){animation-duration:.95s;animation-delay:-.2s}
}
@keyframes eq{0%{transform:scaleY(.2)}100%{transform:scaleY(1)}}
@media (max-width:1023px){
  .hero-in{grid-template-columns:minmax(0,1fr)}
  .hero h1{font-size:clamp(2.6rem,11.5vw,4.4rem)}
  .hero-est{margin-top:20px}
}
@media (max-width:520px){.hero-prices li{flex:1 1 40%}}

/* ---------- C3 constat (recouvre l'ouverture) ---------- */
.constat{position:relative;z-index:2;margin-top:-56px;background:var(--blanc);background-image:var(--dots);background-size:12px 12px;border-top:var(--bd) solid var(--vert);border-radius:36px 36px 0 0;padding:0 0 clamp(72px,9vw,128px)}
.marquee{position:relative;top:-28px;width:108%;margin-left:-4%;background:var(--orange);color:var(--nuit);overflow:hidden;border-top:var(--bd) solid var(--nuit);border-bottom:var(--bd) solid var(--nuit);transform:rotate(-1.4deg)}
.marquee-track{display:flex;width:max-content}
.marquee-group{display:flex;align-items:center;flex:none;margin:0;padding:0;list-style:none}
.marquee-group li{display:flex;align-items:baseline;gap:.35em;padding:.38em 0;font-weight:900;font-stretch:72%;text-transform:uppercase;font-size:clamp(1.5rem,3vw,2.8rem);line-height:1;white-space:nowrap}
.marquee-group li small{font-size:.52em;font-weight:800;letter-spacing:.03em}
.marquee-group li::after{content:"";width:.4em;height:.4em;background:var(--nuit);transform:rotate(45deg);margin:0 .7em;align-self:center}
html:not(.js-anim) .marquee-track{flex-wrap:wrap;width:auto;padding:0 6%}
html:not(.js-anim) .marquee-group[aria-hidden]{display:none}
html:not(.js-anim) .marquee-group{flex-wrap:wrap}
.constat .wrap{padding-top:clamp(36px,5vw,64px)}
.pains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:44px}
.pain{padding:24px 22px 26px}
.pain .num{display:block;font:900 4.2rem/.8 var(--ff);font-stretch:66%;color:var(--orange);-webkit-text-stroke:2px var(--vert);margin-bottom:14px}
.pain h3{margin-bottom:8px}
.pain .ici{display:block;margin-top:10px;font-weight:700;color:var(--vert)}
@media (max-width:860px){.pains{grid-template-columns:minmax(0,1fr)}}

/* ---------- C4 outils ---------- */
.outils{position:relative;padding:clamp(72px,9vw,128px) 0;overflow:hidden}
.outils::before{content:"";position:absolute;inset:0;background-image:var(--dots-o);background-size:13px 13px;-webkit-mask-image:radial-gradient(ellipse at 92% 6%,#000 0%,transparent 45%);mask-image:radial-gradient(ellipse at 92% 6%,#000 0%,transparent 45%);opacity:.75;pointer-events:none}
.outils .lien-tous{margin-top:36px}

/* ---------- C5 site vitrine, deux paliers ---------- */
.vitrine{padding:clamp(72px,9vw,128px) 0 clamp(40px,5vw,72px)}
.vitrine h2.xxl{font-size:clamp(2.4rem,4.6vw,4.8rem)}
.vit-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.prix-geant{font-weight:900;font-stretch:64%;text-transform:uppercase;color:var(--vert);line-height:.8;margin:24px 0 18px;font-size:clamp(3.2rem,10.5vw,10rem);letter-spacing:-.02em;white-space:nowrap}
@media (max-width:1023px){.prix-geant{font-size:clamp(3.2rem,22vw,10rem)}}
.prix-geant .des{display:block;font-size:.24em;color:var(--brique);letter-spacing:.04em;line-height:1;margin-bottom:.1em}
.prix-geant .eur{color:var(--orange);-webkit-text-stroke:3px var(--vert)}
.vit-paliers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;overflow:hidden}
.vit-paliers>div{padding:22px 22px 24px}
.vit-paliers>div+div{border-left:var(--bd) solid var(--vert);background:var(--creme)}
.vit-paliers h3{font:900 1.6rem/.95 var(--ff);font-stretch:74%;text-transform:uppercase}
.vit-paliers .p{font:900 1.5rem/1 var(--ff);font-stretch:74%;color:var(--brique);margin:6px 0 10px}
.vit-paliers .incl li{font-size:.95rem;padding:8px 0}
.vit-paliers .incl li::before{width:22px;height:22px;background-size:15px}
.vit-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
@media (max-width:1023px){.vit-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.vit-paliers{grid-template-columns:minmax(0,1fr)}.vit-paliers>div+div{border-left:0;border-top:var(--bd) solid var(--vert)}}

/* ---------- C6 : la capture qui se decolle, puis le suivi ---------- */
.suivi{padding:0 0 clamp(72px,9vw,128px)}
.peel{position:relative;padding:clamp(20px,3vw,40px) 0}
.peel-under{text-align:center;max-width:1000px;margin:0 auto}
.peel-under .lede{margin:18px auto 0}
.peel-card{position:relative;width:min(840px,86vw);margin:32px auto 0}
.peel-card figure{margin:0;position:relative}
.peel-card .shot{display:block;width:100%;height:auto;aspect-ratio:1200/634;object-fit:cover;border:var(--bd) solid var(--vert);border-radius:10px;box-shadow:10px 10px 0 var(--orange);background:var(--blanc)}
.peel-card figcaption{margin-top:16px;font-weight:700;color:var(--vert);text-align:center}
.peel-canvas{position:absolute;left:-50%;top:-50%;width:200%;height:200%;pointer-events:none;display:block}
.peel-flap{position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,#fff 0%,var(--creme) 55%,#cfd9d4 100%);clip-path:polygon(100% 100%,100% 100%,100% 100%);border-radius:10px;filter:drop-shadow(-4px -4px 0 rgba(31,61,52,.25))}
/* scene du decollement : plus de pleine hauteur d'ecran, l'espace est occupe par le recit (etapes, Silver, stickers) */
html.js-anim .peel.peel-on{display:grid;grid-template-rows:auto auto auto;align-items:center;justify-items:center;row-gap:clamp(14px,2.2vw,26px);padding:clamp(18px,3vw,40px) 0 clamp(8px,2vw,24px)}
html.js-anim .peel.peel-on>.peel-haut{grid-row:1}
html.js-anim .peel.peel-on>.peel-under,html.js-anim .peel.peel-on>.peel-card{grid-area:2/1}
html.js-anim .peel.peel-on>.peel-bas{grid-row:3}
html.js-anim .peel.peel-on .peel-card{margin:0;z-index:2}
html.js-anim .peel.peel-on .peel-card figcaption{display:none}
html.js-anim .peel.peel-on .peel-card{margin:0}
.peel-under{position:relative;z-index:1}

/* decor du recit : chemin en pointilles, etapes, Silver, stickers (decoratif) */
.peel-chemin{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:hidden}
.peel:not(.peel-on) .peel-chemin{display:none}
.peel-chemin .chemin{fill:none;stroke:var(--vert);stroke-width:3;stroke-dasharray:2 9;stroke-linecap:round}
.peel-chemin [data-chemin-trace]{stroke-dasharray:1;stroke-dashoffset:0}
.peel-haut,.peel-bas{position:relative;z-index:3;width:min(840px,86vw);margin:16px auto 0;display:flex;align-items:center;gap:12px 18px}
.peel-haut{justify-content:flex-start}
.peel-bas{justify-content:space-between;flex-wrap:wrap}
.peel-etapes{display:flex;flex-wrap:wrap;gap:10px 14px;justify-content:flex-start}
.etiq{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;background:var(--blanc);border:var(--bd) solid var(--vert);border-radius:999px;box-shadow:4px 4px 0 var(--orange);font:800 .82rem/1 var(--ff);font-stretch:88%;letter-spacing:.04em;text-transform:uppercase;color:var(--vert);white-space:nowrap}
.etiq b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--vert);color:var(--creme);font-size:.8rem}
.peel-etapes .etiq:last-child{box-shadow:4px 4px 0 var(--vert)}
.peel-silver{display:flex;align-items:center;gap:14px;min-width:0}
.silver-mini{margin:0;flex:none;width:clamp(76px,9vw,118px);aspect-ratio:876/716;border:var(--bd) solid var(--vert);border-radius:10px;overflow:hidden;background:#F3E6CF;box-shadow:4px 4px 0 var(--orange)}
.silver-mini img{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.bulle-mini{font-size:clamp(1rem,1.3vw,1.15rem);padding:8px 12px;max-width:22ch;box-shadow:4px 4px 0 var(--orange)}
.bulle-mini::before{content:"";position:absolute;right:-12px;top:50%;width:16px;height:16px;margin-top:-8px;background:var(--blanc);border-right:var(--bd) solid var(--vert);border-top:var(--bd) solid var(--vert);transform:skewY(18deg) rotate(45deg)}
.sticker{position:absolute;z-index:4;display:grid;place-items:center;width:clamp(40px,4.4vw,56px);height:clamp(40px,4.4vw,56px);border-radius:50%;border:var(--bd) solid var(--vert);box-shadow:3px 3px 0 var(--vert)}
.sticker svg{width:58%;height:58%}
.sticker--coche{top:-14px;right:-8px;background:var(--orange);color:var(--encre);transform:rotate(8deg)}
.sticker--loupe{bottom:-14px;right:-8px;background:var(--blanc);color:var(--vert);transform:rotate(-8deg)}
@media (max-width:767px){
  .peel-haut{margin-top:4px}
  .peel-bas{flex-direction:column;align-items:stretch;gap:12px}
  .peel-etapes{justify-content:flex-start;gap:8px 10px}
  .peel-silver{justify-content:flex-end}
  .etiq{font-size:.68rem;padding:5px 9px 5px 5px;gap:6px}
  .etiq b{width:20px;height:20px;font-size:.7rem}
}

.follow{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;margin-top:40px}
.follow .case{padding:28px 26px}
.follow .echelle{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px}
.follow .echelle li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:2px dashed rgba(31,61,52,.22);font-weight:600}
.follow .echelle b{font-weight:900;color:var(--vert);white-space:nowrap}
.follow .sortie-l{margin-top:12px;font-weight:700;color:var(--vert)}
.follow .lien{margin-top:14px;display:inline-block}
@media (max-width:767px){.follow{grid-template-columns:minmax(0,1fr)}}

/* ---------- C7 estimateur ---------- */
.estim{position:relative;padding:clamp(72px,9vw,128px) 0;overflow:hidden}
.estim::before{content:"";position:absolute;inset:0;background-image:var(--dots-o);background-size:13px 13px;-webkit-mask-image:radial-gradient(ellipse at 8% 92%,#000 0%,transparent 45%);mask-image:radial-gradient(ellipse at 8% 92%,#000 0%,transparent 45%);opacity:.7;pointer-events:none}
.est-grid{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:start}
.est-side .bubble{margin:30px 0 22px;max-width:340px;box-shadow:5px 5px 0 var(--orange);color:var(--encre)}
.est-side .bubble::after{content:"";position:absolute;left:44px;bottom:-17px;width:24px;height:24px;background:var(--blanc);border-right:var(--bd) solid var(--vert);border-bottom:var(--bd) solid var(--vert);transform:skew(-20deg) rotate(45deg)}
.silver-big{max-width:340px;aspect-ratio:876/716}
@media (max-width:1023px){.est-grid{grid-template-columns:minmax(0,1fr)}.est-side{display:grid;grid-template-columns:130px minmax(0,1fr);gap:6px 16px;align-items:end}.est-side>h2,.est-side>.lede,.est-side>.kick{grid-column:1/-1}.silver-big{grid-row:4;grid-column:1}.est-side .bubble{grid-row:4;grid-column:2;margin:20px 0 30px;font-size:1.1rem}}

/* ---------- C8 realisations : fiches en eventail ---------- */
.realisations{position:relative;padding:clamp(72px,8vw,110px) 0 clamp(56px,7vw,96px)}
.fan-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.fan-count{font:900 clamp(1.6rem,3vw,2.6rem)/1 var(--ff);font-stretch:72%;color:var(--vert);display:none}
.fan-count b{color:var(--brique)}
.fan{list-style:none;margin:36px 0 0;padding:6px var(--gut) 26px;display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.fan .fiche{flex:0 0 min(360px,80vw);scroll-snap-align:center}
.fan-bar{display:none}
.fan-pied{margin-top:20px}
.realisations.fan-on{height:100svh;min-height:640px;padding:calc(var(--nav-h) + 18px) 0 0;overflow:hidden}
.realisations.fan-on .fan-count{display:block}
.realisations.fan-on .fan-pied{display:none}
.realisations.fan-on .fan{position:absolute;left:0;right:0;top:0;bottom:0;margin:0;padding:0;overflow:visible;display:block;perspective:1400px;pointer-events:none}
.realisations.fan-on .fiche{position:absolute;left:50%;top:var(--fan-top,58%);width:min(380px,27vw);margin:0;transform-origin:50% 240%;will-change:transform;pointer-events:auto}
.realisations.fan-on .fiche.is-front{box-shadow:12px 12px 0 var(--orange)}
.realisations.fan-on .fan-bar{display:block;position:absolute;left:50%;bottom:22px;width:min(320px,60vw);height:12px;margin-left:min(-160px,-30vw);border:2px solid var(--vert);border-radius:999px;background:var(--blanc);overflow:hidden;z-index:200}
.fan-bar i{display:block;height:100%;background:var(--orange);transform-origin:left center;transform:scaleX(0)}
@media (max-width:1023px){.realisations.fan-on .fiche{width:min(300px,74vw);transform-origin:50% 260%}}

/* ---------- C9 avis ---------- */
.avis{padding:clamp(72px,9vw,128px) 0}
.reviews{margin-top:40px}

/* ---------- C10 qui ---------- */
.qui{padding:clamp(72px,9vw,128px) 0;overflow:hidden}
.who-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:center}
.who-text>p{font-size:clamp(1.08rem,1.4vw,1.25rem);margin-top:22px;max-width:52ch}
.silver-box{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;margin-top:30px;padding:16px;background:var(--creme)}
.silver-box .bubble{font-size:1.18rem}
.silver-box .bubble::after{content:"";position:absolute;left:-15px;top:28px;width:22px;height:22px;background:var(--blanc);border-left:var(--bd) solid var(--vert);border-bottom:var(--bd) solid var(--vert);transform:skewY(20deg) rotate(45deg)}
.silver-head{width:140px;aspect-ratio:1;border:var(--bd) solid var(--vert);border-radius:10px;overflow:hidden;background:#F3E6CF}
.silver-head img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.freddy-photo{margin:0;width:min(280px,70vw);aspect-ratio:1;border-radius:50%;border:4px solid var(--vert);box-shadow:8px 8px 0 var(--orange);background:var(--pale);position:relative}
.freddy-photo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.freddy-photo figcaption{position:absolute;left:50%;bottom:-2px;transform:translateX(-50%) rotate(-3deg);background:var(--vert);color:var(--creme);font:700 13px/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;padding:7px 10px;white-space:nowrap}
@media (max-width:1023px){.who-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.silver-box{grid-template-columns:minmax(0,1fr)}.silver-head{width:110px}.silver-box .bubble::after{display:none}}

/* ---------- C11 methode, 4 mesures ---------- */
.methode{position:relative;padding:clamp(72px,9vw,120px) 0;background:var(--nuit);color:var(--creme)}
.methode .wrap{position:relative}
.steps{list-style:none;margin:46px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.step{padding:22px 20px 24px;color:var(--encre)}
.step .k{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.step .k b{font:900 3.2rem/1 var(--ff);font-stretch:66%;color:var(--orange);-webkit-text-stroke:2px var(--vert)}
.step .beat{font-weight:800;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--vert)}
.step h3{font:900 1.9rem/.95 var(--ff);font-stretch:74%;text-transform:uppercase;margin-bottom:8px}
.mesure{display:flex;gap:8px;margin-top:34px}
.mesure i{flex:1;height:12px;border:2px solid var(--creme);border-radius:999px;overflow:hidden;background:transparent}
.mesure i b{display:block;height:100%;background:var(--orange);transform-origin:left;transform:scaleX(0)}
html:not(.js-anim) .mesure i b{transform:none}
@media (max-width:1023px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.steps{grid-template-columns:minmax(0,1fr)}}

/* ---------- C12 questions (recouvre la methode) ---------- */
.questions{position:relative;z-index:3;margin-top:-48px;background:var(--creme);border-top:var(--bd) solid var(--vert);border-radius:36px 36px 0 0;padding:clamp(72px,9vw,120px) 0}

/* ---------- C13 appel final, titre qui eclate ---------- */
.final{position:relative;padding:clamp(56px,7vw,96px) 0 clamp(64px,8vw,110px);overflow:hidden}
.boom{position:relative;text-align:center;padding:0 var(--gut)}
.boom-h,.boom-stack span{font-size:clamp(3.6rem,15vw,15.5rem)}
h2.boom-h{position:relative;z-index:5;color:var(--creme);font-size:clamp(3.6rem,15vw,15.5rem)}
.boom-stack{display:none}
html.js-anim .boom-stack{display:block;position:absolute;inset:0;z-index:1;pointer-events:none}
.boom-stack span{position:absolute;left:0;right:0;top:0;transform-origin:50% 100%;will-change:transform}
.boom-stack span:nth-child(1){color:var(--orange)}
.boom-stack span:nth-child(2){color:transparent;-webkit-text-stroke:2px var(--creme)}
.boom-stack span:nth-child(3){color:var(--nuit)}
.boom-stack span:nth-child(4){color:transparent;-webkit-text-stroke:2px var(--orange)}
.boom-line{margin-top:16px;font:900 clamp(1.1rem,2vw,1.6rem)/1 var(--ff);font-stretch:80%;text-transform:uppercase;letter-spacing:.06em;color:var(--orange)!important;min-height:1em}
.final-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(36px,5vw,64px)}
@media (max-width:1023px){.final-grid{grid-template-columns:minmax(0,1fr)}}

/* methode epinglee sur mobile : 2 x 2 compact, tient dans la hauteur de l'ecran, cartes blanches nettes */
@media (max-width:1023px){
  .methode.methode--pin{padding:clamp(80px,11vh,96px) 0 28px}
  .methode--pin .kick{margin-bottom:10px}
  .methode--pin .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
  .methode--pin .step{padding:12px 12px 14px}
  .methode--pin .step .k{margin-bottom:6px}
  .methode--pin .step .k b{font-size:2.2rem}
  .methode--pin .step .beat{font-size:.62rem}
  .methode--pin .step h3{font-size:1.35rem;margin-bottom:4px}
  .methode--pin .step p{font-size:.9rem;line-height:1.35}
  .methode--pin .mesure{margin-top:18px}
}
