/* 
Noir profond — #000000
Bleu nuit — #2E4058
Sable clair — #E9E1D4
Rose blush — #D8A5A1
Vert sauge — #A6B8A0 
*/
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.white {
    color: #fff;
}

.vert_sauge {
    color: #A6B8A0;
}

.rose_blush {
    color: #D8A5A1;
}

.sable_clair {
    color: #f8f8f0;
}

.bleu_nuit {
    color: #2E4058;
}

.noir_profond {
    color: #000;
}

.bck_noir_profond {
    background-color: #000;
}

.bck_vert_sauge {
    background-color: #A6B8A0;
}

.bck_rose_blush {
    background-color: #D8A5A1;
}

.bck_sable_clair {
    background-color: #f8f8f0;
}

.bck_bleu_nuit {
    background-color: #2E4058;
}

.img-rounded {
    border-radius: 5rem;
}

.img-round {
    border-radius: 1rem;
}

html body {
    min-height: 100vh;
    background: #ecede8;
    color: #000;
    background: -moz-linear-gradient(-45deg, rgba(236, 237, 232, 1) 0, rgba(253, 253, 253, 1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(236, 237, 232, 1) 0, rgba(253, 253, 253, 1) 100%);
    background: linear-gradient(135deg, rgba(236, 237, 232, 1) 0, rgba(253, 253, 253, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ecede8', endColorstr='#fdfdfd', GradientType=1);
}

#navbar {
    transition: all .3s ease;
    opacity: 0;
    transform: translateY(-20px);
}

.container_bon_cadeau {
    background-image: url(../../src/img/fond.png) !important;
    background-size: 100vw 100vh !important;
    background-attachment: fixed !important;
}

.fb-share-button iframe {
    width: auto !important;
    height: auto !important;
}

.footer .fb-share-button {
    display: inline-block !important;
    min-width: 150px;
    min-height: 40px;
}

.btn-facebook {
    background-color: #1877F2;
    color: #ffffff !important;
    border: none;
    border-radius: 999px;
    padding: 6px 18px;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    text-decoration: none;
}

.btn-facebook i {
    font-size: 14px;
}

.btn-facebook:hover,
.btn-facebook:focus {
    background-color: #1458b8;
    color: #ffffff !important;
    text-decoration: none;
}

h2 {
    color: #D8A5A1;
    font-size: 7rem;
    text-shadow: 2px 2px 2px black;
    text-align: center;
}

h3 {
    color: #D8A5A1;
    margin: 0;
    font-size: 6rem;
    text-shadow: 2px 2px 2px black;
    text-align: center;
}

h4 {
    margin: 0;
    color: #D8A5A1;
    font-size: 4rem;
    text-shadow: 1px 1px 1px black;
    text-align: center;

}

.sous-titre {
    font-size: 2rem;
}

.site {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

.site-content {
    flex: 1;
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    border-top: none;
    padding: 2px;
}

,
.titan-title-size-2,
.titan-title-size-3 {
    font-size: 36px;
    font-weight: 900;
    text-align: center;
}

@media screen and (max-width: 767px) {
    .table-responsive {
        border: none;
    }
}

.btn,
.font-alt,
.navbar,
.work-title {
    font-family: 'Manjari', sans-serif;
}

.work-caption-col {
    text-align: center;
    position: relative;
    height: 300px;
}

.work-caption-col>h3 {
    text-align: center;
    position: relative;
    top: 150px;
    background-color: rgba(255, 255, 255, 0.8);
}

.module {
    padding-bottom: 0;
}

.navbar-brand {
    font-family: Caveat, cursive;
    padding: 5px;
}

.navbar-transparent,
.navbar-custom {
    background-color: #a87e82;

    border-bottom: 1px dotted black;

}

.dropdown.open>.dropdown-menu {
    background-color: rgba(29, 29, 29, 1);

}

.titan-title-size-3 {
    color: #CD0378;
    text-shadow: 1px 1px 1px #000;
    letter-spacing: 1px;
}

.titan-title-size-2 {
    color: #FFF;
    text-shadow: 1px 1px 1px #111;
    letter-spacing: 2px;
}

.form-control {
    color: #000 !important;
    border-radius: 5px !important;
    padding-left: 5px !important;
    border: 1px solid #d3d3d3 !important;
}

section {

    background: #ecede8;
    background: -moz-linear-gradient(-45deg, rgba(233, 225, 212, 0) 0, rgba(255, 245, 229, 1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(233, 225, 212, 0) 0, rgba(255, 245, 229, 1) 100%);
    background: linear-gradient(135deg, rgba(236, 225, 212, 0) 0, rgba(255, 245, 229, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ecede8', endColorstr='#fdfdfd', GradientType=1);
}

footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    color: white;
    text-align: center;
    z-index: 1000;
}

#boncadeausection {
    min-height: 100vh;
    position: relative;
    padding-bottom: 120px !important;
    background-image: url(../../src/img/fond_desktop.jpeg) !important;
    background-size: 100vw 100vh;
    background-attachment: fixed !important;
    background-position: initial;
    color: #000;
    font-size: 1.25em;
    padding: 10px;
}

.vh100 {
    height: 100vh;

}

.font-panier {
    color: black;
    font-size: 1.1em;
}

.border-right {
    border-right: 1px dotted saddlebrown;
}

#home p {
    display: block;
    color: #fff;
    font-size: 16px;
    padding: 0 10px;
}

.banniere {
    height: 60vh;
}

#intro {
    border-radius: 5px;
    font-size: 1.4em;
}

/* la photo avec dégradé transparent à gauche */
.btn-transparent-0 {
    border: 2px solid #2E4058 !important;
    text-shadow: 2px 2px 1px #2E4058;
}

.btn-transparent {
    border: 2px solid #2E4058 !important;

}

.btn-transparent:hover,
.btn-transparent:active {
    color: #fff4be !important;
    font-weight: bold;
    border: 2px solid #2E4058 !important;
    background-color: #a87e82;
    text-shadow: none;
}

.btn-transparent2 {
    border: 2px solid #2E4058 !important;
    padding: 0;

}

.btn-transparent2:hover,
.btn-transparent2:active {
    color: #fff4be !important;
    font-weight: bold;
    border: 2px solid #E9E1D4 !important;
    background-color: #a87e82;
    text-shadow: none;
}

.btn-bleu_nuit:hover,
.btn-bleu_nuit:active {
    color: #fff4be !important;
    font-weight: bold;
    border: 2px solid #2E4058 !important;

    background-color: #a87e82;
    text-shadow: none;
}

#second_display {
    cursor: pointer;
}

#second_display p {
    font-size: 1em;
    text-shadow: 1px 1px 1px #000;
    padding: 10px;
}

