/*
@unocss;
*/

@font-face {
  font-family: "metis";
  font-style: normal;
  font-weight: normal;
  src: url("i/font/MetisRegular.woff2") format("woff2");
  font-display: swap;
}

html {
  font-size: 62.5%;
}
html,
body {margin:0;padding:0;
}
*,
*:before,
*:after {
  box-sizing: border-box;
  /* min-width: 0; */
}

* {
  margin: 0;
  padding: 0;
  font: inherit;
}

@media all {
  html {
    font-size: calc(1000vw / 1920);
  }
}

@media all and (min-aspect-ratio: 1920/1080) and (orientation: landscape) {
  html {
    font-size: calc(1000vh / 1080);
  }
}

@media all and (max-width: 767px) and (orientation: portrait) {
  /*767px*/
  html {
    font-size: calc(1000vw / 767); /*767*/
  }
}

@media all and (max-width: 767px) and (max-aspect-ratio: 767/1662) and (orientation: portrait) {
  html {
    font-size: calc(1000vw / 767);
  }
}

@media all and (max-width: 767px) and (min-aspect-ratio: 767/1662) and (orientation: portrait) {
  html {
    font-size: calc(1000vh / 1850); /*1662*/
  }
}

/* @media all and (max-width: 767px) and (orientation: portrait) {
  html.is_ios {
    font-size: calc(1000vw / 900);
  }
} */

/* responsive images/videos */
img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
}

/* Improved heading in supported browsers */
h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
}

/* improve readability with max-width on paragraphs and lists */
/* prevent orphans in supported browsers */
p {
  max-width: var(--p-max-width, 65ch);
  text-wrap: pretty;
}

.decoration-clone,
mark {
  -webkit-box-decoration-break: clone;
}

[x-cloak] {
  display: none !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}
.mobile-only {display:none;
}
@media (max-width: 767.9px){.mobile-only{display:block;}}
.desktop-only {display:block;
}
@media (max-width: 767.9px){.desktop-only{display:none;}}

sup {
  font-size: 65%;
}

.wrap {position:relative;margin-left:auto;margin-right:auto;max-width:164rem;
}

@media (max-width: 767.9px){.wrap{max-width:65.4rem;}}

.cta {pointer-events:auto;height:6.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:1.5rem;--un-bg-opacity:1;background-color:rgb(236 64 38 / var(--un-bg-opacity));padding-left:3.6rem;padding-right:3.6rem;font-size:2.4rem;--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));font-weight:500;text-decoration:none;
}

@media (max-width: 767.9px){.cta{font-size:3rem;}}

section {position:relative;
}

.sectionHeight {height:calc(100svh - 14.3rem);
}

@media (max-width: 767.9px){.sectionHeight{height:calc(100svh - 7rem);}}
.enterStart {
  /* @apply translate-y-100vh; */
  transform: translateY(var(--enterStart));
  /* translate: 0 100vh; */
}
.leaveEnd {
  /* -translate-y-100vh */
  transform: translateY(var(--leaveEnd));
}
.listeReponses {display:grid;gap:1.4rem;--un-text-opacity:1;color:rgb(12 187 170 / var(--un-text-opacity));font-weight:500;line-height:1.2;font-size:max(2rem,19px);
}
@media (max-width: 767.9px){.listeReponses{font-size:3.5rem !important;}}
.listeReponses .r {position:relative;height:7.7rem;display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:pointer;align-items:center;justify-content:center;border-width:1px;--un-border-opacity:1;border-color:rgb(12 187 170 / var(--un-border-opacity));border-radius:2rem;border-style:solid;text-align:center;width:max(45.5rem,455px);
}
.listeReponses .r div {font-size:max(1.6rem,14px);
  }
@media (max-width: 767.9px){.listeReponses .r div{font-size:2.4rem !important;}}
.listeReponses .r:hover,
  .listeReponses .r.active {--un-bg-opacity:1;background-color:rgb(12 187 170 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));
  }
.listeReponses .r:hover svg path, .listeReponses .r.active svg path {--un-fill-opacity:1;fill:rgb(255 255 255 / var(--un-fill-opacity));
    }
.listeReponses .r:hover {--un-bg-opacity:0.7;
  }
@media (max-width: 767.9px){.listeReponses .r:hover{background-color:transparent;--un-bg-opacity:1;--un-text-opacity:1;color:rgb(12 187 170 / var(--un-text-opacity));}}
.listeReponses .r.active {--un-bg-opacity:1;
  }
@media (max-width: 767.9px){.listeReponses .r.active{--un-bg-opacity:1;background-color:rgb(12 187 170 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));}}
@media (max-width: 1199.9px){.listeReponses .r{width:max(45.5rem,380px);}}
@media (max-width: 991.9px){.listeReponses .r{width:100%;font-size:3rem;}}
@media (max-width: 767.9px){.listeReponses .r{width:100%;min-height:15rem;height:auto;padding-left:4rem;padding-right:4rem;padding-top:1.5rem;padding-bottom:1.5rem;font-size:max(2rem,19px);}}

@media (max-width: 767.9px) {
    .listeReponses2 .r2:hover {background-color:transparent;--un-text-opacity:1;color:rgb(12 187 170 / var(--un-text-opacity));
    }
    .listeReponses2 .r2.active {--un-bg-opacity:1;background-color:rgb(12 187 170 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));
    }
      .listeReponses2 .r2.active svg path,
      .listeReponses2 .r2.active svg ellipse,
      .listeReponses2 .r2.active svg circle {--un-fill-opacity:1;fill:rgb(255 255 255 / var(--un-fill-opacity));
      }
    .listeReponses2 .r2.active {--un-bg-opacity:1;
    }@media (max-width: 767.9px){.listeReponses2 .r2.active{--un-bg-opacity:1;background-color:rgb(12 187 170 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));}}
}

