/*
Theme Name: Perroquet
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elsa Gensul - L.Web
Author URI: https://l-web.fr
Description: 
Version: 1.0
Updated: 2025-01-15

*/

html {
    overflow-x : hidden;
    overflow-y : auto;
}

.jet-mega-menu--layout-dropdown, .jet-mega-menu--layout-dropdown:hover {
    all: unset;
}
  
.jet-mega-menu--layout-dropdown:focus {
    outline: revert;
}

p:last-child {
    margin-bottom:0 !important;
}

.button-cta-gradient .elementor-button, #light-contact .elementor-button, #gradient-btn-form, .elementor-post-navigation__next a{
    position:relative;
	width: auto !important;    text-align:center;
    transition:all 0.5s;
    background: url("/wp-content/uploads/2024/10/Frame_182.webp") no-repeat 50% / cover !important;
    box-shadow: 0px 0px 0.9px 0.5px rgba(240, 237, 246, 0.41) inset, 0px 0px 2px 2px rgba(240, 237, 246, 0.21) inset;
    overflow:hidden;
}

#light-contact .elementor-button{
    width:45px !important;
}

.button-cta-gradient .elementor-button:hover, #light-contact .elementor-button:hover, #gradient-btn-form:hover, .elementor-post-navigation__next a:hover {
    box-shadow: 0px 0px 0.9px 0.5px rgba(240, 237, 246, 0.41) inset, 0px 0px 2px 2px rgba(240, 237, 246, 0.21) inset, 0px 0px 17px 2px rgba(240, 237, 246, 0.92) inset;
}

.button-cta-gradient .elementor-button .elementor-button-content-wrapper,.button-cta-gradient .elementor-button .elementor-button-text,.button-cta-gradient .elementor-button .elementor-button-icon, #gradient-btn-form .elementor-button-icon, #gradient-btn-form .elementor-button-content-wrapper {
    transition:all 0.5s;
}

.button-cta-gradient .elementor-button:hover .elementor-button-content-wrapper, #gradient-btn-form:hover .elementor-button-content-wrapper {
    gap:1rem;
}

.button-cta-gradient .elementor-button:hover .elementor-button-text, #gradient-btn-form:hover .elementor-button-text {
    margin-left:-10px;
}
.button-cta-gradient .elementor-button:hover .elementor-button-icon, #gradient-btn-form:hover .elementor-button-icon {
    margin-right:-10px;
}

#gradient-btn-form .elementor-button-icon svg * {
    fill:none;
}

.button-cta-gradient .elementor-button:after, #light-contact .elementor-button:after, #gradient-btn-form:after, .elementor-post-navigation__next a:after {
    z-index:2;
    position:absolute;
    content:"";
    display:block;
    width:200%;
    height:100%;
    background: linear-gradient(77deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 1%, rgba(255,255,255,0.1) 10%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 100%);
    background-size: 50%;
    left:-200%;
    top:0;
}

.button-cta-gradient .elementor-button:hover:after, #light-contact .elementor-button:hover:after, #gradient-btn-form:hover:after, .elementor-post-navigation__next a:hover:after {
    left:0;
    animation: flow 1s ease-in-out infinite;
}

.elementor-button > .elementor-button-content-wrapper, .elementor-post-navigation__next a span {
    position:relative;
    z-index:9;
}

@keyframes flow {
    0% {
        background-position: 0%;
    }
    100% {
        background-position: 100%;
    }
}

.elementor-post-navigation__prev a {
    padding:10px 16px;
    border-radius: 6px;
    color:#8827FF;
    transition:all 0.3s;
    border: 1px solid #8827FF;
    max-width: 110px !important;
    text-align: center;
    justify-content: center !important;
}

.elementor-post-navigation__next a {
    color:white !important;
    padding:10px 16px;
    border-radius: 6px;
    max-width: 110px !important;
    text-align: center;
    justify-content: center !important;
}

.elementor-post-navigation__next .post-navigation__arrow-wrapper, .elementor-post-navigation__prev .post-navigation__arrow-wrapper {
    width:20% !important;
}

.elementor-post-navigation__next a span {
    color:white !important;
    fill:white !important;
}


.elementor-post-navigation__prev:hover a, .elementor-post-navigation__prev:hover a span {
    color:white !important;
    fill:white !important;
}

.elementor-widget-button:not(.button-cta-gradient) .elementor-button, .elementor-post-navigation__prev a {
    position:relative;
    overflow:hidden;
}

