/* ============================================================
   IAvecClement — Site de formations (front-end)
   Charte identique aux guides : crème chaud, doré/ambre, brun foncé
   ============================================================ */
:root{
  --bg:oklch(0.984 0.012 88); --surface:oklch(0.998 0.006 88); --surface-2:oklch(0.972 0.012 86);
  --text:oklch(0.28 0.022 70); --muted:oklch(0.5 0.026 68); --faint:oklch(0.6 0.022 72);
  --border:oklch(0.895 0.016 84); --border-strong:oklch(0.82 0.022 82);
  --accent:oklch(0.78 0.125 84); --accent-strong:oklch(0.54 0.1 72); --accent-ink:oklch(0.44 0.085 68);
  --accent-soft:oklch(0.955 0.042 86); --accent-soft-bd:oklch(0.86 0.075 84);
  --dark:oklch(0.21 0.018 83); --dark-2:oklch(0.26 0.022 84);
  --side-text:oklch(0.92 0.022 86); --side-muted:oklch(0.72 0.028 84); --side-faint:oklch(0.58 0.026 84);
  --side-border:oklch(0.33 0.025 84); --side-gold:oklch(0.82 0.13 85);
  --ok:oklch(0.55 0.13 150); --ok-soft:oklch(0.96 0.03 150); --ok-bd:oklch(0.86 0.06 150);
  --font-head:"Space Grotesk","Hanken Grotesk",system-ui,sans-serif;
  --font-body:"Hanken Grotesk",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;
  --font-brand:"Baloo 2","Space Grotesk",system-ui,sans-serif;
  --radius:14px; --radius-sm:9px; --radius-lg:20px;
  --shadow-sm:0 1px 2px oklch(0.4 0.05 80 / 0.05);
  --shadow-md:0 14px 34px oklch(0.3 0.06 80 / 0.13);
  --maxw:1080px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}

/* ---- Boutons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--font-head);font-weight:600;font-size:15px;padding:12px 22px;border-radius:100px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease;white-space:nowrap;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:linear-gradient(110deg,var(--accent),oklch(0.7 0.13 78));color:oklch(0.24 0.03 66);box-shadow:0 6px 18px oklch(0.6 0.13 85 / 0.28);}
.btn-primary:hover{box-shadow:0 9px 24px oklch(0.6 0.13 85 / 0.36);}
.btn-dark{background:var(--dark);color:var(--side-text);}
.btn-dark:hover{background:var(--dark-2);}
.btn-ghost{background:transparent;border-color:var(--border-strong);color:var(--text);}
.btn-ghost:hover{border-color:var(--accent-strong);color:var(--accent-strong);}
.btn-block{width:100%;}
.btn-lg{padding:15px 28px;font-size:16.5px;}
.btn .arrow{transition:transform .15s ease;}
.btn:hover .arrow{transform:translateX(3px);}

/* ---- En-tête / navigation ---- */
.nav{position:sticky;top:0;z-index:50;background:oklch(0.984 0.012 88 / 0.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:12px clamp(20px,5vw,40px);display:flex;align-items:center;gap:18px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;margin-right:auto;}
.brand img{width:38px;height:38px;border-radius:50%;box-shadow:0 0 0 1px var(--border);}
.brand b{font-family:var(--font-brand);font-weight:700;font-size:19px;background:linear-gradient(96deg,var(--accent-strong),oklch(0.6 0.13 80));-webkit-background-clip:text;background-clip:text;color:transparent;}
.nav-links{display:flex;align-items:center;gap:6px;}
.nav-links a{font-size:14.5px;font-weight:600;color:var(--muted);text-decoration:none;padding:8px 13px;border-radius:100px;transition:color .15s,background .15s;}
.nav-links a:hover{color:var(--text);background:var(--surface-2);}
.nav-links a.active{color:var(--accent-strong);}
.nav-cta{display:flex;align-items:center;gap:10px;}
.nav-toggle{display:none;border:1px solid var(--border-strong);background:var(--surface);border-radius:9px;width:40px;height:40px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;}
.nav-toggle span{width:17px;height:1.8px;background:var(--text);border-radius:2px;}

/* ---- Hero sombre ---- */
.hero{position:relative;overflow:hidden;color:var(--side-text);background:radial-gradient(120% 130% at 85% 12%,oklch(0.31 0.05 86 / 0.92) 0%,transparent 55%),linear-gradient(155deg,var(--dark-2),var(--dark));border-bottom:1px solid var(--side-border);}
.hero-in{max-width:var(--maxw);margin:0 auto;padding:72px clamp(20px,5vw,40px) 78px;}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--side-gold);}
.hero h1{font-family:var(--font-head);font-size:clamp(34px,5.4vw,58px);line-height:1.02;letter-spacing:-0.03em;margin:16px 0 18px;color:var(--side-text);max-width:16ch;}
.hero .lede{font-size:19px;line-height:1.6;color:var(--side-muted);max-width:52ch;margin:0 0 30px;}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.hero-note{font-family:var(--font-mono);font-size:12.5px;color:var(--side-faint);margin-top:18px;}
.wm{font-family:var(--font-brand);font-weight:700;background:linear-gradient(96deg,var(--side-gold),oklch(0.93 0.05 88) 70%);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ---- Sections ---- */
.section{padding:64px 0;}
.section-head{text-align:center;max-width:60ch;margin:0 auto 40px;}
.section-head .eyebrow{color:var(--accent-strong);}
.section-head h2{font-family:var(--font-head);font-size:clamp(26px,3.4vw,36px);letter-spacing:-0.02em;margin:12px 0 12px;}
.section-head p{color:var(--muted);font-size:17px;margin:0;}

/* ---- Cartes formations ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}

/* ---- Cartes univers (choix de l'IA) ---- */
.tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.toolcard{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--border);border-radius:24px;padding:38px 34px 32px;box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;}
.toolcard::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(120% 100% at 80% -10%,oklch(0.7 0.13 85 / 0.16),transparent 55%);opacity:0;transition:opacity .35s ease;pointer-events:none;}
.toolcard.live:hover{transform:translateY(-8px);box-shadow:0 26px 60px oklch(0.45 0.06 80 / 0.22);border-color:var(--accent-soft-bd);}
.toolcard.live:hover::before{opacity:1;}
.toolcard.soon{opacity:.7;cursor:default;}
.toolglyph{width:76px;height:76px;border-radius:20px;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:36px;color:oklch(0.24 0.03 66);background:linear-gradient(140deg,var(--accent),oklch(0.7 0.13 78));box-shadow:0 8px 22px oklch(0.6 0.13 85 / 0.3);overflow:hidden;}
.toolglyph.has-logo{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:13px;}
.toolglyph img{width:100%;height:100%;object-fit:contain;display:block;}
.toolcard.soon .toolglyph{background:var(--surface-2);color:var(--faint);box-shadow:none;border:1px solid var(--border);}
.toolcard h3{font-family:var(--font-head);font-size:30px;letter-spacing:-0.02em;margin:24px 0 6px;}
.toolcard .ttag{font-family:var(--font-mono);font-size:13px;color:var(--faint);}
.toolcard p{color:var(--muted);font-size:16px;line-height:1.6;margin:18px 0 24px;flex:1;}
.toolcard .tfoot{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;padding-top:20px;border-top:1px solid var(--border);}
.toolcard .count{font-family:var(--font-mono);font-size:13.5px;color:var(--accent-strong);}
.badge-soon{position:absolute;top:22px;right:22px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);padding:6px 12px;border-radius:100px;}
.toolcard .go{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:16px;color:var(--accent-strong);font-family:var(--font-head);}
.toolcard .go .arrow{transition:transform .15s ease;}
.toolcard.live:hover .go .arrow{transform:translateX(4px);}
.fcard{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:26px 24px 22px;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.fcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--accent-soft-bd);}
.fcard-thumb{margin:-26px -24px 18px;border-radius:15px 15px 0 0;overflow:hidden;border-bottom:1px solid var(--border);background:var(--dark);aspect-ratio:760 / 421;}
.fcard-thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .45s cubic-bezier(.2,.7,.2,1);}
.fcard:hover .fcard-thumb img{transform:scale(1.045);}
/* Aperçu produit (page formation) */
.fpreview-shot{margin-top:18px;border-radius:18px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-md);background:var(--dark);position:relative;}
.fpreview-shot img{width:100%;display:block;}
.fpreview-shot .shot-tag{position:absolute;top:12px;left:12px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--side-text);background:oklch(0.2 0.02 70 / 0.72);backdrop-filter:blur(6px);padding:6px 12px;border-radius:100px;}
.fcard .idx{font-family:var(--font-head);font-weight:700;font-size:38px;line-height:1;color:var(--accent);letter-spacing:-0.02em;}
.fcard h3{font-family:var(--font-head);font-size:21px;letter-spacing:-0.015em;margin:16px 0 8px;}
.fcard p{margin:0 0 16px;color:var(--muted);font-size:14.5px;line-height:1.55;flex:1;}
.fcard .meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;}
.chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:11.5px;color:var(--accent-ink);background:var(--accent-soft);border:1px solid var(--accent-soft-bd);padding:5px 11px;border-radius:100px;}
.fcard-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border);padding-top:16px;}
.price{font-family:var(--font-head);font-weight:700;font-size:22px;color:var(--text);}
.price .cur{font-size:14px;color:var(--faint);font-weight:600;}
.owned-tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:12px;color:var(--ok);background:var(--ok-soft);border:1px solid var(--ok-bd);padding:5px 11px;border-radius:100px;}

