.elementor-5011 .elementor-element.elementor-element-7849c063{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}:root{--page-title-display:none;}/* Start custom CSS for text-editor, class: .elementor-element-c6fed5a *//* --- CONFIGURATION NEXUS : WINE & AMETHYST LUXE --- */
#clemy-spiritual-nexus {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --soft-gray: #FBF9FD;
    
    background-color: var(--soft-gray);
    color: var(--dark);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.7;
    overflow-x: hidden;
}

/* --- HERO & TITRE --- */
.nexus-hero {
    padding: 80px 20px 40px;
    text-align: center;
}

.nexus-title {
    font-size: clamp(1.8rem, 6vw, 3.5rem);
    font-weight: 900;
    line-height: 1.1;
    margin: 0;
    color: var(--dark);
}

.nexus-title span {
    color: var(--amethyst);
    background: linear-gradient(135deg, var(--amethyst), var(--wine));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.title-underline {
    width: 100px;
    height: 6px;
    background: var(--wine);
    margin: 30px auto 0;
    border-radius: 50px;
}

/* --- NAVIGATION GLASSMORPHISM (ULTRA RESPONSIVE) --- */
.nexus-nav {
    position: sticky;
    top: 15px;
    z-index: 1000;
    margin: 0 20px;
}

.nav-container {
    max-width: 1000px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(15px) saturate(180%);
    -webkit-backdrop-filter: blur(15px) saturate(180%);
    padding: 12px 25px;
    border-radius: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid rgba(142, 68, 173, 0.2);
    box-shadow: 0 15px 35px rgba(26, 11, 46, 0.08);
}

.nav-logo {
    font-weight: 900;
    font-size: 0.85rem;
    letter-spacing: 1px;
    color: var(--dark);
}

.nav-logo span { color: var(--amethyst); font-weight: 300; }

.nav-links { display: flex; gap: 10px; }
.nav-links a {
    text-decoration: none;
    color: #555;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 8px 15px;
    border-radius: 50px;
    transition: 0.3s ease;
}

.nav-links a:hover {
    background: var(--amethyst);
    color: white;
}

/* --- INTRO & BADGE --- */
.nexus-intro-zone {
    text-align: center;
    max-width: 800px;
    margin: 60px auto;
    padding: 0 25px;
}

.badge-amethyst {
    background: #F4ECF7;
    color: var(--amethyst);
    padding: 8px 25px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: inline-block;
    margin-bottom: 25px;
}

.lead-text {
    font-size: 1.3rem;
    line-height: 1.6;
    color: #444;
}

/* --- MONOLITH CARD (UI DE PRESTIGE) --- */
.monolith-wrapper {
    max-width: 1000px;
    margin: 0 auto 100px;
    padding: 0 25px;
}

.monolith-card {
    background: white;
    border-radius: 40px;
    display: flex;
    overflow: hidden;
    box-shadow: 0 40px 100px rgba(26, 11, 46, 0.06);
    border: 1px solid #F0F0F0;
}

.monolith-accent {
    width: 15px;
    background: linear-gradient(to bottom, var(--wine), var(--amethyst));
    flex-shrink: 0;
}

.monolith-content {
    padding: clamp(30px, 6vw, 60px);
}

.p-accent {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 25px;
}

/* MÉTAPHORE BOXES */
.tech-metaphor {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 40px 0;
}

.metaphor-box {
    background: var(--soft-gray);
    padding: 25px;
    border-radius: 25px;
    text-align: center;
    transition: 0.3s;
}

.metaphor-box:hover { transform: translateY(-5px); background: #FDF2F7; }
.m-icon { font-size: 2.5rem; display: block; margin-bottom: 10px; }

/* LINKS */
.link-wine-bold { color: var(--wine); font-weight: 800; text-decoration: underline; }
.link-amethyst { color: var(--amethyst); font-weight: 700; }

.p-conclusion {
    border-top: 1px solid #EEE;
    padding-top: 30px;
    font-style: italic;
    color: #666;
}

/* --- RESPONSIVE ADAPTATION --- */
@media (max-width: 900px) {
    .nav-links { display: none; } /* On cache les liens pour le confort mobile */
    .metaphor-box { padding: 20px; }
}

@media (max-width: 650px) {
    .monolith-card { flex-direction: column; }
    .monolith-accent { width: 100%; height: 10px; }
    .tech-metaphor { grid-template-columns: 1fr; }
    .p-accent { font-size: 1.2rem; }
    .lead-text { font-size: 1.1rem; }
}/* ============================================================
   FORCE RESPONSIVE RADICAL : SPIRITUAL NEXUS (INTRO)
   ============================================================ */

@media (max-width: 768px) {
    /* 1. RESET GLOBAL & ANTI-DÉBORDEMENT */
    #clemy-spiritual-nexus {
        overflow-x: hidden !important;
        padding-bottom: 40px !important;
    }

    #clemy-spiritual-nexus .monolith-wrapper,
    #clemy-spiritual-nexus .nexus-intro-zone {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. NAVIGATION COMPACTE (GLASSMORPHISM) */
    #clemy-spiritual-nexus .nexus-nav {
        margin: 0 10px !important; /* Marges latérales réduites */
        top: 10px !important; /* Lègèrement remonté */
    }

    #clemy-spiritual-nexus .nav-container {
        padding: 12px 15px !important;
        justify-content: center !important; /* On centre le logo */
        border-radius: 50px !important; /* Maintien de l'effet "pilule" */
        /* Réduction du flou pour soulager le GPU mobile */
        backdrop-filter: blur(10px) saturate(150%) !important;
        -webkit-backdrop-filter: blur(10px) saturate(150%) !important;
    }

    #clemy-spiritual-nexus .nav-logo {
        font-size: 0.9rem !important;
    }

    #clemy-spiritual-nexus .nav-links {
        display: none !important; /* On cache les liens comme prévu */
    }

    /* 3. HERO & INTRO */
    #clemy-spiritual-nexus .nexus-hero {
        padding: 60px 15px 30px !important; /* Réduction de l'espace haut vide */
    }

    #clemy-spiritual-nexus .nexus-title {
        font-size: 1.8rem !important; /* Taille calibrée pour éviter la césure */
        line-height: 1.2 !important;
    }

    #clemy-spiritual-nexus .title-underline {
        width: 60px !important; /* Légère réduction */
        height: 4px !important;
        margin: 20px auto 0 !important;
    }

    #clemy-spiritual-nexus .nexus-intro-zone {
        margin: 40px auto !important;
    }

    #clemy-spiritual-nexus .badge-amethyst {
        font-size: 0.65rem !important;
        padding: 6px 18px !important;
        letter-spacing: 2px !important;
        margin-bottom: 20px !important;
    }

    #clemy-spiritual-nexus .lead-text {
        font-size: 1.05rem !important;
        line-height: 1.5 !important;
        padding: 0 5px !important;
    }

    /* 4. MONOLITH CARD (L'ÉCRIN BLANC) */
    #clemy-spiritual-nexus .monolith-wrapper {
        margin-bottom: 50px !important;
    }

    #clemy-spiritual-nexus .monolith-card {
        flex-direction: column !important; /* Empilement forcé */
        border-radius: 25px !important;
    }

    #clemy-spiritual-nexus .monolith-accent {
        width: 100% !important;
        height: 6px !important; /* La barre passe en haut */
        background: linear-gradient(to right, var(--wine), var(--amethyst)) !important; /* Dégradé horizontal */
    }

    #clemy-spiritual-nexus .monolith-content {
        padding: 30px 20px !important; /* Aération du texte */
    }

    #clemy-spiritual-nexus .p-accent {
        font-size: 1.2rem !important;
        text-align: center !important;
        margin-bottom: 25px !important;
        line-height: 1.4 !important;
    }

    /* 5. MÉTAPHORE BOXES (TECH) */
    #clemy-spiritual-nexus .tech-metaphor {
        grid-template-columns: 1fr !important; /* Empilement des boîtes */
        gap: 15px !important;
        margin: 30px 0 !important;
    }

    #clemy-spiritual-nexus .metaphor-box {
        padding: 20px 15px !important;
        border-radius: 18px !important;
        transform: none !important; /* SÉCURITÉ TACTILE : blocage du saut */
    }

    #clemy-spiritual-nexus .metaphor-box:hover {
        transform: none !important; /* Annulation du hover au scroll */
        background: var(--soft-gray) !important; /* Maintien de la couleur de base */
    }

    #clemy-spiritual-nexus .m-icon {
        font-size: 2rem !important;
        margin-bottom: 8px !important;
    }

    #clemy-spiritual-nexus .metaphor-box strong {
        font-size: 1.05rem !important;
        display: block !important;
        margin-bottom: 5px !important;
    }

    #clemy-spiritual-nexus .p-conclusion {
        padding-top: 25px !important;
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        text-align: center !important; /* Centrage pour fermer la carte élégamment */
    }
}

