@charset "UTF-8";
/* Couleurs, tailles, polices (en :root) */
@font-face {
  font-family: "Anta";
  src: url(../../fonts/Anta-Regular.ttf);
}
@font-face {
  font-family: "Mulish";
  src: url(../../fonts/Mulish-VariableFont_wght.ttf);
}
:root {
  --orange: #F47F34;
  --white: #FEFEFE;
  --black: #373435;
  --anta: "Anta";
  --mulish: "Mulish";
  --height-welcome: 80vh;
  --size-cta_orange-arrow: 2rem;
}

.mdi--arrow-right-bold {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 15V9h8V4.16L19.84 12L12 19.84V15z'/%3E%3C/svg%3E");
  background-color: var(--white);
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.ep--arrow-left-bold {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath fill='%23000' d='M685.248 104.704a64 64 0 0 1 0 90.496L368.448 512l316.8 316.8a64 64 0 0 1-90.496 90.496L232.704 557.248a64 64 0 0 1 0-90.496l362.048-362.048a64 64 0 0 1 90.496 0' stroke-width='25.5' stroke='%23000'/%3E%3C/svg%3E");
  background-color: var(--black);
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.fluent-emoji-high-contrast--cross-mark {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0.2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23000' d='M24.879 2.879A3 3 0 1 1 29.12 7.12l-8.79 8.79a.125.125 0 0 0 0 .177l8.79 8.79a3 3 0 1 1-4.242 4.243l-8.79-8.79a.125.125 0 0 0-.177 0l-8.79 8.79a3 3 0 1 1-4.243-4.242l8.79-8.79a.125.125 0 0 0 0-.177l-8.79-8.79A3 3 0 0 1 7.12 2.878l8.79 8.79a.125.125 0 0 0 .177 0z' stroke-width='1' stroke='%23000'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.mdi--youtube {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m10 15l5.19-3L10 9zm11.56-7.83c.13.47.22 1.1.28 1.9c.07.8.1 1.49.1 2.09L22 12c0 2.19-.16 3.8-.44 4.83c-.25.9-.83 1.48-1.73 1.73c-.47.13-1.33.22-2.65.28c-1.3.07-2.49.1-3.59.1L12 19c-4.19 0-6.8-.16-7.83-.44c-.9-.25-1.48-.83-1.73-1.73c-.13-.47-.22-1.1-.28-1.9c-.07-.8-.1-1.49-.1-2.09L2 12c0-2.19.16-3.8.44-4.83c.25-.9.83-1.48 1.73-1.73c.47-.13 1.33-.22 2.65-.28c1.3-.07 2.49-.1 3.59-.1L12 5c4.19 0 6.8.16 7.83.44c.9.25 1.48.83 1.73 1.73'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.ri--linkedin-fill {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.94 5a2 2 0 1 1-4-.002a2 2 0 0 1 4 .002M7 8.48H3V21h4zm6.32 0H9.34V21h3.94v-6.57c0-3.66 4.77-4 4.77 0V21H22v-7.93c0-6.17-7.06-5.94-8.72-2.91z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.basil--facebook-solid {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14.2 2.875A4.625 4.625 0 0 0 9.575 7.5v2.575H7.1c-.124 0-.225.1-.225.225v3.4c0 .124.1.225.225.225h2.475V20.9c0 .124.1.225.225.225h3.4c.124 0 .225-.1.225-.225v-6.975h2.497c.103 0 .193-.07.218-.17l.85-3.4a.225.225 0 0 0-.218-.28h-3.347V7.5a.775.775 0 0 1 .775-.775h2.6c.124 0 .225-.1.225-.225V3.1c0-.124-.1-.225-.225-.225z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.pepicons-pop--play {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M15.544 9.59a1 1 0 0 1-.053 1.728L6.476 16.2A1 1 0 0 1 5 15.321V4.804a1 1 0 0 1 1.53-.848z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  vertical-align: middle;
  padding: 0;
  margin: 0;
}

.lets-icons--stop-fill {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='4' height='14' x='6' y='5' fill='%23000' rx='1'/%3E%3Crect width='4' height='14' x='14' y='5' fill='%23000' rx='1'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.proicons--road-cone {
  display: inline-block;
  width: 2.2rem;
  height: 2.2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2.5'%3E%3Cpath d='M2.75 21.25h18.5'/%3E%3Cpath stroke-linejoin='round' d='m4.75 21.25l1.502-4.625M19.25 21.25l-1.502-4.625M7.754 12l-1.502 4.625M7.754 12l1.501-4.625l1.278-3.934a1 1 0 0 1 .95-.691h1.033a1 1 0 0 1 .951.691l1.278 3.934L16.246 12m-8.492 0h8.492m-9.994 4.625h11.496M16.246 12l1.502 4.625'/%3E%3C/g%3E%3C/svg%3E");
  background-color: rgb(48, 48, 48);
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.bxs--left-arrow {
  display: inline-block;
  width: 4rem;
  height: 4rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m4.431 12.822l13 9A1 1 0 0 0 19 21V3a1 1 0 0 0-1.569-.823l-13 9a1.003 1.003 0 0 0 0 1.645'/%3E%3C/svg%3E");
  background-color: rgb(48, 48, 48);
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.bxs--right-arrow {
  display: inline-block;
  width: 4rem;
  height: 4rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M5.536 21.886a1 1 0 0 0 1.033-.064l13-9a1 1 0 0 0 0-1.644l-13-9A1 1 0 0 0 5 3v18a1 1 0 0 0 .536.886'/%3E%3C/svg%3E");
  background-color: rgb(48, 48, 48);
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.dashicons--arrow-down-alt2 {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='m5 6l5 5l5-5l2 1l-7 7l-7-7z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.mdi--file-eye-outline {
  display: inline-block;
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 18c.56 0 1 .44 1 1s-.44 1-1 1s-1-.44-1-1s.44-1 1-1m0-3c-2.73 0-5.06 1.66-6 4c.94 2.34 3.27 4 6 4s5.06-1.66 6-4c-.94-2.34-3.27-4-6-4m0 6.5a2.5 2.5 0 0 1-2.5-2.5a2.5 2.5 0 0 1 2.5-2.5a2.5 2.5 0 0 1 2.5 2.5a2.5 2.5 0 0 1-2.5 2.5M9.27 20H6V4h7v5h5v4.07c.7.08 1.36.25 2 .49V8l-6-6H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h4.5a8.2 8.2 0 0 1-1.23-2'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.tabler--download {
  display: inline-block;
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.1' d='M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2M7 11l5 5l5-5m-5-7v12'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

/* Grille, containers, structure générale */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  position: relative;
  font-family: var(--mulish);
}

.unselectable {
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.container {
  margin-left: 20rem;
  margin-right: 20rem;
}

.orange-text {
  color: var(--orange);
}

.overlay {
  position: absolute;
  left: 0;
  width: 100%;
  height: var(--height-welcome);
  background: linear-gradient(90deg, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 100%);
  z-index: -1;
}

.no-scroll {
  overflow: hidden;
}

.hidden {
  display: none;
}

.hidden-contact_rolled {
  width: 0;
  border: none;
  padding: 0;
}

/*** welcome ***/
#welcome {
  margin-top: 5rem;
  display: flex;
  align-items: center;
  height: var(--height-welcome);
  position: relative;
}

/* welcome_background-video */
#background-video-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--height-welcome);
  z-index: -1;
}

#background-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* welcome_foreword */
#welcome-foreword {
  display: flex;
  flex-direction: column;
  gap: 1.9rem;
  color: var(--white);
}

#welcome-foreword h1 {
  display: flex;
  flex-direction: column;
  font-size: 2.5rem;
  font-family: var(--anta);
}

#welcome-foreword-text {
  border-left: 0.5rem solid var(--orange);
  padding-left: 1rem;
  font-size: 1.4rem;
}

/* welcome_btns */
#welcome-video-btns {
  position: absolute;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  bottom: 4rem;
  right: 0;
}

#div-orange_line {
  width: 100%;
  position: absolute;
  bottom: -0.1rem;
  left: 0;
}

.element {
  display: block;
  height: clamp(0.3rem, 0.4vw, 0.5rem); /* Épaisseur responsive */
  background-image: repeating-linear-gradient(to right, var(--orange) 0, var(--orange) clamp(1rem, 4vw, 2rem), transparent clamp(1rem, 4vw, 2rem), transparent clamp(1.4rem, 6vw, 3rem));
}

#orange_line {
  width: 100%;
  object-fit: cover;
}

/*** welcome ***/
/*** services ***/
#services {
  scroll-margin-top: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
}

.carousel-wrapper-mobile {
  display: none;
}

/*** services ***/
/*** a-propos ***/
#about {
  background-color: var(--black);
  color: var(--white);
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

#div-about_text {
  display: flex;
  flex-direction: column;
}

