/* =========================================================================
   Rubriques de la page d'accueil (includes/home-sections.php) — refonte 2026-10-08
   Tout est sous .tcf-home (préfixe th-) : spécificité 0,2,0 pour passer devant le thème Eduvalt.
   Plus Jakarta Sans, bleu nuit / bleu / vert, aucun jaune, aucune bordure latérale, rayons ≤ 16 px.
   Écrit « mobile d'abord » (640 px tablette, 1024 px ordinateur).
   ========================================================================= */

.tcf-home {
    --th-ink: #0A1A3A;
    --th-navy: #082A5E;
    --th-deep: #061E45;
    --th-blue: #1363DF;
    --th-blue-dark: #0F52C0;
    --th-blue-tint: #EAF2FF;
    --th-green: #12BB6A;
    --th-green-ink: #0B8A4D;
    --th-green-tint: #E7F8EF;
    --th-orange: #C2410C;
    --th-orange-tint: #FFF1E8;
    --th-red: #DC2626;
    --th-muted: #52627C;
    --th-line: #E4E9F2;
    --th-soft: #F4F7FB;
    --th-shadow: 0 1px 2px rgba(10, 26, 58, 0.05), 0 10px 28px -18px rgba(10, 26, 58, 0.22);
    --th-shadow-lg: 0 2px 6px rgba(10, 26, 58, 0.06), 0 28px 56px -28px rgba(10, 26, 58, 0.35);
    --th-font-text: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.55;
    color: var(--th-ink);
    overflow-x: clip;
    -webkit-font-smoothing: antialiased;
}

/* Remise à zéro (le thème stylise p, h1-h6, a, ul et button) */
.tcf-home *,
.tcf-home *::before,
.tcf-home *::after { box-sizing: border-box; }

/* La table des tarifs (.tcf-pt) garde ses propres styles : elle est exclue de la remise à zéro */
.tcf-home.tcf-home :where(h2, h3, p, ul, ol, li, figure, blockquote):not(:where(.tcf-pt, .tcf-pt *)) {
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
}
.tcf-home.tcf-home :where(ul, ol):not(:where(.tcf-pt *)) { list-style: none; }
.tcf-home.tcf-home :where(a):not(:where(.tcf-pt *)) { color: inherit; text-decoration: none; transition: none; }
.tcf-home.tcf-home :where(button) { font-family: inherit; }
.tcf-home.tcf-home :where(img):not(:where(.tcf-pt *)) { display: block; max-width: 100%; transition: none; }
.tcf-home.tcf-home :where(svg) { flex-shrink: 0; }

/* ── Cadre commun ───────────────────────────────────────────────────── */
.tcf-home .th-wrap { width: 100%; max-width: 1288px; margin: 0 auto; padding: 0 16px; }
.tcf-home .th-section { padding: 56px 0; background: #fff; }
.tcf-home .th-section--soft { background: var(--th-soft); }

/* En-tête de rubrique (refait le 2026-10-08) : pastille à icône, titre net, sous-titre en Inter */
.tcf-home .th-head { position: relative; isolation: isolate; max-width: 760px; margin: 0 auto 36px; text-align: center; }
.tcf-home .th-head--left { max-width: none; margin: 0 0 24px; text-align: left; }

/* Trame de points discrète derrière les en-têtes centrés (rubriques sur fond clair) */
.tcf-home .th-head:not(.th-head--left)::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -56px -12% -24px;
    background-image: radial-gradient(rgba(19, 99, 223, 0.3) 1.1px, transparent 1.5px);
    background-size: 22px 22px;
    mask-image: radial-gradient(ellipse 52% 58% at 50% 42%, #000 0%, rgba(0, 0, 0, 0.35) 55%, transparent 100%);
    pointer-events: none;
}

.tcf-home .th-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 18px;
    padding: 4px 14px 4px 4px;
    background: #fff;
    border: 1px solid #DCE5F2;
    border-radius: 999px;
    box-shadow: 0 1px 2px rgba(10, 26, 58, 0.05), 0 8px 18px -12px rgba(10, 26, 58, 0.28);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--th-navy);
}
.tcf-home .th-pill-icon { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--th-blue); color: #fff; }

.tcf-home .th-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--th-blue);
}
.tcf-home .th-eyebrow::before { content: ""; width: 18px; height: 2px; border-radius: 2px; background: currentColor; opacity: 0.4; }

.tcf-home .th-title {
    font-size: clamp(29px, 3.6vw, 44px);
    font-weight: 780;
    line-height: 1.12;
    letter-spacing: -0.028em;
    color: var(--th-ink);
    text-wrap: balance;
}
.tcf-home .th-title em { font-style: normal; color: var(--th-blue); }
.tcf-home .th-sub {
    max-width: 620px;
    margin-top: 16px;
    font-family: var(--th-font-text);
    font-size: 16.5px;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: -0.008em;
    color: #46536B;
    text-wrap: pretty;
}
.tcf-home .th-head:not(.th-head--left) .th-sub { margin-left: auto; margin-right: auto; text-wrap: balance; }

/* En-tête sur fond sombre */
.tcf-home .th-head--light .th-pill { background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.16); box-shadow: none; color: #DCE8FF; }
.tcf-home .th-head--light .th-pill-icon { background: var(--th-green); color: var(--th-navy); }
.tcf-home .th-head--light .th-title { color: #fff; }
.tcf-home .th-head--light .th-title em { color: var(--th-green); }
.tcf-home .th-head--light .th-sub { color: rgba(255, 255, 255, 0.8); }

.tcf-home .th-center { display: flex; justify-content: center; margin-top: 32px; }

/* ── Boutons, liens, pastilles ──────────────────────────────────────── */
.tcf-home .th-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: 28px; }
.tcf-home .th-actions:empty { display: none; }

.tcf-home .th-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 50px;
    margin: 0;
    padding: 12px 22px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.tcf-home .th-btn:hover { transform: translateY(-1px); }
