:root {
  --primary-font: "Lato", sans-serif;
  --title-color: #aab4b3;
  --body-color: #5f5f5f;
  --yellow: #fcd676;
  --transition-03s: all 0.3s ease-in-out;

  --blue-color: #0054a6;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  outline: none;
}

/* Works on Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: red;
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 8px;
  padding: 10px;
}

*::-webkit-scrollbar-track {
  background: red;
}

*::-webkit-scrollbar-thumb {
  background-color: #000;
}

::-moz-selection {
  color: #fff;
  background: #000;
  text-shadow: none;
}

::selection {
  color: #fff;
  background: #000;
  text-shadow: none;
}

html {
  font-size: 62.5%;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  line-height: 1;
  font-family: var(--primary-font);
  font-size: 1.6rem;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
  font-size: inherit;
  margin: 0;
}

ol,
ul,
li {
  list-style: none;
}

a {
  outline: none;
  color: inherit;
  background-color: transparent;
  text-decoration: none;
  transition: var(--transition-03s);
  -webkit-transition: var(--transition-03s);
  -moz-transition: var(--transition-03s);
  -ms-transition: var(--transition-03s);
  -o-transition: var(--transition-03s);
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

main {
  display: block;
}

section {
  display: flex;
  flex-direction: column;
  width: 100%;
}

img {
  border-style: none;
}

.img-res {
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: bottom;
}

/* ! Global css */

.opac {
  opacity: 0;
}

.cnt {
  width: 100%;
  margin: 0 auto;
}

.cnt_wp {
  display: flex;
  width: 100%;
}

.cnt_1720 {
  max-width: 1720px;
}

.reused_title,
.HomeReused_title {
  color: var(--title-color);
  font-size: 6.8rem;
  font-weight: 800;
  line-height: 7.4rem;
  margin-bottom: 3rem;
}

.reused_txt {
  color: var(--body-color);
  font-size: 2rem;
  font-weight: 500;
  line-height: 2.6rem;
}

.reused_txt ul {
  display: flex;
  flex-direction: column;
  padding-left: 1rem;
}

.reused_txt ul li {
  list-style: disc;
  list-style-position: inside;
}

.reused_smaller {
  display: flex;
  width: 100%;
  margin-top: 5rem;
  flex-direction: column;
}

.reused_smaller-title {
  color: var(--title-color);
  font-size: 3rem;
  font-weight: 800;
  line-height: 3.5rem;
  width: 70%;
}

.reused_smaller-txt {
  flex-direction: column;
  display: flex;
  color: var(--body-color);
  font-size: 2rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.5rem;
  margin-top: 2rem;
  gap: 0.5rem;
}

.reused_smaller-txt li {
  padding-left: 1.4rem;
  position: relative;
}

.reused_smaller-txt li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 7px;
  height: 7px;
  background: var(--body-color);
  border-radius: 100%;
  transform: translateY(-50%);
}

.reused_btn {
  display: flex;
  margin-top: 3.5rem;
}

.reused_btn a {
  border-radius: 5px;
  border: 1px solid var(--blue-color);
  color: var(--blue-color);
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 500;
  padding: 0.8rem 2rem;
}

.reused_btn a:hover {
  background: var(--title-color);
  color: #fff;
  border-color: var(--title-color);
}

.swiper {
  width: 100%;
  height: 100%;
}

.btnDowload {
  display: flex;
}

.btnDowload a {
  color: var(--title-color);
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 500;
  display: flex;
  gap: 1rem;
}

.btnDowload a:hover {
  color: var(--body-color);
}

/* ! Header */
.header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  padding: 2.5rem 0;
  z-index: 9999;
  transition: var(--transition-03s);
}

.header.hide-header {
  transform: translateY(-150%);
  opacity: 0;
  pointer-events: none;
}

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

.header_logo {
  width: 15rem;
}

.header.header-active {
  background: rgba(255, 255, 255, 0.5);
  height: 10rem;
  padding: 2rem 5% 2rem 5%;
  align-items: center;
}

.header_burger {
  cursor: pointer;
}

.menu_btn {
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  padding: 0;
  width: 8rem;
  position: relative;
}

.menu_photo {
    display: none;
}

.menu_btn svg {
  width: 100%;
  height: 100%;
  display: block;
}

.line {
  fill: none;
  stroke: var(--blue-color);
  stroke-width: 6;
  transition:
    stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.line1 {
  stroke-dasharray: 60 207;
  stroke-width: 2;
}
.line2 {
  stroke-dasharray: 60 60;
  stroke-width: 2;
}
.line3 {
  stroke-dasharray: 60 207;
  stroke-width: 2;
}
.opened .line1 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 2;
}
.opened .line2 {
  stroke-dasharray: 1 60;
  stroke-dashoffset: -30;
  stroke-width: 2;
}
.opened .line3 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 2;
}

/* ! Menu overlay */
.header_overlay {
  position: fixed;
  inset: 0;
  z-index: -1;
  background: #fff;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.5s ease;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 10%;
}

.header_overlay.is-open {
  opacity: 1;
  pointer-events: all;
  z-index: 999;
}

body.is-open {
    overflow: hidden;
}

/* Nav links */
.header_overlay-nav ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.header_overlay-nav ul li a {
  color: var(--title-color);
  font-size: 4rem;
  font-weight: 800;
  line-height: 1;
  transition: var(--transition-03s);
  display: flex;
  gap: 2rem;
}

.header_overlay-nav ul li a::after {
  content: "";
  background: url("../assets/images/svg/logo_nav.png") center center no-repeat;
  width: 10rem;
  background-size: 100%;
  transition: var(--transition-03s);
  opacity: 0;
  transform: translateX(20px);
}

.header_overlay-nav ul li a:hover,
.header_overlay-nav ul li.active a {
  color: var(--blue-color);
}

.header_overlay-nav ul li a:hover::after,
.header_overlay-nav ul li.active a::after {
  opacity: 1;
  transform: translateX(0px);
}

.header_overlay-nav ul li a.active {
  opacity: 1;
  transform: translateX(0px);
}

/* Nav fades in slightly after overlay */
.header_overlay-nav {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.4s ease 0.25s,
    transform 0.4s ease 0.25s;
}

.header_overlay.is-open .header_overlay-nav {
  opacity: 1;
  transform: translateY(0);
}

.lang {
  display: flex;
  gap: 2rem;
  margin-top: 3rem;
}

