:root {
    --la-foret-fruitiere-bg: #fff;
    --bg-verger: url(../img/pommes_2000.jpg) no-repeat fixed center top;
    --bg-verger-size: 100% auto;
    --bg-verger-color: #3f6c0c;

    background-size: var(--bg-verger-size);
}

.geologica-300,
body {
  font-family: "Geologica", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0,
    "SHRP" 0;
}
.geologica-900 {
  font-family: "Geologica", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "CRSV" 0,
    "SHRP" 0;
}

.cercle.pommes {
    aspect-ratio: 1/1;
    background: var(--bg-verger);
    background-size: var(--bg-verger-size);
    border-radius: 100%;
}
.texte-etiquette-sur-balise-inline,
/* .navbar-brand big, */
.wp-block-heading em, /* wp-block-heading dans le footer */
/* .navbar-brand small, */
p.footerContact {
    display: inline;
    white-space: wrap !important;
    font-weight: bold;

    /* Alt. #1 : Passe devant le texte :-( */
    /* text-decoration: line-through; */
    /* text-decoration-color: #fff; */
    /* text-decoration-thickness: 1.1em; */
    /* text-underline-position: under; */

    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    background-color: white;
    line-height: 2.4em;

    /* Alt. #2 : Pas vraiment testé */
    /* display: inline; */
    /* padding: 0.5em 0em; */
    /* background-color: #fff; */
    /* box-shadow: 1em 0 0 #fff, -1em 0 0 #fff; */
    /* box-decoration-break: clone; */

    /* Alt. #3 : https://stackoverflow.com/questions/14310154/how-do-i-set-a-background-color-for-the-width-of-text-not-the-width-of-the-enti */
}
/* Texte fond blanc taille #1 */

/* Texte fond blanc taille #2 */
.txt-blanc-taille-2,
.wp-block-post-template li .wp-block-post-title a,
.wp-block-buttons > .wp-block-button a,
#vsel a.vsel-read-more,
.vsel-meta div span,
.vsel-text p {
    background-color: white;
    padding: .5em;
    font-size: 18px;
    line-height: 2.2;
    font-weight: bold;

    /* rappel si oublié */
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
/* Texte fond blanc taille #3 */
.navbar-brand {
    padding-left: 5px;
}
.navbar-brand big {
    font-size: 3em;
    line-height: 1.5em;
    padding: .1em .4em;
}
.navbar-brand small {
    padding: .1em .4em;
}
.navbar-brand span.spacer {
    display: block;
    position: relative;
    width: 100%;
    height: 25px;
}
.wp-block-heading strong {
    padding: .1em .4em;
    line-height: 1.5em;
}
.wp-block-heading em /* wp-block-heading dans le footer */ {
    padding: .5em;
    line-height: .5em;
    font-size: .5em;
    font-style: normal;
}
p.footerContact {
    line-height: 1.5em;
    padding: 0 .5em;
    mix-blend-mode: screen;
}
div:has( > p.footerContact) {
    margin-bottom: 20px;
    width: 50%;
}
body { position: relative; }
div.site { position: relative; }
/* Bricolage nécéssaire pour activer les position:sticky */
div#deco {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100%;
    overflow: hidden;
}
#headerCercle {
    display: block;
    position: absolute;
    left: -10%;
    top: -60vh;
    z-index: -1;
    width: 100%;
}
#footerCercle {
    display: block;
    position: absolute;
    right: -10%;
    bottom: -60vh;
    z-index: -1;
    width: 100%;
}

/* Nom + nav : decoration */
#main-nav  {
    padding-left: 50%;
    padding-top: 20px;
}
.navbar-brand {
    margin-top: 20vh;
    margin-bottom: 0px;
    max-width: 20em;
    white-space: wrap !important;
}
.navbar-brand a {
    color: rgba(0,0,0,.5);
}

/* Nom + nav : organisation */
#main-nav > .container-fluid {
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}
#main-nav button.navbar-toggler { order: 0; }
#main-nav #navbarNavDropdown { order: 1; }
#main-nav .navbar-brand { order: 2; }


