/* ******************************* */

/* STYLE DE L'ANIMATION DES TEXTES */

/* ******************************* */



/* conteneur */

.title-anim { position:relative; }



/* overflow par ligne (masque la montée) */

.title-anim .line-wrap{  

  display:block; overflow:hidden; 

  }

  

.title-anim .word{ 

  display:inline-block; margin-inline-end:.25em;

}



/* chaque caractère animé */

.title-anim .char{

  display:inline-block;

  transform: translateY(110%);

  opacity: 0;

  will-change: transform, opacity;

}



/* état joué */

.title-anim.play .char{

  animation: ta-up .55s cubic-bezier(.2,.8,.2,1) forwards;

}



@keyframes ta-up{

  to{ transform: translateY(0); opacity: 1; }

}



/* motion réduite */

@media (prefers-reduced-motion: reduce){

  .title-anim .char{ transform:none; opacity:1; animation:none!important; }

}



/* optionnel: éviter sauts quand police charge */

.title-anim { contain: content; }







/* ****************************************** */

/* STYLE DE L'ANIMATION DES LOGOS SUR DESKTOP */

/* ****************************************** */



.partners_container {

  overflow: hidden;

}

/* === réglages rapides === */

.partners{

  --gap: 24px;              /* espace entre cards */

  --card-w: 320px;          /* largeur card desktop (ajuste) */

  --card-h: 160px;          /* hauteur card desktop (ajuste) */

}



/* viewport (on wrappe dedans via JS) */

.partners{ position:relative; overflow:hidden; }



/* piste qui translate en X */

.partners-viewport{ overflow:hidden; }

.partners-track{

  display:flex;

  align-items:center;

  gap:var(--gap);

  will-change: transform;

}



/* empêcher Elementor d'étirer les cards */

.partners .e-con,

.partners .e-con.e-child,

.partners .e-con.e-child.e-con-full{

  flex:0 0 auto !important;

  width:var(--card-w) !important;

  height:var(--card-h) !important;

  box-sizing:border-box;

  border-radius:12px;

}



/* images centrées et contenues */

.partners .elementor-widget-image img{

  display:block;

  width:auto;

  height:auto;

  object-fit:contain;

  margin:auto;

}



/* responsive (exemple) */

@media (max-width: 1024px){

  .partners{ --card-w: 280px; --card-h: 150px; --gap: 20px; }

}

@media (max-width: 768px){

  .partners{ --card-w: 240px; --card-h: 140px; --gap: 16px; }

}



@media (prefers-reduced-motion:reduce){

  .partners-track{ transform:none !important; }

}







/* ********************************************* */

/* STYLE DE L'ANIMATION DES LOGOS SUR RESPONSIVE */

/* ********************************************* */



/* ===== Mobile partners carousel ===== */

.dc-logos{

  /* quick tuning */

  --pad-x: 16px;

  --gap: 16px;

  --card-w: 82vw;     /* card width */

  --card-h: 160px;    /* card height */

  --dot: 6px;

  --dot-gap: 8px;

  --dot-on: #6D54FF;

  --dot-off:#C9C8D5;



  display:flex !important;

  flex-direction: row !important;

  flex-wrap: nowrap !important;      /* <-- no wrapping */

  gap: var(--gap);

  padding: 8px var(--pad-x) 28px;

  overflow-x: auto;

  scroll-snap-type: x mandatory;

  -webkit-overflow-scrolling: touch;



  scrollbar-width: none;

}

.dc-logos::-webkit-scrollbar{ display:none; }



/* Each slide = the direct Elementor child container */

.dc-logos > .e-con{

  flex: 0 0 var(--card-w) !important;

  width: var(--card-w) !important;         /* overrides Elementor 100% */

  max-width: none !important;

  min-width: var(--card-w) !important;

  height: var(--card-h);

  min-height: auto !important;

  margin: 0 !important;



  scroll-snap-align: start;

  border-radius: 14px;



  display:flex; align-items:center; justify-content:center;

}



/* Logo fit */

.dc-logos .elementor-widget-image img{

  width:auto; height:auto; display:block; margin:auto;

}



/* Dots (inserted by JS right after .dc-logos) */

.dc-logos + .dc-dots{

  position: relative;

  margin-top: -20px;

  display:flex; justify-content:center; gap: var(--dot-gap);

}

.dc-logos + .dc-dots button.dc-dot{

  width: var(--dot); height: var(--dot);

  border-radius: 999px; background: var(--dot-off);

  transition: width .25s ease, background-color .25s ease;

}