/* ---- Bandeau pack ---- */
.pack{background:linear-gradient(150deg,var(--dark-2),var(--dark));color:var(--side-text);border-radius:var(--radius-lg);padding:36px clamp(24px,4vw,44px);display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;border:1px solid var(--side-border);}
.pack h3{font-family:var(--font-head);font-size:26px;letter-spacing:-0.02em;margin:8px 0 8px;color:var(--side-text);}
.pack p{color:var(--side-muted);margin:0;max-width:48ch;}
.pack-buy{text-align:right;}
.pack-price{font-family:var(--font-head);font-weight:700;font-size:40px;color:var(--side-gold);line-height:1;}
.pack-old{font-family:var(--font-mono);font-size:13px;color:var(--side-faint);text-decoration:line-through;margin-bottom:14px;}

/* ---- Tarifs ---- */
.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;align-items:stretch;}
.ptier{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px 24px;}
.ptier.featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow-md);position:relative;}
.ptier .badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent);color:oklch(0.24 0.03 66);font-family:var(--font-mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;padding:5px 12px;border-radius:100px;font-weight:700;}
.ptier h3{font-family:var(--font-head);font-size:20px;margin:0 0 6px;}
.ptier .tprice{font-family:var(--font-head);font-weight:700;font-size:38px;margin:10px 0 4px;letter-spacing:-0.02em;}
.ptier .tprice .cur{font-size:16px;color:var(--faint);}
.ptier .tsub{color:var(--faint);font-size:13.5px;font-family:var(--font-mono);margin-bottom:18px;}
.ptier ul{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:10px;flex:1;}
.ptier li{position:relative;padding-left:26px;font-size:14.5px;color:var(--muted);}
.ptier li::before{content:"";position:absolute;left:2px;top:0.5em;width:8px;height:8px;border-radius:2px;background:var(--accent);transform:rotate(45deg);}

/* ---- Formulaires (auth, paiement) ---- */
.authpage{min-height:calc(100vh - 66px);display:grid;place-items:center;padding:50px 20px;}
.card-form{width:100%;max-width:430px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px 32px;box-shadow:var(--shadow-md);}
.card-form h1{font-family:var(--font-head);font-size:27px;letter-spacing:-0.02em;margin:0 0 6px;}
.card-form .sub{color:var(--muted);margin:0 0 26px;font-size:15px;}
.tabs{display:flex;gap:6px;background:var(--surface-2);padding:5px;border-radius:100px;margin-bottom:24px;}
.tabs button{flex:1;border:0;background:transparent;font-family:var(--font-head);font-weight:600;font-size:14.5px;padding:9px;border-radius:100px;cursor:pointer;color:var(--muted);}
.tabs button.active{background:var(--surface);color:var(--accent-strong);box-shadow:var(--shadow-sm);}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:7px;}
.field input{width:100%;font-family:var(--font-body);font-size:15px;padding:12px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);transition:border-color .15s,box-shadow .15s;}
.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.form-msg{font-size:13.5px;margin:0 0 14px;padding:10px 13px;border-radius:var(--radius-sm);display:none;}
.form-msg.err{display:block;background:oklch(0.96 0.04 35);border:1px solid oklch(0.86 0.08 35);color:oklch(0.45 0.13 35);}
.form-msg.ok{display:block;background:var(--ok-soft);border:1px solid var(--ok-bd);color:oklch(0.4 0.1 150);}
.fineprint{font-size:12.5px;color:var(--faint);margin-top:16px;line-height:1.5;}
.fineprint a{color:var(--accent-strong);}

/* ---- Tableau de bord ---- */
.dash-hero{background:linear-gradient(155deg,var(--dark-2),var(--dark));color:var(--side-text);border-bottom:1px solid var(--side-border);}
.dash-hero .hero-in{padding:46px clamp(20px,5vw,40px);}
.dash-hero h1{font-family:var(--font-head);font-size:clamp(26px,3.6vw,38px);margin:6px 0 6px;color:var(--side-text);letter-spacing:-0.02em;}
.dash-hero p{color:var(--side-muted);margin:0;}
.progress-line{margin-top:18px;font-family:var(--font-mono);font-size:13px;color:var(--side-gold);}

/* ---- Page formation verrouillée ---- */
.lockwrap{display:grid;grid-template-columns:1fr 360px;gap:34px;align-items:start;padding:46px 0 70px;}
.preview{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface);}
.preview .pv-head{padding:10px 16px;border-bottom:1px solid var(--border);background:var(--surface-2);font-family:var(--font-mono);font-size:12px;color:var(--faint);}
.preview .pv-body{position:relative;max-height:460px;overflow:hidden;padding:26px 28px;}
.preview .pv-body::after{content:"";position:absolute;left:0;right:0;bottom:0;height:180px;background:linear-gradient(180deg,transparent,var(--surface));}
.preview h2{font-family:var(--font-head);letter-spacing:-0.02em;margin-top:0;}
.preview p{color:var(--muted);}
.buybox{position:sticky;top:86px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px 24px;box-shadow:var(--shadow-sm);}
.buybox .idx{font-family:var(--font-head);font-weight:700;font-size:34px;color:var(--accent);line-height:1;}
.buybox h1{font-family:var(--font-head);font-size:24px;letter-spacing:-0.02em;margin:14px 0 10px;}
.buybox .bb-price{font-family:var(--font-head);font-weight:700;font-size:34px;margin:16px 0;}
.buybox .bb-price .cur{font-size:16px;color:var(--faint);}
.lock-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;color:var(--accent-ink);background:var(--accent-soft);border:1px solid var(--accent-soft-bd);padding:6px 12px;border-radius:100px;margin-bottom:6px;}
.bb-list{list-style:none;margin:18px 0;padding:0;display:flex;flex-direction:column;gap:9px;}
.bb-list li{position:relative;padding-left:24px;font-size:14px;color:var(--muted);}
.bb-list li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700;}

/* ---- Paiement ---- */
.pay{display:grid;grid-template-columns:1fr 380px;gap:34px;align-items:start;padding:46px 0 70px;}
.pay-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.summary{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;position:sticky;top:86px;}
.summary h3{font-family:var(--font-head);margin:0 0 16px;font-size:18px;}
.sum-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:15px;color:var(--muted);}
.sum-row.total{border-top:1px solid var(--border);margin-top:8px;padding-top:14px;font-family:var(--font-head);font-weight:700;font-size:20px;color:var(--text);}
.stripe-note{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11.5px;color:var(--faint);margin-top:14px;}
.stripe-redirect{display:flex;align-items:flex-start;gap:13px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:var(--radius-sm);padding:15px 16px;margin:4px 0 18px;}
.stripe-redirect .sr-ic{font-size:19px;line-height:1.2;}
.stripe-redirect b{display:block;font-family:var(--font-head);font-size:14.5px;color:var(--text);margin-bottom:3px;}
.stripe-redirect span:last-child{display:block;font-size:13px;color:var(--muted);line-height:1.5;}

