/* Teslaremyx — reprise fidèle du design de l'ancien site (Tailwind CDN : zinc-950, rouge #E82127, Space Grotesk + Inter,
   cartes rounded-3xl, ombres, grille fine), réécrite à la main en CSS local : aucun framework ni CDN.
   Polices Inter et Space Grotesk auto-hébergées (sous-ensemble latin, licence SIL OFL 1.1). */
@font-face{font-family:"Inter";font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500 700;font-display:swap;src:url(/fonts/space-grotesk-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
 /* palette Tailwind « zinc » de l'ancien site */
 --z950:#09090b;--z900:#18181b;--z800:#27272a;--z700:#3f3f46;--z500:#71717a;--z400:#a1a1aa;--z300:#d4d4d8;--z200:#e4e4e7;
 --line:rgba(255,255,255,.1);--line2:rgba(255,255,255,.2);--line3:rgba(255,255,255,.3);
 --red:#E82127;--red-h:#c8102e;--red-t:#ef4444;--red-l:#f87171;--red-a:rgba(232,33,39,.1);--red-b:rgba(232,33,39,.3);
 --em:#34d399;--em-a:rgba(16,185,129,.1);--amber:#fbbf24;
 --rad:24px;--rad2:16px;--max:1536px;
 --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 --display:"Space Grotesk","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
 --shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);           /* .modern-shadow */
 --shadow-c:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);        /* .tesla-card:hover */
 --shadow-d:0 25px 50px -12px rgba(0,0,0,.5);
 --sh-red:0 10px 15px -3px rgba(239,68,68,.4),0 4px 6px -4px rgba(239,68,68,.4);   /* shadow-lg shadow-red-500/40 */
 --sh-red-xl:0 20px 25px -5px rgba(239,68,68,.3),0 8px 10px -6px rgba(239,68,68,.3);/* shadow-xl shadow-red-500/30 */
 --ease:cubic-bezier(.4,0,.2,1)
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:110px;scroll-behavior:smooth}
body{margin:0;background:var(--z950);color:#fff;font:16px/1.5 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;height:auto;display:block}
a{color:var(--red-t);text-underline-offset:3px;text-decoration-thickness:1px;transition:color .2s ease}
a:hover{color:var(--red-l)}
:focus-visible{outline:2px solid var(--red-t);outline-offset:3px;border-radius:6px}
::selection{background:var(--red);color:#fff}
h1,h2,h3{font-weight:700;line-height:1.15;letter-spacing:-.025em;margin:1.6em 0 .55em;color:#fff}
h1{font-family:var(--display);font-weight:600;font-size:clamp(2.25rem,4.6vw,3.6rem);line-height:1;letter-spacing:-.05em;margin-top:.35em}
h2{font-size:clamp(1.6rem,3vw,2rem);letter-spacing:-.04em}
h3{font-size:1.25rem;font-weight:600;letter-spacing:-.015em}
p,ul,ol{margin:0 0 1.05em}
li{margin:.3em 0}
strong{color:#fff;font-weight:600}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;padding:.12em .45em;border-radius:8px;font-size:.84em;word-break:normal;overflow-wrap:anywhere}
table{width:100%;border-collapse:collapse;margin:0;font-size:.94rem}
th,td{border-bottom:1px solid var(--line);padding:.8em 1em;text-align:left;vertical-align:top}
th{background:var(--z800);font-weight:600;color:#fff;font-size:.86rem}
tbody tr:nth-child(even) td{background:rgba(255,255,255,.02)}
tbody tr:hover td{background:rgba(232,33,39,.05)}
tr:last-child td{border-bottom:0}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--rad2);background:var(--z900);margin:0 0 1.4em;display:flow-root}
.content>table{border:1px solid var(--line);border-radius:var(--rad2);overflow:hidden;margin-bottom:1.4em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 48px}
.skip{position:absolute;left:-999px;top:0;background:var(--red);color:#fff;padding:.6em 1em;z-index:100;border-radius:12px}
.skip:focus{left:10px;top:10px}
.small{font-size:.875rem;color:var(--z400)}
.center{text-align:center}
.mut{color:var(--z400)}
.or,.red{color:var(--red)}
.em{color:var(--em)}

/* ---------- En-tête (nav fixe bg-zinc-950/95, backdrop-blur-lg, border-b white/10, px-8 py-5) ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(9,9,11,.95);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.site-header .wrap{padding:0 32px}
.hdr{display:flex;align-items:center;gap:12px;min-height:80px}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto;color:#fff;text-decoration:none}
.brand:hover{color:#fff}
.brand-ico{width:40px;height:40px;border-radius:16px;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 15px -3px rgba(239,68,68,.3),0 4px 6px -4px rgba(239,68,68,.3);flex:0 0 auto}
.brand-ico img{width:100%;height:100%}
.brand-txt{font-family:var(--display);font-weight:600;font-size:1.875rem;line-height:1;letter-spacing:-.05em}
.main-nav{margin:0 auto}
.main-nav ul{list-style:none;display:flex;align-items:center;gap:40px;margin:0;padding:0}
.main-nav li{margin:0}
.main-nav a{display:block;color:var(--z300);text-decoration:none;font-weight:500;font-size:.875rem;transition:color .2s ease}
.main-nav a:hover{color:var(--red)}
.main-nav a[aria-current]{color:#fff}
.main-nav .nav-mob{display:none}
.hdr-copy{margin-left:0}
.disclaimer-top{margin:0;text-align:center;font-size:.72rem;color:var(--z500);background:rgba(0,0,0,.35);padding:3px 10px;border-top:1px solid rgba(255,255,255,.05)}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:16px;background:transparent;cursor:pointer;padding:14px 12px;flex-direction:column;justify-content:space-between;color:rgba(255,255,255,.8);transition:border-color .2s}
.burger:hover{border-color:var(--line2)}
.burger span{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform .25s var(--ease),opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---------- Boutons (.tesla-btn + contour white/20, rounded-3xl) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font:inherit;font-weight:600;letter-spacing:-.01em;text-decoration:none;border-radius:var(--rad);padding:.9em 1.75em;cursor:pointer;border:1px solid transparent;white-space:nowrap;line-height:1.25;transition:all .3s var(--ease)}
.btn svg{flex:0 0 auto;transition:transform .2s var(--ease)}
.btn-primary{background:var(--red);color:#fff;box-shadow:var(--sh-red)}
.btn-primary:hover{background:var(--red-h);color:#fff;transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(232,33,39,.3)}
.btn-primary:active svg:last-child{transform:translateX(2px)}
.btn-primary:active{transform:scale(.985)}
.btn-ghost{background:transparent;color:#fff;border-color:var(--line2)}
.btn-ghost:hover{background:rgba(255,255,255,.05);color:#fff}
.btn-ghost:active{transform:scale(.985)}
.btn-sm{padding:.72em 1.4em;font-size:.875rem}
.hdr-copy{padding:.66em 1.25em}
.hdr-cta{padding:.82em 1.75em}
.hdr-copy svg{width:14px;height:14px}
.btn-lg{padding:17px 36px;font-size:1.125rem}
.btn-ghost.btn-lg{padding:17px 32px;font-size:1rem}
.btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:1.1em 0}

/* ---------- Éléments communs ---------- */
.pill{display:inline-block;background:rgba(255,255,255,.05);border-radius:999px;padding:.3em 1.15em;font-size:.75rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#fff;margin:0 0 1em}
.pill-live{display:inline-flex;align-items:center;gap:.55em;border:1px solid var(--line);padding:.42em 1.1em;font-size:.875rem;letter-spacing:.5px;color:var(--em);margin-bottom:24px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--em);animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}
@keyframes pulse{50%{opacity:.5}}
.kicker{display:block;color:var(--red-t);font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:.75rem;margin:0 0 .5em}
.grid-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px}
.ico{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:var(--rad2);background:var(--red-a);color:var(--red);flex:0 0 auto}
.ico svg{width:28px;height:28px;transition:transform .3s ease}
.ico-em{background:var(--em-a);color:var(--em)}
.section-header,.sec-head h2,.sec-head-split h2{font-family:var(--font);font-size:clamp(2.3rem,9vw,2.75rem);line-height:1.1;font-weight:700;letter-spacing:-.05em;margin:0}

/* ---------- Accueil ---------- */
.home-hero{position:relative;overflow:hidden;padding:20px 0 64px}
.hero{display:grid;grid-template-columns:7fr 5fr;gap:32px;align-items:center}
.hero-txt{padding-top:16px}
.hero h1{font-size:clamp(3rem,5.65vw,4.5rem);line-height:.95;letter-spacing:-.05em;margin:0 0 24px}
.hero h1 .red{color:var(--red)}
.hero .lead{font-size:1.25rem;line-height:1.4;color:var(--z400);max-width:36rem;margin:0 0 28px}
.hero .lead strong{color:#fff}
.hero .btn-row{margin:0 0 24px}
.hero-link{font-size:.95rem;color:var(--z300);margin:0 0 .4em}
.hero-link+.small{margin:0 0 24px;max-width:36rem}
.hero-trust{display:flex;align-items:center;gap:20px;font-size:.875rem;color:var(--z400);margin:0;max-width:38rem}
.hero-trust img{width:28px;height:28px;border-radius:50%;border:1px solid var(--line2);flex:0 0 auto}
.hero-trust .av{display:flex;flex:0 0 auto}
.hero-trust .av img+img{margin-left:-8px}
.hero-visual{position:relative;margin:0}
.hero-visual .frame{position:relative;aspect-ratio:16/10;border-radius:var(--rad);overflow:hidden;border:1px solid var(--line);background:var(--z900);box-shadow:var(--shadow)}
.hero-visual .frame img{width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.badge-float{position:absolute;display:flex;align-items:center;gap:.5em;margin:0}
.badge-tr{top:20px;right:20px;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:var(--rad2);padding:8px 16px;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.badge-tr svg{color:var(--em)}
.badge-bl{left:-24px;bottom:-20px;flex-direction:column;align-items:flex-start;gap:0;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:14px 20px;box-shadow:var(--shadow);font-weight:600;color:#fff;line-height:1.5}
.badge-bl .k{color:var(--em);font-size:.75rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(24,24,27,.5)}
.trust ul{list-style:none;margin:0;padding:20px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.trust li{display:flex;align-items:center;gap:.75em;margin:0;font-size:.875rem;color:var(--z400)}
.trust li strong{color:#fff;font-weight:600}
.trust li:first-child{color:#fff;font-weight:500}
.trust .sep{width:1px;height:16px;background:var(--line2);padding:0}
.trust svg{color:var(--em);flex:0 0 auto}
.band{position:relative;padding:80px 0 64px}
.band-alt{background:var(--z900);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:64px 0}
.sec-head{text-align:center;max-width:860px;margin:0 auto 56px}
.sec-head>p:not(.pill){font-size:1.25rem;line-height:1.4;color:var(--z400);margin:16px auto 0;max-width:28rem}
.sec-head-split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px;margin-bottom:40px}
.sec-head-split p{color:var(--z400);max-width:24rem;margin:0}
/* deux cartes « pour toi / pour moi » */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1024px;margin:0 auto}
.tcard{background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:36px;transition:all .3s var(--ease)}
.tcard:hover,.mcard:hover,.step:hover,.stat:hover,.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-c)}
.tcard:hover .ico svg,.card:hover .ico svg{transform:scale(1.1)}
.tcard-head{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.tcard-head .kicker{margin:0;letter-spacing:1.5px}
.tcard-head .kicker.em{color:var(--em)}
.tcard-head h3{margin:0;font-size:1.875rem;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.tlist{list-style:none;margin:0;padding:0;font-size:.9375rem}
.tlist li{display:flex;gap:16px;margin:0 0 16px}
.tlist svg{flex:0 0 auto;margin-top:3px;color:var(--red)}
.tlist.em svg{color:var(--em)}
.tlist div>strong{display:block}
.tlist span{color:var(--z400);font-size:.875rem}
.tnote{margin:32px 0 0;padding-top:24px;border-top:1px solid var(--line);font-size:.75rem;color:var(--z500)}
.duo-after{text-align:center;margin:32px auto 0;font-size:.875rem;color:var(--z400);max-width:30rem}
/* étapes */
.steps{list-style:none;counter-reset:st;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:0 auto;padding:0;max-width:1152px}
.step{counter-increment:st;background:var(--z950);border:1px solid var(--line);border-radius:var(--rad);padding:28px;margin:0;text-align:center;transition:all .3s var(--ease)}
.step::before{content:counter(st);display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0 auto 24px;border-radius:var(--rad2);background:rgba(255,255,255,.05);font-family:var(--display);font-weight:700;font-size:2.25rem;line-height:1;color:var(--red);transition:background-color .2s}
.step:hover::before{background:var(--red-a)}
.step h3{margin:0 0 12px;font-size:1.25rem;font-weight:600;letter-spacing:0}
.step p{color:var(--z400);font-size:.9375rem;margin:0}
.step code{white-space:nowrap;font-size:.7em}
.after-steps{text-align:center;margin:40px auto 16px;color:var(--z400);max-width:52rem}
.red-link{display:inline-flex;align-items:center;gap:.5em;font-size:.875rem;font-weight:600;color:var(--red-t);text-decoration:none}
.red-link:hover{color:var(--red-l)}
/* cartes modèles / guides avec photo */
.mcards{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;list-style:none;margin:0;padding:0}
.mcard{position:relative;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;margin:0;transition:all .3s var(--ease);display:flex;flex-direction:column}
.mcard .ph{position:relative;height:192px;background:var(--z800);overflow:hidden}
.mcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.mcard:hover .ph img{transform:scale(1.05)}
.mcard .tag{position:absolute;top:16px;right:16px;background:rgba(0,0,0,.7);font-size:.75rem;font-weight:500;padding:4px 12px;border-radius:999px;color:#fff;text-transform:uppercase;margin:0}
.mcard .bd{padding:24px;display:flex;flex-direction:column;flex:1}
.mcard h3{margin:0;font-size:1.5rem;font-weight:600;letter-spacing:-.01em}
.mcard h3 a{color:#fff;text-decoration:none}
.mcard h3 a::after{content:"";position:absolute;inset:0}
.mcard .sub{color:var(--em);font-size:.875rem;font-weight:500;margin:0}
.mcard .sub.am{color:var(--amber)}
.mcard p.txt{margin:12px 0 0;font-size:.875rem;color:var(--z400)}
.mcard .more{margin-top:auto;padding-top:20px;font-size:.875rem;font-weight:600;color:var(--red-t)}
.mcard:hover .more{text-decoration:underline}
.more-links{margin:28px 0 0;color:var(--z400);font-size:.95rem}
/* chiffres */
.split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:48px;align-items:center}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin:0 0 16px}
.content .stats,.stats-4{grid-template-columns:repeat(4,1fr)}
.stat{background:var(--z950);border:1px solid var(--line);border-radius:var(--rad);padding:28px;transition:all .3s var(--ease)}
.stat .num{display:block;font-family:var(--display);font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;letter-spacing:-.04em;line-height:1.1;color:var(--red);font-variant-numeric:tabular-nums;margin-bottom:.3em}
.stat span:last-child{color:var(--z300);font-size:.95rem;line-height:1.4;display:block}
.content .stat{background:var(--z900)}
.photo-card{position:relative;margin:0;border-radius:var(--rad);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--z800)}
.photo-card img{width:100%;height:auto}
.photo-card figcaption{position:absolute;left:16px;right:16px;bottom:16px;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:var(--rad2);padding:10px 16px;font-size:.875rem;color:var(--z200);line-height:1.4}
.photo-card figcaption strong{display:block;color:var(--em);font-size:.75rem;letter-spacing:1px;text-transform:uppercase}
/* actus */
.actus{list-style:none;padding:0;margin:0 0 1em;display:grid;gap:12px}
.actus li{margin:0;padding:18px 24px;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);transition:all .3s var(--ease)}
.actus li:hover{transform:translateY(-4px);box-shadow:var(--shadow-c)}
.band-alt .actus li{background:var(--z950)}
.actus a{color:#fff;font-weight:600;text-decoration:none;line-height:1.4}
.actus a:hover{color:var(--red-t)}
.actus .meta{display:block;color:var(--z400);font-size:.8rem;margin-top:.35em}
/* FAQ accueil */
.faq-home{max-width:768px;margin:0 auto}
.faq-home .sec-head{margin-bottom:40px}
.faq-home .sec-head>p:not(.pill){font-size:1rem;margin-top:8px;max-width:none}
/* À propos */
.about-card{background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:clamp(36px,5vw,56px);display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:center}
.about-photo{aspect-ratio:1/1;max-width:280px;width:100%;border-radius:var(--rad);overflow:hidden;border:1px solid var(--line);background:var(--z800);margin:0}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.about-card h2{font-family:var(--display);font-size:2.25rem;font-weight:600;letter-spacing:-.05em;margin:0 0 20px}
.about-card p{color:var(--z300)}
.chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.chip{display:inline-flex;align-items:center;gap:.5em;padding:10px 20px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:var(--rad);color:#fff;text-decoration:none;font-size:.875rem;font-weight:500;transition:background-color .2s}
.chip:hover{background:rgba(255,255,255,.1);color:#fff}
/* appel final */
.home-cta{border-top:1px solid var(--line);background:var(--z950);padding:64px 0}
.home-cta .cta-box{background:none;border:0;box-shadow:none;padding:0;margin:0 auto;max-width:1000px}
.home-cta .cta-box::before{display:none}
.home-cta .cta-title{font-size:clamp(2.6rem,6vw,3.75rem);line-height:1;letter-spacing:-.05em;max-width:none;margin-bottom:16px}
.home-cta .cta-box>p:not(.cta-title):not(.small){font-size:1.25rem;line-height:1.4;color:var(--z400);max-width:34rem}
.home-cta .btn-row{gap:16px;margin:32px 0 24px}
.home-cta .btn-primary{padding:16px 40px;font-size:1.125rem;box-shadow:var(--sh-red-xl)}
.home-cta .btn-ghost{padding:16px 32px;border-color:var(--line3)}
.home-cta .small{font-size:.75rem;color:var(--z500)}

/* ---------- Pages de contenu ---------- */
main.page{position:relative}
.page-glow{position:absolute;left:0;right:0;top:0;height:520px;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse 55% 70% at 85% 0%,rgba(232,33,39,.10),transparent 65%);-webkit-mask-image:linear-gradient(#000 40%,transparent);mask-image:linear-gradient(#000 40%,transparent)}
.page-glow::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px}
.wrap-page{position:relative;max-width:1240px;display:grid;grid-template-columns:minmax(0,780px) 300px;justify-content:space-between;column-gap:56px;padding-bottom:16px}
.wrap-page>.crumbs{grid-column:1/-1}
.wrap-page>.content{grid-column:1;min-width:0}
.wrap-page>.side{grid-column:2;grid-row:2/span 2}
.wrap-page>.related{grid-column:1}
.wrap-page.no-side{grid-template-columns:minmax(0,820px);justify-content:center}
.content{line-height:1.7;font-size:1.03rem}
.content>h2{padding-top:.1em}
.content>h2::before{content:"";display:block;width:40px;height:3px;border-radius:3px;background:var(--red);margin-bottom:.7em}
.content>h3{margin-top:1.4em}
.content p,.content li{color:var(--z300)}
.content>p:first-of-type{font-size:1.15rem;line-height:1.6;color:var(--z200)}
.content>ul:not(.links):not(.cards):not(.actus):not(.acc){list-style:none;padding:0;display:flow-root}
.content>ul:not(.links):not(.cards):not(.actus):not(.acc)>li{position:relative;padding-left:1.9em;margin:.55em 0}
.content>ul:not(.links):not(.cards):not(.actus):not(.acc)>li::before{content:"";position:absolute;left:.1em;top:.42em;width:1.05em;height:1.05em;border-radius:50%;background:var(--em-a) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2334d399' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/62% no-repeat}
.content>ol{list-style:none;counter-reset:li;padding:0;display:flow-root}
.content>ol>li{counter-increment:li;position:relative;padding:.1em 0 .1em 2.75em;margin:.8em 0;min-height:2em}
.content>ol>li::before{content:counter(li);position:absolute;left:0;top:.05em;width:2em;height:2em;border-radius:12px;background:rgba(255,255,255,.05);color:var(--red);font-family:var(--display);font-weight:700;font-size:.9em;display:flex;align-items:center;justify-content:center}
.crumbs ol{list-style:none;display:inline-flex;flex-wrap:wrap;align-items:center;gap:.35em;padding:.4em 1.1em;margin:36px 0 0;font-size:.8rem;color:var(--z400);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px}
.crumbs li{margin:0}
.crumbs li+li::before{content:"›";margin-right:.35em;color:var(--z500)}
.crumbs a{color:var(--z400);text-decoration:none}
.crumbs a:hover{color:var(--red)}
.crumbs [aria-current]{color:#fff}
.byline{display:flex;align-items:center;gap:.75em;color:var(--z400);font-size:.875rem;margin:-.1em 0 1.6em;padding-bottom:1.4em;border-bottom:1px solid var(--line);line-height:1.5}
.byline .avatar{width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);flex:0 0 auto}
.byline a{color:#fff;font-weight:600;text-decoration:none}
.byline a:hover{color:var(--red)}
.fig{margin:1.8em 0}
.fig img{border-radius:var(--rad);background:var(--z800);border:1px solid var(--line);box-shadow:var(--shadow)}
.fig figcaption{font-size:.84rem;color:var(--z500);margin-top:.7em;padding-left:.2em;line-height:1.5}
.fig.portrait{max-width:380px}
.fig.portrait img{width:100%}
.note{position:relative;background:var(--z900);border:1px solid var(--line);border-left:3px solid var(--red);padding:16px 20px 16px 52px;border-radius:var(--rad2);margin:1.4em 0;color:var(--z300);display:flow-root}
.note::before{content:"i";position:absolute;left:16px;top:17px;width:22px;height:22px;border-radius:50%;background:var(--red-a);color:var(--red-t);font:700 .8rem/22px var(--display);text-align:center}
.note p:last-child{margin:0}
.ref-card{position:relative;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:24px 28px;margin:24px 0;box-shadow:var(--shadow);display:flow-root}
.ref-card::before{content:"";position:absolute;left:28px;right:28px;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--red),transparent)}
.ref-card p{margin:.35em 0}
.ref-card .btn-row{margin:.9em 0}
.cta-box{position:relative;overflow:hidden;clear:both;text-align:center;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:clamp(28px,5vw,48px) clamp(22px,5vw,44px);margin:2.6em 0;box-shadow:var(--shadow)}
.cta-box::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px}
.cta-box>*{position:relative}
.cta-title{font-family:var(--display);font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.08;letter-spacing:-.05em;font-weight:600;color:#fff;margin:0 auto .45em;max-width:20em}
.cta-box>p{max-width:36em;margin-left:auto;margin-right:auto;color:var(--z300)}
.cta-box .btn-row{justify-content:center;margin:1.4em 0}
.cta-box .small{margin:0 auto}
.qr{background:#fff;color:#000;display:inline-block;padding:16px;border-radius:var(--rad);margin:1em 0;max-width:290px;box-shadow:var(--shadow)}
.qr img{width:225px;height:225px}
.qr figcaption{font-size:.8rem;margin-top:8px;line-height:1.45}
.qr code{background:#f1f1f1;border-color:#ddd;color:#000;white-space:nowrap;word-break:normal;font-size:.74em}
.faq{margin:1.2em 0;display:flow-root}
.faq-item{background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);margin:12px 0;padding:4px 28px}
.faq-item summary{cursor:pointer;padding:20px 32px 20px 0;list-style:none;position:relative;font-weight:600;color:#fff}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";position:absolute;right:4px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:2px solid var(--z400);border-bottom:2px solid var(--z400);transform:rotate(45deg);transition:transform .2s ease}
.faq-item[open] summary::after{transform:rotate(-135deg);margin-top:-1px}
.faq-item summary h3{margin:0;font-family:var(--font);font-size:1rem;font-weight:600;letter-spacing:0;display:inline;line-height:1.5}
.faq-a{padding:0 0 20px;color:var(--z400);font-size:.9375rem}
.faq-a p{color:var(--z400)}
.faq-a p:last-child{margin-bottom:0}
.links{padding-left:0;list-style:none}
.links li{margin:.5em 0}
.links a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad2);color:#fff;text-decoration:none;font-weight:500;line-height:1.4;transition:all .3s var(--ease)}
.links a::after{content:"→";color:var(--red-t);font-weight:600;transition:transform .2s}
.links a:hover{transform:translateY(-3px);box-shadow:var(--shadow-c);color:#fff;background:#1f1f23}
.links a:hover::after{transform:translateX(3px)}
.related{border-top:1px solid var(--line);margin-top:1.2em;padding-top:.6em}
.related h2{font-size:1.6rem}
.related .links{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.related .links li{margin:0}
.related .links a{height:100%}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:16px 0;padding:0;list-style:none}
.card{position:relative;background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:28px;margin:0;transition:all .3s var(--ease)}
.card h3{margin:0 0 .45em;font-size:1.2rem}
.card h3 a{color:#fff;text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0}
.card p{color:var(--z400);font-size:.95rem;margin:0}
.acc{padding-left:0;list-style:none}
.acc li{position:relative;padding:10px 0 10px 1.6em;border-bottom:1px solid var(--line);margin:0}
.acc li::before{content:"";position:absolute;left:.2em;top:1.15em;width:7px;height:7px;border-radius:50%;background:var(--red)}
.acc .shop{color:var(--z400);font-size:.84rem}
.acc .shop::before{content:"· "}
.count{color:var(--z400);font-weight:400;font-size:.9rem}
.guide-sec{margin-bottom:1.6em}
.two{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
/* Colonne latérale (sommaire + lien de parrainage) */
.side{position:relative;padding-top:28px}
.side-in{position:sticky;top:124px;display:grid;gap:18px}
.side-card{background:var(--z900);border:1px solid var(--line);border-radius:var(--rad);padding:22px;box-shadow:var(--shadow)}
.side-title{font-family:var(--display);font-weight:600;font-size:1.1rem;letter-spacing:-.03em;color:#fff;margin:0 0 .7em}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t;margin:0}
.toc a{display:flex;gap:.7em;padding:.42em 0;color:var(--z400);text-decoration:none;font-size:.875rem;line-height:1.4;border-top:1px solid rgba(255,255,255,.05)}
.toc li:first-child a{border-top:0}
.toc a::before{content:counter(t,decimal-leading-zero);color:var(--red-t);font-family:var(--display);font-weight:600;font-size:.8rem;padding-top:.08em}
.toc a:hover{color:#fff}
.side-ref p{margin:0 0 .8em;font-size:.9rem;color:var(--z300)}
.side-ref code{font-size:.68rem;white-space:nowrap;word-break:normal}
.side-ref .kicker{font-size:.7rem;margin-bottom:.5em}
.side-ref .btn{width:100%;margin-bottom:10px}
.side-ref .side-qr{display:flex;align-items:center;gap:12px;margin:6px 0 12px;font-size:.8rem;color:var(--z400);line-height:1.4}
.side-ref .side-qr img{width:84px;height:84px;background:#fff;border-radius:12px;padding:6px;flex:0 0 auto}
.side-ref .small{font-size:.8rem;margin:0}

/* ---------- Pied de page (bg-black, border-t, py-12, text-sm) ---------- */
.site-footer{border-top:1px solid var(--line);background:#000;margin-top:5em;padding:48px 0 28px;font-size:.875rem}
.p-index .site-footer{margin-top:0}
.ft-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px 40px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.ft-brand .brand{margin:0 0 12px;gap:12px}
.ft-brand .brand-ico{width:32px;height:32px;border-radius:14px;box-shadow:none}
.ft-brand .brand-txt{font-size:1.5rem}
.ft-tag{color:var(--z500);max-width:26rem;margin:0}
.ft-meta{display:flex;flex-wrap:wrap;gap:12px 40px;color:var(--z400)}
.ft-meta div{min-width:0}
.ft-label{font-weight:600;color:#fff;margin:0 0 6px;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}
.ft-meta a{color:var(--z400);text-decoration:none}
.ft-meta a:hover{color:#fff}
.ft-meta .ft-copy{background:none;border:0;padding:0;margin-left:10px;color:var(--red-t);font:inherit;font-weight:600;cursor:pointer}
.ft-meta .ft-copy:hover{color:var(--red-l)}
.ft-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:28px;padding:40px 0 36px}
.ft-title{font-weight:600;color:#fff;margin:0 0 .9em;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}
.ft-grid ul{list-style:none;padding:0;margin:0}
.ft-grid li{margin:.5em 0;line-height:1.35}
.ft-grid a{color:var(--z400);text-decoration:none}
.ft-grid a:hover{color:#fff}
.ft-bottom{border-top:1px solid var(--line);padding-top:32px;color:var(--z500);font-size:.75rem}
.ft-bottom p{margin:0 0 .8em}
.ft-bottom a{color:var(--z400)}
.ft-bottom a:hover{color:#fff}
.legal-note strong{color:var(--z300)}
.ig{display:inline-flex;align-items:center;gap:.5em}
.mobile-bar{display:none}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,10px);display:flex;align-items:center;gap:.75em;background:var(--z900);color:var(--em);border:1px solid rgba(16,185,129,.3);padding:12px 24px;border-radius:var(--rad);font-weight:500;opacity:0;pointer-events:none;transition:all .3s ease;z-index:100;box-shadow:var(--shadow-c)}
.toast::before{content:"✓";display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--em);color:var(--z900);font-size:.7rem;font-weight:700}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- Responsive ---------- */
@media (min-width:1100px){
 .content>.fig.portrait{float:right;width:340px;margin:.4em 0 1.4em 32px}
 .content>.table-wrap,.content>.faq,.content>.ref-card,.content>.note,.content>.qr,.content>h2{display:flow-root}
 .content>.qr{display:inline-block}
}
@media (max-width:1279px){.main-nav ul{gap:28px}.mcards{grid-template-columns:repeat(2,1fr)}.hero h1{font-size:clamp(2.6rem,5.4vw,4.2rem)}}
@media (max-width:1180px){.ft-grid{grid-template-columns:repeat(3,1fr)}.main-nav ul{gap:22px}.brand-txt{font-size:1.6rem}}
@media (max-width:1099px){
 .wrap-page{grid-template-columns:minmax(0,780px);justify-content:center}
 .wrap-page>.side{display:none}
 .hdr-copy{display:none}
}
@media (max-width:1023px){
 .burger{display:flex;margin-left:4px}
 .main-nav{position:absolute;left:0;right:0;top:100%;background:var(--z950);border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:none;margin:0}
 .main-nav.open{display:block}
 .main-nav ul{flex-direction:column;align-items:stretch;gap:16px;padding:24px}
 .main-nav a{padding:8px 0;font-size:1.125rem}
 .main-nav .nav-mob{display:block}
 .main-nav .nav-mob:first-of-type{border-top:1px solid var(--line);padding-top:16px}
 .main-nav .nav-mob .btn{display:flex;width:100%;padding:14px;font-size:.875rem}
 .main-nav .nav-mob .btn-primary{padding:16px;font-size:1rem;color:#fff}
 .hdr-cta{margin-left:auto}
 .hero{grid-template-columns:1fr;gap:48px}
 .hero-visual{max-width:640px}
 .split,.about-card,.duo{grid-template-columns:1fr}
 .split .photo-card{max-width:440px}
 .steps{grid-template-columns:1fr 1fr}
 .cards{grid-template-columns:1fr 1fr}
 .content .stats,.stats-4{grid-template-columns:1fr 1fr}
 .two{grid-template-columns:1fr}
}
@media (max-width:767px){
 .wrap{padding:0 24px}
 .site-header .wrap{padding:0 16px 0 20px}
 .steps{grid-template-columns:1fr}
 .badge-bl{left:-8px}
 .ft-top{flex-direction:column;align-items:flex-start}
}
@media (max-width:640px){
 body{padding-bottom:76px}
 .hdr{gap:8px;min-height:72px}
 .brand{gap:10px}
 .brand-txt{font-size:1.45rem}
 .hdr-cta{padding:.7em 1em;font-size:.82rem;line-height:1.2}
 .hdr-cta svg{display:none}
 .home-hero{padding:36px 0 56px}
 .hero h1{font-size:clamp(2.3rem,11vw,3.2rem)}
 .hero .lead{font-size:1.125rem}
 .hero .btn-row{flex-direction:column;align-items:stretch}
 .hero .btn-row .btn{justify-content:space-between;white-space:normal;text-align:left}
 .hero .btn-row .btn-ghost{justify-content:center}
 .mcards,.cards,.related .links{grid-template-columns:1fr}
 .ft-grid{grid-template-columns:1fr 1fr;gap:22px}
 .trust ul{flex-direction:column;align-items:flex-start;gap:12px}
 .trust .sep{display:none}
 .band{padding:64px 0 52px}
 .band-alt{padding:56px 0}
 .sec-head{margin-bottom:40px}
 .tcard{padding:28px 24px}
 .tcard-head h3{font-size:1.6rem}
 .home-cta .btn-row{flex-direction:column;align-items:stretch}
 .home-cta .btn{white-space:normal}
 .mobile-bar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(9,9,11,.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
 .mobile-bar .btn{padding:.85em .9em;font-size:.95rem}
 .mb-main{flex:1 1 auto;min-width:0}
 .mb-copy{flex:0 0 auto}
 .btn-row .btn{flex:1 1 auto}
 .fig.portrait{max-width:min(100%,360px);margin-left:auto;margin-right:auto}
 .crumbs ol{margin-top:22px}
 .note{padding-left:46px}
 .toast{bottom:92px}
 .pill-live{font-size:.8rem}
 .stat{padding:20px 18px}
 .stat .num{font-size:1.6rem;white-space:nowrap}
}
@media (max-width:370px){.brand-txt{font-size:1.25rem}.brand-ico{width:36px;height:36px}.hdr-cta span{font-size:.78rem}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
.no-side .content>h1{margin-top:1.1em}
.content .stat{padding:20px 18px}
.content .stat .num{font-size:clamp(1.5rem,2.4vw,1.85rem);white-space:nowrap}