/* Fix spécifique iPhone SE / Écrans < 350px */
@media (max-width: 350px) {
    #clemy-spiritual-nexus .nexus-title { font-size: 1.55rem !important; }
    #clemy-spiritual-nexus .p-accent { font-size: 1.1rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-36c5f20 *//* --- SECTION MÉDIUMNITÉ : DESIGN VIBRATOIRE --- */
#clemy-medium-vibration {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --glass-bg: rgba(26, 11, 46, 0.95);
    
    padding: clamp(60px, 8vw, 100px) 0;
    background: var(--white);
    font-family: 'Inter', -apple-system, sans-serif;
    color: var(--dark);
    line-height: 1.8;
}

.inner-wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 25px;
}

/* HEADER SECTION */
.section-header {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 50px;
}

.step-num {
    font-size: clamp(4rem, 12vw, 6rem);
    font-weight: 900;
    color: var(--amethyst);
    opacity: 0.15;
    line-height: 1;
}

.h2-title {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    font-weight: 300;
    margin: 0;
    line-height: 1.1;
}

.h2-title strong {
    color: var(--wine);
    font-weight: 900;
}

.line-wine {
    width: 60px;
    height: 5px;
    background: var(--wine);
    margin-top: 15px;
    border-radius: 10px;
}

/* INTRO */
.intro-p {
    font-size: 1.2rem;
    margin-bottom: 50px;
    max-width: 800px;
}

.link-amethyst { color: var(--amethyst); font-weight: 800; text-decoration: underline; }

/* VIBRATORY CARD (DARK MODE UX) */
.vibratory-card {
    background: var(--dark);
    color: white;
    border-radius: 40px;
    padding: clamp(30px, 6vw, 60px);
    position: relative;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(26, 11, 46, 0.2);
}

.vibratory-card::after {
    content: "";
    position: absolute;
    top: 0; right: 0;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(142, 68, 173, 0.2) 0%, transparent 70%);
}

.h3-white { color: var(--amethyst); font-size: 1.8rem; font-weight: 900; margin-bottom: 30px; }

.process-flow { margin: 40px 0; }
.flow-item {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.05);
    padding: 20px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.flow-icon { font-size: 1.5rem; }

.traducteur-quote {
    background: white;
    color: var(--dark);
    padding: 25px;
    border-radius: 20px;
    margin: 40px 0 0 0;
    font-style: italic;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* SENSOR GRID */
.sensor-grid { margin-top: 80px; }
.grid-title { text-align: center; margin-bottom: 40px; font-weight: 900; text-transform: uppercase; letter-spacing: 2px; font-size: 0.9rem; color: #999; }

.grid-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.sensor-card {
    background: var(--white);
    padding: 40px;
    border-radius: 30px;
    border: 1px solid #F0F0F0;
    transition: 0.3s ease;
}

.sensor-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.05); }

.border-amethyst { border-top: 6px solid var(--amethyst); }
.border-wine { border-top: 6px solid var(--wine); }

.sensor-head { color: var(--dark); font-size: 1.3rem; margin-bottom: 15px; }
.sensor-head strong { color: var(--wine); }

/* VISUAL FOOTER */
.visual-footer { text-align: center; margin-top: 80px; }
.image-portal {
    display: inline-block;
    padding: 15px;
    background: var(--soft-gray);
    border-radius: 40px;
    transform: rotate(-2deg);
}

.image-portal img {
    display: block;
    max-width: 100%;
    border-radius: 30px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .vibratory-card { padding: 30px 20px; border-radius: 25px; }
    .grid-items { grid-template-columns: 1fr; }
    .sensor-card { padding: 30px 20px; }
    .image-portal { transform: none; width: 100%; box-sizing: border-box; }/* ============================================================
   FORCE RESPONSIVE RADICAL : LA MÉDIUMNITÉ (DESIGN VIBRATOIRE)
   ============================================================ */

    /* 1. RESET GLOBAL & ANTI-DÉBORDEMENT */
    #clemy-medium-vibration {
        padding: 50px 0 !important;
        overflow-x: hidden !important;
    }

    #clemy-medium-vibration .inner-wrap {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. HEADER : L'HARMONIE "PRESTIGE" (CENTRAGE FORCÉ) */
    #clemy-medium-vibration .section-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 0 !important;
        margin-bottom: 35px !important;
    }

    #clemy-medium-vibration .step-num {
        font-size: 3.5rem !important; /* Calibrage standard du numéro géant */
        opacity: 0.12 !important;
        margin-bottom: -10px !important;
        line-height: 1 !important;
    }

    #clemy-medium-vibration .h2-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        max-width: 290px;
        margin: 0 auto !important;
    }

    #clemy-medium-vibration .line-wine {
        margin: 15px auto 0 !important;
        width: 45px !important;
    }

    /* 3. INTRO */
    #clemy-medium-vibration .intro-p {
        font-size: 1.05rem !important;
        text-align: center !important;
        margin-bottom: 40px !important;
        padding: 0 10px;
        line-height: 1.6 !important;
    }

    /* 4. VIBRATORY CARD (L'ÉCRIN SOMBRE) */
    #clemy-medium-vibration .vibratory-card {
        padding: 30px 20px !important; /* Libération de l'espace de lecture */
        border-radius: 25px !important;
    }

    #clemy-medium-vibration .vibratory-card::after {
        /* On réduit la taille du halo lumineux pour la performance GPU mobile */
        width: 120px !important;
        height: 120px !important;
        opacity: 0.6 !important;
    }

    #clemy-medium-vibration .h3-white {
        font-size: 1.45rem !important;
        text-align: center !important;
        margin-bottom: 25px !important;
    }

    /* Le Processus de Traduction */
    #clemy-medium-vibration .process-flow {
        margin: 30px 0 !important;
    }

    #clemy-medium-vibration .flow-item {
        gap: 15px !important;
        padding: 15px !important;
        border-radius: 15px !important;
        align-items: flex-start !important;
    }

    #clemy-medium-vibration .flow-icon {
        font-size: 1.3rem !important;
        margin-top: 2px !important;
    }

    #clemy-medium-vibration .flow-item div {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
    }

    #clemy-medium-vibration .traducteur-quote {
        padding: 20px 15px !important;
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
        border-radius: 15px !important;
    }

    /* 5. SENSOR GRID (LES CAPTEURS) */
    #clemy-medium-vibration .sensor-grid {
        margin-top: 50px !important;
    }

    #clemy-medium-vibration .grid-title {
        font-size: 0.8rem !important;
        margin-bottom: 25px !important;
    }

    #clemy-medium-vibration .grid-items {
        grid-template-columns: 1fr !important; /* Empilement des cartes */
        gap: 20px !important;
    }

    #clemy-medium-vibration .sensor-card {
        padding: 25px 20px !important; /* Optimisation de l'espace texte */
        border-radius: 20px !important;
        border-top-width: 4px !important; /* Affinage de la bordure supérieure */
        transform: none !important; /* SÉCURITÉ TACTILE : On bloque le saut au survol */
    }

    #clemy-medium-vibration .sensor-card:hover {
        transform: none !important;
        box-shadow: 0 5px 15px rgba(0,0,0,0.03) !important;
    }

    #clemy-medium-vibration .sensor-head {
        font-size: 1.2rem !important;
        margin-bottom: 10px !important;
        text-align: center !important;
    }

    #clemy-medium-vibration .sensor-card p {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
        margin: 0 !important;
        text-align: center !important;
    }

    /* 6. VISUAL FOOTER (IMAGE REDRESSÉE) */
    #clemy-medium-vibration .visual-footer {
        margin-top: 40px !important;
    }

    #clemy-medium-vibration .image-portal {
        padding: 8px !important; /* Cadre plus fin */
        border-radius: 20px !important;
        transform: none !important; /* On confirme l'annulation de la rotation */
        max-width: 280px !important; /* Calibrage pour éviter l'effet "mur" */
        margin: 0 auto !important;
    }

    #clemy-medium-vibration .image-portal img {
        border-radius: 15px !important;
    }
}@media (max-width: 350px) {
    #clemy-medium-vibration .h2-title { font-size: 1.4rem !important; }
    #clemy-medium-vibration .h3-white { font-size: 1.35rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-385b813 *//* --- SECTION CLAIRVOYANCE : DESIGN OPTIQUE --- */
#clemy-clairvoyance-vision {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --soft-blue: #F4F6FB;
    
    padding: clamp(60px, 8vw, 100px) 0;
    background: var(--white);
    font-family: 'Inter', -apple-system, sans-serif;
    color: var(--dark);
    line-height: 1.8;
}

