.elementor-39 .elementor-element.elementor-element-17de24d{--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;--align-items:center;--overlay-opacity:0.85;--padding-top:300px;--padding-bottom:100px;--padding-left:20px;--padding-right:20px;}.elementor-39 .elementor-element.elementor-element-17de24d:not(.elementor-motion-effects-element-type-background), .elementor-39 .elementor-element.elementor-element-17de24d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.pcnodelogic.com/wp-content/uploads/2026/07/banner-on-p-node-logic.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-39 .elementor-element.elementor-element-17de24d::before, .elementor-39 .elementor-element.elementor-element-17de24d > .elementor-background-video-container::before, .elementor-39 .elementor-element.elementor-element-17de24d > .e-con-inner > .elementor-background-video-container::before, .elementor-39 .elementor-element.elementor-element-17de24d > .elementor-background-slideshow::before, .elementor-39 .elementor-element.elementor-element-17de24d > .e-con-inner > .elementor-background-slideshow::before, .elementor-39 .elementor-element.elementor-element-17de24d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-secondary );--background-overlay:'';}.elementor-39 .elementor-element.elementor-element-807abb9{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-39 .elementor-element.elementor-element-1f01c3e{text-align:center;}.elementor-39 .elementor-element.elementor-element-1f01c3e .elementor-heading-title{color:var( --e-global-color-651f54d );}:root{--page-title-display:none;}@media(min-width:768px){.elementor-39 .elementor-element.elementor-element-807abb9{--width:70%;}}@media(max-width:1024px){.elementor-39 .elementor-element.elementor-element-17de24d{--padding-top:200px;--padding-bottom:60px;--padding-left:20px;--padding-right:20px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.elementor-39 .elementor-element.elementor-element-17de24d{--padding-top:200px;--padding-bottom:60px;--padding-left:20px;--padding-right:20px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}}/* Start custom CSS for heading, class: .elementor-element-1f01c3e */.bannier h1{
    font-family: "Montserrat", sans-serif;
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
    cursor: default;

    background: linear-gradient(
        90deg,
        #ffffff,
        #06B6D4,
        #3B82F6,
        #ffffff
    );

    background-size: 300% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    opacity: 0;
    transform: translateY(60px);

    animation:
        titleReveal 1.2s ease forwards,
        gradientFlow 6s linear infinite;
}

/* Ligne lumineuse sous le titre */

.bannier h1::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-12px;
    width:0;
    height:5px;
    border-radius:30px;
    background:linear-gradient(90deg,#06B6D4,#2563EB,#06B6D4);
    animation:lineReveal 1.5s ease forwards .8s;
}

/* Apparition */

@keyframes titleReveal{

    0%{
        opacity:0;
        transform:translateY(60px) scale(.95);
        filter:blur(8px);
    }

    60%{
        opacity:1;
        transform:translateY(-8px) scale(1.02);
        filter:blur(0);
    }

    100%{
        opacity:1;
        transform:translateY(0) scale(1);
        filter:blur(0);
    }

}

/* Dégradé animé */

@keyframes gradientFlow{

    0%{
        background-position:0% center;
    }

    100%{
        background-position:300% center;
    }

}

/* Ligne qui apparaît */

@keyframes lineReveal{

    from{
        width:0;
    }

    to{
        width:100%;
    }

}

/* Effet au survol */

.bannier h1:hover{
    transform:translateY(-3px);
    transition:.4s;
}/* End custom CSS */