.about_text {
  position: relative;
  border-left: 2px solid var(--white);
  padding-top: 2rem;
  padding-left: 1.5rem;
  margin: 40px 0px;
}

.about_logo {
  position: absolute;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
  width: auto;
  height: 6rem;
  top: -3.4375rem;
  left: -4.375rem;
}

.about_logo span {
  font-weight: 800;
}

.about_logo img {
  width: auto;
  height: 6rem;
  object-fit: contain;
}

.about_text-p {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-size: 1.125rem;
}

#about_trust {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 40px 0px;
}

#about_trust-text h3 {
  padding-bottom: 1rem;
  font-size: 1.375rem;
}

#about_trust-text p {
  padding-bottom: 1rem;
  font-size: 1.125rem;
}

#about_trust-logo_france {
  width: 18rem;
  height: auto;
}

#about_trust-logo_compagny {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  background-color: var(--white);
  border-radius: 0.3125rem;
  padding: 1rem;
}

#about_trust-logo_compagny img {
  margin: 0rem 0.7rem;
  width: 6rem;
  height: 6rem;
}

#div-white_line {
  height: clamp(0.3rem, 0.4vw, 0.5rem); /* Épaisseur responsive */
  background-image: repeating-linear-gradient(to right, var(--white) 0, var(--white) clamp(1rem, 4vw, 2rem), transparent clamp(1rem, 4vw, 2rem), transparent clamp(1.4rem, 6vw, 3rem));
}

