/* Vide Maison Carolo V3 — page notaires, avocats & agences (préfixe vp-). Chargé APRÈS site.css, cette page seulement.
   Mécanismes copiés de l'accueil V3 (accueil.css, repris de Com'in Clean / Nemelec) : apparitions variées, cartes
   en relief (inclinaison au survol), icônes dont le trait se dessine, bande sombre « Pourquoi travailler avec nous »
   (trame, halos, cartes verre), frise d'étapes qui se remplit au défilement, bandeau d'appel, accordéon numéroté.
   Bandeau de page : titre mot par mot et trait rouge tracé en CSS seul (comme les pages de service).
   Les états « cachés » (.vp-h…) ne sont posés que par pros.js : sans JS tout reste visible.
   Transform / opacity / filter uniquement. Aucun reflet qui balaie une photo. Mouvement réduit coupé en bas. */

/* ================= 0. Bandeau de page : titre animé ================= */
@keyframes vp-monte{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes vp-mot{from{opacity:0;transform:translateY(.55em);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes vp-trace{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes vp-pop{from{opacity:0;transform:translateY(14px) scale(.8)}to{opacity:1;transform:none}}
@keyframes vp-respire{from{transform:scale(1.1)}to{transform:scale(1)}}
.vp-page .hero-contenu > *{animation:none}
.vp-page .hero-contenu > .fil{animation:vp-monte .7s var(--vp-ease) both}
.vp-page .hero-contenu > .hero-sous{animation:vp-monte .8s var(--vp-ease) 1.05s both}
.vp-page .hero-contenu > .hero-actions{animation:vp-monte .8s var(--vp-ease) 1.2s both}
.vp-page .hero h1{margin-bottom:18px}
.vp-w{display:inline-block}
.vp-w > i{display:inline-block;font-style:normal;animation:vp-mot .85s var(--vp-ease) both;animation-delay:calc(var(--i,0) * 85ms + .25s)}
/* point final du titre collé au dernier mot (jamais seul à la ligne) */
.vp-page .hero h1.sq::after{content:none}
.vp-page .hero h1 .vp-w:last-child > i::after{content:".";color:var(--rouge-clair,#ff6b66)}
.vp-trait{display:block;width:92px;height:5px;margin:0 0 26px;background:var(--rouge-logo);transform-origin:left center;animation:vp-trace 1s var(--vp-ease) .95s both}
.vp-page .hero-photo img{animation:vp-respire 10s var(--vp-ease) both;transform-origin:70% 50%}

/* pastilles d'engagements (remplacent la barre à trois colonnes) */
.vp-page .vp-pastilles{display:flex;flex-wrap:wrap;gap:10px;border:0;background:none;padding:0 0 40px}
.vp-page .vp-pastilles li,.vp-page .vp-pastilles li + li{display:inline-flex;align-items:center;gap:10px;padding:8px 18px 8px 9px;border:1px solid rgba(255,255,255,.42);border-left:1px solid rgba(255,255,255,.42);border-radius:999px;background:rgba(0,0,0,.5);font-size:.95rem;font-weight:600;line-height:1.3;
  animation:vp-pop .7s var(--vp-spring) both;animation-delay:calc(1.45s + var(--i,0) * 130ms);transition:background-color .25s,border-color .25s,transform .35s var(--vp-spring)}
.vp-page .vp-pastilles li:hover{background:rgba(0,0,0,.72);border-color:#fff;transform:translateY(-3px)}
.vp-page .vp-pastilles .ico{width:24px;height:24px;padding:4px;margin:0;border-radius:50%;background:var(--rouge);color:#fff;stroke-width:3}


:root{
  --vp-ease:cubic-bezier(.2,.8,.2,1);
  --vp-spring:cubic-bezier(.34,1.56,.64,1);
  --vp-clair:#ff8a80;          /* accent éclairci pour fond sombre : 7,1:1 sur #202020 */
  --vp-nuit:#171717;
}
/* ================= 1. Apparitions variées ================= */
.vp-h{opacity:0}
.vp-h-haut{transform:translateY(40px)}
.vp-h-gauche{transform:translateX(-60px)}
.vp-h-droite{transform:translateX(60px)}
.vp-h-zoom{transform:scale(.88)}
.vp-h-pivot{transform:perspective(1000px) rotateY(-24deg) rotateX(8deg) translateY(46px) scale(.94)}
.vp-h-flou{transform:translateY(22px);filter:blur(8px)}
.vp-in{opacity:1;transform:none;filter:none;
  transition:opacity .8s ease var(--vp-d,0ms),transform 1s var(--vp-ease) var(--vp-d,0ms),filter .8s ease var(--vp-d,0ms)}

/* titres de section : trait rouge qui se trace */
.vp-tete{max-width:52rem;margin-bottom:44px}
.vp-tete > p:not(.sur-titre):not(.vp-eyebrow){margin-top:16px;color:var(--gris);font-size:1.1rem}
.vp-barre{display:block;width:72px;height:4px;margin-top:18px;background:var(--rouge);transform-origin:left}
.vp-tete.vp-in .vp-barre,.vp-faq-cote.vp-in .vp-barre{animation:vpTrait .9s var(--vp-ease) .4s both}
@keyframes vpTrait{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.vp-tete-centre{margin-left:auto;margin-right:auto;text-align:center}
.vp-tete-centre .vp-barre{margin-left:auto;margin-right:auto;transform-origin:center}
.vp-eyebrow{display:block;font-weight:700;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;line-height:1.3;margin-bottom:14px;color:var(--vp-clair)}
.vp-eyebrow::before{content:"";display:inline-block;width:.7em;height:.7em;background:var(--rouge);margin-right:.6em;vertical-align:-.02em}
.vp-tete-clair .vp-barre{background:var(--vp-clair)}
/* ================= 2. Situations (cartes en relief) ================= */
/* ================= 2. Situations ================= */
.vp-situations{position:relative;overflow:hidden}
.vp-sits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;perspective:1100px}
.vp-sit-w{display:flex}
.vp-sit{position:relative;display:flex;flex-direction:column;gap:12px;width:100%;padding:28px 24px 26px;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);text-decoration:none;color:inherit;transform-style:preserve-3d;will-change:transform;
  transition:transform .5s var(--vp-ease),box-shadow .4s,border-color .3s}
.vp-sit::before{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:4px;background:var(--rouge);border-radius:0 0 var(--rayon) var(--rayon);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--vp-ease)}
.vp-sit:hover,.vp-sit:focus-visible{border-color:var(--noir);box-shadow:0 26px 46px -28px rgba(0,0,0,.45)}
.vp-sit:hover::before,.vp-sit:focus-visible::before{transform:scaleX(1)}
.vp-sit.vp-on{transition:transform .08s linear,box-shadow .3s,border-color .3s}
.vp-sit h3{color:var(--noir);transform:translateZ(0);transition:transform .5s var(--vp-ease)}
.vp-sit p{color:var(--gris);font-size:1rem;line-height:1.5}
.vp-sit-ic{position:relative;width:68px;height:68px;border-radius:50%;background:var(--creme);color:var(--noir);display:grid;place-items:center;transition:background .35s,color .35s,transform .5s var(--vp-spring);transform:translateZ(0)}
.vp-sit-ic::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--rouge);opacity:0;transform:scale(.8)}
.vp-sit:hover .vp-sit-ic,.vp-sit:focus-visible .vp-sit-ic{background:var(--rouge);color:#fff;transform:translateZ(36px) scale(1.06)}
.vp-sit:hover .vp-sit-ic::after{animation:vpOnde 1.4s ease-out infinite}
@keyframes vpOnde{0%{opacity:.7;transform:scale(.9)}100%{opacity:0;transform:scale(1.5)}}
.vp-ic{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
/* icônes : le trait se dessine à l'apparition, puis un petit mouvement permanent */
.vp-pre .vp-ic *,.vp-pre .vp-ring circle,.vp-h .vp-ic *{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.vp-in .vp-ic *,.vp-go-ok .vp-ic *{stroke-dasharray:1;stroke-dashoffset:0;opacity:1;
  transition:stroke-dashoffset 1.1s ease calc(.35s + var(--i,0)*.12s),opacity 0s calc(.35s + var(--i,0)*.12s)}
.vp-flamme{transform-box:fill-box;transform-origin:50% 90%}
.vp-in .vp-flamme{animation:vpFlamme 2.6s ease-in-out 1.6s infinite}
@keyframes vpFlamme{0%,100%{transform:scale(1,1) skewX(0)}30%{transform:scale(.94,1.07) skewX(-4deg)}65%{transform:scale(1.04,.96) skewX(3deg)}}
.vp-in .vp-mg{animation:vpGauche 3.4s ease-in-out 1.6s infinite}
.vp-in .vp-md{animation:vpDroite 3.4s ease-in-out 1.6s infinite}
@keyframes vpGauche{0%,100%{transform:translateX(0)}50%{transform:translateX(-1.6px)}}
@keyframes vpDroite{0%,100%{transform:translateX(0)}50%{transform:translateX(1.6px)}}
.vp-etiq{transform-box:fill-box;transform-origin:20% 15%}
.vp-in .vp-etiq{animation:vpBalance 3.2s ease-in-out 1.6s infinite}
@keyframes vpBalance{0%,100%{transform:rotate(0)}30%{transform:rotate(-7deg)}65%{transform:rotate(5deg)}}
.vp-in .vp-ic-doc svg{animation:vpFlotte 3.6s ease-in-out 1.6s infinite}
@keyframes vpFlotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
/* ================= 3. Bandeau d'appel ================= */
/* bandeau d'appel */
.vp-appel{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px 28px;align-items:center;margin-top:28px;padding:26px 30px;background:var(--noir);color:#fff;border-radius:var(--rayon);overflow:hidden}
.vp-appel::before{content:"";position:absolute;inset:-40% -10% auto auto;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(196,39,39,.5),transparent 68%);pointer-events:none;animation:vpDerive 14s ease-in-out infinite alternate}
.vp-appel > *{position:relative}
.vp-appel p{color:var(--gris-clair);margin-top:4px}
.vp-appel .h-m{color:#fff}
.vp-appel .q{color:var(--vp-clair)}
.vp-appel-ic{position:relative;width:56px;height:56px;border-radius:50%;background:var(--rouge);display:grid;place-items:center;font-size:26px}
.vp-appel-ic::before,.vp-appel-ic::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--vp-clair);animation:vpOnde 2.6s ease-out infinite}
.vp-appel-ic::after{animation-delay:1.3s}
.vp-appel-ic .ico{animation:vpSonne 2.6s ease-in-out infinite;transform-origin:50% 50%}
@keyframes vpSonne{0%,60%,100%{transform:rotate(0)}6%{transform:rotate(-14deg)}12%{transform:rotate(12deg)}18%{transform:rotate(-10deg)}24%{transform:rotate(8deg)}30%{transform:rotate(0)}}
@keyframes vpDerive{from{transform:translate3d(0,0,0)}to{transform:translate3d(-60px,40px,0)}}
/* ================= 4. Frise des 5 étapes ================= */
/* ================= 6. Frise « Comment ça se passe » ================= */
.vp-deroule{overflow:hidden}
.vp-frise{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.vp-frise-piste{position:absolute;top:23px;left:10%;right:10%;height:4px;pointer-events:none}
.vp-frise-fond,.vp-frise-plein{position:absolute;inset:0;border-radius:4px}
.vp-frise-fond{background:#dcd7cb}
.vp-frise-plein{background:linear-gradient(90deg,var(--rouge-fonce),var(--rouge));transform-origin:left;transform:scaleX(1)}
.vp-frise.vp-live .vp-frise-plein{transform:scaleX(var(--p,0))}
.vp-et{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.vp-et-n{position:relative;z-index:1;flex:none;width:50px;height:50px;border-radius:50%;background:var(--rouge);border:3px solid var(--rouge);display:grid;place-items:center;font-family:var(--titre);font-size:1.4rem;color:#fff;transition:background .4s,border-color .4s,color .4s,transform .6s var(--vp-spring)}
.vp-et-n b{font-weight:400;line-height:1}
.vp-et-t h3{color:var(--noir)}
.vp-et-t p{color:var(--gris);font-size:.98rem;line-height:1.5;margin-top:6px;max-width:19ch;margin-inline:auto}
.vp-live .vp-et .vp-et-n{background:#fff;border-color:#cfc9bb;color:var(--gris)}
.vp-live .vp-et .vp-et-t{opacity:.55;transform:translateY(8px);transition:opacity .5s ease,transform .6s var(--vp-ease)}
.vp-live .vp-et.vp-on .vp-et-t{opacity:1;transform:none}
.vp-live .vp-et.vp-on .vp-et-n{background:var(--rouge);border-color:var(--rouge);color:#fff;transform:scale(1.12)}
.vp-live .vp-et.vp-on .vp-et-n::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--rouge);animation:vpOnde 1.6s ease-out 1 both}
/* ================= 5. Pourquoi travailler avec nous : bande sombre ================= */
/* ================= 7. Pourquoi nous choisir : bande sombre ================= */
.vp-pourquoi{position:relative;overflow:hidden;isolation:isolate;background:var(--vp-nuit);color:#f3f1ec;padding-bottom:84px}
.vp-pourquoi::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 72% 82% at 50% 42%,#000 12%,transparent 78%);mask-image:radial-gradient(ellipse 72% 82% at 50% 42%,#000 12%,transparent 78%)}
.vp-pourquoi::after{content:"";position:absolute;inset:-20%;z-index:-1;pointer-events:none;
  background:radial-gradient(520px circle at 12% 20%,rgba(196,39,39,.5),transparent 70%),radial-gradient(620px circle at 88% 82%,rgba(224,18,20,.28),transparent 70%);
  animation:vpDrift 20s ease-in-out infinite alternate}
@keyframes vpDrift{from{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(3%,2%,0) scale(1.08)}}
.vp-pourquoi h2{color:#fff}
.vp-carres{position:absolute;inset:0;z-index:-1;pointer-events:none}
.vp-carres i{position:absolute;width:12px;height:12px;background:var(--rouge);opacity:.55;animation:vpMonte 16s linear infinite}
.vp-carres i:nth-child(1){left:6%;bottom:-20px;animation-duration:19s}
.vp-carres i:nth-child(2){left:24%;bottom:-20px;width:8px;height:8px;animation-duration:14s;animation-delay:-6s}
.vp-carres i:nth-child(3){left:47%;bottom:-20px;animation-duration:22s;animation-delay:-11s}
.vp-carres i:nth-child(4){left:69%;bottom:-20px;width:9px;height:9px;animation-duration:17s;animation-delay:-3s}
.vp-carres i:nth-child(5){left:85%;bottom:-20px;animation-duration:21s;animation-delay:-14s}
.vp-carres i:nth-child(6){left:96%;bottom:-20px;width:7px;height:7px;animation-duration:15s;animation-delay:-8s}
@keyframes vpMonte{from{transform:translateY(0) rotate(0)}to{transform:translateY(-110vh) rotate(180deg)}}
.vp-pq-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;perspective:1100px}
.vp-pq-w{display:flex}
.vp-pq{position:relative;overflow:hidden;width:100%;display:flex;flex-direction:column;gap:12px;padding:28px 26px 28px;border-radius:12px;
  background:linear-gradient(160deg,rgba(255,255,255,.11),rgba(255,255,255,.035));border:1px solid rgba(255,138,128,.26);
  box-shadow:0 22px 44px -26px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:transform .5s var(--vp-ease),background .3s,border-color .3s,box-shadow .3s}
.vp-pq.vp-on{transition:transform .08s linear,background .3s,border-color .3s,box-shadow .3s;box-shadow:0 30px 56px -26px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.14)}
.vp-pq:hover{background:linear-gradient(160deg,rgba(255,138,128,.2),rgba(255,255,255,.05));border-color:rgba(255,138,128,.65)}
.vp-fil{position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--rouge),var(--vp-clair),transparent);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--vp-ease) .5s}
.vp-pq-w.vp-in .vp-fil{transform:scaleX(1)}
.vp-pq-ic{position:relative;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--rouge),#8f1b1b);box-shadow:0 0 0 6px rgba(255,138,128,.14),0 10px 24px -8px rgba(196,39,39,.8);transition:transform .5s var(--vp-spring)}
.vp-pq-ic::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--vp-clair);pointer-events:none;animation:vpOnde 2.8s ease-out infinite;animation-delay:calc(var(--i,0)*.5s)}
.vp-pq-ic .vp-ic{width:28px;height:28px;stroke-width:1.9}
.vp-pq-w.vp-in .vp-pq-ic{animation:vpPop .8s var(--vp-spring) .45s backwards}
.vp-pq:hover .vp-pq-ic{transform:scale(1.12) rotate(-8deg)}
.vp-pq h3{font-family:var(--corps);font-weight:700;font-size:1.2rem;line-height:1.25;color:#fff}
.vp-pq p{color:rgba(255,255,255,.86);font-size:1rem;line-height:1.5}
.vp-pq-w.vp-in .vp-pq-ic .vp-ic *{stroke-dasharray:1;stroke-dashoffset:0}
.vp-pausee::before,.vp-pausee::after,.vp-pausee .vp-carres i,.vp-pausee .vp-pq-ic::after{animation-play-state:paused}
/* ================= 6. FAQ animée ================= */
/* ================= 10. FAQ animée ================= */
.vp-faq-cote{position:sticky;top:calc(var(--entete) + 24px)}
.vp-faq-cote .btn{margin-top:26px}
.vp-q{border-bottom:1px solid #d6d1c6;position:relative}
.vp-q:first-child{border-top:1px solid #d6d1c6}
.vp-q::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:4px;background:var(--rouge);transform:scaleY(0);transform-origin:top;transition:transform .5s var(--vp-ease)}
.vp-q[open]::before{transform:scaleY(1)}
.vp-q summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:22px 0 22px 14px;font-weight:700;font-size:1.1rem;line-height:1.35;color:var(--noir);transition:padding .4s var(--vp-ease),color .3s}
.vp-q summary::-webkit-details-marker{display:none}
.vp-q summary::after{content:none}
.vp-q summary:hover{color:var(--rouge)}
.vp-q[open] summary{padding-left:22px}
.vp-q-n{flex:none;min-width:2ch;font-family:var(--titre);font-weight:400;font-size:1.3rem;color:var(--gris-clair);-webkit-text-stroke:0;color:#9b968b;transition:color .3s}
.vp-q[open] .vp-q-n{color:var(--rouge)}
.vp-q-t{flex:1}
.vp-q-p{position:relative;flex:none;width:16px;height:16px;transition:transform .45s var(--vp-spring)}
.vp-q-p::before,.vp-q-p::after{content:"";position:absolute;left:0;right:0;top:7px;height:2px;background:var(--noir);transition:background .3s}
.vp-q-p::after{transform:rotate(90deg)}
.vp-q[open] .vp-q-p{transform:rotate(135deg)}
.vp-q[open] .vp-q-p::before,.vp-q[open] .vp-q-p::after{background:var(--rouge)}
.vp-rep{overflow:hidden;padding:0 40px 24px 22px}
.vp-q summary:focus-visible{outline:3px solid var(--noir);outline-offset:-3px}
/* ================= Compléments propres à cette page ================= */
.vp-situations{position:relative;overflow:hidden}
.vp-sit{cursor:default}
.vp-ic-balai svg{transform-origin:50% 100%}
.vp-in .vp-ic-balai svg{animation:vpBalaie 3s ease-in-out 1.6s infinite}
@keyframes vpBalaie{0%,100%{transform:rotate(0)}30%{transform:rotate(-7deg)}65%{transform:rotate(6deg)}}
.vp-sit:hover .vp-ic-balai svg{animation:none}
.vp-pq-grille{margin-top:6px}
.vp-appel{margin-top:56px}
.vp-appel-act{display:flex;flex-wrap:wrap;gap:12px}
.vp-appel .btn-trait-clair{border-color:rgba(255,255,255,.75)}
.vp-zone .vp-tete{margin-bottom:0}
.vp-zone .vp-tete p{max-width:62ch}
.vp-faq-cote .btn{margin-top:26px}

/* ================= Tablette ================= */
@media (max-width:1100px){
  .vp-sits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vp-pq-grille{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .vp-faq-grille{grid-template-columns:minmax(0,1fr);gap:40px}
  .vp-faq-cote{position:static}
  /* frise verticale */
  .vp-frise{grid-template-columns:minmax(0,1fr);gap:0}
  .vp-frise-piste{top:25px;bottom:25px;left:23px;right:auto;width:4px;height:auto}
  .vp-frise-plein{transform-origin:top;transform:scaleY(1)}
  .vp-frise.vp-live .vp-frise-plein{transform:scaleY(var(--p,0))}
  .vp-et{flex-direction:row;align-items:flex-start;text-align:left;gap:20px;padding:0 0 30px}
  .vp-et:last-child{padding-bottom:0}
  .vp-et-t{padding-top:10px}
  .vp-et-t p{max-width:none;margin-inline:0}
}

/* ================= Téléphone ================= */
@media (max-width:680px){
  .vp-tete{margin-bottom:32px}
  .vp-sits,.vp-pq-grille{grid-template-columns:minmax(0,1fr)}
  .vp-sit{padding:22px 20px;flex-direction:row;flex-wrap:wrap;align-items:center;column-gap:16px;row-gap:6px}
  .vp-sit-ic{width:56px;height:56px;flex:none}
  .vp-sit h3{flex:1;min-width:0}
  .vp-sit p{flex-basis:100%}
  .vp-appel{grid-template-columns:auto minmax(0,1fr);padding:22px 20px;margin-top:40px}
  .vp-appel-act{grid-column:1 / -1;flex-direction:column}
  .vp-appel-act .btn{width:100%}
  .vp-pq{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:16px;row-gap:4px;padding:20px 18px;align-items:center}
  .vp-pq-ic{grid-row:1 / span 2}
  .vp-pq h3{font-size:1.08rem;align-self:end}
  .vp-pq p{font-size:.95rem;align-self:start}
  .vp-q summary{font-size:1.02rem;padding:18px 0 18px 12px;gap:12px}
  .vp-q[open] summary{padding-left:18px}
  .vp-rep{padding:0 6px 22px 18px}
  .vp-page .vp-pastilles{padding-bottom:30px}
}

/* ================= Mouvement réduit ================= */
@media (prefers-reduced-motion:reduce){
  .vp-h,.vp-in{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  .vp-barre{animation:none!important}
  .vp-w > i,.vp-trait,.vp-page .hero-photo img,.vp-page .hero-contenu > *,.vp-page .vp-pastilles li{animation:none!important}
  .vp-pourquoi::after,.vp-carres i,.vp-pq-ic::after,.vp-appel::before,.vp-appel-ic::before,.vp-appel-ic::after,.vp-appel-ic .ico,.vp-flamme,.vp-mg,.vp-md,.vp-etiq,.vp-ic-doc svg,.vp-ic-balai svg{animation:none!important}
  .vp-pre .vp-ic *,.vp-h .vp-ic *{stroke-dashoffset:0!important;opacity:1!important}
  .vp-frise-plein{transform:none!important}
  .vp-fil{transform:scaleX(1)!important;transition:none!important}
  .vp-sit,.vp-pq,.vp-pq-ic,.vp-sit-ic{transition:none!important}
  *,*::before,*::after{transition-duration:.01ms!important}
}