.dc-logos + .dc-dots button.dc-dot.is-active{

  width: calc(var(--dot) * 2.2);

  background: var(--dot-on);

}



/* tiny phones */

@media (max-width: 380px){

  .dc-logos{ --card-w: 86vw; --card-h: 148px; }

}





/* Mobile partners carousel: force a 14px offset of the first card */

.dc-logos{

  --left-pad: 25px;                 /* the offset you want */

  scroll-snap-type: x mandatory;

  -webkit-overflow-scrolling: touch;

  display: flex;

  gap: 16px;

  overflow-x: auto;



  /* so snap starts AFTER the spacer */

  scroll-padding-left: var(--left-pad);

  scroll-padding-inline-start: var(--left-pad);

  

  padding: 8px 0 45px 25px;

}



/* the invisible spacer before the first card */

.dc-logos::before{

  content: "";

  flex: 0 0 var(--left-pad);        /* occupies exactly 14px */

}



/* (optional) add the same spacer at the end so the last card can center nicely */

.dc-logos::after{

  content: "";

  flex: 0 0 10px;

}



/* slides (Elementor containers) — NO margin reset here */

.dc-logos > .e-con{

  flex: 0 0 60%!important;                   /* your card width */

  min-width: 60%!important;

  scroll-snap-align: start;

  min-height: auto !important;

  display: flex;

  flex-direction: column;

}



/* keep logos contained */

.dc-logos .elementor-widget-image img{

  display: block;

  width: auto; height: auto;

  max-width: 100%; max-height: 100%;

  object-fit: contain;

  margin: auto;

}



/* hide scroll bar (cosmetic) */

.dc-logos{ scrollbar-width: none; }

.dc-logos::-webkit-scrollbar{ display: none; }







/* ************************************** */

/* STYLE DE L'ANIMATION DES CHIFFRES CLES */

/* ************************************** */





/* réglages rapides */

.stats-reveal{

  --pin-top: 10vh;     /* marge en haut pendant le “pin” */

  --section-span: 220vh; /* hauteur totale de la zone d'effet (donne la “course” de scroll) */

  --shift: 48px;           /* amplitude un peu plus courte = plus doux */

}



/* la zone crée de l'espace pour scroller */

.stats-reveal{

  --pin-top: 10vh;      /* comme avant */

  --section-span: 160vh;

  --lead: 5vh;         /* NOUVEAU : commence ~15vh plus tôt (mets 0 pour désactiver) */

}

/* l'intérieur reste “épinglé” (sticky) pendant la course */

.stats-reveal > .e-con-inner{

  position: sticky;

  top: var(--pin-top);

  /* assure une hauteur confortable pendant le pin (auto suffit si tes contenus fixent la hauteur) */

}



/* on superpose les 2 groupes */

.stats-front,

.stats-back{

  position: absolute;

  inset: 0;

  display: flex;               /* garde tes mises en page */

  align-items: stretch;        /* laisse Elementor gérer, on n’impose rien */

  will-change: transform, opacity;

}



/* états initiaux */

.stats-front{ 

  transform: translateY(0%); 

  opacity: 1;

}

.stats-back{  

  transform: translateY(calc(var(--shift) * (1 - var(--pe))));

  opacity: var(--pe);

}



/* états pilotés par --pe (progression easing) */

.stats-front,

.stats-back{

  will-change: transform, opacity;

}



/* piloté par JS: on anime via une variable --p dans [0..1] */

.stats-reveal[data-p]{ /* garde une seule règle */

  /* rien ici, juste un hook */

  --shift: 56px;   /* amplitude de décalage vertical (ajuste 32–80px) */

}

.stats-reveal[data-p] .stats-front{

  transform: translateY(calc(-100% * var(--p)));

  opacity: calc(1 - var(--p));

}

.stats-reveal[data-p] .stats-back{

  transform: translateY(calc((1 - var(--p)) * 100%));

  opacity: var(--p);

}



/* option accessibilité */

@media (prefers-reduced-motion: reduce){

  .stats-front,.stats-back{ transform:none !important; opacity:1 !important; }

}



/* front sort doucement (monte un peu + fade out) */

.stats-front{

  transform: translateY(calc(-1 * var(--shift) * var(--pe)));

  opacity: calc(1 - var(--pe));

}





/* ****************************** */

/* STYLE DU CAROUSEL DES PRODUITS */

/* ****************************** */



/* ===== Dot Carousel — version simple & stable ===== */