#home #intro {
    background-repeat: no-repeat;
    max-width: 600px;
    text-align: center;
    margin: auto;
}

.navbar-brand {
    font-size: 24px !important;
    letter-spacing: 1.5px !important;
    text-transform: none;
}

.navbar {
    text-shadow: 1px 1px 1px #000;
}

.navbar-custom .nav li>a,
.dropdown {
    color: #fff;
    font-weight: 600;
    text-shadow: 1px 1px 1px black;
}

.dropdown:hover {
    color: initial;
}

.dropdown-item {
    padding: 3px;
    color: white;
}

.dropdown-item-link:hover>a {
    color: red !important;
}

#login:hover,
#register:hover,
#my_account:hover,
#unlink:hover {
    color: orange;
}

.navbar-custom .dropdown-toggle:after {
    content: "";
}

.navbar-custom {
    font-size: 12px;
}

.btn-primary {
    font-weight: 600;
}

btn-d {
    background-color: rgba(0, 0, 0, 0.8);
}

.close {
    font-size: 30px;
}

.work-title {
    text-transform: none;
    font-size: 25px;
    margin-top: 10px;
    margin-right: 10px;
    margin-bottom: 6px;
    margin-left: 10px;
}

.work-caption-2 {
    padding: 0 1rem;
    font-size: 2rem;
    z-index: 1;
    margin: 0;
    bottom: 40px;
    text-align: center;
    color: #333 !important;
    /*text-shadow: 1px 1px 1px black;*/
    position: absolute;
}

.modal-a {
    font-size: 0.9em;
    color: #333;
    font-weight: bold;
    text-shadow: 2px 2px 1px white;
}

.modal-a:hover {
    color: white;
    text-shadow: 2px 2px 2px black !important;
}

.btn .navig {
    padding-bottom: 10px !important;
    padding-bottom: 20px;
}

.work-item:hover img,
.work-item-bis:hover img,
.work-item-ter:hover img {
    filter: saturate(80%) blur(10px) brightness(1.2) opacity(40%);

}

.work-item:hover,
.work-item-bis:hover,
.work-item-ter:hover {
    cursor: pointer;
}

.work-item:hover .work-caption>span,
.work-item-bis:hover .work-caption-bis>span,
.work-item-ter:hover .work-caption-ter>span {

    font-size: 2.2rem !important;
    font-weight: bold;
    color: black;
}