/*** a-propos ***/
/*** notre groupe ***/
#group {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding-bottom: 4rem;
}

#groupe_resum-axial {
  display: flex;
  justify-content: space-between;
}

#groupe_resum-signalmarket {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
}

#groupe_resum-axial, #groupe_resum-signalmarket {
  gap: 2rem;
  padding: 4rem 0rem;
}

.group_resum-text {
  position: relative;
  border-left: 2px solid var(--black);
  padding-top: 2rem;
  padding-left: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.group_resum-text h3 {
  display: flex;
  flex-direction: column;
  font-size: 1.125rem;
  font-weight: 700;
  padding-bottom: 0.5rem;
}

.group_resum-text p {
  width: 28.75rem;
  font-size: 1rem;
  padding-bottom: 1rem;
}

.group_resum-logo {
  position: absolute;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
  width: auto;
  height: 6rem;
  top: -55px;
  left: -11px;
  transition: 0.3s filter;
}

.group_resum-logo img {
  width: 100%;
  height: 100%;
}

.group_resum-picture {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 17.5rem;
}

.group_resum-picture img {
  width: 100%;
  height: 100%;
}

.group_resum-contact_rolled {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

/*** contact ***/
#contact {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  background-color: var(--black);
  color: var(--white);
  width: 100%;
}

.contact_title, #interactive_map, #contact_form {
  padding: 2rem 0rem;
}

.contact_title {
  display: flex;
  gap: 1rem;
}

.contact_title h3 {
  white-space: nowrap;
  font-size: 20px;
}

.contact_title div {
  position: relative;
  display: flex;
  width: 100%;
  margin-top: 0.18rem;
}

