/*** RESET
  The new CSS reset - version 1.8.4 (last updated 14.2.2023)
  GitHub page: https://github.com/elad2412/the-new-css-reset
  ***/
  *:where(
    :not(html, iframe, canvas, img, svg, video, audio, input):not(svg *, symbol *)
  ) {
  all: unset;
  display: revert;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
a,
button {
  cursor: revert;
}
ol,
ul,
menu {
  list-style: none;
}
img {
  max-inline-size: 100%;
  max-block-size: 100%;
} 
table {
  border-collapse: collapse;
}
input,
textarea {
  -webkit-user-select: auto;
}
textarea {
  white-space: revert;
}
meter {
  -webkit-appearance: revert;
  appearance: revert;
}
:where(pre) {
  all: revert;
}
::placeholder {
  color: unset;
}
::marker {
  content: initial;
}
:where([hidden]) {
  display: none;
}
:where([contenteditable]:not([contenteditable="false"])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}
:where([draggable="true"]) {
  -webkit-user-drag: element;
}
:where(dialog:modal) {
  all: revert;
}
/* RESPONSIVE */
img,
video {
  max-inline-size: 100%;
  block-size: auto;
  inline-size: 100%;
  vertical-align: middle;
  /*width: 100%;*/
}
iframe:not(.instagram-media) {
  /*max-inline-size: 100%;
  block-size: auto;*/
}

/* --------------------------------------------------------------------- */
@font-face {
    font-family: 'Roobert PRO';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Roobert-Regular.woff2);
  }
@font-face {
    font-family: 'Roobert PRO';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/Roobert-Medium.woff2);
  }
@font-face {
    font-family: 'Roobert PRO';
    font-style: normal;
    font-weight: 600;
    src: url(../fonts/Roobert-SemiBold.woff2);
  }


:root {
	--padunit: 2.083vw; /* 1/48 */
	--padunit-mobile: 10.67vw; /* 1/48 */
	--pdlr-colbase: 1; /* marge colonne page (1 colonne) */
	--pdtb-colbase: 3.625; /* marge colonne page (1 colonne) */
  --coef_marge_verti: 3;

  --grille-gap: calc(20vw / 375 * 100);
  --grille1col: calc(82vw / 375 * 100);


	--font : 'Roobert PRO';
	--bold: 700;
	--semibold: 600;
	--medium: 500;
	--regular: 400;
	--light: 300;

	--rose: #FF98E5;
	--jaune: #FFD84E;
	--rouge: #EF4B40;
	--violet: #CB46E8;
	--bleue: #47C9EE;
	--vert: #48EE6C;
	--orange: #ef6b49;
  --black: #000000;
  --white: #FFFFFF;
  --grey: #E9E9E9;
  --grey2: #e3e3e3;
  --grey--darker: #929292;
}

@media (min-width: 480px) {
  :root {
    --coef_marge_verti: 1;
  }
}

@media (min-width: 640px) {
  :root {
    /* 12 colonnes 1920px */
    --padunit: calc(40vw / 1920 * 100);
    --grille-gap: calc(10vw / 1920 * 100);
    --grille1col: calc(154vw / 1920 * 100);
    --coef_marge_verti: 1;
  }

}

/* SETUP */

body{
	overflow-x: hidden;
	overflow-y: scroll;
	font-family: var(--font);
  /* font-size: clamp(1rem, 0.818rem + 0.7767vw, 1.75rem); */
  font-size: clamp(1rem, 0.7747rem + 0.9611vw, 2.3125rem);
  width: 100%;
  background-color: var(--white);

}

.global{
  background-color: var(--white);
}

.section__dark .global {
  background-color: var(--black);
}

.homepage{
  pointer-events: none;
}

.no-scroll{
  overflow: hidden;
}

.pointer-events--auto{
  pointer-events: auto;
}


.section100{
    height: 100vh;
    width: 100%;
}

.uppercase{
    text-transform: uppercase;
}

.section__dark{
    background-color: var(--black);
    color: var(--white);
}

.show{
  display: block;
}

.hide{
  display: none;
}

.hidegri{
  display: none !important;
}

/* .editor{
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  transform: translateY(50px);
  opacity: 0;
}

.editor--bold{
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  font-weight: var(--semibold);
}

.editor--big{
  opacity: 0;
  font-size: clamp(1rem, 0.818rem + 0.7767vw, 1.75rem);
}
*/
.title--big{
  font-size: clamp(1.75rem, 0.3544rem + 5.9547vw, 7.5rem);
  text-align: center;
}

.title--big div div{
  /*
  opacity: 0;
  transform: translateY(50%);
  */
}

.title--med{
  /*font-size: clamp(1.75rem, 0.8095rem + 4.0129vw, 5.625rem);*/
  font-size: clamp(1.5625rem, 0.758rem + 3.4325vw, 6.25rem);
  text-align: center;
}

.title--med div div{
  /*
  opacity: 0;
  transform: translateY(50%);
  */
}

.subtitle--big{
  /*font-size: clamp(1rem, 0.4691rem + 2.2654vw, 3.1875rem);*/
  font-size: clamp(1rem, 0.6889rem + 1.3272vw, 2.8125rem);
}

.subtitle--big div{
  /*opacity: 0;*/
}

.subtitle div {
  /*opacity: 0;*/
} 


/* EDITOR */
  .editor p:empty {
    display: none;
  }
  .editor p,
  .editor ul,
  .editor ol {
    padding-top: .75em;
    padding-bottom: .75em;
  }
  .editor ul {
    list-style: disc;
    padding-left: 1em;
  }
  .editor a:not(.bouton) {
    /*border-bottom: 2px solid var(--main-color1);*/
    transition: border-color ease 0.3s;
    border-bottom: 1px solid #000;
  }
  .editor a:not(.bouton):hover {
    border-bottom-color: transparent;
  }
  .editor strong {
    font-weight: var(--bold);
  }
  .editor h2 {
    font-size: 1.4em;
    /*font-size: clamp(1.75rem, 1.5983rem + 0.6472vw, 2.375rem);*/
    font-weight: var(--medium);
    line-height: normal;
    padding-top: 0.75em;
    padding-bottom: 0.25em;
  }
  .editor h3 {
    /*font-weight: 700;*/
    font-size: 1.2em;
    font-weight: var(--medium);
    line-height: 1.25;
    padding-top: 0.75em;
    padding-bottom: 0.25em;
    color: var(--main-color2);
  }
  .editor hr {
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    border-top: 1px solid #000;
  }

  .editor .grispetit {
    color: #2b2b2b;
    font-size: .65em;
  }

  /* chapeau */
  .editor .chapeau {
    font-size: 1.25em;
    font-weight: 400;
    color: var(--main-color2);
  }

  /* table */
  .editor table {
    width: 100%;
    border-collapse: collapse;
    border: 0;
    margin-top: 4em;
    margin-bottom: 3em;
  }
  .editor table th {
    padding: 0.75em;
    background-color: #f0f0f0;
    border-bottom: 2px solid var(--main-color1);
    text-align: left;
    font-weight: 700;
  }
  .editor table tr:nth-child(2n) {
    background-color: var(--main-bgcolor0);
  }
  .editor table tr:nth-child(2n + 1) {
    background-color: #f8f8f8;
  }
  .editor table td {
    border-bottom: 2px solid var(--main-color1);
    padding: 0.75em;
    color: var(--main-color1);
  }
  /* exergue */
  .editor .exergue {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 4em;
    margin-bottom: 3em;
    color: var(--main-color2);
    padding-left: 1.5em;
    border-left: 6px solid var(--main-color2);
    font-weight: 700;
  }

  /* blockquote */
  .editor blockquote {
    position: relative;
    font-family: var(--font2);
    padding-top: 1.5em;
    margin-top: 4em;
    margin-bottom: 2em;
    margin-inline-start: 0;
    margin-inline-end: 0;
    line-height: normal;
    color: var(--main-color2);
    padding-top: calc(var(--padunit) * 0.5);
  }

  .editor blockquote p {
    display: inline-block;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    word-break: break-word;
    /*padding: 0.15em 0.5em;*/
    /*font-size: 1.5em;*/
    font-size: .75em;
    font-weight: 400;
    font-style: italic;
    line-height: normal;
    padding: calc(var(--padunit) * 0.25) calc(var(--padunit) * 4.375);
    padding-top: .75em;
    padding-bottom: .25em;
  }

  .product-detail__container.editor blockquote p {
    padding-left: 0;
    padding-right: 0;
  }

  @media (max-width: 640px) {
    .editor blockquote p {
      padding: .75em 0 .25em 0;
    }
  }

  .editor blockquote:before {
    left: 0;
    top: -.15em;
    content: "\201C";
    position: absolute;
    font-size: 7em;
    line-height: 0.49;
  }
  @media (min-width: 641px) {
    .editor blockquote:before {
      top:0;
      font-size: 7em;
      margin-left: 3.5vw;
    }
    .editor blockquote {
      padding-top: 0;
      /*padding-left: 4em;*/
    }
    .product-detail__container.editor blockquote:before {
      margin-left: -.4em;
    }  
  }
  .video__cont {
      margin: 2em 0;
  }
  .embed-container {
      margin: 0 0;
      position: relative;
      height: 0;
      padding-bottom: 56.25%;
      overflow: hidden;
  }
  .embed-container iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
  }
  .embed-youtube {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    /*aspect-ratio: 1.861;*/
    background-color: #000;
    color: #fff;
    margin-top: 2em;
    margin-bottom: 2em;
  }
  .embed-youtube a::after {
    content: "►";
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 1.5em;
    line-height: 1;
    padding: .85em .75em .75em .85em;
    z-index: 10;
    color: var(--main-color1);
    pointer-events: none;
    transition: all ease .3s;
    background-color: var(--main-bgcolor0);
  }
  .embed-youtube a:hover::after {
    background-color: var(--main-color1);
    color: var(--main-bgcolor0);
  }
  .embed-youtube--1-6 {
    aspect-ratio: 1.6;
  }
  .embed-youtube iframe, .embed-youtube a {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  .embed-youtube img {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .imgmultiins {
    margin-top: 2em;
    margin-bottom: 2em;
  }
  .imgmultiins img {
    border-radius: var(--border-radius-media);
  }
  .imgmultiins__figcaption {
    font-size: .8em;
    color: #AAAAAA;
    margin-top: .75em;
  }
  @media (min-width: 900px) {
    .imgmultiins {
        margin-left: 0;
        margin-right: 0;
    }
  }
  /*ACCORDION*/
  *:not(.accordion) + .accordion {
    margin-top: 2em;
  }
  .accordion + *:not(.accordion) {
    margin-top: 1.5em;
  }
  .accordion {
    border-top: 2px solid var(--main-color1);
    border-bottom: 2px solid var(--main-color1);
  }
  .accordion + .accordion {
    border-top-width: 0;
  }
  .accordion__btn, .editor h2.accordion__btn {
    font-family: var(--font2);
    text-transform: var(--titreuc);
    display: block;
    font-size: 1em;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    background-color: var(--main-bgcolor0);
    color: var(--main-color1);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='36' height='21'%3E%3Cpath d='M0 2.821 2.8 0 18 15.352 33.2 0 36 2.821 20.8 18.175 18 21Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: .75em .44em;
    background-position: right 1.15em;
    padding-right: 1.5em;
    padding-top: .7em;
    padding-bottom: 0;
  }
  /*
  .accordion__btn:hover {
    background-color: #fff
  }
  */
  .accordion__btn.active {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' width='36' height='21'%3E%3Cpath d='M36 18.179 33.2 21 18 5.648 2.8 21 0 18.179 15.2 2.825 18 0Z'/%3E%3C/svg%3E")
  }
  .accordion__contenu {
    padding-top: 1em;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height .5s ease-out;
    transition: max-height .5s ease-out;
    font-size: 1em;
    line-height: 1.5;
    color: var(--main-color1);
  }
  .accordion__contenu::after {
    content: "-";
    opacity: 0;
  }

.blog-detail__content pre {
  font-size: .75em;
  padding: 0;
}
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}
.hljs{background:#2b2b2b;color:#f8f8f2}.hljs-comment,.hljs-quote{color:#d4d0ab}.hljs-deletion,.hljs-name,.hljs-regexp,.hljs-selector-class,.hljs-selector-id,.hljs-tag,.hljs-template-variable,.hljs-variable{color:#ffa07a}.hljs-built_in,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-type{color:#f5ab35}.hljs-attribute{color:gold}.hljs-addition,.hljs-bullet,.hljs-string,.hljs-symbol{color:#abe338}.hljs-section,.hljs-title{color:#00e0e0}.hljs-keyword,.hljs-selector-tag{color:#dcc6e0}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}@media screen and (-ms-high-contrast:active){.hljs-addition,.hljs-attribute,.hljs-built_in,.hljs-bullet,.hljs-comment,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-quote,.hljs-string,.hljs-symbol,.hljs-type{color:highlight}.hljs-keyword,.hljs-selector-tag{font-weight:700}}  








/* BUTTONS */

.button__white--shadow{
  display: flex;
  gap: 0.43em;
  align-items: center;
  padding: 1em;
  background-color: var(--grey);
  width: fit-content;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  border-radius: 1000px;
  box-shadow: 9px 9px 0px 0px #000;
  border: 2px solid var(--black);
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

.button__white--shadow:hover{
  box-shadow: 0px 0px 0px 0px #000;
  transform: translate(9px, 9px);
}


/* _______________ */



.button__white--fill{
  border-radius: 1000px;
  background: var(--white);
  padding: 1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: var(--black);
  transition: color 0.3s ease-in-out;
  display: block;
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}

.button__white--fill span{
  position: relative;
  z-index: 1;
}
.button__white--fill:hover {
  color: var(--white);
}

.button__white--fill::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 1000px;
  background-color: black;
  transform: translate(-50%, -50%) scale(0);
  transition: all 0.3s ease-in-out;
}

.button__white--fill:hover::after{
  transform: translate(-50%, -50%) scale(1.1);
}


/* _______________ */
.button__black--fill{
  border-radius: 1000px;
  background: var(--black);
  padding: 1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: var(--white);
  transition: color 0.3s ease-in-out;
  display: block;
  border: solid 2px var(--black);
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}

.button__black--fill span{
  position: relative;
  z-index: 1;
}
.button__black--fill:hover {
  color: var(--black);
}

.button__black--fill::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 1000px;
  background-color: var(--white);
  transform: translate(-50%, -50%) scale(0);
  transition: all 0.3s ease-in-out;
}

.button__black--fill:hover::after{
  transform: translate(-50%, -50%) scale(1.1);
}


/* _______________ */



.button__white--stroke{
  border-radius: 1000px;
  background: var(--white);
  border: 2px solid var(--black);
  padding: 1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: var(--black);
  transition: color 0.3s ease-in-out;
  display: inline-block;
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}

.button__white--stroke span{
  position: relative;
  z-index: 1;
}
.button__white--stroke:hover {
  color: var(--white);
}

.button__white--stroke::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 1000px;
  background-color: black;
  transform: translate(-50%, -50%) scale(0);
  transition: all 0.3s ease-in-out;
}