.elementor-widget-button:not(.button-cta-gradient) .elementor-button:after, .elementor-post-navigation__prev a:after {
    content:"";
    width:140%;
    height:100%;
    display:block;
    position:absolute;
    top:0;
    left:-140%;
    transition:all 0.3s;
    z-index:2;
}

.elementor-widget-button.btn-purple .elementor-button:after, .elementor-post-navigation__prev a:after {
    background:#8827ff;
    background:linear-gradient(77deg, rgba(136,39,255,1) 0%, rgba(136,39,255,1) 75%, rgba(136,39,255,0) 100%);
}

.btn-purple .jet-listing-dynamic-terms__link {
    position:relative;
    overflow:hidden;
}

.btn-purple .jet-listing-dynamic-terms__link:after {
    content:"";
    width:140%;
    height:100%;
    display:block;
    position:absolute;
    top:0;
    left:-140%;
    transition:all 0.3s;
    z-index:1;
}

.btn-purple .jet-listing-dynamic-terms__link:hover:after, .elementor-post-navigation__prev a:hover:after {
    background:#8827ff;
    background:linear-gradient(77deg, rgba(136,39,255,1) 0%, rgba(136,39,255,1) 75%, rgba(136,39,255,0) 100%);
    left:0;
}

.btn-purple .jet-listing-dynamic-terms__link span, .elementor-post-navigation__prev span {
    position:relative;
    z-index:4;
}

/*.btn-purple:hover a, .btn-purple:hover span {
    color:white;
}*/


.btn-white .elementor-button:hover:after {
    background:#FFF;
    background:linear-gradient(77deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
}

.btn-white .elementor-button:hover .elementor-button-text {
	color:#8827FF!important;
}

.btn-white .jet-listing-dynamic-terms__link {
    position:relative;
    overflow:hidden;
}

.btn-white .jet-listing-dynamic-terms__link:after {
    content:"";
    width:140%;
    height:100%;
    display:block;
    position:absolute;
    top:0;
    left:-140%;
    transition:all 0.3s;
    z-index:1;
}

.btn-white .jet-listing-dynamic-terms__link:hover:after {
    background:#FFF;
    background:linear-gradient(77deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
    left:0;
}

.btn-white .jet-listing-dynamic-terms__link span {
    position:relative;
    z-index:4;
}

.elementor-widget-button:not(.button-cta-gradient):hover .elementor-button:after {
    left:0;
}

.background-gradient-box {
    position:relative;
    overflow:hidden !important;
	background:url("/wp-content/uploads/2025/03/fond_section.png") no-repeat;
	background-size:cover;
	background-position:center bottom;
}


.gradient-title, .gradient-title h1, .gradient-title h2, .gradient-title h3, .gradient-title h4, .gradient-title span { 
    background: radial-gradient(401.7% 55.15% at 44.85% 50%, #4F00AF 0%, rgba(79, 0, 175, 0.97) 45%, rgba(79, 0, 175, 0.40) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.gradient-title-white {
    background: radial-gradient(100% 50% at 50% 50%, #FFF 56.4%, rgba(255, 255, 255, 0.44) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.little-gradient-title-white {
    background: radial-gradient(100% 50% at 50% 50%, #FFF 56.4%, rgba(255, 255, 255, 0.44) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}


.parent-box {
    height: 250px; /* Taille de base */
    border-radius: 12px; /* Coins arrondis pour le style de base */
    background-color: #f4f4f9; /* Couleur de fond de base */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Ombre légère */
    transition: all 0.3s ease-in-out; /* Transition fluide pour l'animation */
    position: relative; /* Pour positionner les éléments */
    overflow: hidden; /* Cacher le contenu qui dépasse */
}

/* Contenu caché par défaut */
.hover-content {
    opacity: 0; /* Rendre invisible */
    transform: translateY(20px); /* Décaler vers le bas */
    transition: opacity 0.5s ease, transform 0.5s ease; /* Animation fluide */
    display: flex; /* Garde les éléments alignés comme vous le souhaitez */

    position: absolute;
    bottom: 20px; /* Positionner en bas */
    right: 20px; /* Positionner à droite */
}

/* Animation au survol */
.parent-box:hover {
    height: 300px; /* Taille augmentée au survol */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Ombre plus marquée */
}

/* Afficher le contenu caché au survol */
.parent-box:hover .hover-content {
    opacity: 1; /* Rendre visible */
    transform: translateY(0); /* Annuler le décalage */
    transition-delay: 0.2s; /* Délai pour l'apparition */
}

#carousel-vertical {
    position:relative;
    top:0;
    left:0;
    z-index:1;
    overflow:hidden;
}

#carousel-vertical .swiper-slide-prev {
    opacity: 0.5;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    justify-content: flex-end !important;
}

#carousel-vertical .swiper-slide-prev .e-con-inner {
    justify-content: flex-end !important;
}

#carousel-vertical .swiper-slide-next{
    opacity: 0.5;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.00) 7.14%, #FFF 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    justify-content: flex-start !important;
}

#carousel-vertical .swiper-slide-next .e-con-inner {
    justify-content: flex-start !important;
}

