/* ==========================================================================
   DAUMUS - NETLIFY STYLE.CSS
   Animations / Navbar / Dropdowns / Buttons / Video
   ========================================================================== */

/* ---------- Load Animation ---------- */

[animation="load"] {
  opacity: 0;
  transform: translateY(2rem);
  will-change: transform, opacity, filter;
}

/* ---------- Scroll Animations ---------- */

[animation="loading"],
[animation="loading-split"],
[animation="fade"],
[animation="fade-split"],
[animation="fade-text-stagger"],
[animation="fade-item"],
[animation="fade-stagger"] > *,
[animation="loading-stagger"] > * {
  opacity: 0;
  transform: translateY(2rem);
  will-change: transform, opacity;
  transition:
    opacity .8s ease,
    transform .8s ease;
}

[animation].is-visible,
[animation="fade-stagger"] > *.is-visible,
[animation="loading-stagger"] > *.is-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

[animation="loading-split"].is-loading-lcp,
[animation="loading-split"][data-loading-lcp],
[data-loading-lcp] [animation="loading-split"] {
  opacity: 1;
  transform: none;
}

@media screen and (max-width: 991px) {
  [animation="loading"],
  [animation="loading-split"],
  [animation="loading-stagger"] > * {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ---------- Navbar ---------- */

.navbar {
  position: relative;
  z-index: 1000;
}

.navbar-menu-trigger {
  cursor: pointer;
  position: relative;
  z-index: 1002;
}

.navbar--menu-open,
.navbar--menu-close {
  transition:
    opacity .25s ease,
    transform .25s ease;
}

.navbar--menu-close {
  opacity: 0;
  transform: rotate(-45deg) scale(.9);
  position: absolute;
  inset: 0;
  pointer-events: none;
}

html.nav-open .navbar--menu-open {
  opacity: 0;
  transform: rotate(45deg) scale(.9);
  pointer-events: none;
}

html.nav-open .navbar--menu-close {
  opacity: 1;
  transform: rotate(0deg) scale(1);
  pointer-events: auto;
}

/* ---------- Navbar Links Hover ---------- */

.nav--link,
.nav--type-link,
.nav--dropdown-trigger {
  position: relative;
  transition:
    color .45s cubic-bezier(.22, 1, .36, 1),
    transform .45s cubic-bezier(.22, 1, .36, 1);
}

.nav--link::after,
.nav--type-link::after,
.nav--dropdown-trigger::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.25rem;

  width: 100%;
  height: 1px;

  background: currentColor;

  transform: scaleX(0);
  transform-origin: right;

  transition: transform .6s cubic-bezier(.22, 1, .36, 1);
}

.nav--link:hover,
.nav--type-link:hover,
.nav--dropdown-trigger:hover {
  transform: translateY(-.125rem);
}

.nav--link:hover::after,
.nav--type-link:hover::after,
.nav--dropdown-trigger:hover::after,
.nav--link:focus-visible::after,
.nav--type-link:focus-visible::after,
.nav--dropdown-trigger:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left;
}

.nav--link:focus-visible,
.nav--type-link:focus-visible,
.nav--dropdown-trigger:focus-visible {
  outline: none;
}

/* ---------- Dropdown base ---------- */

.nav--dropdown {
  position: relative;
}

.nav--dropdown-trigger {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .5rem;
}

.nav--drop-arrow {
  transition: transform .3s ease;
  transform-origin: center;
}

/* ---------- Desktop dropdown ---------- */