.inner-wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 25px;
}

/* HEADER SECTION */
.section-header {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 50px;
}

.step-num {
    font-size: clamp(4rem, 12vw, 6rem);
    font-weight: 900;
    color: var(--wine); /* Alternance avec l'améthyste pour dynamiser */
    opacity: 0.15;
    line-height: 1;
}

.h2-title {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    font-weight: 300;
    margin: 0;
    line-height: 1.1;
}

.h2-title strong {
    color: var(--amethyst);
    font-weight: 900;
}

.line-amethyst {
    width: 60px;
    height: 5px;
    background: var(--amethyst);
    margin-top: 15px;
    border-radius: 10px;
}

/* INTRO */
.intro-p {
    font-size: 1.2rem;
    margin-bottom: 50px;
    max-width: 800px;
}

.link-wine { color: var(--wine); font-weight: 800; text-decoration: underline; }

/* EXPLORATION CARD */
.exploration-card {
    background: var(--soft-blue);
    border-radius: 40px;
    padding: clamp(30px, 6vw, 50px);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(142, 68, 173, 0.1);
}

.card-glow-blue {
    position: absolute;
    bottom: -50px; left: -50px;
    width: 250px; height: 250px;
    background: radial-gradient(circle, rgba(142, 68, 173, 0.1) 0%, transparent 70%);
}

.h3-dark { color: var(--dark); font-size: 1.6rem; font-weight: 900; margin-bottom: 30px; }

/* VISION MATRIX (GRID RESPONSIVE) */
.vision-matrix {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 25px;
    position: relative;
    z-index: 2;
}

.matrix-item {
    background: var(--white);
    padding: 25px;
    border-radius: 20px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.03);
    border-left: 4px solid var(--amethyst);
    transition: 0.3s ease;
}

.matrix-item:hover { transform: scale(1.03); border-left-color: var(--wine); }

.matrix-icon { font-size: 1.5rem; margin-bottom: 10px; }
.matrix-txt { font-size: 0.95rem; color: #555; line-height: 1.5; }
.matrix-txt strong { color: var(--dark); display: block; margin-bottom: 3px; }

/* FLASHES CONTAINER */
.flashes-container {
    margin-top: 80px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}

.h3-wine { color: var(--wine); font-size: 1.6rem; font-weight: 900; margin-bottom: 20px; }

.mancie-info-box {
    background: var(--dark);
    color: white;
    padding: 35px;
    border-radius: 30px;
    position: relative;
}

.mancie-label {
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--amethyst);
    margin-bottom: 15px;
}

.mancie-info-box p { margin: 0; font-style: italic; font-size: 1.1rem; line-height: 1.6; }

/* RESPONSIVE */
@media (max-width: 850px) {
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .flashes-container { grid-template-columns: 1fr; }
    .exploration-card { padding: 30px 20px; border-radius: 25px; }
}@media (max-width: 768px) {
    /* ============================================================
   FORCE RESPONSIVE RADICAL : LA CLAIRVOYANCE (OPTIQUE)
   ============================================================ */

    /* 1. RESET GLOBAL & ANTI-DÉBORDEMENT */
    #clemy-clairvoyance-vision {
        padding: 50px 0 !important;
        overflow-x: hidden !important;
    }

    #clemy-clairvoyance-vision .inner-wrap {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. HEADER : L'HARMONIE "PRESTIGE" (CENTRAGE FORCÉ) */
    #clemy-clairvoyance-vision .section-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 0 !important;
        margin-bottom: 35px !important;
    }

    #clemy-clairvoyance-vision .step-num {
        font-size: 3.5rem !important; /* Calibrage standard du numéro géant */
        opacity: 0.12 !important;
        margin-bottom: -10px !important;
        line-height: 1 !important;
    }

    #clemy-clairvoyance-vision .h2-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        max-width: 290px;
        margin: 0 auto !important;
    }

    #clemy-clairvoyance-vision .line-amethyst {
        margin: 15px auto 0 !important;
        width: 45px !important;
    }

    /* 3. INTRO */
    #clemy-clairvoyance-vision .intro-p {
        font-size: 1.05rem !important;
        text-align: center !important;
        margin-bottom: 40px !important;
        padding: 0 10px;
        line-height: 1.6 !important;
    }

    /* 4. EXPLORATION CARD (LE FOND BLEUTÉ) */
    #clemy-clairvoyance-vision .exploration-card {
        padding: 30px 20px !important; /* Aération de la zone */
        border-radius: 25px !important;
        margin-bottom: 50px !important;
    }

    #clemy-clairvoyance-vision .card-glow-blue {
        width: 150px !important; /* Réduction du halo pour la perf mobile */
        height: 150px !important;
        bottom: -30px !important;
        left: -30px !important;
    }

    #clemy-clairvoyance-vision .h3-dark {
        font-size: 1.45rem !important;
        text-align: center !important;
        margin-bottom: 25px !important;
    }

    /* LA MATRICE DE VISION (CARTES) */
    #clemy-clairvoyance-vision .vision-matrix {
        grid-template-columns: 1fr !important; /* Empilement vertical forcé */
        gap: 15px !important;
    }

    #clemy-clairvoyance-vision .matrix-item {
        padding: 20px 15px !important;
        border-radius: 18px !important;
        border-left-width: 3px !important; /* Affinage de la bordure */
        transform: none !important; /* SÉCURITÉ TACTILE : blocage du zoom */
    }

    #clemy-clairvoyance-vision .matrix-item:hover {
        transform: none !important; /* Annulation du scale() au scroll */
        border-left-color: var(--amethyst) !important; /* On fige la couleur initiale pour éviter l'effet flash */
    }

    #clemy-clairvoyance-vision .matrix-icon {
        font-size: 1.4rem !important;
        margin-bottom: 8px !important;
    }

    #clemy-clairvoyance-vision .matrix-txt {
        font-size: 0.95rem !important;
    }

    #clemy-clairvoyance-vision .matrix-txt strong {
        font-size: 1.05rem !important;
        margin-bottom: 4px !important;
    }

    /* 5. FLASHES CONTAINER (L'ÉCRIN SOMBRE) */
    #clemy-clairvoyance-vision .flashes-container {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
        margin-top: 50px !important;
    }

    #clemy-clairvoyance-vision .h3-wine {
        font-size: 1.4rem !important;
        text-align: center !important;
        margin-bottom: 20px !important;
    }

    #clemy-clairvoyance-vision .mancie-info-box {
        padding: 30px 20px !important;
        border-radius: 20px !important;
        text-align: center !important; /* Centrage pour asseoir l'autorité du texte */
    }

    #clemy-clairvoyance-vision .mancie-label {
        font-size: 0.65rem !important;
        margin-bottom: 12px !important;
        display: block !important;
    }

    #clemy-clairvoyance-vision .mancie-info-box p {
        font-size: 1rem !important;
        line-height: 1.6 !important;
    }
}@media (max-width: 350px) {
    #clemy-clairvoyance-vision .h2-title { font-size: 1.4rem !important; }
    #clemy-clairvoyance-vision .h3-dark { font-size: 1.35rem !important; }
    #clemy-clairvoyance-vision .h3-wine { font-size: 1.3rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-a32b416 *//* --- SECTION COMPARATIF : DESIGN MATRICE --- */
#clemy-medium-vs-clairvoyant {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --soft-gray: #F9F7FB;
    
    padding: clamp(60px, 8vw, 100px) 0;
    background: var(--white);
    font-family: 'Inter', -apple-system, sans-serif;
    color: var(--dark);
    line-height: 1.6;
}