.button__white--stroke:hover::after{
  transform: translate(-50%, -50%) scale(1.1);
}


/* _______________ */



.button__black--stroke{
  border-radius: 1000px;
  background: var(--black);
  border: 2px solid var(--white);
  padding: 1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: var(--white);
  transition: color 0.3s ease-in-out;
  box-sizing: border-box;
  display: inline-block;
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}

.button__black--stroke span{
  position: relative;
  z-index: 1;
}
.button__black--stroke:hover {
  color: var(--black);
}


.button__black--stroke::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  border-radius: 1000px;
  background-color: var(--white);
  transform: translate(-50%, -50%) scale(0);
  transition: all 0.3s ease-in-out;
}

.button__black--stroke:hover::after{
  transform: translate(-50%, -50%) scale(1.1);
}


/* _______________ */


.button--arrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6em;
}

.arrow{
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.258 18.581 18.581 3.258m0 0L4.112 3.211m14.47.047.047 14.47' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 1em;
  height: 1em;
  aspect-ratio: 1/1;
  mix-blend-mode: difference;
}


/* _______________ */



.button__product-card{
  padding: 0.75em 1em;
  transform: translate(0);
  font-size: 0.6em;
  pointer-events: all;
}


/* _______________ */


.link--dark{
  color: var(--black);
  text-decoration: underline;
  font-size: clamp(1rem, 1rem + 0vw, 1rem);
}

.link--white{
  color: var(--white);
  text-decoration: underline;
  font-size: clamp(1rem, 1rem + 0vw, 1rem);
}



/* _______________ */


.bouton {
  border-radius: 1000px;
  background: var(--white);
  border: 2px solid var(--black);
  padding: 1em;
  text-transform: uppercase;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  color: var(--black);
  transition: 0.2s ease-in-out;
  transition-property: color, background-color;
  display: inline-block;
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}
.bouton:hover {
  color: var(--white);
  background-color: var(--black);
}




@media (max-width: 860px) {
  .bouton, .button__black--stroke, .button__white--stroke, .button__black--fill, .button__white--fill, .button__white--shadow{
    padding:1em 1.3125em;
  }
}



/* _______________ */


.disabled{
  opacity: 0.5;
}



/* PADDING */

.pdtb{
    padding-top: calc(var(--padunit) * var(--pdlr-colbase));
    padding-bottom: calc(var(--padunit) * var(--pdlr-colbase));
}

.pdlr{
    padding-left: calc(var(--padunit) * var(--pdlr-colbase));
    padding-right: calc(var(--padunit) * var(--pdlr-colbase));
}



/* PADDING TOP */

.pt_05{
    padding-top: calc(var(--padunit) * 0.5);
}
.pt_1{
    padding-top: calc(var(--padunit) * var(--coef_marge_verti) );
}
.pt_1--05{
    padding-top: calc(var(--padunit) * 1.5);
}

.pt_2{
    padding-top: calc(var(--padunit) * 2);
}

.pt_3{
    padding-top: calc(var(--padunit) * 3);
}
.pt_4{
    padding-top: calc(var(--padunit) * 4);
}
.pt_5{
    padding-top: calc(var(--padunit) * 5);
}
.pt_6{
    padding-top: calc(var(--padunit) * 6);
}



/* PADDING BOTTOM */

.pb_05{
    padding-bottom: calc(var(--padunit) * 0.5);
}
.pb_1{
    padding-bottom: calc(var(--padunit) * 1);
}

.pb_2{
    padding-bottom: calc(var(--padunit) * 2);
}

.pb_3{
    padding-bottom: calc(var(--padunit) * 3);
}

.pb_3--05{
    padding-bottom: calc(var(--padunit) * 3.5);
}

.pb_4{
    padding-bottom: calc(var(--padunit) * 4);
}



/* PADDING LEFT */

.pl_05{
    padding-left: calc(var(--padunit) * 0.5);
}
.pl_1{
    padding-left: calc(var(--padunit) * 1);
}

.pl_2{
    padding-left: calc(var(--padunit) * 2);
}

.pl_3{
    padding-left: calc(var(--padunit) * 3);
}



/* PADDING RIGHT */

.pr_1{
    padding-right: calc(var(--padunit) * 1);
}

.pr_2{
    padding-right: calc(var(--padunit) * 2);
}

.pr_3{
    padding-right: calc(var(--padunit) * 3);
}






/* MATTER JS */

.matter-container{
	width: 100%;
	height: 100%;
}

#matter-container{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	pointer-events: all;
  z-index: 0;
  width: 100%;
	height: 100%;
}

.matter-svg{
	display: none;
	pointer-events: auto;
  z-index: 1;
}

.matter-path{
	pointer-events: auto;
}

.matter-svg-2560{
  display: none;

}

.matter-svg-2560--show{
  display: block;
}


/* HEADER */

.header{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-family: var(--font);
	z-index: 100;
  transition: 0.2s ease-in-out;
  pointer-events: none;
  /*opacity: 0;*/
}

