/* MEDIA QUERIES */

@media not all and (min-width: 1537px) {}

@media not all and (min-width: 1281px) {
  :root {
    --wp--custom--wrapper--padding: 80px !important;
    --wp--custom--wrapper--gap: 80px !important;
    --wp--custom--wrapper--gap-2: 80px !important;
    --wp--preset--font-size--64: 56px !important;
    --wp--preset--font-size--52: 40px !important;
    --wp--preset--font-size--40: 36px !important;
    --wp--preset--font-size--28: 24px !important;
  }
}

@media not all and (min-width: 1025px) {
  :root {
    --wp--custom--wrapper--padding: 60px !important;
    --wp--custom--wrapper--gap: 60px !important;
    --wp--custom--wrapper--gap-2: 60px !important;
    --wp--preset--font-size--80: 60px !important;
    --wp--preset--font-size--64: 48px !important;
    --wp--preset--font-size--40: 28px !important;
    --wp--preset--font-size--24: 20px !important;
    --wp--preset--font-size--20: 18px !important;
  }

  .nav-menu-mobile {
    top: 96px !important;
  }

  h1 {
    animation: none !important;
  }

  .atag-card-link {
    min-height: auto !important;
  }

  .card-link-top,
  .card-link-bottom {
    min-height: 131px !important;
  }

  .img-modale {
    object-fit: contain !important;
  }
}

@media not all and (min-width: 769px) {
  :root {
    --wp--custom--wrapper--padding: 40px !important;
    --wp--custom--wrapper--gap: 40px !important;
    --wp--custom--wrapper--gap-2: 40px !important;
    --wp--preset--font-size--64: 40px !important;
    --wp--preset--font-size--52: 28px !important;
    --wp--preset--font-size--44: 24px !important;
    --wp--preset--font-size--32: 24px !important;
  }
}

@media not all and (min-width: 641px) {
  :root {
    --wp--custom--wrapper--padding: 20px !important;
    --wp--preset--font-size--64: 32px !important;
    --wp--preset--font-size--28: 20px !important;
  }

  .div-top-header-mobile .menu-item-46 {
    display: block !important;
  }

  .nav-menu-mobile {
    top: 80px !important;
  }

  .ul-mobile {
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: start !important;
    padding-top: 8px !important;
  }

  .div-top-header-mobile {
    order: 99 !important;
  }

  .header-tablet {
    gap: 0 !important;
  }

  .icon-sound {
    width: 28px !important;
    height: 28px !important;
  }

  .atag-card-link:has(> .card-link-left),
  .atag-card-link:has(> .card-link-right) {
    width: 100% !important;
  }

}

@media not all and (min-width: 391px) {}

/* GENERAL */

html {
  scroll-behavior: smooth;
}

p:empty {
  display: none;
}

:root {
  --color-black: var(--wp--preset--color--custom-black);
  --color-white: var(--wp--preset--color--custom-white);
  --color-yellow: var(--wp--preset--color--custom-yellow);
  --color-blue: var(--wp--preset--color--custom-blue);
  --color-yellow-btn: #B8A106;
  --custom-padding: var(--wp--custom--wrapper--padding);
  --custom-gap: var(--wp--custom--wrapper--gap);
  --custom-gap2: var(--wp--custom--wrapper--gap-2);
}

h1 {
  animation: fadeUp 0.8s ease-out forwards;
}

