/* Main CSS */
[data-ratio] {display: block; max-width: 100%; position: relative}
[data-ratio]:before {content: ''; display: block;}
[data-ratio] > * {display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%;}

[data-ratio='20:9']::before { padding-top: 47.5%; }
[data-ratio='16:9']::before { padding-top: 56.25%; }
[data-ratio='4:3']::before { padding-top: 75%; }
[data-ratio='3:4']::before { padding-top: 133.33%; }
[data-ratio='1:1']::before { padding-top: 100%; }
[data-ratio='wave']::before { padding-top: 30.06%; }

.sinusoide{
    display: block;
    position: fixed;
    left: 0; top:0;
    width:100%; height: 100%;
    background: url(../img/sinusoide.svg) no-repeat center / contain;
    opacity: 0.7
}

.small-width{
    max-width:1024px;
    margin-left: auto;
    margin-right: auto;
}

.entry-content > .wp-block-post-featured-image{
    margin-top:-3rem;
}

.relative{
    position: relative;
}
.wordwrap{
    word-wrap: break-word
}
.alignfull {
    margin: 0 calc(50% - 50vw);
    max-width: 100vw;
    width: 100vw;
}
.has-background{
    padding:1rem 1.5rem
}
.alignfull.has-background {
    padding: 5vw calc(-50% - -50vw);
}
@media screen and (min-width:1200px){
    .alignwide {
        margin: 5vw calc(25% - 25vw);
    }
}
.bloc-titre-image{
    position:relative;
    background: url(../img/bottom-bloc-titre.svg) no-repeat center bottom / contain
}
.bloc-titre-image::before{
    content:"";
    display: block;
    position:absolute;
    left:50%; top:0;
    width:100%; height: 100%;
    transform: translateX(-50%);
    background:url(../img/wave-bloc-titre.svg) no-repeat top 30% center / contain
}

.wp-block-list{
    list-style: none;
    margin:2rem 0;
    padding:0;
}
.wp-block-list li{
    padding-left: 36px;
    position: relative
}
.wp-block-list li::before{
    content:"";
    align-self: center;
    display: inline-block;
    position:absolute;
    left:0; top:0;
    width:30px; height: 25px;
    background: url(../img/puce-li.svg) no-repeat center / contain;
}
.border-radius figure{
    border-radius: 1rem;
    overflow: clip;
}
@media screen and (max-width:800px){
    .wp-block-table{
        overflow-x : auto
    }
    .wp-block-table table{
        min-width:992px;
    }
}

/* .wp-block-list li > * {
    flex: 1;
} */
@media screen and (min-width:992px){
    .alignfull.has-background {
        padding: 4vw calc(-50% - -50vw);
    }
    .alignwide {
        margin: 4vw calc(25% - 25vw);
    }
}
.grey-page{
    background-color: var(--grisclair);
    padding-bottom: 3rem
}
.wrapper{
    overflow: clip;
}
.wrap-inner{
    width:90%;
    max-width:1720px;
    margin: 0 auto;
}
.wrap-inner.centre{
    width:90%;
    max-width:1024px;
    margin: 0 auto;
}
.has-bleu-background-color{
    background-color: var(--bleu)
}
.has-bleu-80-background-color{
    background-color: var(--bleu-80)
}
.has-bleulight-background-color{
    background-color: var(--bleulight)
}
.has-grisfonce-background-color{
    background-color: var(--grisfonce)
}
.has-grismedium-background-color{
    background-color: var(--grismedium)
}
.has-grisclair-background-color{
    background-color: var(--grisclair)
}
.has-blanc-background-color{
    background-color: var(--blanc)
}
.has-blanc-80-background-color{
    background-color: var(--blanc-80)
}