.contact_title-ellipse {
  position: absolute;
  width: 0.9375rem;
  height: 0.9375rem;
  margin-top: 0.16rem;
  border-radius: 50%;
  border: 0.125rem solid var(--white);
  background-color: var(--orange);
}

.contact_title-line {
  width: 100%;
  border-top: 0.125rem solid var(--white);
  margin-top: 0.55rem;
  margin-left: 0.5rem;
}

#interactive_map {
  display: flex;
  flex-direction: row;
}

#interactive_map-buttons {
  display: flex;
  flex-direction: column;
  text-align: flex-start;
  width: 12.5rem;
}

.interactive_map-button {
  cursor: pointer;
  text-decoration: none;
  background-color: var(--black);
  color: var(--white);
  padding: 0.3125rem 0rem;
  margin: 0rem 0.625rem;
  border-radius: 0.3125rem;
  border-style: none;
  font-size: 1rem;
}

.interactive_map-button.active {
  background-color: var(--orange);
}

#interactive_map-div {
  position: relative;
  height: 25rem;
  width: 100%;
  border-radius: 0.625rem;
  overflow: hidden;
}

#interactive_map-map {
  height: 100%;
  width: 100%;
}

#interactive_map-info {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: var(--white);
  color: var(--black);
  padding: 0.625rem 1.25rem;
  font-size: 0.875rem;
  z-index: 1000;
}

#interactive_map-info-buttons {
  display: flex;
  flex-direction: row;
  gap: 0.625rem;
}

#interactive_map-info-buttons span {
  padding: 0rem 0.2rem;
  border-left: 1px solid black;
}

/*** formulaire ***/
#contact_form {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
}

#form {
  display: flex;
  flex-direction: column;
  width: 50%;
}

#form form {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

#form h2 {
  text-align: center;
  margin: 1.875rem 0rem;
}

label {
  font-size: 1rem;
}

.input {
  border-radius: 0.3125rem;
  padding: 0.5625rem 0.9375rem;
  font-size: 1rem;
}

#message {
  height: 10rem;
}

.input::placeholder {
  color: rgb(145, 145, 145);
}

#form_info {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 100%;
}

#form_info span {
  font-size: 1.125rem;
}

#form_info-picture {
  padding-top: 6rem;
}

.cta_orange-arrow-hidden {
  display: none;
}

.cta_orange-arrow-div-sending {
  width: 10.5rem;
  height: 2rem;
  border-radius: 0.5rem;
  padding: 0.3rem 0.5rem;
  margin: 20px 0px;
  background-color: var(--white);
  color: var(--black);
  font-family: var(--anta);
  display: flex;
  justify-content: center;
  align-items: center;
}

.cta_orange-arrow {
  width: 10.5rem;
  height: 2rem;
  border-radius: 0.5rem;
  padding: 0.3rem 0.5rem;
  position: relative;
  transition: 0.4s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  background-color: var(--black);
  border: none;
  margin: 20px 0px;
  text-decoration: none;
}

.cta_orange-arrow_arrow {
  position: absolute;
  left: 0.5rem;
  width: 1.5rem;
  height: 1.5rem;
  background-color: var(--orange);
  border-radius: 50%;
  transition: 0.4s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cta_orange-arrow_text {
  color: var(--white);
  font-family: var(--anta);
  font-size: 1.25rem;
  margin-left: 2rem;
  transition: 0.4s ease;
}

.cta_orange-arrow:hover {
  background-color: var(--orange);
}

.cta_orange-arrow:hover .mdi--arrow-right-bold {
  background-color: var(--orange);
}

.cta_orange-arrow:hover .cta_orange-arrow_arrow {
  background-color: var(--white);
  left: calc(100% - 2.3rem);
}

.cta_orange-arrow:hover .cta_orange-arrow_text {
  margin-left: 0;
  margin-right: 2rem;
}

.cta_orange-arrow:active {
  background-color: var(--white);
}

.cta_orange-arrow:active .mdi--arrow-right-bold {
  background-color: var(--white);
}

header {
  top: 0;
  position: fixed;
  display: flex;
  align-items: center;
  width: 100%;
  height: 5rem;
  background-color: var(--white);
  box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.5);
  transition: 0.4s;
  z-index: 1000000;
}