.inner-wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 25px;
}

/* HEADER SECTION */
.section-header {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 50px;
}

.step-num {
    font-size: clamp(4rem, 12vw, 6rem);
    font-weight: 900;
    color: var(--wine);
    opacity: 0.15;
    line-height: 1;
}

.h2-title {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    font-weight: 300;
    margin: 0;
    line-height: 1.1;
}

.h2-title strong {
    color: var(--dark);
    font-weight: 900;
}

.line-wine {
    width: 60px;
    height: 5px;
    background: var(--wine);
    margin-top: 15px;
    border-radius: 10px;
}

/* GOLDEN RULE BOX (DARK MODE) */
.golden-rule-box {
    display: flex;
    gap: 25px;
    align-items: flex-start;
    background: var(--dark);
    color: var(--white);
    padding: clamp(25px, 5vw, 40px);
    border-radius: 25px;
    margin-bottom: 60px;
    border-left: 8px solid var(--amethyst);
    box-shadow: 0 20px 40px rgba(26, 11, 46, 0.15);
}

.rule-icon { font-size: 2.5rem; line-height: 1; }
.rule-text { font-size: 1.15rem; font-style: italic; line-height: 1.7; }
.rule-text strong { color: var(--white); font-style: normal; font-weight: 800; }

.link-amethyst-glow {
    color: var(--amethyst);
    text-decoration: underline;
    text-underline-offset: 4px;
    transition: 0.3s;
}

.link-amethyst-glow:hover { color: var(--wine); }

