/**
 * Cours Math L1 — d314.io v5
 * Tokens dashboard | Préfixe cml-
 */

/* ============================================================
   FIX ELEMENTOR
   ============================================================ */
body.page-template-page-cours-math-l1 { padding-top:0 !important; }
.cml-page { margin-top:0 !important; }
.elementor,.elementor-section,.elementor-top-section,
.elementor-location-header ~ *,main,#content {
    margin-top:0 !important; padding-top:0 !important;
}

/* ============================================================
   TOKENS
   ============================================================ */
.cml-page {
    --bg0:#13131f; --bg1:#17172a; --bg2:#1c1c2e; --bg3:#212135;
    --b0:rgba(255,255,255,.055); --b1:rgba(255,255,255,.03);
    --t0:var(--text-primary); --t1:var(--text-secondary); --t2:var(--text-muted); --t3:#272940;
    --math:#6366f1; --math-b:rgba(99,102,241,.13); --math-d:rgba(99,102,241,.35);
    --grn:#10b981;  --grn-b:rgba(16,185,129,.12);  --grn-d:rgba(16,185,129,.3);
    --amb:#f59e0b;  --amb-b:rgba(245,158,11,.12);  --amb-d:rgba(245,158,11,.3);
    --r:10px;
    --sans:var(--font-family-primary);
    --mono:var(--font-family-mono);

    font-family:var(--sans); font-size:var(--font-size-base); color:var(--t0);
    background:var(--bg0); overflow-x:hidden; -webkit-font-smoothing:antialiased;
}

/* GLOW TOP */
.cml-glow-top {
    position:fixed; top:0; left:0; width:100%; height:600px;
    z-index:0; pointer-events:none;
    background:radial-gradient(ellipse at top,rgba(99,102,241,.10),transparent 60%);
}

