.elementor-kit-7{--e-global-color-primary:#C0C0C0;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#000000;--e-global-typography-primary-font-family:"bebas-neue-pro";--e-global-typography-primary-font-size:68px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-line-height:56px;--e-global-typography-secondary-font-family:"bebas-neue-pro";--e-global-typography-secondary-font-size:30px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-secondary-line-height:25px;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Mobile uniquement : neutralise le halo bleu et tout focus visuel du bouton fermer */
@media (hover:none) and (pointer:coarse){
  .elementor-modal .dialog-close-button,
  .elementor-modal .dialog-close-button:focus,
  .elementor-modal .dialog-close-button:focus-visible,
  .elementor-modal .dialog-close-button:active{
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
    -webkit-appearance: none !important;
            appearance: none !important;
    background-clip: padding-box !important;
  }

  /* Variante si ton popup utilise le type "lightbox" */
  .dialog-type-lightbox .dialog-close-button,
  .dialog-type-lightbox .dialog-close-button:focus,
  .dialog-type-lightbox .dialog-close-button:focus-visible,
  .dialog-type-lightbox .dialog-close-button:active{
    -webkit-tap-highlight-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
  }

  /* Fix Firefox mobile (inner focus) */
  .elementor-modal .dialog-close-button::-moz-focus-inner{ border:0 !important; }
}




.typewriter{
  font-family: 'bebas-neue-pro', sans-serif;
  font-size: 30px;
  font-weight: 300;
  line-height: 35px;
  text-align: justify;
  letter-spacing: 0;
}




@media (max-width: 767px){

 .typewriter{
  font-family: 'bebas-neue-pro', sans-serif;
  font-size: 25px;
  font-weight: 300;
  line-height: 30px;
  text-align: justify;
  letter-spacing: 0;
}

}




/* Évite le coût de rendu hors écran (gros gain) */
.e-loop-item, .elementor-loop-item, .elementor-post, .elementor-grid-item{
  content-visibility: auto;
  contain-intrinsic-size: 300px 168px; /* approximatif 16/9 pour éviter le CLS */
}


/* A) Stabiliser les cartes (évite les “sauts” au resize) */
.videos-grid .vimeo_preview{
  aspect-ratio: 16/9;          /* ratio fixe → pas de collapses */
  width: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Laisser Elementor calculer les largeurs */
.elementor-loop-item,
.elementor-grid-item,
.elementor-post { width:auto !important; }

/* Colonnes responsives (si un style Elementor ne prend pas la main) */
.videos-grid .elementor-grid{
  display: grid;               /* sécurité */
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: var(--grid-column-gap, 24px);
}
@media (max-width: 1200px){
  .videos-grid .elementor-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 992px){
  .videos-grid .elementor-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  .videos-grid .elementor-grid{ grid-template-columns: 1fr; }
}

/* Nos classes d’animation ne doivent pas “casser” la mise en page */
.is-hidden{ display:none !important; }
.is-enter{ opacity:0; transform: translateY(8px); }
.is-enter.is-in{ opacity:1; transform:none; transition:opacity .35s, transform .35s; }
.is-hiding{ opacity:0 !important; transform: translateY(8px); transition:opacity .35s, transform .35s; }




.video-hover-play1 {
  position: relative;
  overflow: hidden;
    height: 40vh; 

}

.video-hover-play1 video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100vw;
  min-height: 40vh;
  transform: translate(-50%, -50%);
  object-fit: cover;
}

.video_preview .boutonPlay {
  opacity: 0;
  transition: opacity 0.4s ease;

}

.video_preview:hover .boutonPlay {
  opacity: 1;
}

.video_preview {
  position: relative;
}



.titre-auto-negatif {
  color: white;
  mix-blend-mode: difference !important;
  position: relative;
  z-index: 20;
  isolation: isolate;
  transition: color 0.3s ease;
  pointer-events: none;
}
.fond-blanc{
    isolation: isolate;

}

html, body {
  scroll-behavior: auto !important;
  overflow-anchor: none;
}

.elementor-sticky--effects {
  will-change: unset !important;
}

/* Fond : état normal */
.inversion-hover {
  background-color: white !important;
  transition: background-color 1s ease;
}

/* Fond : état survolé */
.inversion-hover:hover {
  background-color: black !important;
}


/* Textes dans le conteneur : état normal */
.inversion-hover h1,
.inversion-hover h2,
.inversion-hover h3,
.inversion-hover p,
.inversion-hover span {
  color: black !important;
  transition: color 1s ease;
}

/* Textes dans le conteneur : état survolé */
.inversion-hover:hover h1,
.inversion-hover:hover h2,
.inversion-hover:hover h3,
.inversion-hover:hover p,
.inversion-hover:hover span {
  color: white !important;
}


/* Fond : état normal */
.inversion-hover2 {
  background-color: black !important;
  transition: background-color 1s ease;
}

/* Fond : état survolé */
.inversion-hover2:hover {
  background-color: white !important;
}


/* Textes dans le conteneur : état normal */
.inversion-hover2 h1,
.inversion-hover2 h2,
.inversion-hover2 h3,
.inversion-hover2 p,
.inversion-hover2 span {
  color: white !important;
  transition: color 1s ease;
}

/* Textes dans le conteneur : état survolé */
.inversion-hover2:hover h1,
.inversion-hover2:hover h2,
.inversion-hover2:hover h3,
.inversion-hove2r:hover p,
.inversion-hover2:hover span {
  color: black !important;
}

.inversion-hover1{
    opacity: 0.3;
       transition: opacity 1s ease;
}
.inversion-hover1:hover{
    opacity: 1;
      transition: opacity 1s ease;
}/* End custom CSS */