/* --- MATRICE COMPARATIVE (CSS GRID) --- */
.comparison-matrix-luxe {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.matrix-header {
    display: grid;
    grid-template-columns: 1fr 1.5fr 1.5fr;
    gap: 15px;
    padding: 15px 25px;
    background: var(--dark);
    color: var(--white);
    border-radius: 15px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem;
}

.col-medium span, .col-clairvoyant span {
    display: block;
    font-weight: 400;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
    text-transform: none;
    letter-spacing: 0;
}

.matrix-row {
    display: grid;
    grid-template-columns: 1fr 1.5fr 1.5fr;
    gap: 15px;
    background: var(--soft-gray);
    padding: 20px 25px;
    border-radius: 15px;
    align-items: center;
    border: 1px solid rgba(0,0,0,0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.matrix-row:hover {
    transform: scale(1.02);
    box-shadow: 0 15px 30px rgba(26, 11, 46, 0.08);
    background: var(--white);
}

.cell-critere {
    font-weight: 800;
    color: var(--wine);
    font-size: 1.05rem;
}

.cell-data { color: #444; font-size: 0.95rem; }

/* VISUAL FOOTER */
.visual-footer { text-align: center; margin-top: 60px; }
.image-portal { display: inline-block; padding: 12px; background: var(--soft-gray); border-radius: 30px; }
.image-portal img { display: block; max-width: 100%; border-radius: 20px; box-shadow: 0 15px 35px rgba(0,0,0,0.1); }

/* --- RESPONSIVE LOGIC (LA MAGIE OPÈRE ICI) --- */
@media (max-width: 850px) {
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .golden-rule-box { flex-direction: column; gap: 15px; }
    
    /* Transformation de la matrice en cartes verticales */
    .matrix-header { display: none; } /* On cache l'en-tête sur mobile */
    
    .matrix-row {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 25px;
        background: var(--white);
        border: 1px solid #EAEAEA;
        box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    }

    .cell-critere {
        font-size: 1.2rem;
        border-bottom: 2px solid var(--soft-gray);
        padding-bottom: 10px;
        margin-bottom: 5px;
        color: var(--dark);
    }

    .cell-data {
        display: flex;
        flex-direction: column;
        color: #555;
    }

    /* Injection du texte "Médium :" ou "Clairvoyant :" devant la donnée sur mobile */
    .cell-data::before {
        content: attr(data-label);
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-size: 0.75rem;
        margin-bottom: 4px;
    }

    .cell-medium::before { color: var(--amethyst); }
    .cell-clairvoyant::before { color: var(--wine); margin-top: 10px; }
}@media (max-width: 768px) {
    /* ============================================================
   FORCE RESPONSIVE RADICAL : MATRICE COMPARATIVE MÉDIUM/CLAIRVOYANT
   ============================================================ */

    /* 1. RESET GLOBAL & ANTI-DÉBORDEMENT */
    #clemy-medium-vs-clairvoyant {
        padding: 50px 0 !important;
        overflow-x: hidden !important;
    }

    #clemy-medium-vs-clairvoyant .inner-wrap {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. HEADER : L'HARMONIE "PRESTIGE" (CENTRAGE FORCÉ) */
    #clemy-medium-vs-clairvoyant .section-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 0 !important;
        margin-bottom: 35px !important;
    }

    #clemy-medium-vs-clairvoyant .step-num {
        font-size: 3.5rem !important;
        opacity: 0.12 !important;
        margin-bottom: -10px !important;
        line-height: 1 !important;
    }

    #clemy-medium-vs-clairvoyant .h2-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        max-width: 290px;
        margin: 0 auto !important;
    }

    #clemy-medium-vs-clairvoyant .line-wine {
        margin: 15px auto 0 !important;
        width: 45px !important;
    }

    /* 3. GOLDEN RULE BOX (LE BLOC SOMBRE D'INTRODUCTION) */
    #clemy-medium-vs-clairvoyant .golden-rule-box {
        flex-direction: column !important; /* L'icône passe au-dessus du texte */
        padding: 30px 20px !important; /* Libération de l'espace */
        gap: 15px !important;
        border-radius: 20px !important;
        border-left-width: 4px !important; /* Affinage de la bordure améthyste */
        margin-bottom: 40px !important;
        text-align: center !important; /* Effet citation centré sur mobile */
    }

    #clemy-medium-vs-clairvoyant .rule-icon {
        font-size: 2rem !important;
        margin: 0 auto !important; /* Centrage de l'icône */
    }

    #clemy-medium-vs-clairvoyant .rule-text {
        font-size: 1rem !important;
        line-height: 1.6 !important;
    }

    /* 4. LA MATRICE DEVIENT DES CARTES VERTICALES (MOBILE) */
    #clemy-medium-vs-clairvoyant .matrix-header {
        display: none !important; /* Disparition de l'en-tête de grille */
    }

    #clemy-medium-vs-clairvoyant .comparison-matrix-luxe {
        gap: 20px !important; /* Espacement entre les nouvelles cartes générées */
    }

    #clemy-medium-vs-clairvoyant .matrix-row {
        grid-template-columns: 1fr !important; /* Empilement des colonnes en lignes */
        gap: 15px !important;
        padding: 25px 20px !important; /* Aération de la carte */
        background: var(--soft-gray) !important; /* Maintien du fond gris pour contraster avec la page */
        border-radius: 20px !important;
        transform: none !important; /* SÉCURITÉ TACTILE : blocage du scale() au scroll */
    }

    #clemy-medium-vs-clairvoyant .matrix-row:hover {
        transform: none !important; /* Annulation du saut */
        box-shadow: none !important; /* Annulation du clignotement de l'ombre */
    }

    /* Traitement du titre de la carte (le Critère) */
    #clemy-medium-vs-clairvoyant .cell-critere {
        font-size: 1.15rem !important;
        border-bottom: 1px solid rgba(0,0,0,0.05) !important; /* Ligne séparatrice fine */
        padding-bottom: 15px !important;
        margin-bottom: 10px !important;
        color: var(--wine) !important;
        text-align: center !important; /* Le critère est le roi de sa carte */
    }

    /* Traitement des données */
    #clemy-medium-vs-clairvoyant .cell-data {
        display: flex !important;
        flex-direction: column !important;
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
    }

    /* Injection de l'en-tête via l'attribut data-label */
    #clemy-medium-vs-clairvoyant .cell-data::before {
        content: attr(data-label) !important;
        font-weight: 900 !important;
        text-transform: uppercase !important;
        letter-spacing: 1px !important;
        font-size: 0.65rem !important;
        margin-bottom: 5px !important;
    }

    #clemy-medium-vs-clairvoyant .cell-medium::before {
        color: var(--amethyst) !important;
        margin-top: 5px !important;
    }

    #clemy-medium-vs-clairvoyant .cell-clairvoyant::before {
        color: var(--wine) !important;
        margin-top: 20px !important; /* Séparation nette avec la définition du Médium au-dessus */
    }

    /* 5. VISUAL FOOTER (L'IMAGE D'ILLUSTRATION) */
    #clemy-medium-vs-clairvoyant .visual-footer {
        margin-top: 40px !important;
    }

    #clemy-medium-vs-clairvoyant .image-portal {
        padding: 8px !important; /* Cadre plus fin */
        border-radius: 20px !important;
        max-width: 280px !important; /* Empêche l'image de faire "mur" sur un petit écran */
        margin: 0 auto !important;
    }

    #clemy-medium-vs-clairvoyant .image-portal img {
        border-radius: 15px !important;
    }
}@media (max-width: 350px) {
    #clemy-medium-vs-clairvoyant .h2-title { font-size: 1.4rem !important; }
    #clemy-medium-vs-clairvoyant .cell-critere { font-size: 1.05rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-f29b830 *//* --- SECTION NEUROSCIENCES : DASHBOARD BIOMÉTRIQUE --- */
#clemy-neuro-science {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --soft-gray: #F9F7FB;
    
    padding: clamp(60px, 8vw, 100px) 0;
    background: var(--white);
    font-family: 'Inter', -apple-system, sans-serif;
    color: var(--dark);
    line-height: 1.7;
}

.inner-wrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 25px;
}

