/*$element-top-margin: $gutter-width/3 !default;
$element-bottom-margin: ($gutter-width*2)/3 !default;
*/
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap");
:root {
  --ff: "Montserrat", sans-serif;
  --fz_s: .8em;
  --fz_n: 1em;
  --fz_m: 1.5em;
  --fz_l: 1.9em;
  --fz_xl: 2.5em;
  --fz_xxl:3.5em;
  --wp--style--global--content-size: 800px; }

:root {
  --color_vert: #637452; }

.c_color_vert {
  color: var(--color_vert) !important; }

.bg_color_vert {
  background-color: var(--color_vert) !important; }

:root {
  --color_gris: #707070; }

.c_color_gris {
  color: var(--color_gris) !important; }

.bg_color_gris {
  background-color: var(--color_gris) !important; }

:root {
  --color_noir: #111; }

.c_color_noir {
  color: var(--color_noir) !important; }

.bg_color_noir {
  background-color: var(--color_noir) !important; }

body,
html {
  margin: 0;
  padding: 0;
  height: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--ff);
  font-size: 16px;
  color: #000; }
  @media only screen and (max-width: 992px) {
    body {
      font-size: 12px;
      overflow-x: hidden; } }

h1,
h2,
h3,
h4,
h5 {
  line-height: 1.1em;
  margin: 0 0 1.5rem 0;
  padding: 0;
  font-weight: 900;
  hyphens: auto; }

p,
li {
  font-size: clamp(1rem, 1.2vw, 1.3em);
  line-height: 1.4em;
  font-weight: 500;
  margin-bottom: 0.4em; }

li {
  margin: 0 0 .4rem 0; }

p {
  padding: 0; }

p + h3 {
  margin-top: 1.5em; }

h1 {
  font-size: clamp(3em, 4vw, 4em); }

h2 {
  font-size: clamp(2.8rem, 2.5vw, 2.8em); }

h3 {
  font-size: clamp(2.3rem, 2vw, 2.5em); }

h4 {
  font-size: clamp(1.8rem, 1.5vw, 2em); }

h5 {
  font-size: 1.3rem; }

ul {
  padding: 0; }

* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto; }

.wp-block-image.aligncenter {
  margin-left: auto;
  margin-right: auto; }

.montserrat {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-style: normal; }

#btn_burger {
  position: relative;
  display: block;
  width: 3rem;
  height: 2.5rem; }
  #btn_burger .bar {
    position: absolute;
    left: 0;
    width: 100%;
    transform: rotate(0deg);
    transform-origin: center;
    opacity: 1;
    transition: 0.5s cubic-bezier(0.57, -0.3, 0.51, 1.31) all; }
  #btn_burger #bar-1 {
    top: 0; }
  #btn_burger #bar-2 {
    top: 50%;
    transform: translatey(-50%); }
  #btn_burger #bar-3 {
    bottom: 0; }

body.menu-open #menu {
  transform: translateX(0); }
  body.menu-open #menu #menu-deco-1 {
    animation: dance_menu_deco_1 6s ease-in-out infinite alternate; }
  body.menu-open #menu #menu-deco-2 {
    animation: dance 6s ease-in-out infinite alternate; }

body.menu-open #btn_burger #bar-1 {
  transform: translatey(50%) rotate(55deg) scale(120%); }

body.menu-open #btn_burger #bar-2 {
  transform: translatey(-50%) rotate(-35deg) scale(120%); }

body.menu-open #btn_burger #bar-3 {
  opacity: 0; }

#menu {
  position: fixed;
  z-index: 888;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--color_vert);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .7s ease all;
  transform: translatex(-101%); }
  #menu ul {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    margin: auto;
    gap: 5vh; }
    #menu ul li {
      list-style: none;
      margin: 0;
      padding: 0;
      text-align: center; }
      #menu ul li a {
        text-decoration: none;
        color: #fff;
        font-size: var(--fz_m); }
  #menu .menu-deco {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: -1; }
    #menu .menu-deco img {
      position: absolute;
      opacity: .3;
      max-width: 70%;
      width: 60%; }
  #menu #menu-deco-1 {
    position: absolute;
    transform-origin: bottom center;
    bottom: -4rem;
    right: -10%; }
  #menu #menu-deco-2 {
    position: absolute;
    transform-origin: bottom center;
    bottom: -4rem;
    left: -10%; }

@keyframes dance_menu_deco_1 {
  0% {
    transform: skewx(-5deg) scalex(-100%); }
  100% {
    transform: skewx(0deg) scalex(-100%); } }

#site-header {
  display: flex;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  padding: 3vw;
  justify-content: space-between;
  transition: .3s ease all;
  filter: invert(0); }
  @media only screen and (max-width: 992px) {
    #site-header {
      background-color: #fff; } }
  @media only screen and (max-width: 992px) {
    #site-header.white {
      background-color: var(--color_vert); } }
  #site-header.white img {
    filter: invert(1); }

