@charset "UTF-8";
html {
  font-size: 10px;
  font-family: "Open Sans", sans-serif;
  color: #15182e;
}

body {
  max-width: 100vw;
  height: auto;
  background-color: #15182e;
  line-height: 1.5;
}

.container {
  max-width: 83%;
  height: auto;
  margin: 0px auto;
}

.container-article {
  max-width: 75%;
  height: auto;
  margin: 0px auto;
}
@media (max-width: 768px) {
  .container-article {
    max-width: 70%;
  }
}

/* POLICE TITRES */
/* mukta-mahee-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Mukta Mahee";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/mukta-mahee-v18-latin-regular.woff2") format("woff2"), url("../fonts/mukta-mahee-v18-latin-regular.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* mukta-mahee-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Mukta Mahee";
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/mukta-mahee-v18-latin-600.woff2") format("woff2"), url("../fonts/mukta-mahee-v18-latin-600.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* mukta-mahee-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Mukta Mahee";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/mukta-mahee-v18-latin-800.woff2") format("woff2"), url("../fonts/mukta-mahee-v18-latin-800.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* POLICE LABEUR */
/* open-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/open-sans-v43-latin-300.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-300.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/open-sans-v43-latin-300italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-300italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/open-sans-v43-latin-regular.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-regular.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/open-sans-v43-latin-italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/open-sans-v43-latin-500.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-500.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/open-sans-v43-latin-500italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-500italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/open-sans-v43-latin-600.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-600.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 600;
  src: url("../fonts/open-sans-v43-latin-600italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-600italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/open-sans-v43-latin-700.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-700.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/open-sans-v43-latin-700italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-700italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/open-sans-v43-latin-800.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-800.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 800;
  src: url("../fonts/open-sans-v43-latin-800italic.woff2") format("woff2"), url("../fonts/open-sans-v43-latin-800italic.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
h1 {
  font-family: "Mukta Mahee";
  font-size: 5rem;
  font-style: normal;
  font-weight: 800;
  color: transparent;
  -webkit-text-stroke: 1.3px #81D9FF;
  text-transform: uppercase;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h1 {
    font-size: 4rem;
  }
}

.h1-hero {
  font-family: "Open Sans";
  font-size: 2rem;
  font-style: normal;
  font-weight: 800;
  color: #FFFEF3;
  -webkit-text-stroke: 0 transparent;
  text-transform: uppercase;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}

h2 {
  padding-top: 3rem;
  font-family: "Mukta Mahee";
  font-size: 4rem;
  font-style: normal;
  font-weight: 400;
  color: #81D9FF;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h2 {
    font-size: 3.5rem;
  }
}

.h2 {
  display: flex;
  align-items: stretch;
  gap: 10px;
  padding-top: 1rem;
}
.h2 .line {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.h2 .dot {
  width: 1rem;
  height: 1rem;
  background-color: #81D9FF;
  border-radius: 50%;
}
.h2 .bar {
  flex-grow: 1;
  width: 2px;
  background-color: #81D9FF;
}
.h2 h2 {
  padding-top: 0;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}

.h2-hero {
  font-family: "Mukta Mahee";
  font-size: 4rem;
  font-style: normal;
  font-weight: 800;
  color: transparent;
  -webkit-text-stroke: 1.3px #81D9FF;
  text-transform: uppercase;
  line-height: 1;
  padding-top: 1rem;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}

h3 {
  padding-top: 1rem;
  font-family: "Mukta Mahee";
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 400;
  color: #81D9FF;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h3 {
    font-size: 3rem;
  }
}

h4 {
  font-family: "Mukta Mahee";
  font-size: 3rem;
  font-style: normal;
  font-weight: 400;
  color: #81D9FF;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h4 {
    font-size: 2.5rem;
  }
}

h5 {
  font-family: "Mukta Mahee";
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 400;
  color: #81D9FF;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h5 {
    font-size: 2rem;
  }
}

h6 {
  font-family: "Mukta Mahee";
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  color: #81D9FF;
  line-height: 1;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  h6 {
    font-size: 1.8rem;
  }
}

p {
  padding-bottom: 2rem;
  padding-top: 1rem;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  font-size: 2rem;
  color: #FFFEF3;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  p {
    font-size: 1.6rem;
  }
}

p strong {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-size: 2rem;
  color: #FFFEF3;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  p strong {
    font-size: 1.6rem;
  }
}

ul, ol {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  font-size: 2rem;
  color: #FFFEF3;
  list-style: circle;
  list-style-type: disc;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  ul, ol {
    font-size: 1.6rem;
  }
}

hr {
  width: 100%;
  border: 1px dashed #81D9FF;
}

table {
  margin-bottom: 2rem;
  margin-top: 2rem;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  font-size: 2rem;
  color: #FFFEF3;
}
@media (max-width: 768px) {
  table {
    font-size: 1.6rem;
  }
}

a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: underline 1px #FFFEF3;
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: none;
}
@media (max-width: 768px) {
  a {
    font-size: 1.6rem;
  }
}

.bouton-primaire, .wp-block-button__link {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  display: inline-block;
  text-align: left;
  color: #15182e;
  background-color: #81D9FF;
  border: none;
  border-radius: 10rem;
  padding: 1.5rem 3rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
  margin-right: 1rem;
  transition: box-shadow 0.3s ease;
}
@media (max-width: 768px) {
  .bouton-primaire, .wp-block-button__link {
    font-size: 1.6rem;
  }
}
.bouton-primaire:after, .wp-block-button__link:after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  margin-bottom: -0.3rem;
  margin-left: 1rem;
  background-image: url("../img/link.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .bouton-primaire:after, .wp-block-button__link:after {
    width: 1.3rem;
    height: 1.3rem;
    margin-bottom: -0.1rem;
  }
}
.bouton-primaire:hover, .bouton-primaire:focus, .wp-block-button__link:hover, .wp-block-button__link:focus {
  background-color: #FFFEF3;
  box-shadow: inset -7px 7px 14px #b5b4ad, inset 7px -7px 14px #ffffff;
}

.bouton-secondaire {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  display: inline-block;
  text-align: left;
  color: #FFFEF3;
  background-color: #15182e;
  border: none;
  border-radius: 10rem;
  padding: 1.5rem 3rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
  margin-right: 1rem;
  transition: box-shadow 0.3s ease-in-out;
}
@media (max-width: 768px) {
  .bouton-secondaire {
    font-size: 1.6rem;
  }
}
.bouton-secondaire:after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  margin-bottom: -0.3rem;
  margin-left: 1rem;
  background-image: url("../img/link-blanc.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .bouton-secondaire:after {
    width: 1.3rem;
    height: 1.3rem;
    margin-bottom: -0.1rem;
  }
}
.bouton-secondaire:hover, .bouton-secondaire:focus {
  background-color: #81D9FF;
  box-shadow: inset -10px 10px 20px #78caed, inset 10px -10px 20px hsl(198, 94%, 75%);
  color: #15182e;
}
.bouton-secondaire:hover:after, .bouton-secondaire:focus:after {
  background-image: url("../img/link.svg");
}

.bouton-tertiaire {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  display: inline-block;
  text-align: left;
  color: #FFFEF3;
  transition: 0.3s ease-in-out;
}
@media (max-width: 768px) {
  .bouton-tertiaire {
    font-size: 1.6rem;
  }
}
.bouton-tertiaire:after {
  content: "→";
  display: inline-block;
  font-size: 2rem;
  margin-bottom: -0.5rem;
  margin-left: 1rem;
}
.bouton-tertiaire:hover, .bouton-tertiaire:focus {
  color: #81D9FF;
}
.bouton-tertiaire:hover:after, .bouton-tertiaire:focus:after {
  margin-left: 2rem;
}

::-webkit-scrollbar {
  width: 1.5rem;
  height: 0.2rem;
}

::-webkit-scrollbar-button {
  width: 0rem;
  height: 0rem;
}

::-webkit-scrollbar-thumb {
  background: #81D9FF;
  border: 0rem none #15182e;
  border-radius: 5rem;
}

::-webkit-scrollbar-thumb:hover {
  background: #FFFEF3;
}

::-webkit-scrollbar-thumb:active {
  background: #15182e;
}

::-webkit-scrollbar-track {
  background: #FFFEF3;
  border: 0rem none #FFFEF3;
  border-radius: 5rem;
}

::-webkit-scrollbar-track:hover {
  background: #81D9FF;
}

::-webkit-scrollbar-track:active {
  background: #81D9FF;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

.menu-evitement {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-height: 0;
  overflow: hidden;
  z-index: 100;
}
.menu-evitement:focus-within {
  max-height: 10rem;
}
.menu-evitement .evitement {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background-color: #81D9FF;
  border-radius: 10rem;
  color: #15182e;
  text-align: center;
  text-decoration: none;
  font-weight: 300;
  padding: 1rem 3rem;
  margin: 2rem;
  transition: 0.3s ease-in-out;
}
.menu-evitement .evitement:hover, .menu-evitement .evitement:focus {
  background-color: #FFFEF3;
}
@media (max-width: 992px) {
  .menu-evitement .evitement {
    display: none;
  }
}

.topheader {
  margin-right: 0rem;
  margin-top: -2rem;
}
.topheader ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
@media (max-width: 768px) {
  .topheader ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 0.5rem;
    width: 100%;
    position: fixed;
    bottom: 0rem;
    z-index: 1000;
    padding: 0;
    margin: 0;
  }
}
.topheader ul .topheadertel {
  list-style: inside;
  list-style-type: none;
  background-color: #81D9FF;
  border-radius: 0 0 0 3rem;
  padding: 2rem 4rem;
  margin-right: 0.5rem;
  transition: 0.3s ease-in-out;
}
@media (max-width: 768px) {
  .topheader ul .topheadertel {
    border-radius: 0;
    width: 100%;
    padding: 2rem 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.topheader ul .topheadertel:hover:after, .topheader ul .topheadertel:focus:after {
  background-image: url("../img/tel-hover.svg");
}
.topheader ul .topheadertel:after {
  content: "";
  display: inline-block;
  width: 3rem;
  height: 3rem;
  margin-bottom: -0.7rem;
  margin-left: 1rem;
  background-image: url("../img/tel.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .topheader ul .topheadertel:after {
    width: 3rem;
    height: 3rem;
    margin-bottom: -0.1rem;
    margin-left: 0.5rem;
  }
}
.topheader ul .topheadertel a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #15182e;
  text-decoration: none;
}
@media (max-width: 768px) {
  .topheader ul .topheadertel a {
    border-radius: 0;
    font-size: 1.8rem;
  }
}
.topheader ul .topheadermail {
  list-style: inside;
  list-style-type: none;
  background-color: #81D9FF;
  padding: 2rem 4rem;
  transition: 0.3s ease-in-out;
}
@media (max-width: 768px) {
  .topheader ul .topheadermail {
    width: 100%;
    padding: 2rem 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.topheader ul .topheadermail:hover:after, .topheader ul .topheadermail:focus:after {
  background-image: url("../img/mail-hover.svg");
}
.topheader ul .topheadermail:after {
  content: "";
  display: inline-block;
  width: 3rem;
  height: 3rem;
  margin-bottom: -0.7rem;
  margin-left: 1rem;
  background-image: url("../img/mail.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .topheader ul .topheadermail:after {
    width: 3rem;
    height: 3rem;
    margin-bottom: -0.1rem;
    margin-left: 0.5rem;
  }
}
.topheader ul .topheadermail a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #15182e;
  text-decoration: none;
}
@media (max-width: 768px) {
  .topheader ul .topheadermail a {
    border-radius: 0;
    font-size: 1.8rem;
  }
}

.main-header {
  position: relative;
  padding-bottom: 6rem;
}
@media (max-width: 992px) {
  .main-header {
    padding-top: 6rem;
  }
}
.main-header .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main-header .logo {
  width: 17rem;
  height: auto;
}
.main-header .toggle-menu {
  display: none;
}
@media (max-width: 992px) {
  .main-header .toggle-menu {
    margin-right: 2rem;
    width: 3rem;
    height: 3rem;
    display: grid;
    gap: 0.3rem;
    padding: 0;
    border: 0;
    background-color: transparent;
  }
  .main-header .toggle-menu[aria-expanded=true] .menu-bar:first-child {
    transform: rotate(45deg);
    margin-left: -0.2rem;
    margin-top: -0.3rem;
  }
  .main-header .toggle-menu[aria-expanded=true] .menu-bar:last-child {
    transform: rotate(-45deg);
    margin-left: -0.2rem;
    margin-top: 0.8rem;
  }
  .main-header .toggle-menu[aria-expanded=true] .menu-bar:not(:first-child):not(:last-child) {
    opacity: 0;
  }
  .main-header .toggle-menu .menu-bar {
    display: block;
    width: 4rem;
    height: 0.3rem;
    border-radius: 20px;
    background-color: #FFFEF3;
    transition: 0.3s ease-in-out;
  }
  .main-header .toggle-menu .menu-bar:first-child {
    transform-origin: top left;
  }
  .main-header .toggle-menu .menu-bar:last-child {
    transform-origin: bottom left;
  }
}
.main-header #main-menu {
  display: flex;
  max-width: 100%;
  max-height: auto;
  background-color: transparent;
  list-style-type: none;
}
@media (max-width: 992px) {
  .main-header #main-menu {
    position: absolute;
    right: 100%;
    top: 70%;
    display: block;
    width: 100vw;
    height: auto;
    background: #15182e;
    padding: 2rem;
    padding-bottom: 10rem;
    transform: translateX(0);
    transition: transform 0.3s;
    z-index: 900;
  }
  .main-header #main-menu:not([hidden]) {
    transform: translateX(100%);
  }
}
.main-header #main-menu .menu-item {
  padding: 1rem;
  list-style-type: none;
}
.main-header #main-menu .menu-item:hover .sub-menu {
  display: block;
}
.main-header #main-menu .menu-item a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.main-header #main-menu .menu-item a:hover, .main-header #main-menu .menu-item a:focus {
  color: #81D9FF;
}
.main-header #main-menu .menu-item a:after {
  content: "";
  display: block;
  margin: auto;
  margin-top: 5px;
  height: 2px;
  width: 0;
  border-bottom: 1px dashed #81D9FF;
  transition: width 0.3s ease-in-out, border-bottom 0.3s ease;
}
.main-header #main-menu .menu-item a:hover:after, .main-header #main-menu .menu-item a:focus:after {
  width: 100%;
}
@media (max-width: 992px) {
  .main-header #main-menu .menu-item a:hover:after, .main-header #main-menu .menu-item a:focus:after {
    margin-left: 0;
    width: 60%;
  }
}
.main-header #main-menu .current-menu-item a, .main-header #main-menu .current-page_item a {
  font-weight: 600;
  color: #81D9FF;
}
.main-header #main-menu .current-menu-item a:after, .main-header #main-menu .current-page_item a:after {
  content: "";
  display: block;
  margin: auto;
  margin-top: 5px;
  height: 0.2rem;
  width: 100%;
  border-bottom: 1px dashed #81D9FF;
}
@media (max-width: 992px) {
  .main-header #main-menu .current-menu-item a:after, .main-header #main-menu .current-page_item a:after {
    margin-left: 0;
    width: 60%;
  }
}
.main-header #main-menu .sub-menu {
  display: none;
  position: absolute;
  margin: auto;
  left: 0;
  z-index: 800;
  width: 100%;
  height: auto;
  padding: 5% 10%;
  margin-top: 1rem;
  color: #FFFEF3;
  background-color: #15182e;
}
@media (max-width: 992px) {
  .main-header #main-menu .sub-menu {
    position: static;
    display: block;
  }
}
.main-header #main-menu .sub-menu .menu-item {
  padding: 1rem;
}
.main-header #main-menu .sub-menu .menu-item a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.main-header #main-menu .sub-menu .menu-item a:hover, .main-header #main-menu .sub-menu .menu-item a:focus {
  color: #81D9FF;
}
.main-header #main-menu .sub-menu .menu-item a:hover:before, .main-header #main-menu .sub-menu .menu-item a:focus:before {
  font-size: 2rem;
}
.main-header #main-menu .sub-menu .menu-item a:before {
  content: "→";
  margin-right: 1rem;
  color: #81D9FF;
  font-size: 0rem;
}
.main-header #main-menu .sub-menu .menu-item a:after {
  content: "";
  display: block;
  margin-left: 0;
  margin-top: 2rem;
  height: 2px;
  width: 50%;
  border-bottom: 1px dashed #81D9FF;
}
@media (max-width: 992px) {
  .main-header #main-menu .sub-menu .menu-item a:after {
    width: 100%;
  }
}
.main-header #main-menu .sub-menu .current-menu-item a, .main-header #main-menu .sub-menu .current-page_item a {
  font-weight: 600;
  color: #81D9FF;
}
.main-header #main-menu .sub-menu .current-menu-item a:before, .main-header #main-menu .sub-menu .current-page_item a:before {
  content: "→";
  margin-right: 1rem;
  color: #81D9FF;
  font-size: 2rem;
}
.main-header #main-menu .search {
  width: 50px;
  height: 50px;
  background-image: url("../img/search-blanc.svg");
  background-repeat: no-repeat;
  background-size: 90%;
  background-position: center;
  transition: 0.3s ease-in-out;
}
.main-header #main-menu .search:hover, .main-header #main-menu .search:focus {
  background-image: url("../img/search-hover.svg");
  transform: scale(1.2);
}

.footer {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 8rem;
}
@media (max-width: 992px) {
  .footer {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
.footer .logo-footer {
  width: 12rem;
  height: auto;
}
@media (max-width: 992px) {
  .footer .logo-footer {
    width: 12rem;
    margin-bottom: 5rem;
  }
}
.footer .footer-menu {
  list-style-type: none;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
}
@media (max-width: 992px) {
  .footer .footer-menu {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
  }
}
.footer .footer-menu .menu-item {
  list-style-type: none;
}
.footer .footer-menu .menu-item:hover .sub-menu {
  display: block;
}
.footer .footer-menu .menu-item a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 1.6rem;
  color: #FFFEF3;
  padding: 1.5rem;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
@media (max-width: 992px) {
  .footer .footer-menu .menu-item a {
    padding-left: 0;
  }
}
.footer .footer-menu .menu-item a:hover, .footer .footer-menu .menu-item a:focus {
  color: #81D9FF;
}
.footer .footer-menu .menu-item a:after {
  content: "";
  display: block;
  margin: auto;
  margin-top: 5px;
  height: 2px;
  width: 0;
  border-bottom: 1px dashed #81D9FF;
  transition: width 0.3s ease-in-out, border-bottom 0.3s ease;
}
.footer .footer-menu .menu-item a:hover:after, .footer .footer-menu .menu-item a:focus:after {
  width: 100%;
}
.footer .footer-menu .current-menu-item a, .footer .footer-menu .current-page_item a {
  font-weight: 600;
  color: #81D9FF;
}
.footer .footer-menu .current-menu-item a:after, .footer .footer-menu .current-page_item a:after {
  content: "";
  display: block;
  margin: auto;
  margin-top: 5px;
  height: 2px;
  width: 100%;
  border-bottom: 1px dashed #81D9FF;
}
@media (max-width: 992px) {
  .footer .footer-menu .current-menu-item a:after, .footer .footer-menu .current-page_item a:after {
    width: 100%;
  }
}
.footer .footer-menu .sub-menu {
  display: none;
  position: absolute;
  right: 0;
  bottom: 8rem;
  z-index: 800;
  width: 30%;
  height: auto;
  color: #FFFEF3;
  background-color: #15182e;
}
@media (max-width: 992px) {
  .footer .footer-menu .sub-menu {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .footer .footer-menu .sub-menu {
    bottom: 13rem;
  }
}
.footer .footer-menu .sub-menu .menu-item {
  padding: 1rem;
}
.footer .footer-menu .sub-menu .menu-item a {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.footer .footer-menu .sub-menu .menu-item a:hover, .footer .footer-menu .sub-menu .menu-item a:focus {
  color: #81D9FF;
}
.footer .footer-menu .sub-menu .menu-item a:hover:before, .footer .footer-menu .sub-menu .menu-item a:focus:before {
  font-size: 2rem;
}
.footer .footer-menu .sub-menu .menu-item a:before {
  content: "→";
  margin-right: 1rem;
  color: #81D9FF;
  font-size: 0rem;
}
.footer .footer-menu .sub-menu .menu-item a:after {
  content: "";
  display: block;
  margin-left: 0;
  margin-top: 2rem;
  height: 2px;
  width: 50%;
  border-bottom: 1px dashed #81D9FF;
}
@media (max-width: 992px) {
  .footer .footer-menu .sub-menu .menu-item a:after {
    width: 100%;
  }
}
.footer .footer-menu .sub-menu .current-menu-item a, .footer .footer-menu .sub-menu .current-page_item a {
  font-weight: 600;
  color: #81D9FF;
}
.footer .footer-menu .sub-menu .current-menu-item a:before, .footer .footer-menu .sub-menu .current-page_item a:before {
  content: "→";
  margin-right: 1rem;
  color: #81D9FF;
  font-size: 2rem;
}

.footer-p {
  text-align: center;
  padding-top: 6rem;
  padding-bottom: 15rem;
}

.btn {
  height: 5rem;
  width: 5rem;
  position: fixed;
  right: 2rem;
  bottom: 10rem;
  z-index: 1000;
  background-image: url("../img/back-to-top.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .btn {
    height: 30px;
    width: 30px;
  }
}
.btn:hover, .btn:focus {
  background-image: url("../img/back-to-top-hover.svg");
}

.hero {
  margin-top: -30rem;
  padding-top: 30rem;
  padding-bottom: 20rem;
  width: 100%;
  height: auto;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
.hero .hero-contenu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .hero .hero-contenu {
    display: flex;
    flex-direction: column;
  }
}
.hero .hero-contenu .hero-texte {
  width: 50%;
}
@media (max-width: 992px) {
  .hero .hero-contenu .hero-texte {
    width: 100%;
  }
}
.hero .hero-contenu .hero-img {
  width: 50%;
  padding: 2.5rem;
}
@media (max-width: 992px) {
  .hero .hero-contenu .hero-img {
    width: 100%;
  }
}

.encart {
  background-color: #15182e;
  width: 70%;
  height: auto;
  padding: 5rem;
  margin: -18rem auto 2rem;
  border-radius: 1.8rem;
}
@media (max-width: 768px) {
  .encart {
    width: 90%;
    padding: 2rem 1rem;
  }
}

.valeurs {
  padding-bottom: 8rem;
}
.valeurs .grid-cards-valeurs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 4rem;
  margin: 4rem auto;
}
@media (max-width: 992px) {
  .valeurs .grid-cards-valeurs {
    grid-template-columns: 1fr;
  }
}
.valeurs .grid-cards-valeurs .card-valeurs {
  padding: 4rem;
  border: 1px solid #FFFEF3;
  border-radius: 1.8rem;
}
.valeurs .grid-cards-valeurs .card-valeurs .titre-valeurs {
  text-align: center;
  padding-bottom: 2rem;
}
.valeurs .grid-cards-valeurs .card-valeurs .titre-valeurs:before {
  content: "";
  display: inline-block;
  width: 5rem;
  height: 5rem;
  margin-bottom: -1.3rem;
  margin-right: 1rem;
  background-image: url("../img/check-valeurs.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.solutions {
  padding-bottom: 8rem;
}
.solutions .grid-cards-solutions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem;
  margin-top: 2rem;
}
@media (max-width: 992px) {
  .solutions .grid-cards-solutions {
    grid-template-columns: 1fr;
  }
}
.solutions .grid-cards-solutions .card-solution {
  position: relative;
  width: 100%;
  height: 38rem;
  border-radius: 1.8rem;
  transition: 0.3s ease-in-out;
}
.solutions .grid-cards-solutions .card-solution:hover .contenu-card, .solutions .grid-cards-solutions .card-solution:focus .contenu-card {
  display: none;
}
.solutions .grid-cards-solutions .card-solution .thumb {
  border-radius: 1.8rem;
  width: auto;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: 0.3s ease-in-out;
  /* Layer noir -> transparent */
}
.solutions .grid-cards-solutions .card-solution .thumb:hover:after, .solutions .grid-cards-solutions .card-solution .thumb:focus:after {
  background: transparent;
}
.solutions .grid-cards-solutions .card-solution .thumb:after {
  content: "";
  position: absolute;
  inset: 0; /* top: 0; right: 0; bottom: 0; left: 0; */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  border-radius: 1.8rem;
  pointer-events: none; /* pour que les clics passent à travers */
}
.solutions .grid-cards-solutions .card-solution .contenu-card h3 {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  top: 22rem;
  left: 2rem;
  right: 3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  max-height: 2.4em;
}
.solutions .grid-cards-solutions .card-solution .contenu-card .bouton-tertiaire {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  bottom: 3rem;
  right: 3rem;
}
.solutions .bouton-tertiaire {
  margin-top: 3rem;
}