@media (max-width: 640px) {
  .header{
    padding: calc(var(--padunit-mobile) * 0.75) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.header__logo{
  pointer-events: all;
}
.header__logo img{
  width: 75%;
  height: auto;
}
.header__logo--white img{
  filter: invert(1);
}
.header__navul{
	display: flex;
	align-items: center;
}
@media (max-width: 860px) {
  .header__nav{
    display: none;
  }
}

.header__nava{
	border-radius: 100px;
	padding: 0.86em 1em;
  color: var(--black);
  pointer-events: all;
  pointer-events: all;
  transition: all 0.2s ease-in-out;

}
.header__nava:hover{
  opacity: 0.5;
}
@media (max-width: 860px) {
  .header__nava{
    padding: 0;
    color: var(--white);
  }
}
.header__nava--white{
  color: var(--white);
}

.header__menu{
  display: none;
  position: relative;
  padding: 8px 4px;
  box-sizing: border-box;
  color: black;
  font-size: 1.3125em;
  pointer-events: all;
  transition: color 0.2s ease-in-out;
}
@media (max-width: 860px) {
  .header__menu{
    display: block;
  }
}
.header__menu--white{
  color: var(--white);
}

.header--scrolled{
  transform: translateY(-100%);
}
.header--bg{
  background-color: var(--white);
}
.header--bg .header__logo img{
  filter: none;
}

/* .header__menu--line {
  display: block;
  position: absolute;
  height: 2px;
  width:calc(100% - 8px);
  background-color: var(--white);
  transform-origin: center;
  transition: all 0.2s ease-in-out;
}

.header__menu--line1{
  top: calc(0% + 8px);
  left: 50%;
  transform: translate(-50%, -50%);
}

.header__menu--line1--cross{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.header__menu--line2{
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.header__menu--line2--cross{
  opacity: 0;
}

.header__menu--line3{
  top: calc(100% - 8px);
  left: 50%;
  transform: translate(-50%, -50%);
}

.header__menu--line3--cross{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  transform-origin: center;
} */

.menu__wrapper {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  background-color: var(--black);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  color: var(--white);
  padding: calc(var(--padunit-mobile) * 0.75) calc(var(--padunit-mobile) / 2);
  transform: translateX(100%);
  transition: 0.3s ease-in-out;
}

.menu__wrapper--show{
  transform: translateX(0%);
}

@media (min-width: 860px) {
  .menu__wrapper{
    display: none;
  }
}

.menu__cross{
  position: absolute;
  top:  calc(var(--padunit-mobile) * 0.75);
  right: calc(var(--padunit-mobile) / 2);
  width: 2em;
  height: 2em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 23.75 6.25 22l7-7-7-7L8 6.25l7 7 7-7L23.75 8l-7 7 7 7L22 23.75l-7-7-7 7Z' fill='%23fff'/%3E%3C/svg%3E");
}

.menu__content ul{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75em;
  font-size: 2.375em;
}

.rs--wrapper--menu{
  position: absolute;
  bottom: calc(var(--padunit-mobile) * 0.75);
  margin-bottom: 0 !important;
}



/* HERO */

.hero{
  pointer-events: none;
  position: relative;
  overflow: hidden;
}

.hero__title{
  position:absolute;
  bottom: calc(var(--padunit) * 2);
  right: 0;
  display: flex;
  flex-direction: column;
  width: calc((var(--grille1col) * 6) + (var(--grille-gap) * 2));
  pointer-events: none;
  /* font-size: clamp(1.75rem, 1.1129rem + 2.7184vw, 4.375rem); */
  font-size: clamp(28px, 3.656vw, 93px);
  padding-right: calc(var(--padunit) * var(--pdlr-colbase));
}
/*
.hero__title span {
  opacity: 0;
  transform: translateY(25%) rotate(2deg);
}
*/

/* @media (min-width:1920px) {
  .hero__title{
    font-size: clamp(4.375rem, 0.0625rem + 3.5937vw, 5.8125rem);
  } 
}*/
@media (max-width: 640px) {
  .hero__title{
    padding: 0 calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    pointer-events: all;
    z-index: 1;
    width: 100%;
  }
}
@media (max-width: 480px) {
  .hero__title{
    bottom: calc(var(--padunit-mobile) * 3);
  }
}

.hero__title span {
  pointer-events: none; 
}
@media (max-width: 640px) {
  .hero__title span {
    pointer-events: all; 
  }
}

#canvas{
  width: 100%;
  height: 100%;
}
#myCanvas{
  width: 100%;
  height: 100%;
}

.hero__button {
  position: absolute;
  z-index: 100;
  top: calc(var(--padunit) * 6);
  left: calc(var(--padunit) * var(--pdlr-colbase) * 4);
  display: flex;
  gap: calc(var(--padunit) * 0.5);
  pointer-events: all;

  border-color: transparent;
}
@media (max-width: 640px) {
  .hero__button{
    top: auto;
    bottom: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    left: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}




/* PRODUCT */

.product{
  background-color: white;
  pointer-events: all;
}
@media (max-width: 640px) {
  .product{
    padding: var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.product__wrapper{
  display: flex;
  flex-wrap: wrap;
  gap: var(--grille-gap);
}
@media (max-width: 640px) {
  .product__wrapper{
    gap: calc(var(--grille-gap) * 0.6);
  }
}

.product__name {
  text-align: start;
  line-height: 95%;
  font-size: clamp(1.75rem, 1.1129rem + 2.7184vw, 4.375rem);
}

.product__desc{
  font-size: clamp(1rem, 0.5449rem + 1.9417vw, 2.875rem);
}

.product__card--wrapper {
  width: calc(100% / 3 - (var(--grille-gap)));
  aspect-ratio: 606/340;
  background-color: var(--black);
  position: relative;
  overflow: hidden;
  min-width: 300px;
  /*
  transform: translateY(10%);
  opacity: 0;
  */
  cursor: pointer;
}
@media (max-width: 1150px) {
  .product__card--wrapper{
    min-width: calc(50% - var(--grille-gap));
    padding: calc(var(--padunit-mobile) / 4);
  }
}
@media (max-width: 640px) {
  .product__card--wrapper{
    padding: calc(var(--padunit-mobile) * 0.3);
    width: 100%;
    aspect-ratio: 320/180;
  }
}
@media (max-width: 640px) {
  .product__card--wrapper:nth-child(2){
    width: 100%;
    aspect-ratio: 320/180;
  }
}
.product__card--default{
  padding: var(--padunit);
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 640px) {
  .product__card--default{
    align-items: center;
    justify-content: space-between;
  }
}

.product__card-title {
  font-size: clamp(1.3125rem, 1.0546rem + 1.1003vw, 2.375rem);
  color: white;
}
@media (max-width: 640px) {
  .product__card-title{
    text-align: center;
    word-break: break-word;
  }
}

.product__card-desc{
  color: white;
  /*font-size: clamp(1rem, 0.818rem + 0.7767vw, 1.75rem);*/
  font-size: .8em;
  padding-bottom: calc(var(--padunit) * 1.5);
}

@media (max-width: 1150px) {
  .product__card-desc{
    font-size: clamp(1.0625rem, 0.1719rem + 1.5vw, 1.25rem);
  }
}
@media (max-width: 1150px) {
  .product__card-desc{
    font-size: 1em;
  }
}


.product__card--hover{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  opacity: 0;
  transition: all 0.2s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product__card--wrapper:hover .product__card--hover{
  opacity: 0;
}

.product__card--wrapper .product__card--hover{
  opacity: 1;
}
/*
@media (max-width: 640px) {
  .product__card--wrapper .product__card--hover{
    opacity: 1;
  }
}
*/


.product__card--hover__buttons{
  padding: calc(var(--padunit) / 2);
  position: absolute;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: calc(var(--padunit) * 0.5);
  width: 100%;
  z-index: 10;
  pointer-events: none;
}
@media (max-width: 1150px) {
  .product__card--hover__buttons{
    padding: calc(var(--padunit-mobile) / 4);
  }
}


.product__card--wrapper:hover .product__card--hover__buttons{
  /* pointer-events: all; */
}

.product__card--vid{
  min-width: 101%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.product__card--white {
  background-color: var(--white);
}

.product__card--first{
  display: flex;
  flex-direction: column;
  gap: calc(var(--padunit) * 0.5);
  padding: 0;
  cursor: inherit;
}
@media (max-width: 640px) {
  .product__card--first{
    gap: calc(var(--padunit-mobile) * 0.4);
    padding: 0;
    margin-bottom: var(--padunit-mobile);
    height: fit-content;
    min-height: inherit;
    width: 100% !important;
    aspect-ratio: inherit;
  }
}


.product__card-title--black {
  color: var(--black);
  font-weight: var(--medium);
  font-size: clamp(1.75rem, 1.5983rem + 0.6472vw, 2.375rem);
}
@media (max-width: 640px) {
  .product__card-title--black{
    text-align: start;
  }
}

.product__card--button{
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 950px) {
  .product__card--button{
    padding-top: calc(var(--padunit) * 3);
    min-height: fit-content !important;
    width: 100%;
  }
}
@media (max-width: 640px) {
  .product__card--button{
    height: fit-content;
    margin-top: calc(var(--padunit-mobile) - var(--grille-gap) * 0.5);
  }
}

.rub__header {
  margin-top: 7.25em;
}
@media (max-width: 640px) {
  .rub__header {
    padding: var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-bottom: 0;
  }
}
.rub__header__tit {
  font-size: clamp(1.75rem, 1.1584rem + 2.5243vw, 4.1875rem);
  text-transform: uppercase;
  max-width: 960px;
  padding-bottom: .25em;
}






/* MOBO SUPER SUITE */

.mobo-suite{
  display: flex;
  background: linear-gradient(180deg, #DAFF67 0%, #66FF87 100%);
  align-items: center;
  overflow: hidden;
}
@media (max-width: 640px) {
  .mobo-suite{
    flex-direction: column;
    align-items: center;
    background: white;
    height: fit-content;
  }
}

.mobo-suite__img{
  width: calc(var(--grille1col) * 8);
  min-height: 100%;
  object-fit: cover;
  /*
  opacity: 0;
  transform: translateY(50px);
  */
}
@media (max-width: 950px) {
  .mobo-suite__img{
    width: 60%;
  }
}
@media (max-width: 640px) {
  .mobo-suite__img{
    width: 100%;
    height: 22.5em;
    padding: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase)) 0;
  }
}

.mobo-suite__content{
  display: flex;
  flex-direction: column;
  gap: 1.78em;
  height: 100%;
  width: calc(var(--grille1col) * 3);
  margin-left: var(--padunit);
  margin-bottom: calc(var(--padunit) * 1.5);
  margin-top: calc(var(--padunit) * 1.5);
  /*
  opacity: 0;
  transform: translateY(50px);
  */
}
@media (max-width: 950px) {
  .mobo-suite__content{
    padding:  calc(var(--padunit) * var(--pdlr-colbase)) ;
    width: 100%;
    height: 100%;
  }
}
@media (max-width: 640px) {
  .mobo-suite__content{
    padding: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase))   calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase)) var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    width: 100%;
    height: fit-content;
    align-items: center;
  }
}

.mobo-suite__p{
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
}

@media (max-width: 640px) {
  .mobo-suite__button{
    padding: 1.31em;
  }
}





/* TUTORIALS */

.news{
  background-color: var(--white);
  pointer-events: all;
}

@media (max-width: 750px) {
  .section__cards{
    padding: var(--padunit-mobile) 0;
  }
}

.section__header{
  display: flex;
  flex-direction: column;
  gap: 0.75em;

}
@media (max-width: 640px) {
  .section__header{
    padding-left: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.section__header--label{
  font-size: clamp(0.75rem, 0.6893rem + 0.2589vw, 1rem);
  /*transform: translateY(50px);
  opacity: 0;*/
}

.section__header--title{
  font-size: clamp(1.75rem, 1.5983rem + 0.6472vw, 2.375rem);
  font-weight: var(--medium);
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}


.card__container{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--grille-gap);
  width: 100%;
  margin-bottom: calc(var(--padunit) * 2);
  box-sizing: border-box;
  padding-top: 2.5em;
  padding-bottom: 1em;
}

@media (max-width: 1300px) {
  .card__container{
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: calc(var(--padunit) * 3)
  }
}
@media (max-width: 1050px) {
  .card__container{
    grid-template-columns: repeat(2, 1fr);
    gap: calc(var(--grille-gap) * 2);
  }
}
@media (max-width: 640px) {
  .card__container{
    display: flex;
    width: 100%;
    overflow-x: scroll;
    gap: 1em;
    padding-left: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}



.card__container {
  --sb-track-color: #5e5e5e;
  --sb-thumb-color: #a5a5a5;
  --sb-size: 7px;
}

.card__container::-webkit-scrollbar {
  height: var(--sb-size);
}

.card__container::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: 9px;
}

.card__container::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: 9px;
}

@supports not selector(::-webkit-scrollbar) {
  .card__container {
      scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);
  }
}

.card{
  display: flex;
  flex-direction: column;
  border: solid  1px var(--black);
  padding: 0.57em;
  gap: 0.75em;
  /*
  transform: translateY(50px);
  opacity: 0;
  */
  transition: 0.1s ease-in-out;
  transition-property: color, background-color;
  position: relative;
  z-index: 0;
  overflow: hidden;
}