.lang a {
  color: var(--title-color);
  font-size: 2rem;
  font-weight: 800;
  position: relative;
  width: 70px;
  height: 60px;
  display: flex;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lang a::after {
  content: "";
  width: 70px;
  height: 60px;

  background: url("../assets/images/svg/lang_nav.png") center center no-repeat;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  opacity: 0;
  transition: var(--transition-03s);
}

.lang a:hover,
.lang a.active {
  color: #fff;
}

.lang a:hover::after,
.lang a.active::after {
  opacity: 1;
}

.headers_overlay-images {
  position: relative;
  width: 50%;
  margin-left: auto;
}

.nav_nature {
  position: absolute;
  right: 6.5%;
  bottom: 22.3%;
  width: 25%;
}

.nav_yop {
  position: absolute;
  right: 26%;
  bottom: 4%;
  width: 20%;
}

.nav_fraise {
  position: absolute;
  right: 37%;
  bottom: 6%;
  width: 18%;
}

.nav_fruits {
  position: absolute;
  left: 29%;
  bottom: 12%;
  width: 23%;
}

.nav_tropical {
  position: absolute;
  left: 4%;
  bottom: 11%;
  width: 29%;
}

.nav_banane {
  position: absolute;
  left: 14%;
  bottom: -1%;
  width: 30%;
}

.nav_vanille {
  position: absolute;
  left: 0%;
  bottom: 28%;
  width: 26%;
}

.nav_bobab {
  position: absolute;
  right: 13%;
  bottom: 6%;
  width: 46%;
}

.nav_man {
  position: absolute;
  left: 1%;
  bottom: 16%;
  width: 79%;
}

.nav_tree {
  position: absolute;
  right: 0%;
  bottom: 21%;
  width: 88%;
}

.menu_photo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(0.94) translateY(14px);
  transition:
    opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.menu_photo.active {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}

.headers_overlay-images {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.4s ease 0.25s,
    transform 0.4s ease 0.25s;
}

.header_overlay.is-open .headers_overlay-images {
  opacity: 1;
  transform: translateY(0);
}

/* ! Footer */
.footer {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.footer_top {
  height: 100vh;
  background: url("../assets/images/svg/footer_bg.png") center center repeat;
  padding: 5rem 0;
}

.footer_top .cnt_wp {
  align-items: center;
}

.footer_nav {
  width: 25%;
}

.footer_nav ul {
  display: flex;
  flex-direction: column;
  gap: 6rem;
}

.footer_nav li a {
  color: var(--title-color);
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 2.5rem;
}

.footer_nav li a:hover {
  color: var(--blue-color);
}

.footer_images {
  width: 60%;
  margin-left: auto;
  padding: 0 2%;
  position: relative;
}

.footer_images .opac {
  opacity: 0;
}

.footer_shapeLogo {
  position: absolute;
  left: 14%;
  top: 0%;
  width: 29%;
}

.footer_contact {
  position: absolute;
  left: 3%;
  bottom: -3%;
  width: 67%;
}

.footer_contact-desc {
  position: absolute;
  left: 18%;
  top: 29%;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.footer_contact-desc span,
.footer_eclosia span,
.footer_mim span {
  color: #3b3b3b;
  font-size: 2.5rem;
  font-weight: 700;
}

.footer_contact-desc ul {
  display: flex;
  gap: 2rem;
  justify-content: center;
}

.footer_circle {
  position: absolute;
  top: 9%;
  left: 29%;
  width: 44%;
}

.footer_eclosia {
  position: absolute;
  top: 35%;
  left: 29%;
  width: 47%;
  gap: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footer_circleSmall {
  position: absolute;
  bottom: 0%;
  right: 14%;
  width: 41%;
}

.footer_mim {
  position: absolute;
  top: 35%;
  left: 29%;
  width: 47%;
  gap: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footer_mim img {
  width: 60%;
}

.footer_carton {
  position: absolute;
  top: 20%;
  right: 3%;
  width: 33%;
}

.footer_bottom {
  padding: 3rem 0;
}

.footer_bottom .cnt_wp {
}

.footer_bottom-left {
  width: auto;
}

.footer_bottom-left ul {
  display: flex;
}

.footer_bottom-left ul a {
  color: var(--body-color);
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
}

.footer_bottom-left ul a:hover,
.footer_copywrite a:hover {
  color: var(--blue-color);
}

.footer_copywrite {
  color: var(--body-color);
  font-size: 1.4rem;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  margin-left: auto;
}

/* ! homepage */

.banner {
  height: 100vh;
  display: flex;
  justify-content: flex-end;
}

.banners_images {
  width: 90%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

.banner_right-girl {
  position: absolute;
  bottom: 22%;
  width: 25%;
  right: 16%;
}

.banner_right-shape {
  position: absolute;
  bottom: 10%;
  width: 13%;
  right: 6%;
}

.banner_right-boba {
  position: absolute;
  bottom: 10%;
  width: 21%;
  right: 1%;
}

.banner_right-granma {
  position: absolute;
  bottom: 0;
  width: 33%;
  right: 5%;
}

.banner_centered-flamboyant {
  position: absolute;
  width: 30%;
  left: 33%;
  top: 32%;
}

.banner_centred-man {
  position: absolute;
  width: 41%;
  left: 50%;
  transform: translateX(-50%) !important;
  bottom: 0;
}

.banner_left-man {
  position: absolute;
  width: 22%;
  left: 23%;
  bottom: 33%;
}

.banner_left-girl {
  position: absolute;
  width: 35%;
  left: 6%;
  bottom: 0;
}

.banner_left-shape {
  position: absolute;
  width: 17%;
  left: 5%;
  bottom: 0%;
}

.banner_left-tree {
  position: absolute;
  width: 38%;
  left: 5%;
  bottom: 5%;
}

/* ? home page about */
.Home_about {
  min-height: 100vh;
  /* padding: 40vh 0; */
  position: relative;
  z-index: 1;
}

.Home_about .cnt {
  height: 100%;
}

.Home_about .cnt_wp {
  height: 100%;
  align-items: center;
}

.Home_about_desc {
  width: 37.2%;
}

.Home_about_img {
  width: 60%;
  margin-left: auto;
  position: relative;
  left: 5%;
}

.about_shape-petal {
  position: absolute;
  top: 19%;
  right: 19%;
  width: 26%;
}

.about_shape-slice {
  position: absolute;
  top: 4%;
  left: 50%;
  width: 29%;
}

.about_shape-boba {
  position: absolute;
  bottom: 8%;
  right: 0%;
  width: 46%;
}

.about_shape-home {
  position: absolute;
  bottom: 17%;
  left: 0%;
  width: 46%;
}

.about_shape-woman {
  position: absolute;
  bottom: 21%;
  left: 7%;
  width: 56%;
}

.about_shape-children {
  position: absolute;
  bottom: 16%;
  left: 16%;
  width: 48%;
}

/* ? home product */
.Home_produit {
  min-height: 120vh;
}

.Home_produit .cnt {
  height: 100%;
}

.Home_produit .cnt_wp {
  /* height: 100%;
	align-items: center; */
}

.Home_produit_img {
  width: 50%;
  position: relative;
  z-index: 20;
}

.produit-layout {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  z-index: 35;
}

.produit-layout.is-active {
  opacity: 1;
  pointer-events: all;
}

/* .animated_spoon {
	display: none;
} */

.product_shape-yoplaitBase {
  position: absolute;
  right: 0;
  bottom: 13%;
  width: 89%;
}

.product_shape-laicaille {
  position: absolute;
  bottom: 21%;
  right: 29%;
  width: 16.9%;
}

.product_shape-ilegourmande {
  position: absolute;
  top: 33%;
  right: 30%;
  width: 11%;
}

.product_shape-yop {
  position: absolute;
  bottom: 23%;
  right: 39%;
  width: 9.5%;
}

.product_shape-vanille {
  position: absolute;
  bottom: 20%;
  left: 39%;
  width: 14.3%;
}

.product_shape-skyr {
  position: absolute;
  bottom: 23%;
  left: 28%;
  width: 15%;
}

.product_shape-dahi {
  position: absolute;
  bottom: 22%;
  left: 16.5%;
  width: 15%;
}

.product_shape-coco {
  position: absolute;
  top: 35%;
  left: 27%;
  width: 15%;
}

.product_shape-pitaya {
  position: absolute;
  bottom: 46%;
  left: 11%;
  width: 14%;
}

.product_shape-greek {
  position: absolute;
  bottom: 45%;
  right: 48%;
  width: 12%;
}

.product_shape-boba {
  position: absolute;
  bottom: -4%;
  left: -1%;
  width: 31%;
}

/* ! product candia */
.candia_table {
  position: absolute;
  width: 99%;
  left: 0%;
  bottom: -10%;
}

.candia_man {
  position: absolute;
  width: 67%;
  right: 10%;
  bottom: 24%;
}

.candia_boba {
  position: absolute;
  width: 36%;
  right: -1%;
  bottom: 25%;
}

.candia_laitsmall {
  position: absolute;
  width: 18%;
  left: 7%;
  bottom: 31%;
}

.candia_peretteAmande {
  position: absolute;
  width: 12%;
  right: 5%;
  bottom: -3%;
}

.candia_peretteChocolat {
  position: absolute;
  width: 12%;
  right: 13%;
  bottom: -3%;
}

.candia_silhouette {
  position: absolute;
  width: 18%;
  right: 24%;
  bottom: -5%;
}

.candia_candyup {
  position: absolute;
  width: 15.5%;
  left: 28%;
  bottom: -2%;
}

.candia_laitmiddle {
  position: absolute;
  width: 14%;
  left: 42%;
  bottom: -3%;
}

.candia_laitleft {
  position: absolute;
  width: 17%;
  left: 13%;
  bottom: -3%;
}
/* ! product j */
.j_table {
  position: absolute;
  bottom: -67%;
  left: 0;
  width: 81%;
}
.j_girl {
  position: absolute;
  bottom: -38%;
  left: 5%;
  width: 70%;
}
.j_peche {
  position: absolute;
  bottom: 3%;
  left: 7%;
  width: 14%;
}
.j_mojito {
  position: absolute;
  bottom: -16%;
  right: 19%;
  width: 13%;
}
.j_boba {
  position: absolute;
  bottom: -41%;
  right: -2%;
  width: 35%;
}
.j_cartonvert {
  position: absolute;
  bottom: -53%;
  right: 11%;
  width: 43%;
}
.j_cartonjaune {
  position: absolute;
  bottom: -55%;
  left: 1%;
  width: 46%;
}
.j_ananas {
  position: absolute;
  bottom: -56%;
  right: 35%;
  width: 14%;
}
.j_pomme {
  position: absolute;
  bottom: -56%;
  right: 50%;
  width: 15%;
}
.j_raisin {
  position: absolute;
  bottom: -56%;
  left: 20%;
  width: 14%;
}

/* ! product miko */
.cone_table {
  position: absolute;
  bottom: -20%;
  left: 8%;
  width: 80%;
}
.cone_couple {
  position: absolute;
  bottom: 6%;
  left: 8%;
  width: 82%;
}
.cone_cartonViolet {
  position: absolute;
  bottom: -8%;
  left: 6%;
  width: 30%;
}
.cone_carton {
  position: absolute;
  bottom: 3%;
  right: 24%;
  width: 34%;
}
.cone_boba {
  position: absolute;
  bottom: 14%;
  right: -1%;
  width: 33%;
}
.cone_zit {
  position: absolute;
  bottom: 5%;
  right: 7%;
  width: 14%;
}
.cone_cone {
  position: absolute;
  bottom: 9%;
  left: 0%;
  width: 19%;
}
.cone_ptipoRouge {
  position: absolute;
  bottom: -10%;
  left: 12%;
  width: 21%;
}
.cone_startChocolat {
  position: absolute;
  bottom: -8%;
  right: 9%;
  width: 34%;
}
.cone_starVanille {
  position: absolute;
  bottom: -1%;
  right: 9%;
  width: 34%;
}
.cone_ptipVanille {
  position: absolute;
  bottom: -10%;
  right: 34%;
  width: 21%;
}
.cone_classic {
  position: absolute;
  bottom: -12%;
  left: 26%;
  width: 27%;
}

.Home_produit_desc {
  width: 38%;
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.Home_produit_slider {
  width: 100%;
  display: flex;
  margin-top: 6rem;
  position: relative;
  flex-direction: column;
}

.product_swiper-title {
  color: var(--title-color);
  font-size: 3rem;
  font-weight: 800;
  line-height: 4rem;
  margin-bottom: 1rem;
}

.product_swiper-txt {
  color: var(--body-color);
  font-size: 2rem;
  font-weight: 500;
  line-height: 2.6rem;
}

.reused_txt {
  color: var(--body-color);
  font-size: 2rem;
  font-weight: 500;
  line-height: 2.6rem;
}

.product_swiper-btn {
  display: flex;
  margin-top: 1.8rem;
}

.product_swiper-btn a {
  border-radius: 5px;
  border: 1px solid var(--blue-color);
  color: var(--blue-color);
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 500;
  padding: 0.8rem 2rem;
}

.product_swiper-btn a:hover {
  background: var(--title-color);
  color: #fff;
  border-color: var(--title-color);
}

.Home_produit_slider .swiper-pagination {
  position: inherit;
  text-align: left;
  transform: none;
  transition: opacity 0.3s;
  z-index: 10;
  bottom: initial;
  left: initial;
  top: initial;
  width: 100%;
  margin-top: 2rem;
}

.swiper-pagination-bullet {
  background: var(--yellow);
  display: inline-block;
  height: 15px;
  opacity: 1;
  width: 15px;
  transition: var(--transition-03s);
}

.swiper-pagination-bullet-active {
  background: var(--title-color);
}

/* ! Engagement */
.Home_engagement {
  /* height: 100vh; */
  padding: 20vh 0;
  position: relative;
}

.Home_engagement_carton {
  position: absolute;
  left: 0;
  top: 0;
  width: 30%;
}

.Home_engagement .cnt_wp {
  align-items: center;
}

.Home_engagement_img {
  width: 51%;
  margin-left: auto;
  position: relative;
}

.Home_engagement_desc {
  width: 37%;
  display: flex;
  flex-direction: column;
}

.engagement_tree {
  position: absolute;
  right: 0;
  bottom: 8%;
  width: 100%;
}

.engagement_eclosia {
  position: absolute;
  right: 36%;
  bottom: 0%;
  width: 18%;
}

.engagement_maurilait {
  position: absolute;
  right: 38%;
  top: 34%;
  width: 17%;
}

.engagement_greenCircle {
  position: absolute;
  right: 30.5%;
  top: 26%;
  width: 33%;
}

.engagement_planet {
  position: absolute;
  top: 11.6%;
  left: 6%;
  width: 44%;
}

/*.Home_engagement_inner .engagement_planet {*/
/*  top: 18.3%;*/
/*}*/

.engagement_processus {
  position: absolute;
  top: 18%;
  right: 0%;
  width: 44%;
}

.engagement_human {
  position: absolute;
  top: 0%;
  right: 22%;
  width: 48%;
}

.engagement_leaves {
  position: absolute;
  left: 6%;
  top: 20%;
  width: 20%;
}

.engagement_boba {
  position: absolute;
  right: 4%;
  top: 16%;
  width: 18%;
}

/* ! Home regional */
.Home_regional {
  height: 100vh;
  position: relative;
}

.Home_regional .cnt {
  height: 100%;
}

.Home_regional .cnt_wp {
  height: 100%;
  align-items: center;
}

.Home_regional_img {
  width: 48%;
  position: relative;
  z-index: 50;
}

.Home_regional_desc {
  width: 38%;
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.regional_nature {
  position: absolute;
  right: 6.5%;
  bottom: 22.3%;
  width: 25%;
}

.regional_yop {
  position: absolute;
  right: 26%;
  bottom: 4%;
  width: 20%;
}

.regional_fraise {
  position: absolute;
  right: 37%;
  bottom: 6%;
  width: 18%;
}

.regional_fruits {
  position: absolute;
  left: 29%;
  bottom: 12%;
  width: 23%;
}

.regional_tropical {
  position: absolute;
  left: 4%;
  bottom: 11%;
  width: 29%;
}

.regional_banane {
  position: absolute;
  left: 14%;
  bottom: -1%;
  width: 30%;
}

.regional_vanille {
  position: absolute;
  left: 0%;
  bottom: 28%;
  width: 26%;
}

.regional_bobab {
  position: absolute;
  right: 13%;
  bottom: 6%;
  width: 46%;
}

.regional_man {
  position: absolute;
  left: 1%;
  bottom: 16%;
  width: 79%;
}

.regional_tree {
  position: absolute;
  right: 0%;
  bottom: 21%;
  width: 88%;
}

.regional_white_shape {
  position: absolute;
  left: 1%;
  bottom: 9%;
  width: 58%;
}

/* ! Home maujournal */
.Home_maujournal {
  height: 100vh;
}

.Home_maujournal .cnt {
  height: 100%;
}

.Home_maujournal .cnt_wp {
  height: 100%;
  align-items: center;
}

.Home_maujournal_img {
  width: 45%;
  position: relative;
}

.Home_maujournal_desc {
  width: 38%;
  margin-left: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.publication_boba {
  position: absolute;
  right: 21%;
  bottom: 1%;
  width: 62%;
}

.publication_journal {
  position: absolute;
  left: 0%;
  bottom: 12%;
  width: 56%;
}

.publication_man {
  position: absolute;
  left: 20%;
  top: 0%;
  width: 63%;
}

.publication_couteau {
  position: absolute;
  top: 12%;
  right: 0%;
  width: 87%;
}

.publication_logo {
  position: absolute;
  top: 10%;
  right: 9%;
  width: 78%;
}

.publication_shape {
  position: absolute;
  top: 8%;
  left: 11%;
  width: 41%;
}

/* ! Home recrutement */
.Home_recrutement {
  height: 100vh;
  position: relative;
  z-index: 1;
}

.Home_recrutement .cnt {
  height: 100%;
}

.Home_recrutement .cnt_wp {
  height: 100%;
  align-items: center;
}

.Home_recrutement_img {
  width: 50%;
  margin-left: auto;
  display: flex;
  position: relative;
}

.Home_recrutement_desc {
  width: 38%;
  display: flex;
  flex-direction: column;
}
.recrutement_man {
  position: absolute;
  right: 1%;
  bottom: -1%;
  width: 88%;
}

.recrutement_boba {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 27%;
}

.Home_recrutement_inner .recrutement_boba {
  left: 2%;
  top: 2%;
}

.recrutement_backcardboard {
  position: absolute;
  width: 59%;
  right: -9%;
  top: 16%;
}

.Home_recrutement_inner .recrutement_backcardboard {
  top: 12%;
}

.recrutement_spoon {
  position: absolute;
  right: 7%;
  top: 29%;
  width: 27%;
}

.Home_recrutement_inner .recrutement_spoon {
  right: 6%;
  top: 22%;
}

.recrutement_journal {
  position: absolute;
  right: -3%;
  bottom: 14%;
  width: 38%;
}

.mobile_pen {
  display: none;
}

/* ! animation */

.animated_img-top {
  position: absolute;
  top: 78%;
  left: 63%;
  width: 0;
  z-index: 1;
  pointer-events: none;
  transform-origin: center center;
  will-change: transform;
}

.animated_img-top img {
  display: block;
  width: 100%;
  height: auto;
}

.Home_about_img,
.Home_produit_img {
  position: relative;
}

.anim-target {
  position: absolute;
  opacity: 1;
  pointer-events: none;
}

/* Place this exactly where the cup should land in ABOUT */
.anim-target-about {
  width: 18%;
  height: 29%;
  top: 24%;
  left: 1%;
  right: auto;
  width: 17%;
  height: 29%;
  top: -8%;
  left: 9%;
  right: auto;
}

/* Place this exactly where the cup should end in PRODUCT */
.anim-target-produit {
  width: 18%;
  height: 28%;
  top: 37%;
  left: 38%;
}

.produit-packshot {
  position: relative;
  z-index: 20;
}

.Home_yogurt_hero {
  background: #fff;
  height: 60vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.anim-target-hero {
  width: 20%;
  height: 60%;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}

.Home_yogurt_hero_two {
  height: 20vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.anim-target-hero-two {
  width: 25%;
  height: 100%;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
}

.animated_spoon {
  position: absolute;
}

/* Per product overrides */
.Home_produit_img[data-product="yoplait"] .animated_spoon {
  top: 14%;
  right: 50%;
  width: 8%;
}

.Home_produit_img[data-product="candia"] .animated_spoon {
  top: 23%;
  left: 21%;
}

.Home_produit_img[data-product="juice"] .animated_spoon {
  top: 23%;
  left: 21%;
}

.Home_produit_img[data-product="cone"] .animated_spoon {
  bottom: 10%;
  left: 21%;
  width: 7%;
}

/* .animated_pen {
	position: absolute;
	bottom: 0%;
	left: 24%;
	width: 9%;
	z-index: 50;
} */

.animated_pen {
  position: absolute;
  bottom: 2%;
  left: 22%;
  width: 9%;
  z-index: 50;
}

.anim-target-regional {
  width: 18%;
  height: 28%;
  top: 30%;
  left: 30%;
  position: absolute;
}

.anim-target-engagement {
  width: 18%;
  height: 28%;
  top: 13%;
  right: 10%;
  position: absolute;
}

.anim-target-journal {
  width: 22%;
  height: 27%;
  bottom: 19%;
  left: 19%;
  position: absolute;
}

.anim-target-recrutement {
  width: 18%;
  height: 28%;
  top: 52%;
  left: 12%;
  position: absolute;
  /* z-index: -1; */
}

.anim-target-tophero {
  z-index: 9;
  width: 10%;
  height: 19%;
  bottom: 15%;
  left: 55%;
  position: absolute;
}

.Home_penAnimation {
  height: 30vh;
  position: relative;
}

.anim-penSec {
  width: 25%;
  height: 20%;
  bottom: 0;
  left: 50%;
  position: absolute;
}

/* ! preloader */

#preloader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: all;
  overflow: hidden;
}

#preloader-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}

#preloader-logo {
  position: relative;
  z-index: 2;
  width: 200px;
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
}

#preloader-logo img {
  width: 100%;
  height: auto;
  display: block;
}

body.is-loading {
  overflow: hidden;
}

.engagement_rotate {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.banners_images > div,
.animated_img-top,
.animated_spoon,
.animated_pen {
  will-change: transform;
  opacity: 0;
}

.Home_about_img > div,
.Home_produit_img > div,
.Home_engagement_img > div,
.Home_regional_img > div,
.Home_maujournal_img > div,
.Home_recrutement_img > div {
  will-change: transform;
}

/* ! inner pages */
.about_inner {
  padding: 15rem 0;
}

.about_keyfigures {
  padding: 0 0 15rem 0;
}

.about_keyfigures .cnt_wp {
  flex-direction: column;
}

.about_keyfigures-Shapes {
  position: relative;
  display: flex;
}

.about_keyfigures-Shapeback {
  position: absolute;
  width: 75%;
  left: 10%;
  bottom: 1%;
}

.about_keyfigures-boba {
  position: absolute;
  width: 19%;
  left: -1%;
  top: 12%;
}

.about_keyfigures-shapeBlue {
  position: absolute;
  width: 25%;
  left: 7%;
  bottom: 19%;
}

.shapeBlue-desc {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  top: 0;
  left: 0;
  align-items: center;
  justify-content: center;
}

.shapeBlue-desc-num {
  font-size: 8rem;
  color: #000;
}

.shapeBlue-desc-txt {
  font-size: 3rem;
  font-weight: 900;
  color: #000;
  text-transform: uppercase;
}

.about_keyfigures-shapeViolet {
  position: absolute;
  width: 32%;
  left: 21%;
  bottom: 15%;
}

.shapeViolet-desc {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 29%;
  left: 33%;
  align-items: center;
  justify-content: center;
}

.shapeViolet-desc-num {
  font-size: 8rem;
  color: #000;
}

.shapeViolet-desc-txt {
  font-size: 3rem;
  font-weight: 900;
  color: #000;
  text-transform: uppercase;
}

.about_keyfigures-shapeVert {
  position: absolute;
  width: 37%;
  left: 43%;
  bottom: 10%;
}

.shapeVert-desc {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 22%;
  left: 28%;
  align-items: center;
  justify-content: center;
}

.shapeVert-desc-num {
  font-size: 8rem;
  color: #000;
}

.shapeVert-desc-txt {
  font-size: 3rem;
  font-weight: 900;
  color: #000;
  text-transform: uppercase;
}

.about_keyfigures-shapeJaune {
  position: absolute;
  width: 22%;
  right: 5%;
  bottom: 17%;
}

.shapeJaune-desc {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 25%;
  left: 32%;
  align-items: center;
  justify-content: center;
}

.shapeJaune-desc-num {
  font-size: 8rem;
  color: #000;
}

.shapeJaune-desc-txt {
  font-size: 3rem;
  font-weight: 900;
  color: #000;
  text-transform: uppercase;
}

.about_iso {
  padding: 10rem 0 35rem;
}

.about_isoTitle {
  display: flex;
  padding: 0 5% 2rem;
}

.about_isoShapes {
  display: flex;
  width: 85%;
  position: relative;
}

.about_shape-boxes {
  position: absolute;
  width: 100%;
  left: 0%;
  bottom: 0%;
}

.about_shape-bobaf {
  position: absolute;
  width: 20%;
  left: 9%;
  top: 0%;
}

.about_shape-iso50001 {
  position: absolute;
  width: 27%;
  left: 21%;
  bottom: 0%;
}

.about_shape-mim {
  position: absolute;
  width: 27%;
  right: 5%;
  bottom: 0%;
}

.about_shape-iso22000 {
  position: absolute;
  width: 28%;
  left: 44%;
  bottom: 6%;
}

.about_directeur {
  padding: 15rem 0;
  position: relative;
  z-index: 2;
}

.about_directeur-left {
  width: 40%;
  padding-top: 5rem;
}

.about_directeur-right {
  width: 50%;
  position: relative;
  display: flex;
  margin-left: auto;
}
.about_directeur-cartonall {
  position: absolute;
  width: 90%;
  left: 0%;
  top: 21%;
}

.about_directeur-gilberesp {
  position: absolute;
  width: 32%;
  right: 7%;
  top: 12%;
}

.about_directeur-cedric {
  position: absolute;
  width: 31%;
  left: 34%;
  top: 0%;
}

.about_directeur-cartonUp {
  position: absolute;
  width: 60%;
  left: 4%;
  top: 25%;
}

.about_directeur-bobaleft {
  position: absolute;
  width: 34%;
  left: 11%;
  top: 8%;
}

.about_directeur-bobaright {
  position: absolute;
  width: 32%;
  right: 0%;
  bottom: 9%;
}

.about_directeur-journal {
  position: absolute;
  width: 58%;
  left: 13%;
  bottom: 31%;
}

.about_directeur-cartonBlue {
  position: absolute;
  width: 24%;
  left: 36%;
  bottom: 15%;
}

.about_directeur-cartonJaune {
  position: absolute;
  width: 26%;
  right: 6%;
  bottom: 28%;
}

.about_directeur-jeanJacques {
  position: absolute;
  width: 32%;
  right: 35%;
  bottom: 32%;
}

.about_directeur-gerardboulle {
  position: absolute;
  width: 27%;
  left: 7%;
  top: 11%;
}

.about_directeur-jacqueline {
  position: absolute;
  width: 31%;
  right: 12%;
  bottom: 7%;
}

.about_directeur-jeanNoel {
  position: absolute;
  width: 39%;
  left: 6%;
  bottom: 0%;
}

.about_management {
  padding: 10rem 0;
  position: relative;
  z-index: 2;
}

.about_management .cnt_wp {
  flex-direction: column;
}

.about_management-title {
  width: 50%;
  margin-bottom: 2rem;
}

.about_management-wp {
  width: 100%;
  position: relative;
  display: flex;
  height: 100vh;
}

.about_management-item {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

.about_management-item-name {
  color: var(--blue-color);
  font-size: 3rem;
  font-weight: 800;
  width: max-content;
  opacity: 0;
  transition: var(--transition-03s);
}
.about_management-item:hover .about_management-item-name {
  opacity: 1;
}

.about_management-item-01 {
  left: 45%;
  top: -22%;
  width: 250px;
}

.about_management-item-01 .about_management-item-name {
}

.about_management-item-02 {
  left: 20%;
  top: 7%;
  width: 271px;
}

.about_management-item-02 .about_management-item-name {
}

.about_management-item-03 {
  right: 10%;
  top: 7%;
  width: 299px;
}

.about_management-item-03 .about_management-item-name {
}

.about_management-item-04 {
  left: 45%;
  top: 18%;
  width: 359px;
}

.about_management-item-04 .about_management-item-name {
}

.about_management-item-05 {
  left: 20%;
  bottom: 20%;
  width: 267px;
}

.about_management-item-05 .about_management-item-name {
}

.about_management-item-06 {
  left: 47%;
  bottom: 6%;
  width: 198px;
}

.about_management-item-06 .about_management-item-name {
}

.about_management-item-07 {
  right: 10%;
  bottom: 19%;
  width: 288px;
}

.about_management-item-07 .about_management-item-name {
}

/* =========================================================
     COPY FROM HERE — management popup styles
     ========================================================= */
.mgmt-popup {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.28s ease,
    visibility 0s linear 0.28s;
  padding: 0 10%;
}
.mgmt-popup.is-open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.28s ease;
}

.mgmt-popup-panel {
  position: relative;
  width: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  gap: 40px;
  /* padding: 60px 70px; */
  transform: translateY(16px);
  transition: transform 0.32s cubic-bezier(0.16, 0.84, 0.44, 1);
}
.mgmt-popup.is-open .mgmt-popup-panel {
  transform: translateY(0);
}

.mgmt-popup-close {
  position: absolute;
  top: 12.5rem;
  right: 0px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--blue-color);
  line-height: 0;
}
.mgmt-popup-close svg {
  width: 100%;
  height: 100%;
  display: block;
}
.mgmt-popup-close:hover {
  opacity: 0.7;
}

.mgmt-popup-media {
  width: 40%;
}

.mgmt-popup-body {
  width: 45%;
  margin-left: auto;
}

.mgmt-popup-name {
  font-size: 7rem;
  line-height: 1.05;
  font-weight: 800;
  color: var(--title-color);
  margin-bottom: 1rem;
}
.mgmt-popup-poste {
  font-size: 3rem;
  font-weight: 700;
  color: var(--blue-color);
  margin-bottom: 1rem;
}
.mgmt-popup-bio {
  font-size: 2rem;
  line-height: 2.6rem;
  color: var(--body-color);
}

/* hidden per-item data block */
.about_management-item-data {
  display: none;
}

/* body scroll lock helper */
body.mgmt-popup-lock {
  overflow: hidden;
}

.mgmt-popup-nav {
  position: absolute;
  bottom: 15%;
  right: 0;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--blue-color);
  line-height: 0;
}

.mgmt-popup-nav svg {
  width: 100%;
  height: 100%;
  display: block;
}

.mgmt-popup-nav:hover {
  opacity: 0.6;
}

.mgmt-popup-nav-prev {
  right: 4%;
}

.mgmt-popup-nav-next {
  right: 0;
}

.about_campagnes {
  padding: 10rem 0;
  position: relative;
  z-index: 1;
}

.about_campagnes .cnt_wp {
  align-items: center;
}

.about_campagnes-left {
  width: 40%;
}

.about_campagnes-right {
  width: 50%;
  margin-left: auto;
  position: relative;
}

.campagnes_layout {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.campagnes_layout.is-active {
  opacity: 1;
  pointer-events: all;
  position: relative;
}

.about_mission {
  padding: 10rem 0;
}
.about_mission_desc {
  width: 40%;
  display: flex;
  flex-direction: column;
}

.about_mission-img {
  width: 50%;
  margin-left: auto;
  position: relative;
}

.about_mission-shape {
  position: absolute;
  width: 25%;
  right: 0%;
  top: 18%;
}

.about_mission-man {
  position: absolute;
  width: 55%;
  right: 11%;
  top: 0%;
}

.about_mission-usine {
  position: absolute;
  width: 59%;
  right: 1%;
  bottom: -12%;
}

.about_mission-boba {
  position: absolute;
  width: 49%;
  left: 12%;
  bottom: 4%;
}

.discover_more {
  padding: 10rem 0;
}

.discover_more .cnt_wp {
  flex-direction: column;
}

.discover_more-wp {
  justify-content: space-between;
  width: 100%;
  display: flex;
  margin-top: 5rem;
}

.discover_boxes {
  width: 30%;
  padding: 0 2.5%;
}

.discover_boxes a {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}

.boxes_img {
  height: 40rem;
  width: 100%;
  display: flex;
}

.discover_boxes span {
  transition: var(--transition-03s);
  color: var(--title-color);
  font-size: 3rem;
  font-style: normal;
  font-weight: 800;
  line-height: 3.5rem;
}

.discover_boxes a:hover span {
  color: var(--blue-color);
}

.animated_logo {
  position: absolute;
  right: 19%;
  width: 31%;
  top: 13%;
}

.fly-stop {
  position: absolute;
  width: 100px;
  height: 100px;
  background: rgba(255, 0, 0, 0.4);
  outline: 2px solid #ff0000;
  z-index: 60;
  pointer-events: none;
  opacity: 0;
}

.aboutShape {
  height: 50vh;
  padding: 10rem 0;
  position: relative;
}

/* page A — the logo flight */
[data-fly="logo"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  left: 40%;
  --fly-scale: 0.5; /* 1.5× bigger when it reaches stop 1 */
  --fly-rot: 5; /* rotated 45° (unitless number) */
}

[data-fly="logo"].fly-stop[data-fly-stop="2"] {
  top: 36%;
  right: 6%;
  --fly-scale: 0.8;
  --fly-rot: -30;
}

[data-fly="logo"].fly-stop[data-fly-stop="3"] {
  top: 36%;
  right: 40%;
  --fly-scale: 0.5;
  --fly-rot: -20;
}

[data-fly="logo"].fly-stop[data-fly-stop="4"] {
  top: 80%;
  left: 15%;
  --fly-scale: 0.9;
  --fly-rot: -40;
}

[data-fly="logo"].fly-stop[data-fly-stop="5"] {
  top: 65%;
  right: 53%;
  --fly-scale: 0.3;
  --fly-rot: -180;
}

[data-fly="logo"].fly-stop[data-fly-stop="6"] {
  top: 11%;
  right: 33%;
  --fly-scale: 0.8;
  --fly-rot: 0;
  z-index: -1;
}

[data-fly="logo"].fly-stop[data-fly-stop="7"] {
  top: 13%;
  left: 24%;
  --fly-scale: 0.6;
  --fly-rot: 0;
  z-index: -1;
}

[data-fly="logo"].fly-stop[data-fly-stop="8"] {
  top: 30%;
  left: 10%;
  --fly-scale: 0.8;
  --fly-rot: 0;
  z-index: -1;
}

[data-fly="logo"].fly-stop[data-fly-stop="9"] {
  top: 30%;
  right: 50%;
  --fly-scale: 0.4;
  --fly-rot: 180;
  z-index: -1;
}

[data-fly="logo"].fly-stop[data-fly-stop="10"] {
  top: 50%;
  right: 55%;
  --fly-scale: 1.2;
  --fly-rot: 320;
}

.sep_animationFly {
  height: 20rem;
  position: relative;
  padding: 10rem 0;
}

.sep_animationFlyMid {
  height: 30rem;
  position: relative;
  padding: 10rem 0;
}

.sep_animationFlysubmid {
  height: 40rem;
  position: relative;
}

/*! Presence regionale page */
.Home_regional_inner {
  margin: 13rem 0;
  position: relative;
  z-index: 1;
}

.Home_regional_inner .Home_regional_desc {
  width: 45%;
  margin-left: unset;
}

.Home_regional_inner .Home_regional_img {
  margin-left: auto;
}

.Home_regional_inner .regional_bobab {
  bottom: -5%;
}

.Home_regional_inner .regional_fruits {
  left: 30%;
  bottom: -2%;
}

.exportation {
  padding: 0 0 10rem;
  position: relative;
  z-index: 2;
}

.exportation .cnt_wp {
  align-items: center;
  justify-content: center;
  gap: 10rem;
  position: relative;
}

.exportation_desc {
  max-width: 55rem;
}

.mail_btn {
  margin-top: 2rem;
}

.mail_btn a {
  display: flex;
  align-items: center;
  gap: 5px;
}

.mail_btn a span {
  text-decoration: underline;
  color: #5f5f5f;
}

.exportation_img {
  position: relative;
}

/* .exportation_img .opac {
  opacity: 0.5;
} */

.regional_animated_logo {
  position: absolute;
  top: -22%;
  left: 52%;
  max-width: 16.5rem;
  transform: rotate(56deg);
}

.exportation_tree {
  position: absolute;
  width: 54%;
  right: 1%;
  top: 6%;
}

.regional_cargo {
  position: absolute;
  width: 43%;
  right: 16%;
  bottom: 14%;
}

.exportation_girl {
  position: absolute;
  width: 71%;
  left: 0%;
  top: 1%;
}

.regional_candia {
  position: absolute;
  width: 35%;
  right: 22%;
  bottom: 18%;
}

.regional_perette {
  position: absolute;
  width: 30%;
  left: 26%;
  bottom: 13%;
}

.regional_green_cardboard {
  position: absolute;
  width: 44%;
  left: 5%;
  bottom: 6%;
}

.regional_green_boba {
  position: absolute;
  width: 29%;
  left: 0%;
  bottom: -1%;
}

.regionalShape {
  height: 50vh;
  padding: 10rem 0;
  position: relative;
}

[data-fly="regional_logo"].fly-stop[data-fly-stop="1"] {
  top: 15%;
  left: 50%;
  --fly-scale: 0.6;
  --fly-rot: -45;
}

[data-fly="regional_logo"].fly-stop[data-fly-stop="2"] {
  top: 28%;
  left: 6%;
  --fly-scale: 1.1;
  --fly-rot: -35;
  z-index: -1;
}

/*! publication page */
.Home_maujournal_inner {
  padding: 15rem 0 10rem;
}

.Home_maujournal_inner .cnt_wp {
  gap: 29rem;
}

.Home_maujournal_inner .Home_maujournal_desc {
  margin-left: unset;
  width: 35%;
}

.Home_maujournal_inner .btnDowload {
  margin-top: 3rem;
}

.Home_maujournal_inner .btnDowload a {
  color: var(--blue-color);
}

.Home_maujournal_inner .publication_pen {
  position: absolute;
  width: 90%;
  left: -10%;
  bottom: 14%;
}

/*! contact */
.Home_contact {
  padding: 20rem 0;
}

.Home_contact .cnt_wp {
  justify-content: space-between;
  align-items: center;
}

.Home_contact_desc {
  width: 35%;
}

.Home_contact_desc .reused_smaller {
  margin-top: 2rem;
}

.Home_contact_desc .reused_smaller-txt {
  gap: 2rem;
}

.Home_contact_desc .reused_smaller-txt li {
  padding-left: 0;
}

.Home_contact_desc .reused_smaller-txt li::before {
  content: none;
}

.Home_contact_desc .reused_smaller-txt li a {
  display: flex;
  align-items: center;
  gap: 1rem;
  transition: var(--transition-03s);
}

.Home_contact_desc .reused_smaller-txt li a:hover {
  color: var(--blue-color);
}

.Home_contact_desc .reused_smaller-txt li:first-of-type a {
  align-items: flex-start;
}

.Home_contact_desc .reused_smaller-txt li:first-of-type a,
.Home_contact_desc .reused_smaller-txt li:nth-of-type(2) a {
  text-decoration: underline;
}

.Home_contact_desc .reused_smaller-txt li:nth-of-type(2) a {
  font-size: 1.8rem;
  font-weight: 500;
}

.Home_contact_img {
  width: 45%;
  position: relative;
}

/* .Home_contact_img .opac {
  opacity: 0.5;
} */

.contact_bg {
  position: absolute;
  top: 12%;
  left: 29%;
  width: 72%;
}

.contact_father_son_logo {
  position: absolute;
  bottom: 0%;
  left: 22%;
  width: 46%;
}

.contact_building {
  position: absolute;
  bottom: 14%;
  right: 1%;
  width: 54%;
}

.contact_boba {
  position: absolute;
  top: 7%;
  left: 13%;
  width: 45%;
}

.contact_hand {
  position: absolute;
  bottom: 15%;
  left: 0%;
  width: 45%;
}

.contact_logo {
  position: absolute;
  bottom: 11%;
  right: 26%;
  width: 39%;
}

/*! recrutement page */
.Home_recrutement_inner {
  padding-top: 5rem;
}

.Home_recrutement_inner .Home_recrutement_desc {
  width: 28%;
}

.Home_recrutement_inner .recrutement_pen {
  position: absolute;
  top: 14%;
  left: -10%;
  pointer-events: none;
}

.recrutementShape {
  height: 50vh;
  padding: 10rem 0;
  position: relative;
}

.recrutementShape_two {
  height: 35vh;
  padding: 10rem 0;
  position: relative;
}

[data-fly="recrutement_pen"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  left: 50%;
  --fly-scale: .4; /* 1.5× bigger when it reaches stop 1 */
  --fly-rot: -85; /* rotated 45° (unitless number) */
}

[data-fly="recrutement_pen"].fly-stop[data-fly-stop="2"] {
  top: 75%;
  right: 45%;
  --fly-scale: 1;
  --fly-rot: -40;
}

[data-fly="recrutement_pen"].fly-stop[data-fly-stop="3"] {
  top: 40%;
  right: 50%;
  --fly-scale: 0.4;
  --fly-rot: 120;
}

[data-fly="recrutement_pen"].fly-stop[data-fly-stop="4"] {
  bottom: 2%;
  right: 17%;
  --fly-scale: 0.3;
  --fly-rot: 55;
}

.poste_vacants {
  position: relative;
  z-index: 2;
}

.poste_vacants .cnt_wp {
  flex-direction: column;
  gap: 20rem;
}

.poste_vacants_desc {
  max-width: 51rem;
}

.open_job_list_wp {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12rem 3rem;
  position: relative;
}

.job_card a {
  padding: 2.5rem;
  border-radius: 2rem;
  box-shadow: 13px 18px 50px 0px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
  background: #fff;
  height: 20rem;
  position: relative;
}

.job_card a::after {
  content: "";
  width: 40rem;
  height: 30.8rem;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  transform: translate(-50%, -50%);
  background-image: url("../assets/images/todelete/job_cardboard.png");
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: var(--transition-03s);
}

.job_card a:hover::after {
    opacity: 1;
}

.job_name {
  color: #aab4b3;
  font-size: 2rem;
  font-weight: 900;
  transition: var(--transition-03s);
}

.job_card a:hover .job_name {
  color: var(--blue-color);
}

.job_date {
  color: var(--body-color);
  font-size: 1.6rem;
  font-weight: 400;
}

.job_card .reused_btn {
  margin-top: 0;
  color: var(--blue-color);
  border: 1px solid var(--blue-color);
  padding: 0.5rem 2rem;
  border-radius: 5px;
  width: fit-content;
  background: unset;
  cursor: pointer;
}

.job_btn-wrap {
  display: grid;
  grid-template-rows: 0fr; /* collapsed by default */
  transition: grid-template-rows 0.3s ease;
}

.job_btn-inner {
  overflow: hidden; /* clips content while row height is 0 */
  min-height: 0;
}

.job_card:hover .job_btn-wrap {
  grid-template-rows: 1fr; /* expands to natural content height */
}

.job_cardboard {
  z-index: -1;
  position: absolute;
  top: -10%;
}

.application_spontanee {
  padding-bottom: 10rem;
  position: relative;
  z-index: 0;
}

.application_spontanee .cnt_wp {
  flex-direction: column;
  gap: 15rem;
}

.application_form {
  position: relative;
  display: flex;
  justify-content: center;
}

.form_wp {
  padding: 6.8rem 10rem 9.8rem;
  box-shadow: 13px 18px 50px 0px rgba(0, 0, 0, 0.2);
  border-radius: 20px;
  width: 113.6rem;
  position: relative;
  z-index: 1;
  background: #fff;
}

.cardboard_deco {
  position: absolute;
}

.cardboard_deco-red {
  top: -20%;
  left: 7%;
  z-index: 1;
}

.cardboard_deco-yellow {
  top: -12%;
  right: 10.2%;
  z-index: 1;
}

.cardboard_deco-blue {
  top: -6.5%;
  right: 11.2%;
  z-index: 0;
}

.cardboard_deco-green {
  bottom: -17%;
  left: 27%;
  z-index: 0;
}

.cardboard_deco-normal {
  bottom: 2%;
  left: 14.5%;
  z-index: 0;
}

/*! nos engagements */
.Home_engagement {
  padding: 20rem 0 0;
}

.produire_responsable .cnt_wp,
.proteger_notre_environnement .cnt_wp,
.humain_au_coeur .cnt_wp,
.recrutement_et_formation .cnt_wp,
.nos_exigences_qualite .cnt_wp {
  align-items: center;
}

.produire_responsable_img {
  width: 42%;
  position: relative;
}

.produire_responsable_desc {
  width: 37%;
  margin-left: auto;
}

.produire_responsable_desc .reused_smaller-title {
  width: 100%;
}

.animate_petal {
  position: absolute;
  top: 40%;
  left: 45%;
  width: 15%;
  transform: rotate(-125deg);
}

.pr_bg {
  position: absolute;
  bottom: 0%;
  left: 13%;
  width: 76%;
}

.pr_red_cardboard {
  position: absolute;
  top: 50%;
  right: 0%;
  width: 50%;
}

.pr_shape {
  position: absolute;
  bottom: 8%;
  right: 25%;
  width: 52%;
}

.pr_woman {
  position: absolute;
  top: 0%;
  right: 17%;
  width: 51%;
}

.pr_leave {
  position: absolute;
  top: 11%;
  left: 5%;
  width: 38%;
}

.pr_boba {
  position: absolute;
  top: 23%;
  left: 1%;
  width: 38%;
}

.pr_txt,
.pne_txt,
.hac_txt {
  font-size: 2.5rem;
  text-transform: uppercase;
  color: #fff;
  font-weight: 600;
  position: absolute;
}

.pr_txt {
  top: 37%;
  right: -9%;
}

.pne_txt {
  top: 3%;
  right: 19%;
}

.hac_txt {
  bottom: 8%;
  right: 21%;
}

.mobile_blue_petal,
.mobile_green_petal,
.mobile_puple_petal {
  display: none;
}

/* proteger notre environnement */
/* .proteger_notre_environnement {
  padding: 12rem 0;
} */

.proteger_notre_environnement_desc {
  width: 40%;
}

.proteger_notre_environnement_desc .reused_smaller {
  margin-top: 0;
}

.proteger_notre_environnement_img {
  width: 33%;
  margin-left: auto;
  position: relative;
}

.pne_cardboard {
  position: absolute;
  bottom: 18%;
  right: 3%;
  width: 66%;
}

.pne_green_cardboard {
  position: absolute;
  bottom: 2%;
  right: 13%;
  width: 82%;
}

.pne_yop {
  position: absolute;
  top: 11%;
  left: 12%;
  width: 38%;
}

.pne_choco_perette {
  position: absolute;
  top: 14%;
  right: 30%;
  width: 36%;
}

.pne_choco_hand {
  position: absolute;
  top: 14%;
  right: 30%;
  width: 36%;
}

.pne_hand {
  position: absolute;
  top: 8%;
  right: 6%;
  width: 39%;
}

.pne_boba {
  position: absolute;
  top: 42%;
  left: 1%;
  width: 52%;
}

.pne_wood_bg {
  position: absolute;
  top: 0;
  left: 12%;
  width: 55%;
}

/* L'humain au coeur de Maurilait */
/* .humain_au_coeur {
  padding: 12rem 0;
} */

.humain_au_coeur_img {
  width: 42%;
  margin-left: 8rem;
  position: relative;
}

.humain_au_coeur_desc {
  width: 37%;
  margin-left: auto;
}

.hac_purple_cardboard {
  position: absolute;
  bottom: 6%;
  left: 3%;
  width: 55%;
}

.hac_shape {
  position: absolute;
  bottom: 12%;
  left: -2%;
  width: 55%;
}

.hac_boba {
  position: absolute;
  bottom: 8%;
  right: 14%;
  width: 40%;
}

.hac_hand {
  position: absolute;
  bottom: 3%;
  right: 2%;
  width: 76%;
}

.hac_people {
  position: absolute;
  top: 30%;
  right: 7%;
  width: 53%;
}

.hac_boy {
  position: absolute;
  bottom: 1%;
  left: 8%;
  width: 66%;
}

/* Recrutement et formation */
/* .recrutement_et_formation {
  padding: 12rem 0;
} */

.recrutement_et_formation_desc {
  width: 37%;
}

.recrutement_et_formation_img {
  width: 41%;
  margin-left: auto;
  position: relative;
}

.rf_bg {
  position: absolute;
  bottom: 5%;
  right: 3%;
  width: 71%;
}

.rf_hand {
  position: absolute;
  top: 11%;
  right: 8%;
  width: 35%;
}

.rf_people {
  position: absolute;
  top: 26%;
  right: 3%;
  width: 67%;
}

.rf_hat {
  position: absolute;
  top: 0;
  left: 15%;
  width: 58%;
}

.rf_boba {
  position: absolute;
  bottom: 1%;
  right: 2%;
  width: 55%;
}

.rf_logo {
  position: absolute;
  bottom: 17%;
  right: 13%;
  width: 88%;
}

.rf_blue_pen {
  position: absolute;
  width: 52%;
  bottom: 7%;
  left: 15%;
}

/* Nos exigences qualité */
/* .nos_exigences_qualite {
  padding: 20rem 0;
} */

.nos_exigences_qualite_img {
  width: 44%;
  margin-left: 8rem;
  position: relative;
}

.nos_exigences_qualite_desc {
  width: 37%;
  margin-left: auto;
}

.neq_dahi {
  position: absolute;
  top: 0%;
  left: 37%;
  width: 23%;
}

.neq_checklist {
  position: absolute;
  top: 2%;
  left: -1%;
  width: 50%;
}

.neq_yellow_cardboard {
  position: absolute;
  top: 27%;
  right: 15%;
  width: 48%;
}

.neq_journal {
  position: absolute;
  bottom: 15%;
  left: 8%;
  width: 78%;
}

.neq_woman {
  position: absolute;
  bottom: 16%;
  left: 21%;
  width: 60%;
}

.neq_boba {
  position: absolute;
  bottom: 2%;
  right: 0;
  width: 42%;
}

.neq_check_icon {
  position: absolute;
  bottom: 9%;
  right: 15%;
  width: 25%;
}

.engagementShape {
  height: 20vh;
  padding: 10rem 0 20rem;
  position: relative;
}

.engagementShape_2 {
  height: 20vh;
  padding: 30rem 0 20rem;
  position: relative;
}

.engagementShape_3 {
  height: 20vh;
  padding: 30rem 0 20rem;
  position: relative;
}

.engagementShape_4 {
  height: 20vh;
  padding: 30rem 0 10rem;
  position: relative;
}

.engagementShape_5 {
  height: 20vh;
  padding: 20rem 0 20rem;
  position: relative;
}

[data-fly="blue_petal"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  left: 47%;
  --fly-scale: 1; /* 1.5× bigger when it reaches stop 1 */
  --fly-rot: -98; /* rotated 45° (unitless number) */
}

[data-fly="blue_petal"].fly-stop[data-fly-stop="2"] {
  top: 32%;
  right: -6%;
  --fly-scale: 2.2;
  --fly-rot: 3;
}

[data-fly="green_petal"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  right: 47%;
  --fly-scale: 1;
  --fly-rot: -5;
}

[data-fly="green_petal"].fly-stop[data-fly-stop="2"] {
  top: 0;
  right: 22%;
  --fly-scale: 2.4;
  --fly-rot: -5;
}

[data-fly="purple_petal"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  right: 47%;
  --fly-scale: 1.2;
  --fly-rot: 2;
}

[data-fly="purple_petal"].fly-stop[data-fly-stop="2"] {
  bottom: 4%;
  right: 25%;
  --fly-scale: 2.8;
  --fly-rot: 2;
}

[data-fly="orange_petal"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  right: 47%;
  --fly-scale: 1.2;
  --fly-rot: 2;
}

[data-fly="orange_petal"].fly-stop[data-fly-stop="2"] {
  bottom: 24%;
  left: 24%;
  --fly-scale: 2;
  --fly-rot: 2;
  z-index: 0;
}

[data-fly="last_blue_petal"].fly-stop[data-fly-stop="1"] {
  top: 10%;
  right: 47%;
  --fly-scale: 1.2;
  --fly-rot: -110;
}

[data-fly="last_blue_petal"].fly-stop[data-fly-stop="2"] {
  bottom: 24%;
  left: 6%;
  --fly-scale: 2.6;
  --fly-rot: -180;
}

/*! nos marque */
.Nos_marques {
  padding: 15rem 0;
}

.Nos_marques .cnt_wp {
  align-items: center;
}

.Nos_marques_desc {
  width: 30%;
}

.Nos_marques_img {
  width: 55%;
  margin-left: auto;
  position: relative;
}

.nm_logo {
  position: absolute;
  top: 2%;
  right: 31%;
  width: 41%;
}

.nm_blue_purple_cardboard {
  position: absolute;
  top: 32%;
  right: 14%;
  width: 56%;
}

.nm_boba {
  position: absolute;
  top: 12%;
  left: 1%;
  width: 28%;
}

.nm_red_cardboard {
  position: absolute;
  top: 13%;
  left: 8%;
  width: 49%;
}

.nm_plain_cardboard {
  position: absolute;
  top: 52%;
  left: 28%;
  width: 44%;
}

.nm_j_cardboard {
  position: absolute;
  top: 10%;
  right: 1%;
  width: 57%;
}

.nm_miko_support {
  position: absolute;
  top: 36%;
  right: 11%;
  width: 49%;
}

.nm_green_cardboard {
  position: absolute;
  top: 58%;
  left: 3%;
  width: 57%;
}

.nm_candia_cardboard {
  position: absolute;
  top: 45%;
  left: 7%;
  width: 49%;
}

.nm_yoplait_logo {
  position: absolute;
  top: 34%;
  left: 19%;
  width: 17%;
}

.nm_j_logo {
  position: absolute;
  top: 21%;
  right: 11%;
  width: 19%;
}

.nm_candia_logo {
  position: absolute;
  bottom: 31%;
  left: 19%;
  width: 21%;
}

.nm_miko_logo {
  position: absolute;
  bottom: 25%;
  right: 25%;
  width: 20%;
}

.marques_list .cnt_wp {
  justify-content: center;
  align-items: center;
  gap: 8.8rem;
}

.marques_yoplait {
  width: 12.3rem;
}

.marques_candia {
  width: 17.5rem;
}

.marques_miko {
  width: 15.3rem;
}

.marques_j {
  width: 11.4rem;
}

.marques_btn {
  cursor: pointer;
  position: relative;
}

.marques_btn::after {
  content: "";
  width: 26.2rem;
  height: 17.5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  transform: translate(-50%, -50%);
  background-image: url("../assets/images/interfaces/manques/intro/logo_background.png");
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: var(--transition-03s);
}

.marques_btn.active::after,
.marques_btn:hover::after {
  opacity: 1;
}

.marque_display {
  padding: 20rem 0 10rem;
  display: none;
  opacity: 0;
  transition: var(--transition-03s);
  position: relative;
}

.marque_display.active {
  display: block;
}

.marque_display.show {
  opacity: 1;
}

.marque_display .cnt_wp {
  flex-direction: column;
}

.marque_intro {
  display: flex;
  align-items: center;
  gap: 8rem;
  z-index: 1;
}

.marque_intro_img {
  width: 54%;
  position: relative;
}

.marque_intro_desc {
  width: 38%;
}

.nos_diff_produit {
  position: relative;
  z-index: 1;
}

.nos_diff_produit_slider {
  max-width: 172rem;
  margin: 0 auto;
}

.product_card {
  display: flex;
  align-items: center;
}

.diff_produit_desc {
  width: 40%;
}

.diff_produit_img {
  width: 40%;
  margin-left: auto;
  margin-right: 10rem;
}

.product_swiper-name {
  font-size: 3rem;
  color: #aab4b3;
  margin-bottom: 2rem;
  font-weight: 900;
}

.nos_diff_produit_slider {
  position: relative;
}

.nos_diff_nav .swiper-button-next,
.nos_diff_nav .swiper-button-prev {
  top: unset;
  bottom: 0;
}

.nos_diff_nav .swiper-button-next {
  right: unset;
  left: 6rem;
}

.productShape {
  height: 30vh;
  position: relative;
}

.product_animated_spoon {
  position: absolute;
  top: 18%;
  left: 41%;
  z-index: -1;
}

[data-fly="product_spoon"].fly-stop[data-fly-stop="1"] {
  bottom: 50%;
  left: 57%;
  --fly-scale: 1;
  --fly-rot: 45;
}

[data-fly="product_spoon"].fly-stop[data-fly-stop="2"] {
  bottom: 45%;
  right: 12%;
  --fly-scale: 1.2;
  --fly-rot: 43;
}

[data-fly="product_spoon_miko"].fly-stop[data-fly-stop="1"] {
  bottom: 50%;
  left: 57%;
  --fly-scale: 1;
  --fly-rot: 45;
}

[data-fly="product_spoon_miko"].fly-stop[data-fly-stop="2"] {
  bottom: 45%;
  right: 12%;
  --fly-scale: 1.2;
  --fly-rot: 43;
}

.animated_straw {
  position: absolute;
  top: 29%;
  left: 20%;
  z-index: -1;
}

[data-fly="straw"].fly-stop[data-fly-stop="1"] {
  bottom: 50%;
  left: 57%;
  --fly-scale: 1;
  --fly-rot: 45;
}

[data-fly="straw"].fly-stop[data-fly-stop="2"] {
  bottom: 45%;
  right: 12%;
  --fly-scale: 1.2;
  --fly-rot: 43;
}

[data-fly="straw_j"].fly-stop[data-fly-stop="1"] {
  bottom: 50%;
  left: 57%;
  --fly-scale: 1;
  --fly-rot: 45;
}

[data-fly="straw_j"].fly-stop[data-fly-stop="2"] {
  bottom: 45%;
  right: 12%;
  --fly-scale: 1.2;
  --fly-rot: 43;
}

/*! form */
.form_wp .umbraco-forms-container {
  display: flex;
  flex-wrap: wrap;
  gap: 2.4rem 5.6rem;
}

.form_wp label.umbraco-forms-label {
  font-weight: 400;
  display: block;
  color: #b2b2b2;
  font-size: 1.4rem;
}

.form_wp .umbraco-forms-field {
  width: 46%;
}

.form_wp .umbraco-forms-form input.text,
.form_wp .umbraco-forms-form select {
  border: 0;
  width: 100%;
  max-width: 100% !important;
  border-bottom: 1px solid #5f5f5f;
  font-size: 1.8rem;
}

.form_wp .umbraco-forms-form input.text::placeholder {
  font-size: 2rem;
  color: #5f5f5f;
}

.form_wp .umbraco-forms-form select {
  padding: 0.23em 0;
  color: #5f5f5f;
  appearance: none;
  position: relative;
}

.form_wp .umbraco-forms-field.dropdown {
  position: relative;
}

.form_wp .umbraco-forms-field.dropdown::after {
  content: "";
  position: absolute;
  background-image: url("http://maurilait.frci-eservweb01.frci.local/media/4k2piqc5/selector_icon.png");
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 9px;
  height: 8px;
}

.form_wp .umbraco-forms-field.titleanddescription ul {
  padding-left: 2rem;
}

.form_wp .umbraco-forms-field.titleanddescription ul li,
.form_wp .umbraco-forms-field.mandatory {
  font-size: 1.4rem;
}

.form_wp .umbraco-forms-field.titleanddescription ul li:nth-child(even) {
  list-style: disc;
}

.form_wp .umbraco-forms-navigation input[type="submit"] {
  padding: 1rem 2rem;
  font-size: 1.8rem;
  color: #0054a6;
  border: 1px solid #0054a6;
  border-radius: 5px;
  background: none;
  cursor: pointer;
  transition: var(--transition-03s);
}

.form_wp .umbraco-forms-navigation input[type="submit"]:hover {
  color: #fff;
  background: #0054a6;
}

.umbraco-forms-form input.text:focus,
.umbraco-forms-form input.title:focus,
.umbraco-forms-form select:focus,
.umbraco-forms-form textarea:focus {
  border: none !important;
  border-bottom: 1px solid #5f5f5f !important;
}

.umbraco-forms-form fieldset {
  padding: 0;
  margin: 0;
}

.form_wp input[type="file"] {
  position: relative;
  display: inline-block;
  width: 220px;
  height: 10rem;
  /*color: transparent;*/
  background: transparent;
  border: none;
  cursor: pointer;
  /*font-size: 0;*/
}

.form_wp input[type="file"]::file-selector-button {
  width: 0;
  height: 0;
  padding: 0;
  border: none;
  opacity: 0;
}

.form_wp input[type="file"]::-webkit-file-upload-button {
  width: 0;
  height: 0;
  padding: 0;
  border: none;
  opacity: 0;
}

/* Draw the fake button on top */
.form_wp input[type="file"]::before {
  content: "Envoyez votre CV";
  /*position: absolute;*/
  /*top: 0;*/
  /*left: 0;*/
  width: 100%;
  /*height: 100%;*/
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 500;
  color: #111;
  background: #fff;
  border: 1px solid #d5d5d5;
  border-radius: 4px;
  box-sizing: border-box;
  transition: var(--transition-03s);
  pointer-events: none;
  margin-bottom: 1rem;
  padding: 1rem 2rem
}

.form_wp input[type="file"]:hover::before {
  color: #0054a6;
  border-color: #0054a6;
}

/*! 404 */
.page_404 {
  overflow: hidden;
  height: 100vh;
}

.page_404 .cnt_wp {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
}

.img_404 {
  width: 90%;
}

.return_btn {
  position: absolute;
  bottom: 13%;
  color: var(--blue-color);
  font-size: 18px;
  font-weight: 500;
  padding: 0.8rem 2rem;
  border-radius: 5px;
  border: 1px solid var(--blue-color);
}

.return_btn:hover {
  background: var(--title-color);
  color: #fff;
  border-color: var(--title-color);
}

/*! job description */
.job_description {
  padding: 13rem 10rem 23rem 32rem;
}

.job_description_desc {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  width: 55%;
  z-index: 1;
}

.policy_description_title,
.job_description_title {
  color: var(--blue-color);
  font-size: 3rem;
  font-weight: 800;
  line-height: 5.5rem;
}

.job_description_txt,
.policy_description_txt {
  color: #5f5f5f;
  font-size: 2rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.6rem;
}

.job_description_txt span {
  color: #706c53;
  font-size: 16px;
  font-style: italic;
  font-weight: 300;
  line-height: 2.5rem;
  display: block;
  margin-top: 2rem;
}

.Postuler_btn {
  color: var(--blue-color);
  font-size: 18px;
  font-weight: 500;
  padding: 0.8rem 2rem;
  border-radius: 5px;
  border: 1px solid var(--blue-color);
  width: fit-content;
  margin-top: 1rem;
}

.Postuler_btn:hover {
  background: var(--title-color);
  color: #fff;
  border-color: var(--title-color);
}

.job_animated_logo_wp {
  width: 45%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.poste_vacants.job_vacants .cnt_wp {
  gap: 16rem;
  padding-bottom: 42rem;
}

[data-fly="job_logo"].fly-stop[data-fly-stop="1"] {
  top: -30%;
  left: 44.5%;
  --fly-scale: 1; /* 1.5× bigger when it reaches stop 1 */
  --fly-rot: 5; /* rotated 45° (unitless number) */
}

.engagement_planete {
  padding: 10rem 0;
}

.engagement_planete .cnt_wp {
  justify-content: center;
  align-items: center;
}

.engagement_planete_img {
  position: relative;
}

.ep_bg {
  position: absolute;
  width: 100%;
  top: 2%;
}

.ep_planete_shape {
  position: absolute;
  top: 7%;
  left: 24%;
  width: 52%;
}

.ep_human_shape {
  position: absolute;
  bottom: 3%;
  left: 24%;
  width: 54%;
}

.ep_green_leaf {
  position: absolute;
  top: 18%;
  left: 41.5%;
  width: 19%;
}

.ep_yellow_leaf {
  position: absolute;
  top: 36%;
  right: 16%;
  width: 37%;
}

.ep_red_leaf {
  position: absolute;
  bottom: 24%;
  right: 16%;
  width: 38%;
}

.ep_orange_leaf {
  position: absolute;
  bottom: 11%;
  width: 20%;
  left: 40%;
}

.ep_darkGreen_leaf {
  position: absolute;
  bottom: 25%;
  left: 18%;
  width: 39%;
}

.ep_blue_leaf {
  position: absolute;
  top: 34%;
  left: 15%;
  width: 38%;
}

.ep_center {
  position: absolute;
  left: 41%;
  top: 45%;
  width: 21%;
}

.job_application {
  padding: 15rem 0 20rem;
}

/*! policy */
.policy {
  padding: 20rem 0 10rem;
}

.policy_desc {
  width: 70%;
}

.policy_logo_wp {
  width: 23%;
  margin-left: auto;
}

.policy_logo {
  max-width: 32rem;
  position: sticky;
  top: 2rem;
}

.policy_title {
  color: var(--title-color);
  font-size: 6.8rem;
  font-weight: 800;
  line-height: 7.4rem;
  margin-bottom: 8rem;
}

.policy_description_block-wp {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}

.policy_description_title_sub {
  color: var(--blue-color);
  font-size: 3rem;
  font-weight: 800;
  line-height: 5.5rem;
  padding: 1.5rem 0 1rem;
}

.policy_table table {
  margin-top: 4rem;
}

.policy_table table,
.policy_table th,
.policy_table td {
  border: 1px solid #706c53;
  border-collapse: collapse;
  padding: 1rem;
}

.policy_table th {
  color: #0054a6;
  font-size: 2rem;
  text-align: left;
}

.policy_table th:first-child {
  width: 30rem;
}

.policy_table td {
  color: #5f5f5f;
  font-size: 2rem;
  line-height: 2.4rem;
}

.policy_description_block ul {
    padding-left: 2rem;
}

.policy_description_block ul li {
    list-style: disc;
}