.parent-vertical-scroll .e-con-inner {
    position:relative;
}

.e-con-inner.fullscreen {
    transition:all 1.5s;
    max-width:100% !important;
    border-radius:0px !important;
}

.e-con-inner.fullscreen #carousel-vertical {
    border-radius: 0 !important;
    z-index:999;
    transition:all 1.5s;
    max-height:70vh !important;
}

#generation_leads:after {
    content:"";
    display:block;
    height:100%;
    position:absolute;
    opacity:0;
    width:0%;
    transition:opacity 0.8s;
}

#generation_leads.strategy-branding:after {
    content:"";
    display:block;
    background:url("/wp-content/uploads/2025/02/Perroquet-mascotte-palette-section-sphere.png") no-repeat;
    background-size:contain;
    background-position:top left;
    position:absolute;
    top:0;
    left:0;
    width:25%;
    height:100%;
    z-index:1;
    opacity:1;
}

#generation_leads.strategy-developpement:after {
    content:"";
    display:block;
    background:url("/wp-content/uploads/2025/02/Perroquet-mascotte-pc-section-sphere.png") no-repeat;
    background-size:contain;
    background-position:top right;
    position:absolute;
    top:0;
    right:0;
    width:25%;
    height:100%;
    z-index:1;
    opacity:1;
}


#generation_leads.strategy-community:after {
    content:"";
    display:block;
    background:url("/wp-content/uploads/2025/02/Perroquet-mascotte-tel-section-sphere.png") no-repeat;
    background-size:contain;
    background-position:bottom left;
    position:absolute;
    bottom:20%;
    left:0;
    width:25%;
    height:100%;
    z-index:1;
    opacity:1;
}

#generation_leads.strategy-seo:after {
    content:"";
    display:block;
    background:url("/wp-content/uploads/2025/02/Perroquet-mascotte-lunette-section-sphere.png") no-repeat;
    background-size:contain;
    background-position:bottom right;
    position:absolute;
    bottom:20%;
    right:0;
    width:25%;
    height:100%;
    z-index:1;
    opacity:1;
}

#generation_leads.strategy-ads:after {
    content:"";
    display:block;
    background:url("/wp-content/uploads/2025/02/Perroquet-mascotte-coupe-section-sphere.png") no-repeat;
    background-size:contain;
    background-position:bottom right;
    position:absolute;
    bottom:0;
    right:0;
    width:25%;
    height:100%;
    z-index:1;
    opacity:1;
}

.elementor-element.elementor-absolute.swipee-up, .elementor-element.elementor-absolute.swipee-down, .elementor-element.elementor-absolute.swipee-right, .elementor-element.elementor-absolute.swipee-left{
    z-index: 99;
    cursor: pointer;
    line-height: 0;
}
.parentsection .swiper-pagination{
    transform: scale(2.6) ;
    padding-right: 4px;
    top: 50%;
    right: 0;
}
.parentsection .swiper-pagination .swiper-pagination-bullet{
    margin: 3px 3px;
}
.parentsection .swiper-wrapper{
    height: 440px;
    /* Height of desktop swiper */
    flex-direction: column;
}
@media (max-width:1024px){
    .parentsection .swiper-wrapper{
        height: 540px;
        /* Height of tablet swiper */
    }
}
@media (max-width:767px){
    .parentsection .swiper-wrapper{
        height: 760px;
        /* Height of mobile swiper */
    }
}

.elementor-shortcode > video {
    transition:all 0.5s;
    border-radius:24px;
    box-shadow: 0px -28px 84px -24px rgba(226, 232, 255, 0.25) inset, 0px 0px 2px 2px rgba(240, 237, 246, 0.17) inset, 0px 0px 8px 5px rgba(247, 233, 247, 0.40) inset, 0px 0px 16px 1px rgba(255, 255, 255, 0.36) inset;
}

.elementor-shortcode .little-video {
    transform:scale(0.9);
    cursor:none !important;
}

.projet:hover {
    cursor:none !important;
}

.voirleprojet {
    display:none;
    opacity:0;
    height:0;
    overflow:hidden;
    width:120px !important;
    text-align:center;

}

