/* AUTOMATT LLC — refonte v2 (26/09/2026). Se charge après style.css. Aucun style en ligne (CSP). */
:root{--grad:linear-gradient(100deg,#4ad5e8 0%,#4b5fd0 38%,#8200db 70%,#b26bf5 100%);--sh-hi:0 0 0 1px rgba(115,20,196,.10),0 22px 50px -18px rgba(70,20,140,.30)}
@media (prefers-color-scheme:dark){:root{--sh-hi:0 0 0 1px rgba(178,107,245,.25),0 22px 50px -18px rgba(0,0,0,.7)}}
.v2-defs{position:absolute;width:0;height:0;overflow:hidden}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- En-tête ---- */
.nav{border-bottom-color:transparent;transition:border-color .3s,background .3s}
.nav.scrolled{border-bottom-color:var(--line-soft)}
.brand .v2-logo{width:42px;height:24px}
.v2-logo path{stroke-dasharray:420;stroke-dashoffset:0}
.js .nav .v2-logo path{stroke-dashoffset:420;animation:v2draw 2.2s .15s cubic-bezier(.6,0,.2,1) forwards}
.nav-links a{position:relative}
.nav-links a::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:2px;border-radius:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-links a:hover{background:transparent}

/* ---- Pied ---- */
.foot .v2-logo{width:52px;height:30px}
.foot-lockup{margin-bottom:6px}
.foot-tag{max-width:32ch;font-size:.875rem;margin-top:12px}
.foot-legal strong{color:rgba(255,255,255,.9)}

/* ---- Hauts de page intérieurs : lueurs qui bougent ---- */
.hero::before{background-size:130% 130%;animation:v2aur 22s ease-in-out infinite alternate}
.hero::after{animation:v2tw 5s ease-in-out infinite alternate}

/* ---- Boutons ---- */
.btn .arrow{transition:transform .2s}
.btn:hover .arrow{transform:translateX(3px)}
.btn-grad{background:var(--grad);background-size:160% 100%;color:#fff;box-shadow:0 12px 30px -12px rgba(115,20,196,.6);transition:background-position .4s,transform .2s}
.btn-grad:hover{background-position:100% 0;color:#fff;transform:translateY(-1px)}

/* ---- Cartes (toutes pages) ---- */
.card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}

/* ---- Apparition au défilement (seulement si le script tourne) ---- */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}

/* =================== ACCUEIL (.v2home) =================== */
.v2home p{margin:0}
.v2home .sec-head{max-width:740px;margin:0 auto clamp(36px,5vw,56px);text-align:center}
.v2home .sec-head .eyebrow{color:var(--accent);font-weight:700;letter-spacing:.14em;margin:0}
.v2home .sec-head h2{margin-top:12px}
.v2home .sec-head p{color:var(--muted);margin-top:16px;font-size:1.0625rem}
/* Hero */
.h-hero{position:relative;isolation:isolate;overflow:hidden;color:#fff;padding-block:clamp(56px,8vw,104px) clamp(80px,9vw,124px);
  background:linear-gradient(178deg,var(--twilight-0) 0%,var(--twilight-1) 42%,var(--twilight-2) 74%,var(--twilight-3) 100%)}
.aur{position:absolute;border-radius:50%;filter:blur(60px);opacity:.75;z-index:-2;will-change:transform;pointer-events:none}
.aur.a1{width:620px;height:520px;left:-140px;top:-160px;background:#35128f;animation:v2d1 18s ease-in-out infinite alternate}
.aur.a2{width:560px;height:480px;right:-120px;top:-120px;background:#7d1fb8;animation:v2d2 22s ease-in-out infinite alternate}
.aur.a3{width:720px;height:420px;left:20%;bottom:-260px;background:#2f6fae;opacity:.6;animation:v2d3 26s ease-in-out infinite alternate}
.stars{position:absolute;inset:0;z-index:-1;pointer-events:none}
.stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:.5;animation:v2tw 4s ease-in-out infinite}
.bigmark{position:absolute;right:-8%;top:50%;width:min(900px,90vw);transform:translateY(-50%);z-index:-1;opacity:.13;pointer-events:none}
.bigmark path{stroke-dasharray:420;stroke-dashoffset:0}
.js .bigmark path{stroke-dashoffset:420;animation:v2draw 4s .4s ease-out forwards}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,72px);align-items:center}
.h-hero .eyebrow{color:rgba(255,255,255,.72);display:inline-flex;align-items:center;gap:10px;margin:0}
.h-hero .eyebrow::before{content:"";width:22px;height:2px;background:var(--grad)}
.h-hero h1{font-size:clamp(2.5rem,1.4rem + 3.8vw,4.3rem);margin-top:18px;color:#fff;max-width:none;font-weight:500}
.h-hero h1 .grad{background:linear-gradient(100deg,#6fe6f5,#9aa6ff 45%,#d6a2ff);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:v2sheen 6s ease-in-out infinite alternate}
.h-hero .lead{color:rgba(255,255,255,.82);max-width:52ch;margin-top:22px}
.h-hero .btn-row{margin-top:32px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 0;padding:0;list-style:none}
.chips li{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:600;color:rgba(255,255,255,.86);padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.chips svg{width:15px;height:15px;color:#6fe6f5}
@media (max-width:920px){.hero-grid{grid-template-columns:1fr;text-align:center}.h-hero .lead{margin-inline:auto}.h-hero .btn-row,.chips{justify-content:center}.h-hero .eyebrow{justify-content:center}}
/* Téléphone : installation en direct */
.dev{justify-self:center;position:relative;width:min(300px,78vw);aspect-ratio:300/610;border-radius:48px;background:#0b0a10;padding:12px;margin-bottom:40px;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 0 8px #16131d,0 0 0 9px rgba(255,255,255,.08),0 60px 120px -30px rgba(10,0,40,.8),0 0 120px -20px rgba(130,0,219,.5);animation:v2float 8s ease-in-out infinite}
.dev::before{content:"";position:absolute;top:22px;left:50%;width:90px;height:26px;margin-left:-45px;border-radius:14px;background:#000;z-index:8}
.scr{position:relative;width:100%;height:100%;border-radius:38px;overflow:hidden;background:#111;text-align:left}
.L{position:absolute;inset:0}
.s-web{background:#0B0B0C;animation:v2web 12s infinite}
.s-web .url{position:absolute;left:14px;right:14px;bottom:16px;height:40px;border-radius:14px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;gap:6px;font-size:.75rem;color:rgba(255,255,255,.8)}
.s-web .url svg{width:11px;height:11px}
.s-web .share{position:absolute;right:26px;bottom:26px;width:20px;height:20px;color:#7fb6ff}
.s-web .ot{position:absolute;top:84px;left:0;right:0;text-align:center;color:#EFE9DC}
.s-web .ot .ic{width:62px;height:62px;margin:0 auto 12px;border-radius:15px;overflow:hidden;box-shadow:0 0 0 1px rgba(231,207,151,.3)}
.s-web .ot .ic svg,.grid-i .new i svg,.toast .ic svg,.v-ot .badge svg{display:block;width:100%;height:100%}
.s-web .ot b{display:block;font-size:.72rem;letter-spacing:.3em}
.s-web .ot .t{font-family:var(--serif);font-size:1.5rem;line-height:1.1;margin:16px 0 6px;color:#fff}
.s-web .ot .t em{font-style:normal;color:#E7CF97}
.s-web .ring{width:150px;height:150px;margin:18px auto 0;display:block}
.s-web .ring circle.a{stroke-dasharray:276;stroke-dashoffset:100}
.s-web .cta{margin:18px auto 0;width:170px;height:38px;border-radius:10px;background:linear-gradient(180deg,#E7CF97,#C39F5F);color:#15120a;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.s-sheet{top:auto;height:62%;background:rgba(30,30,34,.96);border-radius:22px 22px 0 0;transform:translateY(105%);animation:v2sheet 12s infinite;padding:16px 12px;color:#fff}
.s-sheet .grab{width:36px;height:4px;border-radius:2px;background:rgba(255,255,255,.3);margin:0 auto 14px}
.s-sheet .apps{display:flex;gap:12px;justify-content:center;margin-bottom:14px}
.s-sheet .apps i{width:40px;height:40px;border-radius:11px;background:#3a3a40}
.s-sheet .apps i:nth-child(1){background:#34c759}.s-sheet .apps i:nth-child(2){background:#0a84ff}.s-sheet .apps i:nth-child(3){background:#ff9f0a}
.s-sheet .row{display:flex;align-items:center;justify-content:space-between;height:40px;padding:0 14px;border-radius:12px;background:rgba(255,255,255,.07);font-size:.78rem;margin-top:6px}
.s-sheet .row svg{width:16px;height:16px;opacity:.8}
.s-sheet .row.hit{animation:v2hit 12s infinite}
.s-home{background:radial-gradient(120% 80% at 20% 0%,#4b2a8f,#1b1030 55%,#0e1330);opacity:0;animation:v2home 12s infinite;padding:62px 18px 0}
.grid-i{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 12px}
.grid-i span{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:.55rem;color:rgba(255,255,255,.85)}
.grid-i i{width:46px;height:46px;border-radius:12px;background:rgba(255,255,255,.14);display:block;overflow:hidden}
.grid-i span:nth-child(1) i{background:linear-gradient(135deg,#ff6b6b,#ee5a24)}
.grid-i span:nth-child(2) i{background:linear-gradient(135deg,#54a0ff,#2e86de)}
.grid-i span:nth-child(3) i{background:linear-gradient(135deg,#1dd1a1,#10ac84)}
.grid-i span:nth-child(4) i{background:linear-gradient(135deg,#feca57,#ff9f43)}
.grid-i span:nth-child(5) i{background:linear-gradient(135deg,#a29bfe,#6c5ce7)}
.grid-i span:nth-child(6) i{background:linear-gradient(135deg,#dfe6e9,#b2bec3)}
.grid-i span:nth-child(7) i{background:linear-gradient(135deg,#fd79a8,#e84393)}
.grid-i .new i{background:none;transform:scale(0);animation:v2pop 12s infinite;box-shadow:0 8px 20px -6px rgba(231,207,151,.6)}
.grid-i .new em{font-style:normal;opacity:0;animation:v2lbl 12s infinite}
.dock{position:absolute;left:12px;right:12px;bottom:12px;height:70px;border-radius:24px;background:rgba(255,255,255,.14);display:flex;justify-content:space-around;align-items:center}
.dock i{width:46px;height:46px;border-radius:12px;background:rgba(255,255,255,.2)}
.toast{position:absolute;left:10px;right:10px;top:62px;z-index:6;border-radius:18px;background:rgba(245,245,250,.96);color:#111;padding:10px 12px;display:flex;gap:10px;align-items:center;font-size:.68rem;line-height:1.35;transform:translateY(-160%);animation:v2toast 12s infinite;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.toast .ic{width:30px;height:30px;border-radius:8px;overflow:hidden;flex:none}
.toast b{display:block;font-size:.72rem}
.tap{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 0 6px rgba(255,255,255,.18);opacity:0;z-index:9;pointer-events:none;animation:v2tap 12s infinite}
.cap{position:absolute;left:0;right:0;bottom:-44px;text-align:center;font-size:.8125rem;color:rgba(255,255,255,.72);font-weight:600;height:20px}
.cap span{position:absolute;left:0;right:0;animation:v2cap1 12s infinite}
.cap span+span{animation-name:v2cap2;opacity:0}
/* Promesses */
.promises{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1000px){.promises{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.promises{grid-template-columns:1fr}}
.pc{position:relative;background:var(--surface);border-radius:18px;padding:28px 24px 26px;box-shadow:var(--sh-card);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;overflow:hidden}
.pc::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .6s}
.pc:hover{transform:translateY(-4px);box-shadow:var(--sh-hi)}
.pc:hover::before,.pc.in::before{transform:scaleX(1)}
.pc .ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);margin-bottom:18px}
.pc .ico svg{width:26px;height:26px}
.pc h3{font-size:1.375rem;margin-bottom:10px}
.pc p{color:var(--ink-2);font-size:.9688rem}
.pc.in .spin{animation:v2spin 1.2s .3s ease-out}
.pc.in .bob{animation:v2bob 1.6s .3s ease-in-out 2}
.pc.in .pulse{animation:v2pulse 1.6s .3s ease-in-out 2}
/* Vitrine des applications */
.apps-sec{background:var(--surface-2)}
.showcase{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:20px}
@media (max-width:1000px){.showcase{grid-template-columns:1fr}}
.app{border-radius:28px;overflow:hidden;background:var(--surface);box-shadow:var(--sh-card);display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s;text-decoration:none;color:var(--ink)}
a.app:hover{transform:translateY(-6px);box-shadow:var(--sh-hi);color:var(--ink)}
.app .vis{position:relative;height:230px;display:grid;place-items:center;overflow:hidden}
.app .body{padding:24px 26px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.app h3{font-size:1.625rem}
.app .line{color:var(--ink-2);font-size:.9688rem}
.app .meta{margin-top:auto;padding-top:10px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.875rem;font-weight:700}
.st{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:99px;width:max-content}
.st i{width:7px;height:7px;border-radius:50%}
.st.on{background:#e3f6ea;color:#0f7a3d}.st.on i{background:#16a34a;animation:v2ping 2s infinite}
.st.wip{background:var(--accent-soft);color:var(--accent)}.st.wip i{background:#b26bf5}
.st.des{background:var(--surface-2);color:var(--muted)}.st.des i{background:var(--muted)}
@media (prefers-color-scheme:dark){.st.on{background:#123222;color:#6ee7a0}}
.go{color:var(--accent);display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
.go .ar{transition:transform .2s}a.app:hover .go .ar{transform:translateX(4px)}
.v-ot{background:radial-gradient(120% 100% at 20% 0%,#1f190d,#0e0f11 60%,#08090a)}
.v-ot .ring{width:170px;height:170px;position:relative}
.v-ot .ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.v-ot .ring .a{stroke-dasharray:276.5;stroke-dashoffset:99;transition:stroke-dashoffset 2s cubic-bezier(.2,.7,.2,1)}
.js .app:not(.in) .v-ot .ring .a{stroke-dashoffset:276.5}
.v-ot .ring div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}
.v-ot .ring b{font-size:2.3rem;font-weight:300;line-height:1}
.v-ot .ring small{font-size:.55rem;letter-spacing:.2em;color:rgba(239,233,220,.6);margin-top:4px}
.v-ot .badge{position:absolute;top:16px;left:16px;width:44px;height:44px;border-radius:11px;overflow:hidden}
.v-ot .orb{position:absolute;width:460px;height:460px;border:1px solid rgba(231,207,151,.18);border-radius:50%}
.v-mm{background:linear-gradient(160deg,#fdf6ef,#f6e3df)}
.v-mm svg{width:128px;height:128px;animation:v2float 5s ease-in-out infinite;filter:drop-shadow(0 18px 20px rgba(120,60,60,.18))}
.v-mm .hrt{transform-origin:64px 70px;animation:v2beat 1.8s ease-in-out infinite}
.v-mm .conf{position:absolute;top:0;width:8px;height:8px;border-radius:2px;opacity:.7;animation:v2fall 6s linear infinite}
.v-mm .c1{left:18%;background:#d9a7ab}.v-mm .c2{left:42%;background:#e7cf97;animation-delay:1.6s}.v-mm .c3{left:70%;background:#b8858c;animation-delay:3.1s}.v-mm .c4{left:86%;background:#9fd3c7;animation-delay:4.4s}
.v-fr{background:linear-gradient(160deg,#e3f6fa,#cdeef4)}
.v-fr svg{width:120px;height:120px}
.v-fr .door{transform-origin:32px 50px;transform-box:view-box;animation:v2door 5s ease-in-out infinite}
@media (prefers-color-scheme:dark){.v-mm{background:linear-gradient(160deg,#2a1f22,#241a1d)}.v-fr{background:linear-gradient(160deg,#10262b,#0e2025)}}
/* Parcours */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.steps::before,.steps::after{content:"";position:absolute;left:6%;right:6%;top:27px;height:2px;z-index:0}
.steps::before{background:var(--line)}
.steps::after{background:var(--grad);transform:scaleX(1);transform-origin:left;transition:transform 1.8s cubic-bezier(.6,0,.2,1)}
.js .steps:not(.in)::after{transform:scaleX(0)}
.stp{position:relative;z-index:1;text-align:center;padding:0 6px}
.stp .n{width:56px;height:56px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;background:var(--ink);color:var(--canvas);box-shadow:var(--sh-card);font-family:var(--serif);font-size:1.4rem;transition:background .4s,color .4s}
.js .steps:not(.in) .stp .n{background:var(--surface);color:var(--accent)}
.steps.in .stp:nth-child(2) .n{transition-delay:.45s}.steps.in .stp:nth-child(3) .n{transition-delay:.9s}.steps.in .stp:nth-child(4) .n{transition-delay:1.35s}
.stp h3{font-size:1.25rem;margin-bottom:8px}
.stp p{color:var(--muted);font-size:.9375rem}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr;row-gap:40px}.steps::before,.steps::after{display:none}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
/* Chiffres */
.nums{background:linear-gradient(178deg,var(--twilight-1),var(--twilight-3));color:#fff;position:relative;overflow:hidden;isolation:isolate}
.nums .aur{opacity:.45}
.nums-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:860px){.nums-grid{grid-template-columns:1fr 1fr}}
.num{padding:26px 22px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.num b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.4rem,1.6rem + 2.4vw,3.4rem);line-height:1}
.num span{display:block;margin-top:10px;color:rgba(255,255,255,.75);font-size:.9375rem}
.v2home .nums h2{color:#fff}.v2home .nums .sec-head p{color:rgba(255,255,255,.72)}.v2home .nums .sec-head .eyebrow{color:#b9a6ff}
/* Pourquoi sans store */
.why{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:980px;margin-inline:auto}
@media (max-width:760px){.why{grid-template-columns:1fr}}
.col{border-radius:28px;padding:30px 28px;background:var(--surface);box-shadow:var(--sh-card)}
.col.us{box-shadow:var(--sh-hi);position:relative;overflow:hidden}
.col.us::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--grad)}
.col h3{font-size:1.375rem;margin-bottom:16px}
.col ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.col li{display:flex;gap:12px;align-items:flex-start;font-size:.9688rem;color:var(--ink-2)}
.col li svg{flex:none;width:20px;height:20px;margin-top:2px}
.col.them li svg{color:var(--muted)}.col.us li svg{color:#16a34a}
/* Appel final */
.final{text-align:center;position:relative;overflow:hidden;isolation:isolate}
.final .big{position:absolute;left:50%;top:50%;width:min(1100px,140vw);transform:translate(-50%,-50%);opacity:.16;z-index:-1}
.final .big .bs{opacity:.35}
.final .big .mv{animation:v2flow 9s linear infinite;stroke-dasharray:90 330}
.final h2{max-width:19ch;margin:14px auto 0}
.final .eyebrow{color:var(--accent);font-weight:700;letter-spacing:.14em;margin:0}
.final .sub{color:var(--muted);margin:18px auto 0;max-width:52ch}
.final .btn-row{justify-content:center}

@keyframes v2draw{to{stroke-dashoffset:0}}
@keyframes v2aur{0%{background-position:0% 0%}100%{background-position:100% 60%}}
@keyframes v2d1{to{transform:translate(120px,80px) scale(1.1)}}
@keyframes v2d2{to{transform:translate(-90px,120px) scale(.92)}}
@keyframes v2d3{to{transform:translate(-140px,-60px) scale(1.12)}}
@keyframes v2tw{0%,100%{opacity:.25}50%{opacity:.85}}
@keyframes v2sheen{to{background-position:100% 0}}
@keyframes v2float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes v2spin{to{transform:rotate(360deg)}}
@keyframes v2bob{50%{transform:translateY(-5px)}}
@keyframes v2pulse{50%{transform:scale(1.12)}}
@keyframes v2ping{0%{box-shadow:0 0 0 0 rgba(22,163,74,.45)}100%{box-shadow:0 0 0 8px rgba(22,163,74,0)}}
@keyframes v2beat{0%,100%{transform:scale(1)}20%{transform:scale(1.14)}40%{transform:scale(1)}}
@keyframes v2fall{0%{transform:translateY(-40px) rotate(0)}100%{transform:translateY(270px) rotate(320deg)}}
@keyframes v2door{0%,30%,100%{transform:perspective(200px) rotateY(0)}50%,75%{transform:perspective(200px) rotateY(-38deg)}}
@keyframes v2flow{to{stroke-dashoffset:-420}}
@keyframes v2web{0%,40%{opacity:1}44%,100%{opacity:0}}
@keyframes v2sheet{0%,12%{transform:translateY(105%)}17%,34%{transform:translateY(0)}39%,100%{transform:translateY(105%)}}
@keyframes v2hit{0%,25%{background:rgba(255,255,255,.07)}27%,34%{background:rgba(10,132,255,.55)}36%,100%{background:rgba(255,255,255,.07)}}
@keyframes v2home{0%,40%{opacity:0}45%,93%{opacity:1}98%,100%{opacity:0}}
@keyframes v2pop{0%,48%{transform:scale(0)}53%{transform:scale(1.18)}56%,100%{transform:scale(1)}}
@keyframes v2lbl{0%,54%{opacity:0}58%,100%{opacity:1}}
@keyframes v2toast{0%,60%{transform:translateY(-160%)}64%,84%{transform:translateY(0)}88%,100%{transform:translateY(-160%)}}
@keyframes v2tap{0%,7%{opacity:0;left:84%;top:94%}9%,11%{opacity:1;left:84%;top:94%;transform:scale(.8)}13%{opacity:0;left:84%;top:94%}23%{opacity:0;left:50%;top:79%}25%,27%{opacity:1;left:50%;top:79%;transform:scale(.8)}29%,100%{opacity:0;left:50%;top:79%}}
@keyframes v2cap1{0%,2%{opacity:0}4%,38%{opacity:1}41%,100%{opacity:0}}
@keyframes v2cap2{0%,44%{opacity:0}48%,92%{opacity:1}96%,100%{opacity:0}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
  .js .nav .v2-logo path,.js .bigmark path{stroke-dashoffset:0}
  .s-web,.s-sheet,.cap span{display:none}.s-home{opacity:1}.grid-i .new i{transform:none}.grid-i .new em{opacity:1}.toast{transform:none}
}

/* ---- Cartes « Notre approche » : mini-scènes (v2.1) ---- */
.pc{padding:14px 14px 26px}
.pc h3,.pc p{padding-inline:10px}
.pc h3{margin-top:20px}
.pv{position:relative;height:150px;border-radius:14px;overflow:hidden;display:grid;place-items:center;isolation:isolate}
.pv::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(115,20,196,.06);pointer-events:none}
.pv-price{background:linear-gradient(150deg,#f6eeff,#ece6ff)}
.pv-inst{background:linear-gradient(150deg,#e6f7fb,#e5ecff)}
.pv-data{background:linear-gradient(150deg,#eaf0ff,#f1e9ff)}
.pv-care{background:linear-gradient(150deg,#fbeefa,#efe9ff)}
@media (prefers-color-scheme:dark){.pv-price{background:linear-gradient(150deg,#271a3a,#1f1b36)}.pv-inst{background:linear-gradient(150deg,#132a33,#171d36)}.pv-data{background:linear-gradient(150deg,#181f3a,#231937)}.pv-care{background:linear-gradient(150deg,#2a1830,#1f1a36)}}
.pv .ui{background:#fff;color:#1d1d1c;border-radius:12px;box-shadow:0 1px 0 rgba(0,0,0,.04),0 10px 24px -12px rgba(60,20,120,.35)}
/* 1. Prix : l'abonnement se barre, le paiement unique arrive */
.pv-price .old{position:absolute;left:14px;top:16px;padding:8px 12px;transform:rotate(-6deg);opacity:.8}
.pv-price .old small{display:block;font-size:.625rem;letter-spacing:.08em;text-transform:uppercase;color:#8a8680}
.pv-price .old b{font-size:.95rem;font-weight:700;color:#8a8680}
.pv-price .old i{position:absolute;left:8px;right:8px;top:55%;height:2px;background:#e0445a;border-radius:2px;transform:scaleX(1);transform-origin:left;transition:transform .7s .5s cubic-bezier(.6,0,.2,1)}
.pv-price .new{position:absolute;right:14px;bottom:14px;padding:10px 14px 9px;text-align:left;transition:transform .8s .9s cubic-bezier(.2,.7,.2,1),opacity .8s .9s}
.pv-price .new small{display:block;font-size:.625rem;letter-spacing:.08em;text-transform:uppercase;color:#7314c4;font-weight:800}
.pv-price .new b{display:block;font-family:var(--serif);font-size:1.75rem;font-weight:500;line-height:1.1}
.pv-price .new em{font-style:normal;font-size:.72rem;color:#0f7a3d;font-weight:700}
.js .pc:not(.in) .pv-price .old i{transform:scaleX(0)}
.js .pc:not(.in) .pv-price .new{transform:translateY(24px);opacity:0}
/* 2. Installation : l'icône arrive sur l'écran d'accueil, le chrono s'arrête à 10 s */
.pv-inst .ph{position:absolute;left:calc(50% - 96px);top:18px;width:78px;height:132px;border-radius:16px;background:#fff;box-shadow:0 10px 24px -12px rgba(30,60,120,.4);padding:16px 9px;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;align-content:start}
.pv-inst .ph i{aspect-ratio:1;border-radius:6px;background:#e9e7f3}
.pv-inst .ph i.g{background:linear-gradient(135deg,#4ad5e8,#4b5fd0)}
.pv-inst .ph i.v{background:linear-gradient(135deg,#b26bf5,#8200db)}
.pv-inst .ph .ot{overflow:hidden;background:#0B0B0C;box-shadow:0 4px 10px -3px rgba(201,162,74,.8);transition:transform .6s 1s cubic-bezier(.3,1.6,.5,1)}
.pv-inst .ph .ot svg{display:block;width:100%;height:100%}
.js .pc:not(.in) .pv-inst .ph .ot{transform:scale(0)}
.pv-inst .chrono{position:absolute;right:calc(50% - 96px);top:36px;width:78px;height:78px}
.pv-inst .chrono svg{width:100%;height:100%;transform:rotate(-90deg)}
.pv-inst .chrono .tr{stroke:rgba(75,95,208,.15)}
.pv-inst .chrono .ar{stroke-dasharray:201;stroke-dashoffset:0;transition:stroke-dashoffset 1.2s .3s linear}
.js .pc:not(.in) .pv-inst .chrono .ar{stroke-dashoffset:201}
.pv-inst .chrono b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-size:1.35rem;font-weight:500;color:#2c3a9e}
.pv-inst .chrono small{position:absolute;left:-10px;right:-10px;top:88px;text-align:center;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:#4b5fd0;font-weight:800}
@media (prefers-color-scheme:dark){.pv-inst .chrono b{color:#c9d2ff}.pv-inst .ph{background:#f4f3fa}}
/* 3. Données : cadenas au centre d'un cercle de 12 étoiles (Europe) */
.pv-data .eu{position:absolute;left:50%;top:-2px;margin-left:-62px;width:124px;height:124px;animation:v2spin 40s linear infinite}
.pv-data .eu path{fill:url(#v2eu)}
.pv-data .lock{position:absolute;left:50%;top:32px;margin-left:-28px;width:56px;height:56px;display:grid;place-items:center;border-radius:16px}
.pv-data .lock svg{width:28px;height:28px;color:#4b5fd0}
.pv-data .lock .sh{transform-origin:12px 11px;transition:transform .5s 1s cubic-bezier(.3,1.6,.5,1)}
.js .pc:not(.in) .pv-data .lock .sh{transform:translateY(-3px)}
.pv-data .chip{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.625rem;letter-spacing:.08em;text-transform:uppercase;font-weight:800;color:#4b5fd0;background:rgba(255,255,255,.8);padding:4px 10px;border-radius:99px}
/* 4. Suivi : la mise à jour arrive, le support répond */
.pv-care{place-items:stretch;padding:16px 16px}
.pv-care .upd{display:flex;align-items:center;gap:9px;padding:9px 11px;font-size:.72rem;line-height:1.3;transition:transform .7s .4s cubic-bezier(.2,.7,.2,1),opacity .7s .4s}
.pv-care .upd .ic{width:26px;height:26px;border-radius:7px;flex:none;background:var(--grad);display:grid;place-items:center;color:#fff}
.pv-care .upd .ic svg{width:15px;height:15px}
.pv-care .upd b{display:block;font-size:.74rem}
.pv-care .upd span{color:#6b6862}
.pv-care .bub{justify-self:end;align-self:end;max-width:82%;margin-top:10px;padding:8px 11px;border-radius:12px 12px 4px 12px;background:linear-gradient(135deg,#7314c4,#4b5fd0);color:#fff;font-size:.72rem;line-height:1.35;transition:transform .7s 1.1s cubic-bezier(.2,.7,.2,1),opacity .7s 1.1s}
.pv-care .bub em{display:block;font-style:normal;font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;opacity:.75;margin-bottom:2px}
.pv-care .bx{display:grid}
.js .pc:not(.in) .pv-care .upd{transform:translateY(-16px);opacity:0}
.js .pc:not(.in) .pv-care .bub{transform:translateY(14px);opacity:0}
@media (prefers-reduced-motion:reduce){.pv-data .eu{animation:none}}
