/* Feuille de style des accueils internationaux (/pt/ /en/ /es/ /br/).
   GENEREE depuis le <style> de index.html — ne pas editer a la main :
   relancer accueils.py. L'accueil francais garde sa copie en ligne. */
/* =========================================================================
   WeRetouche — Site officiel premium · 4 langues (FR/EN/PT/ES)
   Variables de marque ci-dessous → recolore tout le site.
   Textes : dictionnaire T en bas du fichier (data-i18n).
   ========================================================================= */
  :root{
    --green:#15B66E; --green-dark:#0E9E5E; --green-light:#E7F8F0; --green-tint:#F2FBF6;
    --ink:#0B1626; --muted:#647386; --bg:#fff; --soft:#F6F8FA; --soft2:#EEF2F6; --line:#E8EDF2;
    --maxw:1180px; --r:18px;
    --font:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --display:'Sora','Manrope',sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  body{font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;line-height:1.5}
  a{text-decoration:none;color:inherit}
  img{display:block;max-width:100%}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .narrow{max-width:880px}
  ::selection{background:var(--green);color:#fff}

  .btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;border-radius:100px;padding:15px 28px;font-size:15.5px;cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s,box-shadow .2s;border:0;white-space:nowrap}
  .btn-green{background:var(--green);color:#fff;box-shadow:0 10px 26px -6px rgba(21,182,110,.5)}
  .btn-green:hover{background:var(--green-dark);transform:translateY(-2px);box-shadow:0 16px 34px -8px rgba(21,182,110,.6)}
  .btn-soft{background:var(--soft2);color:var(--ink)}
  .btn-soft:hover{background:#e3e9f0;transform:translateY(-2px)}
  .btn-link{color:var(--green-dark);font-weight:700;display:inline-flex;align-items:center;gap:6px;transition:gap .2s}
  .btn-link:hover{gap:10px}
  /* Liens vers les guides depuis le corps de page (maillage interne SEO) */
  .guide-row{text-align:center;margin-top:28px}
  .guide-sec{margin-left:22px;color:var(--muted)}
  .guide-sec:hover{color:var(--green-dark)}
  @media(max-width:600px){.guide-sec{display:flex;margin:14px 0 0}}
  .ba-guide{margin-top:26px}
  .ba-guide a{color:#7fe3b1;font-weight:700;text-decoration:underline;text-underline-offset:3px}
  .ba-guide a:hover{color:#fff}
  .card-link{display:inline-block;margin-top:12px;color:var(--green-dark);font-weight:700;font-size:14.5px}
  .card-link:hover{text-decoration:underline;text-underline-offset:3px}

  .eyebrow{color:var(--green-dark);font-weight:800;font-size:13px;letter-spacing:.16em;text-transform:uppercase}
  .display{font-family:var(--display);font-weight:800;letter-spacing:-.025em;line-height:1.03}

  .stores{display:flex;gap:12px;flex-wrap:wrap}
  .store{display:flex;align-items:center;gap:11px;background:var(--ink);color:#fff;border-radius:14px;padding:11px 18px;transition:transform .2s,background .2s}
  .store:hover{transform:translateY(-2px);background:#16263e}
  /* Android pas encore publiée : badge présent mais NON cliquable (pas de lien mort). */
  .store.soon{background:var(--soft2);color:var(--muted);cursor:default}
  .store.soon:hover{transform:none;background:var(--soft2)}
  .store.soon small{color:var(--muted)}
  .store.soon svg{fill:var(--muted);opacity:.75}
  .soon-link{display:block;margin-bottom:11px;font-weight:600;color:var(--muted);opacity:.7;cursor:default}
  .store small{display:block;font-size:10px;color:#9fb0c4;line-height:1.2;letter-spacing:.02em}
  .store b{font-size:15px;font-weight:700}
  .store svg{width:22px;height:22px;flex:none;fill:#fff}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}
  .reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
  @media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

  /* ===== NAV ===== */
  nav{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid rgba(232,237,242,.8)}
  .nav-in{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
  .brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px;letter-spacing:-.01em}
  .brand img{height:38px;width:auto}
  .nav-links{display:flex;gap:26px;font-size:14.5px;font-weight:600;color:var(--muted);align-items:center}
  .nav-links a{transition:color .15s}.nav-links a:hover{color:var(--ink)}
  .nav-links .btn{display:none} /* le CTA du menu ne sert qu'en mobile (menu ouvert) */
  .nav-cta{display:flex;align-items:center;gap:12px}
  .nav-cta .btn{padding:10px 20px;font-size:14px}
  .langs{display:flex;background:var(--soft2);border-radius:100px;padding:3px}
  .langs button{border:0;background:transparent;font-family:var(--font);font-weight:800;font-size:12px;color:var(--muted);padding:6px 10px;border-radius:100px;cursor:pointer;transition:.2s}
  .langs button.on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(11,22,38,.12)}
  .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
  .burger span{width:22px;height:2.5px;background:var(--ink);border-radius:2px}
  @media(max-width:960px){
    .nav-links{display:none}.burger{display:flex}.nav-cta .btn{display:none}
    .nav-links.open{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:flex-start;background:#fff;padding:20px 28px;gap:20px;border-bottom:1px solid var(--line);box-shadow:0 24px 48px rgba(11,22,38,.1)}
    .nav-links.open .btn{display:inline-flex}
  }

  /* ===== HERO ===== */
  .hero{text-align:center;padding:78px 0 0;position:relative}
  .hero::before{content:"";position:absolute;inset:0 0 auto;height:600px;z-index:-1;background:radial-gradient(60% 70% at 50% -8%,var(--green-tint) 0%,transparent 70%)}
  .pill{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);color:var(--ink);font-size:13.5px;font-weight:700;padding:8px 16px 8px 8px;border-radius:100px;margin-bottom:30px;box-shadow:0 4px 16px rgba(11,22,38,.05)}
  .pill .chip{background:var(--green-light);color:var(--green-dark);font-size:11px;font-weight:800;padding:4px 10px;border-radius:100px;letter-spacing:.04em}
  h1{font-size:clamp(42px,7vw,84px);margin:0 auto;max-width:16ch}
  h1 .g{background:linear-gradient(115deg,var(--green),#3ad389);-webkit-background-clip:text;background-clip:text;color:transparent}
  .sub{color:var(--muted);font-size:clamp(17px,2.1vw,21px);line-height:1.55;max-width:640px;margin:26px auto 36px;font-weight:500}
  .cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;align-items:center}
  .hero .stores{justify-content:center;margin-top:28px}
  .micro{margin-top:18px;color:var(--muted);font-size:13.5px;font-weight:600;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
  .micro span{display:inline-flex;align-items:center;gap:6px}
  .micro i{color:var(--green);font-style:normal}

  .hero-stage{margin-top:8px;padding:40px 0 0;position:relative}
  .device{width:300px;background:#0b0b0c;border-radius:46px;padding:9px;box-shadow:0 60px 120px -30px rgba(11,22,38,.55),0 0 0 1px rgba(11,22,38,.06);margin:0 auto}
  .device img{width:100%;border-radius:38px}
  .hero-floats{position:absolute;inset:0;pointer-events:none}
  .float{position:absolute;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 16px;box-shadow:0 24px 50px -16px rgba(11,22,38,.22);display:flex;align-items:center;gap:11px;font-weight:700;font-size:14px;animation:bob 5s ease-in-out infinite}
  .float .ic{width:38px;height:38px;border-radius:11px;background:var(--green-light);display:grid;place-items:center;font-size:18px}
  .float small{display:block;color:var(--muted);font-weight:600;font-size:12px}
  .float.f1{top:90px;left:max(24px,calc(50% - 370px))}
  .float.f2{top:330px;right:max(24px,calc(50% - 380px));animation-delay:1.4s}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
  @media(max-width:820px){.hero-floats{display:none}}
  @media(prefers-reduced-motion:reduce){.float{animation:none}}

  .logos{display:flex;gap:18px 38px;justify-content:center;align-items:center;flex-wrap:wrap;padding:54px 0 8px;color:#9aa7b5;font-size:13px;font-weight:800;letter-spacing:.1em}
  .logos b{color:var(--muted);width:100%;text-align:center;margin-bottom:6px}
  .logos a{display:inline-flex;align-items:center;text-decoration:none}
  .logos img{height:30px;width:auto;filter:grayscale(1);opacity:.6;transition:filter .25s,opacity .25s,transform .25s}
  .logos a:hover img{filter:none;opacity:1;transform:translateY(-2px)}
  .logos .word{font-weight:800;font-size:15px;letter-spacing:.02em;color:#9aa7b5;transition:color .25s,transform .25s}
  .logos a:hover .word{color:#0079E8;transform:translateY(-2px)}

  section{padding:96px 0}
  .sec-head{text-align:center;max-width:680px;margin:0 auto 56px}
  .s-title{font-size:clamp(30px,4.4vw,52px);margin:14px 0 16px}
  .s-sub{color:var(--muted);font-size:19px;line-height:1.6;font-weight:500}

  /* ===== DEMO ANIMÉE (comment ça marche) ===== */
  .demo{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;background:linear-gradient(165deg,var(--green-tint),#fff);border:1px solid var(--line);border-radius:32px;padding:56px;overflow:hidden}
  @media(max-width:900px){.demo{grid-template-columns:1fr;padding:32px;gap:36px}}
  .demo-steps{display:grid;gap:14px}
  .dstep{display:flex;gap:16px;padding:18px 20px;border-radius:var(--r);border:1px solid transparent;transition:.4s;opacity:.55}
  .dstep.on{background:#fff;border-color:var(--line);box-shadow:0 20px 44px -22px rgba(11,22,38,.22);opacity:1}
  .dstep .dn{width:42px;height:42px;flex:none;border-radius:12px;background:var(--soft2);color:var(--muted);display:grid;place-items:center;font-weight:800;font-family:var(--display);transition:.4s}
  .dstep.on .dn{background:var(--green);color:#fff}
  .dstep h3{font-size:17px;font-weight:800;margin-bottom:3px}
  .dstep p{color:var(--muted);font-size:14px;line-height:1.55;font-weight:500}
  .dstep .bar{height:3px;background:var(--soft2);border-radius:3px;margin-top:10px;overflow:hidden;display:none}
  .dstep.on .bar{display:block}
  .dstep .bar i{display:block;height:100%;width:0;background:var(--green);border-radius:3px}
  .dstep.on .bar i{animation:fill var(--demo-dur,3.2s) linear forwards}
  @keyframes fill{to{width:100%}}

  .demo-screen{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:16/11;box-shadow:0 44px 90px -34px rgba(11,22,38,.4);border:1px solid var(--line);background:#dfe5ea}
  .demo-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .demo-screen .d-after{clip-path:inset(0 100% 0 0);transition:clip-path 0s}
  .demo.ph1 .demo-screen .d-after,.demo.ph2 .demo-screen .d-after{clip-path:inset(0 0 0 0);transition:clip-path 2.6s cubic-bezier(.4,0,.2,1)}
  .scanline{position:absolute;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 24px 4px rgba(21,182,110,.75);left:-1%;opacity:0}
  .demo.ph1 .scanline{opacity:1;animation:scan 2.6s cubic-bezier(.4,0,.2,1) forwards}
  @keyframes scan{from{left:-1%}to{left:101%}}
  .d-overlay{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .4s}
  .d-upload{background:rgba(11,22,38,.42);opacity:0}
  .demo.ph0 .d-upload{opacity:1}
  .d-upload .box{border:2px dashed rgba(255,255,255,.85);border-radius:16px;padding:26px 34px;color:#fff;font-weight:700;text-align:center;font-size:15px;animation:pulse 1.6s ease-in-out infinite}
  .d-upload .box span{font-size:30px;display:block;margin-bottom:8px}
  @keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
  .d-done{opacity:0;pointer-events:none}
  .demo.ph2 .d-done{opacity:1}
  .d-done .badge{background:#fff;color:var(--ink);border-radius:100px;padding:13px 24px;font-weight:800;font-size:15px;display:flex;align-items:center;gap:10px;box-shadow:0 20px 50px rgba(11,22,38,.35);animation:pop .5s cubic-bezier(.2,1.6,.4,1)}
  .d-done .badge em{font-style:normal;width:26px;height:26px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:14px}
  @keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
  .d-tag{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.92);color:var(--ink);font-size:11px;font-weight:800;letter-spacing:.06em;padding:6px 12px;border-radius:100px;z-index:2}
  .d-tag.r{left:auto;right:14px;background:var(--green);color:#fff;opacity:0;transition:opacity .4s}
  .demo.ph1 .d-tag.r,.demo.ph2 .d-tag.r{opacity:1}

  /* ===== features alternées ===== */
  .feat{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:54px 0}
  .feat.rev .feat-media{order:2}
  @media(max-width:880px){.feat{grid-template-columns:1fr;gap:36px}.feat.rev .feat-media{order:0}}
  .feat-media{position:relative;border-radius:24px;overflow:hidden;background:var(--soft);border:1px solid var(--line);aspect-ratio:4/3;box-shadow:0 40px 80px -36px rgba(11,22,38,.28)}
  .feat-media img{width:100%;height:100%;object-fit:cover}
  .tagico{width:54px;height:54px;border-radius:16px;background:var(--green-light);display:grid;place-items:center;font-size:26px;margin-bottom:20px}
  .feat h3{font-family:var(--display);font-size:clamp(26px,3vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.08}
  .feat p{color:var(--muted);font-size:17.5px;line-height:1.65;margin:16px 0 24px;font-weight:500}
  .feat ul{list-style:none;display:grid;gap:11px;margin-bottom:26px}
  .feat li{display:flex;gap:11px;font-weight:600;font-size:15.5px}
  .feat li::before{content:"✓";color:var(--green);font-weight:800}

  /* ===== avant/après ===== */
  .ba-section{background:var(--ink);color:#fff;border-radius:36px;padding:64px 40px;text-align:center;position:relative;overflow:hidden}
  .ba-section::before{content:"";position:absolute;inset:auto -10% -40%;height:80%;background:radial-gradient(50% 100% at 50% 100%,rgba(21,182,110,.3),transparent 70%)}
  .ba-section>*{position:relative}
  .ba-section .eyebrow{color:#7fe3b1}
  .ba-section h2{font-family:var(--display);font-size:clamp(28px,3.6vw,46px);font-weight:800;letter-spacing:-.02em;margin:12px 0}
  .ba-section .s-sub{color:#aebecc;margin-bottom:36px}
  .ba{position:relative;border-radius:20px;overflow:hidden;max-width:880px;margin:0 auto;aspect-ratio:16/10;user-select:none;box-shadow:0 50px 100px -30px rgba(0,0,0,.6)}
  .ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .ba .after-clip{clip-path:inset(0 0 0 50%)}
  .ba .divider{position:absolute;top:0;bottom:0;left:50%;width:3px;background:#fff;transform:translateX(-1.5px)}
  .ba .knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--green-dark);font-size:20px;box-shadow:0 8px 24px rgba(0,0,0,.4)}
  .ba .tag{position:absolute;top:18px;padding:8px 15px;border-radius:100px;font-size:12px;font-weight:800;letter-spacing:.06em}
  .ba .tag.b{left:18px;background:rgba(255,255,255,.92);color:var(--ink)}
  .ba .tag.a{right:18px;background:var(--green);color:#fff}
  .ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize}

  /* avant/après retouche : la version « avant » = même photo, ternie */
  .dull{filter:brightness(.72) saturate(.62) contrast(.94)}

  /* ===== photo → vidéo (téléphone incliné 3D) ===== */
  .vid-stage{display:grid;place-items:center;background:linear-gradient(160deg,var(--green-tint),#fff);border:1px solid var(--line);border-radius:24px;padding:44px 20px;box-shadow:0 40px 80px -36px rgba(11,22,38,.28)}
  .vid-phone{width:236px;background:#0b0b0c;border-radius:40px;padding:8px;box-shadow:0 50px 90px -30px rgba(11,22,38,.5);transform:perspective(1200px) rotateY(-12deg) rotateX(3deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
  .vid-stage:hover .vid-phone{transform:perspective(1200px) rotateY(0deg) rotateX(0deg)}
  .vid-phone video{width:100%;border-radius:33px;display:block}
  @media(prefers-reduced-motion:reduce){.vid-phone{transform:none}}

  /* ===== PIGE (radar animé) ===== */
  .pige{background:var(--ink);color:#fff;border-radius:36px;padding:64px 52px;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;position:relative;overflow:hidden}
  @media(max-width:880px){.pige{grid-template-columns:1fr;padding:44px 28px}}
  .pige::before{content:"";position:absolute;inset:auto -20% -50%;height:90%;background:radial-gradient(50% 100% at 50% 100%,rgba(21,182,110,.25),transparent 70%)}
  .pige>*{position:relative}
  .pige .eyebrow{color:#7fe3b1}
  .pige h2{font-family:var(--display);font-size:clamp(28px,3.6vw,46px);font-weight:800;letter-spacing:-.02em;margin:12px 0 14px}
  .pige p{color:#aebecc;font-size:17.5px;line-height:1.65;font-weight:500}
  .pg-hook{margin:22px 0;background:rgba(21,182,110,.12);border:1px solid rgba(21,182,110,.35);border-radius:14px;padding:15px 18px;color:#bff0d6;font-weight:600;font-size:14.5px;line-height:1.55}
  .pg-chips{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 26px}
  .pg-chips span{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:100px;padding:8px 15px;font-size:13px;font-weight:700}
  .radar{position:relative;width:min(320px,78%);aspect-ratio:1;margin:0 auto}
  .radar .ring{position:absolute;inset:0;border:1.5px solid rgba(21,182,110,.35);border-radius:50%;animation:ringpulse 3.4s ease-out infinite}
  .radar .ring.r2{inset:18%;animation-delay:.5s}
  .radar .ring.r3{inset:36%;animation-delay:1s}
  @keyframes ringpulse{0%,100%{opacity:.5}50%{opacity:1}}
  .radar .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(21,182,110,.45),transparent 70deg);animation:sweep 4.2s linear infinite}
  @keyframes sweep{to{transform:rotate(360deg)}}
  .radar .dot{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--green);box-shadow:0 0 14px rgba(21,182,110,.9);animation:blip 3s ease-in-out infinite}
  .radar .dot.d1{top:24%;left:62%}
  .radar .dot.d2{top:58%;left:28%;animation-delay:1s}
  .radar .dot.d3{top:70%;left:66%;animation-delay:2s}
  @keyframes blip{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1.25);opacity:1}}
  .radar .core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 20px rgba(21,182,110,1)}
  @media(prefers-reduced-motion:reduce){.radar .sweep,.radar .dot,.radar .ring{animation:none}}

  /* ===== ESTIMATION (premium : téléphone + cartes flottantes) ===== */
  .esti{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;background:linear-gradient(160deg,var(--green-tint),#fff);border:1px solid var(--line);border-radius:32px;padding:60px 56px;overflow:hidden}
  @media(max-width:880px){.esti{grid-template-columns:1fr;padding:36px 24px;text-align:center}}
  .esti .eyebrow{display:inline-block}
  .esti h2{font-family:var(--display);font-size:clamp(28px,3.4vw,44px);font-weight:800;letter-spacing:-.02em;line-height:1.08;margin:12px 0 14px}
  .esti p{color:var(--muted);font-size:17.5px;line-height:1.65;font-weight:500;margin-bottom:24px}
  .esti ul{list-style:none;display:grid;gap:11px;margin-bottom:28px;text-align:left}
  .esti li{display:flex;gap:11px;font-weight:600;font-size:15.5px}
  .esti li::before{content:"✓";color:var(--green);font-weight:800}
  .esti-media{position:relative;display:flex;justify-content:center;padding:18px 0}
  .esti-media .device{width:238px}
  .esti-media .float{z-index:2}
  .esti-media .ef1{top:6%;left:max(-14px,2%)}
  .esti-media .ef2{bottom:8%;right:max(-14px,0%);animation-delay:1.6s}
  @media(max-width:880px){.esti-media .float{display:none}}

  /* ===== « Et aussi » (grille de cartes) ===== */
  .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:52px}
  .grid.ea4{grid-template-columns:repeat(4,1fr)}
  @media(max-width:1000px){.grid.ea4{grid-template-columns:1fr 1fr}}
  @media(max-width:560px){.grid.ea4{grid-template-columns:1fr}}
  .card{background:var(--soft);border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;transition:transform .25s,box-shadow .25s,background .25s}
  .card:hover{transform:translateY(-4px);background:#fff;box-shadow:0 24px 50px -24px rgba(11,22,38,.2)}
  .card .ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--green-light);font-size:22px;margin-bottom:15px}
  .card h3{font-size:17.5px;font-weight:800;margin-bottom:8px}
  .card p{color:var(--muted);font-size:14px;line-height:1.6;font-weight:500}

  /* ===== stats ===== */
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
  @media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}
  .stat .n{font-family:var(--display);font-size:clamp(34px,4vw,52px);font-weight:800;color:var(--green-dark);letter-spacing:-.02em}
  .stat .l{color:var(--muted);font-weight:600;margin-top:6px;font-size:15px}

  /* ===== steps ===== */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:760px){.steps{grid-template-columns:1fr}}
  .step{background:var(--soft);border:1px solid var(--line);border-radius:var(--r);padding:30px;transition:transform .25s,box-shadow .25s}
  .step:hover{transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(11,22,38,.2)}
  .step .n{width:46px;height:46px;border-radius:14px;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;margin-bottom:18px;font-family:var(--display)}
  .step h3{font-size:20px;margin-bottom:9px;font-weight:800}
  .step p{color:var(--muted);font-size:15px;line-height:1.6;font-weight:500}

  /* ===== screens ===== */
  .screens{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;background:linear-gradient(165deg,var(--green-tint),#fff);border:1px solid var(--line);border-radius:32px;padding:56px;overflow:hidden}
  @media(max-width:880px){.screens{grid-template-columns:1fr;padding:36px;text-align:center}}
  .screens h2{font-family:var(--display);font-size:clamp(26px,3.2vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin-top:14px}
  .screens p{color:var(--muted);font-size:17px;line-height:1.65;margin:16px 0 26px;font-weight:500}
  .screens ul{list-style:none;display:grid;gap:11px;margin-bottom:26px;text-align:left}
  .screens li{display:flex;gap:11px;font-weight:600;font-size:15.5px}
  .screens li::before{content:"✓";color:var(--green);font-weight:800}
  .screens-media{display:flex;justify-content:center}
  .screens-media .device{width:220px}

  /* ===== pricing ===== */
  .price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  @media(max-width:880px){.price-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:520px){.price-grid{grid-template-columns:1fr}}
  .price{background:#fff;border:1.5px solid var(--line);border-radius:22px;padding:30px 26px;position:relative;transition:transform .25s,box-shadow .25s}
  .price:hover{transform:translateY(-5px);box-shadow:0 30px 60px -28px rgba(11,22,38,.25)}
  .price.pop{border-color:var(--green);box-shadow:0 24px 54px -22px rgba(21,182,110,.4)}
  .price .badge{position:absolute;top:-13px;left:26px;background:var(--green);color:#fff;font-size:11px;font-weight:800;letter-spacing:.06em;padding:6px 13px;border-radius:100px}
  .price .t{font-size:13px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
  .price .amt{font-family:var(--display);font-size:38px;font-weight:800;margin:12px 0 2px;letter-spacing:-.02em}
  .price .per{color:var(--muted);font-size:13.5px;font-weight:600}
  .price .cr{margin:18px 0;font-weight:800;display:flex;align-items:center;gap:8px}
  .price .cr i{color:var(--green);font-style:normal}
  .price a{width:100%;justify-content:center}
  .free-note{text-align:center;color:var(--muted);margin-top:26px;font-size:15.5px;font-weight:600}
  .free-note b{color:var(--green-dark)}

  /* abonnements (Agent / Agence / Agence+) */
  .subs-pitch{text-align:center;color:var(--muted);font-weight:700;font-size:17.5px;font-style:italic;margin:-26px 0 42px}
  .subs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:70px}
  /* Marches sans abonnement : 4 packs de credits, pas 3 formules.
     Sans cette variante le 4e pack tombait seul a la ligne. */
  .subs-grid.packs4{grid-template-columns:repeat(4,1fr);gap:14px}
  @media(max-width:1040px){.subs-grid.packs4{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:880px){.subs-grid{grid-template-columns:1fr}}
  @media(max-width:560px){.subs-grid.packs4{grid-template-columns:1fr}}
  .price .mo{font-size:15px;color:var(--muted);font-weight:600;font-family:var(--font);letter-spacing:0}
  .price ul.fl{list-style:none;display:grid;gap:10px;margin:18px 0 22px}
  .price ul.fl li{display:flex;gap:9px;font-weight:600;font-size:14.5px;line-height:1.45}
  .price ul.fl li::before{content:"✓";color:var(--green);font-weight:800;flex:none}
  .packs-head{text-align:center;margin:0 0 28px}
  .packs-head h3{font-family:var(--display);font-size:26px;font-weight:800;letter-spacing:-.02em}
  .packs-head p{color:var(--muted);font-weight:500;margin-top:6px}
  .packs-strip{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
  .ppill{display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid var(--line);border-radius:100px;padding:11px 20px;font-weight:700;font-size:14.5px;transition:.2s}
  .ppill:hover{border-color:var(--green);transform:translateY(-2px);box-shadow:0 12px 28px -14px rgba(21,182,110,.5)}
  .ppill i{color:var(--green);font-style:normal}
  .ppill span{color:var(--green-dark)}
  .seat-box{background:var(--soft);border-radius:14px;padding:14px 16px;margin:4px 0 18px}
  .seat-row{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;font-weight:700;margin-bottom:10px;gap:10px}
  .seat-box input[type=range]{width:100%;accent-color:var(--green);cursor:pointer}
  /* Abonnement annuel : 11 mois payes, web uniquement (RevenueCat Web Billing). */
  /* Bascule Annuel / Mensuel et paliers de sieges — alignes sur le paywall de l'app. */
  .billing-switch{display:flex;gap:6px;background:var(--soft2);border-radius:100px;padding:5px;width:max-content;max-width:100%;margin:0 auto 24px}
  .billing-switch button{border:0;background:transparent;font-family:var(--font);font-weight:800;font-size:14px;color:var(--muted);padding:10px 18px;border-radius:100px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:.2s}
  .billing-switch button.on{background:var(--ink);color:#fff}
  .billing-switch em{font-style:normal;background:var(--green);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:100px}
  .amt s{color:var(--muted);font-weight:700;font-size:.58em;margin-right:8px}
  .annual .save{display:inline-block;background:var(--ink);color:#fff;font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:100px;margin-right:6px}
  .tiers{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .tiers button{flex:1 1 auto;min-width:44px;border:1px solid var(--line);background:#fff;font-family:var(--font);font-weight:800;font-size:14px;color:var(--ink);padding:10px 6px;border-radius:12px;cursor:pointer;transition:.2s}
  .tiers button.on{background:var(--green);border-color:var(--green);color:#fff}
  .bigteam{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;background:var(--soft);border-radius:14px;padding:14px 16px;margin:14px 0}
  .bigteam b{display:block;font-size:14.5px}
  .bigteam span{display:block;font-size:13px;color:var(--muted);max-width:48ch}
  .bigteam .btn{padding:10px 16px;font-size:14px;white-space:nowrap}
  .annual{margin:-4px 0 12px;font-size:13.5px;color:var(--muted);font-weight:600}
  .annual b{color:var(--ink);font-weight:800}
  .annual-note{text-align:center;font-size:13.5px;color:var(--muted);margin:16px 0 0}
  .seat-note{font-size:12px;color:var(--muted);margin-top:8px;font-weight:600}

  /* ===== faq ===== */
  .faq{max-width:780px;margin:0 auto}
  .qa{border-bottom:1px solid var(--line)}
  .qa summary{cursor:pointer;padding:24px 4px;font-weight:700;font-size:17.5px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
  .qa summary::-webkit-details-marker{display:none}
  .qa summary i{color:var(--green);transition:transform .25s;font-size:22px;font-style:normal;flex:none}
  .qa[open] summary i{transform:rotate(45deg)}
  .qa p{padding:0 4px 24px;color:var(--muted);font-size:16px;line-height:1.7;font-weight:500}

  /* ===== cta band ===== */
  .band{background:var(--ink);color:#fff;border-radius:36px;padding:80px 40px;text-align:center;position:relative;overflow:hidden}
  .band::before{content:"";position:absolute;inset:auto 0 0;height:60%;background:radial-gradient(60% 100% at 50% 100%,rgba(21,182,110,.35),transparent 70%)}
  .band>*{position:relative}
  .band h2{font-size:clamp(30px,4vw,50px)}
  .band p{color:#aebecc;font-size:19px;max-width:560px;margin:18px auto 32px;font-weight:500}
  .band .stores{justify-content:center}
  .band .store{background:#fff;color:var(--ink)}.band .store small{color:#6b7a8c}.band .store svg{fill:var(--ink)}

  footer{padding:64px 0 40px;color:var(--muted);font-size:14.5px;border-top:1px solid var(--line);background:var(--soft)}
  .foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1.2fr 1fr 1fr;gap:26px;margin-bottom:38px}
  @media(max-width:1000px){.foot-grid{grid-template-columns:1fr 1fr 1fr}}
  @media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}
  .foot-grid h4{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink);margin-bottom:16px;font-weight:800}
  .foot-grid a{display:block;margin-bottom:11px;font-weight:600}.foot-grid a:hover{color:var(--ink)}
  .foot-p{margin-top:14px;max-width:300px;line-height:1.6;font-weight:500}
  .foot-dir{color:var(--muted);font-weight:500}
  .foot-dir a{color:var(--muted);text-decoration:underline;text-underline-offset:3px}
  .foot-dir a:hover{color:var(--ink)}
  .foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-top:26px;font-weight:600}

  /* Bandeau de consentement cookies */
  #ck{position:fixed;left:18px;right:18px;bottom:18px;z-index:900;max-width:560px;margin:0 auto;
      background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;
      box-shadow:0 18px 50px rgba(11,22,38,.16);display:none;
      transform:translateY(14px);opacity:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s}
  #ck.in{transform:none;opacity:1}
  #ck p{font-size:14px;line-height:1.6;color:var(--muted);font-weight:500;margin-bottom:16px}
  #ck a{color:var(--green-dark);font-weight:700;text-decoration:underline}
  .ck-row{display:flex;gap:10px;flex-wrap:wrap}
  .ck-row button{flex:1 1 130px;border:0;cursor:pointer;font-family:var(--font);font-weight:700;
                 font-size:14.5px;padding:12px 18px;border-radius:12px;transition:.2s}
  #ckNo{background:var(--soft2);color:var(--ink)}#ckNo:hover{background:var(--line)}
  #ckOk{background:var(--green);color:#fff}#ckOk:hover{background:var(--green-dark)}
  @media(max-width:520px){#ck{left:12px;right:12px;bottom:12px;padding:18px}}

/* Selecteur de langue statique : la feuille d'origine ne stylait que des
   <button>. Ici ce sont de vrais liens, pour que Google les suive. */
.langs a,.langs span{font-family:var(--font);font-weight:800;font-size:12px;color:var(--muted);
  padding:6px 10px;border-radius:100px;line-height:1;white-space:nowrap;text-decoration:none;transition:.2s}
.langs a:hover{color:var(--ink)}
.langs .on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(11,22,38,.12)}
@media(max-width:980px){.langs a,.langs span{padding:6px 7px;font-size:11.5px}}