/* HEADER SECTION COHÉRENT */
.section-header { display: flex; align-items: center; gap: 30px; margin-bottom: 40px; }
.step-num { font-size: clamp(4rem, 12vw, 6rem); font-weight: 900; color: var(--amethyst); opacity: 0.15; line-height: 1; }
.h2-title { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 300; margin: 0; line-height: 1.1; }
.h2-title strong { color: var(--dark); font-weight: 900; }
.line-amethyst { width: 60px; height: 5px; background: var(--amethyst); margin-top: 15px; border-radius: 10px; }
.intro-p { font-size: 1.2rem; margin-bottom: 60px; max-width: 800px; color: #444; }

/* --- NEURO DASHBOARD (GRID) --- */
.neuro-dashboard {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 40px;
}

.neuro-card {
    border-radius: 40px;
    padding: clamp(30px, 5vw, 50px);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
    display: flex;
    flex-direction: column;
    gap: 30px;
    position: relative;
    overflow: hidden;
}

.neuro-card:hover { transform: translateY(-10px); }

/* CARTE 1 : ONDES (DARK MODE) */
.card-waves {
    background: var(--dark);
    color: var(--white);
    box-shadow: 0 30px 60px rgba(26, 11, 46, 0.2);
}
.card-waves p { color: rgba(255,255,255,0.8); }

/* CARTE 2 : GLANDE (LIGHT MODE) */
.card-gland {
    background: var(--soft-gray);
    color: var(--dark);
    border: 1px solid #F0F0F0;
    box-shadow: 0 20px 40px rgba(0,0,0,0.03);
}

.h3-amethyst { color: var(--amethyst); font-size: 1.6rem; font-weight: 900; margin: 0 0 15px 0; }
.h3-wine { color: var(--wine); font-size: 1.6rem; font-weight: 900; margin: 0 0 15px 0; }

.link-amethyst-glow { color: var(--amethyst); text-decoration: underline; font-weight: 700; transition: 0.3s; }
.link-amethyst-glow:hover { color: var(--white); text-shadow: 0 0 10px var(--amethyst); }

/* --- UI VISUALS (DATA ART EN PUR CSS) --- */

/* Visualisation des ondes */
.ui-visual-waves {
    display: flex;
    flex-direction: column;
    gap: 15px;
    background: rgba(255,255,255,0.05);
    padding: 25px;
    border-radius: 25px;
    border: 1px solid rgba(142, 68, 173, 0.2);
}

.wave-track { display: flex; align-items: center; gap: 15px; }
.wave-label { font-size: 0.75rem; font-weight: 900; text-transform: uppercase; letter-spacing: 2px; width: 50px; opacity: 0.7; }
.amethyst-glow { color: var(--amethyst); opacity: 1; text-shadow: 0 0 10px rgba(142,68,173,0.5); }

.wave-line { height: 4px; border-radius: 5px; flex-grow: 1; background: rgba(255,255,255,0.1); position: relative; overflow: hidden; }
.wave-line::after { content: ''; position: absolute; top: 0; left: 0; height: 100%; border-radius: 5px; }

.line-beta::after { width: 30%; background: #666; } /* Onde agitée/courte */
.line-alpha::after { width: 60%; background: var(--wine); } /* Onde moyenne */
.line-theta::after { width: 100%; background: var(--amethyst); box-shadow: 0 0 15px var(--amethyst); } /* Onde profonde, totale */

/* Visualisation de la Glande Pinéale (3ème Oeil) */
.ui-visual-pineal {
    height: 120px;
    background: var(--white);
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 1px solid #EAEAEA;
}

.pineal-core {
    width: 20px; height: 20px;
    background: var(--wine);
    border-radius: 50%;
    position: relative;
    z-index: 3;
    box-shadow: 0 0 20px var(--wine);
}

.pineal-ring {
    position: absolute;
    border-radius: 50%;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid var(--wine);
    transition: 0.5s ease;
}

.ring-1 { width: 50px; height: 50px; opacity: 0.5; }
.ring-2 { width: 80px; height: 80px; opacity: 0.2; }

.card-gland:hover .ring-1 { width: 60px; height: 60px; opacity: 0.8; border-color: var(--amethyst); }
.card-gland:hover .ring-2 { width: 100px; height: 100px; opacity: 0.4; border-color: var(--amethyst); }

/* --- RESPONSIVE LOGIC --- */
@media (max-width: 850px) {
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .neuro-dashboard { grid-template-columns: 1fr; gap: 30px; }
    .neuro-card { padding: 30px 25px; border-radius: 30px; }
}
@media (max-width: 768px) {
    /* ============================================================
   FORCE RESPONSIVE RADICAL : NEUROSCIENCES (DASHBOARD BIO)
   ============================================================ */

    /* 1. RESET GLOBAL & ANTI-DÉBORDEMENT */
    #clemy-neuro-science {
        padding: 50px 0 !important;
        overflow-x: hidden !important;
    }

    #clemy-neuro-science .inner-wrap {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. HEADER : L'HARMONIE "PRESTIGE" (CENTRAGE FORCÉ) */
    #clemy-neuro-science .section-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 0 !important;
        margin-bottom: 35px !important;
    }

    #clemy-neuro-science .step-num {
        font-size: 3.5rem !important; /* Calibrage standard du numéro géant */
        opacity: 0.12 !important;
        margin-bottom: -10px !important;
        line-height: 1 !important;
    }

    #clemy-neuro-science .h2-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        max-width: 290px;
        margin: 0 auto !important;
    }

    #clemy-neuro-science .line-amethyst {
        margin: 15px auto 0 !important;
        width: 45px !important;
    }

    /* 3. INTRO */
    #clemy-neuro-science .intro-p {
        font-size: 1.05rem !important;
        text-align: center !important;
        margin-bottom: 40px !important;
        padding: 0 10px;
        line-height: 1.6 !important;
    }

    /* 4. NEURO DASHBOARD (LES CARTES BIOMÉTRIQUES) */
    #clemy-neuro-science .neuro-dashboard {
        grid-template-columns: 1fr !important; /* Empilement forcé sur mobile */
        gap: 25px !important;
    }

    #clemy-neuro-science .neuro-card {
        padding: 25px 20px !important; /* Libération de l'espace de lecture */
        border-radius: 20px !important;
        gap: 20px !important;
        transform: none !important; /* SÉCURITÉ TACTILE : blocage du saut (translateY) */
    }

    #clemy-neuro-science .neuro-card:hover {
        transform: none !important; /* Annulation du saut au scroll */
    }

    #clemy-neuro-science .h3-amethyst,
    #clemy-neuro-science .h3-wine {
        font-size: 1.35rem !important;
        text-align: center !important; /* Centrage des titres de cartes */
        margin-bottom: 10px !important;
    }

    #clemy-neuro-science .neuro-card p {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        text-align: left !important; /* On maintient le texte à gauche pour la lisibilité */
    }

    /* 5. UI VISUALS : LES ONDES (DATA ART) */
    #clemy-neuro-science .ui-visual-waves {
        padding: 20px 15px !important; /* Affinage du cadre intérieur */
        border-radius: 15px !important;
        gap: 12px !important;
    }

    #clemy-neuro-science .wave-track {
        gap: 10px !important;
    }

    #clemy-neuro-science .wave-label {
        font-size: 0.7rem !important;
        width: 45px !important; /* Calibrage pour ne pas écraser la barre d'onde */
    }

    /* 6. UI VISUALS : LA GLANDE PINÉALE (3EME OEIL) */
    #clemy-neuro-science .ui-visual-pineal {
        height: 100px !important; /* Réduction de la hauteur du cadre blanc */
        border-radius: 15px !important;
    }

    /* Pour remplacer le "hover" (qui ne marche pas sur mobile), 
       on applique directement l'état "déployé" ou un état intermédiaire. */
    #clemy-neuro-science .ring-1 {
        width: 55px !important;
        height: 55px !important;
        opacity: 0.6 !important;
        border-color: var(--amethyst) !important;
    }

    #clemy-neuro-science .ring-2 {
        width: 85px !important;
        height: 85px !important;
        opacity: 0.3 !important;
        border-color: var(--amethyst) !important;
    }
}@media (max-width: 350px) {
    #clemy-neuro-science .h2-title { font-size: 1.4rem !important; }
    #clemy-neuro-science .h3-amethyst, #clemy-neuro-science .h3-wine { font-size: 1.25rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-5c1764ef *//* --- SECTION 05 (ÉTHIQUE) & CTA FINAL : UX SYSTEM --- */
#clemy-ethics-security, #clemy-final-portal {
    --wine: #9A2A5B;
    --amethyst: #8E44AD;
    --dark: #1A0B2E;
    --white: #FFFFFF;
    --soft-gray: #F9F7FB;
    
    font-family: 'Inter', -apple-system, sans-serif;
    line-height: 1.7;
}

#clemy-ethics-security {
    background: var(--white);
    color: var(--dark);
    padding: clamp(60px, 8vw, 100px) 0;
}

.inner-wrap { max-width: 1050px; margin: 0 auto; padding: 0 25px; }

/* HEADER SECTION */
.section-header { display: flex; align-items: center; gap: 30px; margin-bottom: 40px; }
.step-num { font-size: clamp(4rem, 12vw, 6rem); font-weight: 900; color: var(--wine); opacity: 0.15; line-height: 1; }
.h2-title { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 300; margin: 0; line-height: 1.1; }
.h2-title strong { color: var(--dark); font-weight: 900; }
.line-wine { width: 60px; height: 5px; background: var(--wine); margin-top: 15px; border-radius: 10px; }
.intro-p { font-size: 1.2rem; margin-bottom: 50px; max-width: 800px; color: #444; }

/* --- SECURITY GRID UX --- */
.security-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 30px;
    margin-bottom: 60px;
}

.security-card {
    border-radius: 35px;
    padding: clamp(30px, 4vw, 45px);
    transition: transform 0.3s ease;
}

/* CARTE ALERTE (FILAIRE) */
.card-alert {
    background: rgba(154, 42, 91, 0.02);
    border: 2px dashed rgba(154, 42, 91, 0.3);
}
.card-alert:hover { background: rgba(154, 42, 91, 0.05); border-style: solid; border-color: var(--wine); transform: translateY(-5px); }

.alert-header { display: flex; gap: 15px; align-items: center; margin-bottom: 20px; }
.alert-icon { font-size: 2rem; }
.h3-wine { color: var(--wine); font-size: 1.5rem; font-weight: 900; margin: 0; line-height: 1.3; }