/* ---- Réassurance / confiance ---- */
.trust{margin-top:20px;border-top:1px solid var(--border);padding-top:18px;display:flex;flex-direction:column;gap:14px;}
.guarantee{display:flex;gap:13px;align-items:flex-start;background:var(--ok-soft);border:1px solid var(--ok-bd);border-radius:14px;padding:14px 15px;}
.guarantee .g-badge{flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:13px;line-height:1;box-shadow:0 4px 12px oklch(0.6 0.12 150 / 0.3);}
.guarantee .g-txt b{display:block;font-family:var(--font-head);font-size:14.5px;color:oklch(0.38 0.09 150);margin-bottom:2px;}
.guarantee .g-txt span{font-size:12.5px;color:var(--muted);line-height:1.45;}
.paycards{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.paycard{height:27px;padding:0 9px;border-radius:6px;border:1px solid var(--border);background:#fff;display:inline-flex;align-items:center;font-family:var(--font-mono);font-size:10.5px;font-weight:700;letter-spacing:0.03em;box-shadow:var(--shadow-sm);}
.paycard.visa{color:#1a1f71;} .paycard.mc{color:#2a2a2a;} .paycard.amex{color:#1f72cd;} .paycard.stripe{color:#635bff;}
.secured{display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:11.5px;color:var(--faint);}
.guarantee-line{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;color:oklch(0.42 0.08 150);background:var(--ok-soft);border:1px solid var(--ok-bd);padding:8px 13px;border-radius:100px;margin-top:12px;}
.reassure-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 28px;margin:30px auto 0;max-width:820px;}
.reassure-strip .ri{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--muted);}
.reassure-strip .ri b{color:var(--text);font-weight:600;}
.reassure-strip .ri .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);transform:rotate(45deg);border-radius:2px;}

/* ---- Pied de page ---- */
.foot{background:var(--surface-2);border-top:1px solid var(--border);margin-top:40px;}
.foot-in{max-width:var(--maxw);margin:0 auto;padding:40px clamp(20px,5vw,40px);display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;}
.foot .brand b{font-size:17px;}
.foot-links{display:flex;gap:22px;flex-wrap:wrap;}
.foot-links a{color:var(--muted);text-decoration:none;font-size:14px;}
.foot-links a:hover{color:var(--accent-strong);}
.foot-copy{font-family:var(--font-mono);font-size:12px;color:var(--faint);width:100%;border-top:1px solid var(--border);padding-top:18px;margin-top:6px;}

/* ---- Banner / notice ---- */
.demo-banner{background:var(--accent-ink);color:oklch(0.96 0.03 88);font-family:var(--font-mono);font-size:12.5px;text-align:center;padding:8px 16px;letter-spacing:0.02em;}
.demo-banner b{color:var(--side-gold);}

/* ---- Bandeau outils supportés (hero) ---- */
.hero-logos{display:flex;align-items:center;gap:22px;margin-top:30px;flex-wrap:wrap;}
.hero-logos .hl-label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;color:var(--side-faint);}
.hero-logos .hl-row{display:flex;align-items:center;gap:14px;}
.hero-logos .hl{width:38px;height:38px;border-radius:10px;background:oklch(0.99 0.01 88);display:grid;place-items:center;padding:7px;box-shadow:0 2px 8px oklch(0.15 0.02 84 / 0.4);}
.hero-logos .hl img{width:100%;height:100%;object-fit:contain;}

/* ---- Section « Comment ça marche » ---- */
.alt{background:var(--surface-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.steps3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;}
.step3{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px 24px;box-shadow:var(--shadow-sm);}
.step3 .n{width:40px;height:40px;border-radius:50%;background:var(--accent-soft);border:1.5px solid var(--accent-soft-bd);color:var(--accent-strong);font-family:var(--font-head);font-weight:700;display:grid;place-items:center;font-size:17px;}
.step3 h3{font-family:var(--font-head);font-size:18px;letter-spacing:-0.01em;margin:16px 0 8px;}
.step3 p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.55;}

/* ---- Bénéfices ---- */
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;}
.feature{padding:6px 4px;}
.feature .ic{width:46px;height:46px;border-radius:12px;background:linear-gradient(140deg,var(--accent),oklch(0.7 0.13 78));display:grid;place-items:center;color:oklch(0.24 0.03 66);font-size:22px;box-shadow:0 4px 14px oklch(0.6 0.13 85 / 0.22);}
.feature h3{font-family:var(--font-head);font-size:18px;letter-spacing:-0.01em;margin:16px 0 7px;}
.feature p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.55;}

/* ---- CTA bas de page ---- */
.cta-band{background:linear-gradient(150deg,var(--dark-2),var(--dark));color:var(--side-text);border-radius:var(--radius-lg);padding:48px clamp(24px,4vw,52px);text-align:center;border:1px solid var(--side-border);}
.cta-band h2{font-family:var(--font-head);font-size:clamp(26px,3.4vw,34px);letter-spacing:-0.02em;margin:0 0 12px;color:var(--side-text);}
.cta-band p{color:var(--side-muted);max-width:50ch;margin:0 auto 24px;font-size:17px;}

@media (max-width:860px){
  .lockwrap,.pay{grid-template-columns:1fr;}
  .buybox,.summary{position:static;}
  .pack{grid-template-columns:1fr;text-align:left;}
  .pack-buy{text-align:left;}
}
@media (max-width:680px){
  .nav-links,.nav-cta .btn-ghost{display:none;}
  .nav-toggle{display:flex;}
  .nav.open .nav-links{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--surface);border-bottom:1px solid var(--border);padding:10px 20px 16px;gap:2px;}
  .nav.open .nav-links a{padding:12px;}
}
/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes spinRev{to{transform:rotate(-360deg);}}
@keyframes pageIn{from{transform:translateY(8px);}to{transform:none;}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}
@keyframes coreFloat{0%,100%{transform:translate(-50%,-50%);}50%{transform:translate(-50%,calc(-50% - 7px));}}
@keyframes cueFloat{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(6px);}}

main{animation:pageIn .5s ease;}
body{transition:opacity .3s ease, transform .3s ease;}
body.leaving{opacity:0;transform:scale(.99);}

/* Hero centré + orbite 360° */
.hero.center .hero-in{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:820px;margin:0 auto;padding-top:54px;padding-bottom:64px;}
.hero.center h1{font-size:clamp(40px,6.4vw,72px);max-width:16ch;margin:18px 0 18px;}
.hero.center .lede{margin:0 auto 30px;}
.hero.center .hero-actions{justify-content:center;}
.hero.center .eyebrow{margin-bottom:4px;}

.orbit{position:relative;--orbit-r:128px;width:clamp(260px,40vw,330px);height:clamp(260px,40vw,330px);margin:6px auto 30px;}
.orbit-glow{position:absolute;inset:-6%;border-radius:50%;background:radial-gradient(circle at 50% 50%, oklch(0.62 0.13 85 / 0.28), transparent 62%);filter:blur(2px);}
.orbit-ring{position:absolute;inset:6%;border-radius:50%;background:conic-gradient(from 0deg, transparent 0 12%, var(--side-gold) 28%, transparent 52% 100%);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));
  animation:spin 14s linear infinite;opacity:.85;}
.orbit-dash{position:absolute;inset:0;border-radius:50%;border:1px dashed var(--side-border);animation:spin 64s linear infinite reverse;opacity:.55;}
.orbit-core{position:absolute;top:50%;left:50%;width:30%;height:30%;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px var(--side-border),0 10px 34px oklch(0.6 0.13 85 / 0.4);z-index:3;animation:coreFloat 6s ease-in-out infinite;}
.orbit-spin{position:absolute;inset:0;animation:spin 26s linear infinite;z-index:2;}
.sat{position:absolute;top:50%;left:50%;width:54px;height:54px;margin:-27px;transform:rotate(var(--a)) translateY(calc(var(--orbit-r) * -1));}
.sat .tile{width:100%;height:100%;border-radius:14px;background:oklch(0.99 0.01 88);display:grid;place-items:center;padding:9px;box-shadow:0 6px 18px oklch(0.13 0.02 84 / 0.55);animation:spinRev 26s linear infinite;}
.sat .tileinner{width:100%;height:100%;display:grid;place-items:center;transform:rotate(calc(var(--a) * -1));font-family:var(--font-head);font-weight:700;color:var(--accent-strong);font-size:22px;}
.sat img{width:100%;height:100%;object-fit:contain;}