.modal-title {
    font-size: 2rem;
    font-weight: 600;
    color: #2d2419;
    text-shadow: 1px 1px 0 #FFF !important;
}

.soin-titre {
    font-size: 2rem !important;
}

.modal-soin-titre {
    font-size: 2.5rem;
    margin-bottom: 0;
    padding-bottom: 0;
    color: black;
    font-weight: bold;
}

.modal-body.massages {
    color: #111;
    font-weight: 700;
    font-size: 17px !important;
}

#mentionslegales,
#rgpd_alert {
    color: #000;
    font-size: 1.2em;
    line-height: 1.15em;
    font-weight: 500;
}

a:hover,
a.active {
    color: white;
    text-shadow: 1px 1px 2px black !important;
}

#resultfirstpage {
    font-size: 1em;
}

.sans-serif {
    font-family: "Lato", sans-serif;
    font-size: 1.4rem;
}

.navig {
    margin-bottom: 10px;
}

.post {
    font-size: 17px !important;
    line-height: 18px !important;
    font-weight: 400;
    margin-bottom: 0 !important;
}

.post-thumbnail img {
    margin: auto !important;
    display: block;
}

.type_cadeau {
    font-weight: 700 !important;
    text-transform: uppercase;
    color: #000;
}

.modal-body.massages p {
    text-align: justify;
}

.modal-body.mandala p,
.modal-body.mandala ul {
    color: #222;
    font-size: 18px !important;
    line-height: 19px;
    font-weight: 600 !important;
}

.fort,
.modal-body.mandala ul {
    color: #000 !important;
    font-weight: 700 !important;
}

.tabul {
    padding-left: 40px !important;
}

.modal-body.tarifs {
    text-align: right !important;
}

.text-presentation {
    font-size: 17px;
    /*text-align: justify;*/
    line-height: 26px;
    /*    margin: 10px 30px;*/
    letter-spacing: .25pt;
    color: #444;
    font-weight: 500;
    text-shadow: 1px 1px 2px #fff;
}

.callout-title,
.post-more,
.titre_contact {
    font-weight: 600;
}



.alex {
    margin-bottom: 80px;
}

.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.navbar-brand :hover a,
.navbar-custom .nav :hover a {
    color: rgba(148, 213, 49, 1);
}

.dropdown:hover .far,
.dropdown:hover .fas,
.dropdown:hover .fa {
    color: rgba(148, 213, 49, 1);
}


.dropdown-menu>.dropdown-item a:hover {
    color: red;
}

a:hover .dropdown-item {
    color: red !important;
}

.callout-text,
.callout-title {
    color: #422D23 !important;
    text-shadow: 1px 1px 2px #EEB185 !important;
}




.bg-dark {
    background-color: #000;
}

.post-entry {
    font-size: 1.6rem !important;
}


.post-more {
    font-size: 0.7em;
}

.champs_obligatoires {
    font-size: 0.8em;
    color: red;
}

#submitContactForm {
    margin-bottom: 50px;
}

.titre_contact {
    padding: 30px 0 !important;
    color: #000 !important;
    font-size: 27px !important;
    letter-spacing: 1.5px !important;
    text-transform: none;
    font-family: Caveat, cursive;
    text-shadow: 1px 1px 0 #EEE;
}

.map {
    padding: 5px 0;
}


#contact .row {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.modal-body.module-subtitle {
    margin-bottom: 10px !important;
}

.modal-body.row {
    font-size: 15px;
}

.btn-danger,
.btn-primary,
.btn-success,
.btn-warning {
    color: #000;
    font-weight: 400;
    font-optical-sizing: auto;
    font-style: normal;

}