.dc{

  --pad-x: 16px;

  --dot-size: 6px;

  --dot-gap: 8px;

  --dot-color: #C9C8D5;

  --dot-active: #6D54FF;

  display: flex;

  overflow-x: auto;

  scroll-snap-type: x mandatory;

  -webkit-overflow-scrolling: touch;

  gap: 0;

  scrollbar-width: none;

  max-height: 25vh;

  column-gap: 10px;

}

.dc::-webkit-scrollbar{ display:none; }



/* une slide = container Elementor direct */

.dc > .e-con{

  flex: 0 0 calc(100% - 2*var(--pad-x));

  min-width: calc(100% - 2*var(--pad-x));

  scroll-snap-align: start;



  /* neutralise les hauteurs/marges imposées par Elementor */

  min-height: auto !important;

  margin: 0 !important;

  display: flex;

  flex-direction: column;

}

.dc > .e-con .elementor-widget:last-child{ margin-bottom:0 !important; }



/* les puces sont dans le flux, sous le carrousel */

.dc-dots{

  display:flex;

  justify-content:center;

  gap: var(--dot-gap);

  margin-top: 12px; 

  width: 100%;

  column-gap: 8px;

}

button.dc-dot:focus {

  background: #BDBDBD;

}

button.dc-dot{

  border-radius: 999px;

  background: #BDBDBD;

  transition: width .25s ease, background-color .25s ease;

  border: none;

  display: flex;

  padding: 4px;

}

button.dc-dot.is-active{

  background: #8052FF;

  width: 20px;

}



/* au cas où Elementor met min-height/height sur .dc */

.dc.e-con{ min-height:auto !important; height:auto !important; padding-bottom:0 !important; }



/** FIXE PRODUIT CONTENU DYNAMIQUE PLUS OU MOINS GRAND **/
@media (max-width: 768px) {
   .dc .e-con, .dc .e-con-inner {
     align-items: flex-start !important;
     height: auto !important;
     min-height: auto !important;
  }
   .dc {
     display: flex !important;
     flex-direction: row !important;
     flex-wrap: nowrap !important;
     overflow-x: auto !important;
     scroll-snap-type: x mandatory !important;
     -webkit-overflow-scrolling: touch !important;
     align-items: flex-start !important;
     height: initial !important;
     max-height: initial !important;
  }
   .dc > .e-con {
     flex: 0 0 calc(100% - 2*var(--pad-x)) !important;
     min-width: calc(100% - 2*var(--pad-x)) !important;
     height: auto !important;
     min-height: auto !important;
     align-self: flex-start !important;
  }
   .dc [style*="height"], .dc [style*="min-height"] {
     height: auto !important;
     min-height: auto !important;
  }
   .dc, .dc * {
     flex-grow: 0 !important;
     flex-shrink: 0 !important;
  }
}
 
 