@media screen and (min-width: 992px) {
  .nav--dropdown-list {
    display: flex !important;
    position: absolute;
    top: 100%;
    left: 0;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(.75rem);

    transition:
      opacity .25s ease,
      transform .25s ease,
      visibility .25s ease;

    z-index: 9999;
  }

  .nav--dropdown:hover > .nav--dropdown-list,
  .nav--dropdown.is-open > .nav--dropdown-list {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  .nav--dropdown:hover .nav--drop-arrow,
  .nav--dropdown.is-open .nav--drop-arrow {
    transform: rotate(180deg);
  }
}

/* ---------- Tablet / Mobile navbar ---------- */

@media screen and (max-width: 991px) {
  html.nav-open,
  html.nav-open body {
    overflow: hidden;
    height: 100%;
    overscroll-behavior: none;
  }

  body {
    padding-top: var(--navbar-height-mobile, 0px);
  }

  .navbar {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;

    width: 100%;
    z-index: 1000;
  }

  .navbar--top {
    transition:
      opacity .3s ease,
      transform .3s ease,
      visibility .3s ease,
      height .3s ease,
      padding .3s ease,
      margin .3s ease;
  }

  html.nav-open .navbar--top {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);

    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;

    overflow: hidden;
    pointer-events: none;
  }

  .navbar--menu {
    display: flex !important;
    position: fixed !important;

    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;

    width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;

    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;

    z-index: 1001 !important;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(-1rem);

    transition:
      opacity .3s ease,
      transform .3s ease,
      visibility .3s ease;
  }

  @supports not (height: 100dvh) {
    .navbar--menu {
      height: 100vh !important;
      max-height: 100vh !important;
    }
  }

  html.nav-open .navbar--menu,
  .navbar--menu.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  .nav--dropdown-list {
    display: flex !important;
    position: static !important;

    height: 0;
    overflow: hidden;

    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: none !important;

    transition: height .3s ease;
  }

  .nav--dropdown.is-open > .nav--dropdown-list {
    height: auto;
  }

  .nav--dropdown.is-open .nav--drop-arrow {
    transform: rotate(180deg);
  }
}

/* ---------- Buttons ---------- */

.button {
  position: relative;
  overflow: hidden;
  isolation: isolate;

  transition:
    color .45s ease,
    transform .35s ease;
}

.button > div:not(.button-bg) {
  position: relative;
  z-index: 2;
}

.button-bg {
  position: absolute;
  inset: 0;

  z-index: 1;
  pointer-events: none;

  transform: scaleX(0);
  transform-origin: left center;

  transition:
    transform .85s cubic-bezier(.22, 1, .36, 1);

  will-change: transform;
}

.button:hover .button-bg,
.button.is-hover .button-bg,
.button:focus-visible .button-bg {
  transform: scaleX(1);
}

.button:hover,
.button:focus-visible {
  transform: translateY(-1px);
}

/* ---------- Video Play ---------- */

.video--play {
  position: absolute;
  inset: 0;
  margin: auto;

  width: 5rem;
  height: 5rem;

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

  border-radius: 50%;

  background: #EC7B13;
  color: #fff;

  z-index: 10;
}

.video--play svg {
  width: 1.5rem;
  height: 1.5rem;

  position: relative;
  z-index: 2;
}

.video--play::before,
.video--play::after {
  content: "";

  position: absolute;
  inset: -.75rem;

  border-radius: 50%;

  background: rgba(236, 123, 19, .4);

  pointer-events: none;
  z-index: -1;
}

.video--play::before {
  animation: daumus-pulse-bg 1.8s ease-out infinite;
}

.video--play::after {
  animation: daumus-pulse-bg 1.8s ease-out .9s infinite;
}

@keyframes daumus-pulse-bg {
  0% {
    transform: scale(1);
    opacity: 0;
  }

  15% {
    opacity: .7;
  }

  100% {
    transform: scale(1.7);
    opacity: 0;
  }
}

@media screen and (max-width: 991px) {
  .video--play {
    position: relative;
    inset: auto;
    margin: 0 auto;
  }
}

/* ---------- Footer Links Hover ---------- */

.footer--link,
.contact--link,
.social--link {
  position: relative;
  transition:
    color .45s cubic-bezier(.22, 1, .36, 1),
    opacity .45s cubic-bezier(.22, 1, .36, 1),
    transform .45s cubic-bezier(.22, 1, .36, 1);
}

.footer--link::after,
.contact--link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.2rem;

  width: 100%;
  height: 1px;

  background: currentColor;

  transform: scaleX(0);
  transform-origin: right;

  transition: transform .6s cubic-bezier(.22, 1, .36, 1);
}

.footer--link:hover,
.contact--link:hover,
.social--link:hover {
  opacity: .75;
  transform: translateY(-.125rem);
}

.footer--link:hover::after,
.contact--link:hover::after,
.footer--link:focus-visible::after,
.contact--link:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left;
}

.footer--link:focus-visible,
.contact--link:focus-visible,
.social--link:focus-visible {
  outline: none;
}

.social--link svg {
  transition:
    transform .55s cubic-bezier(.22, 1, .36, 1);
}

.social--link:hover svg,
.social--link:focus-visible svg {
  transform: rotate(-6deg) scale(1.08);
}

.flex--wrap .footer--link {
  display: inline-flex;
  vertical-align: baseline;
}

