@charset "UTF-8";
*,
::before,
::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Aleo Variable Fonts */
@font-face {
  font-family: "Aleo";
  src: url("../font/Aleo-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
}
@font-face {
  font-family: "Aleo";
  src: url("../font/Aleo-Italic-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
}
/* Bronova */
@font-face {
  font-family: "Bronova";
  src: url("../font/Bronova-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Bronova";
  src: url("../font/Bronova-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
/* Alex Brush*/
@font-face {
  font-family: "Alex Brush";
  src: url("../font/AlexBrush-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
:root {
  /* Colors */
  --dark: #111111;
  --yellow: #ffc31c;
  --green: #7eafa1;
  --white: var(--white);
  /* Fonts */
  --first-font: Poppins, sans-serif;
  --second-font: Aleo, sans-serif;
  --h1-font: Bronova, sans-serif;
  /* Font-size */
  --fs-8: 0.5rem;
  --fs-10: 0.625rem;
  --fs-12: 0.75rem;
  --fs-14: 0.875rem;
  --fs-15: 0.938rem;
  --fs-16: 1rem;
  --fs-17: 1.063rem;
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;
  --fs-21: 1.313rem;
  --fs-22: 1.375rem;
  --fs-24: 1.5rem;
  --fs-25: 1.563rem;
  --fs-28: 1.75rem;
  --fs-30: 1.875rem;
  --fs-31: 1.938rem;
  --fs-36: 2.25rem;
  --fs-40: 2.5rem;
  --fs-46: 2.875rem;
  --fs-49: 3.063rem;
  --fs-50: 3.125rem;
  --fs-59: 3.688rem;
  --fs-60: 3.75rem;
  --fs-70: 4.375rem;
  --fs-77: 4.813rem;
  --fs-90: 5.625rem;
  --fs-95: 5.938rem;
  /* shadows */
  --form-shadow: -5px 8px 14px #000000;
  /* GRADIANT*/
  --white-to-black-grd: linear-gradient(to bottom, #ffffff 51%, #000000 51%);
  --black-to-white-grd: linear-gradient(to bottom, #000000 51%, #ffffff 51%);
}

/* GLOBAL */
/* GLOBAL */
/* GLOBAL */
/* GLOBAL */
/* GLOBAL */
html {
  scroll-behavior: smooth;
}

body {
  margin: 0 auto;
  position: relative;
  width: 100%;
}

/* HERO SECTION */
/* HERO SECTION */
/* HERO SECTION */
/* HERO SECTION */
/* HERO SECTION */
header {
  background-color: var(--dark);
  width: 100%;
  padding: 32px 210px 155px;
  overflow-x: hidden;
}
@media screen and (max-width: 1786px) {
  header {
    padding: 32px 100px 155px;
  }
}
@media screen and (max-width: 1043px) {
  header {
    padding: 32px 40px 155px 40px;
  }
}
@media screen and (max-width: 985px) {
  header {
    padding: 32px 40px 80px 40px;
  }
}
@media screen and (max-width: 599px) {
  header {
    padding: 32px 20px 80px 20px;
  }
}
@media screen and (max-width: 599px) {
  header {
    padding: 32px 20px 40px 20px;
  }
}
header .container-menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 53px;
}
@media screen and (max-width: 780px) {
  header .container-menu {
    flex-direction: column;
    align-items: center;
  }
}
@media screen and (max-width: 425px) {
  header .container-menu {
    margin-bottom: -17px;
  }
}
header .container-menu img {
  width: 136px;
  height: 113px;
}
@media screen and (max-width: 780px) {
  header .container-menu img {
    margin-bottom: 53px;
  }
}

/* MENU */
.menu {
  position: relative;
  padding: 18px 0;
  height: 100%;
  width: auto;
}
.menu::before, .menu::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: rgb(255, 255, 255);
}
@media screen and (max-width: 830px) {
  .menu::before, .menu::after {
    background-color: rgba(255, 255, 255, 0.61);
  }
}
.menu::before {
  top: 0;
}
.menu::after {
  bottom: 0;
}
.menu a {
  text-decoration: none;
  color: #ffffff;
  font-size: var(--fs-20);
  font-family: var(--first-font);
  font-weight: 300;
  height: 100%;
  position: relative;
  z-index: 2;
  padding: 0 3px;
}
@media screen and (max-width: 830px) {
  .menu a {
    font-size: var(--fs-16);
  }
}
@media screen and (max-width: 361px) {
  .menu a {
    font-size: var(--fs-14);
  }
}
@media screen and (max-width: 449px) {
  .menu a:nth-child(3) {
    display: none;
  }
}
.menu a::after {
  content: "";
  position: absolute;
  top: -18px;
  left: 0;
  width: 100%;
  height: 64px;
  background-color: white;
  z-index: -1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}
@media screen and (max-width: 830px) {
  .menu a::after {
    height: 60px;
  }
}
@media screen and (max-width: 361px) {
  .menu a::after {
    height: 57px;
  }
}
.menu a:not(:last-child) {
  margin-right: 35px;
}
@media screen and (max-width: 524px) {
  .menu a:not(:last-child) {
    margin-right: 20px;
  }
}
@media screen and (max-width: 476px) {
  .menu a:not(:last-child) {
    margin-right: 10px;
  }
}
.menu a:hover {
  color: var(--dark) !important;
}
.menu a:hover::after {
  transform: scaleX(1);
}

/*BLOC LEFT HERO*/
.container-hero {
  display: flex;
  flex-direction: row;
  width: 100%;
  gap: 132px;
  justify-content: space-between;
}
@media screen and (max-width: 1121px) {
  .container-hero {
    gap: 60px;
  }
}
@media screen and (max-width: 599px) {
  .container-hero {
    gap: 35px;
  }
}

.container-left-hero {
  color: white;
  width: 40%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 1786px) {
  .container-left-hero {
    width: 65%;
    justify-content: space-around;
  }
}
@media screen and (max-width: 1567px) {
  .container-left-hero {
    min-width: 55%;
  }
}
@media screen and (max-width: 1121px) {
  .container-left-hero {
    min-width: 60%;
    justify-content: space-between;
  }
}
@media screen and (max-width: 985px) {
  .container-left-hero {
    justify-content: space-around;
  }
}
@media screen and (max-width: 802px) {
  .container-left-hero {
    min-width: 70%;
  }
}
@media screen and (max-width: 700px) {
  .container-left-hero {
    justify-content: space-evenly;
    align-items: unset;
  }
}
@media screen and (max-width: 599px) {
  .container-left-hero {
    min-width: 74%;
  }
}
@media screen and (max-width: 533px) {
  .container-left-hero {
    min-width: 81%;
  }
}
.container-left-hero .h1-hero {
  font-family: var(--h1-font);
  font-size: var(--fs-95);
  font-weight: 400;
  text-align: right;
  margin-bottom: 49px;
}
@media screen and (max-width: 1172px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-90);
    margin-bottom: unset;
  }
}
@media screen and (max-width: 985px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-77);
  }
}
@media screen and (max-width: 700px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-70);
  }
}
@media screen and (max-width: 489px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-60);
  }
}
@media screen and (max-width: 425px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-50);
  }
}
@media screen and (max-width: 361px) {
  .container-left-hero .h1-hero {
    font-size: var(--fs-46);
  }
}
.container-left-hero .h1-hero span {
  color: var(--yellow);
}
.container-left-hero .cita-hero {
  text-align: right;
  font-family: var(--first-font);
  font-style: italic;
  font-weight: 200;
  margin-bottom: 48px;
  font-size: var(--fs-20);
}
@media screen and (max-width: 1172px) {
  .container-left-hero .cita-hero {
    margin-bottom: unset;
  }
}
@media screen and (max-width: 985px) {
  .container-left-hero .cita-hero {
    font-size: var(--fs-18);
  }
}
@media screen and (max-width: 700px) {
  .container-left-hero .cita-hero {
    font-size: var(--fs-16);
  }
}
@media screen and (max-width: 361px) {
  .container-left-hero .cita-hero {
    font-size: var(--fs-12);
  }
}