.carousel.vertical .elementor-carousel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 500px; /* Vous pouvez ajuster la hauteur selon vos besoins */
}
.carousel.vertical .elementor-carousel .slick-track {
    display: flex;
    flex-direction: column;
}
.carousel.vertical .elementor-carousel .slick-slide {
    height: auto;
}

.menu-breadcrumb, div.aioseo-breadcrumbs {
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-breadcrumb > span {
    display: flex;
    align-items: center;
}

.menu-breadcrumb .home, div.aioseo-breadcrumbs > .aioseo-breadcrumb:first-child > a {
    width: 22px;
    height: 10px;
    display: inline-block;
    background: url(/wp-content/themes/hello-elementor-child/assets/img/p.svg) no-repeat;
    background-size: contain;
    background-position: left center;
    position:relative;
    margin-right:8px;
    margin-top: -3px;
    font-size:0;
    text-indent:-9999px;
}

div.aioseo-breadcrumbs > .aioseo-breadcrumb:first-child > a {
    width: 10px;
    margin-right:0;
    margin-top:-1px;
    display:block;
}

.menu-breadcrumb .home:after {
    content:"";
    width: 6px;
    height: 10px;
    display: inline-block;
    background: url(/wp-content/themes/hello-elementor-child/assets/img/chevron-right.svg) no-repeat;
    background-size: contain;
    background-position: center;
    position:absolute;
    right:0;
    top:50%;
    margin-top:-5px;
    line-height: 1.2em;
}

.menu-breadcrumb, .menu-breadcrumb a, .menu-breadcrumb span, .aioseo-breadcrumb {
    color: rgba(44, 44, 44, 0.80);
    text-align: center;
    font-family: "Perroquet Regular", Sans-serif;
    font-size: 0.813rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1em;
    transition:all 0.3s;
}

.menu-breadcrumb a:hover {
    text-decoration:underline;
    color:#7600ff;
}

.menu-breadcrumb .sep, .aioseo-breadcrumb-separator {
    width: 6px;
    height: 10px;
    display: inline-block;
    background: url(/wp-content/themes/hello-elementor-child/assets/img/chevron-right.svg) no-repeat;
    background-size: contain;
    background-position: center;
    text-indent:-99999px;
    font-size:0;
    margin: 0 8px;
}

/* SOUS MENU */

.elementor-hidden-desktop .jet-mega-menu .jet-mega-menu-container {
	width: calc(100vw - 80px);
    right: -10px;
	margin-top:3px;
}


.jet-mega-menu-item.current-menu-ancestor > .jet-mega-menu-item__inner > .jet-mega-menu-item__link > .jet-mega-menu-item__title, 
.jet-mega-current-menu-item  .jet-mega-menu-item__inner > .jet-mega-menu-item__link > .jet-mega-menu-item__title, 
.jet-mega-menu-item:hover > .jet-mega-menu-item__inner > .jet-mega-menu-item__title {
    color:var(--jmm-top-hover-item-title-color) !important;
    font-weight:700;
}

.sous_menu ul {
    overflow:hidden;
}

.sous_menu li {
    transition:all 0.5s !important;
    padding:3px 0px!important;
    position:relative!important;
    z-index:2!important;
    overflow:hidden!important;
}

.sous_menu li a {
    z-index:9!important;
    position:relative!important;
}

.sous_menu li:after {
    content:""!important;
    position:absolute!important;
    top:0!important;
    display:block!important;
    left:-100%!important;
    width:100%!important;
    height:100%!important;
    z-index:1!important;
    transition:all 0.5s!important;
    background: linear-gradient(270deg,#430390 -32.31%, #760AF3 24.94%, #A969F4 100%) #FFF!important;
    background-position:0%!important;
}

.sous_menu li:hover:after, .sous_menu li.current-menu-item:after {
    left:0!important;
}

.sous_menu li:hover, .sous_menu li.current-menu-item {
    border-radius: 3px!important;
    padding:3px 20px 3px 6px!important;
}

.sous_menu li:hover:before, .sous_menu li.current-menu-item:before {
    content:""!important;
    background:url("/wp-content/uploads/2025/02/chevron-right-white.svg") no-repeat!important;
    width:5px!important;
    height:9px!important;
    position:absolute!important;
    z-index:2!important;
    right:6px!important;
    top:50%!important;
    margin-top:-4.5px!important;
}

#main-menu .jet-mega-menu-item-has-children .jet-mega-menu-mega-container {
    -webkit-transform:translateY(-200%);
    -moz-transform:translateY(-200%);
    transform:translateY(-100%);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#main-menu li.jet-mega-menu-item-has-children.jet-mega-menu-item--hover .jet-mega-menu-mega-container {
    opacity: 1;
    -webkit-transform:translateY(0px);
    -moz-transform:translateY(0px);
    transform:translateY(0px);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}



@media screen and (max-width:1024px) {
    .jet-mega-menu-sub-menu {
        padding:0 0 0 1.5rem;
    }
}

#contenu-post h2, #contenu-post h3, #contenu-post h4, #contenu-post h5, #contenu-post h6 {
    color:black;
}