.btn-primary:hover {
    background: -webkit-linear-gradient(top, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    background: linear-gradient(to bottom, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);

}

.btn-danger {
    background: #f3c5bd;
    /*padding-bottom:20px;*/
    background: -moz-linear-gradient(top, rgba(243, 197, 189, 1) 0, rgba(232, 108, 87, 1) 50%, rgba(199, 34, 0, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(243, 197, 189, 1) 0, rgba(232, 108, 87, 1) 50%, rgba(199, 34, 0, 1) 100%);
    background: linear-gradient(to bottom, rgba(243, 197, 189, 1) 0, rgba(232, 108, 87, 1) 50%, rgba(199, 34, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c5bd', endColorstr='#c72200', GradientType=0);
}

.btn-success {
    background: #a9db80;
    /*padding-bottom:20px;*/
    background: -moz-linear-gradient(top, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    background: linear-gradient(to bottom, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a9db80', endColorstr='#96c56f', GradientType=0);
}

.btn {
    border-radius: 5px;
    font-size: 1.1em;
}

.btn-round {
    border-radius: 100px !important;
}

.btn-primary {
    background: #E9E1D4;
}

.form-group {
    padding: 10px 0;
}

#libellemontantlibre {
    padding-top: 13px;
}

.font-serif {
    font-style: normal;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 1.2em;
}

.font-script {
    font-family: 'Bad Script', cursive;
}

.badge {
    margin-top: -7px;
    color: #000;
    background: -moz-linear-gradient(top, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    background: linear-gradient(to bottom, rgba(169, 219, 128, 1) 0, rgba(150, 197, 111, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a9db80', endColorstr='#96c56f', GradientType=0);
}

.form-control {
    text-transform: none !important;
    font-size: 15px !important;
    margin-bottom: 5px;
}

.module-small.bg-dark {
    padding: 10px 0 !important;
}

.miseenformemail {
    color: #000;
    font-weight: 700;
}

.footer {
    font-size: 14px;
    line-height: 20px;
    border-top: 1px solid black;
    background-color: #a87e82;

    color: white;
}

.footer a {
    color: white !important;
}

.article {
    margin-left: 20px !important;
    margin-right: 20px !important;
}

.font-weight-bold {
    font-weight: 700 !important;
}

.fond-formulaire {
    background: -moz-linear-gradient(top, rgba(127, 127, 127, .6) 0, rgba(128, 128, 128, .6) 1%, rgba(178, 178, 178, .6) 100%);
    background: -webkit-linear-gradient(top, rgba(127, 127, 127, .6) 0, rgba(128, 128, 128, .6) 1%, rgba(178, 178, 178, .6) 100%);
    background: linear-gradient(to bottom, rgba(127, 127, 127, .6) 0, rgba(128, 128, 128, .6) 1%, rgba(178, 178, 178, .6) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc7f7f7f', endColorstr='#ccb2b2b2', GradientType=0);
    color: #000 !important;
    border-radius: 10px !important;
    margin: 0;
    padding: 10px !important;
}

.btn_green.active {
    background-color: #204d74;
}

.img-rounded {
    opacity: 1 !important;
    filter: none !important;
}

.titan-caption,
.titan-caption img {
    opacity: 1 !important;
}

#scroll-up {
    position: fixed;
    right: 15px;
    bottom: 20px;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.3s ease;
}

#scroll-up a {
    display: inline-block;
    background: #2E4058;
    /* bleu nuit */
    color: #fff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    text-decoration: none;
    font-size: 20px;
    padding-top: 10px;
}

nav a.section-scroll {
    color: white !important;
}

.image_title {
    width: 150px;

}

/* Ligne des 2 boutons + ellipse */
.align-bas {
    position: relative;
    /* pour positionner l’ellipse par rapport à la ligne */
    overflow: visible;
    /* on laisse dépasser l’ellipse vers le haut */
}

/* Les colonnes restent des colonnes Bootstrap */
.align-bas>[class*="col-"] {
    text-align: center;
    /* boutons centrés dans leurs colonnes */
}

/* L’ellipse du soin signature : on la place en absolu, en bas à droite */
.align-bas .soin-signature-img {
    position: absolute;
    right: 2vw;
    /* ajuste si tu veux plus à gauche/droite */
    bottom: -10vh;
    /* valeur négative pour qu’elle remonte sur la phrase */
    width: 18vw;
    /* optionnel : taille relative à la largeur écran */
    max-width: 320px;
    /* sécurité pour très grands écrans */
    height: auto;
    z-index: 10;
    margin: 0;
    /* on enlève toute marge parasite */
}


label.required::after {
    color: rgb(255, 50, 50);
    content: " *";
}

label {
    margin-bottom: 0px;
}




.g-recaptcha>div {
    margin: auto !important;
    margin-bottom: 10px !important;
}

#phraseInspirante {
    width: 100vw;
    /* Permalink - use to edit and share this gradient. Permalien - à utiliser pour éditer et partager ce gradient: https://colorzilla.com/gradient-editor/#e9e1d4+0,e9e1d4+100&1+0,0+100 */
    background: linear-gradient(to right, rgba(216, 165, 161, 1) 0%, rgba(216, 165, 161, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

.table-panier {
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid black;
    border-radius: 3px;
}

.table-panier th {
    padding: 10px;
}

.table-panier thead tr th {
    border: 1px dotted #999;
}

.table-panier td {
    padding: 8x;
    border: 1px dotted #999;
}

.table-panier tfoot tr th {
    border: 1px dotted #999;
}

.pl-0 {
    padding-left: 0 !important;
}

.pr-0 {
    padding-right: 0 !important;
}

.modalBg:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    filter: saturate(40%) opacity(100%);
}

section:not(.home-section) {
    padding-top: 10rem;
}

#home {
    padding-top: 0rem !important;
}

/********************* MEDIA QUERIES **********************/
@media screen and (min-width: 992px) {

    /* DESKTOP */
    .d-lg-block-inline {
        display: inline;
    }


}

@media screen and (max-width: 992px) {

    /* SECTION MOBILE + TABLETTES */
    .d-md-none {
        display: none;
    }

    #home {
        padding: 0;
        background-image: url(../../src/img/fond_mobile.png) !important;
        background-size: 100vw 100vh;
        background-attachment: fixed !important;
        background-position: initial;
        margin: 0;
        height: 100vh !important;
    }


    #home2 {
        padding: 0;
        background-image: url(../../src/img/fond_mobile.png) !important;
        background-size: 100vw 100vh;
        background-attachment: fixed !important;
        background-position: initial;
        margin: 0;
        height: 88vh !important;
    }

    #home2>.titan-caption {
        top: -20vh;

    }

    /* Header fixé en haut */
    .topbar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 60px;
        /* adapte à ta navbar réelle */
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        z-index: 1000;
    }

    .page-content {
        height: 100vh;
        /* ou 100svh */
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        /* pour le scroll fluide iOS */
    }

    /* Footer fixé en bas */
    .bottombar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 30px;
        /* adapte à ton footer */
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px 0px;
        z-index: 1000;
    }

    .pt-5 {
        padding-top: 5px;
    }

    .pb-5 {
        padding-bottom: 5px;
    }

    .pl-5 {
        padding-left: 5px;
    }

    .pr-5 {
        padding-right: 5px;
    }

    footer>.sans-serif {
        font-size: 1rem !important;
        line-height: 0.9rem;
    }

    .banniere {
        height: unset;
    }

    section {
        padding-top: 6.5rem !important;
    }

    /* Zone centrale qui scrolle entre les deux */
    .page-content {
        position: relative;
        box-sizing: border-box;
        /* On laisse la place du header et du footer */
        /* padding-top: 60px; */
        /* même valeur que .topbar height */
        padding-bottom: 60px;
        /* même valeur que .bottombar height */
        height: 100vh;
        /* hauteur écran */
        overflow-y: auto;
        /* scroll uniquement ici */
        -webkit-overflow-scrolling: touch;
        /* scroll fluide iOS */
        background: #E9E1D4;
        /* Sable clair par ex */
    }

    #alexandratainon>h2 {
        text-shadow: none;
        margin-top: -40px;
    }

    h2 {
        font-size: 4rem;
        text-shadow: 1px 1px 1px black;
    }

    #phraseInspirante {
        width: 100vw;
        /* Permalink - use to edit and share this gradient. Permalien - à utiliser pour éditer et partager ce gradient: https://colorzilla.com/gradient-editor/#e9e1d4+0,e9e1d4+100&1+0,0+100 */
        background: linear-gradient(to right, rgba(216, 165, 161, 1) 0%, rgba(216, 165, 161, 0) 100%);
        /* background-color: rgb(233, 225, 212, 1); */
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }

    .sous-titre {
        font-size: 1.5rem;

    }


    .works-grid {
        padding: 0;
        margin: 0;
    }

    .works-grid .work-item {
        position: relative;
        overflow: hidden;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent;
    }

    /* Conteneur de l'image */
    .works-grid .work-image {
        position: relative;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
    }

    /* L'image elle-même : collée en haut, sans marge */
    .works-grid .work-image img {
        display: block;
        width: 100%;
        height: auto;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        transition: filter .3s ease, transform .3s ease;
    }

    /* Voile sur toute la vignette */
    .works-grid .work-item::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.45);
        z-index: 1;
        pointer-events: none;
        transition: background .3s ease;
    }

    /* Texte centré */
    .works-grid .work-caption {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0 !important;
        padding: 0 !important;
        background: none !important;

        text-align: center;
        color: #000;
        font-weight: 400;
        z-index: 2;
        pointer-events: none;
    }

    /* Survol : flou + voile renforcé + texte en gras */
    .works-grid .work-item:hover .work-image img {
        filter: blur(3px);
        transform: scale(1.02);
    }

    .works-grid .work-item:hover::before {
        background: rgba(255, 255, 255, 0.6);
    }

}