/* Entrée échelonnée des cartes univers */
.tools .toolcard{animation:riseIn .55s cubic-bezier(.2,.7,.2,1) backwards;}
.toolcard.live{will-change:transform;}
.toolcard.live:hover .toolglyph{transform:scale(1.06) rotate(-3deg);transition:transform .25s ease;}

/* Entrée des cartes formation (page univers) */
.cards .fcard{animation:riseIn .5s cubic-bezier(.2,.7,.2,1) backwards;}

/* Hero épuré & centré + transition montante vers le contenu */
.hero-clean{text-align:center;}
.hero-clean .hero-in{max-width:980px;margin:0 auto;display:flex;flex-direction:column;align-items:center;padding-top:40px;padding-bottom:150px;}
.hero-clean .eyebrow{margin-bottom:6px;}
.hero-logo{position:relative;isolation:isolate;width:clamp(150px,15vw,220px);height:clamp(150px,15vw,220px);border-radius:50%;padding:7px;margin:0 auto 22px;
  box-shadow:0 18px 54px oklch(0.6 0.13 85 / 0.5);}
.hero-logo::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:-1;
  background:conic-gradient(from 0deg,var(--side-gold),oklch(0.5 0.07 80),oklch(0.96 0.07 92),var(--side-gold));animation:spin 7s linear infinite;}
.hero-logo::after{content:"";position:absolute;inset:-22%;border-radius:50%;z-index:-2;pointer-events:none;
  background:radial-gradient(circle,oklch(0.7 0.13 85 / 0.45),transparent 62%);animation:logoPulse 3.8s ease-in-out infinite;}
@keyframes logoPulse{0%,100%{opacity:.5;transform:scale(.96);}50%{opacity:1;transform:scale(1.06);}}
.hero-logo img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--dark-2);display:block;position:relative;}
.hero-clean h1{font-family:var(--font-head);font-weight:700;font-size:clamp(58px,10.6vw,140px);line-height:0.9;letter-spacing:-0.038em;color:var(--side-text);margin:18px 0 26px;max-width:none;}
.hl-line{display:block;overflow:hidden;padding-bottom:0.06em;}
.hl-line > span{display:block;}
.hero-clean .wm{background:linear-gradient(96deg,var(--side-gold) 0%,oklch(0.95 0.06 92) 45%,var(--side-gold) 90%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wmShine 6s ease-in-out infinite;}
@keyframes wmShine{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}
.hero-clean .lede{font-size:clamp(17px,1.6vw,21px);line-height:1.6;color:var(--side-muted);max-width:56ch;margin:0 auto 30px;}
.hero-clean .hero-actions{justify-content:center;}
.hero-clean .hero-proof{justify-content:center;margin:26px 0 0;}
.hero-logos-strip{display:flex;align-items:center;justify-content:center;gap:13px;flex-wrap:wrap;margin-top:40px;}
.hero-logos-strip .hs{width:48px;height:48px;border-radius:13px;background:oklch(0.99 0.01 88);display:grid;place-items:center;padding:9px;box-shadow:0 5px 16px oklch(0.12 0.02 84 / 0.5);font-family:var(--font-head);font-weight:700;color:oklch(0.26 0.03 66);transition:transform .2s ease;}
.hero-logos-strip .hs:hover{transform:translateY(-4px);}
.hero-logos-strip .hs img{width:100%;height:100%;object-fit:contain;}

/* Entrée dynamique du hero (jouée au chargement via .hero-anim ajouté en JS) */
.hero-anim .hero-rise{opacity:0;transform:translateY(28px);animation:heroRise .85s cubic-bezier(.16,.84,.3,1) forwards;animation-delay:var(--d,0s);}
.hero-anim .hl-line > span{transform:translateY(112%);animation:lineUp 1s cubic-bezier(.16,.84,.3,1) forwards;}
.hero-anim .hl-line:nth-child(1) > span{animation-delay:.18s;}
.hero-anim .hl-line:nth-child(2) > span{animation-delay:.34s;}
@keyframes heroRise{to{opacity:1;transform:none;}}
@keyframes lineUp{to{transform:none;}}

/* La section des familles remonte en panneau arrondi par-dessus le hero (transition douce) */
.hero-clean + main #univers{position:relative;z-index:3;margin-top:-72px;border-radius:36px 36px 0 0;background:var(--bg);box-shadow:0 -28px 60px oklch(0.18 0.02 80 / 0.32);padding-top:62px;}
.hero-clean + main #univers::before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:54px;height:5px;border-radius:100px;background:var(--border-strong);opacity:.7;}
.hero-clean .scrollcue{bottom:96px;}
@media (max-width:680px){.hero-clean .hero-in{padding-bottom:130px;}.hero-clean + main #univers{margin-top:-56px;}}

/* Hero plein écran (premier écran = bannière seule) */
.hero.hero-full{min-height:100svh;display:flex;align-items:center;position:relative;}
.hero.hero-full .hero-in{padding-top:40px;padding-bottom:96px;width:100%;}

/* Hero éditorial deux colonnes (texte + orbite) */
.hero-split{text-align:left;}
.hero-split .hero-grid{display:grid;grid-template-columns:1.04fr 0.96fr;gap:clamp(28px,5vw,60px);align-items:center;}
.hero-split h1{font-family:var(--font-head);font-size:clamp(40px,5.6vw,66px);line-height:1.0;letter-spacing:-0.03em;color:var(--side-text);margin:16px 0 20px;max-width:15ch;}
.hero-split .lede{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:var(--side-muted);max-width:50ch;margin:0 0 24px;}
.hero-proof{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-family:var(--font-mono);font-size:13px;color:var(--side-muted);margin:0 0 26px;}
.hero-proof b{font-family:var(--font-head);color:var(--side-text);font-size:15px;}
.hero-proof .stars{color:var(--side-gold);letter-spacing:1px;}
.hero-proof .pv{display:inline-flex;align-items:center;gap:7px;}
.hero-proof .sep{width:1px;height:15px;background:var(--side-border);}
.hero-split .pricepeek{margin-top:20px;}
.hero-visual{display:grid;place-items:center;}
.hero-split .orbit.big{margin:0;width:clamp(300px,38vw,480px);height:clamp(300px,38vw,480px);--orbit-r:clamp(128px,20vw,200px);}
@media (max-width:880px){
  .hero-split{text-align:center;}
  .hero-split .hero-grid{grid-template-columns:1fr;gap:18px;}
  .hero-split .hero-copy{order:2;}
  .hero-visual{order:1;}
  .hero-split h1,.hero-split .lede{margin-left:auto;margin-right:auto;}
  .hero-proof,.hero-actions{justify-content:center;}
  .hero-split .orbit.big{width:clamp(260px,70vw,360px);height:clamp(260px,70vw,360px);}
}
.brandlock{font-family:var(--font-brand);font-weight:700;line-height:1;letter-spacing:-0.01em;font-size:clamp(40px,7vw,82px);
  background:linear-gradient(96deg,var(--side-gold) 0%, oklch(0.95 0.05 90) 65%);-webkit-background-clip:text;background-clip:text;color:transparent;margin:4px 0 12px;}
.hero.center .brandlock{margin-left:auto;margin-right:auto;}

/* Orbite agrandie */
.orbit.big{--orbit-r:clamp(150px,24vw,230px);width:clamp(360px,58vw,560px);height:clamp(360px,58vw,560px);margin-bottom:14px;}
.orbit.big .sat{width:74px;height:74px;margin:-37px;}
.orbit.big .sat .tile{border-radius:18px;padding:13px;}
.orbit.big .orbit-core{width:32%;height:32%;}

/* Indice de défilement */
.scrollcue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--side-faint);text-decoration:none;font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;animation:cueFloat 2.4s ease-in-out infinite;}
.scrollcue .chev{width:22px;height:22px;border-right:2px solid var(--side-gold);border-bottom:2px solid var(--side-gold);transform:rotate(45deg);}