.has-bleu-color{
    color: var(--bleu)
}
.has-bleulight-color{
    color: var(--bleulight)
}
.has-grisfonce-color{
    color: var(--grisfonce)
}
.has-grismedium-color{
    color: var(--grismedium)
}
.has-grisclair-color{
    color: var(--grismedium)
}
.has-blanc-color{
    color: var(--blanc)
}
.has-blanc-80-color{
    color: var(--blanc-80)
}
/* .image-top{
    margin-left:-1.5rem;
    margin-right: -1.5rem
} */
.round-corner{
    border-radius: 1rem;
    overflow: clip
}
.entry-content.small-width .wp-block-post-featured-image, .entry-content.small .wp-block-post-featured-image{
    border-radius: 1rem;
    margin-left:-3rem;
    margin-right: -3rem;
    margin-bottom:3vw
}
.entry-content.small-width .wp-block-post-featured-image img, .entry-content.small .wp-block-post-featured-image img{
    border-radius: 1rem;
}
.vs img{
    width: 100%;
}
.wp-block-cover  .bloc-centre{
    max-width:640px;
    margin-left : auto;
    margin-right: auto;
    border-radius: 0.75rem
}
.wp-block-cover.rounded{
    border-radius: 0.75rem !important
}
.has-media-on-the-right .wp-block-media-text__content{
    padding-left: 0;
    padding-right: 0;
}
.wp-block-media-text__media{
    border-radius: 0.5rem;
    overflow: clip
}

.ariane{
    font-size:0.8rem;
}
.heading-page .accroche-page{
    max-width:480px;
    margin-left: auto;
    margin-right: auto;
}
.heading-page h1{
    max-width:768px;
    margin-left:auto; margin-right: auto;
}
.heading-page .gradient{
    position:absolute;
    left: 0; top: 0;
    width:100%; height: 100%;
    background: linear-gradient( to bottom, #4A7ABC 0%, var(--bleulight) 100% );
}
.heading-page .gradient.inverse{
    background: linear-gradient( to bottom, rgba(74,122,188, 0) 0%,rgba(74,122,188, .8) 100% );
}
.heading-page .bottom{
    position: absolute;
    left:0; top:calc( 100% - 1px);
    width: 100%;
    background: url(../img/after-heading-page.svg) no-repeat center top / contain;
}
.heading-page .bottom::after{
    content:"";
    display: block;
    position: absolute;
    left:50%; top:0;
    width:100%; height: 100%;
    background: url(../img/wave-page.svg) no-repeat center / contain;
    transform: translate(-50%, -65%);
}
.heading-page .liste-categ{
    margin:0; padding:0;
    list-style: none;
    gap: 1rem;
}
.heading-page .liste-categ li a{
    background-color: var(--blanc);
    border-radius: 2rem;
    padding:0.5rem 1rem
}
.heading-page .liste-categ li a:hover{
    background-color: var(--bleu);
    color: var(--blanc)
}
.heading-page .liste-categ li.current-cat a{
    background-color: var(--grisfonce);
    color: var(--bleulight)
}
.heading-page .liste-categ li a:hover{
    background-color: var(--bleu);
    color: var(--blanc)
}
.heading-page .vs{
    position: absolute;
    top:50%;
    width:20%;
    transform: translateY(-50%);
    opacity:.8
}
.heading-page .vs.full{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;
    transform: translateY(0);
}
.heading-page .vs.left{
    left:5%
}
.heading-page .vs.right{
    right:5%
}
.ariane > span{
    display: flex;
    gap: 0 0.75rem;
    justify-content: center
}
.ariane a{
    color: var(--grisfonce)
}
.ariane a:hover{
    color: var(--bleu)
}

.single .entry-content.small, .single .intro{
    max-width:1024px;
    margin: 0 auto;
}
.single article{
    background-color: var(--grisclair);
}
.single article .date{
    font-size:0.85rem; font-weight: 500
}
@media screen and (min-width: 992px){
    .wp-block-media-text .wp-block-media-text__content{
        padding: 0 0 0 10%;
    }
    .has-media-on-the-right .wp-block-media-text__content{
        padding: 0 10% 0 0;
    }
    .px-10{
        padding: 0 10%
    }
}