.elementor-button-link {
   transition: border-radius 0.5s !important;
}
 .elementor-button-link:hover {
   border-radius: 10px !important;
}
 @media (max-width: 768px) {
   div.home_hero {
     background: url("https://argon-uw.com/wp-content/uploads/2025/09/home_hero_bg_responsive.webp") !important;
     background-position: center bottom -90px!important;
  }
   div.home_valeurs {
     background: #e8efff url("https://argon-uw.com/wp-content/uploads/2025/09/home_valeur_bg_responsive.webp") !important;
     background-position: top -50px right -50px !important;
  }
   div.home_valeurs, div.home_hero {
     background-size: cover !important;
     background-repeat: no-repeat !important;
  }
   div.elementor-element.rwd_css > .e-con-inner {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
  }
   div.elementor-element.rwd_css > .e-con-inner > div:nth-child(2) {
     width: auto;
  }
}
 .traduction .hfe-nav-menu > li {
   position: relative;
}
 .traduction .hfe-nav-menu > li a {
   font-weight: 500 !important;
}
 .traduction .hfe-nav-menu > li:before {
   content: '';
   position: absolute;
   height: 20px;
   width: 20px;
   top: 12px;
   left: -15px;
}
 .traduction .hfe-nav-menu > li .sub-menu {
   background: none !important;
   min-width: 98px !important;
   max-width: 98px !important;
   box-shadow: none;
}
 .traduction .hfe-nav-menu > li .sub-menu li {
   background: white !important;
   border: none !important;
   border-radius: 12px !important;
   left: -28px;
}
 .traduction .hfe-nav-menu > li .sub-menu li.current-lang {
   display: none;
}
 .traduction .hfe-nav-menu > li .sub-menu li a.hfe-sub-menu-item {
   padding: 20px 30px 20px 45px !important;
}
 .traduction .hfe-nav-menu > li .sub-menu li:before {
   content: '';
   position: absolute;
   height: 20px;
   width: 20px;
   top: 17px;
   left: 15px;
}
 .traduction.fr li:before {
   top: 12px;
   left: -15px;
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/flag_france.svg") !important;
}
 .traduction.fr li ul li:before {
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/flag_united_kingdom.svg") !important;
}
 .traduction.en li:before {
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/flag_united_kingdom.svg") !important;
}
 .traduction.en li ul li:before {
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/flag_france.svg") !important;
}
 #content .wpcf7-form.grid {
   margin: 0 auto;
}
 #content .wpcf7-form .field-group {
   margin-bottom: 30px;
}
 #content .wpcf7-form .field-group p {
   line-height: 14px;
}
 #content .wpcf7-form .field-group p .wpcf7-not-valid-tip {
   display: block;
   margin: 10px 0 25px;
   font-size: 14px;
   color: #8052ff;
}
 #content .wpcf7-form label {
   display: block;
   font-weight: 500;
   font-size: 16px;
   color: #212121 !important;
}
 #content .wpcf7-form .input, #content .wpcf7-form .textarea, #content .wpcf7-form .select {
   width: 100%;
   padding: 15px 16px;
   border: none;
   border-radius: 8px;
   background: #fff;
   box-shadow: 0 1px 2px rgba(0,0,0,0.03);
   font-size: 18px;
   font-weight: 500;
}
 #content .wpcf7-form .input::placeholder, #content .wpcf7-form .textarea::placeholder, #content .wpcf7-form .select::placeholder {
   color: #9E9E9E;
}
 #content .wpcf7-form .input:focus, #content .wpcf7-form .input:target, #content .wpcf7-form .textarea:focus, #content .wpcf7-form .textarea:target, #content .wpcf7-form .select:focus, #content .wpcf7-form .select:target {
   border: none !important;
   outline: none !important;
}
 #content .wpcf7-form .textarea {
   min-height: 180px;
   resize: vertical;
}
 #content .wpcf7-form .hint {
   text-align: center;
   font-size: .95rem;
   color: #666;
   margin-top: 8px;
}
 #content .wpcf7-form .hint p {
   display: none;
}
 #content .wpcf7-form .btn.btn-primary {
   display: inline-block;
   padding: 12px 25px;
   border-radius: 28px;
   background: #BDBDBD;
   color: #fff;
   border: none;
   cursor: pointer;
}
 #content .wpcf7-form .btn.btn-primary:disabled {
   cursor: not-allowed;
}
 #content .wpcf7-form .codedropz-upload-handler {
   border-radius: 8px;
   border: 1px dashed #9E9E9E;
}
 #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container {
   padding: 40px;
   margin: 5px;
   background: white;
   border-radius: 8px;
}
 #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container .codedropz-upload-inner h3, #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container .codedropz-upload-inner span {
   display: none;
}
 #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container .codedropz-upload-inner .codedropz-btn-wrap {
   width: 70%;
   margin: auto;
}
 #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container .codedropz-upload-inner .codedropz-btn-wrap a.cd-upload-btn {
   font-size: 16px;
   color: #9E9E9E;
   font-weight: 500;
   line-height: 22px;
   position: relative;
   margin: 40px 0 0;
   display: flex;
   justify-content: center;
}
 #content .wpcf7-form .codedropz-upload-handler .codedropz-upload-container .codedropz-upload-inner .codedropz-btn-wrap a.cd-upload-btn:before {
   content: '';
   position: absolute;
   width: 24px;
   height: 24px;
   background: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/form_add.svg") !important;
   left: 50%;
   transform: translate(-12px);
   top: -40px;
}
 #content .wpcf7-form .codedropz-upload-handler .dnd-upload-counter {
   display: none;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-image {
   display: none;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details {
   width: 100%;
   padding: 0;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details span.name {
   position: relative;
   padding: 8px 0 20px 25px;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details span.name span {
   font-size: 18px;
   font-weight: 500;
   color: #212121;
   height: 18px;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details span.name em {
   display: none;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details span.name:before {
   content: '';
   position: absolute;
   width: 24px;
   height: 24px;
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/file.svg") !important;
   background-repeat: no-repeat;
   left: 0;
   transform: translate(0,3px);
   top: 0;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details .dnd-progress-bar {
   height: 2px;
   background: white;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details .dnd-progress-bar span {
   background: #8052ff;
   color: #8052ff;
}
 #content .wpcf7-form .dnd-upload-status .dnd-upload-details .remove-file span:after {
   background-image: url("https://argon-uw.com/wp-content/themes/hello-elementor-child/assets/img/trash.svg") !important;
   width: 20px;
   height: 20px;
}
 #content .wpcf7-form.cf7-live-ok .btn.btn-primary {
   background: #212121;
}
 #content .wpcf7-form.cf7-live-ok .btn.btn-primary:hover {
   border-radius: 10px;
}
 #content .wpcf7-form .wpcf7-response-output {
   background: #8052ff;
   color: white;
   padding: 20px;
   border: none;
   border-radius: 8px;
}
 #content .wpcf7-form-control.wpcf7-file.file-drop {
   padding: 28px;
   text-align: center;
   border: 2px dashed rgba(0,0,0,0.15);
   background: rgba(255,255,255,0.6);
}
 #content .codedropz-upload-wrapper span.has-error-msg {
   font-size: 14px;
   color: #8052ff;
   font-style: inherit;
   margin: 5px 0 10px;
}
 #content form.invalid .wpcf7-response-output {
   background: #333;
   color: #fff;
   border: none;
   padding: 20px;
   font-weight: 500;
   border: 1px solid #333;
   font-size: 16px;
   border-radius: 8px;
   padding: 30px;
   margin: 50px 0 0;
}