/* Révélation au défilement — apparition douce "agence" (rise + déflouté) */
.reveal{opacity:0;transform:translateY(34px);filter:blur(8px);transition:opacity .85s cubic-bezier(.16,.84,.3,1), transform .85s cubic-bezier(.16,.84,.3,1), filter .85s ease;}
.reveal.in{opacity:1;transform:none;filter:none;}
.reveal.d1{transition-delay:.09s;} .reveal.d2{transition-delay:.18s;} .reveal.d3{transition-delay:.27s;}

/* Titres de section : révélation par balayage vertical (clip-up) */
.section-head.reveal h2{clip-path:inset(0 0 108% 0);transform:translateY(16px);transition:clip-path 1s cubic-bezier(.16,.84,.3,1) .08s, transform 1s cubic-bezier(.16,.84,.3,1) .08s;}
.section-head.reveal.in h2{clip-path:inset(0 0 -12% 0);transform:none;}

/* Carrousel d'univers */
.carousel-wrap{position:relative;}
.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(300px,80vw,400px);gap:30px;overflow-x:auto;scroll-snap-type:x mandatory;padding:40px 4px 48px;scrollbar-width:none;scroll-behavior:smooth;}
.carousel::-webkit-scrollbar{display:none;}
.carousel > *{scroll-snap-align:center;transform:scale(var(--cs,1));opacity:var(--co,1);transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s ease,box-shadow .35s ease,border-color .35s ease;}
.car-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:58px;height:58px;border-radius:50%;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-md);cursor:pointer;display:grid;place-items:center;color:var(--accent-strong);font-size:24px;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;}
.car-btn:hover{transform:translateY(-50%) scale(1.1);box-shadow:0 16px 36px oklch(0.45 0.06 80 / 0.25);}
.car-btn.prev{left:-14px;} .car-btn.next{right:-14px;}
.car-btn[disabled]{opacity:.35;cursor:default;}
@media (max-width:680px){.car-btn{display:none;}.carousel{grid-auto-columns:84vw;}}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;}
  .orbit-ring,.orbit-dash,.orbit-spin,.sat,.orbit-core,main,.tools .toolcard,.cards .fcard,.scrollcue{animation:none!important;}
  .reveal{opacity:1;transform:none;filter:none;}
  .section-head.reveal h2{clip-path:none;transform:none;}
  .hero-anim .hero-rise{opacity:1;transform:none;animation:none;}
  .hero-anim .hl-line > span{transform:none;animation:none;}
  .hero-clean .wm{animation:none;}
  .hero-logo::before,.hero-logo::after{animation:none;}
}

/* ---- Carrousel en arc (auto-défilant) ---- */
.arc-stage{position:relative;width:100%;height:700px;overflow:hidden;
  -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.arc-track{display:flex;gap:38px;width:max-content;position:absolute;top:50px;left:0;will-change:transform;}
.arc-card{position:relative;flex:0 0 auto;width:330px;height:476px;border-radius:30px;overflow:hidden;
  background:var(--surface);border:1px solid var(--border);box-shadow:0 28px 60px oklch(0.45 0.05 80 / 0.2);
  text-decoration:none;color:inherit;display:flex;flex-direction:column;transform-origin:center center;
  will-change:transform,opacity;}
.arc-card .ac-top{flex:1;display:grid;place-items:center;position:relative;background:linear-gradient(165deg,oklch(0.97 0.022 var(--h,86)),oklch(0.93 0.04 calc(var(--h,86) + 14)));}
.arc-card .ac-logo{width:128px;height:128px;border-radius:30px;background:oklch(0.99 0.006 88);display:grid;place-items:center;
  padding:24px;box-shadow:0 10px 28px oklch(0.5 0.04 80 / 0.18);font-family:var(--font-head);font-weight:700;font-size:56px;color:oklch(0.26 0.03 66);}
.arc-card .ac-logo img{width:100%;height:100%;object-fit:contain;display:block;}
.arc-card .ac-cap{padding:20px 22px 24px;background:var(--surface);border-top:1px solid var(--border);text-align:center;}
.arc-card .ac-cap h4{font-family:var(--font-head);font-size:25px;letter-spacing:-0.015em;margin:0 0 5px;}
.arc-card .ac-cap span{font-family:var(--font-mono);font-size:13px;color:var(--faint);}
.arc-card .ac-go{position:absolute;bottom:18px;right:18px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:var(--accent);color:oklch(0.26 0.03 66);font-size:19px;box-shadow:0 6px 16px oklch(0.6 0.13 85 / 0.3);opacity:0;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease;}
.arc-card.live:hover .ac-go{opacity:1;transform:translateY(0);}
.arc-card .ac-soon{position:absolute;top:14px;left:14px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--muted);background:oklch(0.99 0.006 88 / 0.9);border:1px solid var(--border);padding:5px 11px;border-radius:100px;backdrop-filter:blur(4px);}
.arc-card.soon{filter:saturate(0.6);}
.arc-card.soon .ac-logo{color:var(--faint);}
.arc-stage[data-grab] .arc-track{cursor:grab;}
@media (max-width:680px){.arc-stage{height:560px;}.arc-card{width:240px;height:366px;}.arc-card .ac-logo{width:96px;height:96px;}}

/* ============================================================
   AMÉLIORATIONS VENTE — stats, témoignages, à-propos, pack, curriculum, FAQ
   ============================================================ */

/* ---- Bande de statistiques ---- */
.statband{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:920px;margin:0 auto;}
.statband .stat{text-align:center;padding:22px 14px;background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-sm);}
.statband .stat .num{font-family:var(--font-head);font-weight:700;font-size:40px;line-height:1;letter-spacing:-0.02em;background:linear-gradient(110deg,var(--accent-strong),oklch(0.66 0.13 80));-webkit-background-clip:text;background-clip:text;color:transparent;}
.statband .stat .lbl{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-top:9px;letter-spacing:0.02em;}
.statband .stat .stars{color:var(--accent);font-size:15px;letter-spacing:2px;margin-top:6px;}
@media (max-width:680px){.statband{grid-template-columns:repeat(2,1fr);}}

/* ---- Témoignages ---- */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.tcard{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:24px;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease;}
.tcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.tcard .stars{color:var(--accent);font-size:14px;letter-spacing:2px;margin-bottom:12px;}
.tcard .quote{font-size:15.5px;line-height:1.6;color:var(--text);flex:1;}
.tcard .who{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:18px;border-top:1px solid var(--border);}
.tcard .ava{flex:0 0 auto;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:15px;color:oklch(0.26 0.03 66);background:linear-gradient(140deg,var(--accent),oklch(0.7 0.13 78));}
.tcard .who .nm{font-family:var(--font-head);font-weight:600;font-size:15px;}
.tcard .who .rl{font-family:var(--font-mono);font-size:11.5px;color:var(--faint);}
.tcard .who .tg{margin-left:auto;font-family:var(--font-mono);font-size:10.5px;color:var(--accent-strong);background:var(--accent-soft);border:1px solid var(--accent-soft-bd);padding:4px 9px;border-radius:100px;}
@media (max-width:900px){.tgrid{grid-template-columns:1fr;}}

/* ---- Témoignages : carrousel ---- */
.tcarousel{position:relative;}
.tcar-view{overflow:hidden;}
.tcar-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:6px 2px 10px;}
.tcar-track::-webkit-scrollbar{display:none;}
.tcar-track > .tcard{scroll-snap-align:start;flex:0 0 clamp(280px,calc((100% - 40px)/3),400px);}
.tcar-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:50px;height:50px;border-radius:50%;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-md);cursor:pointer;display:grid;place-items:center;color:var(--accent-strong);font-size:22px;transition:transform .15s ease,box-shadow .15s ease;}
.tcar-btn:hover{transform:translateY(-50%) scale(1.08);box-shadow:0 14px 30px oklch(0.45 0.06 80 / 0.22);}
.tcar-btn.prev{left:-16px;} .tcar-btn.next{right:-16px;}
.tcar-btn[disabled]{opacity:.35;cursor:default;}
.tcar-dots{display:flex;justify-content:center;gap:8px;margin-top:18px;}
.tcar-dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:var(--border-strong);cursor:pointer;transition:width .25s ease,background .25s ease;}
.tcar-dots button.on{width:26px;border-radius:100px;background:var(--accent);}
@media (max-width:680px){.tcar-btn{display:none;}.tcar-track > .tcard{flex-basis:86%;}}