header nav {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#logo-technisign {
  height: clamp(28px, 5vw, 40px);
  transition: 0.4s;
  margin-right: 1rem;
}

header nav div {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}

header nav div a {
  white-space: nowrap;
  text-decoration: none;
  color: var(--black);
  font-weight: 600;
  font-size: clamp(0.9rem, 1.8vw, 1.25rem);
}

header nav div a:hover {
  text-decoration: 2px underline var(--black);
}

/* Classe quand le header est réduit après scroll */
header.reduced {
  height: 3rem;
}

header.reduced:hover {
  height: 5rem;
}

header.reduced:hover #logo-technisign {
  height: clamp(28px, 5vw, 40px);
}

header.reduced #logo-technisign {
  height: 1.75rem;
}

footer {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#footer_logo {
  height: auto;
  width: 50%;
  margin: 2rem;
}

#footer_logo img {
  height: auto;
  width: 100%;
  object-fit: cover;
}

#footer_social_media-title {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  text-align: center;
  width: 100%;
}

#footer_social_media-title h3 {
  margin: 0rem 24px;
  font-size: 1.375rem;
  font-weight: 400;
  font-family: var(--anta);
  text-wrap: nowrap;
  text-transform: uppercase;
}

.footer_social_media-title-orange-line {
  margin-top: 10px;
  flex: 1;
  height: 6px; /* épaisseur */
  background: repeating-linear-gradient(to right, var(--orange), var(--orange) 45px, transparent 45px, transparent 60px);
}

#footer_social_media {
  display: flex;
  flex-direction: row;
  margin: 1.25rem;
  gap: 1rem;
}

#footer-copyright {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 1.25rem;
  text-align: center;
}

.btn_round {
  display: flex;
  flex-direction: center;
  align-items: center;
  border-radius: 50%;
  background-color: var(--white);
  color: var(--black);
  padding: 0.6rem;
  border: none;
  cursor: pointer;
  border: rgba(255, 0, 51, 0) solid 2px;
}

#btn-playpause_video {
  transition: 0.3s;
}

#btn-playpause_video:hover {
  border: var(--orange) solid 2px;
}

#btn-link_video {
  position: relative;
  transition: 0.3s;
}

#btn-link_video:hover {
  border: #FF0033 solid 2px;
}

#btn-link_video:hover #btn-link_video-youtube_icon {
  color: #FF0033;
}

#btn-link_video-text {
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  background-color: rgba(0, 0, 0, 0.517);
  color: rgba(255, 255, 255, 0.812);
  position: absolute;
  bottom: 3.5rem;
  left: -2.8rem;
  padding: 0.5rem;
  white-space: nowrap;
}

#btn-link_video-youtube_icon {
  width: 2rem;
  height: 2rem;
}

.section-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 2rem;
}

.title_orange_line {
  display: block;
  width: 1rem;
  height: 0.3rem;
  background-color: var(--orange);
  margin: 0rem 0.5rem;
}

.section-title span {
  font-family: var(--anta);
  font-size: 1.625rem;
  text-align: center;
}

#section-title_div {
  padding: 0.625rem;
  display: flex;
  align-items: center;
}

#section-title_div h2 {
  font-size: 1rem;
  font-weight: 500;
}

.carousel-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  width: 64rem;
}

.carousel {
  position: relative;
  max-width: 56.25rem;
  margin: auto;
  overflow: hidden;
}

.slides {
  display: flex;
  transition: transform 0.5s ease-in-out;
  width: 100%;
}

.slide {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  min-width: 100%;
  user-select: none;
}

.slide img {
  width: 100%;
  display: block;
  border-radius: 0.375rem;
}

#slides_buttons {
  position: absolute;
  top: 40%;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

#slides_buttons button {
  transition: background-color 0.2s ease-in-out;
}