#contenu-post h2 {
    margin-bottom:2rem;
}

#contenu-post .wp-block-pullquote {
    padding:0rem 1rem 0rem 1.2rem;
    position:relative;
}

#contenu-post .wp-block-pullquote:after {
    content:"";
    background:#7600FF;
    width:4px;
    height:100%;
    display:block;
    top:0;
    left:0px;
    position:absolute;
    border-radius:37px;
}

#contenu-post .wp-block-pullquote p {
    line-height:1.2em;
    font-size:1.5rem;
}

#contenu-post .wp-block-pullquote cite {
    font-size:1rem;
    font-weight:700;
    font-style:normal;
}


/* Par défaut, on cache la description */
.hidden-description {
    opacity: 0; /* Rendre invisible */
    max-height: 0; /* Hauteur initiale nulle */
    overflow: hidden; /* Masque le contenu quand max-height est 0 */
    transition: opacity 0.4s ease-in-out, max-height 0.4s ease-in-out; /* Transition pour l'opacité et la hauteur */
  }
  
  /* Empêcher la synchronisation de la hauteur */
  .elementor-column {
    align-items: flex-start; /* Permet aux colonnes d'avoir des hauteurs différentes */
  }
  
  /* Quand on survole le conteneur, on affiche la description */
  .animated-container:hover .hidden-description{
    opacity: 1; /* Rendre visible */
    max-height: 400px; /* Hauteur maximum pour afficher le texte, ajustez selon votre contenu */
    transition-delay: 0.2s; /* Délai d'apparition */
  }
  
  /* Couleur de fond par défaut */
  .animated-container {
    position: relative;
    overflow: visible;
    z-index: 1;
    transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out;
  }
  
  /* Agrandissement et couleur inchangée au survol */
  .animated-container:hover {
    transform: scale(1.1);
    z-index: 10;
    background: url("/wp-content/uploads/2025/03/Rectangle-149.png") no-repeat;
	background-size:cover;
	background-position:center bottom;
  }
  
  /* Style de base pour le titre et la description (par défaut) */
  .animated-container .elementor-element.elementor-image-box-title,
  .animated-container .elementor-element.elementor-image-box-description {
    transition: color 0.3s ease-in-out; /* Transition pour un changement de couleur fluide */
  }

  .animated-container .title-animated {
    margin-top:auto;
  }

  .animated-container:hover .title-animated {
    margin-top:0;
  }
  
  /* Changer la couleur en blanc lors du survol du conteneur */
  .animated-container:hover .elementor-image-box-title,
  .animated-container:hover .elementor-image-box-description,
  .animated-container:hover .title-animated  {
    color: #FFFFFF !important; /* Couleur du texte en blanc lors du survol */
  }
  

  
  
  /* Animation de flottement plus aléatoire */
  @keyframes float-random {
    0% {
      transform: translate(0, 0); /* Position initiale */
    }
    25% {
      transform: translate(10px, -5px); /* Déplacement en diagonale */
    }
    50% {
      transform: translate(-10px, 5px); /* Déplacement opposé */
    }
    75% {
      transform: translate(5px, -10px); /* Déplacement vers la gauche et en haut */
    }
    100% {
      transform: translate(0, 0); /* Retour à la position initiale */
    }
  }
  
  /* Différents délais pour désynchroniser les animations */
  .float-image-1 {
    animation: float-random 10s ease-in-out infinite;
    animation-delay: 0s;
  }
  
  .float-image-2 {
    animation: float-random 10s ease-in-out infinite;
    animation-delay: 0.5s;
  }
  
  .float-image-3 {
    animation: float-random 10s ease-in-out infinite;
    animation-delay: 1s;
  }

@media screen and (max-width:768px) {
    .elementor-hidden-desktop .elementor-swiper-button-prev {
        margin-left:5px;
    }
    .elementor-hidden-desktop .elementor-swiper-button-next {
        margin-right:5px;
    }
}