.truth-highlight {
    background: var(--white);
    padding: 20px;
    border-radius: 15px;
    border-left: 4px solid var(--wine);
    margin-top: 25px;
    font-size: 1rem;
    color: #444;
    box-shadow: 0 10px 20px rgba(0,0,0,0.03);
}
.truth-highlight strong { color: var(--dark); }

/* CARTE AUTORITÉ (DARK MODE) */
.card-authority {
    background: var(--dark);
    color: var(--white);
    box-shadow: 0 30px 60px rgba(26, 11, 46, 0.2);
    position: relative;
    overflow: hidden;
}
.card-authority:hover { transform: translateY(-5px); }

.authority-badge {
    display: inline-block;
    background: var(--amethyst);
    color: var(--white);
    padding: 6px 15px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 25px;
}

.authority-lead { font-size: 1.3rem; font-weight: 700; line-height: 1.4; margin-bottom: 25px; }

.fake-example {
    background: rgba(255, 255, 255, 0.05);
    padding: 20px;
    border-radius: 15px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.95rem;
    color: #CCC;
    margin-bottom: 25px;
}
.red-cross { font-size: 1.2rem; margin-right: 10px; }
.fake-example strong { color: var(--wine); }

.authority-conclusion { font-size: 1.05rem; line-height: 1.6; color: rgba(255, 255, 255, 0.9); }
.link-amethyst-glow { color: var(--amethyst); font-weight: 800; text-decoration: underline; transition: 0.3s; }
.link-amethyst-glow:hover { color: var(--white); text-shadow: 0 0 10px var(--amethyst); }

/* --- FREE WILL BANNER --- */
.free-will-banner {
    background: var(--soft-gray);
    padding: 35px 40px;
    border-radius: 25px;
    text-align: center;
    border-top: 4px solid var(--dark);
}
.banner-content { font-size: 1.1rem; color: #555; line-height: 1.6; }
.banner-content strong { color: var(--dark); font-weight: 900; text-transform: uppercase; font-size: 0.9rem; letter-spacing: 1px; display: block; margin-bottom: 10px; }
.banner-content span { color: var(--wine); font-weight: 700; display: block; margin-top: 10px; }


/* ========================================== */
/* --- CTA FINAL (PORTAIL MAGNÉTIQUE) --- */
/* ========================================== */
#clemy-final-portal {
    padding: 0 20px 100px;
}

.portal-container {
    max-width: 1050px;
    margin: 0 auto;
    background: linear-gradient(135deg, var(--dark) 0%, var(--wine) 100%);
    border-radius: 40px;
    padding: clamp(60px, 8vw, 100px) 25px;
    text-align: center;
    color: var(--white);
    position: relative;
    overflow: hidden;
    box-shadow: 0 40px 80px rgba(26, 11, 46, 0.3);
}

.portal-aura {
    position: absolute;
    top: -50%; left: 50%;
    transform: translateX(-50%);
    width: 800px; height: 800px;
    background: radial-gradient(circle, rgba(142, 68, 173, 0.3) 0%, transparent 60%);
    z-index: 0;
    pointer-events: none;
}

.portal-content { position: relative; z-index: 1; }

.portal-title { font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 900; line-height: 1.1; margin: 0 0 25px 0; }
.portal-desc { font-size: clamp(1.1rem, 3vw, 1.3rem); opacity: 0.9; max-width: 800px; margin: 0 auto 50px; line-height: 1.6; }

.btn-portal-massive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    background: var(--white);
    color: var(--dark);
    padding: 22px clamp(30px, 5vw, 60px);
    border-radius: 100px;
    text-decoration: none;
    font-weight: 900;
    font-size: clamp(1.1rem, 3vw, 1.5rem);
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.btn-portal-massive:hover { transform: scale(1.05) translateY(-5px); color: var(--wine); box-shadow: 0 30px 60px rgba(0,0,0,0.4); }
.btn-icon { font-size: 1.6rem; }

.portal-trust-labels {
    margin-top: 50px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    opacity: 0.7;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}

/* --- RESPONSIVE LOGIC --- */
@media (max-width: 900px) {
    .security-grid { grid-template-columns: 1fr; gap: 30px; }
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
}

