/*!
Theme Name: Thème Wordpress
Theme URI: http://underscores.me/
Author: Paul ROGER
Author URI: https://www.paulrogerdev.fr
Description: Thème WP
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: theme-wordpress
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Thème Wordpress is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
:root {
  --maxwidth: 920px;
  --maxwidth2: 1080px;
  --maxwidth3: 1140px;
  --maxwidth4: 1300px;
  --font1: 'Nexa', sans-serif;
  --fontSizeH1: 80px;
  --fontSizeH2: 42px;
  --fontSizeH3: 24px;
  --fontSizeH4: 22px;
  --fontSizeH5: 20px;
  --fontSizeP: 18px;
  --fontSizeP2: 20px;
  --fontSizeA: 18px;
  --fontSizeA2: 22px;
  --black: #000;
  --white: #fff;
  --blue: #015864;
  --yellow: #FAB600;
}

@media (max-width: 1380px) {
  :root {
    --maxwidth4: calc(100% - 80px);
  }
}

@media (max-width: 1220px) {
  :root {
    --maxwidth3: calc(100% - 80px);
  }
}

@media (max-width: 1161px) {
  :root {
    --maxwidth2: calc(100% - 80px);
  }
}

@media (max-width: 1001px) {
  :root {
    --maxwidth: calc(100% - 80px);
  }
}

@media (max-width: 1440px) {
  :root {
    --fontSizeH1: 65px;
    --fontSizeH2: 36px;
    --fontSizeH3: 22px;
    --fontSizeH4: 20px;
    --fontSizeH5: 18px;
    --fontSizeP: 18px;
    --fontSizeP2: 20px;
    --fontSizeA: 16px;
    --fontSizeA2: 20px;
  }
}
@media (max-width: 800px) {
  :root {
    --maxwidth: calc(100% - 40px);
    --maxwidth2: calc(100% - 40px);
    --maxwidth3: calc(100% - 40px);
    --maxwidth4: calc(100% - 40px);
    --fontSizeH1: 45px;
    --fontSizeH2: 30px;
    --fontSizeH3: 20px;
    --fontSizeH4: 17px;
    --fontSizeH5: 16px;
    --fontSizeP: 16px;
    --fontSizeP2: 16px;
    --fontSizeA: 16px;
    --fontSizeA2: 18px;
  }
}

@media (max-width: 600px) {
  :root {
    --fontSizeH1: 35px;
  }
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  overflow: auto;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}

body {
  position: relative;
  font-family: var(--font1);
  color: var(--blue);
  margin: 0;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
}

#page {
  min-height: calc(100vh - 200px);
  justify-content: space-between;
}

.main {
  width: 100%;
  max-width: var(--maxwidth2);
}

h1 {
  font-size: var(--fontSizeH1);
  font-weight: 700;
}
h2 {
  font-size: var(--fontSizeH2);
  font-weight: 700;
}
h3 {
  font-size: var(--fontSizeH3);
  font-weight: 700;
}
h4 {
  font-size: var(--fontSizeH4);
  font-weight: 700;
}
h5 {
  font-size: var(--fontSizeH5);
  font-weight: 700;
}
h1, h2, h3, h4, h5 {
  width: 100%;
}
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong {
  font-weight: 800;
}

h1 strong {
  font-weight: 900;
}

a {
  color: var(--blue);
  text-decoration: none;
}

ul li {
  font-size: var(--fontSizeP);
}

p {
  font-size: var(--fontSizeP);
  line-height: 140%;
  margin: 10px 0;
  width: 100%;
}

figure {
  margin: 0;
}

img {
  max-width: 100%;
}

hr{
  width: 63px;
  height: 7px;
  background-color: var(--yellow);
  border: none;
  margin: 6px 0 16px 0;
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex__col {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.links {
  width: 100%;
  justify-content: flex-start;
  flex-flow: wrap;
  gap: 6px;
  margin: 10px 0;
}

.button, a.button {
  display: inline-block;
  padding: 14px 30px 10px 30px;
  border-radius: 100px;
  background-color: var(--yellow);
  color: var(--white);
  font-size: var(--fontSizeA2);
  font-weight: 700;
  cursor: pointer;
  transition: background-color .5s;
}

.acf-block-preview .button, .acf-block-preview a.button {
  border: unset;
}

.button:hover, a.button:hover {
  background-color: var(--blue);
}

.has-black-color {color: var(--black)}
.has-black-background-color {background-color: var(--black)}
.has-white-color {color: var(--white)}
.has-white-background-color {background-color: var(--white)}
.has-blue-color {color: var(--blue)}
.has-blue-background-color {background-color: var(--blue)}
.has-pink-color {color: var(--yellow)}
.has-pink-background-color {background-color: var(--yellow)}

.header {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  background-color: transparent;
  transition: all 0.5s;
}

.header__inner {
  width: 100%;
  max-width: var(--maxwidth4);
  justify-content: space-between;
  padding: 25px 0;
  transition: all 0.5s;
}

.header__logo {
  width: 340px;
  height: auto;
  transition: all 0.5s;
}

.menu__header {
  transition: all 0.5s;
}

.menu__header__content {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 10px 12px;
}

.menu__header__content li {
}

.menu__header__content li::after {
  content: '';
  display: inline-block;
  width: 2px;
  height: 15px;
  background-color: var(--white);
}

.menu__header__content li:last-child::after {
  display: none;
}

.menu__header__content li a {
  font-size: var(--fontSizeA2);
  font-weight: 700;
  margin-right: 12px;
  transition: color 0.25s;
  color: var(--white);
}

.menu__header__content li:last-child a {
  margin-right: 0;
}

.menu__header__content li a:hover {
  color: var(--yellow);
}

.menu__scroll {
  background-color: var(--blue);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  transition: all 0.5s;
}

.menu__scroll .header__inner {
  width: calc(100% - 40px);
  padding: 10px 20px;
}

.header__rs {
  margin-left: 20px;
}

.header__rs img {
  width: 40px;
  height: auto;
}

.menu__scroll .header__logo {
  width: 200px;
}

#burger {
  display: none;
}

@media (min-width: 1025px) {
  .menu__header {
    width: auto!important;
    height: auto!important;
  }
  .menu__header__content li {
    opacity: 1!important;
  }
}

@media (max-width: 1024px) {
  .header__logo {
    width: 200px;
  }
  .menu__scroll .header__logo {
    width: 150px;
  }
  .menu__header {
    position: absolute;
    z-index: -1;
    top: 107px;
    right: 40px;
    width: 0;
    height: 0;
    background-color: var(--white);
    overflow: hidden;
    transition: top 0.5s;
  }
  .menu__header__content li a {
    color: var(--blue);
  }
  .header__rs {
    margin-left: 0;
    margin-right: 10px;
  }
  .header__rs img {
    width: 35px;
  }
  .menu__scroll .menu__header {
    top: 73px;
    border-top-left-radius: 0!important;
    border-top-right-radius: 0!important;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16);
  }
  .menu__header__content {
    flex-direction: column;
    align-items: flex-start;
  }
  .menu__header__content li {
    min-width: 150px;
    margin-right: 0;
    text-align: right;
  }
  .menu__header__content li::after {
    display: block;
    width: 10px;
    height: 2px;
    margin-top: 4px;
  }
  .menu__header__content li a{
    margin-right: 0;
  }
  #burger {
    position: relative;
    display: block;
    width: 40px;
    height: 33px;
    padding: 10px;
    cursor: pointer;
  }
  #burger div {
    width: 80%;
    height: 3px;
    background-color: var(--white);
    border-radius: 25px;
    margin: 6px 10%;
    transition: all 0.25s;
  }
  #burger.burger__active div:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
  }
  #burger.burger__active div:nth-child(2) {
    opacity: 0;
  }
  #burger.burger__active div:nth-child(3) {
    transform: rotate(-45deg) translate(7px, -8px);
  }
}

@media (max-width: 800px) {
  .menu__header {
    max-width: 90vw;
    right: 20px;
  }
}

.intro {
  position: relative;
  z-index: 2;
  width: 100vw;
  height: 100vh;
}

.intro__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.intro__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.intro__inner {
  width: 100%;
  height: 100%;
  max-width: var(--maxwidth);
  margin-top: 60px;
}

.intro__inner h1 {
  color: var(--white);
  margin: 0 0 6px 0;
}

.intro__inner h2, .intro__inner h3, .intro__inner h4, .intro__inner h5, .intro__inner p, .intro__inner ul li {
  color: var(--yellow);
  margin: 0;
}

.intro__inner p, .intro__inner ul li {
  font-size: calc(var(--fontSizeH1) * 0.37);
  text-transform: uppercase;
  letter-spacing: calc(var(--fontSizeH1) * 0.08);
}

.intro__inner a.button {
  font-size: var(--fontSizeA2);
  margin-top: 40px;
}

.intro__inner h1, .intro__inner h2, .intro__inner h3, .intro__inner h4, .intro__inner h5, .intro__inner p, .intro__inner ul li, .intro__inner a.button {
  visibility: hidden;
}

.acf-block-preview .intro__inner h1, .acf-block-preview .intro__inner h2, .acf-block-preview .intro__inner h3, .acf-block-preview .intro__inner h4, .acf-block-preview .intro__inner h5, .acf-block-preview .intro__inner p, .acf-block-preview .intro__inner ul li, .acf-block-preview .intro__inner a.button {
  visibility: visible;
}

@media (max-width: 1280px) {
  .intro__rdv {
    width: 180px;
    transform: translate(0, 0);
  }
}

.content1 {
  position: relative;
  z-index: 2;
  width: 100vw;
  padding: 80px 0;
  overflow: hidden;
}

.content1__inner {
  width: 100%;
  max-width: var(--maxwidth2);
  gap: 60px;
  justify-content: space-between;
  align-items: stretch;
}

.content1__content {
  width: calc(50% - 30px);
  align-items: flex-start;
}

.content1 h2 {
  position: relative;
}

.content1 h2::after {
  position: absolute;
  content: ".";
  line-height: calc(var(--fontSizeH2) / 2);
  font-size: calc(var(--fontSizeH2) * 2);
  color: var(--yellow);
}

.content1__content *:first-child {
  margin-top: 0;
}
.content1__content *:last-child {
  margin-bottom: 0;
}

.content1 p {
  max-width: 445px;
}

.content1__image {
  position: relative;
  width: calc(50% - 30px);
  height: auto;
  overflow: hidden;
}

.content1__overlay {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--yellow);
  transform-origin: right;
}

.content1__image figure {
  display: flex;
  width: 100%;
  height: 100%;
  background-color: var(--yellow);
  overflow: hidden;
}

.content1__image figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.content1__reverse .content1__inner {
  flex-direction: row-reverse;
}

.content1__inner .links {
  margin-top: 40px;
}

.acf-block-preview .content1__overlay {
  display: none;
}

@media (min-width: 1461px) {
  .content1 {
    padding: 120px 0;
  }
}

@media (max-width: 1160px) {
  .content1__content {
    width: 50%;
    margin-left: 0;
  }
  .content1__image {
    width: 50%;
  }
}

@media (max-width: 800px) {
  .content1 {
    padding: 60px 0;
  }
  .content1__inner {
    gap: 40px;
    min-height: unset;
  }
  .content1__inner, .content1__reverse .content1__inner {
    flex-direction: column;
  }
  .content1__content,
  .content1__image {
    width: 100%;
  }
  .content1 p {
    max-width: unset;
  }
  .content1__image {
    align-items: flex-end;
  }
  .content1__image figure {
    width: 80%;
    max-width: 300px;
  }
  .content1__image::before, .content1__reverse .content1__image::before {
    width: 100vw;
    height: auto;
    aspect-ratio: 1/1;
    max-width: 600px;
    top: 100%;
    left: 70%;
  } 
}

@media (max-width: 500px) {
  .content1__image::before, .content1__reverse .content1__image::before {
    width: 125vw;
    left: 50%;
  } 
}

.contact {
  position: relative;
  z-index: 2;
  width: 100vw;
  overflow: hidden;
  padding: 80px 0 40px 0;
  color: var(--white);
}

.contact__bg {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
}

.contact__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.contact h2,
.contact h3,
.contact h4,
.contact h5 {
  position: relative;
  color: var(--white);
}

.contact h2::after,
.contact h3::after,
.contact h4::after,
.contact h5::after{
  position: absolute;
  content: ".";
  line-height: calc(var(--fontSizeH2) / 2);
  font-size: calc(var(--fontSizeH2) * 2);
  color: var(--blue);
}

.contact__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--maxwidth3);
}

.contact__cols {
  width: 100%;
  gap: 40px;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 40px;
}

.contact__col__info {
  width: calc(40% - 80px);
  justify-content: flex-start;
  align-items: flex-end;
  gap: 20px;
}

.contact__col__info *:first-child {
  margin-top: 0;
}

.contact__col__info *:last-child {
  margin-bottom: 0;
}

.contact__col__info p {
  color: var(--white);
  font-size: var(--fontSizeH3);
  font-weight: 700;
  width: auto;
}

.contact__col__info ul li,
.contact__col__info a,
.contact__col__info strong,
.contact__col__info strong a {
  color: var(--white);
}

.contact__col__form {
  width: calc(60% - 20px);
  align-items: flex-start;
}

.contact strong {
  font-weight: 800;
}

.conForm {
  width: 100%;
  gap: 10px;
  margin-top: 10px;
}

.conForm p {
  width: 100%;
}

.conForm__line {
  width: 100%;
  gap: 10px;
}

.conForm__input {
  width: 100%;
}

.conForm__input.w50 {
  width: calc(50% - 5px);
}

.conForm__input.w100 {
  width: 100%;
}

.conForm__input span{
  width: 100%;
}

.conForm__input input,
.conForm__input textarea {
  display: block;
  width: calc(100% - 54px);
  font-family: var(--font1);
  font-size: var(--fontSizeP2);
  font-weight: 700;
  border: 1px solid var(--white);
  border-radius: 25px;
  background-color: var(--yellow);
  color: var(--white);
  padding: 13px 26px;
}

.conForm__input textarea {
  border-radius: 20px;
  resize: vertical;
}

.conForm__input input::placeholder,
.conForm__input textarea::placeholder {
  font-style: italic;
  font-weight: 400;
  color: var(--white);
}

.conForm__input input:focus,
.conForm__input textarea:focus {
  outline: 2px solid var(--blue);
}

.wpcf7 form .wpcf7-response-output {
  font-size: var(--fontSizeP);
  font-weight: 700;
  border-radius: 20px;
  color: #fff;
  margin: 0;
  padding: 10px 20px;
}

.wpcf7 form.sent .wpcf7-response-output {
  background-color: #46b450;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  background-color: #dc3232;
}

.wpcf7 form.spam .wpcf7-response-output {
  background-color: #f56e28;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  background-color: #ffb900;
}

.conForm__input input.wpcf7-not-valid,
.conForm__input textarea.wpcf7-not-valid {
  border-color: #dc3232;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.conForm__input span.wpcf7-not-valid-tip {
  width: calc(100% - 40px);
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  background-color: #dc3232;
  color: #fff;
  border-radius: 25px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 10px 20px;
}

.conForm__captcha {
  width: 100%;
  align-items: flex-start;
}

.conForm__captcha img {
  padding: 5px;
  margin-bottom: 5px;
  background-color: var(--white);
  border-radius: 25px;
}

.conForm__send {
  width: 100%;
  align-items: flex-end;
}

.conForm__send input {
  display: inline-block;
  padding: 14px 30px 10px 30px;
  border: none;
  border-radius: 100px;
  background-color: var(--blue);
  color: var(--white);
  font-family: var(--font1);
  font-size: var(--fontSizeP2);
  font-weight: 700;
  cursor: pointer;
  transition: background-color .5s;
}

.conForm__send input:hover {
  background-color: var(--blue);
}

.conForm__checkbox {
  width: calc(100% - 50px);
  margin: 10px 0;
}

.conForm__checkbox .wpcf7-list-item {
  margin: 0;
}

.conForm__checkbox input {
  position: relative;
  width: 20px;
  height: 20px;
  appearance: none;
  padding: 13px;
  border-radius: 8px;
  float: left;
  margin: 0;
  margin-right: 10px;
}

.conForm__checkbox input:checked::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 4px;
  border-radius: 100px;
  background-color: var(--white);
  transform: translate(-10px, 0px) rotate(45deg);
}

.conForm__checkbox input:checked:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 4px;
  border-radius: 100px;
  background-color: var(--white);
  transform: translate(-3px, -2.5px) rotate(-45deg);
}

.conForm__checkbox .wpcf7-list-item-label {
  font-size: 16px;
  font-weight: 500;
}

@media (max-width: 1200px) {
  .contact__col__info {
    width: calc(40% - 20px);
  }
}


@media (max-width: 800px) {
  .contact {
    padding-top: 40px;
  }
  .contact__cols {
    flex-direction: column-reverse;
    gap: 20px;
    margin-top: 0;
  }
  .contact__col__info,
  .contact__col__form {
    width: 100%;
  }
  .contact__col__form {
    align-items: center;
  }
  .contact__col__form .wpcf7 {
    max-width: 500px;
  }
  .contact__col__info {
    flex-direction: row;
    justify-content: center;
    flex-flow: wrap;
    gap: 30px 40px;
  }
  .contact__col__info p {
    font-size: var(--fontSizeP);
    text-align: center!important;
    margin: 0;
  }
  .conForm__checkbox {
    width: 100%;
  }
}

.footer {
  width: 100vw;
  background-color: var(--blue);
  margin-top: 40px;
}

.home .footer {
  margin-top: 0;
}

.footer__inner {
  width: 100%;
  max-width: var(--maxwidth2);
  align-items: flex-start;
  gap: 40px;
  margin: 60px 0 40px 0;
}

.footer__col {
  width: 33%;
}

.footer__content {
  gap: 10px;
  color: var(--white);
  font-weight: 300;
  align-items: flex-start;
}

.footer__logo {
  max-width: 300px;
}

.footer__menu__content {
  gap: 20px 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer__menu__content li {
  width: 100%;
}

.footer__menu__content li:last-of-type:after {
  display: none;
}

.footer__menu__content li a {
  width: 100%;
  font-size: var(--fontSizeA2);
  font-weight: 700;
  color: var(--white);
}

.footer__rs {
  font-size: var(--fontSizeH3);
  font-weight: 700;
  color: var(--white);
}

.footer__rs__inner {
  align-items: flex-start;
}

.footer__rs__content {
  width: auto;
  justify-content: flex-start;
  flex-flow: wrap;
  gap: 10px;
  margin-top: 10px;
}

.footer__mentions {
  width: 100%;
  max-width: var(--maxwidth2);
  flex-flow: wrap;
  gap: 10px;
  padding: 10px 0;
}

.footer__mentions a,
.footer__mentions div {
  color: var(--white);
}

.footer__mentions a::after,
.footer__mentions div::after {
  content: '|';
  display: inline-block;
  margin-left: 10px;
}

.footer__mentions a:last-child::after,
.footer__mentions div:last-child::after {
  display: none;
}

@media (max-width: 1160px) {
  .footer__inner {
    margin: 60px 0;
    flex-flow: wrap;
    gap: 40px;
    justify-content: flex-end;
  }
  .footer__col {
    width: calc(50% - 20px);
  }
}

@media (max-width: 600px) {
  .footer__inner {
    justify-content: center;
  }
  .footer__content {
    width: 100%;
  }
}

.wp-block-spacer {
  background-color: rgba(0,0,0,0.05);
}

.error-404, .searchPage {
  margin-top: 100px;
  min-height: calc(70vh - 100px);
}

.bandeau {
  position: relative;
  display: flex;
  width: 100vw;
  height: 170px;
  margin-bottom: 20px;
}

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

.error-404 h1.page-title {
  text-align: center;
}