/* Typography CSS */
.has-small-font-size{
    font-size: 0.8rem !important
}
.has-medium-font-size{
    font-size: 1.25rem !important
}
.has-large-font-size{
    font-size: 1.65rem !important
}
.has-x-large-font-size{
    font-size: 2rem !important
}

.has-blanc-color{
    color: var(--blanc)
}
.has-noir-color{
    color: var(--noir)
}
.has-grisfonce-color{
    color: var(--grisfonce)
}
.has-grismedium-color{
    color: var(--grismedium)
}
.has-grisclair-color{
    color: var(--grisclair)
}
.has-grisplus-color{
    color: var(--grisplus)
}
.has-rouge-color{
    color: var(--rouge)
}
.has-gold-color{
    color: var(--gold)
}
.has-blanc-background-color{
    background-color: var(--blanc)
}
.has-noir-background-color{
    background-color: var(--noir)
}
.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-grisplus-background-color{
    background-color: var(--grisplus)
}
.has-rouge-background-color{
    background-color: var(--rouge)
}
.has-gold-background-color{
    background-color: var(--gold)
}
p, ul li, ol li{
    line-height: 1.65
}
h1, h2, h3, h4, h5, h6{
    font-weight: bold;
    margin:0.75em 0;
    color: var(--grisfonce);
}
.swiper-pagination{
    bottom:0;
}
.swiper-pagination-bullet{
    width:12px; height:12px;
}
.swiper-pagination-bullet-active{
    background-color: var(--rouge)
}
a.arrow{
    gap: 0 0.5rem;
}
a.arrow span.ico{
    width:40px; height:40px;
    border-radius: 50%;
    background: var(--rouge) url(../img/arrow-r-bl.svg) no-repeat center / contain
}
a.arrow:hover span.ico{
    background-color: var(--grisfonce)
}