#slides_buttons button:hover {
  background-color: #f47f34;
  cursor: pointer;
}

.pagination {
  text-align: center;
  margin-top: 1rem;
}

.pagination button {
  width: 3.125rem;
  height: 0.5rem;
  border: none;
  margin: 0 0.375rem;
  background-color: #ccc;
  cursor: pointer;
  transition: background-color 0.6s;
}

.pagination button.active {
  background-color: #f47f34;
}

/* carte services */
.carousel_card {
  height: 21.5rem;
  width: 17rem;
  background-color: rgb(48, 48, 48);
  border-radius: 1rem;
}

.carousel_card_img-icon {
  position: relative;
  display: flex;
  justify-content: center;
  border-radius: 0.7rem;
  margin: 0.7rem;
  height: 9rem;
  width: 15.6rem;
}

.carousel_card_img-icon img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.carousel_card_img-icon div {
  position: absolute;
  bottom: -1.875rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: white;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  border: 0.35rem solid rgb(48, 48, 48);
}

#icon_services {
  width: 3rem;
  height: 3rem;
}

.carousel_card_text {
  color: white;
  margin: 2rem 2rem 2rem 2rem;
}

.carousel_card_text h3 {
  font-size: 1rem;
  margin-bottom: 0.4rem;
}

.carousel_card_text ul li {
  font-size: 0.875rem;
  margin-top: 5px;
}

#brochure {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 2.5rem 0rem;
}

#brochure p {
  font-weight: 600;
}

#brochure_buttons {
  display: flex;
  flex-direction: row;
  font-size: 1.125rem;
  gap: 3.125rem;
  margin: 1rem 0rem;
}

.brochure_buttons-button {
  font-family: var(--mulish);
  font-size: 1rem;
  font-weight: 600;
  width: 214px;
  height: 40px;
  border-radius: 0.625rem;
  border: 0.2188rem solid var(--orange);
}

.brochure_buttons-button:hover {
  cursor: pointer;
}

#see_brochure {
  background-color: var(--white);
  color: var(--orange);
  position: relative;
  overflow: hidden;
}

/* Les éléments texte et icône doivent être superposés */
#see_brochure-text,
#see_brochure-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

#see_brochure-text {
  opacity: 1;
  transform: translate(-50%, -50%);
}

#see_brochure-icon {
  opacity: 0;
  transform: translate(-50%, -30%);
}

#see_brochure:hover #see_brochure-text {
  opacity: 0;
  transform: translate(-50%, -70%);
}

#see_brochure:hover #see_brochure-icon {
  opacity: 1;
  transform: translate(-50%, -50%);
}

#download_brochure {
  background-color: var(--orange);
  color: var(--white);
  position: relative;
  overflow: hidden;
}

#download_brochure-text,
#download_brochure-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transition: opacity 0.4s ease, transform 0.4s ease;
}

#download_brochure-text {
  opacity: 1;
  transform: translate(-50%, -50%);
  text-align: center;
}

#download_brochure-icon {
  opacity: 0;
  transform: translate(-50%, -30%);
}

#download_brochure:hover #download_brochure-text {
  opacity: 0;
  transform: translate(-50%, -70%);
}

#download_brochure:hover #download_brochure-icon {
  opacity: 1;
  transform: translate(-50%, -50%);
}

/* MODAL */
#pdf_modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000000;
}

#pdf_modal.hidden {
  display: none;
}

.modal-content {
  position: relative;
  width: 80%;
  height: 90%;
  background: white;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}

.modal-content iframe {
  width: 100%;
  height: 100%;
  border: none;
}

/* Bouton de fermeture */
.close-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  background: transparent;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  z-index: 2;
  color: var(--white);
}

#cta_see_more {
  display: inline-flex;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
  text-decoration: none;
}

#cta_see_more-text {
  color: var(--white);
  font-size: 1.375rem;
  font-family: var(--anta);
}

#cta_see_more-arrow {
  color: var(--white);
  transition: transform 0.2s ease;
}