.container-chiffres-hero {
  display: flex;
  flex-direction: row;
  font-family: var(--first-font);
  text-align: right;
  justify-content: flex-end;
  gap: 120px;
}
@media screen and (max-width: 700px) {
  .container-chiffres-hero {
    gap: 60px;
  }
}
.container-chiffres-hero p:nth-child(1) {
  font-weight: 700;
  font-style: italic;
  font-size: var(--fs-49);
}
@media screen and (max-width: 985px) {
  .container-chiffres-hero p:nth-child(1) {
    font-size: var(--fs-40);
  }
}
@media screen and (max-width: 700px) {
  .container-chiffres-hero p:nth-child(1) {
    font-size: var(--fs-31);
  }
}
@media screen and (max-width: 361px) {
  .container-chiffres-hero p:nth-child(1) {
    font-size: var(--fs-25);
  }
}
.container-chiffres-hero p:nth-child(2) {
  font-weight: 300;
  font-size: var(--fs-18);
}
@media screen and (max-width: 985px) {
  .container-chiffres-hero p:nth-child(2) {
    font-size: var(--fs-16);
  }
}
@media screen and (max-width: 700px) {
  .container-chiffres-hero p:nth-child(2) {
    font-size: var(--fs-14);
  }
}
@media screen and (max-width: 361px) {
  .container-chiffres-hero p:nth-child(2) {
    font-size: var(--fs-10);
  }
}
.container-chiffres-hero span {
  font-family: Ruluko, sans-serif;
}

.container-right-hero {
  position: relative;
  contain: layout paint;
}
@media screen and (max-width: 1567px) {
  .container-right-hero {
    width: unset;
  }
}