.input {margin-top:1rem;width:100%;height:5.2rem;border-width:0px;border-bottom-width:1px;--un-border-opacity:1;--un-border-bottom-opacity:var(--un-border-opacity);border-bottom-color:rgb(12 187 170 / var(--un-border-bottom-opacity));border-bottom-style:solid;background-color:transparent;padding-top:0.5rem;padding-bottom:2px;font-size:2rem;--un-text-opacity:1;color:rgb(12 187 170 / var(--un-text-opacity));outline-width:0px;font-size:max(2rem,20px);
}

.input:focus {border-bottom-width:3px;--un-border-opacity:1;--un-border-bottom-opacity:var(--un-border-opacity);border-bottom-color:rgb(12 187 170 / var(--un-border-bottom-opacity));border-bottom-style:solid;padding-bottom:0;
  }

.input:focus::placeholder{opacity:1;}

.input::placeholder{--un-text-opacity:1;color:rgb(12 187 170 / var(--un-text-opacity));opacity:0.7;}

@media (max-width: 767.9px){.input{height:10rem;}}
@media (max-width: 767.9px) {
  .input {font-size:3.9rem !important;
  }
}

i {
  font-style: italic;
}
b {
  font-weight: bold;
}

.grid-don {
  grid-template-areas:
    "gd_1"
    "gd_2"
    "gd_3"
    "gd_4"
    /*"gd_5"*/;

  grid-template-columns: auto;
  /* grid-template-rows: auto auto auto auto; */
  grid-auto-rows: min-content;
  grid-auto-columns: min-content;
}

.donActive {--un-bg-opacity:1;background-color:rgb(236 64 38 / var(--un-bg-opacity));
}

.donActive .donBt {--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));--un-text-opacity:1;color:rgb(236 64 38 / var(--un-text-opacity));
  }

.donActive .fond {
    /* @apply bg-rouge h100; */
    /* @apply h100; */height:14rem;--un-bg-opacity:1;background-color:rgb(236 64 38 / var(--un-bg-opacity));opacity:1;
  }

@media (max-width: 767.9px){.donActive .fond{height:20rem;}}

.donActive .fill-color {--un-fill-opacity:1;fill:rgb(236 64 38 / var(--un-fill-opacity));
  }

.donActive .stroke-color {--un-stroke-opacity:1;stroke:rgb(236 64 38 / var(--un-stroke-opacity));
  }

.marquee {
  --gap: 4rem;
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: var(--gap);
}
@media (max-width: 767.9px) {
  .marquee {
    --gap: 4rem;
  }
}

.marquee__content {
  flex-shrink: 0;
  display: flex;
  justify-content: space-around;
  gap: var(--gap);
  min-width: 100%;
  animation: scroll 350s linear infinite;align-items:center;
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - var(--gap)));
  }
}

.cta-shadow-hover {
  transition:
    box-shadow 600ms cubic-bezier(0.33, 0.11, 0.02, 0.99),
    transform 600ms cubic-bezier(0.33, 0.11, 0.02, 0.99);
}

.cta-shadow-hover:hover {
    box-shadow:
      0 4px 4px rgba(0, 0, 0, 0.1),
      0 1px 6px rgba(0, 0, 0, 0.05),
      0 8px 8px rgba(0, 0, 0, 0.1),
      0 16px 16px rgba(0, 0, 0, 0.1),
      8px 32px 32px rgba(0, 0, 0, 0.15),
      8px 64px 64px rgba(0, 0, 0, 0.15);

    transform: scale(1.05) translateY(-0.5rem);
  }

.cta-shadow-hover:active {
    box-shadow:
      0 4px 4px rgba(0, 0, 0, 0.1),
      0 1px 6px rgba(0, 0, 0, 0.05),
      0 8px 8px rgba(0, 0, 0, 0.1),
      0 16px 16px rgba(0, 0, 0, 0.1),
      8px 16px 16px rgba(0, 0, 0, 0.15),
      8px 32px 32px rgba(0, 0, 0, 0.15);
  }

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-1.5rem);
  }
  60% {
    transform: translateY(-0.5rem);
  }
}
.bounce {
  animation: bounce 2s infinite;
}

#tarteaucitronRoot {font-size:15px;font-family:'Lato', Arial, Helvetica, sans-serif;
}

select {
  /* -webkit-appearance: auto; */
  /* appearance: auto; */
  /* background-color: rgba(255, 255, 255, 1); */
}

@media (max-width: 767.9px) {
  html,
  body {
    overscroll-behavior: none;
  }
}

a.effect-1,
a > span {
  position: relative;
  color: inherit;
  text-decoration: none;
  line-height: 24px;
}

a.effect-1:before,
a.effect-1:after,
a > span:before,
a > span:after {
  content: "";
  position: absolute;
  transition: transform 0.5s ease;
}

.effect-1 {
  padding-top: 0px;
}
.effect-1:before {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: white;
  transform: scaleX(0);
}
.effect-1:hover:before {
  transform: scaleX(1);
}

/* .reveal {
  clip-path: inset(100% 0 0 0);
  animation: reveal 1.2s ease-in-out infinite alternate;
}
@keyframes reveal {
  to {
    clip-path: inset(0 0 0 0); 
  }
} */

.arrow_header {
  animation: arrow_header 0.5s 0s alternate infinite;
}
@keyframes arrow_header {
  0% {
    transform: rotate(0deg) scale(1);
  }
  100% {
    transform: rotate(10deg) scale(1.25);
  }
}
