:root{--ground:#F2F3F5;--surface:#fff;--surface-2:#F7F8FA;--ink:#12141A;--ink-2:#3B404C;--muted:#666D7B;--line:#E1E4EA;--accent:#0B8F7C;--accent-ink:#fff;--accent-soft:#DDF3EF;--sun:#E8A200;--display:'Bricolage Grotesque',system-ui,sans-serif;--body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--ground:#0C0E13;--surface:#14171E;--surface-2:#1A1E27;--ink:#ECEEF3;--ink-2:#C3C8D2;--muted:#8F97A6;--line:#242935;--accent:#2CC4AA;--accent-ink:#07231E;--accent-soft:rgba(44,196,170,.14)}}
:root[data-theme=dark]{--ground:#0C0E13;--surface:#14171E;--surface-2:#1A1E27;--ink:#ECEEF3;--ink-2:#C3C8D2;--muted:#8F97A6;--line:#242935;--accent:#2CC4AA;--accent-ink:#07231E;--accent-soft:rgba(44,196,170,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}img{max-width:100%;height:auto}h1,h2,h3{font-family:var(--display);letter-spacing:-.01em;line-height:1.15;margin:0 0 .5em}h1{font-size:clamp(32px,5vw,52px);font-weight:800}h2{font-size:clamp(24px,3.2vw,34px);font-weight:800}h3{font-size:20px;font-weight:700}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
header.top{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--ground) 86%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:18px;height:64px}.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:20px;color:var(--ink);text-decoration:none}.brand span{width:32px;height:32px;border-radius:9px;background:var(--ink);color:var(--ground);display:grid;place-items:center;font-size:17px}
.nav nav{display:flex;gap:18px;margin-left:auto;align-items:center}.nav nav a{color:var(--ink-2);text-decoration:none;font-weight:600;font-size:15px}.nav nav a:hover{color:var(--ink)}
.lang{border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:13px;font-weight:700;color:var(--ink-2)!important}.lang+.lang{margin-left:-10px}
.btn{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:13px 22px;border-radius:14px;font-weight:700;text-decoration:none;font-size:16px;border:1px solid var(--line);color:var(--ink);background:var(--surface)}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn-dark{background:var(--ink);border-color:var(--ink);color:var(--ground)}
.hero{padding:64px 0 32px;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}.hero p.lead{font-size:20px;color:var(--ink-2);max-width:560px}.hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 10px}.hero .note{font-size:14px;color:var(--muted)}
.trust{display:flex;gap:22px;flex-wrap:wrap;color:var(--muted);font-size:14px;padding:12px 0 40px}.trust span::before{content:'✓ ';color:var(--accent);font-weight:800}
section.block{padding:56px 0}section.alt{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}.card .ic{width:52px;height:52px;border-radius:14px;background:var(--accent-soft);display:grid;place-items:center;margin-bottom:12px}.card .ic img{width:34px}
.card h3{margin-top:0}.card p{margin:0;color:var(--ink-2);font-size:15.5px}
.steps{counter-reset:s}.steps .card{position:relative;padding-left:70px}.steps .card::before{counter-increment:s;content:counter(s);position:absolute;left:22px;top:22px;width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--ground);display:grid;place-items:center;font-family:var(--display);font-weight:800}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.plan{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:10px}.plan.hi{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.plan .price{font-family:var(--display);font-size:38px;font-weight:800}.plan .price small{font-size:14px;font-weight:600;color:var(--muted)}.plan ul{margin:0;padding-left:18px;color:var(--ink-2);font-size:15px}.plan .btn{margin-top:auto;justify-content:center}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin-bottom:10px}.faq summary{font-weight:700;cursor:pointer}.faq p{color:var(--ink-2);margin:10px 0 0}
article.post{max-width:760px;margin:0 auto;padding:48px 16px}article.post h2{margin-top:36px}article.post p,article.post li{color:var(--ink-2)}article.post .meta{color:var(--muted);font-size:14px}
.callout{background:var(--accent-soft);border-radius:18px;padding:26px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.callout b{font-family:var(--display);font-size:22px}
footer{padding:40px 0;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}footer .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}footer a{color:var(--ink-2);text-decoration:none;display:block;margin:4px 0}footer b{color:var(--ink);display:block;margin-bottom:6px}
.pill{display:inline-block;background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:4px 10px;font-size:13px;font-weight:700}

