:root{--bg:#FFFFFF;--surface:#F8FAFC;--surface-2:#F1F5F9;--text:#0A0F1A;--text-mute:#64748B;--border:#E2E8F0;--brand-ink:#0A0F1A;--volt:#CCFF00;--volt-dim:#B3E600;--container:1120px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit}[hidden]{display:none !important}html[dir="rtl"] body{font-family:"Tajawal",-apple-system,"Segoe UI",sans-serif}.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.topbar-inner{max-width:var(--container);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:16px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-weight:800;letter-spacing:1px;font-size:18px}.lang-picker{margin-left:auto;display:flex;gap:4px}.lang-picker a{background:transparent;color:var(--text-mute);border:1px solid transparent;padding:4px 10px;font-size:13px;border-radius:999px;cursor:pointer;font-weight:600;text-decoration:none;transition:all 0.15s}.lang-picker a:hover{color:var(--text)}.lang-picker a[aria-current="page"]{background:var(--brand-ink);color:var(--volt);border-color:var(--brand-ink)}html[dir="rtl"] .lang-picker{margin-left:0;margin-right:auto}.topbar-cta{display:inline-block;padding:8px 16px;background:var(--brand-ink);color:var(--volt);font-weight:700;border-radius:999px;text-decoration:none;font-size:14px;transition:transform 0.15s}.topbar-cta:hover{transform:translateY(-1px)}main{max-width:var(--container);margin:0 auto;padding:0 24px}.hero{padding:64px 0 48px;text-align:center}.hero-eyebrow{display:inline-block;padding:6px 14px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:999px;font-size:13px;font-weight:600;margin-bottom:24px;letter-spacing:0.3px}.hero h1{font-size:clamp(40px,6vw,64px);line-height:1.15;margin:0 0 20px;font-weight:900;letter-spacing:-0.02em}.hero h1 .accent{background:var(--volt);color:var(--brand-ink);padding:0 14px;border-radius:10px;display:inline-block;box-decoration-break:clone;-webkit-box-decoration-break:clone}.hero p.lead{font-size:clamp(17px,2vw,20px);color:var(--text-mute);max-width:640px;margin:0 auto 36px}.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.btn{display:inline-block;padding:14px 28px;font-size:16px;font-weight:700;border-radius:999px;text-decoration:none;transition:transform 0.15s,box-shadow 0.15s;cursor:pointer;border:none}.btn-primary{background:var(--brand-ink);color:var(--volt);box-shadow:0 6px 20px rgba(10,15,26,0.18)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(10,15,26,0.28)}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--surface-2);border-color:#CBD5E1}.section{padding:56px 0;border-top:1px solid var(--border)}.section h2{font-size:clamp(28px,4vw,40px);margin:0 0 12px;font-weight:800;letter-spacing:-0.02em}.section .kicker{color:var(--brand-ink);font-size:12px;font-weight:800;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px;display:inline-block;padding:4px 10px;background:var(--volt);border-radius:4px}.section .desc{color:var(--text-mute);font-size:17px;max-width:640px;margin-bottom:40px}.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.step{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px}.step-num{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--brand-ink);color:var(--volt);font-weight:900;font-size:18px;margin-bottom:16px}.step h3{margin:0 0 8px;font-size:18px;font-weight:700;color:var(--text)}.step p{margin:0;color:var(--text-mute);font-size:15px}.pains{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.pain{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px}.pain-q{color:var(--text-mute);font-size:14px;margin-bottom:6px}.pain-a{color:var(--text);font-weight:600;font-size:17px;line-height:1.4}.cities{display:flex;flex-wrap:wrap;gap:10px}.city-chip{padding:10px 18px;background:var(--surface);border:1px solid var(--border);border-radius:999px;font-weight:600;font-size:14px;color:var(--text)}.city-chip.coming{color:var(--text-mute);border-style:dashed;background:transparent}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:32px}.stat-num{font-size:36px;font-weight:900;color:var(--brand-ink);letter-spacing:-0.03em}.stat-label{color:var(--text-mute);font-size:14px;margin-top:4px}.b2b{background:linear-gradient(135deg,var(--surface),var(--surface-2));border:1px solid var(--border);border-radius:20px;padding:40px;display:grid;gap:24px;grid-template-columns:1fr auto;align-items:center}.b2b h3{margin:0 0 8px;font-size:22px;font-weight:800;color:var(--text)}.b2b p{margin:0;color:var(--text-mute);font-size:15px;max-width:520px}@media (max-width:640px){.b2b{grid-template-columns:1fr}}.badges{display:flex;gap:12px;flex-wrap:wrap}.store-badge{display:inline-flex;align-items:center;gap:12px;padding:11px 20px;border-radius:14px;background:var(--brand-ink);color:#fff;text-decoration:none;line-height:1;transition:transform 0.15s,box-shadow 0.15s}.store-badge:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(10,15,26,0.22)}.store-badge svg{width:28px;height:28px;flex:none;fill:currentColor}.store-badge .b-txt{display:flex;flex-direction:column;gap:3px;text-align:left}.store-badge .b-small{font-size:11px;font-weight:500;opacity:0.85;letter-spacing:0.2px}.store-badge .b-big{font-size:17px;font-weight:600;letter-spacing:0.2px}.store-badge.soon{opacity:0.5;cursor:default;pointer-events:none}html[dir="rtl"] .store-badge .b-txt{text-align:right}footer{border-top:1px solid var(--border);padding:40px 0 64px;color:var(--text-mute);font-size:14px}.foot-row{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center}.foot-row a{color:var(--text-mute);text-decoration:none;transition:color 0.15s}.foot-row a:hover{color:var(--brand-ink)}.foot-copy{margin-left:auto;font-size:13px}html[dir="rtl"] .foot-copy{margin-left:0;margin-right:auto}@media (max-width:640px){.foot-copy{margin-left:0;width:100%}}.faq{max-width:760px;margin:0 auto}.faq .lead{color:var(--text-mute);font-size:17px;margin:0 0 32px}.faq details{border-top:1px solid var(--border);padding:18px 0}.faq details:last-of-type{border-bottom:1px solid var(--border)}.faq summary{font-weight:700;font-size:17px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--text)}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";color:var(--text-mute);font-weight:400;font-size:22px;line-height:1}.faq details[open] summary::after{content:"\2212"}.faq details p{color:var(--text-mute);font-size:16px;line-height:1.6;margin:12px 0 0}
/* Mobile topbar: brand + 5 lang chips + CTA overflow a phone viewport on one
   row, pushing "Ouvrir l'app" off-screen. Keep brand + CTA on the first row
   (CTA right-aligned) and wrap the language picker onto its own centered row. */
@media (max-width:640px){
  .topbar-inner{flex-wrap:wrap;padding:10px 16px;gap:8px}
  .brand{font-size:16px;letter-spacing:0.5px}
  .topbar-cta{order:1;margin-left:auto;padding:7px 14px;font-size:13px}
  .lang-picker{order:2;width:100%;margin-left:0;justify-content:center}
  html[dir="rtl"] .lang-picker{margin-right:0}
}
/* App Store / Google Play badges use the base .store-badge rules above. */
/* Footer social row. LinkedIn is live; FB/IG/TikTok are dimmed
   placeholders (.soc-soon) until those accounts exist. */
.foot-social{display:flex;gap:12px;align-items:center;margin-left:auto}
.foot-social a,.foot-social .soc-soon{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:11px;border:1px solid var(--border)}
.foot-social svg{width:21px;height:21px;fill:currentColor}
.foot-social a{color:var(--text-mute);background:var(--surface);transition:color 0.15s,border-color 0.15s,transform 0.15s}
.foot-social a:hover{color:var(--brand-ink);border-color:#CBD5E1;transform:translateY(-1px)}
.foot-social .soc-soon{color:#CBD5E1;background:transparent;border-style:dashed;cursor:default}
html[dir="rtl"] .foot-social{margin-left:0;margin-right:auto}
@media (max-width:640px){.foot-social{margin-left:0;width:100%;justify-content:center;order:1}}