/* ---- Showcase espace membre (échelle de niveaux) ---- */
.member-band{position:relative;overflow:hidden;background:var(--dark);color:var(--side-text);border-radius:26px;padding:46px clamp(24px,4vw,52px);}
.member-band::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(90% 120% at 10% 0%,oklch(0.5 0.1 280 / 0.22),transparent 55%),radial-gradient(90% 120% at 95% 100%,oklch(0.55 0.13 30 / 0.2),transparent 55%);}
.member-band .mb-in{position:relative;z-index:1;}
.member-band .eyebrow{color:var(--side-gold);}
.member-band h2{font-family:var(--font-head);font-size:clamp(26px,3.4vw,38px);letter-spacing:-0.02em;color:#fff;margin:6px 0 12px;max-width:20ch;}
.member-band .mb-lead{color:var(--side-muted);font-size:16.5px;max-width:60ch;margin:0 0 30px;}
.ladder{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:30px;}
.rung{position:relative;border-radius:16px;padding:18px 14px;background:oklch(0.99 0.01 88 / 0.05);border:1px solid var(--side-border);text-align:center;
  border-top:3px solid var(--lc);transition:transform .2s ease,background .2s ease;}
.rung:hover{transform:translateY(-4px);background:oklch(0.99 0.01 88 / 0.09);}
.rung .gem{width:30px;height:30px;margin:0 auto 9px;border-radius:50%;display:grid;place-items:center;font-size:14px;color:#fff;background:var(--lc);box-shadow:0 4px 12px color-mix(in oklab,var(--lc) 55%,transparent);}
.rung .rn{font-family:var(--font-head);font-weight:700;font-size:15px;color:#fff;}
.rung .rp{font-family:var(--font-mono);font-size:11px;color:var(--side-muted);margin-top:5px;}
.rung .rd{font-family:var(--font-head);font-weight:700;font-size:13px;color:var(--side-gold);margin-top:8px;}
.mb-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:30px;}
.mb-card{background:oklch(0.99 0.01 88 / 0.05);border:1px solid var(--side-border);border-radius:16px;padding:20px;}
.mb-card .mc-ic{font-size:24px;}
.mb-card h3{font-family:var(--font-head);font-size:16px;color:#fff;margin:12px 0 5px;}
.mb-card p{color:var(--side-muted);font-size:13.5px;margin:0;line-height:1.55;}
@media (max-width:820px){.ladder{grid-template-columns:repeat(2,1fr);}.mb-cards{grid-template-columns:1fr;}}

/* ---- Section "Qui est Clément ?" ---- */
.about{display:grid;grid-template-columns:280px 1fr;gap:40px;align-items:center;background:var(--dark);border-radius:26px;padding:46px;color:var(--side-text);overflow:hidden;position:relative;}
.about::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 130% at 12% 10%,oklch(0.5 0.1 85 / 0.28),transparent 55%);pointer-events:none;}
.about .photo{position:relative;z-index:1;justify-self:center;width:220px;height:220px;border-radius:50%;padding:8px;background:conic-gradient(from 200deg,var(--side-gold),oklch(0.5 0.08 80),var(--side-gold));box-shadow:0 20px 50px oklch(0.1 0.02 80 / 0.5);}
.about .photo img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--dark-2);}
.about .txt{position:relative;z-index:1;}
.about .eyebrow{color:var(--side-gold);}
.about .txt h2{font-family:var(--font-head);font-size:clamp(26px,3.4vw,36px);letter-spacing:-0.02em;margin:6px 0 16px;color:#fff;}
.about .txt p{color:var(--side-muted);font-size:16px;margin:0 0 14px;}
.about .ipoints{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:10px;}
.about .ipoints li{font-family:var(--font-mono);font-size:12.5px;color:var(--side-text);background:oklch(0.99 0.01 88 / 0.07);border:1px solid var(--side-border);padding:8px 13px;border-radius:100px;}
.about .ipoints li::before{content:"✓ ";color:var(--side-gold);}
@media (max-width:780px){.about{grid-template-columns:1fr;padding:34px 24px;text-align:center;}.about .ipoints{justify-content:center;}}

/* ---- Aperçu tarifs (accueil) ---- */
.pricepeek{display:inline-flex;align-items:baseline;gap:8px;font-family:var(--font-mono);font-size:13px;color:var(--muted);margin-top:14px;}
.pricepeek b{font-family:var(--font-head);font-size:18px;color:var(--accent-strong);}

/* ---- Méga-pack (tarifs) ---- */
.megapack{max-width:920px;margin:30px auto 0;background:var(--dark);border-radius:26px;padding:40px 44px;color:var(--side-text);display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center;position:relative;overflow:hidden;}
.megapack::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 140% at 88% 0%,oklch(0.6 0.12 85 / 0.3),transparent 55%);pointer-events:none;}
.megapack .mp-l{position:relative;z-index:1;}
.megapack .mp-tag{font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--dark);background:var(--side-gold);padding:5px 12px;border-radius:100px;display:inline-block;margin-bottom:14px;}
.megapack h3{font-family:var(--font-head);font-size:30px;letter-spacing:-0.02em;margin:0 0 8px;color:#fff;}
.megapack p{color:var(--side-muted);margin:0 0 16px;max-width:46ch;}
.megapack .mp-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 16px;}
.megapack .mp-list li{font-size:13.5px;color:var(--side-text);}
.megapack .mp-list li::before{content:"✓ ";color:var(--side-gold);font-weight:700;}
.megapack .mp-r{position:relative;z-index:1;text-align:center;min-width:220px;}
.megapack .mp-old{font-family:var(--font-mono);font-size:14px;color:var(--side-faint);text-decoration:line-through;}
.megapack .mp-price{font-family:var(--font-head);font-weight:700;font-size:54px;line-height:1;color:#fff;margin:4px 0 2px;}
.megapack .mp-save{display:inline-block;font-family:var(--font-mono);font-size:12px;color:oklch(0.85 0.13 150);background:oklch(0.5 0.12 150 / 0.18);border:1px solid oklch(0.6 0.1 150 / 0.4);padding:5px 11px;border-radius:100px;margin-bottom:16px;}
@media (max-width:780px){.megapack{grid-template-columns:1fr;text-align:center;padding:32px 24px;}.megapack .mp-list{justify-content:center;}}

/* ---- Curriculum (page formation) ---- */
.curric{margin-top:26px;}
.curric h2,.faqs h2{font-family:var(--font-head);font-size:22px;letter-spacing:-0.02em;margin:0 0 16px;}
.modlist{display:flex;flex-direction:column;gap:10px;}
.modrow{display:flex;align-items:flex-start;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow-sm);}
.modrow .mn{flex:0 0 auto;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:14px;color:oklch(0.26 0.03 66);background:var(--accent-soft);border:1px solid var(--accent-soft-bd);}
.modrow .mt{font-size:15.5px;line-height:1.5;}
.modrow .mt b{font-family:var(--font-head);font-weight:600;display:block;}
.modrow .mt span{color:var(--muted);font-size:14px;}

/* ---- FAQ accordéon ---- */
.faqs{margin-top:30px;}
.faq-item{border:1px solid var(--border);border-radius:14px;background:var(--surface);margin-bottom:10px;overflow:hidden;box-shadow:var(--shadow-sm);}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;text-align:left;background:none;border:0;cursor:pointer;padding:17px 20px;font-family:var(--font-head);font-weight:600;font-size:16px;color:var(--text);}
.faq-q .chev{flex:0 0 auto;width:22px;height:22px;position:relative;transition:transform .25s ease;}
.faq-q .chev::before,.faq-q .chev::after{content:"";position:absolute;top:50%;left:50%;width:11px;height:2px;background:var(--accent-strong);border-radius:2px;transform:translate(-50%,-50%);}
.faq-q .chev::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .25s ease;}
.faq-item.open .faq-q .chev::after{transform:translate(-50%,-50%) rotate(0);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-a p{margin:0;padding:0 20px 18px;color:var(--muted);font-size:15px;line-height:1.6;}

/* ---- Barre de progression (espace membre) ---- */
.progress-card{max-width:var(--maxw);margin:0 auto 6px;}
.pbar{height:12px;border-radius:100px;background:var(--surface-2);border:1px solid var(--border);overflow:hidden;margin-top:4px;}
.pbar > span{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,var(--accent),oklch(0.66 0.13 80));transition:width .9s cubic-bezier(.2,.7,.2,1);}
.pmeta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-family:var(--font-mono);font-size:12.5px;color:var(--side-muted);margin-bottom:4px;}
.pmeta b{font-family:var(--font-head);color:var(--side-text);font-size:14px;}

