@import url('https://fonts.googleapis.com/css?family=Gilda%20Display:400');
@import url('https://fonts.googleapis.com/css?family=Nunito%20Sans:400,500');

:root {
  --mediactive-gradient-fallback: #64BC45;
  --mediactive-gradient: linear-gradient(90deg, rgba(100,188,69,1) 0%, rgba(200,217,59,1) 100%);
  --mediactive-gradient-hover-fallback: #C8D93B;
  --mediactive-gradient-hover: linear-gradient(90deg, rgba(200,217,59,1) 0%, rgba(100,188,69,1) 100%);
}
/* === Neutraliser complètement le style d'autocomplete === */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  box-shadow: 0 0 0px 1000px transparent inset !important;
  -webkit-text-fill-color: white !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  transition: background-color 9999s ease-in-out 0s;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -o-font-smoothing: antialiased;
}
/* style-overrides */
/* Ensure all elements inherit the color from its parent */
a,
.w-input,
.w-select,
.w-tab-link,
.w-nav-link,
.w-nav-brand,
.w-dropdown-btn,
.w-dropdown-toggle,
.w-slider-arrow-left,
.w-slider-arrow-right,
.w-dropdown-link {
  color: inherit;
  text-decoration: inherit;
  font-size: inherit;
}
/* Focus state style for keyboard navigation for the focusable elements */
*[tabindex]:focus-visible,
input[type="file"]:focus-visible {
  outline: 0.125rem solid #4d65ff;
  outline-offset: 0.125rem;
}
/* Get rid of top margin on first element in any rich text element */
.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {
  margin-top: 0 !important;
}
/* Get rid of bottom margin on last element in any rich text element */
.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {
  margin-bottom: 0 !important;
}
/* Prevent all click and hover interaction with an element */
.pointer-events-off {
  pointer-events: none;
}
/* Enables all click and hover interaction with an element */
.pointer-events-on {
  pointer-events: auto;
}
/* Create a class of .div-square which maintains a 1:1 dimension of a div */
.div-square::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
/* Make sure containers never lose their center alignment */
.container-medium,.container-small, .container-large {
  margin-right: auto !important;
  margin-left: auto !important;
}
/* Apply "..." after 3 lines of text */
.text-style-3lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
/* Apply "..." after 2 lines of text */
.text-style-2lines {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
/* Adds inline flex display */
.display-inlineflex {
  display: inline-flex;
}
/* These classes are never overwritten */
.hide {
  display: none !important;
}
/* Remove default Webflow chevron from form select */
select{
  -webkit-appearance:none;
}
@media screen and (max-width: 991px) {
  .hide, .hide-tablet {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .hide-mobile-landscape{
    display: none !important;
  }
}
@media screen and (max-width: 479px) {
  .hide-mobile{
    display: none !important;
  }
}
.margin-0 {
  margin: 0rem !important;
}
.padding-0 {
  padding: 0rem !important;
}
.spacing-clean {
  padding: 0rem !important;
  margin: 0rem !important;
}
.margin-top {
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}
.padding-top {
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}
.margin-right {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
  margin-left: 0rem !important;
}
.padding-right {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
  padding-left: 0rem !important;
}
.margin-bottom {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}
.padding-bottom {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}
.margin-left {
  margin-top: 0rem !important;
  margin-right: 0rem !important;
  margin-bottom: 0rem !important;
}
.padding-left {
  padding-top: 0rem !important;
  padding-right: 0rem !important;
  padding-bottom: 0rem !important;
}
.margin-horizontal {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}
.padding-horizontal {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}
.margin-vertical {
  margin-right: 0rem !important;
  margin-left: 0rem !important;
}
.padding-vertical {
  padding-right: 0rem !important;
  padding-left: 0rem !important;
}
/* Apply "..." at 100% width */
.truncate-width {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
*[x-cloak] {
  display: none !important;
}
/* Removes native scrollbar */
.no-scrollbar {
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
/*color-schemes*/
.color-scheme-1 {}
.color-scheme-2 {
  --color-scheme-1--text: var(--color-scheme-2--text);
  --color-scheme-1--background: var(--color-scheme-2--background);
  --color-scheme-1--foreground: var(--color-scheme-2--foreground);
  --color-scheme-1--border: var(--color-scheme-2--border);
  --color-scheme-1--accent: var(--color-scheme-2--accent);
}
.color-scheme-3 {
  --color-scheme-1--text: var(--color-scheme-3--text);
  --color-scheme-1--background: var(--color-scheme-3--background);
  --color-scheme-1--foreground: var(--color-scheme-3--foreground);
  --color-scheme-1--border: var(--color-scheme-3--border);
  --color-scheme-1--accent: var(--color-scheme-3--accent);
}
.color-scheme-4 {
  --color-scheme-1--text: var(--color-scheme-4--text);
  --color-scheme-1--background: var(--color-scheme-4--background);
  --color-scheme-1--foreground: var(--color-scheme-4--foreground);
  --color-scheme-1--border: var(--color-scheme-4--border);
  --color-scheme-1--accent: var(--color-scheme-4--accent);
}
.color-scheme-5 {
  --color-scheme-1--text: var(--color-scheme-5--text);
  --color-scheme-1--background: var(--color-scheme-5--background);
  --color-scheme-1--foreground: var(--color-scheme-5--foreground);
  --color-scheme-1--border: var(--color-scheme-5--border);
  --color-scheme-1--accent: var(--color-scheme-5--accent);
}
.color-scheme-6 {
  --color-scheme-1--text: var(--color-scheme-6--text);
  --color-scheme-1--background: var(--color-scheme-6--background);
  --color-scheme-1--foreground: var(--color-scheme-6--foreground);
  --color-scheme-1--border: var(--color-scheme-6--border);
  --color-scheme-1--accent: var(--color-scheme-6--accent);
}
.w-slider-dot {
  background-color: var(--color-scheme-1--text);
  opacity: 0.20;
}
.w-slider-dot.w-active {
  background-color: var(--color-scheme-1--text);
  opacity: 1;
}
/* Override .w-slider-nav-invert styles */
.w-slider-nav-invert .w-slider-dot {
  background-color: var(--color-scheme-1--text) !important;
  opacity: 0.20 !important;
}
.w-slider-nav-invert .w-slider-dot.w-active {
  background-color: var(--color-scheme-1--text) !important;
  opacity: 1 !important;
}
/* Empêche le flash du hero avant l'initialisation de GSAP */
#hero {
  visibility: hidden;
  opacity: 0;
}
.hero-headline {
  line-height: 1.1;
  height: 298px;
}

.hero-headline-line {
  display: block;
  width: 100%;
}

.hero-rotating-line {
  display: inline-block;
  white-space: nowrap;
  margin-top: 3px;
  height: 92px;
}

/*.hero-rotating-word {*/
/*  display: inline-block;*/
/*  color: var(--mediactive-gradient-fallback);*/
/*  background: var(--mediactive-gradient-fallback);*/
/*  background: var(--mediactive-gradient);*/
/*  background-clip: text;*/
/*  -webkit-background-clip: text;*/
/*  !*-webkit-text-fill-color: transparent;*!*/
/*}*/


:is(button, .button, .btn, .w-button, [type="submit"]) {
  background: var(--mediactive-gradient-fallback) !important;
  background: var(--mediactive-gradient) !important;
  border-color: transparent;
  color: var(--_primitives---colors--neutral-darkest, #0d0d0d);
  transition: background 0.3s ease, transform 0.2s ease;
}

:is(button, .button, .btn, .w-button, [type="submit"]):hover,
:is(button, .button, .btn, .w-button, [type="submit"]):focus,
:is(button, .button, .btn, .w-button, [type="submit"]):focus-visible {
  background: var(--mediactive-gradient-hover-fallback) !important;
  background: var(--mediactive-gradient-hover) !important;
  color: var(--_primitives---colors--neutral-darkest, #0d0d0d);
  /*transform: translateY(-1px);*/
  outline: none;
}

:is(button, .button, .btn, .w-button, [type="submit"]):disabled,
.w-button[aria-disabled="true"],
.button[aria-disabled="true"],
.btn[aria-disabled="true"] {
  background: var(--mediactive-gradient-fallback) !important;
  background: var(--mediactive-gradient) !important;
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
}

.button.is-secondary.is-alternate, .button.is-secondary.is-alternate:disabled, .button.is-secondary.is-alternate[aria-disabled="true"] {
  background: var(--_primitives---opacity--transparent) !important;
  color: var(--_primitives---colors--white) !important;
  border: 1px solid var(--_primitives---opacity--white-60) !important;
}

.button.is-secondary.is-alternate:where(:hover, :focus, :focus-visible) {
  background: var(--_primitives---opacity--white-10) !important;
  color: var(--_primitives---colors--white) !important;
  border: 1px solid var(--_primitives---colors--neutral-darkest) !important;
}
.green {
  color: var(--mediactive-gradient-fallback) !important;
}

.button.is-link.is-icon,
.button.is-link.is-icon:where(:hover, :focus, :focus-visible),
.button.is-link.is-icon:disabled,
.button.is-link.is-icon[aria-disabled="true"] {
  background: var(--_primitives---opacity--transparent) !important;
  color: var(--_primitives---colors--neutral-darkest) !important;
  /*border: 1px solid var(--_primitives---colors--neutral-darkest) !important;*/
}

.hero_slider-wrapper {
  position: relative;
  width: 100%;
  max-width: 1644px;
  margin: 0 auto;
  overflow: hidden;
  aspect-ratio: 3;
  /*background-image: url("/images/hero-slider-background_v2.png");*/
  /*background-size: contain;*/
  /*background-repeat: no-repeat;*/
  /*background-position: bottom center;*/
}

.hero-slider {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;

}

.hero-slider .slide {
  position: absolute;
  inset: 0;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;

  opacity: 0;
  transform: translateY(-100%); /* sort du haut */
  transition: transform 1s ease, opacity 0.8s ease;
}

.hero-slider .slide.is-active {
  opacity: 1;
  transform: translateY(0);
}

.hero-slider .slide:not(.is-active) {
  opacity: 0;
  transform: translateY(100%); /* sort vers le bas */
}






/* Conteneur principal du texte */
.portfolio16_content-top {
  position: relative; /* nécessaire pour positionner le dégradé par-dessus */
  max-height: 440px;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

/* Effet de dégradé en bas du texte */
.hide-end {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px; /* ajustable selon la douceur du fondu */
  pointer-events: none; /* pour ne pas gêner les clics */
  background: linear-gradient(to bottom, rgba(25,25,25,0) 0%, #191919 90%);
  transition: opacity 0.3s ease;
}


.portfolio16_actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 1rem;
}

.portfolio16_toggle-wrapper {
  display: flex;
}

.portfolio16_view-project {
  background: var(--mediactive-gradient);
  color: var(--_primitives---colors--neutral-darkest, #0d0d0d);
  text-decoration: none;
  padding: 6px 14px;
  border-radius: 10px;
  font-size: 16px;
  transition: background 0.3s ease;
}

.portfolio16_view-project:hover {
  background: var(--mediactive-gradient-hover);
}


.portfolio16_toggle {
  margin-left: auto;
}


.layout13_image-wrapper {
  position: relative;
}

.layout13_image-wrapper .image-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #000;
  color: #fff;
  padding: 0.75rem 1rem;
  font-size: clamp(0.75rem, 1.6vw, 1rem);
  line-height: 1.4;
}

.icon-1x1-medium.w-embed {
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-1x1-medium.w-embed .fa-light {
  font-size: 2rem;
  line-height: 1;
}
.portfolio16_item p {
  margin-bottom:15px;
}
@media screen and (max-width: 1023px) {
  .portfolio16_item-link {
    grid-row-gap: 2.5rem;
    grid-template-columns: 1fr;
  }
  .portfolio16_image-wrapper {
    aspect-ratio: 1.5;
  }
}

.testimonial1_component {
  position: relative;
  height: 376px;
}
/*.testimonial1_content {*/
/*  transition: opacity 0.6s ease, transform 0.6s ease;*/
/*  transform: translateX(0);*/
/*  opacity: 0;*/
/*}*/

/*.testimonial1_content[x-show="true"],*/
/*.testimonial1_content.is-active {*/
/*  opacity: 1;*/
/*  transform: translateX(0);*/
/*}*/


.go-to-top {
  position: fixed;
  bottom: 15px;
  right: 15px;
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  /* background: var(--mediactive-gradient-fallback) !important; */
  background: var(--mediactive-gradient) !important;
  color: var(--_primitives---colors--neutral-darkest, #0d0d0d);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
  text-decoration: none;
  transition: transform 0.2s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.go-to-top:hover,
.go-to-top:focus,
.go-to-top:focus-visible {
  background: var(--mediactive-gradient-hover-fallback) !important;
  background: var(--mediactive-gradient-hover) !important;
  transform: translateY(-0.2rem);
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.22);
}

.go-to-top i {
  font-size: 1.25rem;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .go-to-top {
    bottom: 1rem;
    right: 1rem;
    width: 2.75rem;
    height: 2.75rem;
  }
}

.logo1_logo {
  max-height: 3.5rem;
  max-width: 150px;
  filter: grayscale(100%) brightness(90%);
  /*opacity: 0.8!important;*/
}
.logo1_logo {
  opacity: 0;
  transform: translateY(30px);
  will-change: opacity, transform;
}
.logo1_logo:hover {
  filter: unset;
  opacity: 1!important;
}
.logo1_wrapper {
  position: relative;
  text-align: center;
}
.logo1_list {
  grid-column-gap: 4rem;
  grid-row-gap: 5rem;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding-top: .5rem;
  padding-bottom: .5rem;
  display: flex;
}

/* Bouton Voir plus / moins */
.logo1_toggle-wrapper {
  margin-top: 20px;
}
.logo1_toggle-btn {
  background: linear-gradient(to right, #64BC45, #C8D93B);
  border: none;
  color: #191919;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.3s ease;
}
.logo1_toggle-btn:hover {
  background: linear-gradient(to right, #C8D93B, #64BC45);
}
.logo1_toggle-btn {
  background: linear-gradient(to right, #64BC45, #C8D93B);
  border: none;
  color: #191919;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.3s ease;
}
.logo1_toggle-btn:hover {
  background: linear-gradient(to right, #C8D93B, #64BC45);
}
.logo1_wrapper .hide-end {
  display: none;
}
.hero-tampon {
  position: absolute;
  top: 25px;
  left: 21%;
  transform: translateX(-50%);
  width: 380px;
  z-index: 10;
  opacity: 0.95;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

@media screen and (max-width: 991px) {
  .hero-tampon {
    width: 200px;
    top: 15px;
    right: 15px;
  }
}

@media screen and (max-width: 767px) {
  .hero-tampon {
    width: 140px;
    top: 10px;
    right: 10px;
  }
}/* Conteneur du slider */
.layout13_image-wrapper {
  position: relative;
  width: 100%;
  max-width: 2000px;
  aspect-ratio: 1.15;
  overflow: hidden;
  margin: 0 auto;
}

/* Slides */
.layout13_image-wrapper .slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  clip-path: polygon(4% 0%, 100% 0%, 85% 100%, 0% 100%);
}

.layout13_image-wrapper .slide.is-active {
  opacity: 1;
  pointer-events: auto;
}


/* Caption fixe au-dessus du slider */
.layout13_image-wrapper .image-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  /* transform: translateX(-50%); */
  background-color: #191919;
  color: #fff;
  padding: 10px 20px;
  font-weight: 500;
  border-radius: 0;
  text-align: center;
  white-space: nowrap;
  z-index: 2;
}

/*.hero-rotating-word {*/
/*  display: inline-block;*/
/*  position: relative;*/
/*  overflow: hidden;*/
/*  height: 1em; !* garde la hauteur du texte *!*/
/*  width: 100%;*/
/*  vertical-align: bottom;*/
/*}*/
/*.hero-rotating-word {*/
/*  position: relative;*/
/*  display: inline-block;*/
/*  overflow: hidden;*/
/*  height: 1em;*/
/*  vertical-align: bottom;*/
/*  width: 100%;*/
/*}*/

/*.rotating-word {*/
/*  position: absolute;*/
/*  left: 0; right: 0; top: 0;*/
/*  display: inline-block;*/
/*  line-height: 1em;*/
/*  opacity: 0;*/
/*  transform: translateY(-100%);*/
/*  transition: transform .6s ease, opacity .4s ease;*/

/*  !* Dégradé texte sur l'élément mot (et non sur le parent) *!*/
/*  color: var(--mediactive-gradient-fallback);*/
/*  background: var(--mediactive-gradient-fallback);*/
/*  background: var(--mediactive-gradient);*/
/*  background-clip: text;*/
/*  -webkit-background-clip: text;*/
/*  color: transparent;*/
/*  -webkit-text-fill-color: transparent;*/

/*  will-change: transform, opacity; !* hint perf *!*/
/*}*/

/*.rotating-word.is-active {*/
/*  opacity: 1;*/
/*  transform: translateY(0);*/
/*}*/

/*.rotating-word:not(.is-active) {*/
/*  opacity: 0;*/
/*  transform: translateY(100%);*/
/*}*/

.hero-rotating-word {
  display: inline-block;
  position: relative;
  /* font-weight: 600; */
  overflow: hidden;
  vertical-align: bottom;
  margin-top: 15px;
  height: 95px;
}

/* Texte avec dégradé (Mediactive style) */
.hero-rotating-word .typed-text {
  background: var(--mediactive-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  left: 17px;
  position: relative;
}

/* Curseur qui clignote */
.hero-rotating-word .cursor {
  display: inline-block;
  color: var(--mediactive-gradient-fallback);
  animation: blink 0.8s infinite;
  font-weight: normal;
  margin-left: 2px;
  /*display: none;*/
}

@keyframes blink {
  0%, 50% { opacity: 1; }
  50.1%, 100% { opacity: 0; }
}
header {
  background-image: url(/images/hero-slider-background_v2-4k.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center 625px;
}
.gradient-top-border,.gradient-bottom-border {
  position: relative;
}

.gradient-top-border::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  height: 1px; /* épaisseur de la bordure */
  background: linear-gradient(
          to right,
          rgba(25,25,25,1) 0%,          /* fondu gauche dans le fond noir */
          rgba(100,188,69,1) 35%,       /* début du vrai dégradé vert */
          rgba(200,217,59,1) 65%,       /* fin du vrai dégradé vert-jaune */
          rgba(25,25,25,1) 100%         /* fondu droite dans le fond noir */
  );
  pointer-events: none;
}
.gradient-bottom-border::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1px; /* épaisseur de la bordure */
  background: linear-gradient(
          to right,
          rgba(25,25,25,1) 0%,          /* fondu gauche dans le fond noir */
          rgba(100,188,69,1) 35%,       /* début du vrai dégradé vert */
          rgba(200,217,59,1) 65%,       /* fin du vrai dégradé vert-jaune */
          rgba(25,25,25,1) 100%         /* fondu droite dans le fond noir */
  );
  pointer-events: none;
}
/* Appliquer le dégradé animé aux icônes Font Awesome */
.services-section i.fa-light {
  display: inline-block;
  font-size: 48px; /* adapte selon ton design */
  background: linear-gradient(to right, #64BC45, #C8D93B);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: gradientFlow 4s ease-in-out infinite;
  background-size: 200% auto;
}
.portfolio16_view-project {
  background: linear-gradient(to right, #64BC45, #C8D93B);
  animation: gradientFlow 4s ease-in-out infinite;
  background-size: 200% auto;
}
.services-section i.fa-light:hover {
  animation: gradientFlow 1.5s linear infinite;
  transform: scale(1.1);
  transition: transform 0.9s ease;
}
/*h2 {*/
/*  display: inline-block;*/
/*  !*font-size: 48px;*!*/
/*  background: linear-gradient(to right, #FFFFFF, #64BC45);*/
/*  background-clip: text;*/
/*  -webkit-background-clip: text;*/
/*  color: transparent;*/
/*  -webkit-text-fill-color: transparent;*/
/*  animation: gradientFlow 4s ease-in-out infinite;*/
/*  background-size: 200% auto;*/
/*}*/

/* Animation du dégradé : va de gauche à droite, puis droite à gauche */
@keyframes gradientFlow {
  0% {
    background-position: 0% center;
  }
  50% {
    background-position: 100% center;
  }
  100% {
    background-position: 0% center;
  }
}
footer .footer2_logo {
  max-width: 100px;
}
.gs_reveal {
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity;
}
button.hero-nav {
  position: absolute;
  top: 30px;
  background: none!important;
  color: var(--mediactive-gradient-fallback);
  font-size: 50px;
  display: none;
}
button.hero-nav:disabled {
  background: none!important;
}
button.hero-nav:hover {
  background: none!important;
  color: var(--_primitives---colors--apple-light)!important;
}
button.hero-prev {
  left: 0;
}
button.hero-next {
  right: 0;
}
button.hero-nav i {
  width: unset!important;
}



.navbar8_menu-list {
  display: flex;
  align-items: center;
  gap: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.navbar8_menu-list .nav-link {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s ease, opacity 0.3s ease;
  opacity: 0.8;
}

.navbar8_menu-list .nav-link:hover, .navbar8_menu-list .nav-link:focus {
  color: var(--_primitives---colors--apple);
  opacity: 1;
}

/* ? Lien actif (section visible) */
.navbar8_menu-list .nav-link.active {
  color: var(--_primitives---colors--apple);
  font-weight: 600;
  opacity: 1;
  position: relative;
}

/*.navbar8_menu-list .nav-link.active::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  bottom: -4px;*/
/*  left: 0;*/
/*  width: 100%;*/
/*  height: 2px;*/
/*  background: linear-gradient(to right, #64BC45, #C8D93B);*/
/*  border-radius: 1px;*/
/*}*/

/*.section-anchor {*/
/*  height: 0px;*/
/*  !*background-color: var(--_primitives---colors--apple);*!*/
/*  width: 0px;*/
/*  position: relative;*/
/*  top: -51px;*/
/*  !*scroll-margin-top: 50px;*!*/
/*}*/
/* Offset automatique au scroll pour toutes les ancres (sections + div[id]) */
section[id] {
  scroll-margin-top: 51px!important;
}
.contact5_contact-list a {
  /*color: var(--_primitives---colors--apple)!important;*/
}
/* ========== NAVBAR BASE ========== */
.navbar8_component {
  position: sticky;
  top: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  opacity: 0;             /* ? invisible au départ */
  visibility: hidden;     /* ? retirée du flux visuel */
}

/* ========== HAMBURGER ========== */
.navbar8_toggle {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 26px;
  height: 18px;
  background: transparent!important;
  border: none;
  cursor: pointer;
  padding: 0;
  z-index: 10000;
}
.navbar8_toggle:hover,.navbar8_toggle:focus {
  background: transparent!important;
}

.navbar8_toggle span {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 2px;
  transition: all 0.3s ease;
   background: var(--mediactive-gradient-fallback) !important;
  background: var(--mediactive-gradient) !important;
}

/* État actif (croix) */
.navbar8_toggle.is-active span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}
.navbar8_toggle.is-active span:nth-child(2) {
  opacity: 0;
}
.navbar8_toggle.is-active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

/* ========== MENU MOBILE ========== */
@media (max-width: 960px) {
  .navbar8_toggle {
    display: flex;
  }

  .navbar8_menu {
    position: fixed;
    top: 0;
    right: 0;
    height: 80vh;
    width: 50%;
    max-width: 340px;
    background-color: rgba(0, 0, 0, 0.95);
    backdrop-filter: blur(8px);
    padding: 80px 30px;
    transform: translateX(100%);
    transition: transform 0.35s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
  }

  .navbar8_menu.is-open {
    transform: translateX(0);
    border-left: var(--mediactive-gradient-fallback) 2px solid;
    border-bottom: var(--mediactive-gradient-fallback) 4px solid;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
  }

  .navbar8_menu-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items: flex-start;
  }

  .navbar8_menu-list .nav-link {
    color: #fff;
    font-size: 18px;
  }

  .navbar8_menu-right {
    margin-top: 2rem;
    width: 100%;
  }

  .navbar8_menu-right .button {
    width: 100%;
    text-align: center;
  }
}

/* ========== MENU DESKTOP (inchangé) ========== */
@media (min-width: 961px) {
  .navbar8_menu {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    position: static;
    height: auto;
    width: auto;
    background: none;
    transform: none;
    padding: 0;
  }
}
div#sentMessage {
  font-size: 20px;
}
#sentMessage i {
  font-size: 50px;
  background: linear-gradient(to right, #64BC45, #C8D93B);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  line-height: 120px;
  font-weight: 100;
  opacity: 1;
  transition: opacity 0.8s ease; /* effet fade */
  pointer-events: none; /* évite les clics */
}
div#sentMessage .button {
  display: inline-block;
}
.contact-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  /*font-weight: 600;*/
  transition: all 0.3s ease;
}

.contact-submit i {
  font-size: 1.1em;
  transition: transform 0.3s ease, color 0.3s ease;
}

/* Effet de survol ? le plane décolle un peu */
.contact-submit:hover i {
  transform: translateX(4px) translateY(-2px) rotate(-10deg);
  /*color: var(--_primitives---colors--apple-dark, #64BC45);*/
}

/* Si tu veux le gradient Mediactive sur le texte */
.contact-submit span {
  /*background: var(--mediactive-gradient);*/
  /*-webkit-background-clip: text;*/
  /*-webkit-text-fill-color: transparent;*/
}