@keyframes anim-hero {
  0% {
    transform: translate(232px, 683px);
  }
  100% {
    transform: rotate(-181deg);
  }
}
.container-mask {
  width: 700px;
  position: relative;
  background-color: var(--yellow);
  z-index: 1;
  /* Masque vectoriel */
  -webkit-mask-image: url("../img/hero/bg-color_hero.svg");
  mask-image: url("../img/hero/bg-color_hero.svg");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.container-mask .anim-right-hero {
  position: absolute;
  z-index: 2;
  height: auto;
  width: auto;
  animation: anim-hero 3s ease-out forwards;
}

.container-link-hero {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  transition: transform 0.3s ease-in;
}
@media screen and (max-width: 1567px) {
  .container-link-hero {
    bottom: 0;
    top: unset;
    left: 10px;
    right: unset;
  }
  .container-link-hero img {
    width: 60px;
  }
}
@media screen and (max-width: 985px) {
  .container-link-hero {
    left: 20px;
    bottom: 20px;
  }
  .container-link-hero img {
    width: 50px;
  }
}
@media screen and (max-width: 533px) {
  .container-link-hero {
    bottom: 60px;
    left: 0;
  }
}
@media screen and (max-width: 361px) {
  .container-link-hero {
    bottom: 90px;
  }
  .container-link-hero img {
    width: 40px;
  }
}
.container-link-hero:hover {
  transform: scale(0.9);
}

.container-tel_mail-hero {
  position: absolute;
  bottom: 50px;
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
  z-index: 2;
}
@media screen and (max-width: 1567px) {
  .container-tel_mail-hero {
    bottom: 100px;
    top: unset;
    left: 10px;
    right: unset;
    gap: 30px;
  }
  .container-tel_mail-hero img {
    width: 60px;
  }
}
@media screen and (max-width: 985px) {
  .container-tel_mail-hero {
    left: 20px;
    bottom: 100px;
  }
  .container-tel_mail-hero img {
    width: 50px;
  }
}
@media screen and (max-width: 533px) {
  .container-tel_mail-hero {
    bottom: 130px;
    gap: 20px;
    left: 0;
  }
}
@media screen and (max-width: 361px) {
  .container-tel_mail-hero {
    bottom: 150px;
  }
  .container-tel_mail-hero img {
    width: 40px;
  }
}
.container-tel_mail-hero a {
  transition: transform 0.3s ease-in;
}
.container-tel_mail-hero a:hover {
  transform: scale(0.9);
}

/* TRANSITION CABINET */
/* TRANSITION CABINET */
/* TRANSITION CABINET */
/* TRANSITION CABINET */
/* TRANSITION CABINET */
.container-anim-defil {
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  white-space: nowrap;
  transform: translateY(-73px);
}
@media screen and (max-width: 985px) {
  .container-anim-defil {
    transform: translateY(-54px);
  }
}
@media screen and (max-width: 450px) {
  .container-anim-defil {
    transform: translateY(-39px);
  }
}

.anim-defil {
  display: inline-block;
  animation: scroll-left 120s linear infinite;
  white-space: nowrap;
}

.anim-defil h2,
.anim-defil p {
  display: inline-block;
  margin: 0;
  font-size: var(--fs-95);
  font-weight: 800;
  font-family: var(--first-font);
  background: var(--white-to-black-grd);
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
@media screen and (max-width: 985px) {
  .anim-defil h2,
  .anim-defil p {
    font-size: var(--fs-70);
  }
}
@media screen and (max-width: 450px) {
  .anim-defil h2,
  .anim-defil p {
    font-size: var(--fs-50);
  }
}

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
/* LE CABINET */
/* LE CABINET */
/* LE CABINET */
/* LE CABINET */
/* LE CABINET */
/* LE CABINET */
/* INTRODUCTION*/
#cabinet {
  width: 100%;
}

.h2-intro-section {
  text-align: center;
  font-family: var(--first-font);
  font-size: var(--fs-95);
  color: #000000;
  font-weight: 800;
  margin-bottom: 100px;
  transition: opacity 0.5s ease;
}
@media screen and (max-width: 760px) {
  .h2-intro-section {
    font-size: var(--fs-70) !important;
  }
}
@media screen and (max-width: 580px) {
  .h2-intro-section {
    font-size: var(--fs-59) !important;
  }
}
@media screen and (max-width: 456px) {
  .h2-intro-section {
    font-size: var(--fs-46) !important;
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 360px) {
  .h2-intro-section {
    font-size: var(--fs-40) !important;
  }
}

.container-img-intro {
  position: relative;
  margin: 0 auto;
  max-width: 1016px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.container-img-intro .anemone {
  position: relative;
  width: auto;
  cursor: pointer;
}
@media screen and (max-width: 650px) {
  .container-img-intro .anemone {
    width: 360px;
  }
}
@media screen and (max-width: 450px) {
  .container-img-intro .anemone {
    width: 300px;
  }
}
.container-img-intro .anemone path {
  transition: transform 0.2s ease-out;
  transform-origin: center;
  transform-box: fill-box;
}
.container-img-intro img {
  position: absolute;
  transform: translateX(11px);
  pointer-events: none;
}
@media screen and (max-width: 650px) {
  .container-img-intro img {
    width: 800px;
  }
}
@media screen and (max-width: 450px) {
  .container-img-intro img {
    width: 600px;
  }
}

/* FIN INTRODUCTION*/
/* CONTENT */
.container-content-cabinet {
  display: flex;
  flex-direction: row;
  position: relative;
  overflow: hidden;
  width: 100%;
  align-items: center;
  gap: 120px;
  margin-bottom: -306px;
}
@media screen and (max-width: 1050px) {
  .container-content-cabinet {
    flex-direction: column;
    gap: 0;
    margin-bottom: -167px;
  }
}
@media screen and (max-width: 610px) {
  .container-content-cabinet {
    transform: translateY(-150px);
  }
}

.bloc-leitmotiv,
.bloc-posture {
  justify-content: flex-end;
  margin-left: auto;
}
@media screen and (max-width: 1050px) {
  .bloc-leitmotiv,
  .bloc-posture {
    flex-direction: column;
    align-items: flex-start;
  }
}

.bloc-approche,
.bloc-vocation {
  justify-content: flex-start;
  margin-right: auto;
}
@media screen and (max-width: 1050px) {
  .bloc-approche,
  .bloc-vocation {
    flex-direction: column;
    align-items: flex-end;
  }
}

.bloc-posture {
  margin-bottom: -114px;
}
@media screen and (max-width: 610px) {
  .bloc-posture {
    margin-bottom: -35px;
  }
}
@media screen and (max-width: 470px) {
  .bloc-posture {
    margin-bottom: -75px;
  }
}

.container-section-cabinet {
  position: relative;
  width: 862px;
}
@media screen and (max-width: 1050px) {
  .container-section-cabinet {
    width: 603px;
    height: 663px;
  }
}
@media screen and (max-width: 610px) {
  .container-section-cabinet {
    width: 100%;
  }
}

/* GESTION DES TXT */
/* GESTION DES TXT */
/* GESTION DES TXT */
/* GESTION DES TXT */
.h3-cabinet {
  font-family: var(--first-font);
  font-size: var(--fs-60);
  position: absolute;
  z-index: 2;
}
@media screen and (max-width: 450px) {
  .h3-cabinet {
    padding: 0 10px;
    font-size: var(--fs-50);
  }
}

.h3-left-leitmotiv {
  transform: rotate(67.75deg);
  left: 601px;
  top: 330px;
}
@media screen and (max-width: 1050px) {
  .h3-left-leitmotiv {
    transform: rotate(-18.25deg);
    left: 238px;
    top: 513px;
  }
}
@media screen and (max-width: 610px) {
  .h3-left-leitmotiv {
    left: 50%;
    top: 226px;
    transform: translateX(-50%) rotate(19.75deg);
    z-index: -1;
  }
}

.h3-left-posture {
  transform: rotate(67.75deg);
  left: 628px;
  top: 348px;
}
@media screen and (max-width: 1050px) {
  .h3-left-posture {
    transform: rotate(-18.25deg);
    left: 290px;
    top: 508px;
  }
}
@media screen and (max-width: 610px) {
  .h3-left-posture {
    left: 50%;
    top: 296px;
    transform: translateX(-50%) rotate(19.75deg);
    z-index: -1;
  }
}

.h3-right-vocation,
.h3-right-approche {
  transform: rotate(-67.75deg);
  right: 601px;
  top: 330px;
}
@media screen and (max-width: 1050px) {
  .h3-right-vocation,
  .h3-right-approche {
    transform: rotate(18.25deg);
    left: 35px;
    top: 458px;
  }
}
@media screen and (max-width: 610px) {
  .h3-right-vocation,
  .h3-right-approche {
    left: 50%;
    right: unset;
    transform: translateX(-50%) rotate(-19.75deg);
    z-index: -1;
  }
}

@media screen and (max-width: 610px) {
  .h3-right-vocation {
    top: 170px;
  }
}
@media screen and (max-width: 470px) {
  .h3-right-vocation {
    top: 214px;
  }
}

@media screen and (max-width: 610px) {
  .h3-right-approche {
    top: 243px;
  }
}

.txt-cabinet {
  font-family: var(--second-font);
  font-size: var(--fs-18);
  color: #000000;
  letter-spacing: 1px;
  line-height: 184%;
  transform: translateY(31px);
  display: block;
  min-width: 360px;
}
@media screen and (max-width: 1650px) {
  .txt-cabinet {
    transform: translateY(-5px);
  }
}
@media screen and (max-width: 1050px) {
  .txt-cabinet {
    min-width: none;
    width: 340px;
    transform: translateY(0);
  }
}
@media screen and (max-width: 450px) {
  .txt-cabinet {
    padding: 0 10px;
    font-size: var(--fs-16);
  }
}
@media screen and (max-width: 370px) {
  .txt-cabinet {
    font-size: var(--fs-14);
  }
}
.txt-cabinet span {
  font-weight: 600;
  font-size: var(--fs-25);
}
@media screen and (max-width: 450px) {
  .txt-cabinet span {
    font-size: var(--fs-22);
  }
}
@media screen and (max-width: 370px) {
  .txt-cabinet span {
    font-size: var(--fs-18);
  }
}

.txt-cabinet-right {
  margin-right: 300px;
  text-align: right;
}
@media screen and (max-width: 1650px) {
  .txt-cabinet-right {
    margin-right: 150px;
  }
}
@media screen and (max-width: 1050px) {
  .txt-cabinet-right {
    text-align: center;
    margin-right: 0;
    align-self: center;
  }
}

.txt-cabinet-left {
  margin-left: 300px;
  text-align: left;
}
@media screen and (max-width: 1650px) {
  .txt-cabinet-left {
    margin-left: 150px;
  }
}
@media screen and (max-width: 1050px) {
  .txt-cabinet-left {
    order: 2;
    text-align: center;
    margin-left: 0;
    align-self: center;
  }
}

/* GESTION DES IMG / RAYURES */
/* GESTION DES IMG / RAYURES */
/* GESTION DES IMG / RAYURES */
/* GESTION DES IMG / RAYURES */
/* IMG A GAUCHE TXT DROITE*/
.mask-cabinet-left {
  -webkit-mask-image: url("../img/cabinet/mask_left_green.svg");
  mask-image: url("../img/cabinet/mask_left_green.svg");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  width: 824px;
  height: 787px;
  position: relative;
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-left {
    width: 603px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-left {
    -webkit-mask-image: url("../img/cabinet/mask_left_green_mobile.svg");
    mask-image: url("../img/cabinet/mask_left_green_mobile.svg");
    width: 100%;
    height: 865px;
    transform: translateY(21px);
  }
}
.mask-cabinet-left img {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
}
@media screen and (max-width: 610px) {
  .mask-cabinet-left img {
    width: 333px;
    bottom: 110px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
  }
}
.mask-cabinet-left .img-posture {
  right: 50px;
}
@media screen and (max-width: 610px) {
  .mask-cabinet-left .img-posture {
    width: 490px;
    right: 107px;
  }
}
@media screen and (max-width: 502px) {
  .mask-cabinet-left .img-posture {
    width: 368px;
    right: 107px;
  }
}
.mask-cabinet-left .bg-left {
  z-index: 1;
  position: absolute;
  bottom: 161px;
  right: 0;
  width: 862px;
  height: 645px;
  background-image: url("../img/cabinet/rayure_left_green.svg");
  background-repeat: no-repeat;
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-left .bg-left {
    width: 603px;
    height: 448px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-left .bg-left {
    background-image: url("../img/cabinet/rayure_left_green_mobile.svg");
    width: 659px;
    height: 444px;
  }
}

/* IMG A DROITE TXT GAUCHE*/
.mask-cabinet-right {
  -webkit-mask-image: url("../img/cabinet/mask_right_yellow.svg");
  mask-image: url("../img/cabinet/mask_right_yellow.svg");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  width: 824px;
  height: 787px;
  position: relative;
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-right {
    width: 603px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-right {
    -webkit-mask-image: url("../img/cabinet/mask_right_yellow_mobile.svg");
    mask-image: url("../img/cabinet/mask_right_yellow_mobile.svg");
    width: 100%;
    height: 865px;
    transform: translateY(21px);
  }
}
.mask-cabinet-right img {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
}
.mask-cabinet-right .img-approche {
  bottom: 50px;
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-right .img-approche {
    bottom: 88px;
    left: 15px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-right .img-approche {
    width: 443px;
    bottom: 236px;
    left: 50%;
    transform: translateX(-50%) rotate(323deg);
    z-index: 2;
  }
}
@media screen and (max-width: 440px) {
  .mask-cabinet-right .img-approche {
    width: 412px;
    bottom: 253px;
  }
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-right .img-vocation {
    left: -11px;
    height: 729px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-right .img-vocation {
    width: 333px;
    height: unset;
    bottom: 188px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
  }
}
@media screen and (max-width: 470px) {
  .mask-cabinet-right .img-vocation {
    width: 300px;
  }
}
@media screen and (max-width: 377px) {
  .mask-cabinet-right .img-vocation {
    width: 300px;
    bottom: 164px;
  }
}
.mask-cabinet-right .bg-right {
  background-image: url("../img/cabinet/rayure_right_yellow.svg");
  z-index: 1;
  position: absolute;
  bottom: 131px;
  right: 0;
  width: 862px;
  height: 645px;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1050px) {
  .mask-cabinet-right .bg-right {
    width: 603px;
    height: 448px;
    bottom: 131px;
  }
}
@media screen and (max-width: 610px) {
  .mask-cabinet-right .bg-right {
    background-image: url("../img/cabinet/rayure_right_yellow_mobile.svg");
    bottom: 161px;
    width: 659px;
    height: 476px;
  }
}

/* ANIMATION IMG CABINET */
/* ANIMATION IMG CABINET */
/* ANIMATION IMG CABINET */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Animation par défaut */
.scroll-animate {
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.scroll-animate.active {
  opacity: 1;
}

/* LEITMOTIV */
.img-leitmotiv.scroll-animate {
  transform: translateY(40px);
}
@media screen and (max-width: 610px) {
  .img-leitmotiv.scroll-animate {
    transform: translateX(-50%) translateY(40px);
  }
}

.img-leitmotiv.scroll-animate.active {
  transform: translateY(0);
}
@media screen and (max-width: 610px) {
  .img-leitmotiv.scroll-animate.active {
    transform: translateX(-50%) translateY(0);
  }
}

/* APPROCHE */
.img-approche.scroll-animate {
  transform: translateY(40px);
}
@media screen and (max-width: 610px) {
  .img-approche.scroll-animate {
    transform: translateX(-50%) translateY(40px) rotate(323deg);
  }
}

.img-approche.scroll-animate.active {
  transform: translateY(0);
}
@media screen and (max-width: 610px) {
  .img-approche.scroll-animate.active {
    transform: translateX(-50%) translateY(0) rotate(323deg);
  }
}

/* POSTURE */
.img-posture.scroll-animate {
  transform: translateY(40px);
}
@media screen and (max-width: 610px) {
  .img-posture.scroll-animate {
    transform: translateX(-50%) translateY(40px);
  }
}

.img-posture.scroll-animate.active {
  transform: translateY(0);
}
@media screen and (max-width: 610px) {
  .img-posture.scroll-animate.active {
    transform: translateX(-50%) translateY(0);
  }
}

/* VOCATION */
.img-vocation.scroll-animate {
  transform: translateY(40px);
}
@media screen and (max-width: 610px) {
  .img-vocation.scroll-animate {
    transform: translateX(-50%) translateY(40px);
  }
}

.img-vocation.scroll-animate.active {
  transform: translateY(0);
}
@media screen and (max-width: 610px) {
  .img-vocation.scroll-animate.active {
    transform: translateX(-50%) translateY(0px);
  }
}

/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* NOS EXPERTISES */
/* INTRODUCTION*/
/* INTRODUCTION*/
/* INTRODUCTION*/
#expertises {
  background-color: var(--dark);
  transform: translateY(265px);
  position: relative;
  overflow-x: clip;
  scroll-behavior: unset;
  padding-bottom: 95px;
}
@media screen and (max-width: 610px) {
  #expertises {
    transform: translateY(93px);
  }
}

@-moz-document url-prefix() {
  #expertises {
    will-change: transform;
    contain: paint;
  }
}
.container-anim-defil .anim-expertise h2,
.container-anim-defil .anim-expertise p {
  background: var(--black-to-white-grd);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p-intro-section {
  font-family: var(--first-font);
  font-size: var(--fs-24);
  font-style: italic;
  text-align: center;
  font-weight: 200;
  color: white;
  max-width: 865px;
  margin: 0px auto 76px;
  padding: 0 60px;
}
@media screen and (max-width: 650px) {
  .p-intro-section {
    font-size: var(--fs-20);
  }
}
.p-intro-section span {
  font-family: Alex brush, sans-serif;
  font-size: var(--fs-49);
}
@media screen and (max-width: 650px) {
  .p-intro-section span {
    font-size: var(--fs-40);
  }
}

@media screen and (max-width: 650px) {
  .img-intro-expertise {
    width: unset !important;
  }
}

/* CONTENT */
/* CONTENT */
/* CONTENT */
.h2-intro-section.h2-expertise {
  margin: 44px 0 110px;
  color: white;
  font-size: var(--fs-77);
  padding: 0 50px;
}
@media screen and (max-width: 750px) {
  .h2-intro-section.h2-expertise {
    margin: 44px 0 40px;
  }
}

@media screen and (max-width: 680px) {
  .h2-expertise {
    font-size: var(--fs-60) !important;
  }
}
@media screen and (max-width: 620px) {
  .h2-expertise {
    font-size: var(--fs-49) !important;
  }
}
@media screen and (max-width: 620px) {
  .h2-expertise {
    padding: 0 10px !important;
    font-size: var(--fs-40) !important;
  }
}
@media screen and (max-width: 360px) {
  .h2-expertise {
    padding: 0 5px !important;
    font-size: var(--fs-36) !important;
  }
}

.container-section-expertise {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  overflow: hidden;
  width: 856px;
}
@media screen and (max-width: 1500px) {
  .container-section-expertise {
    max-width: 608px;
    overflow: unset;
  }
}
@media screen and (max-width: 750px) {
  .container-section-expertise {
    max-width: 340px;
    overflow: unset;
  }
}
.container-section-expertise .content-conseil {
  flex-direction: row;
}

.container-content-expertise {
  display: flex;
  flex-direction: column;
  color: white;
  font-family: var(--first-font);
  align-items: center;
  margin-bottom: 34px;
  font-size: var(--fs-30);
}
@media screen and (max-width: 1500px) {
  .container-content-expertise {
    font-size: var(--fs-24);
  }
}
@media screen and (max-width: 750px) {
  .container-content-expertise {
    font-size: var(--fs-18);
  }
}

.p-content-expertise {
  background-color: var(--yellow);
  border-radius: 25px;
  font-weight: 800;
  padding: 2px 17px;
  height: -moz-fit-content;
  height: fit-content;
  text-align: center;
}

.arrow {
  background-image: url(../img/expertise/arrow.svg);
  width: 93.86px;
  height: 15px;
  background-repeat: no-repeat;
  margin: 0 6px;
}

.arrow-right {
  transform: scaleX(-1);
}

.describ-content-expertise {
  font-weight: 200;
  font-size: var(--fs-18);
  max-width: 328.38px;
}
@media screen and (max-width: 750px) {
  .describ-content-expertise {
    font-size: var(--fs-14);
  }
}

.describ-un {
  text-align: left;
}

.describ-deux {
  text-align: right;
}

.exp-invert {
  flex-direction: row-reverse !important;
}

/* ANIMATION */
/* ANIMATION */
/* ANIMATION */
.exp-left.scroll-animate {
  transform: translateX(100px);
  opacity: 0;
  transition: transform 1.5s ease, opacity 0.6s ease;
}

.exp-right.scroll-animate {
  transform: translateX(-100px);
  opacity: 0;
  transition: transform 1.5s ease, opacity 0.6s ease;
}

/* Ajustement du translate en fonction du contenu */
.exp-un.scroll-animate.active {
  transform: translateX(-106px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-un.scroll-animate.active {
    transform: translateX(0px);
  }
}

.exp-deux.scroll-animate.active {
  transform: translateX(149px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-deux.scroll-animate.active {
    transform: translateX(53px);
  }
}
@media screen and (max-width: 750px) {
  .exp-deux.scroll-animate.active {
    transform: translateX(0px);
  }
}

.exp-quatre.scroll-animate.active {
  transform: translateX(216px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-quatre.scroll-animate.active {
    transform: translateX(131px);
  }
}
@media screen and (max-width: 750px) {
  .exp-quatre.scroll-animate.active {
    transform: translateX(35px);
  }
}

.exp-trois.scroll-animate.active,
.exp-cinq.scroll-animate.active {
  transform: translateX(-207px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-trois.scroll-animate.active,
  .exp-cinq.scroll-animate.active {
    transform: translateX(-123px);
  }
}
@media screen and (max-width: 750px) {
  .exp-trois.scroll-animate.active,
  .exp-cinq.scroll-animate.active {
    transform: translateX(-28px);
  }
}

/* GESTION BACKGROUND */
/* GESTION BACKGROUND */
/* GESTION BACKGROUND */
.bloc-bg {
  overflow: hidden;
  width: 100%;
}

.bg-conseil-left,
.bg-conseil-right {
  background-image: url("../img/expertise/bg-left-green.svg");
  width: 619px;
  height: 1289px;
  position: absolute;
  z-index: -1;
  background-repeat: no-repeat;
}

.bg-conseil-right {
  top: 731px;
  right: -150px;
  transform: scaleX(-1);
}
@media screen and (max-width: 1781px) {
  .bg-conseil-right {
    right: -270px;
  }
}
@media screen and (max-width: 1040px) {
  .bg-conseil-right {
    top: 916px;
    right: -341px;
  }
}
@media screen and (max-width: 750px) {
  .bg-conseil-right {
    top: 1118px;
  }
}
@media screen and (max-width: 600px) {
  .bg-conseil-right {
    right: -462px;
  }
}

.bg-conseil-left {
  top: 404px;
  left: -150px;
}
@media screen and (max-width: 1781px) {
  .bg-conseil-left {
    left: -270px;
  }
}
@media screen and (max-width: 1040px) {
  .bg-conseil-left {
    top: 1457px;
    left: -341px;
  }
}
@media screen and (max-width: 750px) {
  .bg-conseil-left {
    top: 385px;
  }
}
@media screen and (max-width: 600px) {
  .bg-conseil-left {
    left: -462px;
  }
}

/* MOBILITE */
/* MOBILITE */
/* MOBILITE */
/* MOBILITE */
/* MOBILITE */
.container-first-groupe-mobilite {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  max-width: 1400px;
  margin: 0 auto;
  gap: 50px;
}
@media screen and (max-width: 1500px) {
  .container-first-groupe-mobilite {
    gap: 20px;
  }
}
@media screen and (max-width: 1040px) {
  .container-first-groupe-mobilite {
    flex-direction: column;
    margin-bottom: 20px;
  }
}

.container-section-mobilite {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 608px;
  margin: 0 auto;
}
@media screen and (max-width: 1500px) {
  .container-section-mobilite {
    max-width: 460px;
  }
}
@media screen and (max-width: 750px) {
  .container-section-mobilite {
    max-width: 340px;
  }
}

.h3-mobilite {
  font-size: var(--fs-30);
  font-family: var(--first-font);
  color: white;
  font-weight: 300;
  margin-bottom: 40px;
  text-align: center;
}
@media screen and (max-width: 750px) {
  .h3-mobilite {
    font-size: var(--fs-24);
  }
}

.p-content-mobilite {
  background-color: var(--green);
  margin-bottom: 34px;
}

/* GESTION BACKGROUND */
/* GESTION BACKGROUND */
/* GESTION BACKGROUND */
.bg-conseil-left.bg-mobilite {
  background-image: url("../img/expertise/bg-left-yellow.svg");
}
@media screen and (max-width: 1040px) {
  .bg-conseil-left.bg-mobilite {
    background-image: url("../img/expertise/bg-left-yellow-mobile.svg");
  }
}

.bg-conseil-right.bg-mobilite {
  background-image: url("../img/expertise/bg-right-yellow.svg");
}
@media screen and (max-width: 1040px) {
  .bg-conseil-right.bg-mobilite {
    background-image: url("../img/expertise/bg-left-yellow-mobile.svg");
  }
}

.bg-conseil-right.bg-mobilite {
  bottom: -543px;
  top: unset;
  opacity: 0.5;
  transform: scaleX(-1) rotate(3deg);
}
@media screen and (max-width: 1040px) {
  .bg-conseil-right.bg-mobilite {
    bottom: 235px;
  }
}
@media screen and (max-width: 750px) {
  .bg-conseil-right.bg-mobilite {
    bottom: -548px;
    background-image: url("../img/expertise/bg-right-yellow.svg");
  }
}

.bg-conseil-left.bg-mobilite {
  bottom: -324px;
  top: unset;
  opacity: 0.5;
  transform: rotate(3deg);
}
@media screen and (max-width: 750px) {
  .bg-conseil-left.bg-mobilite {
    bottom: -5px;
  }
}

/* ANIMATION */
/* ANIMATION */
/* ANIMATION */
/* Ajustement du translate en fonction du contenu */
.exp-six.scroll-animate.active {
  transform: translateX(-133px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-six.scroll-animate.active {
    transform: translateX(-89px);
  }
}
@media screen and (max-width: 750px) {
  .exp-six.scroll-animate.active {
    transform: translateX(-60px);
  }
}

.exp-sept.scroll-animate.active {
  transform: translateX(172px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-sept.scroll-animate.active {
    transform: translateX(120px);
  }
}
@media screen and (max-width: 750px) {
  .exp-sept.scroll-animate.active {
    transform: translateX(84px);
  }
}

.exp-huit.scroll-animate.active {
  transform: translateX(-127px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-huit.scroll-animate.active {
    transform: translateX(-84px);
  }
}
@media screen and (max-width: 750px) {
  .exp-huit.scroll-animate.active {
    transform: translateX(-56px);
  }
}

.exp-neuf.scroll-animate.active {
  transform: translateX(209px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-neuf.scroll-animate.active {
    transform: translateX(150px);
  }
}
@media screen and (max-width: 750px) {
  .exp-neuf.scroll-animate.active {
    transform: translateX(106px);
  }
}

.exp-dix.scroll-animate.active {
  transform: translateX(-232px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-dix.scroll-animate.active {
    transform: translateX(-180px);
  }
}
@media screen and (max-width: 750px) {
  .exp-dix.scroll-animate.active {
    transform: translateX(-127px);
  }
}

.exp-onze.scroll-animate.active {
  transform: translateX(67px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-onze.scroll-animate.active {
    transform: translateX(48px);
  }
}
@media screen and (max-width: 750px) {
  .exp-onze.scroll-animate.active {
    transform: translateX(29px);
  }
}

.exp-douze.scroll-animate.active {
  transform: translateX(-159px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-douze.scroll-animate.active {
    transform: translateX(-121px);
  }
}
@media screen and (max-width: 750px) {
  .exp-douze.scroll-animate.active {
    transform: translateX(-82px);
  }
}

.exp-treize.scroll-animate.active {
  transform: translateX(93px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-treize.scroll-animate.active {
    transform: translateX(68px);
  }
}
@media screen and (max-width: 750px) {
  .exp-treize.scroll-animate.active {
    transform: translateX(45px);
  }
}

.exp-quatorze.scroll-animate.active {
  transform: translateX(-36px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-quatorze.scroll-animate.active {
    transform: translateX(-12px);
  }
}
@media screen and (max-width: 750px) {
  .exp-quatorze.scroll-animate.active {
    transform: translateX(0px);
  }
}

.exp-quinze.scroll-animate.active {
  transform: translateX(168px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-quinze.scroll-animate.active {
    transform: translateX(121px);
  }
}
@media screen and (max-width: 750px) {
  .exp-quinze.scroll-animate.active {
    transform: translateX(82px);
  }
}

.exp-seize.scroll-animate.active {
  transform: translateX(-245px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-seize.scroll-animate.active {
    transform: translateX(-179px);
  }
}
@media screen and (max-width: 750px) {
  .exp-seize.scroll-animate.active {
    transform: translateX(-127px);
  }
}

.exp-dixsept.scroll-animate.active {
  transform: translateX(109px);
  opacity: 1;
}
@media screen and (max-width: 1500px) {
  .exp-dixsept.scroll-animate.active {
    transform: translateX(71px);
  }
}
@media screen and (max-width: 750px) {
  .exp-dixsept.scroll-animate.active {
    transform: translateX(47px);
  }
}

/* NOS FILIERES */
/* NOS FILIERES */
/* NOS FILIERES */
/* NOS FILIERES */
/* NOS FILIERES */
/* NOS FILIERES */
#filieres {
  transform: translateY(265px);
  position: relative;
  background-color: white;
  background-image: url(../img/filieres/bg.svg);
  width: 100%;
  height: 862px;
  background-repeat: no-repeat;
  background-position: bottom center;
  overflow-x: clip;
  scroll-behavior: unset;
}
@media screen and (max-width: 610px) {
  #filieres {
    transform: translateY(93px);
  }
}
@media screen and (max-width: 525px) {
  #filieres {
    height: 809px;
  }
}
@media screen and (max-width: 380px) {
  #filieres {
    height: 774px;
  }
}
#filieres .sculture-fillieres {
  position: absolute;
  bottom: 0;
  left: 50%;
  pointer-events: none;
}
@media screen and (max-width: 411px) {
  #filieres .sculture-fillieres {
    width: 800px;
  }
}
@media screen and (max-width: 380px) {
  #filieres .sculture-fillieres {
    width: 750px;
  }
}

@-moz-document url-prefix() {
  #filieres {
    will-change: transform;
    contain: paint;
  }
}
/* INTRODUCTION*/
.intro-filieres .anim-filieres h2,
.intro-filieres .anim-filieres p {
  background: var(--white-to-black-grd);
}

.content-gb-filieres {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 268px;
  gap: 130px;
}
@media screen and (max-width: 460px) {
  .content-gb-filieres {
    gap: 100px;
  }
}
@media screen and (max-width: 411px) {
  .content-gb-filieres {
    gap: 85px;
  }
}
@media screen and (max-width: 380px) {
  .content-gb-filieres {
    gap: 79px;
  }
}
.content-gb-filieres .content-filieres {
  width: 400px;
}
.content-gb-filieres .content-filieres .h3-filieres {
  font-family: var(--first-font);
  font-weight: 700;
  font-size: var(--fs-50);
  color: black;
  position: absolute;
}
@media screen and (max-width: 1170px) {
  .content-gb-filieres .content-filieres .h3-filieres {
    font-size: var(--fs-40);
  }
}
@media screen and (max-width: 410px) {
  .content-gb-filieres .content-filieres .h3-filieres {
    font-size: var(--fs-30);
  }
}

.content-right-filieres {
  padding-right: 20px;
}
@media screen and (max-width: 411px) {
  .content-right-filieres {
    padding-right: 10px;
  }
}
@media screen and (max-width: 380px) {
  .content-right-filieres {
    padding-right: 5px;
  }
}

.content-left-filieres {
  padding-left: 20px;
}
@media screen and (max-width: 411px) {
  .content-left-filieres {
    padding-left: 10px;
  }
}
@media screen and (max-width: 380px) {
  .content-left-filieres {
    padding-left: 5px;
  }
}

.h3-industrie {
  left: 389px;
  transform: rotate(9.2deg);
  bottom: 277px;
}
@media screen and (max-width: 1520px) {
  .h3-industrie {
    left: 212px;
  }
}
@media screen and (max-width: 1170px) {
  .h3-industrie {
    left: 114px;
    bottom: 275px;
  }
}
@media screen and (max-width: 850px) {
  .h3-industrie {
    left: 73px;
    bottom: 179px;
    transform: rotate(291deg);
    background-color: white;
  }
}
@media screen and (max-width: 645px) {
  .h3-industrie {
    left: -14px;
  }
}
@media screen and (max-width: 460px) {
  .h3-industrie {
    left: -19px;
    bottom: 207px;
  }
}

.h3-services {
  right: 410px;
  transform: rotate(-9.2deg);
  bottom: 277px;
}
@media screen and (max-width: 1520px) {
  .h3-services {
    right: 238px;
  }
}
@media screen and (max-width: 1170px) {
  .h3-services {
    bottom: 275px;
    right: 134px;
  }
}
@media screen and (max-width: 850px) {
  .h3-services {
    right: 73px;
    bottom: 179px;
    transform: rotate(-291deg);
    background-color: white;
  }
}
@media screen and (max-width: 645px) {
  .h3-services {
    right: -14px;
  }
}
@media screen and (max-width: 460px) {
  .h3-services {
    right: -19px;
    bottom: 207px;
  }
}

.ul-industrie {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.ul-services {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.list-filieres {
  list-style-type: none;
  font-family: var(--second-font);
  font-size: var(--fs-25);
  margin-bottom: 34px;
}
@media screen and (max-width: 525px) {
  .list-filieres {
    font-size: var(--fs-18);
  }
}
.list-filieres.list-services {
  text-align: left;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}
.list-filieres.list-services::before {
  content: "";
  width: 92%;
  background-color: var(--yellow);
  height: 30px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.list-filieres.list-industrie {
  text-align: right;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}
.list-filieres.list-industrie::before {
  content: "";
  width: 92%;
  background-color: #7eafa1;
  height: 30px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

/* ANIMATION */
.sculture-fillieres.scroll-animate {
  transform: translateX(-50%) translateY(40px);
}

.sculture-fillieres.scroll-animate.active {
  transform: translateX(-50%) translateY(0px);
}

/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
#contact {
  transform: translateY(265px);
  position: relative;
  background-color: var(--dark);
  width: 100%;
}
@media screen and (max-width: 610px) {
  #contact {
    transform: translateY(93px);
  }
}

.container-contact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: var(--first-font);
  font-weight: 400;
  color: white;
  font-size: var(--fs-22);
  margin-bottom: 50px;
}
@media screen and (max-width: 750px) {
  .container-contact {
    font-size: var(--fs-18);
  }
}
.container-contact img {
  max-width: 300px;
  margin-bottom: 35px;
}
@media screen and (max-width: 750px) {
  .container-contact img {
    max-width: 215px;
  }
}
.container-contact .txt-contact {
  margin-bottom: 20px;
}
.container-contact .txt-contact span {
  font-weight: 700;
}

.anim-link {
  transition: transform 0.2s ease-in;
}
.anim-link:hover {
  transform: scale(1.1);
}

.container-mention {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 600px;
  margin: 0 auto;
  font-family: var(--first-font);
  color: white;
}
@media screen and (max-width: 470px) {
  .container-mention {
    flex-direction: column;
    gap: 3px;
  }
}
.container-mention a {
  text-decoration: none;
  color: white;
  text-align: center;
  margin-bottom: 20px;
}
.container-mention a img {
  transform: translate(7px, 11px);
}
@media screen and (max-width: 470px) {
  .container-mention a img {
    transform: translate(7px, 11px);
  }
}/*# sourceMappingURL=style.css.map */