.elementor-107 .elementor-element.elementor-element-86de6e3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-107 .elementor-element.elementor-element-35bcb48{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-107 .elementor-element.elementor-element-35bcb48 img{width:100%;height:500px;}.elementor-107 .elementor-element.elementor-element-6a90199{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-68da676{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-5bb82b2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-a0f3ade{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-a0f3ade:not(.elementor-motion-effects-element-type-background), .elementor-107 .elementor-element.elementor-element-a0f3ade > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(100deg, #204FF8 10%, #05204A 100%);}.elementor-107 .elementor-element.elementor-element-a42e4ac{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:20px;--padding-left:50px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-8a9828e{--display:flex;}.elementor-107 .elementor-element.elementor-element-8a9828e.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-107 .elementor-element.elementor-element-4aca7cf .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:18px;font-weight:400;color:#FFFFFF;}.elementor-107 .elementor-element.elementor-element-9d54ba8 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:60px;font-weight:400;color:#FFFFFF;}.elementor-107 .elementor-element.elementor-element-fb5c0a6{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-9a71ff2{width:var( --container-widget-width, 55.458% );max-width:55.458%;--container-widget-width:55.458%;--container-widget-flex-grow:0;text-align:start;}.elementor-107 .elementor-element.elementor-element-9a71ff2.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-107 .elementor-element.elementor-element-9a71ff2 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:20px;font-weight:300;line-height:29px;color:#999999;}.elementor-107 .elementor-element.elementor-element-9996f9f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-107 .elementor-element.elementor-element-d816665{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:50px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-d816665.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-107 .elementor-element.elementor-element-c30ea54 img{width:47%;max-width:38%;height:300px;}.elementor-107 .elementor-element.elementor-element-72135e4{margin:200px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-107 .elementor-element.elementor-element-8e2bed3{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-ee9f3bf{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 20px 0px 20px;}.elementor-107 .elementor-element.elementor-element-f418e21{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-c87e594{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-195256c.elementor-element{--align-self:center;}.elementor-107 .elementor-element.elementor-element-195256c .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:60px;font-weight:400;color:#121212;}.elementor-107 .elementor-element.elementor-element-e821d35{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-e821d35:not(.elementor-motion-effects-element-type-background), .elementor-107 .elementor-element.elementor-element-e821d35 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(100deg, #204FF8 10%, #05204A 100%);}.elementor-107 .elementor-element.elementor-element-cf9f222{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-040c5f2{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-217f188{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-a2d7104.elementor-element{--align-self:center;}.elementor-107 .elementor-element.elementor-element-a2d7104{text-align:start;}.elementor-107 .elementor-element.elementor-element-a2d7104 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:18px;font-weight:400;color:#555555;}.elementor-107 .elementor-element.elementor-element-18c5e79{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-107 .elementor-element.elementor-element-18c5e79.elementor-element{--align-self:center;}.elementor-107 .elementor-element.elementor-element-18c5e79 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:60px;font-weight:400;}.elementor-107 .elementor-element.elementor-element-3aee709{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:20px 150px 50px 800px;text-align:justify;}.elementor-107 .elementor-element.elementor-element-3aee709.elementor-element{--align-self:center;}.elementor-107 .elementor-element.elementor-element-3aee709 .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:18px;font-weight:400;line-height:21px;color:#555555;}.elementor-107 .elementor-element.elementor-element-ec512f5{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-107 .elementor-element.elementor-element-9d59714{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-107 .elementor-element.elementor-element-de1bb5d{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-107 .elementor-element.elementor-element-3e15c35{--display:flex;--min-height:390px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-107 .elementor-element.elementor-element-8a9828e{--width:36.777%;}.elementor-107 .elementor-element.elementor-element-d816665{--width:34%;}}@media(max-width:767px){.elementor-107 .elementor-element.elementor-element-35bcb48 img{height:261px;}.elementor-107 .elementor-element.elementor-element-a0f3ade{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-a42e4ac{--padding-top:20px;--padding-bottom:0px;--padding-left:20px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-4aca7cf .elementor-heading-title{font-size:12px;}.elementor-107 .elementor-element.elementor-element-9d54ba8 .elementor-heading-title{font-size:40px;}.elementor-107 .elementor-element.elementor-element-fb5c0a6{--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-fb5c0a6.e-con{--align-self:center;}.elementor-107 .elementor-element.elementor-element-9a71ff2{width:var( --container-widget-width, 254.195px );max-width:254.195px;--container-widget-width:254.195px;--container-widget-flex-grow:0;text-align:justify;}.elementor-107 .elementor-element.elementor-element-9a71ff2 .elementor-heading-title{font-size:12px;line-height:2em;}.elementor-107 .elementor-element.elementor-element-195256c{text-align:center;}.elementor-107 .elementor-element.elementor-element-195256c .elementor-heading-title{font-size:40px;}.elementor-107 .elementor-element.elementor-element-e821d35{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-cf9f222{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-040c5f2{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-217f188{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-107 .elementor-element.elementor-element-18c5e79{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-107 .elementor-element.elementor-element-18c5e79 .elementor-heading-title{font-size:40px;}.elementor-107 .elementor-element.elementor-element-3aee709{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 20px 0px 20px;}.elementor-107 .elementor-element.elementor-element-3e15c35{--padding-top:0px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for html, class: .elementor-element-96f3002 */:root {
    --mck-blue-deep: #002b5c;
    --mck-white: #ffffff;
    --ease-premium: cubic-bezier(0.85, 0, 0.15, 1);
}

/* Le conteneur circulaire principal */
.mck-s-circle-cta {
    width: 120px;
    height: 120px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden; /* Important pour cacher le fond quand il est en bas */
    text-decoration: none;
    transition: transform 0.4s var(--ease-premium);
    background: transparent;
}

/* Le texte et l'icône */
.mck-s-cta-text {
    position: relative;
    z-index: 2; /* Reste toujours au-dessus du fond qui monte */
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    font-weight: 800;
    color: var(--mck-white);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    transition: color 0.4s var(--ease-premium);
}

.cta-icon {
    width: 14px;
    height: 14px;
    transition: transform 0.4s var(--ease-premium);
}

/* Le fond blanc invisible par défaut (en bas) */
.cta-bg-hover {
    position: absolute;
    top: 100%; /* Placé juste en dessous du bouton */
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--mck-white);
    transition: top 0.5s var(--ease-premium);
    z-index: 1;
}

/* --- ÉTATS HOVER --- */

/* 1. Le bouton monte légèrement (Translate) */
.mck-s-circle-cta:hover {
    transform: translate3d(10px,3px,8px);
    border-color: var(--mck-white);
}

/* 2. Le fond blanc monte pour remplir le cercle */
.mck-s-circle-cta:hover .cta-bg-hover {
    top: 0;
}

/* 3. Le texte devient bleu pour être lisible sur le blanc */
.mck-s-circle-cta:hover .mck-s-cta-text {
    color: var(--mck-blue-deep);
}

/* 4. L'icône de la flèche se décale légèrement en haut à droite */
.mck-s-circle-cta:hover .cta-icon {
    transform: translate(2px, -2px);
}/* End custom CSS */
/* Start custom CSS for image, class: .elementor-element-c30ea54 *//* Appliquer à l'image elle-même (Sélecteur Elementor) */
.elementor-107 .elementor-element.elementor-element-c30ea54 img {
    /* Rotation initiale conforme à la maquette */
    transform: rotateX(5deg) rotateY(-10deg) rotateZ(20deg);
    
    /* Style visuel */
    border-radius: 4px !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2) !important;
    
    /* Préparation pour l'animation JS */
    transition: transform 0.2s ease-out !important;
    transform-style: preserve-3d;
    will-change: transform;
}

/* Conteneur pour la perspective (à mettre sur le widget ou la colonne) */
.elementor-107 .elementor-element.elementor-element-c30ea54 {
    perspective: 1000px;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-72135e4 *//* Ciblage du widget forme blanche */
.elementor-107 .elementor-element.elementor-element-72135e4 {
    --base-rotate: rotateX(-5deg) rotateY(10deg) rotateZ(140deg);

    width: 160px !important; 
    height: 80px !important;
    background-color: #ffffff;
    
    /* Positionnement de base et Ombre douce */
    border-radius: 2px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    
    /* Application de la rotation initiale */
    transform: var(--base-rotate);
    
    /* Animation fluide */
    transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1) !important;
    transform-style: preserve-3d;
    cursor: pointer;
    z-index: 5;
}

/* Animation au survol (Hover) */
.elementor-107 .elementor-element.elementor-element-72135e4:hover {
    /* La forme se soulève, s'incline légèrement plus et l'ombre s'accentue */
    transform: rotateX(-10deg) rotateY(15deg) rotateZ(20deg) translateY(-15px) translateZ(30px);
    box-shadow: 0 30px 60px rgba(0,0,0,0.25);
    background-color: #fcfcfc;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ee9f3bf *//* Conteneur principal */
.mck-services-list {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    font-family: 'Montserrat', sans-serif;
}

/* Structure de la ligne */
.mck-service-item {
    display: grid;
    /* Colonnes : Numéro (80px), Titre (250px), Description (Libre), Flèche (60px) */
    grid-template-columns: 80px 250px 1fr 60px;
    align-items: start;
    padding: 50px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.4s cubic-bezier(0.85, 0, 0.15, 1);
    cursor: pointer;
    color: rgba(255, 255, 255, 0.4); /* État grisé par défaut */
}

/* Dernier trait de séparation */
.mck-service-item:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Numérotation */
.mck-num {
    font-size: 18px;
    font-weight: 800;
}

/* Titre du service */
.mck-title h3 {
    font-size: 24px;
    font-weight: 700;
    text-transform: none;
    line-height: 1.2;
    padding-right: 20px;
}

/* Paragraphe de description */
.mck-desc p {
    font-size: 14px;
    line-height: 1.7;
    font-weight: 400;
    max-width: 500px;
}

/* Icône de flèche */
.mck-arrow {
    display: flex;
    justify-content: flex-end;
    opacity: 0.3;
    transition: all 0.4s ease;
}

.mck-arrow svg {
    width: 35px;
    height: 35px;
    color: #ffffff;
}

/* --- ÉTAT AU SURVOL (HOVER) --- */

.mck-service-item:hover {
    color: #ffffff; /* Tout le texte passe au blanc */
    background: rgba(255, 255, 255, 0.02); /* Très léger fond pour détacher la ligne */
}

/* La flèche s'illumine et bouge en haut à droite */
.mck-service-item:hover .mck-arrow {
    opacity: 1;
    transform: translate(5px, -5px);
}

/* Optionnel : Si vous voulez que le premier soit blanc par défaut */
.mck-service-item:first-child {
    color: #ffffff;
}
.mck-service-item:first-child .mck-arrow {
    opacity: 1;
}

/* --- RESPONSIVE --- */
@media (max-width: 900px) {
    .mck-service-item {
        grid-template-columns: 50px 1fr 50px; /* On enlève la colonne titre fixe */
        gap: 20px;
    }
    .mck-title { grid-column: 2 / 3; }
    .mck-desc { grid-column: 2 / 3; }
    .mck-arrow { grid-column: 3 / 4; grid-row: 1 / 3; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-540f740 */.mck-stats-section {
    padding: 80px 20px;
    background-color: #fff;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
}

.mck-stats-container {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

.mck-stat-circle {
    width: 280px;
    height: 280px;
 /* Bordure très fine comme la maquette */
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: -40px; /* Effet d'entrelacement des cercles */
    background-color: #fff;
    transition: transform 0.4s ease;
}

.mck-stat-circle:first-child {
    margin-left: 0;
}

.mck-stat-circle:hover {
    transform: translateY(-10px);

    z-index: 10;
}

.mck-stat-content {
    text-align: center;
    color: #1a1a1a;
}

.mck-stat-content h2 {
    display: inline-block;
    font-size: 58px;
    font-weight: 700;
    margin: 0;
    line-height: 1;
}

.mck-plus {
    font-size: 40px;
    font-weight: 700;
    vertical-align: top;
    margin-left: 2px;
}

.mck-stat-content p {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 10px;
    color: #555;
    line-height: 1.4;
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    .mck-stats-container {
        flex-wrap: wrap;
        gap: 20px;
    }
    .mck-stat-circle {
        margin-left: 0; /* On retire l'entrelacement sur mobile pour la lisibilité */
        width: 220px;
        height: 220px;
    }
    .mck-stat-content h2 { font-size: 42px; }
}

@media (max-width: 480px) {
    .mck-stat-circle {
        width: 180px;
        height: 180px;
    }
    .mck-stat-content h2 { font-size: 32px; }
    .mck-stat-content p { font-size: 12px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f78c2f7 *//* Variables et Reset */

:root {

    --mck-blue-dark: #001e3c !important;

    --mck-blue-bright: #004fb0 !important;

    --font-primary: 'Montserrat', sans-serif !important;

}



.mck-wwh-section {

    position: relative !important;

   

    font-family: var(--font-primary) !important;

}



/* LE TEXTE GÉANT (FIXE EN FOND) */

.mck-wwh-sticky {

    position: sticky !important;

    top: 0 !important;

    height: 100vh !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    overflow: hidden !important;

    z-index: 1 !important; /* Reste derrière les images */

}



.mck-wwh-giant {

    font-size: 80px !important;

    font-weight: 500 !important;

    color: #ffffff !important;

    text-transform: uppercase !important;

    letter-spacing: -2px !important;

    text-align: center !important;

    width: 100% !important;

    margin: 0 !important;

    line-height: 1 !important;

}

.mck-srv-desc{

    

        align-items: center !important;}

/* Style pour le texte de description */





/* LE CONTENU DÉFILANT */

.mck-wwh-scroll-content {

    position: relative !important;

    z-index: 2 !important; /* Passe au-dessus du texte géant */

    padding-top: 80vh !important; 

}



.mck-wwh-gallery {

    max-width: 1200px !important;

    margin: 0 auto !important;

    display: flex !important;

    flex-direction: column !important;

    padding: 0 40px !important;

}



/* CARTES IMAGES */

.mck-wwh-card {

    position: relative !important;

    width: clamp(280px, 40%, 400px) !important;

    height: clamp(350px, 50vw, 500px) !important;

    margin-bottom: 80px !important;

    box-shadow: 0 30px 60px rgba(0,0,0,0.3) !important;

    will-change: transform !important; /* Optimisation pour le JS */

}



.mck-wwh-card img {

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    display: block !important;

}

.mck-srv-desc .text {

    font-family: 'Montserrat', sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.8;

    color: rgba(255, 255, 255, 0.7);

    letter-spacing: 0.2px;

    transition: color 0.4s ease;



    /* --- CENTRAGE CRITIQUE --- */

    text-align: center;          /* Centre le texte à l'intérieur du paragraphe */

    max-width: 600px;            /* Limite la largeur */

    width: 100% !important;      /* Prend toute la largeur disponible jusqu'au max-width */

    margin-left: auto !important; /* Centre le bloc horizontalement */

    margin-right: auto !important;/* Centre le bloc horizontalement */

    display: block;              /* S'assure que c'est un bloc pour que les marges auto fonctionnent */

}



/* Changement de couleur au survol du parent */

.mck-service-row:hover .mck-srv-desc .text {

    color: #ffffff;

}



/* Si vous voulez aussi centrer verticalement dans le parent (mck-srv-desc) */

.mck-srv-desc {

    display: flex;

    justify-content: center; /* Centre horizontalement le contenu du div */

    align-items: center;     /* Centre verticalement si le div a une hauteur définie */

    width: 100%;

}

/* Dispersion en quinconce */

.align-left { align-self: flex-start !important; margin-left: 5% !important; }

.align-right { align-self: flex-end !important; margin-right: 5% !important; margin-top: -20vh !important; }

.align-center { align-self: center !important; margin-top: -15vh !important; }



/* LABELS BLANCS (Industries) */

.mck-wwh-label {
    position: absolute;
    bottom: -15px;
    right: -15px;
    background: #ffffff;
    color: #000;
    padding: 15px 25px;
    font-weight: 800;
    font-size: 14px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    z-index: 10;
    opacity: 0; /* Caché par défaut */
    transform: translateY(10px);
    transition: all 0.4s ease;
    pointer-events: none;
}
.mck-wwh-card:hover .mck-wwh-label {
    opacity: 1; /* Apparaît au survol */
    transform: translateY(0);
}


.mck-wwh-label span { font-weight: 500; font-size: 11px; color: #666; text-transform: uppercase; }




/* BOUTON CONTACT (Fin de section) */

.mck-wwh-footer {

    height: 60vh !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    padding-bottom: 10vh !important;

}



.mck-circle-btn-large {

    width: 140px !important;

    height: 140px !important;

    border: 1px solid rgba(255, 255, 255, 0.4) !important;

    border-radius: 50% !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    text-decoration: none !important;

    position: relative !important;

    overflow: hidden !important;

    transition: 0.4s !important;

}



.btn-txt {

    position: relative !important;

    z-index: 2 !important;

    color: #ffffff !important;

    font-weight: 700 !important;

    font-size: 13px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 8px !important;

    transition: 0.4s !important;

}



.btn-txt svg { width: 16px !important; height: 16px !important; transition: 0.4s !important; }



.btn-hover-fill {

    position: absolute !important;

    top: 100% !important; 

    left: 0 !important; 

    width: 100% !important; 

    height: 100% !important;

    background: #ffffff !important;

    transition: top 0.4s cubic-bezier(0.85, 0, 0.15, 1) !important;

    z-index: 1 !important;

}



.mck-circle-btn-large:hover { border-color: #ffffff !important; transform: translateY(-5px) !important; }

.mck-circle-btn-large:hover .btn-hover-fill { top: 0 !important; }

.mck-circle-btn-large:hover .btn-txt { color: var(--mck-blue-dark) !important; }

.mck-circle-btn-large:hover svg { transform: translate(3px, -3px) !important; }



/* RESPONSIVE MOBILE */

@media (max-width: 768px) {

    .mck-wwh-gallery { padding: 0 20px !important; }

    .mck-wwh-card { width: 100% !important; height: 400px !important; margin-bottom: 60px !important; margin-top: 0 !important; }

    .align-left, .align-right, .align-center { align-self: center !important; margin-left: 0 !important; margin-right: 0 !important; }

     .mck-wwh-label { opacity: 1; transform: none; right: 0; bottom: -10px; }
 }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4002a05 *//* Variables et Reset */

:root {

    --mck-blue-dark: #001e3c !important;

    --mck-blue-bright: #004fb0 !important;

    --font-primary: 'Montserrat', sans-serif !important;

}



.mck-wwh-section {

    position: relative !important;

   

    font-family: var(--font-primary) !important;

}



/* LE TEXTE GÉANT (FIXE EN FOND) */

.mck-wwh-sticky {

    position: sticky !important;

    top: 0 !important;

    height: 100vh !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    overflow: hidden !important;

    z-index: 1 !important; /* Reste derrière les images */

}



.mck-wwh-giant {

    font-size: 80px !important;

    font-weight: 500 !important;

    color: #ffffff !important;

    text-transform: uppercase !important;

    letter-spacing: -2px !important;

    text-align: center !important;

    width: 100% !important;

    margin: 0 !important;

    line-height: 1 !important;

}

.mck-srv-desc{

    

        align-items: center !important;}

/* Style pour le texte de description */





/* LE CONTENU DÉFILANT */

.mck-wwh-scroll-content {

    position: relative !important;

    z-index: 2 !important; /* Passe au-dessus du texte géant */

    padding-top: 80vh !important; 

}



.mck-wwh-gallery {

    max-width: 1200px !important;

    margin: 0 auto !important;

    display: flex !important;

    flex-direction: column !important;

    padding: 0 40px !important;

}



/* CARTES IMAGES */

.mck-wwh-card {

    position: relative !important;

    width: clamp(280px, 40%, 400px) !important;

    height: clamp(350px, 50vw, 500px) !important;

    margin-bottom: 80px !important;

    box-shadow: 0 30px 60px rgba(0,0,0,0.3) !important;

    will-change: transform !important; /* Optimisation pour le JS */

}



.mck-wwh-card img {

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    display: block !important;

}

.mck-srv-desc .text {

    font-family: 'Montserrat', sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.8;

    color: rgba(255, 255, 255, 0.7);

    letter-spacing: 0.2px;

    transition: color 0.4s ease;



    /* --- CENTRAGE CRITIQUE --- */

    text-align: center;          /* Centre le texte à l'intérieur du paragraphe */

    max-width: 600px;            /* Limite la largeur */

    width: 100% !important;      /* Prend toute la largeur disponible jusqu'au max-width */

    margin-left: auto !important; /* Centre le bloc horizontalement */

    margin-right: auto !important;/* Centre le bloc horizontalement */

    display: block;              /* S'assure que c'est un bloc pour que les marges auto fonctionnent */

}



/* Changement de couleur au survol du parent */

.mck-service-row:hover .mck-srv-desc .text {

    color: #ffffff;

}



/* Si vous voulez aussi centrer verticalement dans le parent (mck-srv-desc) */

.mck-srv-desc {

    display: flex;

    justify-content: center; /* Centre horizontalement le contenu du div */

    align-items: center;     /* Centre verticalement si le div a une hauteur définie */

    width: 100%;

}

/* Dispersion en quinconce */

.align-left { align-self: flex-start !important; margin-left: 5% !important; }

.align-right { align-self: flex-end !important; margin-right: 5% !important; margin-top: -20vh !important; }

.align-center { align-self: center !important; margin-top: -15vh !important; }



/* LABELS BLANCS (Industries) */

.mck-wwh-label {
    position: absolute;
    bottom: -15px;
    right: -15px;
    background: #ffffff;
    color: #000;
    padding: 15px 25px;
    font-weight: 800;
    font-size: 14px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    z-index: 10;
    opacity: 0; /* Caché par défaut */
    transform: translateY(10px);
    transition: all 0.4s ease;
    pointer-events: none;
}
.mck-wwh-card:hover .mck-wwh-label {
    opacity: 1; /* Apparaît au survol */
    transform: translateY(0);
}


.mck-wwh-label span { font-weight: 500; font-size: 11px; color: #666; text-transform: uppercase; }




/* BOUTON CONTACT (Fin de section) */

.mck-wwh-footer {

    height: 60vh !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    padding-bottom: 10vh !important;

}



.mck-circle-btn-large {

    width: 140px !important;

    height: 140px !important;

    border: 1px solid rgba(255, 255, 255, 0.4) !important;

    border-radius: 50% !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    text-decoration: none !important;

    position: relative !important;

    overflow: hidden !important;

    transition: 0.4s !important;

}



.btn-txt {

    position: relative !important;

    z-index: 2 !important;

    color: #ffffff !important;

    font-weight: 700 !important;

    font-size: 13px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 8px !important;

    transition: 0.4s !important;

}



.btn-txt svg { width: 16px !important; height: 16px !important; transition: 0.4s !important; }



.btn-hover-fill {

    position: absolute !important;

    top: 100% !important; 

    left: 0 !important; 

    width: 100% !important; 

    height: 100% !important;

    background: #ffffff !important;

    transition: top 0.4s cubic-bezier(0.85, 0, 0.15, 1) !important;

    z-index: 1 !important;

}



.mck-circle-btn-large:hover { border-color: #ffffff !important; transform: translateY(-5px) !important; }

.mck-circle-btn-large:hover .btn-hover-fill { top: 0 !important; }

.mck-circle-btn-large:hover .btn-txt { color: var(--mck-blue-dark) !important; }

.mck-circle-btn-large:hover svg { transform: translate(3px, -3px) !important; }



/* RESPONSIVE MOBILE */

@media (max-width: 768px) {

    .mck-wwh-gallery { padding: 0 20px !important; }

    .mck-wwh-card { width: 100% !important; height: 400px !important; margin-bottom: 60px !important; margin-top: 0 !important; }

    .align-left, .align-right, .align-center { align-self: center !important; margin-left: 0 !important; margin-right: 0 !important; }

     .mck-wwh-label { opacity: 1; transform: none; right: 0; bottom: -10px; }
 }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-361e1de *//* --- RESET PARENTS ELEMENTOR --- */
/* Force tous les conteneurs parents à autoriser le sticky */
.elementor-section-wrap, .elementor-section, .elementor-container, .elementor-column-wrap, .elementor-widget-wrap {
    overflow: visible !important;
}

/* --- DESIGN SECTION --- */
.mck-force-scroll-area {
    height: 300vh !important; /* Hauteur du scroll vertical */
    position: relative !important;
    background: #FAF7F0 !important;
}

.mck-sticky-frame {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    height: 100vh !important;
    width: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
}

.mck-horizontal-rail {
    display: flex !important;
    width: 200vw !important; /* 2 écrans de 100vw chacun */
    height: 100vh !important;
    will-change: transform !important;
    transition: transform 0.1s ease-out !important;
}

.mck-slide-unit {
    width: 100vw !important;
    height: 100vh !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 10% !important;
    box-sizing: border-box !important;
}

/* --- STYLES VISUELS --- */
.s-cream { background-color: #FAF7F0 !important; }
.s-gray { background-color: #F1EDEB !important; }

.mck-center-box { text-align: center !important; width: 100% !important; }
.mck-main-title { font-size: 8vw !important; font-weight: 900 !important; color: #0A1D37 !important; margin: 0 !important; }
.mck-main-title .blue { color: #1A44D4 !important; }
.mck-hr { width: 100% !important; height: 2px !important; background: #000 !important; margin: 20px 0 !important; }
.mck-sub { font-size: 1.5vw !important; font-weight: 500 !important; color: #444 !important; }

/* Slide 2 Layout */
.mck-flex-layout { display: flex !important; width: 100% !important; justify-content: space-between !important; align-items: center !important; }
.mck-left-text { width: 45% !important; }
.mck-h2-title { font-size: 3.5vw !important; font-weight: 800 !important; line-height: 1.1 !important; margin: 20px 0 !important; }
.mck-label { font-size: 12px !important; font-weight: 900 !important; }
.mck-p-text { font-size: 15px !important; line-height: 1.6 !important; color: #333 !important; }

.mck-pills-row { display: flex !important; gap: 10px !important; margin-top: 30px !important; }
.mck-pills-row span { padding: 8px 15px !important; border: 1px solid #000 !important; border-radius: 50px !important; font-size: 10px !important; font-weight: 800 !important; }

.mck-right-stats { width: 45% !important; }
.mck-stat-row { display: flex !important; align-items: center !important; gap: 20px !important; margin-bottom: 30px !important; }
.mck-circle-num { width: 100px !important; height: 100px !important; border: 1px solid #000 !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 28px !important; font-weight: 800 !important; }

@media (max-width: 768px) {
    .mck-force-scroll-area { height: auto !important; }
    .mck-sticky-frame { position: relative !important; height: auto !important; }
    .mck-horizontal-rail { flex-direction: column !important; width: 100% !important; transform: none !important; }
    .mck-slide-unit { width: 100% !important; height: auto !important; padding: 50px 20px !important; }
    .mck-flex-layout { flex-direction: column !important; }
    .mck-left-text, .mck-right-stats { width: 100% !important; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5fe96ce *//* --- Reset & Font --- */
.mck-blog-card {
    font-family: 'Montserrat', sans-serif;
    position: relative;
    max-width: 600px; /* Ajustable selon votre grille */
    background: #ffffff;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

/* --- Le Cadre Image --- */
.mck-image-wrapper {
    width: 85%; /* L'image est moins large que le bloc de texte pour l'effet d'asymétrie */
    height: 450px;
    overflow: hidden;
    background: #001e3c; /* Couleur de secours */
    z-index: 1;
}

.mck-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* --- Le Bloc de Texte Blanc (Chevauchement) --- */
.mck-content-box {
    background: #ffffff;
    padding: 45px 40px;
    width: 75%;
    margin-top: -160px; /* L'effet de "morsure" sur l'image */
    margin-left: auto; /* Aligné à droite */
    box-shadow: 0 30px 60px rgba(0,0,0,0.08); /* Ombre très douce et large */
    z-index: 2;
    transition: transform 0.4s ease;
}

/* --- Typographie --- */
.mck-meta {
    font-size: 11px;
    font-weight: 600;
    color: #999;
    text-transform: none;
    letter-spacing: 0.2px;
    display: block;
    margin-bottom: 18px;
}

.mck-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    color: #1a1a1a;
    margin: 0 0 30px 0;
}

/* --- Footer & Lien --- */
.mck-footer {
    border-top: 1px solid #eeeeee;
    padding-top: 20px;
}

.mck-link {
    text-decoration: none;
    color: #333;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s;
}

.mck-arrow {
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
}

/* --- Animations au Survol --- */
.mck-blog-card:hover .mck-image-wrapper img {
    transform: scale(1.08); /* Zoom léger de l'image */
}

.mck-blog-card:hover .mck-content-box {
    transform: translateY(-10px); /* Le texte s'élève légèrement */
}

.mck-link:hover {
    color: #004fb0; /* Couleur d'accentuation McKallen */
}

.mck-link:hover .mck-arrow {
    transform: translate(3px, -3px); /* Flèche qui s'anime vers le haut/droite */
}

/* --- Responsive Mobile --- */
@media (max-width: 768px) {
    .mck-image-wrapper { width: 100%; height: 300px; }
    .mck-content-box { 
        width: 90%; 
        margin-top: -50px; 
        padding: 30px 20px;
        margin-right: auto;
    }
    .mck-title { font-size: 18px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5493356 *//* --- Reset & Font --- */
.mck-blog-card {
    font-family: 'Montserrat', sans-serif;
    position: relative;
    max-width: 600px; /* Ajustable selon votre grille */
    background: #ffffff;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

/* --- Le Cadre Image --- */
.mck-image-wrapper {
    width: 85%; /* L'image est moins large que le bloc de texte pour l'effet d'asymétrie */
    height: 450px;
    overflow: hidden;
    background: #001e3c; /* Couleur de secours */
    z-index: 1;
}

.mck-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* --- Le Bloc de Texte Blanc (Chevauchement) --- */
.mck-content-box {
    background: #ffffff;
    padding: 45px 40px;
    width: 75%;
    margin-top: -160px; /* L'effet de "morsure" sur l'image */
    margin-left: auto; /* Aligné à droite */
    box-shadow: 0 30px 60px rgba(0,0,0,0.08); /* Ombre très douce et large */
    z-index: 2;
    transition: transform 0.4s ease;
}

/* --- Typographie --- */
.mck-meta {
    font-size: 11px;
    font-weight: 600;
    color: #999;
    text-transform: none;
    letter-spacing: 0.2px;
    display: block;
    margin-bottom: 18px;
}

.mck-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    color: #1a1a1a;
    margin: 0 0 30px 0;
}

/* --- Footer & Lien --- */
.mck-footer {
    border-top: 1px solid #eeeeee;
    padding-top: 20px;
}

.mck-link {
    text-decoration: none;
    color: #333;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s;
}

.mck-arrow {
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
}

/* --- Animations au Survol --- */
.mck-blog-card:hover .mck-image-wrapper img {
    transform: scale(1.08); /* Zoom léger de l'image */
}

.mck-blog-card:hover .mck-content-box {
    transform: translateY(-10px); /* Le texte s'élève légèrement */
}

.mck-link:hover {
    color: #004fb0; /* Couleur d'accentuation McKallen */
}

.mck-link:hover .mck-arrow {
    transform: translate(3px, -3px); /* Flèche qui s'anime vers le haut/droite */
}

/* --- Responsive Mobile --- */
@media (max-width: 768px) {
    .mck-image-wrapper { width: 100%; height: 300px; }
    .mck-content-box { 
        width: 90%; 
        margin-top: -50px; 
        padding: 30px 20px;
        margin-right: auto;
    }
    .mck-title { font-size: 18px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a17a76f *//* --- Reset & Font --- */
.mck-blog-card {
    font-family: 'Montserrat', sans-serif;
    position: relative;
    max-width: 600px; /* Ajustable selon votre grille */
    background: #ffffff;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

/* --- Le Cadre Image --- */
.mck-image-wrapper {
    width: 85%; /* L'image est moins large que le bloc de texte pour l'effet d'asymétrie */
    height: 450px;
    overflow: hidden;
    background: #001e3c; /* Couleur de secours */
    z-index: 1;
}

.mck-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* --- Le Bloc de Texte Blanc (Chevauchement) --- */
.mck-content-box {
    background: #ffffff;
    padding: 45px 40px;
    width: 75%;
    margin-top: -160px; /* L'effet de "morsure" sur l'image */
    margin-left: auto; /* Aligné à droite */
    box-shadow: 0 30px 60px rgba(0,0,0,0.08); /* Ombre très douce et large */
    z-index: 2;
    transition: transform 0.4s ease;
}

/* --- Typographie --- */
.mck-meta {
    font-size: 11px;
    font-weight: 600;
    color: #999;
    text-transform: none;
    letter-spacing: 0.2px;
    display: block;
    margin-bottom: 18px;
}

.mck-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    color: #1a1a1a;
    margin: 0 0 30px 0;
}

/* --- Footer & Lien --- */
.mck-footer {
    border-top: 1px solid #eeeeee;
    padding-top: 20px;
}

.mck-link {
    text-decoration: none;
    color: #333;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s;
}

.mck-arrow {
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
}

/* --- Animations au Survol --- */
.mck-blog-card:hover .mck-image-wrapper img {
    transform: scale(1.08); /* Zoom léger de l'image */
}

.mck-blog-card:hover .mck-content-box {
    transform: translateY(-10px); /* Le texte s'élève légèrement */
}

.mck-link:hover {
    color: #004fb0; /* Couleur d'accentuation McKallen */
}

.mck-link:hover .mck-arrow {
    transform: translate(3px, -3px); /* Flèche qui s'anime vers le haut/droite */
}

/* --- Responsive Mobile --- */
@media (max-width: 768px) {
    .mck-image-wrapper { width: 100%; height: 300px; }
    .mck-content-box { 
        width: 90%; 
        margin-top: -50px; 
        padding: 30px 20px;
        margin-right: auto;
    }
    .mck-title { font-size: 18px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8917e3c *//* --- Reset & Font --- */
.mck-blog-card {
    font-family: 'Montserrat', sans-serif;
    position: relative;
    max-width: 600px; /* Ajustable selon votre grille */
    background: #ffffff;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

/* --- Le Cadre Image --- */
.mck-image-wrapper {
    width: 85%; /* L'image est moins large que le bloc de texte pour l'effet d'asymétrie */
    height: 450px;
    overflow: hidden;
    background: #001e3c; /* Couleur de secours */
    z-index: 1;
}

.mck-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* --- Le Bloc de Texte Blanc (Chevauchement) --- */
.mck-content-box {
    background: #ffffff;
    padding: 45px 40px;
    width: 75%;
    margin-top: -160px; /* L'effet de "morsure" sur l'image */
    margin-left: auto; /* Aligné à droite */
    box-shadow: 0 30px 60px rgba(0,0,0,0.08); /* Ombre très douce et large */
    z-index: 2;
    transition: transform 0.4s ease;
}

/* --- Typographie --- */
.mck-meta {
    font-size: 11px;
    font-weight: 600;
    color: #999;
    text-transform: none;
    letter-spacing: 0.2px;
    display: block;
    margin-bottom: 18px;
}

.mck-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    color: #1a1a1a;
    margin: 0 0 30px 0;
}

/* --- Footer & Lien --- */
.mck-footer {
    border-top: 1px solid #eeeeee;
    padding-top: 20px;
}

.mck-link {
    text-decoration: none;
    color: #333;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s;
}

.mck-arrow {
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
}

/* --- Animations au Survol --- */
.mck-blog-card:hover .mck-image-wrapper img {
    transform: scale(1.08); /* Zoom léger de l'image */
}

.mck-blog-card:hover .mck-content-box {
    transform: translateY(-10px); /* Le texte s'élève légèrement */
}

.mck-link:hover {
    color: #004fb0; /* Couleur d'accentuation McKallen */
}

.mck-link:hover .mck-arrow {
    transform: translate(3px, -3px); /* Flèche qui s'anime vers le haut/droite */
}

/* --- Responsive Mobile --- */
@media (max-width: 768px) {
    .mck-image-wrapper { width: 100%; height: 300px; }
    .mck-content-box { 
        width: 90%; 
        margin-top: -50px; 
        padding: 30px 20px;
        margin-right: auto;
    }
    .mck-title { font-size: 18px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-120e556 *//* --- BASE & WRAPPER --- */
.mck-faq-final {
    background-color: #ffffff !important;
    padding: 100px 0 !important;
    font-family: 'Montserrat', sans-serif !important;
    width: 100% !important;
}

.mck-faq-inner {
    max-width: 1140px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* --- HEADER FAQ --- */
.mck-faq-header {
    margin-bottom: 50px !important;
}

.mck-faq-giant {
    font-size: 110px !important; /* Taille géante maquette */
    font-weight: 800 !important;
    color: #111111 !important;
    letter-spacing: -3px !important;
    line-height: 0.9 !important;
    margin: 0 0 20px 0 !important;
}

.mck-faq-lead {
    font-size: 15px !important;
    color: #666666 !important;
    font-weight: 500 !important;
}

/* --- LISTE --- */
.mck-faq-wrapper {
    border-top: 1px solid #e5e5e5 !important;
}

.mck-faq-row {
    border-bottom: 1px solid #e5e5e5 !important;
    transition: all 0.4s ease !important;
}

.mck-faq-trigger {
    padding: 35px 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    cursor: pointer !important;
}

.mck-q-text {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #444444 !important;
    transition: color 0.3s ease !important;
    padding-right: 30px !important;
}

.mck-faq-row.active .mck-q-text, 
.mck-faq-row:hover .mck-q-text {
    color: #000000 !important;
}

/* --- ICONE + / - --- */
.mck-plus-minus {
    width: 18px !important;
    height: 18px !important;
    position: relative !important;
}

.mck-plus-minus::before, .mck-plus-minus::after {
    content: "" !important;
    position: absolute !important;
    background-color: #000 !important;
    transition: transform 0.3s ease !important;
}

/* Barre horizontale */
.mck-plus-minus::before {
    width: 100% !important;
    height: 2px !important;
    top: 50% !important;
    left: 0 !important;
    transform: translateY(-50%) !important;
}

/* Barre verticale */
.mck-plus-minus::after {
    width: 2px !important;
    height: 100% !important;
    left: 50% !important;
    top: 0 !important;
    transform: translateX(-50%) !important;
}

.mck-faq-row.active .mck-plus-minus::after {
    transform: translateX(-50%) rotate(90deg) !important;
    opacity: 0 !important; /* Devient un moins (-) */
}

/* --- CONTENU --- */
.mck-faq-content {
    padding-bottom: 35px !important;
    display: none;
}

.mck-faq-content p {
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #555555 !important;
    max-width: 90% !important;
    margin: 0 !important;
}

/* --- RESPONSIVE ADAPTATION --- */
@media (max-width: 1024px) {
    .mck-faq-giant { font-size: 80px !important; }
}

@media (max-width: 768px) {
    .mck-faq-giant { font-size: 60px !important; }
    .mck-q-text { font-size: 16px !important; }
    .mck-faq-content p { font-size: 15px !important; max-width: 100% !important; }
    .mck-faq-trigger { padding: 25px 0 !important; }
}/* End custom CSS */