#cta_see_more:hover #cta_see_more-arrow {
  transform: translateY(0.5rem);
  color: var(--orange);
}

.contact_rolled {
  position: relative;
  display: flex;
  align-items: center;
}

.button-contact_rolled {
  text-decoration: none;
  background-color: var(--orange);
  border: none;
  border-radius: 5px;
  width: 140px;
  height: 30px;
  font-size: 1rem;
  color: white;
  z-index: 1000;
  cursor: pointer;
}

.div-contact_rolled {
  position: absolute;
  left: 138px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 300px;
  height: 24px;
  border: 1px solid var(--black);
  overflow: hidden;
  transition: width 0.4s ease;
}

.contact_rolled-ts-border_white {
  border: 1px solid var(--white);
}

.div-contact_rolled.hidden-contact_rolled {
  width: 0;
  border: none;
  padding: 0;
}

/*** loader ***/
#loader-title {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--black);
  color: var(--white);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  z-index: 1000000000;
  transition: opacity 1s ease;
  scrollbar-width: none;
}

#loader-title.fade-out {
  opacity: 0;
  pointer-events: none; /* évite de bloquer les clics pendant la transition */
}

.loader-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.loader {
  display: flex;
  justify-content: space-between;
  width: 80px;
}

.loader div {
  width: 16px;
  height: 16px;
  background-color: var(--orange);
  border-radius: 50%;
  animation: grow-shrink 1.5s infinite;
}

.loader div:nth-child(1) {
  animation-delay: 0s;
}

.loader div:nth-child(2) {
  animation-delay: 0.3s;
}

.loader div:nth-child(3) {
  animation-delay: 0.6s;
}

@keyframes grow-shrink {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
}
/* Media queries centralisées */
@media (max-width: 1440px) {
  .container {
    margin-left: 15rem;
    margin-right: 15rem;
  }
  .carousel-wrapper-mobile {
    display: none;
  }
}
@media (max-width: 1244px) {
  .container {
    margin-left: 7rem;
    margin-right: 7rem;
  }
}
@media (max-width: 1100px) {
  .container {
    margin-left: 5rem;
    margin-right: 5rem;
  }
}
@media (max-width: 860px) {
  .container {
    margin-left: 2rem;
    margin-right: 2rem;
  }
  .overlay {
    background: none;
    background-color: var(--black);
  }
  #background-video-container {
    display: none;
  }
  #about_trust {
    flex-direction: column;
    align-items: center;
  }
  .about_logo {
    flex-direction: row-reverse;
    left: -11px;
  }
}
@media (max-width: 650px) {
  #brochure_buttons {
    gap: 0.5rem;
  }
  .brochure_buttons-button {
    font-size: 1rem;
    width: 160px;
    height: 38px;
  }
  #brochure p {
    text-align: center;
  }
  .group_resum-picture {
    display: none;
  }
  .group_resum-text p {
    width: auto;
  }
  #interactive_map {
    flex-direction: column-reverse;
  }
  #interactive_map-buttons {
    padding-top: 1rem;
    flex-direction: row;
    width: 100%;
  }
  .interactive_map-button {
    padding: 0.375rem 1rem;
  }
  #form_info-picture {
    display: none;
  }
  /*** formulaire ***/
  #contact_form {
    flex-direction: column-reverse;
  }
  #form {
    width: auto;
  }
}
@media (max-width: 430px) {
  #welcome-foreword h1 {
    font-size: 2rem;
  }
  #welcome-foreword-text {
    font-size: 1.125rem;
  }
  #brochure_buttons {
    gap: 0.4rem;
  }
  .brochure_buttons-button {
    font-size: 1rem;
    width: 145px;
    height: 38px;
  }
  #brochure p {
    text-align: center;
  }
  .about_logo img {
    width: 80%;
    height: 80%;
  }
  .about_logo {
    left: -9px;
  }
  .interactive_map-button {
    padding: 8px 12px;
    margin: 0rem 0rem;
    font-size: 0.875rem;
  }
  #form h2 {
    font-size: 1.4rem;
  }
  #footer_logo {
    width: 80%;
  }
}
@media (max-width: 860px) {
  .hidden {
    display: flex;
  }
  #classic-menu {
    display: none;
    justify-content: flex-start;
  }
  #responsive-menu {
    flex-direction: column;
    justify-content: flex-start;
    position: absolute;
    top: 0;
    right: 0;
    height: 100vh;
    background-color: var(--white);
    box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.1);
    padding: 1.3rem;
    transform: translate(200%, 0);
    transition: transform 0.5s ease-in-out;
  }
  #nav-arrow_icon {
    display: flex;
    justify-content: flex-end;
    align-content: flex-end;
  }
  #responsive-menu-links {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
  #black-line {
    width: 100%;
    height: 0.15rem;
    background-color: var(--black);
  }
  #responsive-menu.open {
    transform: translate(0%, 0);
  }
}
#social-media-icons {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.social_media_a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background-color: var(--black);
}