#brand a img {
  width: 200px;
  height: auto; }

#site-title {
  position: absolute;
  height: 0;
  left: -9999px;
  overflow: hidden; }

.zindexup {
  position: relative;
  z-index: 4; }

.pointpoint:after {
  content: '';
  background-image: url(../img/trame-3.gif);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1; }

#intro .video_phone {
  display: none; }
  @media only screen and (max-width: 992px) {
    #intro .video_phone {
      display: block; } }

#intro .video_desktop {
  display: block; }
  @media only screen and (max-width: 992px) {
    #intro .video_desktop {
      display: none; } }

#intro figure {
  position: relative;
  height: 100vh;
  width: 100%;
  margin: 0; }
  #intro figure video {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center; }

#cible_intro_rugissons {
  position: relative; }

#content_intro_rugissons {
  position: fixed;
  top: 50%;
  margin: 0;
  padding: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; }
  #content_intro_rugissons.absolute {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -40%) !important; }
    @media only screen and (min-width: 768px) {
      #content_intro_rugissons.absolute {
        transform: translate(-50%, -25%) !important; } }

#intro_rugissons {
  z-index: 7;
  width: 100%;
  display: block;
  font-weight: 900;
  font-size: clamp(3.5rem, 8vw, 8rem) !important;
  line-height: .8em; }

h3.actu_title {
  font-weight: 300;
  margin: .5em 0; }

#intro .article_diapo {
  height: 100vh;
  background: #000;
  color: #fff; }
  @media only screen and (min-width: 768px) {
    #intro .article_diapo {
      height: clamp(500px, 80vh, 900px); } }
  #intro .article_diapo .splide__list {
    height: 100vh; }
    @media only screen and (min-width: 768px) {
      #intro .article_diapo .splide__list {
        font-size: 1em;
        height: clamp(500px, 80vh, 900px); } }
  #intro .article_diapo .slide_container {
    height: 100vh; }
    @media only screen and (min-width: 768px) {
      #intro .article_diapo .slide_container {
        height: clamp(500px, 80vh, 900px); } }
  #intro .article_diapo .slide_content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2rem;
    max-width: var(--wp--style--global--wide-size);
    padding: 0 4rem;
    margin: 0 auto; }
    @media only screen and (max-width: 992px) {
      #intro .article_diapo .slide_content {
        flex-direction: column;
        justify-content: center;
        gap: 1rem; } }
  #intro .article_diapo .format-text {
    text-align: center;
    max-width: calc(var(--wp--style--global--content-size));
    margin: 0 auto; }
  #intro .article_diapo .format-img_full {
    position: relative; }
    #intro .article_diapo .format-img_full .actu_col {
      position: relative;
      z-index: 2;
      width: 50%; }
      @media only screen and (max-width: 992px) {
        #intro .article_diapo .format-img_full .actu_col {
          width: 100%; } }
    #intro .article_diapo .format-img_full figure {
      position: absolute;
      z-index: 0;
      top: 0;
      left: 0;
      height: 100% !important;
      width: 100% !important; }
      #intro .article_diapo .format-img_full figure img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100% !important;
        width: 100% !important;
        object-fit: cover;
        object-position: center; }
      #intro .article_diapo .format-img_full figure:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        height: 100% !important;
        width: 100% !important;
        background: #ccc;
        z-index: 1;
        background: black;
        background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, black 100%);
        background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, black 100%);
        background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, black 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=1); }
        @media only screen and (max-width: 992px) {
          #intro .article_diapo .format-img_full figure:after {
            background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, black 100%);
            background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, black 100%);
            background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, black 100%); } }
  #intro .article_diapo .format-img .actu_col {
    display: block;
    width: 50%; }
    @media only screen and (max-width: 992px) {
      #intro .article_diapo .format-img .actu_col {
        width: 100%; } }
    #intro .article_diapo .format-img .actu_col figure {
      position: relative; }
      @media only screen and (max-width: 992px) {
        #intro .article_diapo .format-img .actu_col figure {
          max-height: 30vh; } }
      #intro .article_diapo .format-img .actu_col figure img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100% !important;
        width: 100% !important;
        object-fit: contain;
        object-position: center center; }
        @media only screen and (max-width: 992px) {
          #intro .article_diapo .format-img .actu_col figure img {
            object-position: bottom center; } }

.splide__arrows {
  position: relative;
  width: 100%;
  margin: 0 auto;
  top: 50%;
  display: block;
  max-width: calc(var(--wp--style--global--wide-size) + 2rem); }

.splide__arrow {
  border: 2px solid #fff;
  height: 2rem;
  width: 2rem; }
  .splide__arrow svg {
    fill: #fff; }

#rideau {
  position: relative;
  width: 100vw;
  overflow: hidden; }