/* ============================================================
   INTERACTIONS SIGNATURE — grain · curseur · transitions
   ============================================================ */
.grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

body{transition:opacity .32s ease;}
body.page-enter{opacity:0;}
body.page-leave{opacity:0;}

body.has-cursor,body.has-cursor a,body.has-cursor button,body.has-cursor .btn{cursor:none;}
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;border-radius:50%;pointer-events:none;z-index:9999;margin-left:-4px;margin-top:-4px;}
.cursor-dot{width:8px;height:8px;background:var(--accent-strong);}
.cursor-ring{width:38px;height:38px;margin-left:-19px;margin-top:-19px;border:1.5px solid var(--accent-soft-bd);transition:width .2s ease,height .2s ease,margin .2s ease,background .2s ease,border-color .2s ease;}
body.cursor-hot .cursor-ring{width:60px;height:60px;margin-left:-30px;margin-top:-30px;background:var(--accent-soft);border-color:var(--accent-strong);mix-blend-mode:multiply;}
.btn-primary,.btn-lg,[data-magnetic]{transition:transform .18s cubic-bezier(.2,.7,.2,1),box-shadow .15s ease,background .15s ease,border-color .15s ease;}

/* ============================================================
   GAMIFICATION — rang, XP, roadmap, badges, perks, parrainage
   ============================================================ */

/* Pastille de niveau (réutilisable) */
.lvl-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-head);font-weight:700;font-size:13px;
  padding:6px 13px 6px 9px;border-radius:100px;color:#fff;background:var(--lc,#b07b43);
  box-shadow:0 4px 14px color-mix(in oklab,var(--lc,#b07b43) 50%,transparent);white-space:nowrap;}
.lvl-badge .gem{width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,0.25);font-size:11px;}
.lvl-badge.sm{font-size:11px;padding:4px 10px 4px 7px;}

/* En-tête membre premium */
.member-hero{position:relative;overflow:hidden;background:var(--dark);color:var(--side-text);
  border-radius:0 0 28px 28px;padding:42px clamp(20px,5vw,40px) 48px;}
.member-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 85% 0%,oklch(0.5 0.1 85 / 0.3),transparent 55%);pointer-events:none;}
.mh-in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;}
.mh-top{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.mh-ava{width:72px;height:72px;border-radius:50%;padding:4px;background:conic-gradient(from 200deg,var(--lc,#d4a54b),oklch(0.5 0.05 80),var(--lc,#d4a54b));flex:0 0 auto;}
.mh-ava img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:var(--dark-2);}
.mh-hello{font-family:var(--font-head);font-size:clamp(24px,3.4vw,32px);letter-spacing:-0.02em;color:#fff;margin:0;}
.mh-sub{color:var(--side-muted);font-family:var(--font-mono);font-size:12.5px;margin-top:3px;}
.mh-xpwrap{margin-top:26px;}
.mh-xpmeta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-family:var(--font-mono);font-size:12.5px;color:var(--side-muted);margin-bottom:7px;}
.mh-xpmeta b{font-family:var(--font-head);color:#fff;font-size:14px;}
.xpbar{height:14px;border-radius:100px;background:oklch(0.99 0.01 88 / 0.1);border:1px solid var(--side-border);overflow:hidden;}
.xpbar > span{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,var(--lc,#d4a54b),oklch(0.82 0.13 85));width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 16px var(--lc,#d4a54b);}
.mh-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.mh-chip{font-family:var(--font-mono);font-size:11.5px;color:var(--side-text);background:oklch(0.99 0.01 88 / 0.08);border:1px solid var(--side-border);padding:7px 12px;border-radius:100px;}
.mh-chip b{color:var(--side-gold);}

/* Sections membre */
.msec{max-width:var(--maxw);margin:0 auto;padding:38px clamp(20px,5vw,40px) 0;}
.msec-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:18px;}
.msec-head h2{font-family:var(--font-head);font-size:22px;letter-spacing:-0.02em;margin:0;}
.msec-head .hint{font-family:var(--font-mono);font-size:12px;color:var(--faint);}

/* ---- Roadmap / parcours visuel (zig-zag) ---- */
.roadmap{position:relative;padding:10px 0;}
.roadmap::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;transform:translateX(-50%);
  background:repeating-linear-gradient(var(--border) 0 8px,transparent 8px 16px);}
.rmrow{position:relative;display:grid;grid-template-columns:1fr 64px 1fr;align-items:center;margin:6px 0;}
.node-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow-sm);
  text-decoration:none;color:inherit;display:block;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.node-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--accent-soft-bd);}
.rmrow.left .node-card{grid-column:1;text-align:right;}
.rmrow.right .node-card{grid-column:3;}
.rmrow .node{grid-column:2;justify-self:center;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  font-size:22px;background:var(--surface-2);border:2px solid var(--border-strong);color:var(--faint);z-index:1;position:relative;transition:transform .2s ease;}
.node-card .nc-tool{font-family:var(--font-mono);font-size:11px;color:var(--accent-strong);letter-spacing:0.04em;}
.node-card h3{font-family:var(--font-head);font-size:17px;margin:3px 0 4px;letter-spacing:-0.01em;}
.node-card .nc-state{font-family:var(--font-mono);font-size:11.5px;color:var(--faint);}
.rmrow.owned .node{border-color:var(--accent);color:var(--accent-strong);background:var(--accent-soft);}
.rmrow.done .node{border-color:var(--ok);background:var(--ok-soft);color:var(--ok);box-shadow:0 0 0 4px var(--ok-soft);}
.rmrow.done .node-card .nc-state{color:var(--ok);}
.rmrow.locked .node-card{opacity:.72;}
.nc-actions{display:flex;gap:8px;margin-top:12px;justify-content:inherit;flex-wrap:wrap;}
.rmrow.left .nc-actions{justify-content:flex-end;}
.mini-btn{font-family:var(--font-head);font-weight:600;font-size:12.5px;padding:7px 13px;border-radius:100px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none;transition:border-color .15s,color .15s,background .15s;}
.mini-btn:hover{border-color:var(--accent-strong);color:var(--accent-strong);}
.mini-btn.solid{background:var(--accent);border-color:transparent;color:oklch(0.26 0.03 66);}
.mini-btn.ok{border-color:var(--ok-bd);color:oklch(0.42 0.1 150);background:var(--ok-soft);}
@media (max-width:720px){
  .roadmap::before{left:27px;}
  .rmrow{grid-template-columns:54px 1fr;gap:14px;}
  .rmrow .node{grid-column:1;}
  .rmrow.left .node-card,.rmrow.right .node-card{grid-column:2;text-align:left;}
  .rmrow.left .nc-actions{justify-content:flex-start;}
}

/* ---- Étagère à badges ---- */
.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;}
.badge-chip{position:relative;text-align:center;padding:22px 14px 16px;border-radius:16px;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-sm);transition:transform .18s ease;}
.badge-chip:hover{transform:translateY(-3px);}
.badge-chip .bi{font-size:34px;line-height:1;filter:grayscale(1) opacity(.4);transition:filter .2s ease,transform .2s ease;}
.badge-chip.earned .bi{filter:none;transform:scale(1.05);}
.badge-chip .bn{font-family:var(--font-head);font-weight:600;font-size:14px;margin-top:10px;}
.badge-chip .bd{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.4;}
.badge-chip.earned{border-color:var(--accent-soft-bd);background:linear-gradient(180deg,var(--accent-soft),var(--surface));}
.badge-chip .lockmark{font-family:var(--font-mono);font-size:10.5px;color:var(--faint);margin-top:10px;display:block;}
.badge-chip.earned .lockmark{color:var(--accent-strong);}
.badge-reward{position:absolute;top:10px;right:10px;font-family:var(--font-mono);font-size:10px;font-weight:600;color:var(--faint);background:var(--surface-2);border:1px solid var(--border);padding:3px 8px;border-radius:100px;}
.badge-chip.earned .badge-reward{color:oklch(0.26 0.03 66);background:var(--accent);border-color:transparent;box-shadow:0 3px 9px oklch(0.6 0.13 85 / 0.3);}
.badge-prog{margin-top:11px;}
.badge-prog .bp-bar{height:6px;border-radius:100px;background:var(--surface-2);border:1px solid var(--border);overflow:hidden;}
.badge-prog .bp-bar > span{display:block;height:100%;border-radius:100px;background:linear-gradient(90deg,var(--accent),oklch(0.7 0.13 80));}
.badge-prog .bp-lbl{display:block;font-family:var(--font-mono);font-size:10px;color:var(--faint);margin-top:6px;}