/* PROGRESS BAR */
.cml-progress-bar {
    position:fixed; top:0; left:0; height:2px; width:0%;
    background:linear-gradient(90deg,var(--math),#22d3ee);
    z-index:1000; transition:width .1s linear; pointer-events:none;
}

/* ANIMATIONS */
@keyframes cml-fadein { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
.cml-anim     { opacity:0; animation:cml-fadein .7s cubic-bezier(.4,0,.2,1) both; }
.cml-anim--d1 { animation-delay:.05s; }
.cml-anim--d2 { animation-delay:.1s; }
.cml-anim--d3 { animation-delay:.2s; }
.cml-anim--d4 { animation-delay:.3s; }
.cml-anim--d5 { animation-delay:.4s; }
.cml-reveal   { opacity:0; transform:translateY(14px); transition:opacity .45s ease,transform .45s ease; }
.cml-reveal.visible { opacity:1; transform:translateY(0); }

/* ============================================================
   HERO
   ============================================================ */
.cml-hero {
    position:relative; z-index:1;
    padding:100px 40px 72px; overflow:hidden;
    border-bottom:1px solid var(--b0);
}
.cml-hero-glow {
    position:absolute; width:700px; height:400px; border-radius:50%;
    background:radial-gradient(circle,#6366f1,transparent 70%);
    top:-200px; left:-100px; opacity:.1; filter:blur(80px); pointer-events:none;
}
.cml-hero-inner { max-width:1100px; margin:0 auto; position:relative; z-index:1; text-align:center; }

/* Breadcrumb */
.cml-breadcrumb { display:flex; align-items:center; gap:7px; margin-bottom:20px; }
.cml-bc-link { font-family:var(--mono); font-size:10.5px; font-weight:var(--font-weight-semibold); color:var(--t2); text-decoration:none; transition:color .12s; }
.cml-bc-link:hover { color:var(--math); }
.cml-bc-sep { color:var(--t3); font-size:10px; }
.cml-bc-cur { font-family:var(--mono); font-size:10.5px; font-weight:var(--font-weight-semibold); color:var(--math); }

/* Badge */
.cml-badge {
    display:inline-flex; align-items:center; gap:7px;
    padding:5px 13px 5px 9px;
    background:var(--math-b); border:1px solid var(--math-d);
    border-radius:20px; font-family:var(--mono); font-size:10px;
    font-weight:var(--font-weight-bold); letter-spacing:.08em; text-transform:uppercase;
    color:#a5b4fc; margin-bottom:24px;
}
.cml-badge-dot { width:6px; height:6px; background:var(--math); border-radius:50%; }

/* Titre */
.cml-hero-title {
    font-size:clamp(32px,5vw,56px) !important; font-weight:var(--font-weight-extrabold) !important;
    letter-spacing:-.03em !important; line-height:1.1 !important;
    color:var(--t0) !important; margin:0 0 20px !important;
    background:none !important; -webkit-text-fill-color:var(--t0) !important;
}
.cml-hero-sub { font-size:var(--font-size-md); color:var(--t1); line-height:1.65; max-width:640px; margin:0 auto 36px; }

/* Stats hero */
.cml-hero-stats {
    display:inline-flex; gap:0; margin-bottom:36px;
    background:var(--bg2); border:1px solid var(--b0); border-radius:12px; overflow:hidden;
}
.cml-stat {
    padding:16px 28px; text-align:center;
    border-right:1px solid var(--b0);
}
.cml-stat:last-child { border-right:none; }
.cml-stat-val { font-family:var(--mono); font-size:22px; font-weight:var(--font-weight-extrabold); color:var(--t0); letter-spacing:-1px; margin-bottom:3px; }
.cml-stat-lbl { font-family:var(--mono); font-size:9.5px; font-weight:var(--font-weight-semibold); color:var(--t2); text-transform:uppercase; letter-spacing:.8px; }

/* CTAs */
.cml-hero-ctas { display:flex; flex-direction:column; gap:14px; align-items:center; }

/* Plans tarifaires */
.cml-plans { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.cml-plan {
    position:relative; display:flex; flex-direction:column; align-items:center; gap:6px;
    padding:20px 28px 16px; min-width:160px;
    background:var(--bg2); border:1px solid var(--b0); border-radius:14px;
    text-decoration:none; color:inherit;
    transition:border-color .2s, transform .2s, box-shadow .2s;
}
.cml-plan:hover { transform:translateY(-3px); border-color:rgba(255,255,255,.14); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.cml-plan--best {
    border-color:var(--math-d);
    background:linear-gradient(160deg,rgba(99,102,241,.12),var(--bg2) 60%);
    box-shadow:0 0 0 1px var(--math-d),0 6px 24px rgba(99,102,241,.15);
}
.cml-plan--best:hover { box-shadow:0 0 0 1px rgba(99,102,241,.6),0 10px 32px rgba(99,102,241,.25); }
.cml-plan-ribbon {
    position:absolute; top:-10px; right:14px;
    background:var(--math); color:#fff;
    font-family:var(--mono); font-size:9.5px; font-weight:var(--font-weight-bold);
    padding:3px 9px; border-radius:20px; letter-spacing:.06em;
}
.cml-plan-label { font-family:var(--mono); font-size:9.5px; font-weight:var(--font-weight-bold); letter-spacing:.1em; text-transform:uppercase; color:var(--t2); }
.cml-plan--best .cml-plan-label { color:#a5b4fc; }
.cml-plan-price { display:flex; align-items:baseline; gap:3px; }
.cml-plan-amt { font-family:var(--mono); font-size:28px; font-weight:var(--font-weight-bold); color:var(--t0); line-height:1; }
.cml-plan--best .cml-plan-amt { color:var(--math); }
.cml-plan-per { font-size:var(--font-size-base); color:var(--t2); }
.cml-plan-note { font-size:var(--font-size-sm); color:var(--t2); text-align:center; }
.cml-plan--best .cml-plan-note { color:#a5b4fc; opacity:.8; }
.cml-plan-btn {
    display:inline-block; margin-top:4px;
    font-family:var(--mono); font-size:var(--font-size-base); font-weight:var(--font-weight-semibold);
    padding:6px 16px; border-radius:8px;
    background:rgba(255,255,255,.06); color:var(--t1); transition:background .15s;
}
.cml-plan:hover .cml-plan-btn { background:rgba(255,255,255,.10); color:var(--t0); }
.cml-plan-btn--best { background:var(--math); color:#fff; }
.cml-plan--best:hover .cml-plan-btn--best { background:#4f46e5; }
.cml-see-prog { font-family:var(--mono); font-size:var(--font-size-sm); color:var(--t2); text-decoration:none; transition:color .15s; }
.cml-see-prog:hover { color:var(--t0); }
.cml-cta-save {
    display:inline-block; background:rgba(99,102,241,.25); color:#a5b4fc;
    font-size:9.5px; font-weight:var(--font-weight-bold); padding:2px 7px; border-radius:20px;
}

/* ── hp-btn (réutilise le style homepage) ── */
.hp-btn {
    all:unset; cursor:pointer; box-sizing:border-box;
    display:inline-flex; align-items:center; gap:7px;
    font-family:var(--mono); font-size:var(--font-size-sm); font-weight:var(--font-weight-bold);
    padding:9px 18px; border-radius:8px; text-decoration:none;
    transition:all .13s; white-space:nowrap;
}
.hp-btn--primary {
    color:#fff; background:var(--math);
    border:1px solid rgba(99,102,241,.5);
}
.hp-btn--primary:hover { background:#4f46e5; transform:translateY(-1px); box-shadow:0 6px 20px rgba(99,102,241,.3); }
.hp-btn--ghost {
    color:var(--t1); border:1px solid var(--b0); background:transparent;
}
.hp-btn--ghost:hover { color:var(--t0); border-color:rgba(255,255,255,.15); background:rgba(255,255,255,.04); }

/* ============================================================
   CONTENU
   ============================================================ */
.cml-content { max-width:1100px; margin:0 auto; padding:48px 40px 80px; position:relative; z-index:1; }

/* Section head */
.cml-section { margin-bottom:64px; }
.cml-section-head { margin-bottom:32px; }
.cml-slbl {
    font-family:var(--mono); font-size:9.5px; font-weight:var(--font-weight-bold);
    letter-spacing:.12em; text-transform:uppercase; color:var(--t3);
    display:flex; align-items:center; gap:8px; margin-bottom:8px;
}
.cml-slbl::after { content:''; flex:1; height:1px; background:var(--b0); }
.cml-section-title {
    margin: 0;
}

/* ============================================================
   GRID MODULES
   ============================================================ */
.cml-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    gap:12px;
}
.cml-empty { grid-column:1/-1; text-align:center; padding:48px; color:var(--t1); font-size:var(--font-size-base); }

/* ── CARD ── */
.cml-card {
    background:var(--bg2); border:1px solid var(--b0);
    border-radius:var(--r); overflow:hidden;
    display:flex; flex-direction:column;
    cursor:pointer; transition:border-color .15s, transform .15s, box-shadow .15s;
    position:relative;
}
.cml-card:hover { border-color:var(--math-d); transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.3); }
.cml-card:hover .cml-card-bar { opacity:1; }

/* Barre colorée top */
.cml-card-bar {
    height:3px;
    background:linear-gradient(90deg,var(--math),transparent);
    opacity:.5; transition:opacity .15s;
}

/* Card head */
.cml-card-head {
    padding:16px 18px 14px;
    border-bottom:1px solid var(--b0);
    background:rgba(99,102,241,.04);
}
.cml-card-head-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.cml-card-num { font-family:var(--mono); font-size:9.5px; font-weight:var(--font-weight-bold); color:var(--t2); }
.cml-card-badge {
    font-family:var(--mono); font-size:9px; font-weight:var(--font-weight-bold);
    padding:2px 8px; border-radius:4px; text-transform:uppercase; letter-spacing:.04em;
}
.cml-card-badge--free    { background:var(--grn-b); border:1px solid var(--grn-d); color:var(--grn); }
.cml-card-badge--premium { background:var(--math-b); border:1px solid var(--math-d); color:var(--math); }
.cml-card-title { font-size:var(--font-size-md); font-weight:var(--font-weight-extrabold); color:var(--t0); letter-spacing:-.01em; margin-bottom:6px; line-height:1.3; }
.cml-card-dur { display:flex; align-items:center; gap:5px; font-family:var(--mono); font-size:10px; color:var(--t2); }

/* Card body */
.cml-card-body { padding:14px 18px 16px; flex:1; display:flex; flex-direction:column; gap:12px; }

/* Progress */
.cml-card-progress { display:flex; flex-direction:column; gap:5px; }
.cml-prog-bar { height:4px; background:var(--b0); border-radius:2px; overflow:hidden; }
.cml-prog-fill { height:100%; background:linear-gradient(90deg,var(--math),#22d3ee); border-radius:2px; transition:width .6s ease; }
.cml-prog-txt { font-family:var(--mono); font-size:9.5px; color:var(--t2); }

/* Topics */
.cml-topics { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:5px; }
.cml-topics li { font-size:var(--font-size-sm); color:var(--t1); padding-left:14px; position:relative; line-height:1.5; }
.cml-topics li::before { content:''; position:absolute; left:0; top:6px; width:4px; height:4px; border-radius:50%; background:var(--math); }
.cml-topics--hidden { max-height:0; overflow:hidden; opacity:0; transition:max-height .35s ease, opacity .3s ease; margin-top:0; }
.cml-topics--hidden.open { max-height:600px; opacity:1; }

/* Toggle */
.cml-toggle {
    all: unset;
    cursor: pointer;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 7px !important;  /* était probablement 999px via Elementor */
    font-family: var(--mono) !important;
    font-size: 10px !important;
    font-weight: var(--font-weight-bold) !important;
    color: #a5b4fc !important;
    background: var(--math-b);
    border: 1px solid var(--math-d);
    transition: background .12s;
    width: 100%;
    justify-content: center;
}
.cml-toggle:hover {
    background: rgba(99,102,241,.2);
    color: #e6e8f6 !important;
}
.cml-toggle-ico { transition:transform .2s; flex-shrink:0; }
.cml-toggle[aria-expanded="true"] .cml-toggle-ico { transform:rotate(180deg); }

/* Stats card */
.cml-card-stats { display:flex; justify-content:space-around; padding-top:12px; border-top:1px solid var(--b0); margin-top:auto; }
.cml-cs { text-align:center; }
.cml-cs-val { font-family:var(--mono); font-size:var(--text-medium); font-weight:var(--font-weight-extrabold); color:var(--math); letter-spacing:-1px; }
.cml-cs-lbl { font-family:var(--mono); font-size:9px; font-weight:var(--font-weight-bold); color:var(--t2); text-transform:uppercase; letter-spacing:.6px; margin-top:2px; }

/* ============================================================
   CTA
   ============================================================ */
.cml-cta {
    position:relative; overflow:hidden;
    background:var(--bg2); border:1px solid var(--b0);
    border-radius:var(--r); padding:56px 40px; text-align:center;
}
.cml-cta-glow {
    position:absolute; width:500px; height:400px; border-radius:50%;
    background:radial-gradient(circle,rgba(99,102,241,.12),transparent 70%);
    top:50%; left:50%; transform:translate(-50%,-50%);
    filter:blur(50px); pointer-events:none; z-index:0;
}
.cml-cta-inner { position:relative; z-index:1; }
.cml-cta-title {
    margin-bottom: 12px;
}

.cml-cta-sub {
    font-size: 13px !important;
    color: var(--t1) !important;
    line-height: 1.65 !important;
    max-width: 480px !important;
    margin: 0 auto 24px !important;
    font-family: var(--sans) !important;
}
.cml-cta-btns  { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   SCROLL TOP
   ============================================================ */
.cml-scroll-top {
    all:unset !important; cursor:pointer !important; box-sizing:border-box !important;
    position:fixed !important; bottom:24px !important; right:24px !important;
    width:36px !important; height:36px !important; border-radius:50% !important;
    background:var(--math) !important; display:flex !important;
    align-items:center !important; justify-content:center !important;
    z-index:999 !important; opacity:0 !important; pointer-events:none !important;
    transition:opacity .3s,transform .2s,box-shadow .2s !important; color:#fff !important;
}
.cml-scroll-top.visible { opacity:.9 !important; pointer-events:auto !important; }
.cml-scroll-top:hover   { opacity:1 !important; transform:translateY(-3px) !important; box-shadow:0 8px 20px rgba(99,102,241,.4) !important; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px) {
    .cml-hero    { padding:80px 24px 56px; }
    .cml-content { padding:32px 24px 60px; }
    .cml-hero-stats { display:grid; grid-template-columns:1fr 1fr; width:100%; }
    .cml-stat { border-right:1px solid var(--b0); border-bottom:1px solid var(--b0); }
    .cml-stat:nth-child(2) { border-right:none; }
    .cml-stat:nth-child(3),.cml-stat:nth-child(4) { border-bottom:none; }
    .cml-stat:nth-child(4) { border-right:none; }
}
@media (max-width:600px) {
    .cml-hero    { padding:80px 16px 48px; }
    .cml-content { padding:24px 16px 48px; }
    .cml-grid    { grid-template-columns:1fr; }
    .cml-cta     { padding:36px 20px; }
    .cml-hero-ctas { flex-direction:column; }
    .cml-hero-ctas .hp-btn { justify-content:center; }
}

/* ============================================================
   PRINT
   ============================================================ */
@media print {
    .cml-glow-top,.cml-progress-bar,.cml-scroll-top { display:none !important; }
    .cml-card { break-inside:avoid; }
}