.social_media_icon {
  color: var(--white);
  width: 1.3rem;
  height: 1.3rem;
}

@media (max-width: 860px) {
  .mobile_hidden {
    display: none;
  }
  #welcome-video-btns {
    bottom: 2rem;
  }
}
.carousel_card-mobile {
  background-color: var(--black);
  border-radius: 0.5rem;
}

.div-carousel_card-mobile {
  display: flex;
  align-items: center;
}

.carousel_card_icon-mobile {
  margin-left: 2rem;
}

.carousel_card_icon-mobile img {
  background-color: var(--white);
  border-radius: 50%;
  padding: 0.25rem;
}

@media (max-width: 1100px) {
  .carousel-wrapper {
    width: 34rem;
  }
  .slide {
    flex-direction: column;
    align-items: center;
  }
  .carousel_card {
    display: flex;
    flex-direction: row;
    width: 500px;
    height: 200px;
  }
  .carousel_card_img-icon img {
    border-radius: 50px;
  }
  .carousel_card_text {
    width: 60%;
  }
  #slides_buttons {
    width: 70%;
  }
  #slides_buttons {
    width: 120%;
  }
}
@media (max-width: 650px) {
  .carousel-wrapper-mobile {
    display: block;
  }
  #carousel_services {
    display: none;
  }
  .slides {
    width: 90vw;
  }
  #slides_buttons button {
    display: none;
  }
}
@media (max-width: 430px) {
  .section-title {
    margin: 2rem 0rem;
  }
  .section-title span {
    font-size: 1.25rem;
    text-align: center;
  }
  #section-title_div h2 {
    font-size: 0.875rem;
  }
}
.iconamoon--arrow-left-2 {
  display: inline-block;
  width: 3rem;
  height: 3rem;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.1' d='m14 7l-5 5m0 0l5 5'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

#error_page-body {
  position: relative;
  background-color: var(--white);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  font-size: 1.125rem;
}

#error_page-come_back {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1.75rem;
  text-decoration: none;
  color: var(--black);
  font-family: var(--anta);
  display: flex;
  align-items: center;
}

#error_page-come_back:hover {
  text-decoration: underline;
}

.orange-text {
  font-family: var(--anta);
  color: var(--orange);
}

#error_page-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#error_page-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-bottom: 70px;
}

#error_page-text span:first-child {
  font-size: 1.4rem;
  font-weight: 600;
  margin-top: 3rem;
  margin-bottom: 0.9375rem;
}

#error_page-text-mail {
  display: flex;
  align-items: center;
  flex-direction: column;
}

#error_page-text-mail span:last-child {
  border: 2px solid var(--black);
  padding: 0.2rem 0.7rem;
}

@media (max-width: 430px) {
  #error_page-come_back {
    font-size: 1.25rem;
    padding: 0.5rem;
  }
  #error_page-text span:first-child {
    font-size: 1rem;
  }
  #error_page-text {
    font-size: 0.875rem;
  }
  #error_page-text-mail {
    font-size: 1rem;
  }
  #error_page-section img {
    width: 80%;
    height: auto;
  }
}

/*# sourceMappingURL=style.css.map */