@media (max-width: 600px) {
    .security-card { padding: 30px 20px; border-radius: 25px; }
    .h3-wine { font-size: 1.3rem; }
    .truth-highlight { padding: 15px; font-size: 0.95rem; }
    .free-will-banner { padding: 25px 20px; border-radius: 20px; }
    .portal-container { border-radius: 30px; padding: 50px 20px; }
    .portal-trust-labels { flex-direction: column; gap: 8px; }
    .portal-trust-labels span::after { content: ""; } /* Enlève les puces sur mobile */
}@media (max-width: 768px) {
    /* ============================================================
   FORCE RESPONSIVE RADICAL : ÉTHIQUE & CTA FINAL 
   (#clemy-ethics-security, #clemy-final-portal)
   ============================================================ */

    /* --- 1. ÉTHIQUE & SÉCURITÉ (SECTION 05) --- */

    #clemy-ethics-security {
        padding: 50px 0 !important;
        overflow-x: hidden !important;
    }

    #clemy-ethics-security .inner-wrap {
        padding: 0 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* HEADER : L'HARMONIE "PRESTIGE" (CENTRAGE FORCÉ) */
    #clemy-ethics-security .section-header {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center;
        gap: 0 !important;
        margin-bottom: 35px !important;
    }

    #clemy-ethics-security .step-num {
        font-size: 3.5rem !important;
        opacity: 0.12 !important;
        margin-bottom: -10px !important;
        line-height: 1 !important;
    }

    #clemy-ethics-security .h2-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        max-width: 290px;
        margin: 0 auto !important;
    }

    #clemy-ethics-security .line-wine {
        margin: 15px auto 0 !important;
        width: 45px !important;
    }

    /* INTRO */
    #clemy-ethics-security .intro-p {
        font-size: 1.05rem !important;
        text-align: center !important;
        margin-bottom: 30px !important;
        padding: 0 10px;
        line-height: 1.6 !important;
    }

    /* SECURITY GRID (L'ALERTE & L'AUTORITÉ) */
    #clemy-ethics-security .security-grid {
        grid-template-columns: 1fr !important; /* Empilement forcé sur mobile */
        gap: 30px !important;
        margin-bottom: 40px !important;
    }

    #clemy-ethics-security .security-card {
        padding: 25px 20px !important; /* Libération de l'espace de lecture */
        border-radius: 20px !important;
        transform: none !important; /* SÉCURITÉ TACTILE : blocage du translateY */
    }

    #clemy-ethics-security .security-card:hover {
        transform: none !important; /* Annulation du saut au scroll */
    }

    /* Carte Alerte Filaire */
    #clemy-ethics-security .alert-header {
        flex-direction: column !important; /* Icône au-dessus du titre */
        align-items: center !important;
        text-align: center !important;
        gap: 10px !important;
        margin-bottom: 15px !important;
    }

    #clemy-ethics-security .alert-icon {
        font-size: 1.8rem !important;
    }

    #clemy-ethics-security .h3-wine {
        font-size: 1.4rem !important;
    }

    #clemy-ethics-security .truth-highlight {
        padding: 15px !important;
        border-radius: 12px !important;
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
        border-left-width: 3px !important; /* Affinage de la bordure */
    }

    /* Carte Autorité (Dark Mode) */
    #clemy-ethics-security .authority-badge {
        font-size: 0.65rem !important;
        margin-bottom: 15px !important;
    }

    #clemy-ethics-security .authority-lead {
        font-size: 1.15rem !important;
        margin-bottom: 20px !important;
    }

    #clemy-ethics-security .fake-example {
        padding: 15px !important;
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
        border-radius: 12px !important;
    }

    #clemy-ethics-security .authority-conclusion {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
    }

    /* FREE WILL BANNER (LA RÉASSURANCE FINALE) */
    #clemy-ethics-security .free-will-banner {
        padding: 25px 20px !important;
        border-radius: 20px !important;
        border-top-width: 3px !important;
        margin-bottom: 20px !important;
    }

    #clemy-ethics-security .banner-content {
        font-size: 0.95rem !important;
        line-height: 1.5 !important;
    }

    #clemy-ethics-security .banner-content strong {
        font-size: 0.8rem !important;
        margin-bottom: 8px !important;
    }

    /* --- 2. CTA FINAL (LE PORTAIL MAGNÉTIQUE) --- */

    #clemy-final-portal {
        padding: 0 15px 50px !important; /* Espace optimisé */
        overflow-x: hidden !important;
    }

    #clemy-final-portal .portal-container {
        padding: 50px 20px !important;
        border-radius: 25px !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Réduction du halo en fond pour la fluidité (GPU Saver) */
    #clemy-final-portal .portal-aura {
        width: 150% !important;
        height: 150% !important;
        top: -50% !important;
    }

    #clemy-final-portal .portal-title {
        font-size: 1.8rem !important; /* Évite la césure des grands mots sur iPhone SE */
        margin-bottom: 20px !important;
    }

    #clemy-final-portal .portal-desc {
        font-size: 1.05rem !important;
        margin-bottom: 35px !important;
        line-height: 1.5 !important;
    }

    /* Bouton d'action massif */
    #clemy-final-portal .btn-portal-massive {
        display: flex !important; /* Pour centrer le contenu (icône + texte) */
        width: 100% !important; /* Prend toute la largeur pour le pouce */
        padding: 20px 15px !important;
        font-size: 1.15rem !important;
        box-sizing: border-box !important;
        transform: none !important; /* SÉCURITÉ TACTILE : On bloque les sauts au scroll */
    }

    #clemy-final-portal .btn-portal-massive:hover {
        transform: none !important; /* Annulation de l'effet de zoom */
        box-shadow: 0 20px 40px rgba(0,0,0,0.3) !important; /* Maintien de l'ombre native */
    }

    /* FOOTER TRUST */
    #clemy-final-portal .portal-trust-labels {
        flex-direction: column !important; /* Empilement des mentions de confiance */
        gap: 8px !important;
        font-size: 0.75rem !important;
        letter-spacing: 1.5px !important;
        margin-top: 30px !important;
    }

    #clemy-final-portal .portal-trust-labels span::after {
        display: none !important; /* Suppression des puces intermédiaires si existantes */
    }
}@media (max-width: 350px) { #clemy-ethics-security .h2-title { font-size: 1.4rem !important; }
    #clemy-final-portal .portal-title { font-size: 1.6rem !important; }
    #clemy-final-portal .btn-portal-massive { font-size: 1.05rem !important; }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-4215e87 *//* --- FAQ DÉCRYPTAGE : CLEMY MASTER SYSTEM --- */
#clemy-decryption-expert {
    --purple: #6e1b89;
    --dark: #1e1036;
    --wine: #641235;
    --lavender: #f3e5f5;
    --white: #ffffff;
    --border-lux: rgba(110, 27, 137, 0.15);
    
    padding: clamp(60px, 12vw, 120px) 0;
    background: #ffffff;
    font-family: 'Inter', -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
}

#clemy-decryption-expert .faq-canvas {
    max-width: 900px; margin: 0 auto; padding: 0 25px;
}

/* --- HEADER --- */
#clemy-decryption-expert .faq-header { text-align: center; margin-bottom: 60px; }

#clemy-decryption-expert .kicker-badge {
    display: inline-block; background: var(--lavender); color: var(--purple);
    padding: 8px 22px; border-radius: 50px; font-size: 0.75rem; 
    font-weight: 900; text-transform: uppercase; letter-spacing: 3px;
    margin-bottom: 25px; border: 1px solid rgba(110, 27, 137, 0.1);
}

#clemy-decryption-expert .display-title {
    font-family: 'Playfair Display', serif; font-size: clamp(2.4rem, 6vw, 3.5rem);
    font-weight: 900; line-height: 1.1; margin-bottom: 20px; color: var(--dark);
}

#clemy-decryption-expert .text-gradient {
    background: linear-gradient(135deg, var(--purple), var(--wine));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

/* --- ACCORDION ITEMS --- */
#clemy-decryption-expert .faq-accordion-group { display: flex; flex-direction: column; gap: 18px; }

#clemy-decryption-expert .faq-item {
    background: #ffffff; border: 1px solid var(--border-lux); border-radius: 20px;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: hidden;
}

#clemy-decryption-expert .faq-item:hover {
    border-color: var(--purple);
    box-shadow: 0 15px 35px rgba(110, 27, 137, 0.05);
}

#clemy-decryption-expert .faq-item[open] {
    border-color: var(--purple);
    box-shadow: 0 25px 60px rgba(30, 16, 54, 0.08);
}

/* Highlighting Specificity */
#clemy-decryption-expert .featured-neuro[open] { border-left: 6px solid var(--wine); }
#clemy-decryption-expert .item-security[open] { border-left: 6px solid var(--purple); }

/* Summary Styling */
#clemy-decryption-expert summary {
    padding: 28px 30px; cursor: pointer; list-style: none;
    display: flex; align-items: center; gap: 20px;
}

#clemy-decryption-expert summary::-webkit-details-marker { display: none; }

#clemy-decryption-expert .q-num {
    font-family: 'Playfair Display', serif; font-size: 1.3rem; font-weight: 900;
    color: var(--purple); opacity: 0.4; min-width: 35px;
}

#clemy-decryption-expert .q-text {
    font-size: 1.05rem; font-weight: 700; color: var(--dark);
    flex-grow: 1; padding-right: 30px; line-height: 1.4;
}

/* Custom Chevron */
#clemy-decryption-expert .q-chevron {
    width: 20px; height: 20px; position: relative; transition: 0.4s;
}
#clemy-decryption-expert .q-chevron::before, 
#clemy-decryption-expert .q-chevron::after {
    content: ''; position: absolute; top: 50%; left: 50%;
    width: 12px; height: 2px; background: var(--purple); transition: 0.4s;
}
#clemy-decryption-expert .q-chevron::before { transform: translate(-50%, -50%) rotate(0deg); }
#clemy-decryption-expert .q-chevron::after { transform: translate(-50%, -50%) rotate(90deg); }
#clemy-decryption-expert .faq-item[open] .q-chevron { transform: rotate(45deg); }

/* Content Styling */
#clemy-decryption-expert .faq-content {
    padding: 0 35px 35px 85px; color: #555;
    line-height: 1.8; font-size: 1rem;
    animation: faqExpertIn 0.5s ease-out;
}

@keyframes faqExpertIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

#clemy-decryption-expert .faq-content strong { color: var(--wine); font-weight: 800; }

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
    #clemy-decryption-expert .faq-canvas { padding: 0 20px; }
    #clemy-decryption-expert .faq-content { padding: 0 25px 30px 25px; }
    #clemy-decryption-expert .q-num { display: none; }
    #clemy-decryption-expert .display-title { text-align: left; }
}/* End custom CSS */