.tcf-home .th-btn:focus-visible { outline: 2px solid var(--th-blue); outline-offset: 3px; }
.tcf-home .th-btn--primary { background: var(--th-blue); color: #fff; }
.tcf-home .th-btn--primary:hover { background: var(--th-blue-dark); color: #fff; }
.tcf-home .th-btn--green { background: var(--th-green); color: var(--th-navy); }
.tcf-home .th-btn--green:hover { background: #2CCB80; color: var(--th-navy); }
.tcf-home .th-btn--outline { background: #fff; border-color: #D5DEEB; color: var(--th-ink); }
.tcf-home .th-btn--outline:hover { border-color: var(--th-blue); color: var(--th-blue); }
.tcf-home .th-btn--white { background: #fff; color: var(--th-navy); }
.tcf-home .th-btn--white:hover { background: #EAF2FF; color: var(--th-navy); }
.tcf-home .th-btn--ghost { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.32); color: #fff; }
.tcf-home .th-btn--ghost:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.6); color: #fff; }

.tcf-home .th-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    background: #EEF2F8;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.3;
    color: #3B4A63;
}

.tcf-home .th-checks { display: grid; gap: 10px; }
.tcf-home .th-checks li { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; line-height: 1.5; color: #33435C; }
.tcf-home .th-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    border-radius: 50%;
    background: var(--th-green-tint);
    color: var(--th-green-ink);
    flex-shrink: 0;
}

.tcf-home .th-live {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--th-green);
    box-shadow: 0 0 0 4px rgba(18, 187, 106, 0.18);
    flex-shrink: 0;
}

/* ── 2. Les 4 épreuves ──────────────────────────────────────────────────
   En-tête titre | texte | bouton (modèle de Kamlo du 2026-10-08) ; cartes refaites le même jour :
   bandeau de couleur (numéro, famille, icône en relief), titre affirmé, format en étiquettes,
   texte contrasté, points avec coche pleine, bouton pleine largeur.
   Couleurs : compréhension = bleu / bleu nuit, expression = vert / vert foncé. */
.tcf-home .th-tests { background: #EEF4FD; }

.tcf-home .th-tests-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-bottom: 32px; }
.tcf-home .th-tests-head .th-title { font-size: clamp(28px, 3.4vw, 40px); }
.tcf-home .th-tests-head-text { font-family: var(--th-font-text); font-size: 16px; line-height: 1.7; letter-spacing: -0.008em; color: #46536B; }
.tcf-home .th-tests-head .th-pill { border-color: #D3E0F3; }
.tcf-home .th-btn--pill { border-radius: 999px; padding-left: 24px; padding-right: 24px; }

.tcf-home .th-tests-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }

/* Couleurs par carte (--tc-soft : bandeau pâle de la version allégée du 2026-10-08) */
.tcf-home .th-test--blue   { --tc: #1363DF; --tc-tint: #EAF2FF; --tc-soft: #DCE8FC; --tc-ink: #1363DF; --tc-on: #fff; }
.tcf-home .th-test--navy   { --tc: #082A5E; --tc-tint: #E8EEF8; --tc-soft: #DCE3EF; --tc-ink: #082A5E; --tc-on: #fff; }
.tcf-home .th-test--green  { --tc: #12BB6A; --tc-tint: #E7F8EF; --tc-soft: #D6F2E4; --tc-ink: #0B8A4D; --tc-on: #082A5E; }
.tcf-home .th-test--forest { --tc: #0B8A4D; --tc-tint: #E3F4EA; --tc-soft: #D3EBDD; --tc-ink: #0B7A44; --tc-on: #fff; }

.tcf-home .th-test {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid #DFE7F2;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(10, 26, 58, 0.04), 0 18px 40px -32px rgba(10, 26, 58, 0.4);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.tcf-home .th-test:hover {
    transform: translateY(-4px);
    border-color: #C9D6E8;
    box-shadow: 0 2px 6px rgba(10, 26, 58, 0.06), 0 34px 64px -36px rgba(10, 26, 58, 0.5);
}

/* Bandeau pâle (version allégée du 2026-10-08, l'aplat vif était jugé trop fort) :
   teinte de l'épreuve, trame de points et anneau dans sa couleur, numéro sur pastille blanche */
.tcf-home .th-test-head {
    position: relative;
    height: 104px;
    padding: 18px 20px;
    background-color: var(--tc-soft);
    background-image:
        radial-gradient(160px 120px at 100% 0%, rgba(255, 255, 255, 0.7), transparent 70%),
        radial-gradient(color-mix(in srgb, var(--tc) 20%, transparent) 1px, transparent 1.2px);
    background-size: auto, 14px 14px;
    color: var(--tc-ink);
}
.tcf-home .th-test-head::after {
    content: "";
    position: absolute;
    right: -46px;
    bottom: -70px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    border: 26px solid color-mix(in srgb, var(--tc) 8%, transparent);
    clip-path: inset(0 0 70px 0); /* l'anneau s'arrête au bas du bandeau (l'icône, elle, déborde) */
}
.tcf-home .th-test-num {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(10, 26, 58, 0.06);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    font-variant-numeric: tabular-nums;
}
.tcf-home .th-test-family {
    position: absolute;
    top: 23px;
    right: 20px;
    z-index: 1;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.92;
}
.tcf-home .th-test-icon {
    position: absolute;
    left: 20px;
    bottom: -22px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(10, 26, 58, 0.08), 0 12px 24px -12px rgba(10, 26, 58, 0.45);
    color: var(--tc-ink);
    transition: transform 0.2s ease;
}
.tcf-home .th-test:hover .th-test-icon { transform: translateY(-2px); }

/* Corps */
.tcf-home .th-test-body { display: flex; flex-direction: column; flex: 1; padding: 38px 22px 22px; }
.tcf-home .th-test-title { font-size: 21px; font-weight: 800; line-height: 1.25; letter-spacing: -0.02em; color: #0A1A3A; }
.tcf-home .th-test-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.tcf-home .th-test-meta li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 8px;
    background: var(--tc-tint);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    color: #0F172A;
}
.tcf-home .th-test-meta svg { color: var(--tc-ink); }
.tcf-home .th-test-text { margin-top: 14px; font-size: 15px; line-height: 1.65; color: #475569; }
.tcf-home .th-test-points { display: grid; gap: 11px; margin: 18px 0 22px; padding-top: 18px; border-top: 1px solid #EDF1F7; }
.tcf-home .th-test-points li { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; font-weight: 500; line-height: 1.45; color: #1E293B; }
.tcf-home .th-test-tick {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    border-radius: 50%;
    background: var(--tc-soft);
    color: var(--tc-ink);
    flex-shrink: 0;
}
.tcf-home .th-test-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 48px;
    margin-top: auto;
    padding: 0 16px;
    border-radius: 10px;
    background: var(--tc-tint);
    font-size: 15px;
    font-weight: 700;
    color: var(--tc-ink);
    transition: background 0.15s ease, color 0.15s ease;
}
.tcf-home .th-test-cta svg { transition: transform 0.15s ease; }
.tcf-home .th-test-cta:hover { background: var(--tc); color: var(--tc-on); }
.tcf-home .th-test-cta:hover svg { transform: translateX(3px); }

/* ── 3. Simulateurs ─────────────────────────────────────────────────── */
/* En-tête « titre | texte + sélecteur EE / EO » (2026-10-08), filet bleu puis gris en dessous */
.tcf-home .th-sims-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    margin-bottom: 28px;
    padding-bottom: 28px;
    background: linear-gradient(90deg, var(--th-blue) 0 72px, var(--th-line) 72px) left bottom / 100% 2px no-repeat;
}
.tcf-home .th-sims-head .th-pill { margin-bottom: 16px; }
.tcf-home .th-sims-head-text { max-width: 480px; font-family: var(--th-font-text); font-size: 16px; line-height: 1.7; letter-spacing: -0.008em; color: #46536B; }
.tcf-home .th-sims-head-side .th-tabs { margin-top: 18px; }
.tcf-home .th-sims-copy .th-panel { margin-top: 0; }
.tcf-home .th-sims-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: center; }

.tcf-home .th-tabs { display: flex; gap: 4px; padding: 4px; background: #fff; border: 1px solid var(--th-line); border-radius: 12px; }
.tcf-home .th-tab {
    display: inline-flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    margin: 0;
    padding: 9px 10px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    color: var(--th-muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.tcf-home .th-tab:hover { background: transparent; color: var(--th-ink); }
.tcf-home .th-tab.is-active { background: var(--th-navy); color: #fff; }
.tcf-home .th-tab:focus-visible { outline: 2px solid var(--th-blue); outline-offset: 2px; }

.tcf-home .th-panel { margin-top: 22px; }
.tcf-home .th-panel[hidden] { display: none; }
.tcf-home .th-panel.is-active { animation: th-fade 0.25s ease; }
@keyframes th-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.tcf-home .th-feats { display: grid; gap: 6px; }
.tcf-home .th-feats li { display: flex; align-items: flex-start; gap: 14px; padding: 10px 0; }
.tcf-home .th-feat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    background: #fff;
    border: 1px solid var(--th-line);
    color: var(--th-blue);
    flex-shrink: 0;
}
.tcf-home .th-feats b { display: block; font-size: 15.5px; font-weight: 700; line-height: 1.4; color: var(--th-ink); }
.tcf-home .th-feats small { display: block; margin-top: 2px; font-size: 14px; line-height: 1.55; color: var(--th-muted); }
.tcf-home .th-panel .th-actions { margin-top: 22px; }

/* Appareils dessinés */
.tcf-home .th-devices { position: relative; padding: 12px 0 40px; }
.tcf-home .th-laptop { position: relative; width: 100%; max-width: 680px; margin: 0 auto; }
.tcf-home .th-laptop-screen { padding: 10px 10px 12px; background: #0E1A30; border-radius: 16px 16px 4px 4px; box-shadow: var(--th-shadow-lg); }
.tcf-home .th-laptop-base { position: relative; height: 14px; margin: 0 -6%; background: linear-gradient(180deg, #DCE3EC, #AEB9C9); border-radius: 2px 2px 12px 12px; }
.tcf-home .th-laptop-base::before { content: ""; position: absolute; top: 0; left: 50%; width: 16%; height: 5px; transform: translateX(-50%); background: #9AA6B8; border-radius: 0 0 6px 6px; }

.tcf-home .th-ui { overflow: hidden; background: #F3F6FB; border-radius: 6px; font-size: 10px; line-height: 1.4; color: var(--th-ink); }
.tcf-home .th-ui p { line-height: 1.4; }
.tcf-home .th-ui-bar { display: flex; align-items: center; gap: 5px; padding: 7px 10px; background: #fff; border-bottom: 1px solid #E8EDF5; }
.tcf-home .th-ui-bar i { width: 7px; height: 7px; border-radius: 50%; background: #E2E8F0; }
.tcf-home .th-ui-bar span { margin-left: 8px; padding: 2px 10px; border-radius: 999px; background: #F1F5F9; font-size: 9px; color: #64748B; }
.tcf-home .th-ui-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px 34px;
    background-color: var(--th-blue);
    background-image: linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 18px 18px;
    color: #fff;
}
.tcf-home .th-ui-kicker { font-size: 8px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.78); }
.tcf-home .th-ui-kicker--dark { color: var(--th-muted); }
.tcf-home .th-ui-h { margin-top: 4px; font-size: 15px; font-weight: 800; letter-spacing: -0.01em; }
.tcf-home .th-ui-score { text-align: right; }
.tcf-home .th-ui-big { font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -0.03em; }
.tcf-home .th-ui-big small { font-size: 13px; font-weight: 700; opacity: 0.75; }
.tcf-home .th-ui-big--dark { color: var(--th-ink); }
.tcf-home .th-ui-scale { display: flex; gap: 8px; margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255, 255, 255, 0.3); font-size: 8px; font-weight: 700; color: rgba(255, 255, 255, 0.6); }
.tcf-home .th-ui-scale .is-on { color: #fff; }
.tcf-home .th-ui-body { margin: -22px 12px 12px; padding: 12px; background: #fff; border-radius: 10px; box-shadow: 0 6px 18px -10px rgba(10, 26, 58, 0.3); }
.tcf-home .th-ui-tasks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.tcf-home .th-ui-task { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 9px; border: 1px solid #E5EAF2; border-radius: 8px; }
.tcf-home .th-ui-task.is-on { border-color: var(--th-blue); background: #F5F9FF; }
.tcf-home .th-ui-task b { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 5px; background: var(--th-blue-tint); font-size: 9px; color: var(--th-blue); }
.tcf-home .th-ui-task.is-on b { background: var(--th-blue); color: #fff; }
.tcf-home .th-ui-task span { font-size: 7.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #64748B; }
.tcf-home .th-ui-task em { display: block; margin-top: 2px; font-size: 10px; font-style: normal; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--th-ink); }
.tcf-home .th-ui-task strong { position: absolute; top: 8px; right: 8px; padding: 1px 5px; border-radius: 5px; background: var(--th-green-tint); font-size: 10px; color: var(--th-green-ink); }
.tcf-home .th-ui-task strong.is-mid { background: var(--th-orange-tint); color: var(--th-orange); }
.tcf-home .th-ui-task strong small { font-size: 8px; opacity: 0.8; }
.tcf-home .th-ui-crit { margin-top: 10px; padding: 10px; border: 1px solid #E5EAF2; border-radius: 8px; }
.tcf-home .th-ui-crit-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 2px 0 6px; font-size: 10.5px; font-weight: 700; }
.tcf-home .th-ui-li + .th-ui-crit-h { margin-top: 10px; padding-top: 8px; border-top: 1px solid #EEF2F8; }
.tcf-home .th-ui-li { display: flex; align-items: flex-start; gap: 6px; margin-top: 4px; font-size: 9.5px; color: #3A4A63; }
.tcf-home .th-ui-crit-h + .th-ui-li { margin-top: 0; }
.tcf-home .th-ui-li i { width: 10px; height: 10px; margin-top: 1px; border-radius: 50%; border: 1.5px solid var(--th-green); flex-shrink: 0; }
.tcf-home .th-ui-li i.ko { border-color: var(--th-red); }
.tcf-home .th-ui-tag { padding: 2px 7px; border-radius: 5px; background: var(--th-green-tint); font-size: 8.5px; font-weight: 700; color: var(--th-green-ink); white-space: nowrap; }
.tcf-home .th-ui-tag--warn { background: var(--th-orange-tint); color: var(--th-orange); }
.tcf-home .th-ui-tag--blue { padding: 3px 8px; background: var(--th-blue-tint); font-size: 10px; color: var(--th-blue); }

.tcf-home .th-phone {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 36%;
    max-width: 200px;
    min-width: 140px;
    padding: 7px;
    background: #0E1A30;
    border-radius: 16px;
    box-shadow: var(--th-shadow-lg);
}
.tcf-home .th-phone-screen { position: relative; overflow: hidden; padding: 20px 10px 12px; background: #fff; border-radius: 11px; font-size: 9px; line-height: 1.4; }
.tcf-home .th-phone-screen p { line-height: 1.4; }
.tcf-home .th-phone-notch { position: absolute; top: 6px; left: 50%; width: 38%; height: 6px; transform: translateX(-50%); background: #0E1A30; border-radius: 999px; }
.tcf-home .th-phone-score { display: flex; align-items: center; justify-content: space-between; margin-top: 6px; }
.tcf-home .th-phone-score .th-ui-big { font-size: 26px; }
.tcf-home .th-phone-audio { display: flex; align-items: center; gap: 6px; margin-top: 10px; padding: 7px; background: var(--th-soft); border-radius: 9px; }
.tcf-home .th-phone-play { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--th-blue); color: #fff; flex-shrink: 0; }
.tcf-home .th-phone-wave { display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0; height: 18px; overflow: hidden; }
.tcf-home .th-phone-wave i { width: 2px; border-radius: 2px; background: #C5D3E8; flex-shrink: 0; }
.tcf-home .th-phone-wave i.on { background: var(--th-blue); }
.tcf-home .th-phone-audio small { font-size: 8px; font-weight: 700; color: var(--th-muted); }
.tcf-home .th-phone-box { margin-top: 8px; padding: 7px 8px; border-radius: 8px; }
.tcf-home .th-phone-box p { margin-bottom: 3px; font-size: 8.5px; font-weight: 800; }
.tcf-home .th-phone-box span { display: block; font-size: 8.5px; color: #3A4A63; }
.tcf-home .th-phone-box span::before { content: "• "; }
.tcf-home .th-phone-box--good { background: #F0FAF4; }
.tcf-home .th-phone-box--good p { color: var(--th-green-ink); }
.tcf-home .th-phone-box--work { background: var(--th-orange-tint); }
.tcf-home .th-phone-box--work p { color: var(--th-orange); }
.tcf-home .th-phone-label { margin-top: 9px; font-size: 8.5px; font-weight: 800; color: var(--th-ink); }
.tcf-home .th-phone-parts { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.tcf-home .th-phone-parts span { padding: 2px 6px; border-radius: 5px; background: var(--th-blue-tint); font-size: 8px; font-weight: 700; color: var(--th-blue); }

/* Pastilles flottantes */
.tcf-home .th-float {
    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 10px 10px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(228, 233, 242, 0.9);
    border-radius: 12px;
    box-shadow: var(--th-shadow-lg);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    font-size: 13px;
    line-height: 1.3;
}
.tcf-home .th-float b { display: block; font-size: 13.5px; font-weight: 800; color: var(--th-ink); }
.tcf-home .th-float small { display: block; font-size: 12px; color: var(--th-muted); }
.tcf-home .th-float small s { color: var(--th-red); }
.tcf-home .th-float-icon { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: var(--th-blue-tint); color: var(--th-blue); flex-shrink: 0; }
.tcf-home .th-float-icon--red { background: #FDECEC; color: var(--th-red); }
.tcf-home .th-float-icon--green { background: var(--th-green-tint); color: var(--th-green-ink); }
.tcf-home .th-float--error { display: none; }
.tcf-home .th-float--pdf { left: 0; bottom: 0; }

/* ── 4. Examen blanc du samedi ──────────────────────────────────────── */
.tcf-home .th-exam {
    padding: 64px 0;
    background-color: var(--th-navy);
    background-image:
        radial-gradient(600px 320px at 85% 10%, rgba(19, 99, 223, 0.45), transparent 70%),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: auto, 36px 36px, 36px 36px;
    color: #fff;
}
.tcf-home .th-exam-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: center; }
.tcf-home .th-exam-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 4px; }
.tcf-home .th-exam-steps li { display: flex; align-items: center; gap: 10px; padding: 12px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 12px; }
.tcf-home .th-exam-steps b { display: block; font-size: 13.5px; font-weight: 700; line-height: 1.3; color: #fff; }
.tcf-home .th-exam-steps small { display: block; font-size: 12.5px; color: rgba(255, 255, 255, 0.65); }
.tcf-home .th-exam-step-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(18, 187, 106, 0.16); color: var(--th-green); flex-shrink: 0; }
.tcf-home .th-exam-note { display: flex; align-items: center; gap: 8px; margin-top: 18px; font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, 0.7); }
.tcf-home .th-exam-note svg { color: var(--th-green); }

.tcf-home .th-exam-card { padding: 22px 18px; background: #fff; border-radius: 16px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.55); color: var(--th-ink); }
.tcf-home .th-exam-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.tcf-home .th-exam-card-head p { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--th-navy); }
.tcf-home .th-exam-date { font-size: 14px; font-weight: 700; color: var(--th-blue); }
/* Compte à rebours compact (cases réduites à la demande de Kamlo le 2026-10-08) */
.tcf-home .th-countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.tcf-home .th-countdown div { padding: 9px 4px 8px; background: var(--th-navy); border-radius: 10px; text-align: center; }
.tcf-home .th-countdown b { display: block; font-size: clamp(20px, 5.4vw, 25px); font-weight: 800; line-height: 1; letter-spacing: -0.01em; color: #fff; font-variant-numeric: tabular-nums; }
.tcf-home .th-countdown span { display: block; margin-top: 4px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.02em; color: rgba(255, 255, 255, 0.65); }
.tcf-home .th-exam-local { margin-top: 12px; font-size: 13.5px; color: var(--th-muted); }
.tcf-home .th-exam-local strong { color: var(--th-ink); }
.tcf-home .th-exam-result { margin-top: 18px; padding-top: 18px; border-top: 1px solid #EEF2F8; }
.tcf-home .th-exam-result-h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 6px; }
.tcf-home .th-exam-result-h p { font-size: 15px; font-weight: 800; color: var(--th-ink); }
.tcf-home .th-exam-result-h span { font-size: 12.5px; font-weight: 600; color: var(--th-muted); }
.tcf-home .th-exam-row { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) 64px; align-items: center; gap: 12px; padding: 8px 0; font-size: 13.5px; }
.tcf-home .th-exam-row-name { font-weight: 600; line-height: 1.3; color: #33435C; }
.tcf-home .th-exam-row-name small { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; color: #8592A8; }
.tcf-home .th-exam-row b { font-size: 13px; font-weight: 800; text-align: right; color: var(--th-navy); }
.tcf-home .th-exam-result-note { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 10px 12px; background: var(--th-green-tint); border-radius: 10px; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--th-green-ink); }
.tcf-home .th-exam-result-note .th-check { margin-top: 0; background: var(--th-green); color: #fff; }
.tcf-home .th-bar { height: 7px; background: #EEF2F8; border-radius: 999px; overflow: hidden; }
.tcf-home .th-bar i { display: block; height: 100%; border-radius: inherit; background: var(--th-blue); }
.tcf-home .th-bar--green i { background: var(--th-green); }

/* ── 5. Comment ça marche ───────────────────────────────────────────────
   Refait le 2026-10-08 : cartes en progression (icône bleu pâle → bleu → bleu nuit), dernière
   étape = objectif, carte bleu nuit à icône verte ; grand numéro, étiquette, flèche vers l'étape suivante. */
.tcf-home .th-steps-list { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.tcf-home .th-step {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 22px 20px 20px;
    background: #F5F8FD;
    border: 1px solid #E3EAF5;
    border-radius: 16px;
}
.tcf-home .th-step-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.tcf-home .th-step-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--th-blue-tint);
    color: var(--th-blue);
}
.tcf-home .th-step--2 .th-step-icon { background: var(--th-blue); color: #fff; }
.tcf-home .th-step--3 .th-step-icon { background: var(--th-navy); color: #fff; }
.tcf-home .th-step-num { font-size: 42px; font-weight: 800; line-height: 0.9; letter-spacing: -0.04em; color: #D9E3F2; font-variant-numeric: tabular-nums; }
.tcf-home .th-step h3 { margin-top: 18px; font-size: 18px; font-weight: 800; line-height: 1.3; letter-spacing: -0.015em; color: var(--th-ink); }
.tcf-home .th-step p { margin: 8px 0 18px; font-family: var(--th-font-text); font-size: 14.5px; line-height: 1.65; letter-spacing: -0.005em; color: #52627C; }
.tcf-home .th-step-tag {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding: 5px 11px 5px 9px;
    background: #fff;
    border: 1px solid #DFE7F3;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--th-navy);
}
.tcf-home .th-step-tag svg { color: var(--th-blue); }
.tcf-home .th-step-arrow { display: none; }

/* Dernière étape : l'objectif */
.tcf-home .th-step--goal {
    background-color: var(--th-navy);
    background-image: radial-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1.4px);
    background-size: 18px 18px;
    border-color: var(--th-navy);
    box-shadow: 0 24px 44px -26px rgba(8, 42, 94, 0.75);
}
.tcf-home .th-step--goal .th-step-icon { background: var(--th-green); color: var(--th-navy); }
.tcf-home .th-step--goal .th-step-num { color: rgba(255, 255, 255, 0.16); }
.tcf-home .th-step--goal h3 { color: #fff; }
.tcf-home .th-step--goal p { color: rgba(255, 255, 255, 0.76); }
.tcf-home .th-step--goal .th-step-tag { background: rgba(18, 187, 106, 0.16); border-color: rgba(18, 187, 106, 0.4); color: #6BE3A8; }
.tcf-home .th-step--goal .th-step-tag svg { color: currentColor; }

/* En-tête « grand numéro | titre | bouton » (2026-10-08) : numéro bleu qui s'estompe, annonce les cartes 01 à 04
   (pas de contour : la police variable laisse voir ses tracés superposés) */
.tcf-home .th-steps-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-bottom: 32px; }
.tcf-home .th-steps-count { display: flex; align-items: flex-end; gap: 10px; }
.tcf-home .th-steps-count b {
    padding-bottom: 0.04em;
    font-size: 76px;
    font-weight: 800;
    line-height: 0.82;
    letter-spacing: -0.05em;
    background: linear-gradient(180deg, var(--th-blue) 10%, rgba(19, 99, 223, 0.12) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-variant-numeric: tabular-nums;
}
.tcf-home .th-steps-count span { padding: 4px 10px; border-radius: 999px; background: var(--th-green-tint); font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--th-green-ink); }
.tcf-home .th-steps-head-copy .th-sub { margin-top: 12px; }
.tcf-home .th-steps-head-action .th-btn { width: 100%; }

/* ── 6. Témoignages : mur de captures WhatsApp ──────────────────────── */
/* Fond refait le 2026-10-08 : bleu nuit en profondeur, halo bleu derrière le mur, touche de vert
   sous le bouton, anneaux concentriques et trame de points estompés derrière le texte. */
.tcf-home .th-testi {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background-color: #061A3D;
    background-image:
        radial-gradient(560px 460px at 80% 50%, rgba(19, 99, 223, 0.42), transparent 70%),
        radial-gradient(460px 320px at 4% 100%, rgba(18, 187, 106, 0.16), transparent 70%),
        radial-gradient(760px 420px at 18% 0%, rgba(19, 99, 223, 0.22), transparent 70%),
        linear-gradient(180deg, #082656 0%, #051634 100%);
    color: #fff;
}
.tcf-home .th-testi::before,
.tcf-home .th-testi::after { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; }
.tcf-home .th-testi::before {
    background-image: repeating-radial-gradient(circle at 16% 46%, transparent 0 109px, rgba(255, 255, 255, 0.07) 110px 111px, transparent 112px 150px);
    mask-image: radial-gradient(circle at 16% 46%, #000 0%, rgba(0, 0, 0, 0.4) 30%, transparent 52%);
}
.tcf-home .th-testi::after {
    background-image: radial-gradient(rgba(255, 255, 255, 0.11) 1px, transparent 1.4px);
    background-size: 22px 22px;
    mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.5) 35%, transparent 60%);
}
.tcf-home .th-testi-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: center; }

.tcf-home .th-wall-wrap { position: relative; }
.tcf-home .th-wall {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    height: 460px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(transparent, #000 14%, #000 86%, transparent);
    mask-image: linear-gradient(transparent, #000 14%, #000 86%, transparent);
}
.tcf-home .th-wall-col--3 { display: none; }
/* Défilement lancé par home-sections.js (classe is-ready) une fois les captures chargées : sinon la hauteur
   des colonnes change en cours de route (sauts, boucle décalée), surtout sur téléphone (corrigé le 2026-10-08) */
.tcf-home .th-wall-track { display: flex; flex-direction: column; gap: 14px; animation: th-wall-up 44s linear infinite; animation-play-state: paused; will-change: transform; }
.tcf-home .th-wall-col--2 .th-wall-track { animation-name: th-wall-down; animation-duration: 52s; }
.tcf-home .th-wall-col--3 .th-wall-track { animation-duration: 48s; }
.tcf-home .th-wall.is-ready .th-wall-track { animation-play-state: running; }
/* Pause au survol à la souris seulement (au doigt, le survol reste « collé ») et au clavier */
@media (hover: hover) and (pointer: fine) {
    .tcf-home .th-wall.is-ready:hover .th-wall-track { animation-play-state: paused; }
}
.tcf-home .th-wall.is-ready:has(.th-wall-item:focus-visible) .th-wall-track { animation-play-state: paused; }
@keyframes th-wall-up { from { transform: translateY(0); } to { transform: translateY(calc(-50% - 7px)); } }
@keyframes th-wall-down { from { transform: translateY(calc(-50% - 7px)); } to { transform: translateY(0); } }

.tcf-home .th-wall-item {
    position: relative;
    display: block;
    overflow: hidden;
    background: #0F1D3A;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
    cursor: zoom-in;
    transition: border-color 0.2s ease;
}
.tcf-home .th-wall-item:hover { border-color: rgba(255, 255, 255, 0.32); }
.tcf-home .th-wall-item:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.tcf-home .th-wall-item img { width: 100%; height: auto; }
.tcf-home .th-wall-zoom {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: rgba(6, 18, 43, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    color: #fff;
    opacity: 0;
    transition: opacity 0.15s ease;
}
.tcf-home .th-wall-item:hover .th-wall-zoom,
.tcf-home .th-wall-item:focus-visible .th-wall-zoom { opacity: 1; }
.tcf-home .th-wall-hint {
    position: absolute;
    bottom: 12px;
    left: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px 8px 12px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    color: #fff;
    transform: translateX(-50%);
    pointer-events: none;
}
.tcf-home .th-wall-hint svg { color: #8DB5FF; }
.tcf-home .th-wall-hint--touch { display: none; }
@media (hover: none), (pointer: coarse) {
    .tcf-home .th-wall-hint--click { display: none; }
    .tcf-home .th-wall-hint--touch { display: inline; }
}

.tcf-home .th-zoom { width: auto; max-width: min(520px, calc(100% - 32px)); max-height: calc(100% - 32px); margin: auto; padding: 0; overflow: visible; background: transparent; border: 0; }
.tcf-home .th-zoom[open] { animation: th-fade 0.2s ease; }
.tcf-home .th-zoom::backdrop { background: rgba(6, 18, 43, 0.85); }
.tcf-home .th-zoom img { width: auto; max-width: 100%; height: auto; max-height: calc(100vh - 48px); border-radius: 14px; }
.tcf-home .th-zoom-close {
    position: fixed;
    top: 16px;
    right: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    color: var(--th-ink);
    cursor: pointer;
}

/* Chevrons précédent / suivant (2026-10-11) : sur les bords de la capture au téléphone, à côté dès 640 px */
.tcf-home .th-zoom-nav {
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: -22px 0 0;
    padding: 0;
    background: rgba(255, 255, 255, 0.92);
    border: 0;
    border-radius: 50%;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    color: var(--th-ink);
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease;
}
.tcf-home .th-zoom-nav--prev { left: 8px; }
.tcf-home .th-zoom-nav--next { right: 8px; }
.tcf-home .th-zoom-nav:hover { background: #fff; transform: scale(1.06); }
.tcf-home .th-zoom-nav:focus-visible { outline: 3px solid #8DB5FF; outline-offset: 3px; }
@media (min-width: 640px) {
    .tcf-home .th-zoom-nav { width: 48px; height: 48px; margin-top: -24px; background: #fff; }
    .tcf-home .th-zoom-nav--prev { left: -68px; }
    .tcf-home .th-zoom-nav--next { right: -68px; }
}

/* ── 7. Tarifs (table [tcf_pricing], styles dans pricing-table.css) ──── */
.tcf-home .th-pricing { background: var(--th-soft); }
.tcf-home .th-pricing--no-formcard .tcf-formcard { display: none; } /* la rubrique « Formateur » suit */

/* En-tête propre à l'accueil (2026-10-08) : mot clé souligné d'un trait vert tracé à la main, points rassurants.
   Celui du shortcode (partagé avec /pricing/) est masqué. */
.tcf-home .th-pricing--head { padding-top: 56px; }
.tcf-home .th-pricing--head .tcf-pt-header { display: none; }
.tcf-home .th-pricing--head .tcf-pt { padding-top: 0; }
.tcf-home .th-price-head { max-width: 980px; margin: 0 auto 28px; text-align: center; }
.tcf-home .th-price-head .th-title { font-size: clamp(30px, 4vw, 48px); }
.tcf-home .th-price-head .th-title em { position: relative; display: inline-block; white-space: nowrap; }
.tcf-home .th-price-head .th-title em::after {
    content: "";
    position: absolute;
    left: -3%;
    bottom: -0.2em;
    width: 106%;
    height: 0.34em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 10.5C46 4 122 1.8 197 6.2' fill='none' stroke='%2312BB6A' stroke-width='4.5' stroke-linecap='round'/%3E%3Cpath d='M32 12.4C80 8.6 136 7.4 178 9' fill='none' stroke='%2312BB6A' stroke-width='2.4' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    pointer-events: none;
}
.tcf-home .th-price-head .th-sub { margin-top: 20px; margin-left: auto; margin-right: auto; text-wrap: balance; }
.tcf-home .th-price-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 10px; margin-top: 22px; }
.tcf-home .th-price-chips li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 6px 7px;
    background: #fff;
    border: 1px solid #DFE7F3;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--th-navy);
}
.tcf-home .th-price-chips .th-check { margin-top: 0; background: var(--th-green); color: #fff; }

/* ── 8. Formation avec formateur ────────────────────────────────────── */
.tcf-home .th-coach-card { display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden; background: #fff; border: 1px solid var(--th-line); border-radius: 16px; }
.tcf-home .th-coach-media { position: relative; min-height: 280px; }
.tcf-home .th-coach-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.tcf-home .th-float--live { top: 16px; left: 16px; padding: 10px 14px; }
.tcf-home .th-float--sessions { right: 16px; bottom: 16px; }
.tcf-home .th-coach-copy { padding: 28px 20px; }
.tcf-home .th-coach-copy .th-head { margin-bottom: 0; }
.tcf-home .th-coach-copy .th-checks { margin-top: 22px; }
/* Avantages du formateur en petites cartes (2026-10-08) : coche verte pleine, Inter, l'essentiel en gras */
.tcf-home .th-coach-feats { gap: 10px; }
.tcf-home .th-coach-feats li {
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: #F5F8FD;
    border: 1px solid #E6EDF7;
    border-radius: 12px;
    font-family: var(--th-font-text);
    font-size: 14.5px;
    line-height: 1.45;
    letter-spacing: -0.006em;
    color: #3A475E;
}
.tcf-home .th-coach-feats strong { font-weight: 600; color: var(--th-ink); }
.tcf-home .th-coach-feats .th-check { width: 24px; height: 24px; margin-top: 0; background: var(--th-green); color: #fff; }
.tcf-home .th-coach-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }

/* ── 9. Ressources gratuites ────────────────────────────────────────── */
.tcf-home .th-res-tiles { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.tcf-home .th-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 196px;
    padding: 22px;
    overflow: hidden;
    border-radius: 16px;
    color: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tcf-home .th-tile:hover { transform: translateY(-2px); box-shadow: var(--th-shadow-lg); color: #fff; }
.tcf-home .th-tile::after { content: ""; position: absolute; right: -40px; bottom: -60px; width: 180px; height: 180px; border-radius: 50%; border: 28px solid rgba(255, 255, 255, 0.08); }
.tcf-home .th-tile--blue { background: var(--th-blue); }
.tcf-home .th-tile--navy { background: var(--th-navy); }
.tcf-home .th-tile--green,
.tcf-home .th-tile--green:hover { background: var(--th-green); color: var(--th-navy); }
.tcf-home .th-tile--green::after { border-color: rgba(8, 42, 94, 0.08); }
.tcf-home .th-tile-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-bottom: 8px; border-radius: 12px; background: rgba(255, 255, 255, 0.16); }
.tcf-home .th-tile--green .th-tile-icon { background: rgba(255, 255, 255, 0.35); }
.tcf-home .th-tile-title { font-size: 19px; font-weight: 800; line-height: 1.3; letter-spacing: -0.01em; }
.tcf-home .th-tile-text { max-width: 320px; font-size: 14.5px; line-height: 1.55; opacity: 0.86; }
.tcf-home .th-tile-go { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 10px; font-size: 14px; font-weight: 700; }

/* ── 10. FAQ ────────────────────────────────────────────────────────── */
.tcf-home .th-faq-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
.tcf-home .th-ask { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 24px; overflow: hidden; background: var(--th-navy); border-radius: 16px; color: #fff; }
.tcf-home .th-ask::after { content: ""; position: absolute; right: -50px; top: -50px; width: 160px; height: 160px; border-radius: 50%; border: 26px solid rgba(255, 255, 255, 0.06); }
.tcf-home .th-ask-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-bottom: 6px; border-radius: 12px; background: rgba(18, 187, 106, 0.16); color: var(--th-green); }
.tcf-home .th-ask-title { font-size: 19px; font-weight: 800; line-height: 1.3; }
.tcf-home .th-ask-text { font-size: 14.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.75); }
.tcf-home .th-ask .th-btn { position: relative; z-index: 1; margin-top: 10px; }

.tcf-home .th-faq-list { display: grid; gap: 10px; }
.tcf-home .th-faq-item { background: #fff; border: 1px solid var(--th-line); border-radius: 14px; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
/* Question ouverte : bordure bleue tout autour + halo, question en bleu (demande de Kamlo du 2026-10-08) */
.tcf-home .th-faq-item[open] { border-color: var(--th-blue); box-shadow: 0 0 0 3px rgba(19, 99, 223, 0.1), var(--th-shadow); }
.tcf-home .th-faq-item[open] summary { color: var(--th-blue); }
.tcf-home .th-faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 60px;
    padding: 16px 18px;
    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--th-ink);
    list-style: none;
    cursor: pointer;
}
.tcf-home .th-faq-item summary::-webkit-details-marker { display: none; }
.tcf-home .th-faq-item summary:focus-visible { outline: 2px solid var(--th-blue); outline-offset: -2px; border-radius: 14px; }
.tcf-home .th-faq-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--th-soft);
    color: var(--th-navy);
    flex-shrink: 0;
    transition: transform 0.2s ease, background 0.15s ease, color 0.15s ease;
}
.tcf-home .th-faq-item[open] .th-faq-toggle { transform: rotate(45deg); background: var(--th-blue); color: #fff; }
.tcf-home .th-faq-answer { padding: 0 18px 18px; font-family: var(--th-font-text); font-size: 15px; line-height: 1.7; letter-spacing: -0.006em; color: #3A475E; }
.tcf-home .th-faq-answer p { line-height: 1.7; }
.tcf-home .th-faq-answer p + p { margin-top: 10px; }

/* ── 11. Appel final : bannière horizontale (modèle de Kamlo du 2026-10-08) ──
   icône | surtitre, titre, texte, lien WhatsApp discret | bouton vert ; photo estompée dans le bleu nuit à droite */
.tcf-home .th-cta { padding: 0 0 56px; background: #fff; }
.tcf-home .th-cta-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 28px 22px;
    background-color: var(--th-navy);
    background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1.4px);
    background-size: 18px 18px;
    border-radius: 16px;
    box-shadow: 0 30px 60px -36px rgba(8, 42, 94, 0.7);
    color: #fff;
}
.tcf-home .th-cta-photo {
    position: absolute;
    z-index: -2;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 35%;
}
.tcf-home .th-cta-card--photo::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, var(--th-navy) 0%, rgba(8, 42, 94, 0.94) 45%, rgba(8, 42, 94, 0.8) 100%);
}
.tcf-home .th-cta-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #3DDC8F;
}
.tcf-home .th-cta-eyebrow { margin-bottom: 6px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: #6BE3A8; }
.tcf-home .th-cta-title { font-size: clamp(24px, 2.6vw, 30px); font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; color: #fff; text-wrap: balance; }
.tcf-home .th-cta-title em { font-style: normal; color: var(--th-green); }
.tcf-home .th-cta-text { max-width: 620px; margin-top: 6px; font-family: var(--th-font-text); font-size: 15.5px; line-height: 1.6; letter-spacing: -0.006em; color: rgba(255, 255, 255, 0.8); }
.tcf-home .th-cta-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, 0.35);
    text-underline-offset: 4px;
    transition: text-decoration-color 0.15s ease;
}
.tcf-home .th-cta-link:hover { color: #fff; text-decoration-color: #fff; }
.tcf-home .th-cta-link svg { color: var(--th-green); }
.tcf-home .th-cta-action .th-btn { width: 100%; }

/* ── 12. Partenariats : bandeau discret après l'appel final (2026-10-12) ──
   Carte claire bordée, sans ombre ; bouton secondaire pour ne pas concurrencer « Commencer gratuitement ».
   Téléphone : icône + titre en tête, texte, pastilles et bouton en pleine largeur. */
.tcf-home .th-partner { padding: 0 0 56px; background: #fff; }
/* Bandeau rapproché de l'appel final qui le précède (spécificité 0,3,0 : passe devant les marges de .th-cta) */
.tcf-home .th-cta:has(+ .th-partner) { padding-bottom: 28px; }
.tcf-home .th-partner-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    padding: 22px 18px;
    background: var(--th-soft);
    border: 1px solid var(--th-line);
    border-radius: 16px;
}
.tcf-home .th-partner-head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.tcf-home .th-partner-icon {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--th-blue-tint);
    color: var(--th-blue);
}
.tcf-home .th-partner-eyebrow { margin-bottom: 3px; font-size: 11.5px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--th-blue); }
.tcf-home .th-partner-title { font-size: clamp(19px, 2vw, 22px); font-weight: 800; line-height: 1.25; letter-spacing: -0.015em; color: var(--th-ink); text-wrap: balance; }
.tcf-home .th-partner-title em { font-style: normal; color: var(--th-blue); }
.tcf-home .th-partner-body { min-width: 0; }
.tcf-home .th-partner-text { max-width: 660px; font-family: var(--th-font-text); font-size: 15px; line-height: 1.6; letter-spacing: -0.006em; color: var(--th-muted); }
.tcf-home .th-partner-types { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.tcf-home .th-partner-types li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid var(--th-line);
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--th-ink);
}
.tcf-home .th-partner-types svg { color: var(--th-green); }
.tcf-home .th-partner-action .th-btn { width: 100%; }
.tcf-home .th-partner-action .th-btn svg { color: var(--th-green-ink); }

@media (min-width: 640px) {
    .tcf-home .th-partner { padding-bottom: 72px; }
    .tcf-home .th-cta:has(+ .th-partner) { padding-bottom: 36px; }
    .tcf-home .th-partner-card { padding: 26px 28px; }
    .tcf-home .th-partner-action .th-btn { width: auto; }
}

/* Ordinateur : texte à gauche, bouton centré à droite */
@media (min-width: 1024px) {
    .tcf-home .th-partner { padding-bottom: 88px; }
    .tcf-home .th-cta:has(+ .th-partner) { padding-bottom: 40px; }
    .tcf-home .th-partner-card {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 40px;
        row-gap: 12px;
        align-items: center;
        padding: 30px 36px;
    }
    .tcf-home .th-partner-head,
    .tcf-home .th-partner-body { grid-column: 1; }
    .tcf-home .th-partner-body { padding-left: 62px; } /* aligné sur le titre (icône 48 px + 14 px) */
    .tcf-home .th-partner-action { grid-column: 2; grid-row: 1 / span 2; }
}


/* ── Tablette ───────────────────────────────────────────────────────── */
@media (min-width: 640px) {
    .tcf-home .th-wrap { padding: 0 24px; }
    .tcf-home .th-actions { flex-direction: row; flex-wrap: wrap; align-items: center; }
    .tcf-home .th-actions--center { justify-content: center; }
    .tcf-home .th-tests-grid,
    .tcf-home .th-steps-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tcf-home .th-tabs { display: inline-flex; }
    .tcf-home .th-tab { flex: 0 0 auto; padding: 9px 16px; font-size: 14.5px; }
    .tcf-home .th-steps-head-action .th-btn { width: auto; }
    .tcf-home .th-float--error { display: inline-flex; top: 0; left: 0; }
    .tcf-home .th-exam-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .tcf-home .th-exam-steps li { flex-direction: column; align-items: flex-start; }
    .tcf-home .th-exam-card { padding: 26px; }
    .tcf-home .th-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); height: 520px; }
    .tcf-home .th-wall-col--3 { display: block; }
    .tcf-home .th-res-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tcf-home .th-checks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
    .tcf-home .th-checks--2.th-coach-feats { gap: 10px; }
    .tcf-home .th-coach-copy { padding: 36px 32px; }
    .tcf-home .th-cta { padding-bottom: 72px; }
    .tcf-home .th-cta-card { grid-template-columns: auto minmax(0, 1fr); gap: 20px 24px; padding: 32px; }
    .tcf-home .th-cta-action { grid-column: 2; }
    .tcf-home .th-cta-action .th-btn { width: auto; }
}

/* ── Ordinateur ─────────────────────────────────────────────────────── */
@media (min-width: 1024px) {
    .tcf-home .th-section { padding: 88px 0; }
    .tcf-home .th-head { margin-bottom: 52px; }
    .tcf-home .th-head--left { margin-bottom: 26px; }
    .tcf-home .th-sub { font-size: 18px; }
    .tcf-home .th-pill { font-size: 12px; }
    .tcf-home .th-tests-grid { gap: 20px; }
    .tcf-home .th-tests-head { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) auto; align-items: end; gap: 40px; margin-bottom: 44px; }
    .tcf-home .th-tests-head-text { padding-bottom: 4px; }
    .tcf-home .th-tests-head-action { padding-bottom: 4px; }
    .tcf-home .th-sims-head { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; gap: 56px; margin-bottom: 44px; padding-bottom: 36px; }
    .tcf-home .th-sims-head .th-title { font-size: clamp(34px, 3.7vw, 48px); }
    /* Ordinateur et téléphone à gauche, points à droite, sous le sélecteur de l'en-tête */
    .tcf-home .th-sims-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 56px; }
    .tcf-home .th-sims-grid .th-devices { order: -1; }
    .tcf-home .th-devices { padding: 36px 0 44px 24px; }
    .tcf-home .th-float--error { top: 44%; left: -4px; }
    .tcf-home .th-float--pdf { left: 8px; bottom: 6px; }
    .tcf-home .th-exam { padding: 88px 0; }
    .tcf-home .th-exam-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; }
    .tcf-home .th-exam-card { padding: 28px; }
    .tcf-home .th-steps-list { gap: 24px; }
    .tcf-home .th-steps-list--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .tcf-home .th-steps-list--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tcf-home .th-step { padding: 26px 24px 24px; }
    .tcf-home .th-step h3 { margin-top: 22px; }
    /* Flèche à cheval sur l'espace entre deux cartes, à hauteur de l'icône (3 ou 4 étapes sur une ligne) */
    .tcf-home :is(.th-steps-list--3, .th-steps-list--4) .th-step-arrow {
        position: absolute;
        z-index: 1;
        top: 35px;
        right: -27px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        background: #fff;
        border: 1px solid #DCE5F2;
        border-radius: 50%;
        color: var(--th-blue);
        box-shadow: 0 6px 14px -6px rgba(10, 26, 58, 0.25);
    }
    .tcf-home .th-steps-head { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 44px; margin-bottom: 48px; }
    .tcf-home .th-steps-count { flex-direction: column; align-items: flex-start; gap: 12px; }
    .tcf-home .th-steps-count b { font-size: 156px; }
    .tcf-home .th-steps-head-copy .th-sub { max-width: 600px; }
    .tcf-home .th-pricing--head { padding-top: 88px; }
    .tcf-home .th-price-head { margin-bottom: 36px; }
    .tcf-home .th-testi-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; }
    .tcf-home .th-wall { height: 580px; }
    .tcf-home .th-coach-card { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
    .tcf-home .th-coach-card--noimg { grid-template-columns: minmax(0, 1fr); }
    .tcf-home .th-coach-media { min-height: 100%; }
    .tcf-home .th-coach-copy { padding: 52px 52px 48px; }
    .tcf-home .th-res-tiles { gap: 20px; }
    .tcf-home .th-faq-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; }
    .tcf-home .th-cta { padding-bottom: 88px; }
    .tcf-home .th-cta-card { grid-template-columns: auto minmax(0, 1fr) auto; gap: 28px; padding: 36px 40px; }
    .tcf-home .th-cta-action { grid-column: auto; }
    .tcf-home .th-cta-action .th-btn { min-height: 54px; padding: 0 26px; }
    .tcf-home .th-cta-icon { width: 68px; height: 68px; border-radius: 16px; }
    /* Photo sur la moitié droite seulement, fondue dans le bleu nuit */
    .tcf-home .th-cta-photo { width: 52%; }
    .tcf-home .th-cta-card--photo::before { background: linear-gradient(90deg, var(--th-navy) 0%, var(--th-navy) 48%, rgba(8, 42, 94, 0.82) 64%, rgba(8, 42, 94, 0.5) 100%); }
}

/* ── Grand écran : les 4 épreuves sur une ligne ───────────────────────── */
@media (min-width: 1280px) {
    .tcf-home .th-tests-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .tcf-home *,
    .tcf-home *::before,
    .tcf-home *::after { animation: none !important; transition: none !important; }
}