@media screen and (max-width: 767px) {
  .footer--link:hover,
  .contact--link:hover,
  .social--link:hover {
    transform: none;
  }
}

/* ---------- FoLinks Rod Hover ---------- */



.rod--orange{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: #D9732F;

  transform: scaleX(0);
  transform-origin: left center;
  pointer-events: none;
}



/* ==========================================================================
   FIL D’ARIANE
========================================================================== */

.arianne--wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.arianne--wrapper .icon--8 {
  flex: 0 0 auto;
  width: 0.5rem;
  height: 0.5rem;
}

.link--arianne {
  display: inline-block;
}

.link--arianne.is--current {
  font-weight: 600;
  pointer-events: none;
}


/* ==========================================================================
   LANGUAGE VISIBILITY — FR / NL
========================================================================== */

/* Éléments masqués par le JavaScript */
body .is--language-hidden {
  display: none !important;
}

html.is--language-fr body [lang="nl"],
html.is--language-fr body [lang^="nl-"],
html.is--language-nl body [lang="fr"],
html.is--language-nl body [lang^="fr-"] {
  display: none !important;
}

html.wf-design-mode body [lang="fr"],
html.wf-design-mode body [lang^="fr-"],
html.wf-design-mode body [lang="nl"],
html.wf-design-mode body [lang^="nl-"] {
  display: revert !important;
}

/* ==========================================================================
   WEBFLOW LOCALIZATION DROPDOWN
========================================================================== */

.localization--wrapper {
  position: relative;
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  cursor: pointer;
  user-select: none;
}

/* Liste Webflow Localization */
.localization--wrapper .w-locales-items {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

/* Toutes les langues masquées par défaut */
.localization--wrapper .w-locales-item {
  display: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

/* Langue actuelle */
.localization--wrapper
  .w-locales-item.is--current-language {
  display: block;
}

.localization--wrapper .w-locales-item a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
}

/* Bouton de langue actuelle */
.localization--wrapper
  .w-locales-item.is--current-language
  a {
  min-height: 2rem;
  padding: 0;
  pointer-events: none;
}

/* ==========================================================================
   DROPDOWN
========================================================================== */

.localization--wrapper.is--open
  .w-locales-item:not(.is--current-language) {
  position: absolute;
  top: calc(100% + 0.375rem);
  left: 50%;
  z-index: 20;
  display: block;
  min-width: 3.25rem;
  padding: 0;
  overflow: hidden;
  background-color: #212121;
  transform: translateX(-50%);
}

/* Zone invisible entre le bouton et le menu */
.localization--wrapper.is--open
  .w-locales-item:not(.is--current-language)::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 0.375rem;
}

/* Lien de la langue secondaire */
.localization--wrapper
  .w-locales-item:not(.is--current-language)
  a {
  min-width: 3.25rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem;
  color: #ffffff;
  background-color: #212121;
  transition: none;
}

/* Aucun changement au hover */
.localization--wrapper
  .w-locales-item:not(.is--current-language)
  a:hover,
.localization--wrapper
  .w-locales-item:not(.is--current-language)
  a:focus-visible {
  color: #ffffff;
  background-color: #212121;
}

/* ==========================================================================
   ARROW
========================================================================== */

.localization--arrow {
  width: 0.75rem;
  height: 0.75rem;
  flex: none;
  pointer-events: none;
  transform: rotate(0deg);
  transform-origin: center;
  transition: transform 0.3s ease;
}

.localization--wrapper.is--open
  .localization--arrow {
  transform: rotate(180deg);
}

/* ==========================================================================
   ACCESSIBILITY
========================================================================== */

.localization--wrapper:focus-visible {
  outline: 0.125rem solid currentColor;
  outline-offset: 0.25rem;
}


/* ==========================================================================
   MOBILE / TABLET — MENU PARTICULIER / PROFESSIONNEL
========================================================================== */

@media screen and (max-width: 991px) {
  .navbar--menu.is--professional,
  .navbar--menu.is--particulier {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .navbar--menu.is--professional.is-open,
  .navbar--menu.is--particulier.is-open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}
/* ==========================================================================
   BACK TO TOP
   Bouton de retour en haut de page
========================================================================== */

.back--top {
  display: flex !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(0.75rem);

  transition:
    opacity 0.35s ease,
    visibility 0.35s ease,
    transform 0.35s ease;
}

.back--top.is--visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}