/* Vos prochains clients : surcouche propre à la page (préfixe pr-) */

/* ---------- Fonds ---------- */
.sec.pr-mist{background:var(--mist)}
.sec.pr-sand{background:var(--bg-alt)}
.sec.pr-band{background:var(--pet);border-top:0}
.pr-band h2,.pr-band .h-xl{color:var(--pet-fg)}
.pr-band .mute,.pr-band .label{color:var(--pet-mute)}
.pr-band .eyebrow i{background:#FFB020}
.pr-band .adv b{color:var(--pet-fg)}
.pr-band .adv p{color:var(--pet-mute)}
.pr-band .adv li.hot b{color:#2A1308}
.pr-band .adv li.hot p{color:#6A4A38}

/* ---------- 4 étapes reliées par une ligne qui se remplit ---------- */
.pr-pipe{position:relative;list-style:none;margin:56px 0 0;padding:0;display:grid;gap:14px;--fill:0}
.pr-pipe::before,.pr-pipe::after{content:"";position:absolute;border-radius:2px}
.pr-pipe li{position:relative;z-index:1;padding:22px 20px 20px;border-radius:22px;background:var(--card);border:1px solid var(--line);box-shadow:0 18px 40px -30px rgba(60,30,10,.45)}
.pr-pipe em{position:absolute;top:20px;right:20px;font-style:normal;font-family:var(--f-m);font-size:12px;color:var(--t3)}
.pr-pipe b{display:block;margin-top:16px;font-family:var(--f-d);font-weight:600;font-size:21px;letter-spacing:-.03em}
.pr-pipe p{margin-top:6px;color:var(--t2);font-size:15px}
.pr-dot{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#F4E4D6;color:#93452A;box-shadow:0 0 0 6px var(--bg-white)}
.pr-pipe .pr-you{background:var(--pet);border-color:var(--pet)}
.pr-pipe .pr-you b{color:var(--pet-fg)}
.pr-pipe .pr-you p,.pr-pipe .pr-you em{color:var(--pet-mute)}
.pr-pipe .pr-you .pr-dot{background:#FF6B2C;color:#1A0A04;box-shadow:0 0 0 6px var(--bg-white)}
@media (min-width:900px){
  .pr-pipe{grid-template-columns:repeat(4,1fr);gap:18px}
  .pr-pipe::before{left:12%;right:12%;top:48px;height:3px;background:var(--line-2)}
  .pr-pipe::after{left:12%;top:48px;height:3px;width:76%;background:linear-gradient(90deg,#C8613B,#FF6B2C);transform-origin:left;transform:scaleX(var(--fill));transition:transform 1.8s cubic-bezier(.65,0,.35,1) .2s}
}
@media (max-width:899px){
  .pr-pipe li{padding-left:88px;min-height:96px}
  .pr-pipe .pr-dot{position:absolute;left:18px;top:20px}
  .pr-pipe b{margin-top:0}
  .pr-pipe::before{left:43px;top:30px;bottom:30px;width:3px;background:var(--line-2);z-index:0}
  .pr-pipe::after{left:43px;top:30px;width:3px;height:calc(100% - 60px);background:linear-gradient(180deg,#C8613B,#FF6B2C);transform-origin:top;transform:scaleY(var(--fill));transition:transform 1.8s cubic-bezier(.65,0,.35,1) .2s;z-index:0}
}
.pr-pipe li{opacity:0;transform:translateY(22px)}
.pr-pipe.on{--fill:1}
.pr-pipe.on li{animation:prIn .7s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--i) * .38s)}
.pr-pipe.on .pr-dot{animation:prPop .6s cubic-bezier(.34,1.56,.64,1) both;animation-delay:calc(var(--i) * .38s + .25s)}
@keyframes prIn{to{opacity:1;transform:none}}
@keyframes prPop{0%{transform:scale(.4)}100%{transform:scale(1)}}

/* ---------- Radar ---------- */
.pr-radar-grid{display:grid;gap:48px;align-items:center}
@media (min-width:980px){.pr-radar-grid{grid-template-columns:1fr 1fr;gap:72px}}
.pr-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pr-chips .chip{background:var(--card);border-color:var(--mist-line);font-size:14px;min-height:36px}
.pr-radar{position:relative;width:100%;max-width:520px;margin:0 auto;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 50%,#F7FAF9 0%,#E9F0EE 60%,#D6E3DF 100%);box-shadow:inset 0 0 0 1px var(--mist-line),0 40px 80px -40px rgba(15,49,56,.5)}
.pr-ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px dashed rgba(23,65,74,.22);transform:translate(-50%,-50%)}
.pr-ring.r1{width:30%;height:30%}.pr-ring.r2{width:60%;height:60%}.pr-ring.r3{width:90%;height:90%}
.pr-sweep{position:absolute;inset:0;border-radius:50%;overflow:hidden;opacity:0;transition:opacity .6s}
.pr-sweep::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,107,44,.28),rgba(255,107,44,0) 22%,transparent 100%)}
.pr-radar.on .pr-sweep{opacity:1}
.pr-radar.on .pr-sweep::before{animation:prSpin 5s linear infinite}
@keyframes prSpin{to{transform:rotate(360deg)}}
.pr-home{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;font-family:var(--f-m);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--pet-txt);font-weight:500}
.pr-home i{width:18px;height:18px;border-radius:50%;background:var(--pet);box-shadow:0 0 0 6px rgba(23,65,74,.15)}
.pr-radar.on .pr-home i{animation:prBeat 2s ease-out infinite}
@keyframes prBeat{0%{box-shadow:0 0 0 0 rgba(23,65,74,.35)}100%{box-shadow:0 0 0 22px rgba(23,65,74,0)}}
.pr-pin{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%) scale(.3);opacity:0;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:9px 12px 8px;border-radius:14px;background:var(--card);border:1px solid var(--mist-line);box-shadow:0 14px 30px -16px rgba(15,49,56,.55);white-space:nowrap}
.pr-pin i{position:absolute;top:-6px;left:50%;margin-left:-6px;width:12px;height:12px;border-radius:50%;background:#B9CCCB;border:2px solid #FFFAF3}
.pr-pin.hot i{background:#FF6B2C}
.pr-pin b{font-size:13.5px;font-weight:600;letter-spacing:-.01em}
.pr-pin small{font-size:11.5px;font-weight:600;color:var(--warm-fg)}
.pr-pin.hot small{color:var(--hot-fg)}
.pr-radar.on .pr-pin{animation:prPin .7s cubic-bezier(.34,1.56,.64,1) forwards;animation-delay:calc(var(--i) * .55s + .6s)}
@keyframes prPin{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.pr-tag{position:absolute;left:50%;bottom:-34px;transform:translateX(-50%);background:var(--mist)}
@media (max-width:520px){.pr-pin{padding:7px 9px 6px}.pr-pin b{font-size:12px}.pr-pin small{font-size:11px}}

/* ---------- Liste ---------- */
.pr-win{max-width:1040px;margin:0 auto}
.pr-type.typing::after{content:"";display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-2px;background:#FF6B2C;animation:prBlink .8s steps(1) infinite}
@keyframes prBlink{50%{opacity:0}}
.pr-why li{opacity:1}

/* ---------- 15 par jour ---------- */
.pr-gauge-grid{display:grid;gap:44px;align-items:center}
@media (min-width:980px){.pr-gauge-grid{grid-template-columns:.9fr 1.1fr;gap:80px}.pr-gauge-grid > .pr-gauge{order:-1}}
.pr-gauge{padding:28px 24px 26px;border-radius:28px;background:var(--bg-alt);border:1px solid var(--line)}
.pr-g-top{display:flex;align-items:center;gap:18px}
.pr-g-top .big-n{font-size:clamp(90px,11vw,150px)}
.pr-g-l{font-size:17px;line-height:1.35;color:var(--t2);font-weight:500}
.pr-dots{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,34px));gap:10px}
.pr-dots li{aspect-ratio:1;border-radius:50%;background:#E3D3BE;transition:background .3s,transform .3s}
.pr-dots li.on{background:#C8613B;transform:scale(1.06)}
.pr-dots .pr-next{position:relative;background:transparent;border:2px dashed #C9B49A}
.pr-dots .pr-next span{position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);font-family:var(--f-m);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--t3);white-space:nowrap}
.pr-gauge{padding-bottom:40px}

/* ---------- Prix ---------- */
.pr-plans{display:grid;gap:16px;max-width:820px;margin:96px auto 0}
@media (min-width:700px){.pr-plans{grid-template-columns:1fr 1fr}}
@media (max-width:699px){.pr-plans .p4.star{order:-1}}
.pr-setup{margin-top:22px;text-align:center;font-size:15.5px;color:var(--t2)}
.pr-setup b{color:var(--t1)}
.pr-faq{margin-left:auto;margin-right:auto}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  .pr-pipe li,.pr-pin{opacity:1;animation:none!important}
  .pr-pipe li{transform:none}
  .pr-pin{transform:translate(-50%,-50%)}
  .pr-pipe::after{transition:none}
  .pr-sweep{display:none}
  .pr-home i,.pr-pipe .pr-dot{animation:none!important}
}