/* Menu de navigation générale */
button.navbar-toggler {
    background-color: white;
    border-color: white;
    border-radius: 0;
    aspect-ratio: 1/1;

    position: fixed;
    z-index: 100;
    top: 20px;
    left: calc(50% + 16px);
}
.navbar-toggler-icon {
    background: var(--bg-verger);
    height: 5px;
    padding: 0;
    width: 30px;
}
.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
    content: "";
    display: block;

    background: var(--bg-verger);
    background-size: cover;
    height: 5px;
    margin-top: -10px;
}
.navbar-toggler-icon::after {
    margin-top: 15px;
}
#navbarNavDropdown {
    position: absolute;
    top: 80px;

    position: fixed;
    z-index: 100;
    top: 80px;
    left: calc(50% + 16px);

    background: var(--bg-verger);
    background-size: var(--bg-verger-size);
}
.nav-link {
    background-color: white;
    padding: 7px 20px;
    margin-bottom: 3px;
}
/* Grand layout */
.entry-content {
    padding-left: 5%;
    padding-right: 5%;
}
/* Contenu de la page d'accueil' */
.home #post-6 > header .entry-title { display: none; }
.block-blanc {
    padding: 4em 10vw 2em 4em;
    background-color: white;
}
.wp-block-column > * {
}

/* La mise en avant du prochain grand événement avec VSEvent list */
#vsel {position: sticky; top: 20px;}
#vsel .vsel-content {
    position: relative;
    background-color: white;
    max-width: 70%;
    margin-left: 30%;
    padding-bottom: 0;
    border-bottom: none;

    padding: 15px;
}
.vsel-content > * > * {
    position: relative;
    z-index: 3;
}
.vsel-meta {
    position: absolute;
    text-align: right;
    right: 15px;
    top: 30px;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: flex-end;

}
.vsel-meta h3 { order: 3 }
.vsel-meta .vsel-meta-date { order: 1 }
.vsel-meta .vsel-meta-location { order: 5 }
.vsel-meta .vsel-meta-time { order:4 }

.vsel-meta h3 a {
    text-decoration: none;

    padding: .1em .4em;
    font-size: 3em;
    line-height: 1.5em;
    font-weight: 900;
}
.vsel-text {
    position: absolute;
    bottom: 20px;
    right: 15px;
    text-align: right;
}
.vsel-text p {
    display: inline;
    text-decoration: none;
}
/* L'image */
.vsel-content figure.vsel-alignright {
    margin: 0 !important;
    z-index: 1;
}
.vsel-content figure.vsel-alignright::after {
    content: "";
    display: block;
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background: var(--bg-verger);
    background-size: var(--bg-verger-size);
    mix-blend-mode: multiply;
    z-index: 0;
    opacity: .2;
}

/* La boucle de requête des articles  */
.wp-block-query {

}
.wp-block-post-template {
    display: flex;
    flex-wrap: wrap;
    max-width: 615px;
    padding-left: 5px;

    margin-top: 50px;
}
.wp-block-post-template li {
    width: 30%;
    aspect-ratio: 10/16;
    margin-right: 20px;
    position: relative;
    display: flex;
}
.wp-block-post-template li .wp-block-post-date,
.wp-block-post-template li .wp-block-post-title,
.wp-block-post-template li .wp-block-read-more  {
    position: absolute;
    left: 0;
}
.wp-block-post-template li .wp-block-post-date {
    top: 10px;
    z-index: 1;
    color: black;
    background: white;
    display: inline;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    font-weight: 600;
    font-size: .8em;
}
.wp-block-post-template li .wp-block-post-title {
    bottom: 8px;
    font-weight: 600;
    transform-origin: 0 100%;
    max-width: 90%;
    font-size: 90%;
    line-height: 2.2;
    word-wrap: normal;

}
.wp-block-post-template li .wp-block-post-title a {
    color: black;
    display: inline;
    padding: 0.2em .3em;
    line-height: 0.5em;
    word-break: keep-all;
}
.wp-block-post-template li a.wp-block-read-more {
    background-color: white;
    top: 50%;
    left: 50%;
    display: block;
    z-index: 100;

    color: black;
    font-weight: 600;
    font-size: 1.1em;
    padding: .5em .2em;
    text-align: center;

    transform: translate(-50%, -50%);

    opacity: 0;
    transition: opacity 0.3s;
}