@media (max-width: 640px) {
  .card{
    min-width: calc(100% - (var(--grille-gap) * 1));
    padding: 1em;
  }
}

.tutorials__card{
  border: solid  1px var(--white);
}

.tutorials__card::before{
  content: '';
  position: absolute;
  top: calc(var(--y, 0) * 1px - 50px);
  left: calc(var(--x, 0) * 1px - 50px);
  transform: translate(-50%, -50%);
  width: auto;
  height: 0%;
  aspect-ratio: 1/1;
  background-color: var(--white);
  z-index: -1;
  border-radius: 1000px;
  transition: height 0.4s ease-out;
}

.tutorials__card:hover::before{
  height: 250%;
  transition: height 0.8s ease-out;
}

.tutorials__card:hover{
  color: var(--black);
}
@media (max-width: 860px) {
  .tutorials__card::before{
    content: '';
    display: none;
  }
  .tutorials__card:hover::before{
    display: none;
  }
  .tutorials__card:hover{
    color: inherit;
  }
}
.news__card::before{
  content: '';
  position: absolute;
  top: calc(var(--y, 0) * 1px - 50px);
  left: calc(var(--x, 0) * 1px - 50px);
  transform: translate(-50%, -50%);
  width: auto;
  height: 0%;
  aspect-ratio: 1/1;
  background-color: var(--black);
  z-index: -1;
  border-radius: 1000px;
  transition: height 0.4s ease-out;
}

.news__card:hover::before{
  height: 250%;
  transition: height 0.8s ease-out;
}

.news__card:hover{
  color: var(--white);
}
@media (max-width: 860px) {
  .news__card::before{
    content: '';
    display: none;
  }
  .news__card:hover::before{
    display: none;
  }
  .news__card:hover{
    color: inherit;
  }
}

.card__content{
  display: flex;
  flex-direction: column;
  gap: 0.75em;
  margin-top: 0.7em;
}

.card__content--cate-container{
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}

.card__content--cate{
  font-size: clamp(0.75rem, 0.6893rem + 0.2589vw, 1rem);
  font-weight: var(--medium);
  padding: 0.375em;
  border: 1px solid var(--black);
  width: fit-content;
}

.tutorials__card__content--cate{
  border: 1px solid var(--white);
}

.card__content--title{
  /*font-size: clamp(1.75rem, 1.5983rem + 0.6472vw, 2.375rem);*/
  /*font-size: clamp(0.9375rem, 0.6908rem + 1.0526vw, 2.375rem)*/ /* 15 38 */
  font-size: 1.2em;
  font-weight: var(--medium);
}

.card__content--desc{
  /*font-size: clamp(1.3125rem, 1.2063rem + 0.4531vw, 1.75rem);*/
  /*font-size: clamp(0.875rem, 0.7248rem + 0.6407vw, 1.75rem);*/ /* 14 28-2560 */
  font-size: .75em;
}

.card__content--wrapper{
  display: flex;
  flex-direction: column;
  gap: 2.25em;
  height: 100%;
  justify-content: space-between;
}

.card__link{
  padding: 0.5em 0;
  text-decoration: underline;
  font-size: 0.8em;
}
@media (max-width: 800px) {
  .card__link{
    display: none;
  }
}

.section__button{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1.5em;
}

@media (max-width: 640px) {
  .section__button{
    margin-top: var(--padunit-mobile);
  }
}




/* FOOTER */

.footer{
  pointer-events: all;
}