/* ---- Avantages (perks) ---- */
.perks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.perk{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:var(--shadow-sm);}
.perk .pk-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--accent-soft);border:1px solid var(--accent-soft-bd);}
.perk h3{font-family:var(--font-head);font-size:16px;margin:14px 0 5px;}
.perk p{color:var(--muted);font-size:14px;margin:0;}
.perk .pk-val{font-family:var(--font-head);font-weight:700;color:var(--accent-strong);}
.perk.off{opacity:.6;}
.perk.off .pk-ic{background:var(--surface-2);border-color:var(--border);filter:grayscale(1);}
@media (max-width:780px){.perks-grid{grid-template-columns:1fr;}}

/* ---- Parrainage ---- */
.refcard{background:var(--dark);color:var(--side-text);border-radius:20px;padding:28px;display:grid;grid-template-columns:1fr auto;gap:26px;align-items:center;position:relative;overflow:hidden;}
.refcard::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 130% at 90% 0%,oklch(0.5 0.1 85 / 0.26),transparent 55%);pointer-events:none;}
.refcard .rc-l{position:relative;z-index:1;}
.refcard h3{font-family:var(--font-head);font-size:22px;color:#fff;margin:0 0 6px;}
.refcard p{color:var(--side-muted);margin:0 0 16px;max-width:48ch;font-size:14.5px;}
.refrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.codebox{font-family:var(--font-mono);font-size:16px;letter-spacing:0.06em;color:var(--side-gold);background:oklch(0.99 0.01 88 / 0.08);border:1px dashed var(--side-border);padding:11px 16px;border-radius:12px;}
.refcard .rc-r{position:relative;z-index:1;text-align:center;}
.refcard .rc-count{font-family:var(--font-head);font-weight:700;font-size:48px;color:#fff;line-height:1;}
.refcard .rc-lbl{font-family:var(--font-mono);font-size:12px;color:var(--side-muted);margin-top:4px;}
@media (max-width:680px){.refcard{grid-template-columns:1fr;text-align:center;}.refrow{justify-content:center;}}

/* Avantage de niveau au checkout */
.lvl-deal{display:flex;align-items:center;gap:10px;background:var(--accent-soft);border:1px solid var(--accent-soft-bd);border-radius:12px;padding:11px 14px;margin-top:14px;font-size:13.5px;color:var(--accent-ink);}
.lvl-deal b{font-family:var(--font-head);}

/* ============================================================
   PARCOURS PAR FAMILLES — accueil + espace membre
   ============================================================ */
.cats{display:flex;flex-direction:column;gap:34px;}
.cat{--cc:#6c5ce7;position:relative;border:1px solid var(--border);border-radius:24px;overflow:hidden;
  background:var(--surface);box-shadow:var(--shadow-sm);}
.cat-head{display:flex;align-items:center;gap:18px;padding:24px 26px;
  background:linear-gradient(100deg,color-mix(in oklab,var(--cc) 16%,var(--surface)),var(--surface) 70%);
  border-bottom:1px solid var(--border);}
.cat-ic{flex:0 0 auto;width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font-size:26px;
  background:color-mix(in oklab,var(--cc) 22%,white);border:1px solid color-mix(in oklab,var(--cc) 35%,transparent);
  box-shadow:0 6px 16px color-mix(in oklab,var(--cc) 40%,transparent);}
.cat-head h3{font-family:var(--font-head);font-size:23px;letter-spacing:-0.02em;margin:0;}
.cat-head p{color:var(--muted);font-size:14.5px;margin:4px 0 0;max-width:62ch;}
.cat-count{margin-left:auto;align-self:flex-start;font-family:var(--font-mono);font-size:11.5px;color:#fff;
  background:var(--cc);padding:6px 12px;border-radius:100px;white-space:nowrap;box-shadow:0 4px 12px color-mix(in oklab,var(--cc) 45%,transparent);}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(214px,1fr));gap:16px;padding:22px 26px 26px;}
.cat-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:inherit;
  background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s ease,border-color .2s ease;}
.cat-card.live:hover{transform:translateY(-5px);box-shadow:0 18px 40px color-mix(in oklab,var(--cc) 26%,transparent);border-color:color-mix(in oklab,var(--cc) 45%,transparent);}
.cat-card.soon{opacity:.66;cursor:default;}
.cat-logo{width:56px;height:56px;border-radius:15px;display:grid;place-items:center;overflow:hidden;
  background:#fff;border:1px solid var(--border);box-shadow:var(--shadow-sm);
  font-family:var(--font-head);font-weight:700;font-size:24px;color:color-mix(in oklab,var(--cc) 60%,#2a2218);}
.cat-logo img{width:74%;height:74%;object-fit:contain;display:block;}
.cat-card h4{font-family:var(--font-head);font-size:18px;letter-spacing:-0.01em;margin:15px 0 3px;}
.cat-card .cc-sub{font-family:var(--font-mono);font-size:11.5px;color:var(--faint);}
.cat-card .cc-foot{display:flex;align-items:center;gap:8px;margin-top:16px;}
.cat-card .cc-go{font-family:var(--font-head);font-weight:600;font-size:13.5px;color:var(--cc);display:inline-flex;align-items:center;gap:6px;}
.cat-card .cc-go .arrow{transition:transform .15s ease;}
.cat-card.live:hover .cc-go .arrow{transform:translateX(3px);}
.cat-card .soon-badge{font-family:var(--font-mono);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--muted);background:var(--surface-2);border:1px solid var(--border);padding:4px 10px;border-radius:100px;}
.cat-card .dot{position:absolute;top:18px;right:18px;width:9px;height:9px;border-radius:2px;transform:rotate(45deg);background:var(--cc);box-shadow:0 0 0 4px color-mix(in oklab,var(--cc) 18%,transparent);}

/* Regroupement du parcours membre par famille */
.fam-head{display:flex;align-items:center;gap:12px;margin:30px 0 8px;position:relative;z-index:1;background:var(--bg);padding:6px 0;}
.fam-head .fam-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:17px;
  background:color-mix(in oklab,var(--cc) 20%,white);border:1px solid color-mix(in oklab,var(--cc) 32%,transparent);}
.fam-head h3{font-family:var(--font-head);font-size:16px;letter-spacing:-0.01em;margin:0;}
.fam-head .fam-line{flex:1;height:1px;background:linear-gradient(90deg,color-mix(in oklab,var(--cc) 40%,transparent),transparent);}
.rmrow.fam-tinted .node{border-color:color-mix(in oklab,var(--cc) 45%,var(--border-strong));}

/* Tarifs colorés par famille */
.cat .pricing{padding:22px 26px 28px;}
.cat .ptier{border-radius:16px;}
.cat .ptier.featured{border-color:var(--cc);box-shadow:0 0 0 1px var(--cc),0 16px 38px color-mix(in oklab,var(--cc) 22%,transparent);}
.cat .ptier.featured .badge{background:var(--cc);color:#fff;}
.cat .ptier.featured .tprice{color:var(--cc);}
.cat .ptier li::before{background:var(--cc);}
.cat .ptier.featured .btn-primary{background:linear-gradient(110deg,var(--cc),color-mix(in oklab,var(--cc) 70%,#000));color:#fff;box-shadow:0 6px 18px color-mix(in oklab,var(--cc) 45%,transparent);}