#rideau_text {
  position: absolute;
  display: block;
  margin: 0 auto;
  z-index: 88;
  top: 50vh;
  transform: translateY(-50%);
  left: 0%;
  width: 100vw;
  text-align: center;
  line-height: 1em; }

#rideau_video {
  height: 100vh;
  position: relative; }
  #rideau_video video {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    filter: blur(1px) brightness(0.9) contrast(1.1); }

#rideau_r {
  position: absolute;
  top: -20px;
  /* left: -100vw; */
  height: 100%;
  display: flex;
  right: 0;
  transform: translatex(-150%) scale(1.1);
  z-index: 2; }
  #rideau_r:after {
    content: '';
    position: absolute;
    left: 100%;
    display: block;
    width: 100vw;
    height: 100vh;
    margin-left: -3px;
    background: var(--color_vert); }

#rideau_l {
  position: absolute;
  top: -30px;
  /* left: -100vw; */
  height: 100%;
  left: 0;
  display: flex;
  transform: translatex(150%) scale(-100%);
  z-index: 2; }
  #rideau_l:after {
    content: '';
    position: absolute;
    left: 100%;
    display: block;
    width: 100vw;
    height: 100vh;
    margin-left: -3px;
    background: var(--color_vert); }

#liste_metier {
  display: flex;
  flex-wrap: wrap;
  column-gap: .3em;
  justify-content: center;
  padding: 1em; }
  #liste_metier li {
    margin: 0;
    padding: 0;
    line-height: 1.2em;
    list-style: none;
    font-size: clamp(1.5rem, 4vw, 2.6rem);
    font-weight: 700;
    transition: .5s ease all; }
    #liste_metier li:nth-child(2n) {
      opacity: .4;
      color: var(--color_noir); }
  #liste_metier.switch li:nth-child(2n) {
    opacity: 1;
    color: #fff; }
  #liste_metier.switch li:nth-child(2n-1) {
    opacity: .4;
    color: var(--color_noir); }

.metier {
  transition: .5s ease all;
  color: #000 !important;
  opacity: .4; }
  .metier.active {
    color: #fff !important;
    opacity: 1; }

#tribu .pin-spacer {
  max-width: 100% !important;
  z-index: 0; }

.grrr {
  font-weight: 900;
  line-height: 1.1em;
  font-size: clamp(3rem, 8vw, 7rem) !important;
  letter-spacing: -.25vw; }

.char {
  display: inline-block;
  will-change: transform, font-weight; }

.img_hover_vert {
  transition: .3s ease all; }
  .img_hover_vert:hover {
    filter: invert(0.3) sepia(1) saturate(1) hue-rotate(49deg); }

@keyframes dance {
  0% {
    transform: skewx(0deg); }
  100% {
    transform: skewx(-5deg); } }

@keyframes dance_phone {
  0% {
    transform: scalex(150%) skewx(0deg); }
  100% {
    transform: scalex(150%) skewx(-5deg); } }

.bg_dance img {
  transform-origin: bottom center;
  animation: dance 6s ease-in-out infinite alternate; }
  @media only screen and (max-width: 992px) {
    .bg_dance img {
      animation: dance_phone 9s ease-in-out infinite alternate; } }

#cover-screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  transition: 1s ease all; }
  #cover-screen img {
    transition: 0.5s cubic-bezier(0.34, 0, 1, 0.57) all; }
  #cover-screen.off {
    opacity: 0; }
    #cover-screen.off img {
      transform: scale(600%); }
  #cover-screen.out {
    display: none; }

.fz_s {
  font-size: var(--fz_s) !important; }

.fz_n {
  font-size: var(--fz_n) !important; }

.fz_m {
  font-size: var(--fz_m) !important; }

.fz_l {
  font-size: var(--fz_l) !important; }

.fz_xl {
  font-size: var(--fz_xl) !important; }

.fz_xxl {
  font-size: var(--fz_xxl) !important; }

p, li {
  font-size: var(--fz_n); }

h2 {
  font-size: var(--fz_xl); }

h3 {
  font-size: var(--fz_l); }

h4 {
  font-size: var(--fz_m); }

html #wpadminbar {
  display: none !important; }

.btn.btn_cadre {
  color: #fff;
  padding: .58em 1.2em;
  display: block;
  width: fit-content;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid #fff;
  margin-top: 1.5em;
  font-size: .8rem;
  position: relative; }
  .btn.btn_cadre:before {
    content: '';
    display: block;
    background: #fff;
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    mix-blend-mode: difference;
    transition: .3s ease all; }
  .btn.btn_cadre:hover:before {
    width: 100%; }

.wp-block-gallery.has-nested-images figure.wp-block-image {
  flex-grow: 0; }
