@charset "UTF-8";
/*
Theme Name: Tesson de Froment 
Theme URI: http://tessondefroment.fr
Author: Conseils et Préférence
Author URI: https://conseilspreference.com
Description: Thème du site de Tesson de Froment
Requires at least: WordPress 6.9
Version: 1.0
*/

html {
  --cp-light-blue: #739FE2;
  --cp-blue: #1C3F87;
  --cp-dark-blue: #002976;
  --cp-overlay-blue: #001f83;
  --cp-gray: #f5f5f5;
  --cp-pink: #B03052;
}

/* Typo */
@font-face {
  font-family: "LeagueSpartan";
  font-style: normal;
  font-weight: 400;
  src: url("fonts/LeagueSpartan-regular.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "LeagueSpartan";
  font-style: normal;
  font-weight: 600;
  src: url("fonts/LeagueSpartan-SemiBold.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "LeagueSpartan";
  font-style: normal;
  font-weight: 700;
  src: url("fonts/LeagueSpartan-Bold.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "LeagueSpartan";
  font-style: normal;
  font-weight: 900;
  src: url("fonts/LeagueSpartan-Black.woff2") format("woff2");
  font-display: swap;
}
html body{
  font-family: 'LeagueSpartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: var(--cp-dark-blue);
  word-break: keep-all;
  height: 100vh;
}
body:not(.home) h1{
  font-weight: 700;
}
body h2{
  font-weight: 600;
}
body h3{
  font-weight: 400;
}
body a{
  text-decoration: none;
  color: var(--cp-pink);
}
body a:hover{
  color: var(--cp-dark-blue);
}
body p,
body ul{
  font-size: 1.15rem;
}
blockquote{
  display: flex;
  justify-content: center;
}
blockquote p{
  font-size: 150%;
  margin-left: .25rem;
}
blockquote::before,
blockquote::after{
  content: '“';
  font-size: 300%;
  vertical-align: top;
  line-height: normal;
  margin-right: .25rem;
  color: var(--cp-light-blue);
}
blockquote::after{
  content: '”';
}
figcaption{
  text-align: center;
  opacity: .5;
}
@media (min-width: 768px) {
  body.home h2{
    font-size: 3rem;
    line-height: 1;
  }
}

/* Buttons */
body .btn,
.wp-block-button__link,
.cmplz-cookiebanner .cmplz-buttons button.cmplz-btn{
  font-size: 85%;
  font-weight: 500;
  margin-top: .5rem;
  text-transform: uppercase;
  font-weight: 700;
  color: inherit;
  text-align: left;
  padding: 0;
  border-width: 0 !important;
  width: fit-content;
}
.wp-block-button__link{
  background-color: transparent;
  padding: 0;
}
body .btn:hover,
body .btn:active,
body .btn:focus,
.wp-block-button__link:hover,
.wp-block-button__link:active,
.wp-block-button__link:focus,
body :not(.btn-check)+.btn:active,
body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:focus,
body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:active,
body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:hover{
  color: var(--cp-light-blue);
}
#metanav a,
body .btn.btn-cta,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept{
  border-radius: 7px;
  border-style: none;
  padding: 8px 16px 4px 17px;
  width: fit-content;
  background-color: var(--cp-pink);
  color: white;
}
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept{
  background-color: var(--cp-dark-blue);
}
.btn-cta a{
  color: white;
}
.btn-cta:not(.menu-item):hover a,
.btn-cta:not(.menu-item):active a,
.btn-cta:not(.menu-item):focus a,
.btn-cta.menu-item:hover,
.btn-cta.menu-item:focus,
.btn-cta.menu-item:active{
  color: white;
  background-color: var(--cp-light-blue);
}
.btn-cta:hover,
.btn-cta:active,
.btn-cta:focus,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:hover,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:active,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:focus{
  background-color: var(--cp-light-blue);
  border: none;
}
body .btn:not(.left-arr):after,
#metanav a:after,
.wp-block-button__link:after,
.cmplz-btn:after{
  content: '\002192';
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 110%;
  vertical-align: middle;
  bottom: 2px;
  position: relative;
  line-height: normal;
  margin-left: 6px;
}
body .btn.left-arr::before{
  content: '\002190';
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 110%;
  vertical-align: middle;
  bottom: 2px;
  position: relative;
  line-height: normal;
  margin-right: 6px;
}
#metanav a{
  background-color: var(--cp-light-blue);
  color: white;
}
#metanav a:active,
#metanav a:focus,
#metanav a:hover{
  background-color: var(--cp-dark-blue) !important;
  border-color: var(--cp-dark-blue) !important;
  color: white;
}
body .bg-midblue .btn:hover,
body .bg-midblue .btn:active,
body .bg-midblue .btn:focus{
  color: var(--cp-blue);
}
body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny,
body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences{
  background-color: unset;
  padding: 0;
  border: unset;
  margin-left: 1rem;
}

/* Nav */
body li:not(.btn-cta) .nav-link{
  color: var(--cp-dark-blue);
}
#metanav a{
  border-radius: 0 0 7px 7px;
  margin-top: 0;
  padding-top: 11px;
  padding-bottom: 7px;
  font-size: .85rem;
}
body #mainnav .nav-item:not(.btn-cta) a:hover,
body #mainnav .nav-item:not(.btn-cta) a:focus,
body #mainnav .nav-item:not(.btn-cta) a:active,
body #mainnav .nav-item:not(.btn-cta) li.active a
.cmplz-btn.cmplz-accept:hover{
  color: var(--cp-light-blue);
  border: none;
}
header .nav-item{
  margin-left: 1rem;
}
.navbar-brand img{
  width: 100%;
  max-height: 2.5rem;
}
#mainnav li{
  display: flex;
  align-items: center;
}
#mainnav a{
  padding-top: 0;
  padding-bottom: 0;
  font-size: .85rem;
}
#mainnav a:hover{
  color: unset;
}
.navbar-collapse{
  background-color: var(--cp-dark-blue);
  padding: 2rem 1rem;
}
.navbar-collapse li:not(:last-of-type){
  margin-bottom: 1.5rem;
}
.navbar .btn-cta a{
  padding: 3px 0 !important;
}
ul.page-numbers{
  display: flex;
  list-style: none;
  justify-content: center;
}
.page-numbers li{
  margin-left: .5rem;
  margin-right: .5rem;
}
@media (max-width: 991px) {
  #menu-menu-principal a{
    color: white;
  }
}
@media (min-width: 992px) {
  header .btn-cta{
    margin-left: 2rem;
  }
  .navbar-brand img{
    max-height: 3.5rem;
  }
}  
/* Structure */
html body{
  background-color: var(--cp-gray);
}
.container{
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.bg-blue{
  background-color: var(--cp-blue);
  color: white;
}
.bg-midblue{
  background-color: var(--cp-light-blue);
  color: white;
}
.bg-blue a,
.bg-midblue a{
  color: white;
}
body hr{
  color: var(--cp-dark-blue);
  opacity: 1;
}
.turn-right{
  display: inline-block;
  rotate: 90deg;
}
#breadcrumbs{
  font-size: 90%;
}
#breadcrumbs a{
  color: var(--cp-dark-blue);
}
#breadcrumbs .separator{
  font-size: 80%;
}
@media (min-width: 768px) {
  .container{
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}
@media (min-width: 992px) {
  .container{
    padding-top: 8rem;
    padding-bottom: 8rem;
  }
}

/* HP */
#mainnav li:not(.btn-cta) a{
  font-weight: 700;
}
.home #mainnav a,
.home #mainnav .btn-cta a::after{
  color: white;
}
.home #hero,
#manifest{
  position: relative;
  background-image: linear-gradient(var(--cp-overlay-blue), var(--cp-overlay-blue));
  background-position: bottom;
  background-size: cover;
}
.home #hero{
  background-image: linear-gradient(
    to bottom,
    var(--cp-overlay-blue) 0%,
    var(--cp-overlay-blue) 56%,
    transparent 56%,
    transparent 58%,
    var(--cp-overlay-blue) 58%,
    var(--cp-overlay-blue) 77%,
    transparent 77%,
    transparent 79%,
    var(--cp-overlay-blue) 79%,
    var(--cp-overlay-blue) 91%,
    transparent 91%,
    transparent 93%,
    var(--cp-overlay-blue) 93%,
    var(--cp-overlay-blue) 100%
  );
  padding-bottom: 20rem;
}
.home #hero::after,
#manifest::after{
  content: "";
  position: absolute;
  inset: 0;
  background: var(--cp-bg-img) center/cover ;
  opacity: .25;
  pointer-events: none;
  filter: brightness(.58);
}
h1 span:not(:first-of-type)::before{
  content: '\A';
  white-space: pre;
}
h1 span:nth-of-type(1){
  font-size: 80%;
}
body:not(.home) h1{
  font-size: 2.75rem;
}
h1 span:nth-of-type(2){
  font-size: 160%;
  font-weight: 900;
}
.home h1{
  margin-top: 4rem;
}
#insurances{
  margin-top: -21rem;
}
#insurances .bg-midblue:hover,
#insurances a:focus .bg-midblue,
#insurances a:active .bg-midblue,
#insurances a:hover .bg-blue,
#insurances a:focus .bg-blue,
#insurances a:active .bg-blue{
  box-shadow: 0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) !important;
}
.insurance_logo img{
  width: 7rem;
  margin-bottom: 1rem;
}
#insurances .col:last-of-type div{
  background: var(--cp-bg-img) center/cover;
}
.insurance_text p{
  font-size: 150%;
  line-height: 1.25;
}
#insurances .logos img{
  margin-right: .5rem;
  margin-left: .5rem;
}
#insurances .bg-white div:last-of-type img{
  width: 11rem;
}
#confidence a:not(.btn){
  font-size: 125%;
  line-height: 1.3;
  color: var(--cp-dark-blue);
}
#confidence a:not(.btn):hover,
#confidence a:not(.btn):focus,
#confidence a:not(.btn):active{
  color: var(--cp-pink);
}
#keynb{
  font-size: 150%;
}
#keynb .fw-bold{
  font-size: 205%;
  line-height: normal;
}
#manifest h2{
  font-size: 150%;
  font-weight: 400;
  margin-bottom: 1rem;
}
#manifest p{
  font-size: 175%;
  line-height: 1.15;
}
#manifest .row:first-of-type{
  margin-bottom: 2rem;
}
#manifest .row:last-of-type{
  font-size: 125%;
}
#s_news,
#s_hiring{
  padding: 3rem 1.5rem
}
@media (min-width: 576px) {
  #insurances{
    margin-top: -20rem;
  }
  #s_news,
  #s_hiring{
    padding: 3rem 2rem
  }
}
@media (min-width: 768px) {
  #insurances{
    margin-top: -22rem;
  }
  #manifest p{
    font-size: 200%;
  }
  #insurances{
    margin-top: -23rem;
  }
}
@media (min-width: 992px) {
  .navbar-collapse{
    background-color: unset;
    padding: 0;
  }
  .navbar-collapse li:not(:last-of-type){
    margin-bottom: 0;
  }
  body:not(.home) h1{
    font-size: 2.25rem;
  }
  .home #hero{
    min-height: 56rem;
  }
  .home h1{
    margin-top: 4rem;
    margin-bottom: 6rem;
  }
  #insurances{
    margin-top: -30rem;
  }
  #insurances .bg-midblue{
    min-height: 23rem;
    background-image: url('img/couple.png');
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: contain;
  }
  #insurances .row:first-of-type .insurance_text{
    max-width: 60%;
  }
  #insurances .logos img:first-of-type{
    margin-left: 0;
  }
  #insurances .logos img:last-of-type{
    margin-right: 0;
  }
  #manifest p{
    font-size: 250%;
  }
  #manifest .row:first-of-type{
    margin-bottom: 5rem;
  }
  #confidence a:not(.btn){
    font-size: 175%;
  }
  #s_news,
  #s_hiring{
    padding-top: 6rem;
    padding-bottom: 2rem;
  }
  #s_hiring{
    background: var(--cp-light-blue) url('/wp-content/themes/tessondefroment/img/collegues.png') bottom/contain no-repeat;
    min-height: 35rem;
  }
}
@media (min-width: 1200px) {
  #insurances{
    margin-top: -30rem;
  }
}

/* Footer */
footer img{
  max-height: 3rem;
}
body footer li:not(.btn-cta) .nav-link{
  color: white;
}
footer a:hover{
  color: var(--cp-light-blue)!important;
}
footer a svg{
  width: 2rem;
}
footer ul{
  list-style: none;
  padding-left: 0;
}
#menu-pied-de-page li{
  margin-bottom: .5rem;
}
#copyright,
#copyright ul{
  font-size: .8rem;
}
#menu-copyright li{
  margin-right: 1rem;
}
@media (min-width: 992px) {
  footer img{
    max-width: 14rem;
  }
}

/* Archives */
#domains img{
  object-fit: cover;
  width: 100%;
  object-position: center;
}
#domains a{
  color: var(--cp-dark-blue);
}
#domains a:hover{
  color: var(--cp-pink);
}
#domains p{
  line-height: normal;
}

/* Blog */
article a{
  color: var(--cp-dark-blue);
}
@media (min-width: 992px) {
  .article-img{
    background: var(--cp-bg-img) center/cover no-repeat;
    aspect-ratio: 16/9;
  }
}