/* ── SaaS hero ── */
.hero-wrap{position:relative;overflow:hidden;background:#0B0D12;color:#fff;isolation:isolate}
.hero-wrap::before{content:'';position:absolute;inset:-20% -10% auto;height:120%;background:radial-gradient(40% 45% at 20% 20%,rgba(11,143,124,.45),transparent 70%),radial-gradient(35% 40% at 85% 15%,rgba(232,162,0,.28),transparent 70%),radial-gradient(50% 50% at 60% 90%,rgba(44,196,170,.18),transparent 70%);z-index:-1;filter:blur(20px)}
.hero-wrap::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent);z-index:-1}
.hero-wrap .hero{padding:72px 0 40px}.hero-wrap p.lead{max-width:500px}.hero-wrap h1{color:#fff}.hero-wrap p.lead{color:#B9C0CC}.hero-wrap .note{color:#8F97A6}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#DDE3EC;border-radius:999px;padding:6px 12px 6px 6px;font-size:13px;font-weight:600;margin-bottom:18px}.eyebrow i{background:var(--accent);color:#fff;border-radius:999px;padding:2px 8px;font-style:normal;font-size:12px;font-weight:800}
.hero-wrap .btn{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff}.hero-wrap .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 10px 30px -10px rgba(11,143,124,.8)}
.hero-wrap .trust{color:#A6AEBC;border-top:1px solid rgba(255,255,255,.08);padding-top:22px}.hero-wrap .trust span::before{color:#2CC4AA}

/* Scène : iPhone + cartes Wallet */
.phone-scene{position:relative;height:700px}
.iphone{position:absolute;right:-6px;top:40px;width:302px;height:624px;border-radius:54px;background:linear-gradient(160deg,#2B2E35,#0E1014 40%,#1A1D23);padding:11px;z-index:2;box-shadow:0 0 0 1.5px #4A4E58,0 0 0 3px #101215,0 60px 100px -30px rgba(0,0,0,.95),0 20px 40px -20px rgba(0,0,0,.8)}
.iphone::before,.iphone::after{content:'';position:absolute;background:#2B2E35;border-radius:2px;left:-5px;width:3px}
.iphone::before{top:112px;height:30px;box-shadow:0 46px 0 #2B2E35,0 100px 0 #2B2E35}.iphone::after{top:0;height:0}
.iphone .pwr{position:absolute;right:-5px;top:180px;width:3px;height:74px;background:#2B2E35;border-radius:2px}
.iphone .screen{position:relative;height:100%;border-radius:44px;overflow:hidden;background:#000;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.island{position:absolute;left:50%;top:11px;transform:translateX(-50%);width:98px;height:29px;border-radius:20px;background:#000;z-index:6;box-shadow:inset 0 0 0 1px #0d0d0d}.island::after{content:'';position:absolute;right:9px;top:9px;width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#1d2a3a,#05070a 70%)}
.sbar{position:absolute;top:15px;left:0;right:0;display:flex;justify-content:space-between;padding:0 30px 0 34px;font-size:14.5px;font-weight:700;color:#fff;z-index:5;font-family:-apple-system,'Instrument Sans',sans-serif;letter-spacing:-.01em}
.sbar svg{height:12px;width:auto;vertical-align:-1px;margin-left:5px}
.wallet-head{position:absolute;top:56px;left:20px;right:20px;display:flex;justify-content:space-between;align-items:center;color:#fff;font-family:-apple-system,'Instrument Sans',sans-serif;z-index:3}.wallet-head b{font-size:31px;font-weight:800;letter-spacing:-.02em}.wallet-head i{width:28px;height:28px;border-radius:50%;background:#1c1c1e;color:#fff;display:grid;place-items:center;font-style:normal;font-size:20px;line-height:1}
.stack{position:absolute;top:112px;left:14px;right:14px;bottom:0}
.stack .pass{position:absolute;left:0;right:0}.stack .p1{top:0}.stack .p2{top:60px}.stack .p3{top:120px}
.pass{border-radius:13px;background:var(--bg);color:var(--fg);font-family:-apple-system,'SF Pro Text','Instrument Sans',system-ui,sans-serif;box-shadow:0 -6px 22px rgba(0,0,0,.45),0 10px 24px -10px rgba(0,0,0,.6);overflow:hidden;position:relative;background-image:linear-gradient(165deg,rgba(255,255,255,.14),rgba(255,255,255,0) 45%)}
.pass .ph{display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:12px;min-height:46px}
.pass .plogo{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;flex:none}.pass .plogo img{width:19px;height:19px}
.pass .ph b{font-size:12.5px;font-weight:700;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pass .pf{display:flex;flex-direction:column;font-size:12.5px;font-weight:600;min-width:0;line-height:1.25}.pass .pf small{font-size:8.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--lb);margin-bottom:1px}
.pass .ph .pf{margin-left:auto;text-align:right;align-items:flex-end;flex:none}
.pass .pstrip{position:relative;height:86px;background:radial-gradient(70% 110% at 88% 50%,rgba(255,255,255,.28),transparent 70%),linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,0) 60%);overflow:hidden;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(0,0,0,.12)}
.pass .pstrip img{position:absolute;right:16px;top:50%;width:70px;height:70px;transform:translateY(-50%) rotate(-10deg);filter:drop-shadow(0 10px 12px rgba(0,0,0,.4))}
.pass .pstrip .pf{position:absolute;left:12px;bottom:9px;text-shadow:0 1px 2px rgba(0,0,0,.25)}.pass .pstrip .pf span{font-size:19px;font-weight:700;letter-spacing:-.01em}
.pass .prow{display:flex;justify-content:space-between;gap:8px;padding:10px 12px 2px}.pass .prow .pf:last-child{text-align:right;align-items:flex-end}
.pass .pqr{margin:10px 12px 12px;background:#fff;border-radius:9px;padding:8px 8px 5px;display:flex;flex-direction:column;align-items:center;gap:3px}.pass .pqr img{width:76px;height:76px;image-rendering:pixelated}.pass .pqr small{font-size:8.5px;color:#444;letter-spacing:.06em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.fan{position:absolute;inset:0;z-index:1}.fan .pass{position:absolute;width:252px;transform-origin:50% 100%}
.fan .fa{left:10px;bottom:30px;transform:rotate(-13deg) scale(.86)}.fan .fb{left:70px;bottom:56px;transform:rotate(-5deg) scale(.9);z-index:1}
.fan .pass::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,rgba(0,0,0,.35))}
.float{position:absolute;z-index:3;background:var(--surface);color:var(--ink);border-radius:16px;padding:12px 14px;box-shadow:0 20px 40px -18px rgba(0,0,0,.6);display:flex;gap:10px;align-items:center;font-size:14px;font-weight:600;border:1px solid var(--line)}
.float img{width:34px;height:34px}.float small{display:block;color:var(--muted);font-weight:500;font-size:12px}
.float.f1{right:-20px;top:0;animation:bob 6s ease-in-out infinite}.float.f2{right:-16px;bottom:0;animation:bob 7s ease-in-out infinite 1s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.logos{padding:26px 0 8px}.logos p{text-align:center;color:var(--muted);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
.marquee{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}.marquee span{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:8px 14px 8px 8px;font-weight:600;font-size:14px}.marquee img{width:26px;height:26px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}.stat b{font-family:var(--display);font-size:38px;font-weight:800;display:block;line-height:1;color:var(--accent)}.stat span{color:var(--ink-2);font-size:14px}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}.bento .card{grid-column:span 2}
.shot-wrap{background:linear-gradient(135deg,#0B0D12,#1A1F2B);border-radius:24px;padding:28px;box-shadow:0 40px 80px -40px rgba(0,0,0,.7)}.shot-wrap .bar{display:flex;gap:6px;margin-bottom:14px}.shot-wrap .bar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.18)}.shot-wrap img{border-radius:12px;width:100%;display:block}
@media(max-width:1000px){.fan .fa{left:0}.fan .fb{left:50px}.float.f1{right:0}.float.f2{right:0}}
@media(max-width:860px){.stats,.bento{grid-template-columns:1fr 1fr}.bento .card{grid-column:span 2}.hero{grid-template-columns:1fr;padding-top:36px}.phone-scene{height:600px;margin:0 -16px}.iphone{left:50%;right:auto;top:30px;transform:translateX(-50%) scale(.88);transform-origin:top center}.fan{display:none}.float.f1{display:none}.float.f2{right:8px;bottom:10px}.grid,.plans,.grid-2{grid-template-columns:1fr}footer .cols{grid-template-columns:1fr 1fr}.nav nav a:not(.lang):not(.btn){display:none}.nav nav{gap:8px}.nav{gap:10px}.brand{font-size:18px}}