.offre-du-moment {
  width: 100%;
  height: auto;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
  padding: 4rem 0 4rem;
}
.offre-du-moment .contenu-offre {
  padding-top: 3rem;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
}
@media (max-width: 992px) {
  .offre-du-moment .contenu-offre {
    display: flex;
    flex-direction: column;
  }
}
.offre-du-moment .contenu-offre .img-offre {
  padding: 3rem;
}
.offre-du-moment .contenu-offre .texte-offre {
  padding: 4rem;
  width: 40%;
}
@media (max-width: 992px) {
  .offre-du-moment .contenu-offre .texte-offre {
    width: 100%;
  }
}
.offre-du-moment .contenu-offre .texte-offre .prix-offre p {
  font-weight: 700;
}

.actualites {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
.actualites .grid-cards-actus {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem;
  margin-top: 2rem;
}
@media (max-width: 992px) {
  .actualites .grid-cards-actus {
    grid-template-columns: 1fr;
  }
}
.actualites .grid-cards-actus .card-actu {
  position: relative;
  width: 100%;
  height: 54rem;
  border-radius: 1.8rem;
  transition: 0.3s ease-in-out;
}
.actualites .grid-cards-actus .card-actu:hover .contenu-card, .actualites .grid-cards-actus .card-actu:focus .contenu-card {
  display: none;
}
.actualites .grid-cards-actus .card-actu .thumb {
  border-radius: 1.8rem;
  width: auto;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: 0.3s ease-in-out;
  /* Layer noir -> transparent */
}
.actualites .grid-cards-actus .card-actu .thumb:hover:after, .actualites .grid-cards-actus .card-actu .thumb:focus:after {
  background: transparent;
}
.actualites .grid-cards-actus .card-actu .thumb:after {
  content: "";
  position: absolute;
  inset: 0; /* top: 0; right: 0; bottom: 0; left: 0; */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  border-radius: 1.8rem;
  pointer-events: none; /* pour que les clics passent à travers */
}
.actualites .grid-cards-actus .card-actu .contenu-card h3 {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  top: 25rem;
  left: 3rem;
  right: 3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  max-height: 6em;
}
.actualites .grid-cards-actus .card-actu .contenu-card .bouton-tertiaire {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  bottom: 3rem;
  right: 3rem;
}
.actualites .bouton-tertiaire {
  margin-top: 3rem;
}

.aides-etat {
  width: 100%;
  height: auto;
  background-color: #81D9FF;
  background-image: url("../img/pattern-noir.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center calc(100% + 5rem);
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media (max-width: 992px) {
  .aides-etat {
    background-size: cover;
  }
}
.aides-etat .contenu-aides {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .aides-etat .contenu-aides {
    display: flex;
    flex-direction: column;
  }
}
.aides-etat .contenu-aides .col1-aides {
  width: 45%;
}
@media (max-width: 992px) {
  .aides-etat .contenu-aides .col1-aides {
    width: 100%;
  }
}
.aides-etat .contenu-aides .col1-aides .h2 .line .dot, .aides-etat .contenu-aides .col1-aides .h2 .line .bar {
  background-color: #15182e;
}
.aides-etat .contenu-aides .col1-aides .h2 h2 {
  color: #15182e;
}
.aides-etat .contenu-aides .col1-aides p {
  color: #15182e;
  font-weight: 600;
  padding-bottom: 1rem;
}
.aides-etat .contenu-aides .col2-aides {
  width: 30%;
}
@media (max-width: 992px) {
  .aides-etat .contenu-aides .col2-aides {
    width: 100%;
  }
}
.aides-etat .contenu-aides .col2-aides p {
  font-size: 3rem;
  font-weight: 600;
  color: #15182e;
  padding: 0;
}
@media (max-width: 992px) {
  .aides-etat .contenu-aides .col3-aides {
    margin: auto;
    padding-top: 4rem;
  }
}

.avis-section {
  padding-top: 8rem;
}
.avis-section .avis-slider {
  margin-top: 4rem;
}
.avis-section .avis-slider .swiper-wrapper {
  display: flex;
  align-items: stretch;
}
.avis-section .avis-slider .swiper-slide {
  display: flex;
  height: auto;
}
.avis-section .avis-slider .avis-slide {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid #81D9FF;
  padding: 4rem;
  border-radius: 1.8rem;
  color: #FFFEF3;
  width: 100%;
}
.avis-section .avis-slider blockquote {
  margin: 0;
}
.avis-section .avis-slider footer {
  margin-top: -3rem;
  text-align: right;
  font-weight: bold;
  color: #81D9FF;
}
.avis-section .avis-slider .swiper-pagination {
  margin-top: 4rem;
  text-align: center;
  position: static;
}
.avis-section .avis-slider .swiper-pagination .swiper-pagination-bullet {
  width: 3rem;
  height: 3rem;
  border: 1rem solid #81D9FF;
  background: transparent;
}
.avis-section .avis-slider .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #81D9FF;
}

.certifications {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
.certifications .grid-cards-certifications {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 20rem;
}
@media (max-width: 992px) {
  .certifications .grid-cards-certifications {
    grid-gap: 4rem;
  }
}
@media (max-width: 768px) {
  .certifications .grid-cards-certifications {
    grid-template-columns: 1fr;
    grid-gap: 4rem;
  }
}
.certifications .grid-cards-certifications .vignette-certification {
  background-color: #FFFEF3;
  border-radius: 1.8rem;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
}
@media (max-width: 768px) {
  .certifications .grid-cards-certifications .vignette-certification {
    display: flex;
    flex-direction: column;
  }
}
.certifications .grid-cards-certifications .vignette-certification img {
  margin: auto;
  padding: 4rem;
}

.bandeau-presentation {
  margin-top: -30rem;
  padding-top: 30rem;
  padding-bottom: 30rem;
  width: 100%;
  height: auto;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
.bandeau-presentation .bandeau-contenu {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
}
.bandeau-presentation .bandeau-contenu .bandeau-texte {
  width: 80%;
  z-index: 100;
}
@media (max-width: 992px) {
  .bandeau-presentation .bandeau-contenu .bandeau-texte {
    width: 100%;
  }
}
.bandeau-presentation .bandeau-contenu .bandeau-img {
  position: absolute;
  right: 0;
  width: 40%;
}
@media (max-width: 992px) {
  .bandeau-presentation .bandeau-contenu .bandeau-img {
    width: 80%;
    bottom: -8rem;
  }
}

.portrait {
  padding-top: 8rem;
  padding-bottom: 8rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .portrait {
    display: flex;
    flex-direction: column;
  }
}
.portrait .img-portrait {
  width: 50%;
}
@media (max-width: 992px) {
  .portrait .img-portrait {
    width: 100%;
    margin-right: 0;
    padding-bottom: 3rem;
  }
}
.portrait .texte-portrait {
  width: 40%;
}
@media (max-width: 992px) {
  .portrait .texte-portrait {
    width: 100%;
    padding-top: 3rem;
  }
}
@media (max-width: 768px) {
  .portrait .texte-portrait {
    width: 85%;
  }
}
.portrait .texte-portrait .quote {
  font-size: 2rem;
  font-weight: 700;
}
.portrait .texte-portrait .quote:before {
  content: " 〝 ";
  display: block;
  font-size: 6rem;
  color: #81D9FF;
  margin-left: -3rem;
  margin-bottom: -2rem;
}
.portrait .texte-portrait .quote:after {
  content: " 〞 ";
  display: block;
  font-size: 6rem;
  color: #81D9FF;
  text-align: right;
  margin-right: -3rem;
}

.equipe {
  padding-top: 8rem;
  padding-bottom: 8rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .equipe {
    display: flex;
    flex-direction: column;
  }
}
.equipe .texte-equipe {
  width: 40%;
}
@media (max-width: 992px) {
  .equipe .texte-equipe {
    width: 100%;
    padding-top: 3rem;
  }
}
.equipe .img-equipe {
  width: 50%;
}
@media (max-width: 992px) {
  .equipe .img-equipe {
    width: 100%;
    margin-right: 0;
    padding-top: 3rem;
  }
}

.services {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
@media (max-width: 992px) {
  .services {
    display: flex;
    flex-direction: column-reverse;
  }
}
.services .service1 {
  width: 50%;
  padding-right: 2rem;
}
@media (max-width: 992px) {
  .services .service1 {
    width: 100%;
  }
}
.services .service2 {
  width: 50%;
  padding-left: 2rem;
}
@media (max-width: 992px) {
  .services .service2 {
    width: 100%;
  }
}

.bandeau-solutions {
  margin-top: -30rem;
  padding-top: 30rem;
  padding-bottom: 20rem;
  width: 100%;
  height: auto;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
.bandeau-solutions .bandeau-contenu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .bandeau-solutions .bandeau-contenu {
    display: flex;
    flex-direction: column;
  }
}
.bandeau-solutions .bandeau-contenu .bandeau-texte {
  width: 50%;
}
@media (max-width: 992px) {
  .bandeau-solutions .bandeau-contenu .bandeau-texte {
    width: 100%;
  }
}
.bandeau-solutions .bandeau-contenu .bandeau-img {
  width: 50%;
  padding: 2.5rem;
}
@media (max-width: 992px) {
  .bandeau-solutions .bandeau-contenu .bandeau-img {
    width: 100%;
  }
}

.pagination {
  padding-top: 6rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.pagination a {
  color: #81D9FF;
  text-decoration: none;
}
.pagination a:after {
  content: " - ";
  display: inline-block;
  font-size: 2rem;
  margin-bottom: -0.5rem;
  margin-left: 1rem;
  margin-right: 1rem;
}
.pagination a:last-of-type:after {
  content: "→";
  display: inline-block;
  font-size: 2rem;
  margin-bottom: -0.5rem;
  margin-left: 1rem;
}

.bandeau-solution {
  margin-top: -30rem;
  padding-top: 30rem;
  width: 100%;
  height: 120rem;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
.bandeau-solution .bandeau-contenu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
}
@media (max-width: 992px) {
  .bandeau-solution .bandeau-contenu {
    flex-direction: column;
    height: auto;
  }
}
.bandeau-solution .bandeau-contenu .bandeau-texte {
  padding-top: 20rem;
  padding-bottom: 40rem;
  width: 35%;
}
@media (max-width: 992px) {
  .bandeau-solution .bandeau-contenu .bandeau-texte {
    width: 100%;
    height: auto;
    padding-top: 2rem;
    padding-bottom: 8rem;
  }
}
.bandeau-solution .bandeau-contenu .bandeau-img {
  width: 50%;
  height: 100%;
}
.bandeau-solution .bandeau-contenu .bandeau-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 3rem 0 0 0;
}
@media (max-width: 992px) {
  .bandeau-solution .bandeau-contenu .bandeau-img img {
    border-radius: 0;
  }
}
@media (max-width: 992px) {
  .bandeau-solution .bandeau-contenu .bandeau-img {
    width: 100%;
    height: auto;
  }
}

.encart-solution {
  background-color: #15182e;
  width: 70%;
  height: auto;
  padding: 5rem;
  margin: -18rem auto 2rem;
  border-radius: 1.8rem;
  position: relative;
  z-index: 5;
}
@media (max-width: 992px) {
  .encart-solution {
    width: 90%;
    padding: 1rem;
    margin: -17rem auto 2rem;
  }
}
@media (max-width: 768px) {
  .encart-solution {
    padding: 2rem 1rem;
  }
}
.encart-solution .encart-contenu .icone-encart {
  width: 20rem;
  padding: 4rem;
  margin: -15rem auto 0;
  background-color: #15182e;
  border-radius: 1.8rem;
}
@media (max-width: 768px) {
  .encart-solution .encart-contenu .icone-encart {
    width: 15rem;
    padding: 4rem;
    margin: -13rem auto 0;
  }
}
.encart-solution .encart-contenu .boutons-encart .bouton-tertiaire {
  margin-right: 2rem;
}

.arguments {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
@media (max-width: 992px) {
  .arguments {
    display: flex;
    flex-direction: column;
  }
}
.arguments .pourquoi {
  width: 50%;
  padding-right: 2rem;
}
@media (max-width: 992px) {
  .arguments .pourquoi {
    width: 100%;
  }
}
.arguments .comment {
  width: 50%;
  padding-left: 2rem;
}
@media (max-width: 992px) {
  .arguments .comment {
    width: 100%;
  }
}

.partenaire {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media (max-width: 768px) {
  .partenaire {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }
}
.partenaire .h2 {
  width: 50%;
}
@media (max-width: 768px) {
  .partenaire .h2 {
    padding-bottom: 4rem;
    width: 100%;
  }
}
.partenaire .logo-partenaire {
  width: 30%;
  margin: auto;
}
@media (max-width: 768px) {
  .partenaire .logo-partenaire {
    margin: initial;
    width: 100%;
  }
}

.galerie {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
.galerie .grid-galerie {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 4rem;
  margin-top: 4rem;
}
@media (max-width: 992px) {
  .galerie .grid-galerie {
    grid-template-columns: 1fr;
  }
}
.galerie .grid-galerie .card-galerie {
  position: relative;
  width: 100%;
  height: 60rem;
  border-radius: 1.8rem;
  transition: 0.3s ease-in-out;
}
.galerie .grid-galerie .card-galerie:hover:after, .galerie .grid-galerie .card-galerie:focus:after {
  background: transparent;
}
.galerie .grid-galerie .card-galerie:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  border-radius: 1.8rem;
  pointer-events: none;
}
.galerie .grid-galerie .card-galerie img {
  border-radius: 1.8rem;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s ease-in-out;
}
.galerie .grid-galerie .card-galerie p {
  position: absolute;
  z-index: 2;
  bottom: 3rem;
  right: 3rem;
}
.galerie .grid-galerie .card-galerie p:after {
  content: "";
  display: inline-block;
  width: 3rem;
  height: 3rem;
  margin-bottom: -0.7rem;
  margin-left: 1rem;
  background-image: url("../img/picto-zoom.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.galerie .bouton-tertiaire {
  margin-top: 3rem;
}

#lightbox-popup {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  transition: opacity 0.3s ease;
}
#lightbox-popup.hidden {
  display: none;
}
#lightbox-popup.active {
  display: flex;
}
#lightbox-popup .lightbox-image {
  max-width: 90%;
  max-height: 80vh;
  border-radius: 1rem;
  transition: 0.3s;
}
#lightbox-popup .lightbox-close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  font-size: 3rem;
  color: white;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1001;
}
#lightbox-popup button.lightbox-prev,
#lightbox-popup button.lightbox-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 4rem;
  color: white;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1001;
}
#lightbox-popup button.lightbox-prev:hover,
#lightbox-popup button.lightbox-next:hover {
  color: #ffcc00;
}
#lightbox-popup .lightbox-prev {
  left: 2rem;
}
#lightbox-popup .lightbox-next {
  right: 2rem;
}