@media (max-width: 768px) {
   body.page-id-955,
   body.page-id-989,
   body.page-id-1009,
   body.page-id-1062 {
     background: none !important;
  }
   .page_interne {
     background-image: url(https://argon-uw.com/wp-content/uploads/2025/10/contact_hero_bg.webp);
     background-position: right -200px top;
     background-size: cover;
     background-attachment: fixed;
  }
}

.page_interne.contact {
   background-image: url(https://argon-uw.com/wp-content/uploads/2025/10/contact_hero_bg.webp);
   background-position: center center;
   background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
   border-radius: 0!important;
   opacity: 0;
   animation-name: fadeInBg;
   animation-duration: 1.5s;
   animation-timing-function: ease;
   animation-delay: 0.1s;
   animation-fill-mode: forwards;
}


 .page_interne.contact footer {
   background: white;
}
 .page_interne.mentions {
   background-image: url(https://argon-uw.com/wp-content/uploads/2025/09/home_hero_bg.webp);
   background-position: right bottom 200px;
   background-size: cover;
   background-attachment: fixed;
   background-repeat: no-repeat;
   border-radius: 0 0 40px 40px !important;
   opacity: 0;
   animation-name: fadeInBg;
   animation-duration: 1.5s;
   animation-timing-function: ease;
   animation-delay: 0.1s;
   animation-fill-mode: forwards;
}

@keyframes fadeInBg {
  from { opacity: 0; }
  to { opacity: 1; }
}
 .page_interne.mentions footer {
   background: white;
}


.header_blur > .e-con-inner {
   width: 100%;
   transition: all 0.3s ease;
   background: transparent;
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
   z-index: 1000;
   border-radius: 0px;
   position: relative;
   top: 20px;
   padding: 20px;
   border-radius: 20px;
}
 .header_blur.scrolled > .e-con-inner {
   background: rgba(255,255,255,0.2);
   backdrop-filter: blur(12px);
   -webkit-backdrop-filter: blur(12px);
}
 @media (max-width: 768px) {
   .header_blur {
     padding: 0 !important;
  }
   .header_blur > .e-con-inner {
     top: 0;
     padding: 20px 25px;
     border-radius: 0;
  }
}
 

@media (max-width: 767px) {
   .cta-secondary {
     position: fixed;
     transition: bottom 0.5s;
     top: inherit;
     bottom: -70px;
     z-index: 99999;
  }
   .cta-secondary.is-active {
     top: inherit;
     bottom: 0;
     backdrop-filter: blur(12px);
     -webkit-backdrop-filter: blur(12px);
  }
   body.home footer {
     padding-bottom: 50px !important;
  }
}
 

#cmplz-manage-consent .cmplz-manage-consent {
   font-family: "Montserrat", Sans-serif !important;
   font-weight: 600 !important;
}
 .grecaptcha-badge {
   right: -300px !important;
}
 body.page-id-955 .grecaptcha-badge, body.page-id-989 .grecaptcha-badge {
   right: -200px !important;
}
 body.page-id-955 .grecaptcha-badge:hover, body.page-id-989 .grecaptcha-badge:hover {
   right: 0 !important;
}

[id] {
  scroll-margin-top: 130px; 
}