@media (max-width: 750px) {
  .footer{
    padding: var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.footer__top--container{
  display: flex;
  justify-content: space-between;
  margin-bottom: calc(var(--padunit) * 6.5);
  gap: 1em;
  
}

@media (max-width: 750px) {
  .footer__top--container{
    flex-direction: column;
    width: 100%;

  }
}
@media (max-width: 450px) {
  .footer__top--container{
    gap: 4.375em;
    margin-bottom: calc(var(--padunit) * 9.57);
  }
}


.footer__top--logo--wrapper{
  display: flex;
  flex-direction: column;
  gap: 0.75em;

}

@media (max-width: 950px) {
  .footer__top--logo--wrapper{
    width: 50%;
    
  }
}
@media (max-width: 750px) {
  .footer__top--logo--wrapper{
    width: 100%;
    
  }
}

.footer__top--logo{
  width: 19.8%;
  height: auto;
  filter: brightness(0) saturate(100%) invert(100%) sepia(42%) saturate(366%) hue-rotate(292deg) brightness(120%) contrast(105%);
}

@media (max-width: 750px) {
  .footer__top--logo{
    width: 17.2%;
  }
}

.footer__top--title{
  font-size: clamp(1.75rem, 1.75rem + 0vw, 1.75rem);
  padding:  0.75em 0;
}

.footer__top--content--wrapper{
  display: flex;
  width: 50%;
  gap: 0.75em;
}

@media (max-width: 750px) {
  .footer__top--content--wrapper{
    width: 100%;
  }
}
@media (max-width: 450px) {
  .footer__top--title p:nth-child(2){
    display: inline;
  }
  .footer__top--title p:last-child{
    display: inline;
  }
}

.footer__top--content--links{
  display: flex; 
  flex-direction: column;
  gap: 1.43em;
  width: 50%;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
}

.footer__top--content--links ul{
  display: flex;
  flex-direction: column;
  gap: 0.75em;
}
.footer__top--content--links ul h3{
  margin-bottom: 1.43em;
}

.footer__bottom--container{
  display: flex;
  justify-content: space-between;
}

@media (max-width: 750px) {
  .footer__bottom--container{
    flex-direction: column;
  }
}

.footer__bottom--content--wrapper{
  display: flex;
  gap: 0.75em;
  width: 50%;
}

@media (max-width: 750px) {
  .footer__bottom--content--wrapper{
    width: 100%;
    flex-direction: column;
    gap: 1.75em;
  }
}

.footer__bottom--links--container{
  display: flex; 
  flex-direction: column;
  gap: 0.75em;
  width: 50%;
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  justify-content: flex-end;
}

@media (max-width: 750px) {
  .footer__bottom--links--container{
    width: 100%;
  }
}

.footer__bottom--links--container a{
  color: var(--grey--darker);
  text-decoration: underline;
}

.footer__bottom--links--container a:hover{
  color: var(--white);
}

.footer__link {
  text-decoration: underline;
}

.footer__top--content--links ul li a:hover{
  text-decoration: underline;
}
.footer__menu--link:hover{
  text-decoration: underline;
}

.rs--wrapper{
  display: flex;
  gap: 0.75em;
  align-items: flex-end;
}

@media (max-width: 750px) {
  .rs--wrapper{
    align-items: center;
    justify-content: center;
    margin-bottom: calc(var(--padunit) * 6.5);
  }
}

@media (max-width: 450px) {
  .rs--wrapper{
    gap: 1.5em;
    margin-bottom: calc(var(--padunit) * 9.57);
  }
}

.rs__icon{
  width: 0.93em;
  height: 0.93em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: all;
}

@media (max-width: 750px) {
  .rs__icon{
    width: 1.625em;
    height: 1.625em;
  }
}



.rs__icon--x{
  background-image: url("data:image/svg+xml,%3Csvg width='29' height='27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m.07 0 11.197 14.892L0 27h2.536L12.4 16.4 20.37 27H29L17.174 11.27 27.66 0h-2.536L16.04 9.763 8.7 0H.07ZM3.8 1.858h3.964L25.27 25.142h-3.964L3.8 1.858Z' fill='%23fff'/%3E%3C/svg%3E");
}

.rs__icon--insta{
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cmask id='b' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='0' y='0' width='26' height='27'%3E%3Cpath d='M0 0h26v27H0V0Z' fill='%23fff'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath d='M12.958.09c-3.52 0-3.96.016-5.34.081A9.199 9.199 0 0 0 4.47.796a6.327 6.327 0 0 0-2.295 1.552A6.635 6.635 0 0 0 .68 4.732a10.162 10.162 0 0 0-.602 3.266C.016 9.432 0 9.89 0 13.545s.016 4.111.078 5.546c.022 1.116.226 2.22.603 3.266a6.623 6.623 0 0 0 1.494 2.383 6.328 6.328 0 0 0 2.295 1.554 9.206 9.206 0 0 0 3.148.625C9 26.984 9.442 27 12.959 27c3.518 0 3.96-.016 5.342-.081a9.212 9.212 0 0 0 3.147-.625 6.622 6.622 0 0 0 2.294-1.554 6.926 6.926 0 0 0 1.495-2.383 10.31 10.31 0 0 0 .602-3.265c.063-1.436.079-1.895.079-5.547 0-3.652-.017-4.113-.079-5.548a10.306 10.306 0 0 0-.606-3.265 6.633 6.633 0 0 0-1.495-2.384A6.315 6.315 0 0 0 21.443.797 9.228 9.228 0 0 0 18.296.17C16.914.106 16.474.09 12.954.09h.004Zm-1.163 2.425h1.163c3.459 0 3.869.012 5.235.077.822.01 1.635.167 2.406.463.562.216 1.071.56 1.489 1.006.43.434.761.963.97 1.548.285.8.436 1.644.445 2.497.063 1.419.076 1.845.076 5.436s-.013 4.017-.076 5.435a7.694 7.694 0 0 1-.446 2.498 4.482 4.482 0 0 1-.97 1.546c-.423.44-.93.782-1.488 1.006a6.912 6.912 0 0 1-2.406.464c-1.366.065-1.776.079-5.235.079-3.46 0-3.87-.014-5.236-.079a6.951 6.951 0 0 1-2.406-.463 4.002 4.002 0 0 1-1.49-1.007 4.187 4.187 0 0 1-.97-1.546 7.692 7.692 0 0 1-.446-2.498c-.062-1.418-.075-1.845-.075-5.437 0-3.593.013-4.017.075-5.436.01-.853.16-1.698.446-2.498.208-.585.54-1.114.97-1.548a4.01 4.01 0 0 1 1.49-1.007 6.923 6.923 0 0 1 2.406-.464c1.196-.056 1.659-.073 4.074-.076v.004Zm8.079 2.234c-.307 0-.608.094-.863.272-.256.177-.455.43-.573.725-.117.295-.148.62-.088.932.06.313.208.601.426.827.217.225.494.379.796.441.301.062.614.03.898-.092a1.57 1.57 0 0 0 .697-.595 1.66 1.66 0 0 0-.194-2.038 1.552 1.552 0 0 0-.504-.35 1.505 1.505 0 0 0-.595-.122Zm-6.916 1.886A6.48 6.48 0 0 0 9.262 7.8a6.86 6.86 0 0 0-2.451 3.1 7.156 7.156 0 0 0-.379 3.993 6.995 6.995 0 0 0 1.82 3.538 6.58 6.58 0 0 0 3.407 1.89c1.29.267 2.628.13 3.844-.392a6.715 6.715 0 0 0 2.986-2.545 7.099 7.099 0 0 0 1.122-3.838c0-1.832-.701-3.59-1.949-4.886a6.532 6.532 0 0 0-4.704-2.024Zm0 2.425c.854 0 1.69.263 2.4.756a4.452 4.452 0 0 1 1.59 2.013c.327.82.412 1.72.246 2.59a4.54 4.54 0 0 1-1.182 2.297 4.271 4.271 0 0 1-2.211 1.227 4.17 4.17 0 0 1-2.496-.255 4.358 4.358 0 0 1-1.938-1.651 4.608 4.608 0 0 1-.728-2.492c0-1.19.455-2.33 1.265-3.171a4.239 4.239 0 0 1 3.054-1.314Z' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h26v27H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.rs__icon--in{
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cmask id='b' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='0' y='0' width='26' height='27'%3E%3Cpath d='M0 0h26v27H0V0Z' fill='%23fff'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M23.053.09H2.897c-.378 0-.753.077-1.102.227-.35.15-.667.37-.934.648a3 3 0 0 0-.624.97 3.09 3.09 0 0 0-.22 1.145v20.93c0 .394.075.782.22 1.145a3 3 0 0 0 .624.97c.267.278.585.498.934.648.35.15.724.228 1.102.228h20.156c.378 0 .752-.078 1.101-.228.35-.15.667-.37.934-.648a3 3 0 0 0 .624-.97c.145-.363.22-.752.22-1.144V3.08c0-.393-.075-.782-.22-1.144a3 3 0 0 0-.624-.97 2.874 2.874 0 0 0-.934-.649A2.787 2.787 0 0 0 23.053.09Zm-15.2 23.172H3.986V10.304h3.865l.002 12.958ZM5.902 8.608a2.24 2.24 0 0 1-1.284-.395 2.372 2.372 0 0 1-.855-1.07 2.475 2.475 0 0 1-.137-1.382 2.42 2.42 0 0 1 .627-1.228 2.277 2.277 0 0 1 1.178-.659c.447-.093.911-.047 1.333.134.421.18.781.487 1.035.881.253.394.388.857.388 1.33a2.46 2.46 0 0 1-.171.912c-.115.29-.283.552-.495.774a2.289 2.289 0 0 1-.742.519c-.278.12-.576.183-.877.184Zm16.43 14.654h-3.844V16.46c0-1.865-.684-2.908-2.105-2.908-1.548 0-2.354 1.09-2.354 2.908v6.802h-3.707V10.304h3.707v1.746a4.43 4.43 0 0 1 1.609-1.585 4.228 4.228 0 0 1 2.152-.557c2.649 0 4.542 1.679 4.542 5.15v8.204Z' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h26v27H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.rs__icon--fb{
  background-image: url("data:image/svg+xml,%3Csvg width='26' height='27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='a' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='0' y='0' width='26' height='27'%3E%3Cpath d='M0 0h26v27H0V0Z' fill='%23fff'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath d='M26 13.568c-.011 3.212-1.105 6.319-3.09 8.774-1.984 2.456-4.733 4.105-7.765 4.658l-.059-.048.124-.02v-9.565h2.86l.585-3.799H15.21v-2.646c0-1.085.39-1.9 1.95-1.9h1.69v-3.46a20.39 20.39 0 0 0-2.86-.27c-2.99 0-5.07 1.9-5.07 5.291v2.985H7.67v3.799h3.25v9.565h.013l-.078.068c-3.218-.568-6.115-2.376-8.117-5.066-2.002-2.69-2.963-6.067-2.694-9.462.27-3.395 1.751-6.56 4.15-8.87C6.594 1.292 9.736.007 13 0c3.445.01 6.745 1.443 9.181 3.985C24.617 6.528 25.99 9.973 26 13.568Z' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E");
}
.rs__icon--di{
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='27' fill='none' viewBox='0 0 71 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M60.1045 13.8978C55.5792 11.8214 50.7265 10.2916 45.6527 9.41542C45.5603 9.39851 45.468 9.44077 45.4204 9.52529C44.7963 10.6353 44.105 12.0834 43.6209 13.2216C38.1637 12.4046 32.7345 12.4046 27.3892 13.2216C26.905 12.0581 26.1886 10.6353 25.5617 9.52529C25.5141 9.44359 25.4218 9.40133 25.3294 9.41542C20.2584 10.2888 15.4057 11.8186 10.8776 13.8978C10.8384 13.9147 10.8048 13.9429 10.7825 13.9795C1.57795 27.7309 -0.943561 41.1443 0.293408 54.3914C0.299005 54.4562 0.335386 54.5182 0.385761 54.5576C6.45866 59.0174 12.3413 61.7249 18.1147 63.5195C18.2071 63.5477 18.305 63.5139 18.3638 63.4378C19.7295 61.5728 20.9469 59.6063 21.9907 57.5383C22.0523 57.4172 21.9935 57.2735 21.8676 57.2256C19.9366 56.4931 18.0979 55.6 16.3292 54.5858C16.1893 54.5041 16.1781 54.304 16.3068 54.2082C16.679 53.9293 17.0513 53.6391 17.4067 53.3461C17.471 53.2926 17.5606 53.2813 17.6362 53.3151C29.2558 58.6202 41.8354 58.6202 53.3179 53.3151C53.3935 53.2785 53.4831 53.2898 53.5502 53.3433C53.9057 53.6363 54.2779 53.9293 54.6529 54.2082C54.7816 54.304 54.7732 54.5041 54.6333 54.5858C52.8646 55.6197 51.0259 56.4931 49.0921 57.2228C48.9662 57.2707 48.9102 57.4172 48.9718 57.5383C50.038 59.6034 51.2554 61.5699 52.5959 63.435C52.6519 63.5139 52.7526 63.5477 52.845 63.5195C58.6464 61.7249 64.529 59.0174 70.6019 54.5576C70.6551 54.5182 70.6887 54.459 70.6943 54.3942C72.1747 39.0791 68.2147 25.7757 60.1968 13.9823C60.1772 13.9429 60.1437 13.9147 60.1045 13.8978ZM23.7259 46.3253C20.2276 46.3253 17.3451 43.1136 17.3451 39.1693C17.3451 35.225 20.1717 32.0133 23.7259 32.0133C27.308 32.0133 30.1626 35.2532 30.1066 39.1693C30.1066 43.1136 27.28 46.3253 23.7259 46.3253ZM47.3178 46.3253C43.8196 46.3253 40.9371 43.1136 40.9371 39.1693C40.9371 35.225 43.7636 32.0133 47.3178 32.0133C50.9 32.0133 53.7545 35.2532 53.6986 39.1693C53.6986 43.1136 50.9 46.3253 47.3178 46.3253Z'/%3E%3C/svg%3E");
}

.matter__footer{
  position: relative;
  pointer-events: none;
}







/* SOMMAIRE PRODUIT */

.hero--product{
  display: flex;
  align-items: flex-end;
}

.hero--product__dark{
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  width: fit-content;
}

.hero--product__dark-wrapper{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: calc(var(--padunit));
  width: calc(var(--grille1col) *5 - var(--padunit));
  height: 67%;
}

.hero--product__dark-wrapper--sticky{
  position: sticky;
  top: 0;
  margin-top: calc(var(--padunit) * 1.5);
  height: fit-content;
}

.hero--product__title-container{
  display: flex;
  flex-direction: column;
  gap: 1.75em;
}

.hero--product__h1{
  font-size: clamp(1.75rem, 1.1584rem + 2.5243vw, 4.1875rem);
  width: 90%;
  text-align: start;
}
.hero--product__h2{
  font-size: clamp(1rem, 0.6359rem + 1.5534vw, 2.5rem);
}

.hero--product__button{
  width: fit-content;
}

.hero--product__vid--container{
  width: 100%;
  position: relative;
  aspect-ratio: 16 / 9;
}

.hero--product__vid{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.button__sound{
  position: absolute;
  bottom: var(--padunit);
  right: var(--padunit);
}
.button__sound--img{
  width: 1.5em;
  aspect-ratio: 1/1;
  mix-blend-mode: difference;
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(79deg) brightness(110%) contrast(101%);
  transition: all 0.2s ease-in-out;
}

.button__sound:hover .button__sound--img{
  filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(324deg) brightness(96%) contrast(104%);
}

@media (max-width: 1176px) {
  .hero--product__h1{
    width: 100%;
  }
}

@media (max-width: 950px) {
  .hero--product{
    flex-direction: column;
  }

  .hero--product__dark{
    width: 100%;
    height: 60%;
  }
  .hero--product__dark-wrapper{
    height: 75%;
    width: 100%;
  }

  .hero--product__h1{
    width: 60%;
  }

  .hero--product__vid--container{
    height: 40%;
  }
  .button__sound:hover .button__sound--img{
    filter: brightness(0) saturate(100%) invert(100%) sepia(93%) saturate(0%) hue-rotate(354deg) brightness(108%) contrast(101%);
  }
  .button__sound.button__black--fill:hover::after{
    transform: translate(-50%, -50%) scale(0);
  }
}

@media (max-width: 640px) {
  .hero--product{
    height: fit-content;
  }
  .hero--product__dark{
    padding: var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-top: calc(var(--padunit-mobile) * 2);
  }
  .hero--product__dark-wrapper{
    gap: calc(var(--padunit-mobile) * .5);
  }
  .button__sound{
    bottom: calc(var(--padunit-mobile) / 2);
    right: calc(var(--padunit-mobile) / 2);
  }
}

@media (max-width: 550px) {
  .hero--product{
    flex-direction: column;
  }
  .hero--product__dark{
    width: 100%;
    height: 70%;
    padding-top: calc(var(--padunit-mobile) * 2.5);
  }
  .hero--product__dark-wrapper{
    height: 75%;
    width: 100%;
    gap: calc(var(--padunit-mobile) * 1.75);
  }
  .hero--product__h1{
    width: 85%;
  }
  .hero--product__vid--container{
    height: 30%;
  }
}

@media (max-width: 450px) {
  .hero--product__dark{
    width: 100%;
    height: 70%;
    padding-top: calc(var(--padunit-mobile) * 3);
  }
  .hero--product__dark-wrapper{
    height: 75%;
    width: 100%;
    gap: calc(var(--padunit-mobile) * 3);
  }
}








/* PRODUITS / NEWTON */

.product__content{
  display: flex;
  flex-direction: column;
}

@media (max-width: 550px) {
  .product__content{
    gap: 2.5em;
  }
}



.product__cta-container{
  display: flex;
  gap: 0.75em;
  align-items: center;
  /*
  opacity: 0;
  */
}

.product__try-free{
  display: flex;
  gap: 0.75em;
  align-items: center;
}

@media (max-width: 1380px) {
  .product__cta-container{
    align-items: flex-start;
    flex-direction: column-reverse;
    gap: 1.75em;
  }
}
@media (max-width: 550px) {
  .product__try-free{
    justify-content: space-between;
    width: 100%;
  }
}


.product__title-container{
  width: calc(var(--grille1col) *5);
  padding: 0;
}

.product__content-container {
  display: flex;
  align-items: flex-start;
  width: 100%;
}

.product__content-title{
  width: 59%;
}

.product-detail__container h1,.product-detail__container h2,.product-detail__container h3,.product-detail__container h4, .product-detail__container p, .product-detail__container ul, .product-detail__container p em, .product-detail__container img, .product-detail__container video{
  /*margin-bottom: calc(var(--padunit) * 1.5);*/
  margin-bottom: 1em;
}
.product-detail__container p video{
  margin-bottom: 0;
}
.product-detail__container p{
  width: calc(var(--grille1col) *5);
  /*
  opacity: 0;
  transform: translateY(50px);
  */
  font-size: clamp(1rem, 0.8786rem + 0.5178vw, 1.5rem);
}
.product-detail__container p:empty{
  display: none;
}
.product-detail__container strong{
  font-weight: var(--bold);
}
.product-detail__container p em{
  font-style: italic;
  margin-bottom: 0.25em;
  display: block;
  margin-bottom: calc(var(--padunit) * 1.5);
}
.product-detail__container p a{
  border-bottom: solid 2px rgba(0, 0, 0, 0);
  /*opacity: 0.5;*/
  transition: all 0.2s ease-in-out;
}
.product-detail__container p a:hover{
  border-bottom: solid 2px rgba(0, 0, 0, 1);
  opacity: 1;
}
.product-detail__container ul{
  list-style-type: disc;
  margin-left: 1em;
  font-size: clamp(1rem, 0.8786rem + 0.5178vw, 1.5rem);
}

.product-detail__container blockquote {

}

.product-detail__p-cta-container{
  display: flex;
  align-items: center;
  gap: 1em;
}

@media (max-width: 950px) {
  .product__content{
    padding: 0 var(--padunit-mobile);
  }
  .product__content-container{
    flex-direction: column;
    align-items: center;
    gap: 2em;
  }
  .product-detail__container h1,.product-detail__container h2,.product-detail__container h3,.product-detail__container h4, .product-detail__container p, .product-detail__container ul, .product-detail__container p em, .product-detail__container img, .product-detail__container video{
    margin-bottom: 2em;
  }
  .product__title-container{
    width: 100%;
  }

  .product-detail__container{
    width: 100%;

  }
  .product-detail__container p{
    width: 100%;
  }

  .product-detail__p{
    width: 100%;
  }

  .product-detail__p-cta-container{
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .product__content{
    padding: var(--padunit-mobile) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }

  .product__content-title{
    width: 85%;
  }
}








/* TUTORIAL */


.info__title{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1em;
}
@media (max-width: 1050px) {
  .info__title{
    padding: calc(var(--padunit-mobile) * 1.75) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-bottom: calc(var(--padunit-mobile) * 1);
    gap: 1.3em;
  }
}
@media (max-width: 640px) {
  .info__title{
    padding: calc(var(--padunit-mobile) * 3) calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-bottom: calc(var(--padunit-mobile) * 1.5);
    gap: 1.3em;
  }
}

.info__h2{
  width: 40%;
  text-align: center;
}
@media (max-width: 640px) {
  .info__h2{
    width: 100%;  
  }
}

.card-section{
  margin-bottom: calc(var(--padunit) * 4.5);
}
@media (max-width: 640px) {
  .card-section{
    padding: 0 calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    margin-bottom: calc(var(--padunit-mobile) * 1.25);
  }
}

.filt__container{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 1em;
  margin-bottom: 2.85em;
  transition: transform 0.2s ease-in-out;
}

#filt__container--desk{
  display: flex;
}
#filt__container--mobil{
  display: none;
}

@media (max-width: 1050px) {

  #filt__container--desk{
    display: none;
  }
  #filt__container--mobil{
    display: flex;
  }

  .filt__container{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(100%);
    background-color: var(--white);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0em;
    margin-bottom: 0;
    color: var(--black);
    box-sizing: border-box;
    z-index: 1000;
    max-height: 66%;
    flex-wrap: nowrap;
  }
}

.filt__container--show{
  transform: translateY(0%) !important;
}

.filt__bg{
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: var(--black);
  opacity: 0.5;
  width: 100%;
  height: 100%;
  z-index: 100;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease-in-out;
  display: none;
}
@media (max-width: 1050px) {
  .filt__bg{
    display: block;
  }
}

.filt__bg--show{
  opacity: 0.6;
  pointer-events: all;
}

.filt__label{
  white-space: nowrap;
  /*opacity: 0;*/
}

@media (max-width: 1050px) {
  .filt__label{
    padding:1em calc(var(--padunit) * var(--pdlr-colbase));
    text-transform: capitalize;
    font-weight: var(--bold);
    width: 100%;
    font-size: clamp(1.3125rem, 1.0694rem + 1.037vw, 1.75rem);
    opacity: 1;
  }
}
@media (max-width: 640px) {
  .filt__label{
    padding: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.filt__cross{
  position: absolute;
  width: 1.3125em;
  height: 1.3125em;
  top: 1.5em;
  right: calc(var(--padunit) * var(--pdlr-colbase));
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m3 3 14.85 14.85M3 18 17.85 3.15' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E");
  display: none;
}
@media (max-width: 1050px) {
  .filt__cross{
    display: block;
  }
}

.filt__list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  row-gap: 0.75em;
}
@media (max-width: 1050px) {
  .filt__list{
    align-items: flex-start;
    flex-direction: column;
    gap: 1.3125em;
    padding:1.3125em calc(var(--padunit) * var(--pdlr-colbase));
    width: 100%;
    border-top: 1px solid var(--grey--darker);
    border-bottom: 1px solid var(--grey--darker);
    overflow-y: scroll;
    flex-wrap: nowrap;
  }
}
@media (max-width: 640px) {
  .filt__list{
    padding: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.filt__item {
  padding: .25em;
}
@media (max-width: 1050px) {
  .filt__item {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 1.3125em;
  }
}

.filt__btn {
  font-size: 0.571em;
  text-decoration: none;
  padding: 1em;
  border: 2px solid var(--white);
  transition: background-color ease .3s;
  cursor: pointer;
  text-transform: uppercase;
  /*opacity: 0;*/
}
@media (max-width: 1050px) {
  .filt__btn{
    border: none;
    font-size: clamp(1rem, 0.8264rem + 0.7407vw, 1.3125rem);
    padding: 0em;
    opacity: 1;
  }
}

.filt__btn.current {
  color:var(--black);
}


.filt__btn:hover, .filt__btn.active {
  opacity: 0.5 !important;
}

.filt__item input{
  display: none;
}

.filt__item input:checked + .filt__btn{
  background-color: var(--white);
  color: var(--black);
}

.filt__checkbox{
  display: none;
}
@media (max-width: 1050px) {
  .filt__checkbox{
    display: inline-block;
    width: 1.67em;
    height: auto;
    aspect-ratio: 1/1;
    border: 2px solid var(--black);
    cursor: pointer;
    position: relative;
  }

  .filt__checkbox:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
    width: 0%;
    height: 0%;
    background-color: var(--black);
    transition: all 0.1s ease-in-out;
  }

  /* Ajout d'une icône ou d'un symbole pour indiquer que la case est cochée */
  .filt__item input:checked + span + .filt__checkbox:after {
    transform: translate(-50%, -50%) rotate(0deg);
    width: 75%;
    height: 75%;
  }
}

.filt__validation--container{
  display: none;
}
@media (max-width: 1050px) {
  .filt__validation--container{
    width: 100%;
    justify-content: center;
    display: flex;
    padding: 1em;
    box-sizing: border-box;
  }
}
@media (max-width: 440px) {
  .filt__validation--container{
    padding: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }
}

.filt__validation{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translate(0);
}

.filt__validation:disabled{
  opacity: 0.5;
  pointer-events: none;
}

.filtre__button{
  display: none;
}

@media (max-width: 1050px) {
  .filtre__button{
    display: block;
    margin: 0 auto;
    margin-bottom: 4.375em;
  }
}

.cards__container{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--grille-gap);
  width: 100%;
  margin-bottom: calc(var(--padunit) * 2);
  box-sizing: border-box;
}



@media (max-width: 1300px) {
  .cards__container{
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: calc(var(--padunit) * 3)
  }
}
@media (max-width: 1050px) {
  .cards__container{
    grid-template-columns: repeat(2, 1fr);
    gap: calc(var(--grille-gap) * 2);
    
  }
}
@media (max-width: 640px) {
  .cards__container{
    grid-template-columns: repeat(1, 1fr);
    gap: calc(var(--grille-gap) * 2);
    margin-bottom: calc(var(--padunit-mobile) * 1.25)
  }
}



.cards__container--soc{
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 1050px) {
  .cards__container--soc{
    grid-template-columns: repeat(2, 1fr);
    gap: calc(var(--grille-gap) * 2);
  }
}
@media (max-width: 640px) {
  .cards__container--soc{
    grid-template-columns: repeat(1, 1fr);
    gap: calc(var(--grille-gap) * 2);
    margin-bottom: calc(var(--padunit-mobile) * 1.25)
  }

  
}

.card__soc-img{
  aspect-ratio: 1/1;
  width: 100%;
}

.card__soc-content{
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  justify-content: space-between;
  height: 100%;
  padding: 0;
}

.card__soc-infos{
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}

.card__soc-title{
  opacity: 1 !important;
  transform: translate(0) !important;
  padding: 0 !important;
  font-size: clamp(1.75rem, 1.5983rem + 0.6472vw, 2.375rem);
}

.card__soc-credit{
  font-size: clamp(0.75rem, 0.6893rem + 0.2589vw, 1rem);
  margin-bottom: var(--padunit);
}

.card__soc-credit a{
  border-bottom: solid 2px rgba(0, 0, 0, 0);
  opacity: 0.5;
  transition: all 0.2s ease-in-out;
}
.card__soc-credit a:hover{
  border-bottom: solid 2px rgba(0, 0, 0, 1);
  opacity: 1;
}

.card__soc-dl{
  opacity: 1;
  transform: translate(0);
  width: fit-content;
  padding: 0.6em 1em;
  font-size: clamp(0.875rem, 0.784rem + 0.3883vw, 1.25rem);
}

@media (max-width: 640px) {
  .card__soc-credit{
    font-size: clamp(0.75rem, 0.6893rem + 0.2589vw, 1rem);
    margin-bottom: var(--padunit-mobile);
  }
}

.card__infos-page{
  width: 100%;
}

@media (max-width: 1300px) {
  .card__infos-page{
    min-width: unset !important;
  }
}

.infos__button{
  width: fit-content;
  display: block;
  margin: 0 auto;
}




/* BLOG */

.blog__header--title{
  margin-bottom: calc(var(--padunit) * 1.675);
}

@media (max-width: 640px) {
  .blog__header--title{
   padding:0 calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
  }

  .blog__cards-container{
    padding:calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    gap: var(--grille-gap);
  }

  .blog__card{
    flex-direction: row;
    border: none;
    padding: 0;
  }

  .card-blog__link--wrapper{
    width: 100%;
  }

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

  .blog-card__content--wrapper{
    justify-content: space-between;
    gap: 0;
    border-bottom: solid 1px var(--black);
  }

  .card-blog__cate{
    display: none;
  }

  .card-blog__title{
    font-size: clamp(0.9375rem, 0.4068rem + 2.2642vw, 1.3125rem);
  }

  .card-blog__desc{
    display: none;
  }

  .card-blog__link{
    display: block;
  }

  .blog__content{
    padding: 0;
  }
  
}






/* DETAIL BLOG */

.blog-detail__section{
  max-width: 66.5%;
  margin: 0 auto;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: calc(var(--padunit) * 1);
}

@media (max-width: 860px) {
  .blog-detail__section{
    max-width: unset;
    padding-left: calc(var(--padunit) * var(--pdlr-colbase));
    padding-right: calc(var(--padunit) * var(--pdlr-colbase));
    padding-bottom: calc(var(--padunit-mobile) * 0.75);
  }
}
@media (max-width: 640px) {
  .blog-detail__section{
    padding-left: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-bottom: calc(var(--padunit-mobile) * 1);
  }
}




.blog-detail__subtitle{
  width: 100%;
}


@media (max-width: 640px) {
  .blog-detail__content{
    padding-left: 0;
    padding-right: 0;
    padding-bottom: calc(var(--padunit) * 1.5);
  }
}


.blog-detail__title--content{
  margin-bottom: var(--padunit);
}

@media (max-width: 640px) {
  .blog-detail__title--content{
    margin-bottom: calc(var(--padunit-mobile)* 0.5);
  }
}

.blog-detail__button{
  width: fit-content;
}

@media (max-width: 640px) {
  .blog-detail__button {
    margin-bottom: calc(var(--padunit-mobile)* 0.5);
  }
}

.blog-detail__content h2,  .blog-detail__content h3, .blog-detail__content h4, .blog-detail__content h5, .blog-detail__content h6, .blog-detail__content ul, .blog-detail__content ol, .blog-detail__content .vc_btn3-container, .blog-detail__content p, .blog-detail__content ._1mf, .blog-detail__content pre, .blog-detail__content figcaption {
  /*opacity: 0;
  transform: translateY(10px);
  */
  padding:  calc(var(--padunit) * 0.25)  calc(var(--padunit)* 4.375);
  /*padding-top: calc(var(--padunit) * 0.5);*/
  padding-top: .75em;
  padding-bottom: 0.25em;
}
.blog-detail__content hr {
  margin:  1.5em calc(var(--padunit)* 4.375);
}
.blog-detail__content .accordion {
  padding:  calc(var(--padunit) * 0.25)  calc(var(--padunit)* 4.375);
  padding-top: calc(var(--padunit) * 0.5);
}
.accordion__contenu p {
  padding-left: 0;
  padding-right: 0;
}

@media (max-width: 640px) {
  .blog-detail__content h2,  .blog-detail__content h3, .blog-detail__content h4, .blog-detail__content h5, .blog-detail__content h6, .blog-detail__content ul, .blog-detail__content ol, .blog-detail__content .vc_btn3-container, .blog-detail__content p, .blog-detail__content ._1mf, .blog-detail__content pre, .blog-detail__content figcaption, .blog-detail__content .accordion {
    padding: .75em 0 .25em 0;
  }
  .blog-detail__content hr {
    margin:  1.5em 0;
  }
}

.blog-detail__content figcaption{
  opacity: 0.5;
  transform: translate(0);
  padding-top: 0;
  padding-bottom: 0;
  font-size: 0.75em;
}

.blog-detail__content pre {
  background-color: rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin:  var(--padunit)  calc(var(--padunit)* 4.375);
  /*padding: var(--padunit);*/
  padding: 0;
  border-radius: 4px;
  counter-reset: linenumber;
  /*
  opacity: 0;
  transform: translateY(10px);
  */
}
@media (max-width: 640px) {
  .blog-detail__content pre {
    margin: calc(var(--padunit-mobile) * 0.5)  0;
    padding: calc(var(--padunit-mobile) * 0.5);

  }
}
.blog-detail__content pre code {
  font-size: 0.75em;
  width: 100%;
  white-space: pre-wrap;
}

.blog-detail__content strong, .blog-detail__content b {
  font-weight: 700;
}

.token.atrule, .token.attr-value, .token.function{
  color: var(--rouge);
}

.token.boolean, .token.number{
  color: var(--bleue);
}

.token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string, .token.variable{
  color: var(--bleue);
}

.token.comment, .token.prolog, .token.doctype, .token.cdata{
  color: rgba(0, 0, 0, 0.3);
}

.token.punctuation{
  color: var(--violet);
}
.token.comment{
  width: 100%;
  display: block;
  word-break: break-all;
}
.blog-detail__content .media {
  margin-top:  calc(var(--padunit) * 1.5);

}
.blog-detail__content .media .bouton {
  margin:  calc(var(--padunit) * 0.25)  calc(var(--padunit)* 4.375);
  margin-top: calc(var(--padunit) * 0.5);
}

@media (max-width: 640px) {
  .blog-detail__content .media .bouton {
    margin:  calc(var(--padunit) * 0.25)  0;
    margin-top: calc(var(--padunit) * 0.5);
  }
}

.blog-detail__content .vc_btn3-container{
  opacity: 1;
  transform: translate(0);
}

.blog-detail__content ul{
  margin-left: 1em;
  list-style: disc;
}
.blog-detail__content ol{
  margin-left: 1em;
  list-style: decimal;
}
.blog-detail__content ul li{
  padding: 0 calc(var(--padunit)* 0.25);
}
.blog-detail__content ul li ul{
  padding: 0  calc(var(--padunit)* .5);
  opacity: 1;
  transform: translateY(0);
}


.blog-detail__content p, .blog-detail__content ul, .blog-detail__content ol {
  /*font-size: clamp(1rem, 0.89rem + 0.3521vw, 1.3125rem);*/
  font-size: .75em;
}
.blog-detail__content p a {
  transition: 0.2s ease-in-out;
  text-decoration: underline;
  /*border-bottom: solid 2px rgba(0, 0, 0, 0.5);
  opacity: 0.5;*/
}
.blog-detail__content p a.bouton{
  margin-top: 1.5em;
  text-decoration: none;
  /*border-bottom: solid 2px rgba(0, 0, 0, 1);*/
}
.blog-detail__content p a:hover{
  /*border-bottom: solid 2px var(--black);
  opacity: 1;
  */
  text-decoration: none;
}

.blog-detail__content .instagram-media{
  width: 100% !important;
  /*height: auto !important;*/
  /*aspect-ratio: 540/747;*/
  display: block;
  margin: var(--padunit)  auto !important;
  padding:  calc(var(--padunit) * 0.5) 0;
}

.blog-detail__content iframe not(.instagram-media) {
width: 100% !important;
height: auto !important;
aspect-ratio: 902/507;
padding:  calc(var(--padunit) * 0.5) 0;
/*
opacity: 0;
transform: translateY(10px);
*/
margin: var(--padunit) 0;
}

.blog-detail__content .tiktok-embed iframe {
  aspect-ratio: inherit;
  height: 758px !important;
  padding:  0;
  margin: 0;
}

.blog-detail__content--img{
  padding:calc(var(--padunit) * 1) 0 !important;
}

.blog-detail__content p img{
  /*opacity: 0;
  transform: translateY(10px);*/
  width: 100%;
  height: auto !important;
  margin: 0 auto;
  display: block;
}

.blog-detail__content figure{
  margin: var(--padunit) auto;
  width: 100% !important;
}


.blog-detail__content figure img{
  margin: var(--padunit) auto;
}

@media (max-width: 640px) {
  .blog-detail__content p img{
    padding-left: 0;
    padding-right: 0;

  }
}

.blog-detail__last-section{
  margin-bottom: calc(var(--padunit) * 10);
}

.blog-detail__content--smallimg{
  margin: 0 auto;
  display: block;
  width: 40% !important;
  height: auto !important;
}
.wp-block-image .wp-image-7555{
  width: 100% !important;
  height: auto !important;
}


.blog-detail__content .wpb_video_wrapper iframe {
  margin-top: 3em;
  max-inline-size: 100%;
  block-size: auto;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 902 / 507;
}




/* CONTACT */

.contact__section{
  align-items: flex-start;

}

.contact__dark{
  padding-right: calc(var(--padunit) * 3.25);
  box-sizing: border-box;
  padding-top: calc(var(--padunit)* 4);
  justify-content: flex-start;
}

.contact__title-container{
  gap: calc(var(--padunit) * 0.5);
  /* position: sticky;
  top: var(--padunit);
  margin-top: var(--padunit); */
}

.contact__title{
  font-size: clamp(1.75rem, 0.3544rem + 5.9547vw, 7.5rem);
}

.contact__title-container p {
  font-size: clamp(1rem, 0.818rem + 0.7767vw, 1.75rem);
  /*opacity: 0;*/
}

.contact__container{
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: calc(var(--padunit) * 1.675);
  padding:0 calc(var(--padunit) * 3.75);
  padding-right: calc(var(--padunit) * 5);
  padding-top: calc(var(--padunit) * 4);
  padding-bottom: calc(var(--padunit) * 4);
  width: 100%;
}



@media (max-width: 1300px) {
  .contact__container{
    padding-left: calc(var(--padunit)*2);
    padding-right: calc(var(--padunit)*3);
  }
}
@media (max-width: 950px) {
  .contact__container{
    justify-content: flex-start;
    padding-top: calc(var(--padunit) * 2);
    height: 100%;
    align-items: center;
  }

  .contact__dark{
    padding-bottom: calc(var(--padunit-mobile) * 0.75);
    padding-top: calc(var(--padunit-mobile) * 1.5);
    padding-left: calc(var(--padunit)* 2);
    padding-right: calc(var(--padunit)* 2);
    box-sizing: border-box;
    display: block;
    height: fit-content !important;
  }
  
  .contact__title-container{
    gap: calc(var(--padunit-mobile) * 0.25);
    width: 75%;
  }

  .contact__section{
    height: fit-content !important;
  }
}

@media (max-width: 750px) {
  .contact__container{
    padding-left: calc(var(--padunit)*2);
    padding-right: calc(var(--padunit)*2);
  }
}
@media (max-width: 640px) {
  .contact__container{
    padding-top: calc(var(--padunit-mobile) * 1.25);
    padding-left: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2 * var(--pdlr-colbase));
    align-items: center;
    gap: calc(var(--padunit-mobile) * 1.25);
  }

  .contact__dark{
    padding-bottom: calc(var(--padunit-mobile) * 1.5);
    padding-top: calc(var(--padunit-mobile) * 3.25);
    padding-left: calc(var(--padunit-mobile) / 2* var(--pdlr-colbase));
    padding-right: calc(var(--padunit-mobile) / 2* var(--pdlr-colbase));
    box-sizing: border-box;
    display: block;
  }

  .contact__title-container{
    gap: calc(var(--padunit-mobile) * 0.5);
    width: 100%;
  }
}





.formtit {
  --max: 30;
  --min: 22;
  font-size: var(--responsive);
  font-weight: 700;
  line-height: 1.33;
}
.qu {
  margin-top: 0em;
}

.qu__intitule {
  font-weight: 400;
  display: block;
  font-size: clamp(1.875rem, 1.2682rem + 2.589vw, 4.375rem);
  line-height: 114%;
  padding-bottom: .5em;
  font-family: var(--font1);
}

.form__coord{
  padding-top: calc(var(--padunit) * 0);
}

.qu__radioin {
position: absolute;
left: -999em;
visibility: hidden;
height: 0;
width: 0;
transform: scale(0);
}
.qu__radiolab {
position: relative;
display: inline-block;
font-size: .8em;
font-weight: 400;
cursor: pointer;
color: #0D181C;
padding: .5em .75em;
-webkit-user-select: none;
   -moz-user-select: none;
    -ms-user-select: none;
        user-select: none;
  margin-right: .5em;
  margin-bottom: 1em;
  border: 1px solid #777777;
}
.qu__radiolab:hover {
  
}
.qu__radioin:checked + label:after {
  transform: scale(1);
}
.qu__radioin:checked + label {
  color: #fff;
  background-color: #044563;
}
.qu__radiolab:hover:not(:checked) + label {
  color: #fff;
  border-color: #fff;
}

.qu__select {
  margin: 0;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  
  width: 100%;
  border: 2px solid #AAAAAA;
  font-size: 1em;
  padding: .75em 1.25em;
  /*margin-top: 1em;*/
}
.form__lab  {
  font-size: 0.7em;
  line-height: 1.3;
  display: block;
  margin-bottom: .25em;
  transform-origin: center left;
}
.form__lab--block {
  /* display: block; */
  display: flex;
  gap: 0.67em;
  font-size: 0.6em;
  margin-bottom: 1.5em;
}

@media (max-width: 950px) {
  .form__lab {
    font-size: 0.8em;
  }
}
@media (max-width: 640px) {
  .form__lab {
    font-size: 1em;
  }
}

.requis:before {
  content: " *";
}
.form__chp {
  font-family: var(--font);
  -moz-appearance: none;
  -webkit-appearance: none;
  font-size: 1em;
  font-weight: 400;
  border: none;
  border-bottom: solid 1px var(--black);
  width: 100%;
  margin-top: 0;
  margin-bottom: 0.5em;
  padding: 0.34em 0;
  color: var(--black);
  outline: none;
  transition: border ease .3s;
}

.form__chp--black{
  background-color: var(--black) !important;
  color: var(--white);
  border-bottom: solid 1px var(--white);
}
/* .form__chp {
  font-family: var(--font1);
  -moz-appearance: none;
  -webkit-appearance: none;
  font-size: 16px;
  font-weight: 400;
  border: 2px solid #f4f4f4; 
  border: none;
  border-bottom: 2px solid #707070;
  border-top-right-radius: var(--border-radius-val);
  border-top-left-radius: var(--border-radius-val);
  background-color: #f4f4f4; 
  width: 100%;
  margin-top: 0;
  margin-bottom: 1em;
  padding: .5em 0;
  color:#0D181C;
  outline: none;
  transition: border ease .3s;
} */
@media (min-width: 950px) {
  .form__chp {
      font-size: 1em;
  }
}
.form__chp:focus {
  /* background-color: #f4f4f4; */
  color: var(--black);
}
.form__chp--black:focus {
  /* background-color: #f4f4f4; */
  color: var(--whtie);
}
.inputlab  {
  margin-top: 0.75em;
  position: relative;
}
.inputlab input {
  position: relative;
  /* padding-left: 0;
  padding-right: 0; */
}
.inputlab .form__lab  {
  position: absolute;
  top: 0.6em;
  left: 0;
  transition: transform 200ms ease-in-out;
  transform: translateY(0) scale(1);
  pointer-events: none;
}

@media (max-width: 640px) {
  .inputlab .form__lab  {
    top: 0.2em;
  }
}

.inputlab input.form__chp--full + label, .inputlab input:focus + label {
  transform: translateY(-1.6em) scale(0.9);
  opacity: 0.5;
  /* font-size: .65em; */
  font-weight: 400;
  color: var(--black)
}

.inputlab textarea.form__chp--full + label, .inputlab textarea:focus + label {
  transform: translateY(-1.6em) scale(0.9);
  opacity: 0.5;
  /* font-size: .65em; */
  font-weight: 400;
  color: var(--black)
}
.inputlab--black input.form__chp--full + label, .inputlab--black input:focus + label {
  transform: translateY(-1.6em) scale(0.9);
  /* font-size: .65em; */
  font-weight: 400;
  color: var(--white) !important;
  opacity: 0.5;
}

.inputlab--black textarea.form__chp--full + label, .inputlab--black textarea:focus + label {
  transform: translateY(-1.6em) scale(0.9);
  /* font-size: .65em; */
  font-weight: 400;
  color: var(--white) !important;
  opacity: 0.5;
}
.inputlab input:focus {

}
.form__chp--area {
  height: 4em;
  border-radius: 0;
  margin-bottom: 0;
  text-transform:initial;
}
.formselect__cont {
  position: relative;
}
.formselect__cont::before {
  content: "▼";
  color: #30055E;
  position: absolute;
  z-index: 10;
  top: calc(50% - 0.2em);
  right: 1em;
}
.formselect__cont--2::before {
  top: calc(50% - .55em);
}
.error .form__lab::before {
  content: "⌦ ";
  color: var(--main-color-error);
}
.error .form__chp {
  border-bottom-color: var(--main-color-error);
}
.error.quradio::before {
  content: "⌦ Choisissez";
  color: var(--main-color-error);
  display: block;
  padding-bottom: .5em;
}
@media (min-width: 950px) {
  .inputlab .form__lab{
    top: 0.6em;
  }
  .inputlab input.form__chp--full + label, .inputlab input:focus + label {
    transform: translateY(-1.6em) scale(0.9);
  }
  .inputlab textarea.form__chp--full + label, .inputlab textarea:focus + label {
    transform: translateY(-1.6em) scale(0.9);
  }

  .form__2col {
      display: flex;
      display: -ms-flexbox;
      flex-wrap: wrap;
  }
  .form__2col__item  {
      width: 100%;
  }
}


.form__info {
  position:relative;
  max-width: 20em;
  font-size: .85em;
  line-height: 1.2;
  font-weight: 400;
  text-align: center;
  color: #fff;
  background: var(--orange);
  border-radius: 1.5em;
  padding: 1em;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2em;
  margin-bottom: 2em;
  animation: .3s shake;
  animation-delay: 1s
}
.form__info::after {
  position: absolute;
  content:'';
  display:block;
  background: var(--orange);
  height: 1em;
  width: 1em;
  transform: rotate(45deg);
  bottom: -.4em;
  left:50%;
}
.form_alert {
  display: none;
}
.form_alert.go {
  font-weight: 700;
  display: inline-block;
  padding: .5em;
  color: #fff;
  background-color: var(--main-color-error);
}
.shakeit {
  animation: .3s shake;
}
@keyframes shake {
from, to {
  transform: translate3d(0, 0, 0);
}
10%, 50%, 90% {
  transform: translate3d(-.5em, 0, 0);
}
20%, 60% {
  transform: translate3d(.5em, 0, 0);
}
}
.form__chpfichier__cont {
  position: relative;
}
.form__chpfichier {
  opacity: 0;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 0;
}
.form__labfichier {
  position: relative;
  z-index: 2;
  font-size: .8em;
  line-height: 1.1;
  margin-bottom: .5em;
  display: inline-block;
  padding: .75em 2em;
  padding-left: 3.5em;
  position: relative;
  border: 1px solid #0D181C;
  color: #0D181C;
  background-color: #fff;
  text-align: left;
  cursor: pointer;
  border-radius: 0;
}
.form__labfichier:hover {
  background-color: #044563;
  color: #fff;
  border-color: #fff;
}
.form__labfichier svg {
  position: absolute;
  left: 1em;
  top: .85em;
  text-decoration: underline;
  width: 1.4em;
  height: 1em;
}
.form__labfichier svg path {
  fill: #044563;
}
.form__labfichier:hover svg path {
  fill: #fff;
}
.form__chpfichier__restric {
  font-size: .72em;
  color: #777777;
}
.form__group {
  margin-top: .25em;
}
.form__group--captcha {
  margin-top: 1.5em;
}
.g-recaptcha{
  max-width: 305px;
  margin: 0 auto;
}
.accept__cont.error:before {
  content: "⌦ merci de cocher la case";
  color: var(--main-color-error);
  font-weight: 700;
  font-size: .87em;
}
.form__boutoncont {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.form__mention__cont {
  margin-top: 0.75em;
}
.form__mention {
  color: #777777;
  font-size: .6em;
}
.form__mention a {
  color: #777777;
  border-bottom: 1px solid #777777;
}
.boutonsub__cont {
  text-align: center;
}
.form__checkbox{
  width: 1.5em;
  height: 1.5em;
  aspect-ratio: 1 / 1;
  border: solid 1px black;
  border-radius: 0px !important;
}

.form__cta-container {
  padding-top: calc(var(--padunit) * 1);
}

.bouton--form{
  transition: all 0.2s ease-in-out;
}
.bouton--form:hover{
  background-color: var(--black);
  color: var(--white);
  transition: all 0.2s ease-in-out;
}
.eapps-instagram-feed-posts-item-image{
  object-fit: cover;
}



.legal-notices p{
  margin-bottom: 1em;
}

#eapps-instagram-feed-1{
  pointer-events: all;
}





@media (max-width: 950px) {
  .portrait__container{
    padding-left: calc(var(--padunit)*2);
    padding-right: calc(var(--padunit)*2);  
  }
}
.portrait__tit{
  width: calc(var(--grille1col) *10.6);
}
@media (max-width: 950px) {
  .portrait__tit{
    width: 100%;
  }
  .portrait__tit h2{
    width: 75%;
  }
}
@media (max-width: 640px) {
  .portrait__tit{
    width: 100%;
  }
  .portrait__tit h2{
    width: 100%;
  }
}
.portrait__wrapper{
  width: fit-content;
  display: flex;
  gap: calc(var(--padunit) * 4);
}
@media (max-width: 640px) {
  .portrait__wrapper{
    flex-direction: column;
  }
}
.portrait{
  width: 100%;
}
.portrait p, .portrait img {
  /*
  transform: translateY(50px);
  opacity: 0;
  */
}
.portrait p{
  font-size: clamp(1rem, 0.9242rem + 0.3236vw, 1.3125rem);
  margin-bottom: calc(var(--padunit));
}
.portrait p:first-child{
  margin-bottom: calc(var(--padunit)*0.5);
}
.portrait p strong{
  font-weight: var(--semibold);
}
.portrait img {
  aspect-ratio: 2/3;
  object-fit: cover;
  margin-bottom: calc(var(--padunit)*0.5);
}
@media (max-width: 640px) {
  .portrait p{
    margin-bottom: calc(var(--padunit) * 1.5);
  }
  .portrait p:first-child{
    margin-bottom: calc(var(--padunit));
  }
  .portrait img {
    margin-bottom: calc(var(--padunit));
  }
}
@media (max-width: 450px) {
  .portrait p{
    margin-bottom: calc(var(--padunit-mobile) * 0.5);
  }
  .portrait p:first-child{
    margin-bottom: calc(var(--padunit-mobile) * 0.25);
  }
  .portrait img {
    margin-bottom: calc(var(--padunit-mobile) * 0.25);
  }
}