/* =====================================================
   CONVERSA — VITRINE PUBLIQUE (accueil, partenaires, formateurs, bourse)
   Chargee APRES style.css par partials/_vitrine.php : reprend ses jetons
   (--marque-primaire, --service-*, --bord, --rayon…) et ses polices locales.
   - Mobile d'abord ; proprietes logiques partout (la page tient en arabe, dir="rtl").
   - Aucune image externe : les fonds sont des degrades, les visuels sont des
     captures du produit dans /assets/img/vitrine/.
   - Contenu toujours visible sans JavaScript (aucune revelation au defilement).
   ===================================================== */

/* --- POLICES DE LA VITRINE (locales, /_font/) : Barlow pour le texte, Barlow Condensed pour les titres --- */
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 300; font-display: swap; src: url('/_font/barlow-300-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 300; font-display: swap; src: url('/_font/barlow-300-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url('/_font/barlow-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url('/_font/barlow-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('/_font/barlow-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('/_font/barlow-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('/_font/barlow-600-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('/_font/barlow-600-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 500; font-display: swap; src: url('/_font/barlow-condensed-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 500; font-display: swap; src: url('/_font/barlow-condensed-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('/_font/barlow-condensed-600-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('/_font/barlow-condensed-600-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* --- JETONS PROPRES A LA VITRINE (seules couleurs ecrites en dur de ce fichier) --- */
.vitrine {
    --v-sombre:        #18181b;
    --v-sombre-2:      #232329;
    --v-nuit:          #0f0f12;
    --v-blanc:         #ffffff;
    --v-clair:         #fbfaff;
    --v-texte-sombre:  #d4d4d8;   /* texte courant sur fond sombre : 12:1 */
    --v-gris-sombre:   #a1a1aa;   /* texte secondaire sur fond sombre : 6,9:1 */
    --v-violet-clair:  #a9bdff;   /* bleu clair sur fond sombre (nom garde : il sert partout) */
    --v-vert-clair:    #6ee7a8;   /* --service-audio sur fond sombre */
    --v-orange-clair:  #fdba8c;   /* --service-formateur sur fond sombre */
    --v-violet-fonce:  #17369a;
    --v-orange-fonce:  #8a2f09;
    --v-titre:   'Barlow Condensed', 'Arial Narrow', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --v-lecture: 'Barlow', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --v-doux:          #f5f6f8;   /* bandes claires */
    --v-teinte:        #edf2fe;   /* bleu tres pale : pastilles, cartes mises en avant */
    --v-teinte-bord:   #c9d6fa;
    --v-bleu-fonce:    #17369a;
    --v-rayon:         14px;
    --v-ombre:         0 1px 2px rgba(16, 20, 32, .05);
    --v-ombre-haute:   0 18px 44px -20px rgba(17, 32, 80, .25);
    --v-gouttiere: 16px;
    --v-ombre-carte: 0 1px 2px rgba(16, 16, 20, .04), 0 18px 40px -24px rgba(16, 16, 20, .25);
    --v-ombre-visuel: 0 24px 60px -24px rgba(17, 32, 80, .28);
}
@media (min-width: 640px)  { .vitrine { --v-gouttiere: 32px; } }
@media (min-width: 1100px) { .vitrine { --v-gouttiere: 48px; } }

.vitrine-large { background: var(--v-blanc); overflow-x: clip; }
.vitrine-large main { display: block; }

/* --- CONTENEURS --- */
.v-cadre { max-width: 1200px; margin-inline: auto; padding-inline: var(--v-gouttiere); }
.v-cadre--etroit { max-width: 900px; }
.v-bande { padding-block: clamp(64px, 9vw, 120px); position: relative; }
.v-bande--teinte { background: var(--fond); }
.v-bande--sombre { background: var(--v-sombre); color: var(--v-texte-sombre); }
.v-bande--sombre h2, .v-bande--sombre h3 { color: var(--v-blanc); }
.v-bande--sombre a:not(.v-bouton) { color: var(--v-violet-clair); }
.v-bande--serree { padding-block: clamp(48px, 6vw, 80px); }

/* --- TYPOGRAPHIE --- */
.v-surtitre {
    display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px;
    font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--marque-primaire);
}
.v-surtitre::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }
.v-bande--sombre .v-surtitre { color: var(--v-violet-clair); }
.v-surtitre.service-audio { color: var(--service-audio); }
.v-surtitre.service-formateur { color: var(--service-formateur); }
.v-bande--sombre .v-surtitre.service-audio { color: var(--v-vert-clair); }
.v-bande--sombre .v-surtitre.service-formateur { color: var(--v-orange-clair); }

.v-titre-section {
    font-family: var(--v-titre); font-weight: 800; font-size: clamp(30px, 4.6vw, 52px);
    line-height: 1.05; letter-spacing: -.03em; margin: 0 0 18px; color: var(--texte); max-width: 22ch;
}
.v-titre-section em, .v-hero h1 em, .v-appel h2 em, .v-page-tete h1 em {
    font-style: normal; color: var(--marque-primaire);
    background: linear-gradient(100deg, var(--marque-primaire) 10%, var(--service-formateur) 95%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.v-bande--sombre .v-titre-section em, .v-appel h2 em {
    background-image: linear-gradient(100deg, var(--v-violet-clair) 10%, var(--v-orange-clair) 95%);
}
.v-intro { font-family: var(--v-lecture); font-size: clamp(16.5px, 1.6vw, 19px); line-height: 1.6; color: var(--texte-2); max-width: 62ch; margin: 0 0 12px; }
.v-bande--sombre .v-intro { color: var(--v-texte-sombre); }
.v-entete { margin-bottom: clamp(32px, 5vw, 56px); }
.v-entete--centre { text-align: center; }
.v-entete--centre .v-titre-section, .v-entete--centre .v-intro { margin-inline: auto; }

/* --- BOUTONS --- */
.v-bouton {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    min-height: 42px; padding: 0 18px; border-radius: 10px; border: 1px solid transparent;
    font: inherit; font-size: 14.5px; font-weight: 600; line-height: 1.2; white-space: nowrap;
    text-decoration: none !important; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, filter .18s ease;
}
.v-bouton:hover { transform: translateY(-1px); }
.v-bouton--lg { min-height: 50px; padding: 0 22px; border-radius: 11px; font-size: 15.5px; }
.v-bouton--xl { min-height: 56px; padding: 0 28px; border-radius: 12px; font-size: 16.5px; }
.v-bouton--plein { background: var(--marque-primaire); color: var(--v-blanc); box-shadow: 0 10px 28px -12px rgba(31, 72, 199, .75), inset 0 1px 0 rgba(255, 255, 255, .18); }
.v-bouton--plein:hover { filter: brightness(1.06); box-shadow: 0 16px 34px -12px rgba(31, 72, 199, .85), inset 0 1px 0 rgba(255, 255, 255, .18); }
.v-bouton--contour { background: var(--v-blanc); color: var(--texte); border-color: var(--bord-fort); }
.v-bouton--contour:hover { border-color: var(--texte-3); }
.v-bouton--discret { background: transparent; color: var(--texte); }
.v-bouton--discret:hover { background: var(--survol); transform: none; }
.v-bouton--clair { background: var(--v-blanc); color: var(--v-sombre); }
.v-bouton--fantome { background: transparent; color: var(--v-blanc); border-color: rgba(255, 255, 255, .35); }
.v-bouton--fantome:hover { border-color: var(--v-blanc); }
.v-bouton--service { background: var(--service); color: var(--v-blanc); box-shadow: 0 10px 28px -14px var(--service); }
.v-bouton--fleche::after {
    content: ''; width: 7px; height: 7px; border-block-start: 2px solid currentColor; border-inline-end: 2px solid currentColor;
    transform: rotate(45deg); margin-inline-start: 2px; transition: transform .18s ease;
}
[dir="rtl"] .v-bouton--fleche::after { transform: rotate(-45deg); }
.v-bouton--fleche:hover::after { transform: translateX(3px) rotate(45deg); }
[dir="rtl"] .v-bouton--fleche:hover::after { transform: translateX(-3px) rotate(-45deg); }
.v-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.v-actions--centre { justify-content: center; }
.v-mention { font-size: 13px; color: var(--texte-3); margin: 14px 0 0; }
.v-bande--sombre .v-mention, .v-appel .v-mention { color: var(--v-gris-sombre); }
@media (max-width: 520px) {
    .v-actions .v-bouton--xl { width: 100%; }
}

/* =====================================================
   BARRE DE NAVIGATION COLLANTE
   ===================================================== */
.v-barre {
    position: sticky; top: 0; z-index: 60;
    background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px);
    border-bottom: 1px solid rgba(24, 24, 27, .07);
}
.v-barre-cadre { max-width: 1200px; margin-inline: auto; padding-inline: var(--v-gouttiere); min-height: 64px; display: flex; align-items: center; gap: 16px; }
.v-logo { font-family: var(--v-titre); font-weight: 800; font-size: 20px; letter-spacing: .04em; color: var(--texte); text-decoration: none !important; white-space: nowrap; }
.v-logo .logo-dot { background: var(--marque-primaire); width: 8px; height: 8px; }
.v-logo--clair, .v-pied a.v-logo--clair { color: var(--v-blanc); text-decoration: none; }
.v-menu-case { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.v-menu-bouton {
    margin-inline-start: auto; display: inline-flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 14px;
    border: 1px solid var(--bord); border-radius: 10px; background: var(--v-blanc); font-weight: 600; font-size: 14px; cursor: pointer; user-select: none;
}
.v-menu-case:focus-visible + .v-menu-bouton { outline: 2px solid var(--marque-primaire); outline-offset: 2px; }
.v-menu-icone { display: inline-flex; flex-direction: column; gap: 4px; width: 18px; }
.v-menu-icone i { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
.v-menu-case:checked + .v-menu-bouton .v-menu-icone i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.v-menu-case:checked + .v-menu-bouton .v-menu-icone i:nth-child(2) { opacity: 0; }
.v-menu-case:checked + .v-menu-bouton .v-menu-icone i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.v-nav {
    display: none; position: absolute; inset-inline: 0; top: 100%;
    flex-direction: column; gap: 14px; padding: 16px var(--v-gouttiere) 22px;
    background: var(--v-blanc); border-bottom: 1px solid var(--bord); box-shadow: 0 24px 40px -24px rgba(16, 16, 20, .3);
}
.v-menu-case:checked ~ .v-nav { display: flex; }
.v-nav-liens { display: flex; flex-direction: column; }
.v-nav-liens a { padding: 12px 4px; font-size: 16px; font-weight: 500; color: var(--texte); border-bottom: 1px solid var(--bord); text-decoration: none; }
.v-nav-liens a[aria-current] { color: var(--marque-primaire); font-weight: 700; }
.v-nav-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.v-nav-actions .v-bouton--plein { flex: 1 1 100%; min-height: 48px; }
.v-nav .langues ul { inset-inline-end: auto; inset-inline-start: 0; }
@media (min-width: 1240px) {
    .v-menu-bouton { display: none; }
    .v-nav, .v-menu-case:checked ~ .v-nav {
        display: flex; position: static; flex-direction: row; align-items: center; justify-content: space-between; flex: 1;
        padding: 0; background: none; border: 0; box-shadow: none; gap: 16px;
    }
    .v-nav-liens { flex-direction: row; gap: 2px; margin-inline-start: 12px; }
    .v-nav-liens a { padding: 8px 12px; border: 0; border-radius: 8px; font-size: 14.5px; color: var(--texte-2); }
    .v-nav-liens a:hover { background: var(--survol); color: var(--texte); text-decoration: none; }
    .v-nav-liens a[aria-current] { color: var(--texte); background: var(--marque-primaire-doux); font-weight: 600; }
    .v-nav-actions { flex-wrap: nowrap; gap: 8px; }
    .v-nav-actions .v-bouton--plein { flex: none; min-height: 40px; }
    .v-nav .langues ul { inset-inline-start: auto; inset-inline-end: 0; }
}

/* =====================================================
   HERO PLEIN ECRAN
   ===================================================== */
.v-hero {
    position: relative; isolation: isolate; overflow: hidden;
    min-height: min(calc(100svh - 64px), 1000px); padding-block: clamp(56px, 9vw, 112px) 0;
    display: flex; flex-direction: column; justify-content: flex-end;
    background:
        radial-gradient(55% 45% at 12% 8%, rgba(109, 71, 230, .26), transparent 70%),
        radial-gradient(40% 40% at 92% 14%, rgba(194, 65, 12, .18), transparent 70%),
        radial-gradient(55% 40% at 50% 96%, rgba(6, 118, 71, .16), transparent 72%),
        var(--v-clair);
}
.v-hero::before {
    /* trame fine, estompee vers les bords */
    content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background-image: linear-gradient(rgba(24, 24, 27, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(24, 24, 27, .05) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: radial-gradient(70% 60% at 50% 30%, #000 20%, transparent 75%); mask-image: radial-gradient(70% 60% at 50% 30%, #000 20%, transparent 75%);
}
.v-hero-texte { text-align: center; max-width: 1000px; margin-inline: auto; }
.v-hero h1 {
    font-family: var(--v-titre); font-weight: 800; font-size: clamp(40px, 7.2vw, 76px); line-height: 1.02; letter-spacing: -.04em;
    margin: 0 auto 24px; color: var(--texte); max-width: 16ch; text-wrap: balance;
}
.v-hero .v-intro { margin-inline: auto; font-size: clamp(17px, 1.8vw, 20.5px); max-width: 60ch; }
.v-hero .v-actions { justify-content: center; }
.v-pastilles { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 22px; padding: 0; list-style: none; }
.v-pastilles li {
    display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 10px; border-radius: 999px;
    background: rgba(255, 255, 255, .8); border: 1px solid var(--bord); font-size: 13px; font-weight: 600; color: var(--texte-2);
}
.v-pastilles li::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--service); box-shadow: 0 0 0 4px color-mix(in srgb, var(--service) 18%, transparent); }

/* composition des visuels sous le titre */
.v-hero-visuel { position: relative; max-width: 1100px; margin: clamp(48px, 7vw, 80px) auto 0; padding-inline: 0; }
.v-hero-visuel::before {
    content: ''; position: absolute; inset: 8% 6% -6%; z-index: -1; border-radius: 40px; filter: blur(60px); opacity: .55;
    background: conic-gradient(from 200deg, var(--marque-primaire), var(--service-formateur), var(--service-audio), var(--marque-primaire));
}
.v-hero-visuel .v-fenetre { border-end-start-radius: 0; border-end-end-radius: 0; border-bottom: 0; }
.v-hero-visuel .v-telephone { position: absolute; inset-inline-end: -2%; bottom: 6%; width: 23%; }
.v-etiquettes { position: absolute; inset: 0; pointer-events: none; margin: 0; padding: 0; list-style: none; }
.v-etiquettes li {
    position: absolute; display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 14px;
    background: rgba(255, 255, 255, .94); border: 1px solid var(--bord); box-shadow: var(--v-ombre-carte);
    font-size: 13.5px; font-weight: 600; color: var(--texte); white-space: nowrap;
}
.v-etiquettes b { font-family: var(--v-titre); font-size: 22px; font-weight: 800; color: var(--service); letter-spacing: -.02em; }
.v-etiquettes li:nth-child(1) { top: 16%; inset-inline-start: -4%; }
.v-etiquettes li:nth-child(2) { top: 42%; inset-inline-start: -6%; }
.v-etiquettes li:nth-child(3) { top: 68%; inset-inline-start: -3%; }
@media (max-width: 899px) {
    .v-hero { min-height: 0; }
    .v-hero-visuel .v-fenetre { display: none; }
    .v-hero-visuel .v-telephone { position: relative; inset: auto; width: min(78%, 330px); margin-inline: auto; }
    .v-hero-visuel::before { inset: 10% 10% 0; }
    .v-etiquettes { display: none; }
}

.v-etiquettes li:not(:has(b))::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--service); box-shadow: 0 0 0 4px color-mix(in srgb, var(--service) 18%, transparent); }
.v-hero--formateur {
    background:
        radial-gradient(55% 45% at 10% 8%, rgba(194, 65, 12, .24), transparent 70%),
        radial-gradient(40% 40% at 92% 14%, rgba(109, 71, 230, .2), transparent 70%),
        radial-gradient(55% 40% at 50% 96%, rgba(194, 65, 12, .14), transparent 72%),
        var(--v-clair);
}
.v-hero--formateur h1 em, .v-appel--formateur h2 em { background-image: linear-gradient(100deg, var(--service-formateur) 10%, var(--marque-primaire) 95%); }
.v-appel.v-appel--formateur h2 em { background-image: linear-gradient(100deg, var(--v-orange-clair) 10%, var(--v-violet-clair) 95%); }
.v-appel.v-appel--formateur {
    background:
        radial-gradient(60% 80% at 0% 0%, rgba(253, 186, 140, .32), transparent 60%),
        radial-gradient(50% 70% at 100% 100%, rgba(109, 71, 230, .5), transparent 65%),
        linear-gradient(135deg, var(--v-orange-fonce), var(--v-sombre) 75%);
}

/* --- FENETRE DE NAVIGATEUR ET TELEPHONE (cadres des captures) --- */
.v-fenetre { margin: 0; background: var(--v-blanc); border: 1px solid rgba(24, 24, 27, .1); border-radius: 16px; overflow: hidden; box-shadow: var(--v-ombre-visuel); }
.v-fenetre img, .v-telephone img { display: block; width: 100%; height: auto; }
.v-fenetre-barre { display: flex; align-items: center; gap: 12px; height: 38px; padding-inline: 14px; background: var(--survol); border-bottom: 1px solid var(--bord); }
.v-fenetre-points { display: inline-flex; gap: 6px; flex-shrink: 0; }
.v-fenetre-points i { width: 10px; height: 10px; border-radius: 50%; background: var(--service-audio); opacity: .75; }
.v-fenetre-points i:nth-child(2) { background: var(--marque-primaire); }
.v-fenetre-points i:nth-child(3) { background: var(--service-formateur); }
.v-fenetre-adresse {
    flex: 0 1 380px; margin-inline: auto; padding: 3px 14px; border-radius: 7px; background: var(--v-blanc); border: 1px solid var(--bord);
    font-size: 12px; color: var(--texte-3); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.v-bande--sombre .v-fenetre { border-color: rgba(255, 255, 255, .12); box-shadow: 0 0 0 1px rgba(255, 255, 255, .04), 0 50px 120px -30px rgba(109, 71, 230, .55); }
.v-telephone { margin: 0; padding: 9px; border-radius: 40px; background: var(--v-sombre); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset, 0 40px 80px -24px rgba(16, 16, 20, .55); }
.v-telephone img { border-radius: 31px; }

/* =====================================================
   GROS CHIFFRES (bandeau sombre)
   ===================================================== */
.v-chiffres { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; margin: 0; }
@media (min-width: 900px) { .v-chiffres { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }
.v-chiffres > div { padding-inline-start: 18px; border-inline-start: 2px solid rgba(255, 255, 255, .12); }
.v-chiffres dt { order: 2; font-size: 14.5px; line-height: 1.45; color: var(--v-texte-sombre); }
.v-chiffres dd {
    margin: 0 0 8px; font-family: var(--v-titre); font-weight: 800; font-size: clamp(48px, 7vw, 92px); line-height: .95; letter-spacing: -.045em;
    color: var(--v-blanc); font-variant-numeric: tabular-nums;
}
.v-chiffres > div { display: flex; flex-direction: column; }
.v-chiffres dd small { font-size: .38em; letter-spacing: -.01em; margin-inline-start: 4px; color: var(--v-gris-sombre); font-weight: 700; }
.v-chiffres > div:nth-child(1) dd { color: var(--v-violet-clair); }
.v-chiffres > div:nth-child(2) dd { color: var(--v-vert-clair); }
.v-chiffres > div:nth-child(3) dd { color: var(--v-orange-clair); }
.v-chiffres-note { margin: 40px 0 0; font-size: 13px; color: var(--v-gris-sombre); }
/* variante sur fond clair */
.v-chiffres--clair > div { border-inline-start-color: var(--bord); }
.v-chiffres--clair dt { color: var(--texte-2); }
.v-chiffres--clair dd, .v-chiffres--clair > div:nth-child(n) dd { color: var(--texte); }
.v-chiffres--clair dd small { color: var(--texte-3); }

/* =====================================================
   CARTES DE SERVICE (les trois couleurs)
   ===================================================== */
.v-services { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .v-services { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v-service {
    position: relative; display: flex; flex-direction: column; gap: 12px; padding: 30px 28px 28px; border-radius: 20px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--service) 9%, var(--v-blanc)) 0, var(--v-blanc) 46%);
    border: 1px solid color-mix(in srgb, var(--service) 22%, var(--bord)); box-shadow: var(--v-ombre-carte);
    transition: transform .2s ease, box-shadow .2s ease;
}
.v-service:hover { transform: translateY(-4px); box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--service) 70%, transparent); }
.v-service::before { content: ''; position: absolute; inset-inline: 28px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: var(--service); }
.v-service-icone { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: var(--service); color: var(--v-blanc); box-shadow: 0 12px 24px -12px var(--service); margin-bottom: 6px; }
.v-service-icone svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.v-service-canal { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--service); margin: 0; }
.v-service h3 { font-family: var(--v-titre); font-weight: 800; font-size: clamp(22px, 2.2vw, 27px); letter-spacing: -.025em; line-height: 1.12; margin: 0; }
.v-service p { margin: 0; color: var(--texte-2); line-height: 1.6; font-size: 15px; }
.v-service ul { list-style: none; margin: 6px 0 0; padding: 14px 0 0; border-top: 1px solid var(--bord); display: flex; flex-direction: column; gap: 8px; font-size: 14px; color: var(--texte-2); }
.v-service li { position: relative; padding-inline-start: 22px; }
.v-service li::before { content: ''; position: absolute; inset-inline-start: 2px; top: 5px; width: 10px; height: 6px; border-left: 2px solid var(--service); border-bottom: 2px solid var(--service); transform: rotate(-45deg); }
.v-service-prix { margin-top: auto !important; padding-top: 12px; font-size: 14px; color: var(--texte-2); }
.v-service-prix b { font-family: var(--v-titre); font-size: 26px; font-weight: 800; color: var(--texte); letter-spacing: -.02em; }
.v-service-lien { font-weight: 600; color: var(--service) !important; }

/* =====================================================
   SECTIONS EN DEUX COLONNES (texte | visuel)
   ===================================================== */
.v-split { display: grid; gap: clamp(36px, 5vw, 72px); align-items: center; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) {
    .v-split { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
    .v-split--inverse { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
    .v-split--inverse > :first-child { order: 2; }
}
.v-split .v-titre-section { max-width: 18ch; }

/* etapes numerotees */
.v-etapes { list-style: none; counter-reset: v-etape; margin: 28px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.v-etapes li { counter-increment: v-etape; position: relative; padding: 14px 0 14px 64px; padding-inline: 64px 0; border-top: 1px solid var(--bord); color: var(--texte-2); line-height: 1.55; font-size: 15px; }
.v-etapes li:first-child { border-top: 0; }
.v-etapes li::before {
    content: counter(v-etape, decimal-leading-zero); position: absolute; inset-inline-start: 0; top: 12px;
    font-family: var(--v-titre); font-weight: 800; font-size: 30px; letter-spacing: -.03em; line-height: 1; color: var(--marque-primaire);
}
.v-etapes b { display: block; color: var(--texte); font-size: 17px; margin-bottom: 2px; }
.v-etapes--formateur li::before { color: var(--service-formateur); }
.v-bande--sombre .v-etapes li { border-top-color: rgba(255, 255, 255, .1); color: var(--v-texte-sombre); }
.v-bande--sombre .v-etapes b { color: var(--v-blanc); }
.v-bande--sombre .v-etapes li::before { color: var(--v-violet-clair); }
/* grille d'etapes en cartes (organismes, formateurs) */
.v-etapes--grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 0; }
@media (min-width: 760px) { .v-etapes--grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .v-etapes--grille.v-etapes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .v-etapes--grille.v-etapes--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.v-etapes--grille li { border: 1px solid var(--bord); border-radius: 18px; background: var(--v-blanc); padding: 70px 22px 22px; box-shadow: var(--v-ombre-carte); }
.v-etapes--grille li:first-child { border-top: 1px solid var(--bord); }
.v-etapes--grille li::before { top: 22px; inset-inline-start: 22px; font-size: 34px; }

/* liste de puces cochees */
.v-coches { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.v-coches li { position: relative; padding-inline-start: 34px; line-height: 1.55; color: var(--texte-2); }
.v-coches li b { color: var(--texte); }
.v-coches li::before {
    content: ''; position: absolute; inset-inline-start: 0; top: 1px; width: 22px; height: 22px; border-radius: 50%;
    background: var(--marque-primaire-doux);
}
.v-coches li::after { content: ''; position: absolute; inset-inline-start: 7px; top: 7px; width: 8px; height: 5px; border-left: 2px solid var(--marque-primaire); border-bottom: 2px solid var(--marque-primaire); transform: rotate(-45deg); }
.v-bande--sombre .v-coches li { color: var(--v-texte-sombre); }
.v-bande--sombre .v-coches li b { color: var(--v-blanc); }
.v-bande--sombre .v-coches li::before { background: rgba(184, 166, 255, .16); }
.v-bande--sombre .v-coches li::after { border-color: var(--v-violet-clair); }

/* les cinq competences, en etiquettes */
.v-competences { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; }
.v-competences li { padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .05); color: var(--v-blanc); font-weight: 600; font-size: 14px; }

/* =====================================================
   PUBLICS (particuliers, organismes, formateurs)
   ===================================================== */
.v-publics { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .v-publics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v-public {
    display: flex; flex-direction: column; gap: 12px; padding: 32px 28px; border-radius: 22px; background: var(--v-sombre-2);
    border: 1px solid rgba(255, 255, 255, .08); transition: transform .2s ease, border-color .2s ease;
}
.v-public:hover { transform: translateY(-4px); border-color: rgba(255, 255, 255, .22); }
.v-public h3 { font-family: var(--v-titre); font-weight: 800; font-size: 26px; letter-spacing: -.025em; margin: 0; color: var(--v-blanc); }
.v-public p { margin: 0; color: var(--v-texte-sombre); line-height: 1.6; }
.v-public .v-coches { margin-top: 4px; gap: 9px; font-size: 14.5px; }
.v-public .v-actions { margin-top: auto; padding-top: 18px; }
.v-public-numero { font-family: var(--v-titre); font-weight: 800; font-size: 15px; letter-spacing: .1em; color: var(--v-gris-sombre); margin: 0; }
.v-public.service-audio .v-public-numero { color: var(--v-vert-clair); }
.v-public.service-ia .v-public-numero { color: var(--v-violet-clair); }
.v-public.service-formateur .v-public-numero { color: var(--v-orange-clair); }

/* =====================================================
   APPEL A L'ACTION FINAL
   ===================================================== */
.v-appel {
    position: relative; overflow: hidden; isolation: isolate; border-radius: 28px; padding: clamp(44px, 7vw, 96px) clamp(24px, 6vw, 80px);
    background:
        radial-gradient(60% 80% at 0% 0%, rgba(184, 166, 255, .35), transparent 60%),
        radial-gradient(50% 70% at 100% 100%, rgba(194, 65, 12, .45), transparent 65%),
        linear-gradient(135deg, var(--v-violet-fonce), var(--v-sombre) 75%);
    color: var(--v-texte-sombre); text-align: center;
}
.v-appel::before {
    content: ''; position: absolute; inset: 0; z-index: -1;
    background-image: linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
    background-size: 48px 48px; -webkit-mask-image: radial-gradient(60% 60% at 50% 50%, #000, transparent 80%); mask-image: radial-gradient(60% 60% at 50% 50%, #000, transparent 80%);
}
.v-appel h2 { font-family: var(--v-titre); font-weight: 800; font-size: clamp(32px, 5.6vw, 64px); line-height: 1.02; letter-spacing: -.04em; color: var(--v-blanc); margin: 0 auto 18px; max-width: 18ch; }
.v-appel .v-intro { color: var(--v-texte-sombre); margin-inline: auto; }
.v-appel .v-actions { justify-content: center; }
.v-appel a:not(.v-bouton) { color: var(--v-blanc); text-decoration: underline; }

/* =====================================================
   TARIFS, EXEMPLES (partenaires, formateurs)
   ===================================================== */
.v-tarifs { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
@media (min-width: 960px) { .v-tarifs { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.v-carte {
    display: flex; flex-direction: column; gap: 10px; padding: 30px 28px; border-radius: 20px; background: var(--v-blanc);
    border: 1px solid var(--bord); box-shadow: var(--v-ombre-carte); min-width: 0;
}
.v-carte h3 { font-family: var(--v-titre); font-weight: 800; font-size: 22px; letter-spacing: -.02em; margin: 0; line-height: 1.25; }
.v-carte--accent { border-color: color-mix(in srgb, var(--marque-primaire) 35%, var(--bord)); background: linear-gradient(180deg, var(--marque-primaire-doux), var(--v-blanc) 40%); }
.v-carte--formateur { border-color: color-mix(in srgb, var(--service-formateur) 30%, var(--bord)); background: linear-gradient(180deg, color-mix(in srgb, var(--service-formateur) 7%, var(--v-blanc)), var(--v-blanc) 40%); }
.v-carte .sim-canal { color: var(--marque-primaire); }
.v-carte--formateur .sim-canal { color: var(--service-formateur); }
.v-gros-prix { font-family: var(--v-titre); font-weight: 800; font-size: clamp(44px, 5.4vw, 64px); line-height: 1; letter-spacing: -.045em; color: var(--texte); margin: 4px 0 2px; }
.v-gros-prix small { font-family: var(--marque-police); font-size: 15px; font-weight: 500; letter-spacing: 0; color: var(--texte-3); margin-inline-start: 6px; }
.v-carte .vitrine-prix { display: block; font-family: var(--v-titre); font-weight: 800; font-size: clamp(44px, 5.4vw, 64px); line-height: 1.05; letter-spacing: -.045em; color: var(--texte); margin: 4px 0 2px; }
.v-carte h3:has(.vitrine-prix) { font-family: var(--marque-police); font-weight: 500; font-size: 15px; color: var(--texte-3); letter-spacing: 0; }
.v-carte .offre-inclus { border-top-color: var(--bord); }
.v-carte .offre-inclus li { font-size: 14.5px; }
.v-table { overflow-x: auto; margin: 6px 0; }
.v-table table { width: 100%; }
.v-carte .sim-note, .v-carte .v-mention { font-size: 13px; }
.v-exemples { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .v-exemples { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .v-exemples { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v-exemple { display: flex; flex-direction: column; gap: 8px; padding: 24px; border-radius: 18px; background: var(--v-sombre-2); border: 1px solid rgba(255, 255, 255, .08); }
.v-exemple h3 { font-size: 17px; margin: 0; color: var(--v-blanc); }
.v-exemple p { margin: 0; color: var(--v-gris-sombre); font-size: 14px; line-height: 1.55; }
.v-exemple-prix { margin-top: auto !important; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .1); color: var(--v-texte-sombre) !important; font-size: 14px !important; }
.v-exemple-prix b { font-family: var(--v-titre); font-weight: 800; font-size: 34px; letter-spacing: -.03em; color: var(--v-blanc); margin-inline-end: 8px; }
.v-gains { display: grid; grid-template-columns: 1fr auto; gap: 0 16px; margin: 6px 0 0; }
.v-gains dt, .v-gains dd { padding: 12px 0; border-top: 1px solid var(--bord); }
.v-gains dt { color: var(--texte-2); }
.v-gains dd { margin: 0; text-align: end; font-variant-numeric: tabular-nums; }
.v-gains dd b { font-family: var(--v-titre); font-size: 22px; font-weight: 800; color: var(--service-formateur); }
.v-gains .v-gains-total { font-weight: 700; color: var(--texte); }
.v-gains dd.v-gains-total b { font-size: 30px; }

/* =====================================================
   FAQ
   ===================================================== */
.v-faq { background: var(--fond); }
.v-faq .v-titre-section { max-width: none; }
.v-faq .vitrine-faq { max-width: none; gap: 10px; }
.v-faq .vitrine-faq details { padding: 0; border-radius: 16px; background: var(--v-blanc); border: 1px solid var(--bord); transition: border-color .2s ease, box-shadow .2s ease; }
.v-faq .vitrine-faq details[open] { border-color: color-mix(in srgb, var(--marque-primaire) 35%, var(--bord)); box-shadow: var(--v-ombre-carte); }
.v-faq .vitrine-faq summary {
    list-style: none; position: relative; padding: 20px 24px; padding-inline-end: 60px; font-size: 16.5px; font-weight: 600; line-height: 1.4;
}
.v-faq .vitrine-faq summary::-webkit-details-marker { display: none; }
.v-faq .vitrine-faq summary::before, .v-faq .vitrine-faq summary::after {
    content: ''; position: absolute; inset-inline-end: 24px; top: 50%; width: 14px; height: 2px; border-radius: 2px; background: var(--marque-primaire); transition: transform .2s ease;
}
.v-faq .vitrine-faq summary::after { transform: rotate(90deg); }
.v-faq .vitrine-faq details[open] summary::after { transform: rotate(0deg); }
.v-faq .vitrine-faq p { margin: 0; padding: 0 24px 22px; font-size: 15px; line-height: 1.65; color: var(--texte-2); }

/* =====================================================
   EN-TETE DE PAGE INTERIEURE (bourse, fiche) — moins haut que le hero
   ===================================================== */
.v-page-tete {
    position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(48px, 7vw, 96px) clamp(80px, 10vw, 140px);
    background:
        radial-gradient(50% 70% at 8% 0%, rgba(194, 65, 12, .2), transparent 70%),
        radial-gradient(45% 60% at 95% 10%, rgba(109, 71, 230, .2), transparent 70%),
        var(--v-clair);
}
.v-page-tete::before { content: ''; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(24, 24, 27, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(24, 24, 27, .045) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(70% 80% at 50% 0%, #000 20%, transparent 75%); mask-image: radial-gradient(70% 80% at 50% 0%, #000 20%, transparent 75%); }
.v-page-tete h1 { font-family: var(--v-titre); font-weight: 800; font-size: clamp(36px, 6vw, 68px); line-height: 1.03; letter-spacing: -.04em; margin: 0 0 18px; max-width: 18ch; text-wrap: balance; }
.v-page-tete--fiche { padding-block-end: clamp(40px, 6vw, 72px); }

/* --- bourse : filtres flottants et cartes --- */
.v-filtres-zone { margin-top: clamp(-96px, -7vw, -56px); position: relative; z-index: 2; }
.v-filtres-zone .marche-filtres { max-width: none; margin: 0; padding: 18px 20px; border-radius: 18px; box-shadow: 0 30px 60px -30px rgba(16, 16, 20, .35); gap: 12px 16px; }
.v-filtres-zone .marche-filtres .form-field { flex: 1 1 160px; }
.v-filtres-zone .marche-compte { max-width: none; margin: 18px 0 22px; }
.v-filtres-zone .marche-grille { max-width: none; gap: 20px; }
.v-marche .marche-carte { border-radius: 20px; padding: 22px; gap: 10px; border-top-width: 1px; border-color: var(--bord); position: relative; box-shadow: var(--v-ombre-carte); transition: transform .2s ease, box-shadow .2s ease; }
.v-marche .marche-carte::before { content: ''; position: absolute; inset-inline: 22px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: var(--service-formateur); }
.v-marche .marche-carte:hover { transform: translateY(-4px); box-shadow: 0 30px 60px -30px rgba(194, 65, 12, .55); }
.v-marche .marche-photo { box-shadow: 0 0 0 4px var(--v-blanc), 0 0 0 5px color-mix(in srgb, var(--service-formateur) 35%, transparent); }
.v-marche .marche-nom { font-family: var(--v-titre); font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.v-marche .marche-prix { font-family: var(--v-titre); font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.v-marche .btn.service-formateur { height: 44px; border-radius: 10px; font-weight: 600; }
.v-vide { padding: 40px 28px; border-radius: 20px; background: var(--v-blanc); border: 1px dashed var(--bord-fort); text-align: center; color: var(--texte-2); font-size: 16px; line-height: 1.6; }
.v-criteres { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .v-criteres { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .v-criteres { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v-critere { padding: 24px; border-radius: 18px; background: var(--v-sombre-2); border: 1px solid rgba(255, 255, 255, .08); }
.v-critere h3 { font-size: 18px; margin: 0 0 6px; color: var(--v-blanc); }
.v-critere p { margin: 0; color: var(--v-gris-sombre); line-height: 1.55; font-size: 14.5px; }
.v-critere-numero { display: block; font-family: var(--v-titre); font-weight: 800; font-size: 28px; color: var(--v-orange-clair); letter-spacing: -.02em; margin-bottom: 10px; }
.v-critere--note { background: linear-gradient(135deg, rgba(194, 65, 12, .35), var(--v-sombre-2) 70%); }

/* --- fiche formateur --- */
.v-fiche-tete { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; }
.v-fiche-tete .marche-photo.grande { width: clamp(120px, 16vw, 176px); height: clamp(120px, 16vw, 176px); box-shadow: 0 0 0 6px var(--v-blanc), 0 20px 50px -20px rgba(194, 65, 12, .6); }
.v-fiche-tete > div { flex: 1 1 280px; min-width: 0; }
.v-fiche-tete h1 { margin-bottom: 10px; }
.v-fiche-tete p { margin: 0 0 8px; }
.v-fiche-tete .marche-langues { font-size: 16px; }
.v-fiche-corps { padding-block: clamp(40px, 6vw, 72px) clamp(64px, 9vw, 112px); }
.v-fiche-corps .marche-fiche { max-width: none; margin: 0; gap: 28px; }
.v-fiche-corps .marche-fiche-principal { border-radius: 20px; padding: clamp(22px, 3vw, 36px); box-shadow: var(--v-ombre-carte); }
.v-fiche-corps .marche-fiche-principal h2 { font-family: var(--v-titre); font-weight: 800; font-size: 24px; letter-spacing: -.02em; margin: 30px 0 12px; }
.v-fiche-corps .marche-fiche-principal h2:first-child { margin-top: 0; }
.v-fiche-corps .marche-presentation { font-size: 15.5px; }
.v-fiche-corps .marche-fiche-cote { top: 88px; }
.v-fiche-corps .marche-fiche-cote .sim-carte { padding: 26px 24px; border-radius: 20px; border-top-width: 1px; border-color: color-mix(in srgb, var(--service-formateur) 30%, var(--bord)); box-shadow: 0 30px 60px -34px rgba(194, 65, 12, .6); gap: 12px; position: relative; }
.v-fiche-corps .marche-fiche-cote .sim-carte::before { content: ''; position: absolute; inset-inline: 24px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: var(--service-formateur); }
.v-fiche-corps .paliers td b { font-family: var(--v-titre); font-size: 19px; font-weight: 800; }
.v-ariane { margin: 0 0 22px; font-size: 14px; }
.v-ariane a { color: var(--texte-2); font-weight: 500; }
@media (max-width: 600px) { .v-fiche-corps .marche-criteres > div { grid-template-columns: 1fr; gap: 4px; } }

/* =====================================================
   PAGES EN CONTENEUR (conditions, inscription, pages legales)
   ===================================================== */
.v-page { padding-block: clamp(32px, 5vw, 64px) clamp(56px, 8vw, 96px); }
.v-page > .conditions, .v-page .conditions.v-document {
    background: var(--v-blanc); border: 1px solid var(--bord); border-radius: 22px; box-shadow: var(--v-ombre-carte);
    padding: clamp(24px, 5vw, 64px); margin-top: 0;
}
.v-document, .v-page .conditions { max-width: 860px; }
:is(.v-document, .v-page .conditions) h1 { font-family: var(--v-titre); font-weight: 800; font-size: clamp(30px, 4.6vw, 48px); line-height: 1.06; letter-spacing: -.035em; margin: 10px 0 14px; }
:is(.v-document, .v-page .conditions) h2 {
    text-align: start;
    font-family: var(--v-titre); font-weight: 800; font-size: clamp(19px, 2vw, 22px); letter-spacing: -.015em;
    margin: 40px 0 12px; padding-top: 28px; border-top: 1px solid var(--bord);
}
:is(.v-document, .v-page .conditions) :is(p, li) { font-size: 15.5px; line-height: 1.75; color: var(--texte-2); }
:is(.v-document, .v-page .conditions) p { margin: 0 0 12px; }
:is(.v-document, .v-page .conditions) ul { margin: 0 0 12px; padding-inline-start: 22px; display: flex; flex-direction: column; gap: 8px; }
:is(.v-document, .v-page .conditions) li::marker { color: var(--marque-primaire); }
:is(.v-document, .v-page .conditions) b { color: var(--texte); }
:is(.v-document, .v-page .conditions) .v-avertissement { margin: 18px 0 8px; padding: 14px 18px; border-radius: 12px; background: var(--alerte-fond); border: 1px solid var(--alerte-bord); color: var(--texte-2); font-size: 14px; line-height: 1.6; }
:is(.v-document, .v-page .conditions) .v-surtitre.service-formateur { color: var(--service-formateur); }

:is(.v-document, .v-page .conditions) h2:first-of-type { margin-top: 28px; }
.v-page .conditions .service-etiquette { font-size: 12px; letter-spacing: .16em; }

/* =====================================================
   PIED DE PAGE
   ===================================================== */
.v-pied { background: var(--v-nuit); color: var(--v-gris-sombre); padding-block: 64px 32px; font-size: 14px; }
.v-pied a { color: var(--v-texte-sombre); text-decoration: none; }
.v-pied a:hover { color: var(--v-blanc); text-decoration: underline; }
.v-pied-haut { display: grid; gap: 40px; grid-template-columns: minmax(0, 1fr); padding-bottom: 40px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
@media (min-width: 900px) { .v-pied-haut { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); } }
.v-pied-marque p { margin: 14px 0 0; max-width: 36ch; line-height: 1.6; }
.v-pied-colonnes { display: grid; gap: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .v-pied-colonnes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.v-pied-titre { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--v-blanc); }
.v-pied ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.v-pied-bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; padding-top: 24px; }
.v-pied-bas p { margin: 0; }
.v-pied-legal { display: flex; flex-wrap: wrap; gap: 8px 20px; }

/* (les coches gardent des bordures physiques : une coche ne se retourne pas en arabe) */
/* --- Ecriture de droite a gauche : pas d'interlettrage negatif (il casse les liaisons) --- */
[dir="rtl"] .v-hero h1, [dir="rtl"] .v-titre-section, [dir="rtl"] .v-appel h2, [dir="rtl"] .v-page-tete h1,
[dir="rtl"] .v-service h3, [dir="rtl"] .v-public h3, [dir="rtl"] .v-document h1, [dir="rtl"] .v-document h2, [dir="rtl"] .v-carte h3 { letter-spacing: 0; }
[dir="rtl"] .v-surtitre, [dir="rtl"] .v-service-canal, [dir="rtl"] .v-pied-titre { letter-spacing: 0; }

/* --- Mouvements reduits --- */
@media (prefers-reduced-motion: reduce) {
    .vitrine *, .vitrine *::before, .vitrine *::after { transition: none !important; }
    .v-service:hover, .v-public:hover, .v-bouton:hover, .v-marche .marche-carte:hover { transform: none; }
}
.v-bouton.bloc { width: 100%; }
.v-marche { padding-top: 0; }

/* Lien d'evitement : masque par decoupe plutot que par left:-9999px (qui elargit la page en arabe). */
.vitrine .evitement { left: auto; inset-inline-start: 8px; }
.vitrine .evitement:not(:focus) { width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* =====================================================
   IDENTITE DU 2026-10-05 (maquette « juste milieu », validee par Pascal)
   Sobre, titres en capitales condensees, cartes et boutons arrondis comme dans
   l'admin, un seul accent : le bleu de la marque. Ce bloc vient en dernier et
   l'emporte sur les regles ci-dessus : plus de bandes sombres, plus de degrades.
   Maquette : _securite/conversa/maquettes/vitrine-equilibre.html
   ===================================================== */
.vitrine {
    --service-audio: var(--marque-primaire);
    --service-formateur: var(--marque-primaire);
    font-family: var(--v-lecture); font-size: 17px;
}

/* --- titres --- */
.v-titre-section, .v-hero h1, .v-appel h2, .v-page-tete h1, .v-service h3, .v-public h3, .v-carte h3,
.v-critere h3, .v-exemple h3, :is(.v-document, .v-page .conditions) h1, :is(.v-document, .v-page .conditions) h2,
.v-marche .marche-nom, .v-fiche-corps .marche-fiche-principal h2 {
    font-family: var(--v-titre); font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
}
.v-titre-section { font-size: clamp(30px, 3.6vw, 44px); line-height: 1.08; }
.v-hero h1 { font-size: clamp(40px, 6.2vw, 78px); letter-spacing: .02em; max-width: 18ch; }
.v-page-tete h1 { font-size: clamp(36px, 5vw, 60px); letter-spacing: .02em; }
.v-service h3, .v-public h3, .v-carte h3 { font-size: clamp(22px, 2vw, 26px); }
.v-titre-section em, .v-hero h1 em, .v-appel h2 em, .v-page-tete h1 em,
.v-bande--sombre .v-titre-section em, .v-hero--formateur h1 em, .v-appel--formateur h2 em, .v-appel.v-appel--formateur h2 em {
    background: none; -webkit-text-fill-color: currentColor; color: var(--marque-primaire);
}
.v-surtitre { font-family: var(--v-titre); font-size: 14px; font-weight: 600; letter-spacing: .22em; }
.v-surtitre::before { display: none; }
.v-intro { font-family: var(--v-lecture); font-size: clamp(17px, 1.7vw, 20px); }
.v-mention { font-size: 14.5px; }
.v-logo { font-family: var(--v-titre); font-weight: 600; letter-spacing: .2em; font-size: 22px; }

/* --- boutons --- */
.v-bouton { font-family: var(--v-lecture); font-weight: 500; font-size: 16px; border-radius: 10px; }
.v-bouton:hover { transform: none; }
.v-bouton--lg { font-size: 16.5px; }
.v-bouton--xl { font-size: 17px; min-height: 54px; }
.v-bouton--plein, .v-bouton--service { background: var(--marque-primaire); box-shadow: var(--v-ombre); }
.v-bouton--plein:hover, .v-bouton--service:hover { filter: none; background: var(--v-bleu-fonce); box-shadow: var(--v-ombre); }
.v-bouton--contour { border-color: var(--bord); box-shadow: var(--v-ombre); }
.v-bouton--contour:hover { background: var(--v-doux); border-color: var(--v-teinte-bord); }

/* --- barre --- */
.v-barre { background: rgba(255, 255, 255, .94); }
/* Menu deplie seulement quand il tient sur une ligne (mesure avec les polices : ~1215 px). */
.v-nav-liens a { white-space: nowrap; }
@media (min-width: 1240px) { .v-nav-liens a { font-size: 15.5px; } }

/* --- bandes : le sombre devient clair --- */
.v-bande--teinte, .v-faq { background: var(--v-doux); }
.v-bande--sombre { background: var(--v-doux); color: var(--texte-2); }
.v-bande--sombre h2, .v-bande--sombre h3 { color: var(--texte); }
.v-bande--sombre a:not(.v-bouton) { color: var(--marque-primaire); }
.v-bande--sombre .v-surtitre, .v-bande--sombre .v-surtitre.service-audio, .v-bande--sombre .v-surtitre.service-formateur { color: var(--marque-primaire); }
.v-bande--sombre .v-intro, .v-bande--sombre .v-coches li, .v-bande--sombre .v-etapes li { color: var(--texte-2); }
.v-bande--sombre .v-coches li b, .v-bande--sombre .v-etapes b { color: var(--texte); }
.v-bande--sombre .v-coches li::before { background: var(--marque-primaire-doux); }
.v-bande--sombre .v-coches li::after { border-color: var(--marque-primaire); }
.v-bande--sombre .v-etapes li { border-top-color: var(--bord); }
.v-bande--sombre .v-etapes li::before { color: var(--marque-primaire); }
.v-bande--sombre .v-mention { color: var(--texte-3); }

/* --- captures --- */
.v-fenetre, .v-bande--sombre .v-fenetre { border-color: var(--bord); border-radius: var(--v-rayon); box-shadow: var(--v-ombre-visuel); }
.v-fenetre-points i, .v-fenetre-points i:nth-child(2), .v-fenetre-points i:nth-child(3) { background: var(--bord-fort); opacity: 1; }
.v-telephone { box-shadow: var(--v-ombre-haute); }

/* --- hero et en-tetes : fond clair, sans trame ni halo --- */
.v-hero, .v-hero--formateur { background: var(--v-blanc); }
.v-page-tete { background: var(--v-doux); }
.v-hero::before, .v-page-tete::before, .v-appel::before, .v-hero-visuel::before { display: none; }
.v-pastilles li { background: var(--v-teinte); border-color: var(--v-teinte-bord); color: var(--v-bleu-fonce); font-weight: 500; font-size: 14px; }
.v-pastilles li::before { background: var(--marque-primaire); box-shadow: none; }
.v-etiquettes li { border-radius: 12px; box-shadow: var(--v-ombre-haute); }

/* --- chiffres en cartes --- */
.v-chiffres { gap: 16px; }
.v-chiffres > div { padding: 22px 24px; border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre); }
.v-chiffres dt, .v-chiffres--clair dt { color: var(--texte-3); font-size: 15.5px; }
.v-chiffres dd, .v-chiffres > div:nth-child(n) dd { font-family: var(--v-titre); font-weight: 600; letter-spacing: .01em; font-size: clamp(40px, 4.4vw, 56px); color: var(--texte); }
.v-chiffres dd small { color: var(--marque-primaire); }
.v-chiffres-note { color: var(--texte-3); }

/* --- cartes : le meme objet que dans l'admin --- */
.v-service, .v-carte, .v-public, .v-exemple, .v-critere, .v-etapes--grille li, .v-faq .vitrine-faq details, .v-vide,
.v-marche .marche-carte, .v-fiche-corps .marche-fiche-principal, .v-fiche-corps .marche-fiche-cote .sim-carte,
.v-page > .conditions, .v-page .conditions.v-document, .v-filtres-zone .marche-filtres { border-radius: var(--v-rayon); }
.v-service, .v-public, .v-exemple, .v-critere, .v-carte--formateur { background: var(--v-blanc); border: 1px solid var(--bord); box-shadow: var(--v-ombre); }
.v-service::before, .v-marche .marche-carte::before, .v-fiche-corps .marche-fiche-cote .sim-carte::before { display: none; }
.v-service:hover, .v-public:hover, .v-marche .marche-carte:hover { transform: translateY(-3px); box-shadow: var(--v-ombre-haute); }
.v-service-icone { background: var(--v-teinte); color: var(--marque-primaire); box-shadow: none; border-radius: 12px; }
.v-service p, .v-public p { font-size: 16.5px; }
.v-service ul { font-size: 15.5px; }
.v-public h3, .v-exemple h3, .v-critere h3 { color: var(--texte); }
.v-public p, .v-exemple p, .v-critere p { color: var(--texte-2); }
.v-public-numero, .v-public.service-audio .v-public-numero, .v-public.service-ia .v-public-numero, .v-public.service-formateur .v-public-numero, .v-critere-numero { color: var(--marque-primaire); font-family: var(--v-titre); font-weight: 600; }
.v-public .v-bouton--clair { background: var(--marque-primaire); color: var(--v-blanc); }
.v-public .v-bouton--fantome { color: var(--texte); border-color: var(--bord); }
.v-exemple-prix { border-top-color: var(--bord); color: var(--texte-2) !important; }
.v-exemple-prix b { color: var(--texte); font-family: var(--v-titre); font-weight: 600; }
.v-critere--note, .v-carte--accent { background: var(--v-teinte); border-color: var(--v-teinte-bord); }
.v-competences li { border-color: var(--v-teinte-bord); background: var(--v-teinte); color: var(--v-bleu-fonce); }
.v-gros-prix, .v-carte .vitrine-prix, .v-service-prix b, .v-etiquettes b, .v-gains dd b, .v-marche .marche-prix, .v-fiche-corps .paliers td b, .v-etapes li::before {
    font-family: var(--v-titre); font-weight: 600; letter-spacing: .01em;
}
.v-etapes li { font-size: 16.5px; }
.v-etapes b { font-family: var(--v-titre); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; font-size: 19px; }
.v-marche .marche-photo { box-shadow: 0 0 0 4px var(--v-blanc), 0 0 0 5px var(--v-teinte-bord); }
.v-fiche-tete .marche-photo.grande { box-shadow: 0 0 0 6px var(--v-blanc), var(--v-ombre-haute); }
.v-fiche-corps .marche-fiche-cote .sim-carte { border-color: var(--bord); box-shadow: var(--v-ombre-haute); }
.v-filtres-zone .marche-filtres { box-shadow: var(--v-ombre-haute); }
.v-page > .conditions, .v-page .conditions.v-document { box-shadow: var(--v-ombre); }
:is(.v-document, .v-page .conditions) :is(p, li) { font-size: 16.5px; }

/* --- FAQ --- */
.v-faq .vitrine-faq details[open] { border-color: var(--v-teinte-bord); box-shadow: var(--v-ombre); }
.v-faq .vitrine-faq summary { font-size: 17.5px; font-weight: 500; }
.v-faq .vitrine-faq p { font-size: 16.5px; }

/* --- appel final : une carte bleue --- */
.v-appel, .v-appel.v-appel--formateur { background: var(--marque-primaire); border-radius: 20px; color: var(--v-blanc); }
.v-appel h2 { font-size: clamp(30px, 4.4vw, 52px); line-height: 1.08; color: var(--v-blanc); }
.v-appel h2 em, .v-appel.v-appel--formateur h2 em { color: var(--v-teinte-bord); }
.v-appel .v-intro, .v-appel .v-mention { color: var(--v-teinte); }
.v-appel .v-bouton--clair { color: var(--v-bleu-fonce); box-shadow: none; }
.v-appel .v-bouton--clair:hover { background: var(--v-teinte); }
.v-appel .v-bouton--fantome { border-color: rgba(255, 255, 255, .6); }
.v-appel .v-bouton--fantome:hover { background: rgba(255, 255, 255, .12); }

/* --- pied de page clair --- */
.v-pied { background: var(--v-doux); color: var(--texte-3); border-top: 1px solid var(--bord); font-size: 15px; }
.v-pied a { color: var(--texte-2); }
.v-pied a:hover { color: var(--marque-primaire); }
.v-pied-titre { color: var(--texte); font-family: var(--v-titre); font-weight: 600; font-size: 14px; letter-spacing: .18em; }
.v-pied-haut { border-bottom-color: var(--bord); }
.v-logo--clair, .v-pied a.v-logo--clair { color: var(--texte); }

/* =====================================================
   ACCUEIL (index.php) : composants propres a la page d'accueil
   ===================================================== */
.acc-ouverture { text-align: center; padding-block: clamp(48px, 7vw, 80px) 0; }
.acc-ouverture h1 {
    font-family: var(--v-titre); font-weight: 600; text-transform: uppercase; letter-spacing: .02em; line-height: 1.02;
    font-size: clamp(40px, 6.2vw, 78px); color: var(--texte); margin: 0 auto 24px; max-width: 18ch; text-wrap: balance;
}
.acc-ouverture h1 em { font-style: normal; color: var(--marque-primaire); }
.acc-ouverture .v-intro { margin-inline: auto; max-width: 62ch; }
.acc-ouverture .v-actions { justify-content: center; }
.acc-scene { position: relative; margin-top: clamp(40px, 6vw, 56px); padding-bottom: clamp(56px, 7vw, 72px); }
.acc-scene::before { content: ''; position: absolute; inset: 38% -100vmax 0; background: var(--v-teinte); z-index: 0; }
.acc-scene .v-fenetre { position: relative; z-index: 1; max-width: 1000px; margin-inline: auto; }
.acc-scene .v-telephone { position: absolute; z-index: 2; inset-inline-end: 0; bottom: 40px; width: 17%; min-width: 120px; padding: 6px; border-radius: 24px; }
.acc-scene .v-telephone img { border-radius: 18px; }
@media (max-width: 640px) { .acc-scene .v-telephone { display: none; } }

.acc-chiffres { margin-top: -40px; position: relative; z-index: 3; }
@media (max-width: 899px) { .acc-chiffres { margin-top: -32px; } }

.acc-facons .v-service { --service: var(--marque-primaire); }
.acc-facons .v-service-canal { letter-spacing: .14em; }

.acc-etapes { counter-reset: v-etape; gap: 10px; }
.acc-etapes li, .acc-etapes li:first-child {
    display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 2px 14px; align-items: center;
    padding: 16px 18px; border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre);
}
.acc-etapes li::before {
    content: counter(v-etape); position: static; grid-row: span 2; width: 44px; height: 44px; border-radius: 10px;
    display: grid; place-items: center; background: var(--v-teinte); color: var(--v-bleu-fonce); font-size: 22px;
}
.acc-etapes b { margin: 0; }
.acc-etapes span { font-size: 16px; line-height: 1.45; }

.acc-evaluation { padding: 28px; border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre); margin-top: 24px; }
.acc-score { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 6px; }
.acc-score b { font-family: var(--v-titre); font-size: 44px; font-weight: 600; color: var(--texte); line-height: 1; font-variant-numeric: tabular-nums; }
.acc-score b small { font-size: 20px; color: var(--texte-3); }
.acc-pastille {
    display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 500; line-height: 1;
    padding: 7px 12px; border-radius: 999px; background: var(--v-teinte); color: var(--v-bleu-fonce); border: 1px solid var(--v-teinte-bord);
}
.acc-pastille::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--marque-primaire); }
.acc-barres { list-style: none; padding: 0; margin: 20px 0 0; display: flex; flex-direction: column; gap: 16px; }
.acc-barres li { display: grid; grid-template-columns: 1fr auto; row-gap: 7px; font-size: 16px; font-weight: 500; color: var(--texte); }
.acc-barres .acc-valeur { font-variant-numeric: tabular-nums; color: var(--marque-primaire); }
.acc-piste { grid-column: 1 / -1; height: 8px; border-radius: 4px; background: var(--v-doux); overflow: hidden; }
.acc-piste span { display: block; height: 100%; background: var(--marque-primaire); border-radius: 4px; }
.acc-w84 { width: 84%; } .acc-w71 { width: 71%; } .acc-w66 { width: 66%; } .acc-w78 { width: 78%; } .acc-w62 { width: 62%; }
.acc-legende { font-size: 15px; color: var(--texte-3); margin: 18px 0 0; }

.acc-grille { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .acc-grille { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.acc-tarif {
    position: relative; display: flex; flex-direction: column; min-width: 0; padding: 30px;
    border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre);
}
.acc-tarif--accent { background: var(--v-teinte); border-color: var(--v-teinte-bord); }
.acc-tarif-badge { position: absolute; top: -14px; inset-inline-start: 30px; background: var(--marque-primaire); color: var(--v-blanc); font-size: 14px; font-weight: 500; padding: 5px 12px; border-radius: 999px; }
.acc-tarif-pour { font-size: 15px; font-weight: 500; color: var(--marque-primaire); margin: 0 0 4px; }
.acc-tarif h3 { font-family: var(--v-titre); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; font-size: 24px; margin: 0 0 8px; color: var(--texte); }
.acc-tarif-accroche { font-size: 16px; color: var(--texte-3); margin: 0 0 6px; }
@media (min-width: 960px) { .acc-tarif-accroche { min-height: 3.2em; } }
.acc-prix { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin: 6px 0 4px; }
.acc-prix b { font-family: var(--v-titre); font-size: 54px; font-weight: 600; color: var(--texte); line-height: 1; font-variant-numeric: tabular-nums; }
.acc-prix span { font-size: 16px; color: var(--texte-3); }
.acc-sous-prix { font-size: 15px; color: var(--texte-3); margin: 0 0 20px; }
.acc-tarif table { width: 100%; border-collapse: collapse; font-size: 16px; margin: 0 0 24px; }
.acc-tarif td { padding: 10px 0; border-top: 1px solid var(--bord); }
.acc-tarif td:last-child { text-align: end; font-variant-numeric: tabular-nums; color: var(--texte); font-weight: 500; white-space: nowrap; }
.acc-tarif--accent td { border-top-color: var(--v-teinte-bord); }
.acc-tarif .v-bouton { margin-top: auto; width: 100%; }
.acc-note { text-align: center; font-size: 15px; color: var(--texte-3); margin: 28px 0 0; }

.acc-personne { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre); transition: transform .25s ease, box-shadow .25s ease; }
.acc-personne:hover { transform: translateY(-3px); box-shadow: var(--v-ombre-haute); }
.acc-apercu { margin: 0; background: var(--v-teinte); padding: 22px 22px 0; }
.acc-apercu img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: left top; border-radius: 10px 10px 0 0; border: 1px solid var(--v-teinte-bord); border-bottom: 0; }
.acc-corps { display: flex; flex-direction: column; flex: 1; padding: 24px 26px 28px; }
.acc-tete { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.acc-tete h3 { font-family: var(--v-titre); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; font-size: 24px; margin: 0; color: var(--texte); }
.acc-corps p { font-size: 16.5px; color: var(--texte-2); line-height: 1.6; }
.acc-corps .v-bouton { margin-top: auto; align-self: flex-start; }

.acc-langues { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); list-style: none; margin: 0; padding: 0; }
.acc-langues li { text-align: center; padding: 24px 12px; border: 1px solid var(--bord); border-radius: var(--v-rayon); background: var(--v-blanc); box-shadow: var(--v-ombre); }
.acc-langue-nom { display: block; font-family: var(--v-titre); font-weight: 600; font-size: clamp(24px, 2.4vw, 30px); color: var(--texte); line-height: 1.15; }
.acc-langue-fr { display: block; font-size: 15px; color: var(--texte-3); margin-top: 6px; }

@media (prefers-reduced-motion: reduce) { .acc-personne:hover { transform: none; } }

/* --- Ecriture de droite a gauche : ni capitales ni interlettrage (ils cassent les liaisons) --- */
[dir="rtl"] :is(.v-titre-section, .v-hero h1, .v-appel h2, .v-page-tete h1, .v-service h3, .v-public h3, .v-carte h3,
.v-surtitre, .v-logo, .v-etapes b, .v-pied-titre, .acc-ouverture h1, .acc-tarif h3, .acc-tete h3, .v-service-canal) { letter-spacing: 0; }

/* --- bourse : profils de demonstration montres au public tant qu'elle manque de vrais formateurs --- */
.v-avertissement-demo { margin: 0 0 20px; padding: 14px 18px; border-radius: 12px; background: var(--v-teinte); border: 1px solid var(--v-teinte-bord); color: var(--texte-2); font-size: 15.5px; line-height: 1.55; }
.v-avertissement-demo a { color: var(--marque-primaire); font-weight: 500; }
.marche-fiche-cote .v-avertissement-demo { margin: 4px 0 6px; font-size: 15px; }
.marche-fiche-cote .v-bouton.bloc + .v-bouton.bloc { margin-top: 10px; }

/* Pages des services studio et avatar (partials/_vitrine_services.php, 2026-10-10) */
.v-liste { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 10px; max-width: 760px; }
.v-liste li { position: relative; padding-left: 22px; }
.v-liste li::before { content: ""; position: absolute; left: 0; top: .65em; width: 8px; height: 8px; border-radius: 50%; background: var(--marque-primaire, #1f48c7); }