.wp-block-post-template li:hover .wp-block-read-more {
    opacity: 1;
    transition: opacity 0.3s;
}
.wp-block-post-template li figure {
    position: relative;
    box-shadow: 0px 0px 0px 5px white;
}
.wp-block-post-template li figure::after {
    /* content: ""; */
    /* position: absolute; */
    /* display: block; */
    /* top: 0; right: 0; bottom: 0; left: 0; */
    /* background: var(--bg-verger); */
    /* background-size: var(--bg-verger-size); */
    /* opacity: .6; */
    /* transition: opacity .9s; */
    /* mix-blend-mode: screen; */
}
.wp-block-post-template li:hover figure::after {
    opacity: 0;
    transition: opacity .3s;
}
.wp-block-post-template li figure img {
    height: 100%;
}
/* Image des actualités en duotone */
.wp-block-post-template li figure img {
  filter: grayscale() brightness(120%);
}
.wp-block-post-template li figure::before,
.wp-block-post-template li figure::after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.wp-block-post-template li figure::after {
  background: #aef165;
  mix-blend-mode: multiply;
}
.wp-block-post-template li figure::before {
  background: #ac462d;
  mix-blend-mode: lighten;
    z-index: 1;
}

/* Bouton pommier */

.wp-block-buttons { position: relative; }
#vsel a.vsel-read-more::before,
.wp-block-buttons > .wp-block-button::before {
    /* Disque verger */
    content: "";
    position: absolute;
    display: block;
    z-index: -1;
    bottom: -60px;
    right: -30px;
    width: 40%;
    aspect-ratio: 1/1;
    background: var(--bg-verger);
    background-size: var(--bg-verger-size);
    border-radius: 100%;
}
#vsel a.vsel-read-more::before {
    width: 100%;
    left: -50px;
    right: -30px;
    width: auto;
}
#vsel a.vsel-read-more,
.wp-block-buttons > .wp-block-button a {
    position: relative;
    border-radius: 0;
    padding: .3em .5em;
    text-align: left;

    color: black;
    text-decoration: none;
    display: inline;
}
#vsel a.vsel-read-more {
    transform: translate(15px, 60px);
    /* Transform : juste pour sortir du contexte de z-index */
    z-index: -1;
    top: 60px;
    left: 15px;
}
#vsel a.vsel-read-more::after,
.wp-block-buttons > .wp-block-button a::after {
    /* Une flèche */
    content: "";
    display: block;
    position: absolute;
    top: 53%; bottom: 0; left: calc(100% + .5em);
    transform: scale(1);
    transform-origin: 0 50%;
    background-color: white;
    aspect-ratio: 1/1.5;
    clip-path: polygon(0 0, 100% 50%, 100% 50%, 0 100%);
}
/* Bouton dans le footer */
.wp-block-buttons.toMentionsLegales {
    position: absolute;
    right: 70%;
    bottom: 25vh;
    width: 25%;
}
.wp-block-buttons.toMentionsLegales > .wp-block-button {
    position: relative;
    text-align: right;
    display: block;
}
.wp-block-buttons.toMentionsLegales > .wp-block-button::before  {
    top: -200%;
    bottom: auto !important;
    left: -90%;
    width: 250%;
}
.wp-block-buttons.toMentionsLegales > .wp-block-button a {
}

/* Footer */
footer {

}

/* Zone de widgets dans le footer : #footer-full-content */
#wrapper-footer-full {
    margin-top: 33vh;
}
#footer-full-content .row {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
#footer-full-content .row .footer-widget.widget_block {
    margin-left: 50%;
}



#footer-full-content .row .footer-widget.widget_block#block-10 {
    /* Le widget des logos partenaires dans le footer
        #block-10
        .footerPartenaires
     */
    margin-left: 25%;
    width: 66%;
}
.footer-widget#block-10 * {
    color: white;
}
.footer-widget#block-10 .wp-block-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}
.footer-widget#block-10 .wp-block-column figure {
    display: block;
    align-content: center;
    max-height: 100px;
    max-width: 150px;
    width: auto;
    height: auto;
    margin: auto;
}
.footer-widget#block-10 .wp-block-column figure img {
    max-height: 100px;
    max-width: 100px;
    width: auto;
    height: auto;
    margin: auto;
}




#wrapper-footer-full, #wrapper-static-hero {
    background: none;
}
.site-info {
    text-align: left;
    padding-left: calc(50% + 15px);
    font-size: 10px;
    letter-spacing: 1px;
    padding-bottom: 20px;
    /* opacity: .5; */
    mix-blend-mode: screen;
}
.site-info span {
    text-transform: uppercase;
    background-color: white;
    display: inline-block;
    padding: 0 .5em;
}
.site-info a {
    color: black;
}