.faq {
  margin-top: 4rem;
  padding: 2rem 1rem;
  background-color: transparent;
  color: #FFFEF3;
  border-radius: 8px;
}
.faq .faq-accordion {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.faq .faq-accordion .faq-item {
  border-bottom: 1px solid #81D9FF;
  padding-bottom: 1rem;
}
.faq .faq-accordion .faq-item .faq-toggle {
  background: none;
  border: none;
  color: inherit;
  text-align: left;
  width: 100%;
  font-size: 1.1rem;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  padding: 0.5rem 0;
}
.faq .faq-accordion .faq-item .faq-question {
  color: #FFFEF3;
}
.faq .faq-accordion .faq-item .faq-icon {
  font-size: 5rem;
  transition: transform 0.2s ease;
}
.faq .faq-accordion .faq-item .faq-toggle[aria-expanded=true] .faq-icon {
  transform: rotate(0deg);
}
.faq .faq-accordion .faq-item .faq-content {
  margin-top: 0.5rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #FFFEF3;
}

.post-navigation {
  padding-top: 6rem;
  display: flex;
  justify-content: center;
}
.post-navigation .nav-links {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
@media (max-width: 992px) {
  .post-navigation .nav-links {
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
}
.post-navigation .nav-links .nav-previous {
  order: 2;
}
.post-navigation .nav-links .nav-next {
  order: 1;
}
.post-navigation .nav-links a {
  color: #81D9FF;
  text-decoration: none;
  padding: 1rem 2rem;
}
@media (max-width: 992px) {
  .post-navigation .nav-links a {
    padding: 0.5rem 0;
  }
}

.bandeau-actualites {
  margin-top: -30rem;
  padding-top: 30rem;
  width: 100%;
  height: 120rem;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
.bandeau-actualites .bandeau-contenu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
}
@media (max-width: 992px) {
  .bandeau-actualites .bandeau-contenu {
    flex-direction: column;
    align-items: center;
    height: auto;
  }
}
.bandeau-actualites .bandeau-contenu .bandeau-texte {
  padding-top: 20rem;
  padding-bottom: 40rem;
  width: 30%;
}
@media (max-width: 992px) {
  .bandeau-actualites .bandeau-contenu .bandeau-texte {
    width: 100%;
    height: auto;
    padding-top: 2rem;
    padding-bottom: 8rem;
  }
}
.bandeau-actualites .bandeau-contenu .bandeau-img {
  width: 50%;
  height: 100%;
}
.bandeau-actualites .bandeau-contenu .bandeau-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 3rem 0 0 0;
}
@media (max-width: 992px) {
  .bandeau-actualites .bandeau-contenu .bandeau-img img {
    border-radius: 0;
  }
}
@media (max-width: 992px) {
  .bandeau-actualites .bandeau-contenu .bandeau-img {
    width: 100%;
    height: auto;
  }
}

.encart-actualites {
  background-color: #15182e;
  width: 70%;
  height: auto;
  padding: 5rem;
  margin: -18rem auto 2rem;
  border-radius: 1.8rem;
  position: relative;
  z-index: 5;
}
@media (max-width: 992px) {
  .encart-actualites {
    width: 90%;
    padding: 2rem;
  }
}
@media (max-width: 768px) {
  .encart-actualites {
    margin: -40rem auto 2rem;
  }
}

.actualites-archive .grid-cards-actus {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem;
  margin-top: 2rem;
}
@media (max-width: 992px) {
  .actualites-archive .grid-cards-actus {
    grid-template-columns: 1fr;
  }
}
.actualites-archive .grid-cards-actus .card-actu {
  position: relative;
  width: 100%;
  height: 54rem;
  border-radius: 1.8rem;
  transition: 0.3s ease-in-out;
}
.actualites-archive .grid-cards-actus .card-actu:hover .contenu-card, .actualites-archive .grid-cards-actus .card-actu:focus .contenu-card {
  display: none;
}
.actualites-archive .grid-cards-actus .card-actu .thumb {
  border-radius: 1.8rem;
  width: auto;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: 0.3s ease-in-out;
  /* Layer noir -> transparent */
}
.actualites-archive .grid-cards-actus .card-actu .thumb:hover:after, .actualites-archive .grid-cards-actus .card-actu .thumb:focus:after {
  background: transparent;
}
.actualites-archive .grid-cards-actus .card-actu .thumb:after {
  content: "";
  position: absolute;
  inset: 0; /* top: 0; right: 0; bottom: 0; left: 0; */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  border-radius: 1.8rem;
  pointer-events: none; /* pour que les clics passent à travers */
}
.actualites-archive .grid-cards-actus .card-actu .contenu-card h3 {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  top: 25rem;
  left: 3rem;
  right: 3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  max-height: 6em;
}
.actualites-archive .grid-cards-actus .card-actu .contenu-card .bouton-tertiaire {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  bottom: 3rem;
  right: 3rem;
}
.actualites-archive .bouton-tertiaire {
  margin-top: 3rem;
}

.bandeau-article {
  margin-top: -30rem;
  margin-bottom: 5rem;
  padding-top: 30rem;
  width: 100%;
  height: 130rem;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
@media (max-width: 992px) {
  .bandeau-article {
    height: auto;
    margin-top: 0;
    padding-top: 5rem;
  }
}
.bandeau-article .bandeau-contenu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
}
@media (max-width: 992px) {
  .bandeau-article .bandeau-contenu {
    flex-direction: column;
    align-items: center;
    height: auto;
  }
}
.bandeau-article .bandeau-contenu .bandeau-texte {
  padding-top: 20rem;
  padding-bottom: 40rem;
  width: 35%;
}
@media (max-width: 992px) {
  .bandeau-article .bandeau-contenu .bandeau-texte {
    width: 100%;
    padding-top: 2rem;
    padding-bottom: 8rem;
  }
}
.bandeau-article .bandeau-contenu .bandeau-img {
  width: 50%;
  height: 100%;
}
@media (max-width: 992px) {
  .bandeau-article .bandeau-contenu .bandeau-img {
    width: 100%;
    height: auto;
  }
}
.bandeau-article .bandeau-contenu .bandeau-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 3rem 0 0 0;
}
@media (max-width: 992px) {
  .bandeau-article .bandeau-contenu .bandeau-img img {
    height: auto;
    border-radius: 0;
  }
}

.bandeau-contact {
  margin-top: -30rem;
  padding-top: 30rem;
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media (max-width: 992px) {
  .bandeau-contact {
    display: flex;
    flex-direction: column;
  }
}
.bandeau-contact .bandeau-contenu {
  width: 30%;
}
@media (max-width: 992px) {
  .bandeau-contact .bandeau-contenu {
    width: 100%;
    padding-bottom: 4rem;
  }
}
.bandeau-contact .bandeau-contenu .contacts ul {
  list-style-type: none;
  padding-left: 0;
}
.bandeau-contact .bandeau-contenu .contacts ul .tel {
  padding-bottom: 4rem;
}
@media (max-width: 768px) {
  .bandeau-contact .bandeau-contenu .contacts ul .tel a {
    font-size: 1.3rem;
  }
}
.bandeau-contact .bandeau-contenu .contacts ul .tel:before {
  content: "";
  display: inline-block;
  width: 6rem;
  height: 5rem;
  margin-bottom: -2rem;
  margin-right: 1rem;
  background-image: url("../img/tel-contact.svg");
  background-repeat: no-repeat;
  background-size: 90%;
  background-position: center;
}
@media (max-width: 768px) {
  .bandeau-contact .bandeau-contenu .contacts ul .mail a {
    font-size: 1.3rem;
  }
}
.bandeau-contact .bandeau-contenu .contacts ul .mail:before {
  content: "";
  display: inline-block;
  width: 6rem;
  height: 6rem;
  margin-bottom: -2rem;
  margin-right: 1rem;
  background-image: url("../img/mail-contact.svg");
  background-repeat: no-repeat;
  background-size: 90%;
  background-position: center;
}
.bandeau-contact .contactform {
  width: 50%;
  margin-bottom: -3rem;
}
@media (max-width: 992px) {
  .bandeau-contact .contactform {
    width: 100%;
  }
}
.bandeau-contact .contactform form {
  background: #15182e;
  border-radius: 3rem 0 0 0;
  padding: 5rem;
  background-image: url("../img/pattern-contact.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom;
}
.bandeau-contact .contactform form label {
  display: block;
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #81D9FF;
}
.bandeau-contact .contactform form input[type=text],
.bandeau-contact .contactform form input[type=email],
.bandeau-contact .contactform form input[type=tel],
.bandeau-contact .contactform form textarea,
.bandeau-contact .contactform form select {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid #81D9FF;
  padding: 2rem;
  color: #81D9FF;
  font-size: 2rem;
}
.bandeau-contact .contactform form input[type=text]:focus,
.bandeau-contact .contactform form input[type=email]:focus,
.bandeau-contact .contactform form input[type=tel]:focus,
.bandeau-contact .contactform form textarea:focus,
.bandeau-contact .contactform form select:focus {
  border-color: #81D9FF;
  outline: none;
  box-shadow: 0 0 0 2px #FFFEF3;
}
.bandeau-contact .contactform form textarea {
  grid-column: 1/-1;
  min-height: 120px;
}
.bandeau-contact .contactform form .wpcf7-checkbox,
.bandeau-contact .contactform form .wpcf7-radio {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  color: #FFFEF3;
}
.bandeau-contact .contactform form .wpcf7-checkbox label,
.bandeau-contact .contactform form .wpcf7-radio label {
  display: flex;
  align-items: center;
  padding-top: 2rem;
  color: #FFFEF3;
}
.bandeau-contact .contactform form .wpcf7-checkbox label input,
.bandeau-contact .contactform form .wpcf7-radio label input {
  margin-right: 1rem;
}
.bandeau-contact .contactform form .wpcf7-submit {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2rem;
  color: #FFFEF3;
  text-decoration: none;
  display: inline-block;
  text-align: left;
  color: #15182e;
  background-color: #81D9FF;
  border: none;
  border-radius: 10rem;
  padding: 1.5rem 3rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
  margin-right: 1rem;
  transition: box-shadow 0.3s ease;
}
@media (max-width: 768px) {
  .bandeau-contact .contactform form .wpcf7-submit {
    font-size: 1.8rem;
  }
}
.bandeau-contact .contactform form .wpcf7-submit:after {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  margin-bottom: -0.3rem;
  margin-left: 1rem;
  background-image: url("../img/link.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  .bandeau-contact .contactform form .wpcf7-submit:after {
    width: 1.5rem;
    height: 1.5rem;
    margin-bottom: -0.2rem;
  }
}
.bandeau-contact .contactform form .wpcf7-submit:hover, .bandeau-contact .contactform form .wpcf7-submit:focus {
  background-color: #FFFEF3;
  box-shadow: inset -7px 7px 14px #b5b4ad, inset 7px -7px 14px #ffffff;
}
.bandeau-contact .contactform .wpcf7-response-output {
  padding-bottom: 2rem;
  padding-top: 1rem;
  font-family: "Open Sans";
  font-style: normal;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 2rem;
  color: #FFFEF3;
}
@media (max-width: 768px) {
  .bandeau-contact .contactform .wpcf7-response-output {
    font-size: 1.8rem;
  }
}

.devis {
  width: 100%;
  height: auto;
  background-color: #81D9FF;
  background-image: url("../img/pattern-noir.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center calc(100% + 5rem);
  padding-top: 8rem;
  padding-bottom: 8rem;
  margin-top: 8rem;
}
@media (max-width: 992px) {
  .devis {
    background-size: cover;
  }
}
.devis .contenu-devis {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 992px) {
  .devis .contenu-devis {
    display: flex;
    flex-direction: column;
  }
}
.devis .contenu-devis .texte-devis {
  width: 40%;
}
@media (max-width: 992px) {
  .devis .contenu-devis .texte-devis {
    width: 100%;
  }
}
.devis .contenu-devis .texte-devis .h2 .line .dot, .devis .contenu-devis .texte-devis .h2 .line .bar {
  background-color: #15182e;
}
.devis .contenu-devis .texte-devis .h2 h2 {
  color: #15182e;
}
.devis .contenu-devis .texte-devis p {
  color: #15182e;
  font-weight: 600;
  padding-bottom: 1rem;
}
@media (max-width: 992px) {
  .devis .contenu-devis .coordonnees-devis {
    width: 100%;
  }
}
.devis .contenu-devis .coordonnees-devis p {
  font-weight: 400;
  color: #15182e;
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis p {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis .tel a {
    font-size: 1.3rem;
  }
}
.devis .contenu-devis .coordonnees-devis .tel:before {
  content: "";
  display: inline-block;
  width: 6rem;
  height: 6rem;
  margin-right: 1rem;
  margin-bottom: -2rem;
  background-image: url("../img/tel-devis.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis .tel:before {
    width: 4rem;
    height: 4rem;
    margin-bottom: -1.5rem;
  }
}
.devis .contenu-devis .coordonnees-devis .mail a {
  color: #15182e;
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis .mail a {
    font-size: 1.3rem;
  }
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis .mail {
    font-size: 1.3rem;
  }
}
.devis .contenu-devis .coordonnees-devis .mail:before {
  content: "";
  display: inline-block;
  width: 6rem;
  height: 6rem;
  margin-right: 1rem;
  margin-bottom: -2rem;
  background-image: url("../img/mail-devis.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
@media (max-width: 768px) {
  .devis .contenu-devis .coordonnees-devis .mail:before {
    width: 4rem;
    height: 4rem;
    margin-bottom: -1.5rem;
  }
}

.texte-404 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 8rem;
}
.texte-404 p {
  font-size: 3rem;
  text-align: center;
}

.img-404 {
  width: 100%;
  height: auto;
  margin-top: 8rem;
  margin-bottom: -8rem;
}

.search-background {
  height: 100vh;
  margin-top: 8rem;
}
.search-background .search-form {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-self: center;
}
@media (max-width: 992px) {
  .search-background .search-form {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.search-background .search-form label {
  padding-bottom: 2rem;
  padding-top: 1rem;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  font-size: 2rem;
  color: #FFFEF3;
  padding: 3rem;
  width: 40%;
}
@media (max-width: 992px) {
  .search-background .search-form label {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .search-background .search-form label {
    font-size: 1.8rem;
  }
}
.search-background .search-form #search-field {
  width: 80%;
  padding: 8rem;
  border: none;
  border-radius: 1.8rem 0 0 1.8rem;
}
@media (max-width: 992px) {
  .search-background .search-form #search-field {
    width: 100%;
    border-radius: 0.5rem;
  }
}
.search-background .search-form #search-field::placeholder {
  color: #15182e;
  font-style: italic;
  opacity: 0.7;
  transition: all 0.3s ease;
}
.search-background .search-form #search-field:focus {
  outline: none;
  padding: 2rem 2.5rem;
}
.search-background .search-form #search-field:focus::placeholder {
  color: rgb(52.9701492537, 60.5373134328, 116.0298507463);
  font-style: normal;
  opacity: 0.4;
}
.search-background .search-form input {
  width: 20%;
  background: #FFFEF3;
  border: none;
}
.search-background .search-form input:last-child {
  background: #81D9FF;
  border: none;
  background-image: url("../img/search-form.svg");
  background-repeat: no-repeat;
  background-size: 40%;
  background-position: center;
  border-radius: 0 1.8rem 1.8rem 0;
  transition: 0.3s ease-in-out;
}
.search-background .search-form input:last-child:hover, .search-background .search-form input:last-child:focus {
  background: radial-gradient(circle, rgb(18, 185, 222) 0%, rgb(33, 42, 82) 73%, rgb(21, 24, 45) 100%);
}
@media (max-width: 992px) {
  .search-background .search-form input:last-child {
    width: 30%;
    padding: 2rem;
    background-size: 20%;
    border-radius: 0.5rem;
  }
}

.grid-cards-search {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
  grid-gap: 4rem;
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media (max-width: 992px) {
  .grid-cards-search {
    grid-template-columns: 1fr;
  }
}
.grid-cards-search .card-search {
  position: relative;
  width: 100%;
  height: 40rem;
  border-radius: 1.8rem;
  transition: 0.3s ease-in-out;
}
.grid-cards-search .card-search:hover .contenu-card, .grid-cards-search .card-search:focus .contenu-card {
  display: none;
}
.grid-cards-search .card-search .thumb {
  border-radius: 1.8rem;
  width: auto;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: 0.3s ease-in-out;
  /* Layer noir -> transparent */
}
.grid-cards-search .card-search .thumb:hover:after, .grid-cards-search .card-search .thumb:focus:after {
  background: transparent;
}
.grid-cards-search .card-search .thumb:after {
  content: "";
  position: absolute;
  inset: 0; /* top: 0; right: 0; bottom: 0; left: 0; */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  border-radius: 1.8rem;
  pointer-events: none; /* pour que les clics passent à travers */
}
.grid-cards-search .card-search .contenu-card h3 {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  top: 22rem;
  left: 2rem;
  right: 3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  max-height: 2.4em;
}
.grid-cards-search .card-search .contenu-card .bouton-tertiaire {
  position: absolute;
  z-index: 2;
  text-decoration: none;
  bottom: 3rem;
  right: 3rem;
}

.no-results {
  color: #81D9FF;
  font-weight: 400;
  text-transform: uppercase;
}