@keyframes fadeUp {
  0% {
    transform: translateY(30%);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

/* HEADER */

.div-header {
  transition: background 0.3s ease-out, box-shadow 0.3s ease-out;
}

html[data-scroll="0"] .div-header {
  background: rgba(0, 0, 0, 0);
  -webkit-box-shadow: 0px 5px 15px 5px rgba(255, 255, 255, 0);
  box-shadow: 0px 5px 15px 5px rgba(255, 255, 255, 0);
}

html:not([data-scroll="0"]) .div-header {
  background: var(--color-black);
  -webkit-box-shadow: 0px 5px 15px 5px rgba(255, 255, 255, 0.1);
  box-shadow: 0px 5px 15px 5px rgba(255, 255, 255, 0.1);
}

.logo-header {
  fill: var(--color-white);
  transition: fill 0.3s ease-out;
}

.logo-header:hover {
  fill: var(--color-blue);
}

.ul-desktop {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.div-top-header-desktop,
.div-bottom-header-desktop {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 32px;
}

.div-top-header-desktop .menu-item a,
.div-bottom-header-desktop .menu-item:not(.menu-item-46) a {
  font-size: 18px;
  font-weight: 600;
}

.menu-item:not(.menu-item-46 a) a {
  position: relative;
  padding: 8px;
}

.menu-item:not(.menu-item-46) a,
.div-bottom-header-mobile .menu-item-46 a {
  color: var(--color-white);
  transition: color 0.3s ease-out;
}

.menu-item:not(.menu-item-46):hover a,
.current-menu-item:not(.menu-item-46) a,
.div-bottom-header-mobile .menu-item-46:hover a {
  color: var(--color-blue);
}

.div-top-header-desktop .menu-item a,
.div-top-header-mobile .menu-item a {
  text-transform: uppercase;
}

.menu-item a::before,
.menu-item:not(.menu-item-46) a::before,
.menu-item a::after,
.menu-item:not(.menu-item-46) a::after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  transition: width 0.2s ease-out, height 0.2s ease-out;
}

.menu-item-46 a::before,
.menu-item-46 a::after {
  width: 0px !important;
  height: 0px !important;
}

.menu-item a:hover::before,
.menu-item:hover:not(.menu-item-46) a::before,
.menu-item a:hover::after,
.menu-item:not(.menu-item-46) a:hover::after,
.current-menu-item a::before,
.current-menu-item:not(.menu-item-46) a::before,
.current-menu-item a::after,
.current-menu-item:not(.menu-item-46) a::after {
  width: 25px;
  height: 9px;
}

.menu-item a::before,
.menu-item:not(.menu-item-46) a::before {
  top: 0;
  left: 0;
  background: url(/wp-content/uploads/2025/08/line-menu-top.svg);
  background-repeat: no-repeat;
}

.menu-item a::after,
.menu-item:not(.menu-item-46) a::after {
  bottom: 0;
  right: 0;
  background: url(/wp-content/uploads/2025/08/line-menu-bottom.svg);
  background-repeat: no-repeat;
}

.icon-burger .burger-shape {
  aspect-ratio: 1;
  border-radius: 4px;
  background: rgba(255, 251, 244, 0.3);
  border-color: var(--color-white);
  transition: border-color 0.3s ease-out, border-radius 0.4s ease-out;
}

.icon-burger.active .burger-shape {
  border-radius: 100%;
  transition: border-color 0.3s ease-out, border-radius 0.4s ease-out 0.3s;
}

.icon-burger:hover .burger-shape {
  border-color: var(--color-blue);
}

.icon-burger .burger-shape div {
  background: var(--color-white);
  transform: rotate(0deg) translateX(0) translateY(0);
  transition: background 0.3s ease-out, transform 0.3s ease-out 0.3s, opacity 0.3s ease-out 0.3s;
}

.icon-burger.active .burger-shape div {
  transition: background 0.3s ease-out, transform 0.3s ease-out, opacity 0.3s ease-out;
}

.icon-burger.active .burger-shape div:nth-child(1) {
  transform: rotate(45deg) translateX(7px) translateY(7px);
}

.icon-burger.active .burger-shape div:nth-child(2) {
  opacity: 0;
}

.icon-burger.active .burger-shape div:nth-child(3) {
  transform: rotate(-45deg) translateX(7px) translateY(-7px);
}

.icon-burger:hover .burger-shape div {
  background: var(--color-blue);
}

.icon-burger .burger-text {
  color: var(--color-white);
  transition: color 0.3s ease-out;
}

.icon-burger:hover .burger-text {
  color: var(--color-blue);
}

/* MENU MOBILE */

.nav-menu-mobile {
  position: fixed;
  z-index: 2;
  top: 104px;
  right: 0;
  left: 0;
  width: 100vw;
  height: 100dvh;
  opacity: 0;
  pointer-events: none;
  transition: height 0.3s ease-out, opacity 0.4s ease-out;
}

.menu-closed {
  opacity: 0;
  pointer-events: none;
}

.menu-opened {
  opacity: 1;
  pointer-events: auto;
}

.ul-mobile {
  display: flex;
  gap: 20px;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: space-between;
  scrollbar-width: thin;
  scrollbar-color: var(--color-yellow) var(--color-black);
  padding-right: 10px;
}

.div-top-header-mobile .menu-item-46 {
  display: none;
  order: 99;
}

.nav-menu-mobile .menu-item a {
  font-size: var(--wp--preset--font-size--32);
}

.div-bottom-header-mobile,
.div-top-header-mobile {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ul-mobile::-webkit-scrollbar {
  display: block;
  width: 4px;
  height: 10px;
}

.ul-mobile::-webkit-scrollbar-track {
  background: var(--color-yellow-btn) !important;
  border-radius: 10px;
}

.ul-mobile::-webkit-scrollbar-thumb {
  background: var(--color-black) !important;
  border-radius: 10px;
}


/* CUSTOM BTN */

.custom-btn-1,
.menu-item-46 a,
.custom-btn-2,
.btn-envoi-form {
  display: block;
  font-size: 18px !important;
  font-weight: 500 !important;
  padding: 12px 32px !important;
  width: fit-content;
  border-radius: 360px;
  transition: background 0.3s ease-out, color 0.3s ease-out;
}

.custom-btn-1,
.menu-item-46 a,
.btn-envoi-form {
  color: var(--color-black);
  background: var(--color-yellow);
}

.custom-btn-1:hover,
.menu-item-46 a:hover,
.btn-envoi-form:hover {
  color: var(--color-white);
  background: var(--color-yellow-btn);
}

.custom-btn-2 {
  color: var(--color-black);
  background: rgba(0, 0, 0, 0);
  border: solid 1px;
  border-color: var(--color-black);
}

.custom-btn-2:hover {
  color: var(--color-white);
  background: var(--color-black);
}

/* FOOTER */

.logo-footer {
  fill: var(--color-black);
  transition: fill 0.3s ease-out;
}

.logo-footer:hover {
  fill: var(--color-yellow);
}

.link-footer,
.link-footer p {
  color: var(--color-black);
  transition: color 0.3s ease-out;
}

.link-footer:hover,
.link-footer:hover p {
  color: var(--color-blue);
}

/* HERO */

.conteneur-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.video-hero {
  position: absolute;
  aspect-ratio: 16/9;
  left: 50% !important;
  top: 50% !important;
  transform: translatex(-50%) translateY(-50%) !important;
  width: auto !important;
  height: auto !important;
  min-width: 113% !important;
  min-height: 100% !important;
}

.img-hero {
  position: absolute;
  aspect-ratio: 16/9;
  left: 50% !important;
  top: 50% !important;
  transform: translatex(-50%) translateY(-50%) !important;
  width: auto !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
}

.conteneur-video::after {
  position: absolute;
  content: '';
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(7, 51, 74, 0.40);
}

.icon-sound {
  width: 48px;
  height: 48px;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.icon-sound svg {
  fill: var(--color-white);
  stroke: var(--color-white);
  transition: fill 0.3s ease-out, stroke 0.3s ease-out
}

.icon-sound:hover svg {
  fill: var(--color-blue);
  stroke: var(--color-blue);
}

/* MISCELANEOUS */

.link-logo {
  transform: scale(1);
  transition: transform 0.3s ease-out;
}

.link-logo:hover {
  transform: scale(1.05);
}

h2:not(.no-style, .netdev-mentions-legales) {
  position: relative;
  padding: 20px;
}

h2:not(.no-style, .netdev-mentions-legales h2)::before,
h2:not(.no-style, .netdev-mentions-legales h2)::after {
  position: absolute;
  content: '';
}

h2::before,
h2::after {
  width: 0px;
  height: 0px;
  transition: width 0.5s ease-out 0.3s, height 0.5s ease-out 0.3s;
}

h2::before {
  top: 0;
  left: 0;
  background: url(/wp-content/uploads/2025/08/Vector.svg);
}

h2::after {
  bottom: 0;
  right: 0;
  background: url(/wp-content/uploads/2025/08/Vector-1.svg);
}

h2.visible::before,
h2.visible::after {
  width: 109px;
  height: 40px;
}

/* CARD LINK */

.img-circle {
  clip-path: circle(50% at 50% 50%);
}

.card-link-top {
  background: var(--color-yellow);
}

.card-link-bottom {
  background: var(--color-blue);
}

.card-link-top p {
  color: var(--color-black);
  transition: color 0.3s ease-out;
}

.card-link-bottom p {
  color: var(--color-white);
}

.card-link {
  transition: background 0.3s ease-out;
}

.card-link:hover {
  background: var(--color-black);
}

.card-link:hover p {
  color: var(--color-white);
}

.atag-card-link:has(> .card-link-top),
.atag-card-link:has(> .card-link-bottom) {
  height: 50%;
  min-height: 170px;
  width: 100%;
}

.atag-card-link:has(> .card-link-left),
.atag-card-link:has(> .card-link-right) {
  width: 50%;
}

.bg-card-link::after {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-black);
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.atag-card-link:hover .bg-card-link::after {
  opacity: 1;
}

/* CUSTOM COLLAPSE */

.custom-collapse {
  width: 100%;
}

.custom-collapse .collapse-title {
  padding: 8px 20px 8px 20px;
  color: var(--color-white);
  font-size: var(--wp--preset--font-size--20);
  font-weight: 600;
  background: var(--color-black);
  border-radius: 8px;
  width: 100%;
  border: solid 1px var(--color-black);
  cursor: pointer;
  transition: background 0.3s ease-out, color 0.3s ease-out;
}

.custom-collapse.opened .collapse-title {
  background: var(--color-white);
  color: var(--color-black);
}

.custom-collapse .collapse-content {
  pointer-events: none;
  padding: 10px 20px 10px 20px;
  padding-inline: 20px;
  padding-top: 0px;
  padding-bottom: 0px;
  height: 100%;
  max-height: 0px;
  opacity: 0;
  transition: max-height 0.4s linear, opacity 0.3s linear, padding-top 0.3s linear, padding-bottom 0.3s linear;
}

.custom-collapse.opened .collapse-content {
  max-height: 1000px;
  height: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  opacity: 1;
  transition: max-height 0.4s linear, opacity 0.5s linear 0.2s, padding-top 0.3s linear, padding-bottom 0.3s linear;
}

/* GALLERY */

@keyframes fadeInProjects {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeUpGallery {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.modale-image {
  transition: height 0.3s ease-out;
}

.container-div-img {
  width: 100%;
  height: calc(100% - 48px);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.div-img-modale {
  border-radius: 6px;
  overflow: hidden;
  height: 100%;
}

.img-modale {
  height: 100%;
  object-fit: cover;
}

.img-modale-press {
  height: 100%;
  object-fit: contain;
}

.icon-fermer-modale svg {
  stroke: var(--color-white);
  transition: stroke 0.3s ease-out;
}

.icon-fermer-modale:hover svg {
  stroke: var(--color-blue);
}

.next-prev-gallery svg {
  stroke: var(--color-black);
  transition: stroke 0.3s ease-out;
}

.next-prev-gallery:hover svg {
  stroke: var(--color-white);
}

.filter-gallery {
  padding: 12px 24px;
  border: solid 1px;
  border-color: var(--color-black);
  border-radius: 360px;
  background: rgba(0, 0, 0, 0);
  transition: border-color 0.2s ease-out, background 0.3s ease-out;
}

.filter-gallery p {
  font-family: var(--wp--preset--font-family--maven-pro);
  font-size: var(--wp--preset--font-size--18);
  font-weight: 500 !important;

}

.filter-gallery.active,
.filter-gallery:hover {
  background: var(--color-yellow);
  border-color: var(--color-yellow);
}

.filter-gallery.active {
  pointer-events: none !important;
}

.overlay-loading {
  display: none;
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(2px);
}

.overlay-loading.active {
  display: flex;
  justify-content: center;
  align-items: center;
}

.loader {
  width: 60px;
  aspect-ratio: 2;
  --_g: no-repeat radial-gradient(circle closest-side, var(--color-black) 90%, #0000);
  background:
    var(--_g) 0% 50%,
    var(--_g) 50% 50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: l3 1s infinite linear;
}

@keyframes l3 {
  20% {
    background-position: 0% 0%, 50% 50%, 100% 50%
  }

  40% {
    background-position: 0% 100%, 50% 0%, 100% 50%
  }

  60% {
    background-position: 0% 50%, 50% 100%, 100% 0%
  }

  80% {
    background-position: 0% 50%, 50% 50%, 100% 100%
  }
}

/* ACTUALITES */

.img-thumb::before {
  position: absolute;
  content: '';
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(205deg, rgba(7, 51, 74, 0.00) 33.78%, rgba(7, 51, 74, 0.80) 87.1%);
}

.card-article .img-thumb::after {
  position: absolute;
  content: '';
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(7, 51, 74, 1);
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.card-article:hover .img-thumb::after {
  opacity: 1;
}

/* SLIDER INFINITE */

@keyframes animateSliderInfinite {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

.animate-slider-infinite {
  animation: animateSliderInfinite linear infinite;
  animation-duration: var(--duration);
}

.review-pagination {
  transform: translateX(50%) !important;
  width: 100% !important;
}

.swiper-pagination-bullet {
  width: auto !important;
  aspect-ratio: 1;
}

/* CONTACT */

.link-contact,
.link-contact p {
  color: var(--color-white);
  transition: color 0.3s ease-out;
}

.link-contact:hover,
.link-contact:hover p {
  color: var(--color-blue);
}

/* MENTIONS LEGALES */

.netdev-mentions-legales {
  width: 100%;
}

.netdev-mentions-legales h2 {
  color: var(--color-yellow);
  padding: 40px 0 20px 0;
}

.netdev-mentions-legales p {
  color: var(--color-white);
}

.netdev-mentions-legales a {
  font-weight: 700;
  color: var(--color-white);
  transition: color 0.3s ease-out;
	word-break: break-all;
}

.netdev-mentions-legales a:hover {
  color: var(--color-blue);
}