@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap");

/* ===== Règles fonctionnelles conservées de l'ancien thème ===== */
.block
{
 display: block;
}
.left
{
 text-align: left;
}
.right
{
 text-align: right;
}
.middle
{
 display: flex !important;
 align-items: center !important;
}
.pull-right
{
 float: right;
}
.middle.center
{
 justify-content: center;
}
.disable
{
 color: #BDBDBD;
}
li.middle
{
 display: inline-flex !important;
 vertical-align: middle;
}
.ok
{
 color: #1ABA16;
}
.nok
{
 color: #BA1616;
}
.clear
{
 clear: both;
}
.absolute
{
 position: absolute !important;
 top: 0;
 height: 100%;
}
.absolute.right
{
 right: 0;
 width: 50%;
}
.absolute.left
{
 left: 0;
 width: 50%;
}
.row
{
 margin: 0 -10px;
 padding: 0;
 font-size: 0;
 list-style: none;
}
.row.no-auto-width
{
 display: inline-block;
}
.row > *
{
 display: inline-block;
 margin: 0;
 padding: 0 10px;
 font-size: 15px;
 vertical-align: top;
}
.row > .col-1
{
 width: 8.333333%;
}
.row > .col-2
{
 width: 16.666667%;
}
.row > .col-3
{
 width: 25%;
}
.row > .col-4
{
 width: 33.33%;
}
.row > .col-5
{
 width: 41.666667%;
}
.row > .col-6
{
 width: 50%;
}
.row > .col-7
{
 width: 58.333333%;
}
.row > .col-8
{
 width: 66.66%;
}
.row > .col-9
{
 width: 75%;
}
.row > .col-10
{
 width: 83.333333%;
}
.row > .col-11
{
 width: 91.666667%;
}
.row > .col-12
{
 width: 100%;
}
.acordeon > li > div:first-child+div
{
 display: none;
}
.acordeon > li > div:first-child > i:first-child:before
{
 content: "\f067";
}
.acordeon > li > div:first-child > i
{
 padding: 5px 7px;
 background-color: #fff;
 color: #f3f2f3;
 border-radius: 5px;
}
.acordeon > li.select > div:first-child > i
{
 padding: 5px 7px;
 background-color: #f3f2f3;
 color: #fff;
 border-radius: 5px;
}
.acordeon > li.select > div:first-child+div
{
 display: block;
}
.acordeon > li.select > div:first-child > i:first-child:before
{
 content: "\f068";
}
#captchagc,
#captchagc *
{
 box-sizing: border-box;
 outline: none;
}
#captchagc
{
 position: relative;
 background-color: #E7E7E7;
 border: 1px solid #D6D6D6;
 width: 250px;
 height: 70px;
 overflow: hidden;
 margin: 10px auto;
}
#captchagc > img:nth-of-type(1)
{
 position: absolute;
 top: 18px;
 left: 18px;
 width: 34px;
 height: 34px;
 z-index: 2;
 margin: 0 !important;
}
#captchagc > img:nth-of-type(2)
{
 position: absolute;
 top: 40px;
 left: 25px;
 width: 25px;
 height: 25px;
 z-index: 3;
 margin: 0 !important;
 animation: 3s ease-out 1s infinite running captchagc;
}
/* Captcha centré (devis, demande de rappel, avis) */
#captchagc { margin: 14px auto; display: block; }
#captchagc { margin-left: auto !important; margin-right: auto !important; }
li.double.center, li.double.center > label { text-align: center; }
li.double.center > label { display: block; }

/* Pop-up « Demande de rappel » */
body.popup { padding: 22px 28px 28px; background: #f3f3f0 !important; overflow-x: hidden; }
body.popup h1 { margin: 6px 0 14px; font-size: 30px; text-align: center; }
body.popup fieldset > ul > li { display: block; width: 100%; }
@keyframes captchagc
{
 0%
 {
 left: 25px;
 }
 25%
 {
 left: 25px;
 }
 50%
 {
 left: 210px;
 }
 100%
 {
 left: 210px;
 }
}
#captchagc > img:nth-of-type(1)+div
{
 position: absolute;
 top: 14px;
 right: 14px;
 border: 1px solid #535353;
 border-radius: 4px;
 width: 41px;
 height: 40px;
 background-color: #FFF;
 z-index: 1;
}
#captchagc > img:nth-of-type(1)+div.accept
{
 border: 1px solid #F3990C;
}
#captchagc > img:nth-of-type(1)+div.hover
{
 border: 1px solid #1CD129;
}
#captchagc:before
{
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 content: " > > > > > > > > ";
 font-family: 'Open sans', sans-serif;
 font-size: 17px;
}
#captchagc.valid:after
{
 position: absolute;
 left: 0;
 top: 0;
 right: 0;
 bottom: 0;
 content: "";
 background-color: rgba(255, 255, 255, 0.9);
 z-index: 3;
}
#captchagc > i
{
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translate(-50%, -50%);
 z-index: 4;
 opacity: 0;
 transition: ease-in-out 200ms opacity, ease-in-out 200ms left;
}
#captchagc.valid > i:nth-of-type(1)
{
 opacity: 1;
 left: 17%;
}
#captchagc > i:nth-of-type(1):before
{
 content: "\f00c";
 font-family: "Font Awesome 6 Pro";
 font-weight: 900;
 padding: 5px;
 color: #12D954;
 font-size: 30px;
 width: 30px;
 height: 30px;
 line-height: 30px;
 border-radius: 100%;
 background-color: #FFF;
 border: 2px solid #12D954;
}
#captchagc > i:nth-of-type(2)
{
 position: absolute;
 top: 23px;
 left: 113px;
 z-index: 5;
 font-size: 25px;
 opacity: 1;
}
#captchagc.valid > img:nth-of-type(1)
{
 top: 18px !important;
 left: 197px !important;
}
#captchagc.valid > img:nth-of-type(2)
{
 display: none;
}
.file-btn {
 position: relative;
 overflow: hidden;
}
.file-btn input[type="file"] {
 position: absolute;
 inset: 0;
 opacity: 0;
 cursor: pointer;
}
fieldset
{
 margin: 0;
 padding: 0;
 border: 0;
}
fieldset > legend
{
 text-align: center;
 font-size: 16px;
 font-weight: bold;
}
fieldset > ul,
fieldset > .contenu > ul
{
 margin: 0;
 padding: 0;
 font-size: 0;
 list-style: none;
}
fieldset > ul > li,
fieldset > .contenu > ul > li
{
 display: inline-block;
 width: 50%;
 margin: 0;
 padding: 0;
 font-size: 14px;
 vertical-align: middle;
}
fieldset > ul > li .row
{
 margin: 0;
}
fieldset > ul > li .row > *
{
 padding: 0;
}
fieldset > ul > li .input,
fieldset > .contenu > ul > li .input
{
 display: block;
 width: 100%;
 padding: 5px;
 text-align: left;
 font-size: 0;
}
fieldset > ul > li .input > label,
fieldset > .contenu > ul > li .input > label
{
 display: block;
 font-weight: 400;
 font-size: 16px;
 padding: 3px 0;
}
fieldset > ul > li .input > div > *,
fieldset > .contenu > ul > li .input > div > *
{
 font-size: 14px;
}
fieldset > ul > li .input > div > input,
fieldset > ul > li .input > div > select,
fieldset > ul > li .input > div > textarea,
fieldset > .contenu > ul > li .input > div > input,
fieldset > .contenu > ul > li .input > div > select,
fieldset > .contenu > ul > li .input > div > textarea
{
 display: inline-block;
 width: 100%;
 font-size: 14px;
}
fieldset > ul > li.double,
fieldset > .contenu > ul > li.double
{
 width: 100%;
}
.products-container {
 text-align: -webkit-center;
 margin: 20px 0;
}
.products-list {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 margin-bottom: 10px;
}
.product-block {
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 margin: 10px;
 border: 1px solid #ccc;
 border-radius: 5px;
 text-align: center;
 transition: all 0.3s;
 height: 300px;
 text-decoration: none;
 overflow: hidden;
}
.products-list .product-block {
 width: 350px;
}
.product-block .product-image {
 width: 100%;
 max-width: unset;
 height: 75%;
 overflow: hidden;
 display: flex;
 align-items: center;
 justify-content: center;
}
.product-block .product-image img {
 min-width: 100%;
 object-fit: cover;
 transition: all ease 0.2s;
}
.product-block:hover .product-image img {
 transform: scale(1.1);
}
.product-block .price {
 font-size: 18px;
 margin-top: 10px;
}
.old-price {
 text-decoration: line-through;
 color: #888;
 margin-right: 5px;
 font-size: 12px;
}
.promo-price {
 color: #e60000;
 font-weight: bold;
}
.product-page {
 display: flex;
 margin-bottom: 30px;
 justify-content: space-between;
}
.product-page .price {
 font-size: 40px;
 margin: 10px 0 0 0;
}
.product-page .caracteristics {
 box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.2);
 border-radius: 10px;
 font-size: 18px;
 display: flex;
 flex-direction: column;
 height: fit-content;
 padding: 20px 0;
}
.product-page .caracteristics > div {
 display: flex;
 flex-direction: column;
 align-items: center;
 padding: 0 20px;
 justify-content: center;
}
.product-page .caracteristics p {
 margin: 5px 0;
}
.product-description {
 font-size: 16px;
 margin-top: 20px;
}
.filter-selector {
 text-align: center;
 font-size: 14px;
 font-weight: bold;
}
.product-page form button[type='submit'] {
 padding: 10px 30px!important;
}
.caracteristics .btn-plus,
.caracteristics .btn-minus {
 width: 35px;
 height: 35px;
 padding: 0;
}
.caracteristics .quantity-input {
 width: 55px;
}
.badge
{
 margin: 1px;
 display: inline-block;
 padding: 3px 10px;
 border-radius: 3px;
 background-color: #727272;
 color: #FFF;
 font-size: 12px;
}
.badge.validation
{
 background-color: #37bc9b;
}
.badge.information
{
 background-color: #5D9CEC;
}
.badge.erreur
{
 background-color: #F05050;
}
.badge.alert
{
 background-color: #e1a119;
}
.badge.autre
{
 background-color: #7237BC;
}
.badge.small
{
 padding: 0px 5px;
 font-size: 11px;
}
.success-message
{
 text-align: center;
 position: fixed;
 top: 0;
 right: 0;
 margin: 10px;
 background-color: #4CAF50;
 color: white;
 padding: 15px 20px;
 border-radius: 5px;
 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
 font-size: 16px;
 z-index: 1000;
 opacity: 0;
 transform: translateY(-20px);
 transition: opacity 0.5s ease, transform 0.5s ease;
 max-width: calc(100% - 20px);
}
.success-message.show
{
 opacity: 1;
 transform: translateY(0);
}
.product-image
{
 width: fit-content;
 max-width: 50%;
}
.product-image-main .slick-slide a
{
 position: relative;
 display: block;
 padding-top: 80%;
 width: 100%;
 max-width: 100%;
 cursor: zoom-in;
}
.product-image-main .slick-slide img
{
 position: absolute;
 top: 0;
 left: 0;
 width: 100%!important;
 height: 100%!important;
 object-fit: scale-down;
 vertical-align: middle;
 margin: 0 auto;
 max-width: initial;
 max-height: initial;
}
.product-image-thumb .slick-slide:not(.slick-current)
{
 opacity: .5;
}
.product-image-thumb .slick-slide img
{
 width: 100px!important;
 max-width: 100%;
 height: 100px!important;
 object-fit: scale-down;
 vertical-align: middle;
 margin: 0 auto;
}
.cart-container {
 max-width: 1200px;
 margin: 30px auto;
 display: flex;
 justify-content: space-between;
 align-items: flex-start;
 gap: 20px;
}
#cart-content
{
 width: 100%;
}
.empty-cart {
 text-align: center;
 font-size: 18px;
 color: #666;
}
.cart-items {
 background-color: #fff;
 padding: 20px;
 border-radius: 8px;
 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.cart-item {
 display: flex;
 justify-content: space-between;
 padding: 5px 0; 
 align-items: center;
}
.cart-item:not(:last-child) {
 border-bottom: 1px solid #ddd;
}
.cart-product-info {
 width: 50%;
 align-content: center;
 text-decoration: none;
}
.cart-product-name {
 font-size: 16px;
 font-weight: bold;
}
.cart-product-model {
 font-size: 14px;
 color: #666;
}
.cart-product-numbers {
 display: flex;
 justify-content: space-around;
 flex-direction: row;
}
.quantity-selector {
 display: flex;
 flex-direction: row;
 align-items: center;
 justify-content: center;
}
.quantity-selector input {
 margin: 1px;
 text-align: center;
 border: 0;
 background-color: transparent;
 width: 55px;
}
.quantity-selector .bouton {
 margin: 1px;
 padding: 8px 15px 7px 15px;
}
.cart-product-price, 
.cart-product-total,
.cart-product-quantity {
 width: 20%;
 text-align: center;
 font-size: 16px;
 color: #333;
 align-self: center;
}
.cart-remove {
 width: 5%;
 text-align: center;
}
.remove-button {
 background-color: transparent;
 border: none;
 color: #e74c3c;
 font-size: 18px;
 cursor: pointer;
}
.remove-button:hover {
 color: #c0392b;
}
.cart-summary {
 width: 30%;
 min-width: 350px;
 background-color: #fff;
 padding: 20px;
 border-radius: 8px;
 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
 position: sticky;
 top: 152px;
}
.cart-summary h2
{
 padding: 0 0 4px; 
 border-bottom: 1px solid #ddd;
 margin-bottom: 10px;
}
.summary-detail {
 display: flex;
 justify-content: space-between;
 margin-bottom: 10px;
 font-size: 16px;
 color: #666;
}
.summary-total {
 display: flex;
 justify-content: space-between;
 font-size: 18px;
 font-weight: bold;
 color: #333;
 margin-top: 20px;
 padding: 5px 0 0;
 border-top: 1px solid #ddd;
}
#buttons-container {
 display: flex;
 align-content: center;
 align-items: center;
 justify-content: center;
}
.pay-button,
.pay-button:active {
 display: block;
 width: 100%;
 text-align: center;
 padding: 15px;
 font-size: 16px;
 cursor: pointer;
 margin: 20px 0 0;
 text-decoration: none;
}
.tva-small {
 font-size: 0.9em;
 margin-left: 15px;
 margin-bottom: 5px;
}
.cart-product-quantity input[type='number'] {
 width: 50px;
}
.delivery-box {
 max-width: 100%;
 width: 60%;
 background-color: #fff;
 padding: 20px;
 border-radius: 8px;
 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
 display: none;
}
.delivery-box h2
{
 padding: 0 0 4px;
 border-bottom: 1px solid #ddd;
 margin-bottom: 10px;
}
.delivery-form {
 display: grid;
 grid-template-columns: 0.5fr 1fr;
 gap: 20px;
 margin: 20px 0;
}
.delivery-form label {
 font-size: 16px;
 color: #666;
 margin-bottom: 5px;
 align-self: center;
}
.delivery-form input[type="text"],
.delivery-form input[type="tel"],
.delivery-form input[type="email"] {
 width: 100%;
 padding: 10px;
 border: 1px solid #ddd;
 border-radius: 5px;
 font-size: 16px;
 box-sizing: border-box;
}
.delivery-form .full-width {
 grid-column: span 2;
}
.delivery-box .button,
.delivery-box .button:active {
 text-align: center;
 padding: 15px 25px;
 font-size: 16px;
 cursor: pointer;
 margin: 20px 0 0;
 text-decoration: none;
}
.delivery-form input.error {
 border-color: #e74c3c;
}
.notification
{
 margin: 10px;
 padding: 10px 20px;
 border-radius: 3px;
 text-align: left;
 color: #FFF;
}
.notification.small
{
 margin: 0;
}
.notification:before
{
 display: inline-block;
 margin: 0 10px 0 0;
 font-family: "Font Awesome 5 Pro";
 font-size: 18px;
 vertical-align: middle;
 text-rendering: auto;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
.notification > span
{
 display: inline-block;
 width: calc(100% - 40px);
 vertical-align: middle;
}
.notification.closable:after
{
 content: "\f00d";
 position: absolute;
 top: 50%;
 right: 0;
 margin: 0 10px 0 0;
 font-family: "Font Awesome 5 Pro";
 font-size: 18px;
 vertical-align: middle;
 transform: translateY(-50%);
 cursor: pointer;
 text-rendering: auto;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
.notification.absolute
{
 position: absolute;
 top: 0;
 right: 0;
 left: 0;
}
.notification.validation,
.button.validation
{
 background-color: #37bc9b;
}
.notification.validation:before
{
 content: "\f00c";
}
.notification.information,
.button.information
{
 background-color: #5D9CEC;
}
.notification.information:before
{
 content: "\f05a";
}
.notification.erreur,
.button.erreur
{
 background-color: #F05050;
}
.notification.erreur:before
{
 content: "\f06a";
}
.notification.alert,
.button.alert
{
 background-color: #f0bd50;
}
.notification.alert:before
{
 content: "\f071";
}
.notification.disable,
.button.disable
{
 background-color: #A2A2A2;
}
iframe div
{
 padding: 206px !important;
}
.container[data-ancre='contact']
{
 overflow-x: hidden;
}
#content .contenu-accroche img,
#content .contenu-texte img,
#content .contenu-article img,
#content .contenu-conclusion img
{
 margin: 5px;
}
#content .contenu-accroche img[align='left'],
#content .contenu-texte img[align='left'],
#content .contenu-article img[align='left'],
#content .contenu-conclusion img[align='left']
{
 margin: 5px 20px 5px 0;
}
#content .contenu-accroche img[align='right'],
#content .contenu-texte img[align='right'],
#content .contenu-article img[align='right'],
#content .contenu-conclusion img[align='right']
{
 margin: 5px 0 5px 20px;
}
#content .contenu-accroche img[align='absmiddle'],
#content .contenu-texte img[align='absmiddle'],
#content .contenu-article img[align='absmiddle'],
#content .contenu-conclusion img[align='absmiddle']
{
 margin: 5px;
}
#content .sous_pages
{
 margin: 0;
 padding: 0;
 text-align: center;
}
#content .sous_pages > li
{
 display: inline-block;
 width: 48%;
 margin: 1%;
 padding: 0;
 list-style: none;
}
#content .sous_pages > li > a
{
 display: inline-block;
 width: 100%;
 padding: 30px 0;
 border-radius: 5px;
 text-decoration: none;
 text-transform: uppercase;
 color: #fff;
 background-color: var(--red);
}
#content .sous_pages > li > a:hover
{
 background-color: #858585;
}
.contenu-article
{
 margin: 25px 0 0;
}
.contenu-article.hero+.contenu-article.hero
{
 margin: 0;
}
.contenu-article.hero > div:not(.clear)
{
 padding: 10px;
}
.contenu-article.hero.image
{
 min-height: 450px;
 background-repeat: no-repeat;
 background-size: cover;
 background-position: 50% 0%;
 background-attachment: fixed;
}
.contenu-article > div
{
 margin: 0 auto;
}
.contenu-article > div > div
{
 max-width: 1200px;
 margin: 0 auto;
 overflow: hidden;
}
.contenu-article:not(.image) > div > div
{
 padding: 20px;
}
.contain-icon > i
{
 font-size: 100px;
 display: block;
}
.text-icon,
.contain-icon > i
{
 text-align: center;
}
#page-a-propos
{
 color: #FFF;
}
#page-coordonnees a
{
 text-decoration: none;
 font-size: 20px;
 color: #FFF;
}
#page-facebook
{
 padding: 50px 0;
 text-align: center;
 background-attachment: fixed;
 background-image: url(../img/facebook.jpg);
 background-position: 50% 50%;
 background-repeat: no-repeat;
 background-size: cover;
}
#page-facebook > iframe
{
 box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.5);
}
#page-contact > h2
{
 padding-top: 25px;
}
#page-partenaires
{
 text-align: center;
}
#page-partenaires .container
{
 display: flex;
 align-items: center;
 justify-content: center;
 height: 200px;
}
#page-partenaires a
{
 display: inline-block;
 margin: 5px;
 vertical-align: middle;
}
#page-partenaires a > img
{
 max-width: 200px;
}
#partenaires-liste
{
 margin: 0;
 padding: 0;
 text-align: center;
 font-size: 0;
 list-style: none;
}
#partenaires-liste > li
{
 display: inline-block;
 width: 200px;
 height: 180px;
 margin: 10px;
 padding: 15px;
 overflow: hidden;
 text-align: center;
 font-size: 14px;
 transition: ease-in-out 200ms box-shadow;
}
#partenaires-liste > li > a
{
 display: block;
 margin: 0;
 padding: 0;
 text-decoration: none;
}
#partenaires-liste > li:hover
{
 -webkit-box-shadow: 0 0 3px 0 #656565;
 -moz-box-shadow: 0 0 3px 0 #656565;
 box-shadow: 0 0 3px 0 #656565;
 -o-box-shadow: 0 0 3px 0 #656565;
 filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=3);
}
#partenaires-liste > li img
{
 height: initial;
 margin: 0;
 max-width: 100%;
}
#partenaires-liste > li > a > .partenaires-liste-titre
{
 color: #044D71;
}
#galerie-liste
{
 width: 100%;
 padding-left: 0;
 text-align: center;
 font-size: 0;
 list-style: none;
}
#galerie-liste > li
{
 display: inline-flex;
 position: relative;
 width: calc(25% - 10px);
 margin: 5px;
 padding-top: 20%;
 overflow: hidden;
 vertical-align: top;
}
#galerie-liste > li .titre
{
 display: flex;
 z-index: 2;
 position: absolute;
 bottom: 10px;
 left: 0;
 align-items: center;
 justify-content: center;
 width: calc(100% - 10px);
 height: 50px;
 margin: 5px;
 padding: 5px;
 border-radius: 3px;
 font-size: 18px;
 color: #FFF;
 background-color: rgba(0, 0, 0, 0.7);
 transition: ease-in-out 200ms bottom;
}
#galerie-liste > li .titre > span
{
 display: inline-block;
}
.sousPage{
 display: block;
 height: 2px;
 background: var(--red);
 margin: 40px 20px;
}
#galerie-liste > li:hover .titre
{
 bottom: -100%;
}
#galerie-liste > li > a
{
 display: block;
 position: absolute;
 top: 0;
 width: 100%;
 height: 100%;
 background-color: #FFF0;
}
#galerie-liste > li > a > .mask
{
 z-index: 3;
 position: absolute;
 top: 100%;
 width: 100%;
 height: 100%;
 opacity: 0;
 background-color: rgba(0, 0, 0, 0.7);
 -webkit-animation: 150ms forwards linear;
 animation: 0.15s forwards linear;
}
#galerie-liste > li > a > .mask > i
{
 position: absolute;
 top: 50%;
 left: 50%;
 font-size: 45px;
 color: white;
 -webkit-transform: translateX(-50%) translateY(-50%);
 transform: translateX(-50%) translateY(-50%);
}
#galerie-liste > li > a > .mask > span
{
 display: block;
 position: absolute;
 top: 50%;
 left: 50%;
 width: 95%;
 text-align: center;
 font-size: 15px;
 color: white;
 -webkit-transform: translateX(-50%) translateY(-50%);
 transform: translateX(-50%) translateY(-50%);
}
#galerie-liste > li > a > .mask > span > i
{
 font-size: 45px;
}
#galerie-liste > li img.portrait
{
 width: 100%;
 height: auto !important;
 max-width: 100% !important;
}
#galerie-liste > li img.landscape
{
 width: auto;
 height: 100% !important;
 max-height: 100%;
}
#galerie-partenaires .slick-slide img
{
 max-width: 150px;
 max-height: 150px;
}
.item
{
 position: relative;
 float: left;
 width: calc(33.33333% - 10px);
 background-color: #000;
 overflow: hidden;
 margin: 5px;
}
.item:after
{
 content: '';
 display: block;
 background-color: inherit;
 opacity: 0.9;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
 transform: scale(2) translateX(-75%) translateY(-75%) translateZ(0) rotate(-28deg);
 transition: transform 3s cubic-bezier(0.23, 1, 0.32, 1);
 opacity: 0.3;
}
.item:hover:after
{
 transform: scale(2) translateX(0%) translateY(0%) translateZ(0) rotate(-28deg);
}
.item:hover .item-image
{
 transform: scale(1.2) translateZ(0);
}
.item:hover .item-text
{
 opacity: 1;
 transform: translateY(0);
}
.item-image
{
 height: auto;
 backface-visibility: hidden;
 transform: translateZ(0);
 transition: transform 750ms cubic-bezier(0.23, 1, 0.32, 1);
}
.item-image::before
{
 content: "";
 display: block;
 padding-top: 100%;
 overflow: hidden;
}
.item-image img
{
 position: absolute;
 top: 0;
 left: 0;
 line-height: 0;
 margin: 0 !important;
}
.item-image img.landscape
{
 width: auto;
 height: 100% !important;
 max-height: 100%;
 transform: translateX(-25%);
}
.item-image img.portrait
{
 width: 100%;
 height: auto !important;
 max-width: 100% !important;
 transform: translateY(-25%);
}
.item-text
{
 position: absolute;
 top: 0;
 right: 0;
 left: 0;
 bottom: 0;
 opacity: 0;
 text-align: center;
 z-index: 1;
 color: #fff;
 transition: opacity 500ms cubic-bezier(0.23, 1, 0.32, 1),
 transform 500ms cubic-bezier(0.23, 1, 0.32, 1);
 transition-delay: 300ms;
 transform: translateY(-20%);
}
.item-text-wrapper
{
 width: 100%;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
}
.item-text-title
{
 font-size: 18px;
 padding: 0 15px;
 color: #FFF;
 text-align: center;
 margin: auto;
 display: block;
}
@keyframes in-top
{
 0%
 {
 top: -100%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
}
@keyframes in-bottom
{
 0%
 {
 top: 100%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
}
@keyframes in-right
{
 0%
 {
 top: 0%;
 left: 100%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
}
@keyframes in-left
{
 0%
 {
 top: 0%;
 left: -100%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
}
#galerie-liste > li > a > .mask.in-top
{
 -webkit-animation-name: in-top;
 animation-name: in-top;
}
#galerie-liste > li > a > .mask.in-bottom
{
 -webkit-animation-name: in-bottom;
 animation-name: in-bottom;
}
#galerie-liste > li > a > .mask.in-right
{
 -webkit-animation-name: in-right;
 animation-name: in-right;
}
#galerie-liste > li > a > .mask.in-left
{
 -webkit-animation-name: in-left;
 animation-name: in-left;
}
@keyframes out-top
{
 0%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: -100%;
 left: 0%;
 opacity: 1;
 }
}
@keyframes out-bottom
{
 0%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: 100%;
 left: 0%;
 opacity: 1;
 }
}
@keyframes out-right
{
 0%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: 100%;
 opacity: 1;
 }
}
@keyframes out-left
{
 0%
 {
 top: 0%;
 left: 0%;
 opacity: 1;
 }
 100%
 {
 top: 0%;
 left: -100%;
 opacity: 1;
 }
}
#galerie-liste > li > a > .mask.out-top
{
 -webkit-animation-name: out-top;
 animation-name: out-top;
}
#galerie-liste > li > a > .mask.out-bottom
{
 -webkit-animation-name: out-bottom;
 animation-name: out-bottom;
}
#galerie-liste > li > a > .mask.out-right
{
 -webkit-animation-name: out-right;
 animation-name: out-right;
}
#galerie-liste > li > a > .mask.out-left
{
 -webkit-animation-name: out-left;
 animation-name: out-left;
}
#galerie-liste > li img
{
 z-index: 1;
 position: absolute;
 object-fit: contain;
 top: 50%;
 left: 50%;
 margin: 0;
 max-height: 100%;
 max-width: 100%;
 transform: translate(-50%, -50%);
}
#form_connexion
{
 display: block;
 max-width: 500px;
 margin: 0 auto;
}
#form_inscription
{
 display: block;
 max-width: 500px;
 margin: 0 auto;
 padding: 10px;
 border: 1px solid #E1E1E1;
 background-color: #FFF;
 box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.2);
 border-radius: 3px;
}
#type-compte
{
 margin: 0 0 10px;
}
#type-compte a
{
 display: block;
 margin: 0 auto 10px;
 padding: 10px;
 max-width: 250px;
 text-decoration: none;
 text-align: center;
 background-color: #FFF;
 border: 1px solid #E1E1E1;
 box-shadow: 1px 2px 2px 0 rgba(0, 0, 0, 0.2);
 border-radius: 3px;
}
#type-compte a:hover
{
 background-color: rgba(104, 217, 56, 0.2);
}
#type-compte a .icone
{
 margin: 20px auto;
 color: #FFF;
 background-color: #0075b5;
 border-radius: 100%;
 width: 70px;
 height: 70px;
 padding: 10px 5px;
}
#type-compte a .titre
{
 font-size: 16px;
 font-weight: 700;
}
.slider_galerie
{
 clear: both;
}
.slider_galerie > div:first-child
{
 display: inline-block;
 width: 50%;
 margin-right: auto;
 margin-left: auto;
 overflow: hidden;
 vertical-align: top;
 background-color: #D3D3D3;
}
.slider_galerie > div:first-child > ul
{
 position: relative !important;
 top: 0 !important;
 width: 100%;
 height: 100% !important;
 margin: 0;
}
.slider_galerie > div:first-child > ul > li
{
 position: relative !important;
 top: 0 !important;
 width: 100%;
 height: 100% !important;
 margin: 0;
 padding-top: 75%;
}
.slider_galerie > div:first-child > ul > li > a
{
 display: block;
 width: 100%;
 height: 100% !important;
}
.slider_galerie > div img
{
 margin: 0 !important;
 vertical-align: middle;
}
.slider_galerie > div:first-child > ul > li > a > img
{
 position: absolute;
 top: 50%;
 left: 50%;
 width: initial !important;
 height: initial !important;
 max-height: 100%;
 max-width: 100%;
 transform: translate(-50%, -50%);
}
.slider_galerie > div:first-child+div
{
 display: inline-block;
 position: relative;
 width: 50% !important;
 height: 100% !important;
 vertical-align: top;
 background-color: #EAEAEA;
}
.slider_galerie > div:first-child+div > div
{
 padding-top: 75%;
}
.slider_galerie > div:first-child+div > div > div
{
 position: absolute !important;
 top: 0;
 height: 100% !important;
 padding: 2px;
 overflow: auto !important;
 white-space: initial !important;
}
.slider_galerie > div:first-child+div > div > div > img
{
 height: 100px !important;
 margin: 2px !important;
}
.slider_galerie .boutonPagination.select
{
 background-color: #f3f2f2 !important;
}
.slider_galerie > div.CJSlider > div:nth-child(2),
.slider_galerie > div.CJSlider > div:nth-child(3)
{
 position: absolute;
 top: 50%;
 left: 10px;
 text-shadow: 0 0 1px rgba(0, 0, 0, 0.8);
 font-size: 30px;
 color: #FFF;
 opacity: 0.7;
 transform: translateY(-50%);
 cursor: pointer;
}
.slider_galerie > div.CJSlider > div:nth-child(3)
{
 right: 10px;
 left: initial;
}
.slider_galerie_miniatures > span
{
 display: inline-block;
 position: relative;
 width: 90px;
 height: 90px;
 margin: 0;
 margin: 1px;
 padding: 0;
 overflow: hidden;
 vertical-align: middle;
}
.slider_galerie_miniatures > span > img
{
 position: absolute;
 top: 50%;
 left: 50%;
 width: initial !important;
 height: initial !important;
 max-height: 170% !important;
 max-width: 210% !important;
 transform: translate(-50%, -50%);
}
.nuage
{
 text-align: justify;
 padding: 5px 0;
}
.nuage h2,
.nuage h3
{
 text-transform: initial;
 margin-bottom: 20px;
}
#slideshow_image_accueil
{
 margin: 50px 0;
 padding: 0;
 text-align: center;
}
#slideshow_image_accueil img
{
 margin: 0 !important;
}
#slideshow_image_accueil li
{
 margin: 0 10px !important;
}
.CJEditeur_body ul li,
.CJEditeur_body ol li,
.contenu-article ul li,
.contenu-article ol li
{
 margin-bottom: 10px;
}
.CJEditeur_body ul,
.CJEditeur_body ol,
.contenu-article ul,
.contenu-texte ul,
.contenu-conclusion ul,
.contenu-article ol,
.contenu-texte ol,
.contenu-conclusion ol
{
 display: table;
 padding-left: 20px;
}
.contenu-article td
{
 padding: 20px 10px;
 -webkit-backdrop-filter: brightness(0.95);
 backdrop-filter: brightness(0.95);
}
.contenu-article table,
.contenu-article table td
{
 border: 1px solid var(--red)!important;
}
.avantages_container
{
 display: flex;
 justify-content: space-between;
}
.avantage
{
 border-radius: 10px;
 border: 2px solid var(--red);
 text-align: center;
 padding: 50px 2px;
 width: 19%;
}
.avantage > i
{
 color: var(--red);
 font-size: 50px;
 margin-bottom: 30px;
}
.avantage > h3
{
 font-weight: bold;
}
.avantage > p
{
 margin-bottom: 0;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine
{
 background-color: #000 !important;
}

/* =====================================================================
   PLM Portage & Levage — Design 2026
   Feuille de style principale (remplace l'ancienne app.css).
   Palette / typographies issues de la maquette : DM Sans + Space Grotesk,
   rouge #d8332f, fonds papier / anthracite, angles droits, filets fins.
   ===================================================================== */

:root {
	--ink: #202426;
	--muted: #687072;
	--red: #d8332f;
	--red-dark: #b92322;
	--red-light: #ee534f;
	--paper: #f4f3f0;
	--band: #e9e9e5;
	--line: #d7d8d4;
	--dark: #25292a;
	--darker: #191c1d;
	--dark-card: #303536;
	--dark-line: #454b4a;
	--font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-title: "Space Grotesk", "DM Sans", system-ui, sans-serif;
	--wrap: 1180px;
	--gutter: 40px;
	--topbar-h: 38px;
	--header-h: 90px;
	--band-pad: 110px;
	--hero-h: clamp(620px, 94vh, 840px);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	min-width: 320px;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-body);
	font-size: 15px;
	line-height: 1.65;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
img { max-width: 100%; }
a { color: var(--red); text-decoration: none; transition: color .2s, background .2s, border-color .2s; }
a:hover { color: var(--red-dark); }
:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
p { margin: 0 0 1.1em; }
strong, b { font-weight: 700; }
small, .small { font-size: 12px; }
.center { text-align: center; justify-content: center; }
.lead { font-size: 19px; line-height: 1.5; }
table { border-collapse: collapse; border-spacing: 0; }
table td { margin: 0; padding: 0; }
iframe { max-width: 100%; border: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

h1, h2, h3, h4, h5 {
	margin: 0;
	padding: 0;
	font-family: var(--font-title);
	font-weight: 500;
	letter-spacing: -.045em;
	line-height: 1.08;
	color: var(--ink);
	text-align: left;
}
h1 { font-size: clamp(36px, 4.8vw, 64px); letter-spacing: -.055em; line-height: 1.04; }
h2 { font-size: clamp(30px, 3.7vw, 50px); }
h3 { font-size: 22px; letter-spacing: -.03em; }
h4 { font-size: 18px; letter-spacing: -.02em; }
h1 > a, h2 > a, h3 > a { color: inherit; }

/* Filet rouge sous les titres (ancien <hr>) */
hr {
	display: block;
	width: 48px;
	height: 0;
	margin: 22px 0 34px;
	padding: 0;
	border: 0;
	border-top: 2px solid var(--red);
}
hr.small { border-top-width: 1px; }
.center hr, [style*="text-align: center"] hr, [style*="text-align:center"] hr { margin-left: auto; margin-right: auto; }

/* Conteneur */
.container {
	display: block;
	position: relative;
	width: 100%;
	max-width: calc(var(--wrap) + var(--gutter) * 2);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
.container .container { padding-left: 0; padding-right: 0; max-width: none; }

/* ---------- Boutons ---------- */
.button, .bouton, .btnUrgent,
.button:active, .bouton:active, .button:focus, .bouton:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 6px 0;
	padding: 15px 22px;
	border: 0;
	border-radius: 0 !important;
	background: var(--red);
	color: #fff;
	font-family: var(--font-body);
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: .03em;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: transform .2s, background .2s, color .2s;
}
.button:hover, .bouton:hover, .btnUrgent:hover {
	background: var(--red-dark);
	color: #fff;
	transform: translateY(-2px);
	text-decoration: none !important;
}
.button[style], .bouton[style] { min-width: 0 !important; padding: 16px 24px !important; background-color: var(--red) !important; border-radius: 0 !important; }
.button[style]:hover, .bouton[style]:hover { background-color: var(--red-dark) !important; }
.button > i, .bouton > i { margin: 0; }
.button.validation { background: #287849; }
.button.erreur { background: #b92322; }
.button.disable { background: #8a918e; }

/* ---------- Formulaires ---------- */
input[type='text'], input[type='email'], input[type='tel'], input[type='number'], input[type='password'], input[type='search'], input:not([type]), select, textarea {
	display: block;
	width: 100%;
	margin: 0;
	padding: 11px 0 12px;
	border: 0;
	border-bottom: 1px solid #c9cbc8;
	border-radius: 0;
	background: transparent;
	color: var(--ink);
	font-family: var(--font-body);
	font-size: 14px;
	line-height: 1.4;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .2s;
}
select {
	padding-right: 24px;
	background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
	background-position: calc(100% - 9px) 50%, calc(100% - 4px) 50%;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	cursor: pointer;
}
textarea { min-height: 120px; resize: vertical; }
input:focus, select:focus, textarea:focus,
input[type='text']:focus, input[type='number']:focus, input[type='password']:focus { border: 0; border-bottom: 1px solid var(--red); outline: none; }
::placeholder { color: #a6aaa7; opacity: 1; }
input[type="checkbox"], input[type="radio"] { width: auto; display: inline-block; accent-color: var(--red); }
fieldset > ul > li .input > label, fieldset > .contenu > ul > li .input > label,
.quote-form label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #4b5254;
	padding: 3px 0;
}
fieldset > ul > li .input, fieldset > .contenu > ul > li .input { padding: 8px 12px 8px 0; }
fieldset > ul > li { padding-right: 0; }
fieldset h3 { margin: 6px 0 12px; text-align: left; font-size: 22px; }
fieldset > ul > h3 { display: block; }
fieldset small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.file-btn { cursor: pointer; background: transparent !important; color: var(--red) !important; border: 1px solid var(--red); margin: 6px 12px 6px 0; }
.file-btn:hover { background: var(--red) !important; color: #fff !important; }
.nom-fichier { font-size: 12px; color: var(--muted); }

/* ---------- Pagination ---------- */
.pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; margin: 44px 0 10px; text-align: center; }
.pagination a { display: inline-block; margin: 0; padding: 10px 16px; border: 1px solid var(--line); color: var(--ink); font-size: 13px; font-weight: 600; background: #fff; text-decoration: none; transition: background .2s, color .2s, border-color .2s; }
.pagination a:hover:not(.disabled) { background: var(--red); border-color: var(--red); color: #fff; transform: none; }
.pagination a.active { background: var(--red); border-color: var(--red); color: #fff; }
.pagination a.disabled { color: #b4b8b5; background: transparent; pointer-events: none; }
.pagination form { display: inline-flex; }
.pagination > form > input { width: 48px !important; padding: 9px 0; border: 1px solid var(--line); text-align: center; background: #fff; }

/* ---------- Notifications / badges ---------- */
.notification.erreur, .button.erreur { background: var(--red); }
.notification.information, .button.information { background: var(--dark); }
.notification.validation, .button.validation { background: #287849; }
.notification.alert, .button.alert { background: #c98a12; }
.notification { margin: 14px 0; padding: 14px 20px; border-radius: 0; border-left: 4px solid rgba(0,0,0,.25); color: #fff; font-size: 14px; }
.notification > span { width: calc(100% - 40px); }
.badge { border-radius: 0; }

/* ---------- Structure générale ---------- */
#site { position: relative; width: 100%; margin: 0 auto; overflow-x: hidden; }
@supports (overflow: clip) { #site { overflow-x: clip; } }
#content { position: relative; padding-top: calc(var(--header-h) + var(--topbar-h)); margin: 0; min-height: 70vh; }
#slider_accueil + #content { padding-top: 0; }
#content > .container:first-child { padding-top: 56px; padding-bottom: 20px; }
#content > .container:first-child > h1,
#content > .container:first-child > .tetiere { margin-top: 0; }
#content > .container.fadeIn { padding-top: 56px; }
.clear { clear: both; }

#content > br, .band > br { display: none; }

/* Bandes plein écran (accueil) */
.band { position: relative; padding: var(--band-pad) 0; background: var(--paper); }
.band-light { background: var(--band); }
.band-dark { background: var(--dark); color: #f4f3f0; }
.band-dark h1, .band-dark h2, .band-dark h3 { color: #fff; }
.band-dark p { color: #b9bfbc; }
.band > .container > h2:first-child { margin-bottom: 0; }

/* =====================================================================
   EN-TÊTE
   ===================================================================== */
#header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 55;
	background: #fafaf8;
	box-shadow: 0 1px 0 rgba(0,0,0,.06);
	transition: box-shadow .3s;
}
#header .animated, #header .fadeInDown { animation: none !important; transform: none !important; opacity: 1 !important; }
#header.scroll { box-shadow: 0 10px 30px rgba(20, 24, 26, .1); }

#header_top { background: var(--darker); color: #c4cbc8; font-size: 12px; text-align: right; }
#header_top > .container {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 4px 26px;
	min-height: var(--topbar-h);
}
#header_top > .container > span { display: inline-flex; align-items: center; gap: 8px; padding: 0; }
#header_top i { font-style: normal; }
#header_top a { color: #fff; font-weight: 600; text-decoration: none; }
#header_top a:hover { color: var(--red-light); }
#header_top .fal, #header_top .fab { color: var(--red-light); font-size: 13px; }
#header_top a.bouton {
	margin: 0 !important;
	padding: 4px 10px !important;
	font-size: 11px !important;
	background: var(--red);
	color: #fff;
}
#header_top a.bouton .fal { color: #fff; }
#header_top a.bouton:hover { background: var(--red-dark); transform: none; }
#header_top > .container > span:first-child { margin-right: auto; }
#header_top .fab { color: #c4cbc8; font-size: 14px; }
#header_top a:hover .fab { color: var(--red-light); }

#header > .container {
	position: static;
	display: flex;
	align-items: center;
	gap: 26px;
	height: var(--header-h);
	max-width: calc(var(--wrap) + var(--gutter) * 2);
	margin: 0 auto;
	padding: 0 var(--gutter);
	text-align: left;
}
#logo { display: flex; align-items: center; flex: none; height: 100%; }
#logo > img { height: 62px; width: auto; max-width: 150px; object-fit: contain; object-position: left center; }
.slogan {
	position: static;
	margin: 0;
	max-width: 150px;
	font-family: var(--font-title);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: var(--ink);
}
#menu { margin: 0 0 0 auto; padding: 0; height: 100%; }
#menu > ul { display: flex; align-items: center; gap: 2px; height: 100%; margin: 0; padding: 0; list-style: none; }
#menu > ul > li { position: relative; display: flex; align-items: center; height: 100%; margin: 0; padding: 0; }
#menu > ul > li > a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
	height: 100%;
	padding: 0 14px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .01em;
	text-transform: none;
	color: #42494b;
	text-decoration: none;
	overflow: visible;
}
#menu > ul > li > a::after {
	content: "";
	position: absolute;
	left: 14px; right: 14px; bottom: 0;
	height: 3px;
	background: var(--red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s;
}
#menu > ul > li:hover > a, #menu > ul > li.select > a:not(.button) { color: var(--red); }
#menu > ul > li:hover > a::after, #menu > ul > li.select > a::after { transform: scaleX(1); }
#menu > ul > li:last-child > a { padding-right: 0; }
#menu > ul > li:last-child > a::after { right: 0; }
#menu > ul > li > a > i { line-height: 1; font-size: 15px; }
#menu > ul > li > a > .fa-angle-down { position: static; font-size: 14px; transform: none; transition: transform .25s; }
#menu > ul > li > a > .fa-angle-down.down2 { display: none; }
#menu > ul > li:hover > a > .fa-angle-down.down1 { transform: rotate(180deg); }
#menu > ul > li > a.button { height: auto; margin: 0 0 0 10px; padding: 12px 16px; color: #fff; }
#menu > ul > li > a.button::after { display: none; }
#menu > ul > li > ul {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 5;
	min-width: 270px;
	max-height: none;
	margin: 0;
	padding: 8px 0;
	list-style: none;
	text-align: left;
	background: #fafaf8;
	border-top: 2px solid var(--red);
	box-shadow: 0 22px 44px rgba(20, 24, 26, .16);
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	overflow: visible;
	transition: opacity .2s, transform .2s, visibility .2s;
}
#menu > ul > li:hover > ul, #menu > ul > li:focus-within > ul { opacity: 1; visibility: visible; transform: none; max-height: none; }
#menu > ul > li > ul > li { padding: 0; white-space: nowrap; }
#menu > ul > li > ul > li:first-child, #menu > ul > li > ul > li:last-child { padding: 0; }
#menu > ul > li > ul > li > a {
	display: block;
	padding: 11px 22px;
	font-size: 13px;
	font-weight: 500;
	color: #42494b;
	text-decoration: none;
	border-left: 2px solid transparent;
}
#menu > ul > li > ul > li > a:hover, #menu > ul > li > ul > li > a.select { color: var(--red); background: var(--paper); border-left-color: var(--red); }
.cart-badge { display: inline-block; min-width: 20px; height: 20px; margin-left: 6px; padding: 0 5px; border-radius: 10px; background: var(--red); color: #fff; font-size: 11px; line-height: 20px; text-align: center; }

/* Burger */
.burger { display: none; position: relative; width: 44px; height: 44px; margin: 0 0 0 auto; padding: 0; cursor: pointer; }
.burger > div {
	position: absolute;
	top: 50%; left: 50%;
	width: 24px; height: 2px;
	margin: -1px 0 0 -12px;
	border-radius: 0;
	background: var(--ink);
	transform: none;
	transition: background .2s;
}
.burger > div::before, .burger > div::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%; height: 2px;
	border-radius: 0;
	background: var(--ink);
	transition: top .25s, bottom .25s, transform .25s, background .25s;
}
.burger > div::before { top: -7px; bottom: auto; }
.burger > div::after { top: 7px; }
.nav-open .burger > div { background: transparent; }
.nav-open .burger > div::before { top: 0; bottom: auto; transform: rotate(45deg); background: var(--red); }
.nav-open .burger > div::after { top: 0; transform: rotate(-45deg); background: var(--red); }

/* =====================================================================
   HÉRO ACCUEIL (slider)
   ===================================================================== */
#slider_accueil { position: relative; z-index: 1; width: 100% !important; overflow: hidden; background: var(--dark); color: #fff; }
#slider_accueil > ul { position: relative !important; width: 100%; margin: 0; padding: 0; list-style: none; }
#slider_accueil > ul > li {
	position: relative !important;
	width: 100%;
	min-height: var(--hero-h);
	padding: 0;
	background-color: #232728;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#slider_accueil > ul > li::before {
	content: "";
	position: absolute; inset: 0;
	z-index: 1;
	background: linear-gradient(90deg, rgba(15, 18, 19, .92), rgba(15, 18, 19, .66) 55%, rgba(15, 18, 19, .22));
}
#slider_accueil > ul > li > a { position: absolute; inset: 0; display: block; width: 100%; height: 100%; z-index: 2; color: inherit; }
#slider_accueil img { margin: 0; }
#slider_accueil > ul > li video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; opacity: .68; }
#slider_accueil .slide-contenu {
	position: absolute; inset: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	width: 100%; height: 100%;
	padding: calc(var(--header-h) + var(--topbar-h) + 20px) 0 90px;
	background: none;
}
#slider_accueil .slide-contenu > .container { position: relative; top: auto; height: auto; }
#slider_accueil .slide-contenu > .container > div { position: static; width: 100%; max-width: 640px; }
#slider_accueil .slide-contenu > .container > div::after { display: none; }
#slider_accueil .slide-contenu .slide-titre {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	border: 0;
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-shadow: none;
	color: var(--red-light);
}
#slider_accueil .slide-contenu .slide-titre::before { content: ""; width: 32px; height: 1px; background: currentColor; }
#slider_accueil .slide-contenu .slide-texte { display: block; margin: 0; padding: 0; font-size: 16px; text-shadow: none; color: #d8dcda; }
#slider_accueil .slide-texte1 {
	margin: 22px 0 22px;
	font-family: var(--font-title);
	font-size: clamp(38px, 5.2vw, 76px);
	font-weight: 500;
	line-height: 1.03;
	letter-spacing: -.055em;
	color: #fff;
}
#slider_accueil .slide-texte1 span, #slider_accueil .slide-texte1 * { font-size: inherit !important; }
#slider_accueil .slide-texte2 { max-width: 480px; margin: 0 0 18px; font-size: 16px; line-height: 1.7; color: #d8dcda; }
#slider_accueil .slide-texte2:has(.button) { margin-top: 28px; }
#slider_accueil .slide-contenu .slide-texte a { display: inline-flex; text-shadow: none; }
#slider_accueil .slide-texte a.button { color: #fff; }

/* Pagination & flèches du slider */
#slider_accueil .boutonsPagination {
	right: auto !important;
	left: max(var(--gutter), calc((100% - var(--wrap)) / 2)) !important;
	bottom: 34px !important;
	display: flex;
	gap: 8px;
	z-index: 8 !important;
}
#slider_accueil .boutonPagination {
	width: 30px !important;
	height: 3px !important;
	margin: 0 !important;
	border-radius: 0 !important;
	background: rgba(255,255,255,.35) !important;
	opacity: 1 !important;
}
#slider_accueil .boutonPagination.select { background: var(--red) !important; }
#slider_accueil .CJSlider-navigation-gauche,
#slider_accueil .CJSlider-navigation-droite {
	top: auto !important;
	bottom: 20px !important;
	left: auto !important;
	transform: none !important;
	width: 44px; height: 44px;
	display: grid;
	place-items: center;
	border: 1px solid rgba(255,255,255,.4);
	background: rgba(15,18,19,.35);
	z-index: 8 !important;
	transition: background .2s, border-color .2s;
}
#slider_accueil .CJSlider-navigation-droite { right: max(var(--gutter), calc((100% - var(--wrap)) / 2)) !important; }
#slider_accueil .CJSlider-navigation-gauche { right: calc(max(var(--gutter), calc((100% - var(--wrap)) / 2)) + 52px) !important; }
#slider_accueil .CJSlider-navigation-gauche:hover, #slider_accueil .CJSlider-navigation-droite:hover { background: var(--red); border-color: var(--red); }
#slider_accueil .CJSlider-navigation-gauche > i, #slider_accueil .CJSlider-navigation-droite > i { position: static; margin: 0; font-size: 20px; color: #fff; text-shadow: none; }

/* Carte « Un projet ? » du héro */
.slider-rappel {
	position: absolute;
	z-index: 9;
	top: calc(50% + 40px);
	right: max(var(--gutter), calc((100% - var(--wrap)) / 2));
	width: 340px;
	max-width: calc(100% - var(--gutter) * 2);
	padding: 28px 30px 24px;
	border-radius: 0;
	background: #f3f3f0;
	color: var(--ink);
	transform: translateY(-50%);
	box-shadow: 0 30px 60px rgba(0, 0, 0, .3);
	text-align: left;
}
.slider-rappel > div:first-child { width: 100% !important; text-align: left !important; }
.slider-rappel h2, .slider-rappel .title-rappel {
	margin: 0 0 18px !important;
	padding: 0 0 16px !important;
	border-bottom: 1px solid var(--line);
	font-family: var(--font-title);
	font-size: 28px !important;
	font-weight: 500;
	letter-spacing: -.04em;
	color: var(--ink) !important;
	text-align: left !important;
}
.slider-rappel form { display: block; }
.slider-rappel ul { margin: 0; padding: 0; border: 0; list-style: none; font-size: 0; }
.slider-rappel ul > li { display: block; width: 100%; margin: 0; padding: 0; }
.slider-rappel ul > li .input { padding: 6px 0 !important; }
.slider-rappel ul > li input { height: auto; padding: 11px 0 12px; border-radius: 0; font-size: 14px; }
.slider-rappel ul > li .button, .slider-rappel ul > li .bouton, .slider-rappel ul > li button { width: 100%; margin: 14px 0 0 !important; height: auto; padding: 16px !important; border: 0 !important; }
.slider-rappel .notification { margin: 0 0 12px; }

/* =====================================================================
   ACCUEIL — SECTIONS
   ===================================================================== */
/* Intro */
.band-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	column-gap: clamp(40px, 7vw, 100px);
	align-items: start;
	padding: 110px max(var(--gutter), calc((100% - var(--wrap)) / 2)) 90px;
}
.band-intro > .container { width: auto; max-width: none; margin: 0; padding: 0; }
.band-intro > .container:first-child { grid-column: 1; grid-row: 1 / span 2; }
.band-intro > .container:nth-child(2) { grid-column: 2; grid-row: 1; padding-top: 8px; }
.band-intro > .center { grid-column: 2; grid-row: 2; margin: 14px 0 0 !important; padding: 0 !important; background: none !important; text-align: left; }
.band-intro > .bloc-icones { grid-column: 1 / -1; grid-row: 3; width: 100%; }
.band-intro h1 { max-width: none; margin: 0; font-size: clamp(34px, 4.1vw, 56px); }
.band-intro h1::before { content: ""; display: block; width: 32px; height: 1px; margin-bottom: 26px; background: var(--red); }
.band-intro .container[style] { font-size: 15px !important; }
.band-intro .container > p, .band-intro .container > ul { max-width: none; color: var(--muted); font-size: 15.5px; line-height: 1.75; }
.band-intro .container > p:first-child { color: var(--ink); font-size: 19px; line-height: 1.55; }
.band-intro .container > p strong { color: var(--ink); }
.band-intro .container > h2 { max-width: none; margin: 40px 0 16px; font-size: clamp(24px, 2.4vw, 32px); }
.band-intro .container > ul { display: grid; gap: 0; margin: 20px 0 26px; padding: 0; list-style: none; }
.band-intro .container > ul li { margin: 0 !important; padding: 12px 0; border-top: 1px solid var(--line); color: var(--ink); font-weight: 500; font-size: 14.5px; }
.band-intro .container > ul li:last-child { border-bottom: 1px solid var(--line); }

/* Pictos + chiffres : bande de filets */
.bloc-icones {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	max-width: calc(var(--wrap) + var(--gutter) * 2);
	margin: 60px auto 0;
	padding: 34px var(--gutter) 0;
	list-style: none;
	text-align: left;
	color: var(--ink);
	border: 0;
}
.bloc-icones-border {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	margin: 0;
	padding: 4px 24px 4px 0;
	border: 0;
	border-radius: 0;
	color: var(--ink);
}
.bloc-icones-border + .bloc-icones-border { padding-left: 24px; border-left: 1px solid var(--line); }
.bloc-icones i { font-size: 28px; color: var(--red); line-height: 1; margin-bottom: 8px; }
.bloc-icones .main { font-family: var(--font-title); font-size: clamp(30px, 3.6vw, 46px); font-weight: 500; letter-spacing: -.05em; line-height: 1.05; color: var(--ink); }
.bloc-icones i + .main { font-size: 22px; letter-spacing: -.03em; }
.bloc-icones .secondary { font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.band-intro .bloc-icones { border-top: 1px solid var(--line); margin-top: 80px; padding-left: 0; padding-right: 0; max-width: none; }
#content > .bloc-icones { margin: 0 auto; padding-top: 60px; padding-bottom: 60px; max-width: none; background: var(--band); padding-left: max(var(--gutter), calc((100% - var(--wrap)) / 2)); padding-right: max(var(--gutter), calc((100% - var(--wrap)) / 2)); }
#content > .bloc-icones .bloc-icones-border + .bloc-icones-border { border-left-color: #c9cbc8; }

/* Devis (formulaire multi-étapes) */
.band-devis { padding-top: 100px; padding-bottom: 100px; }
.devis-container {
	max-width: 960px;
	margin: 0 auto !important;
	padding: 44px 48px !important;
	border-radius: 0;
	background: #f3f3f0;
	color: var(--ink);
	box-shadow: 0 30px 60px rgba(0,0,0,.25);
}
.band-dark .devis-container, .band-dark .devis-container h2, .band-dark .devis-container h3 { color: var(--ink); }
.band-dark .devis-container p { color: var(--muted); }
.devis-container h2 { margin: 0; font-size: clamp(30px, 3.4vw, 44px); color: var(--ink) !important; text-align: left; }
.devis-container hr { margin: 18px 0 24px; }
.devis-container p { color: var(--muted); font-size: 14px; text-align: left !important; }
.devis-container > div > p:first-child { margin-bottom: 4px; }
.devis-container a { color: var(--red); font-weight: 700; }
.step-bar { display: flex; align-items: center; justify-content: flex-start; gap: 0; margin: 26px 0 30px !important; counter-reset: s; }
.step {
	position: relative;
	display: grid;
	place-items: center;
	flex: 0 0 38px;
	width: 38px; height: 38px;
	border: 1px solid #c9cbc8;
	border-radius: 0;
	background: transparent;
	color: var(--muted);
	font-family: var(--font-title);
	font-size: 14px;
	font-weight: 600;
}
.step + .step { margin-left: 44px; }
.step + .step::before { content: ""; position: absolute; right: 100%; top: 50%; width: 44px; height: 1px; background: #c9cbc8; }
.step.active { border-color: var(--red); background: var(--red); color: #fff; }
.step-form { display: none; }
.step-form.active { display: block; }
.step-buttons { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.step-buttons .button { margin: 0; min-width: 130px; }
#btnAvant { background: transparent; color: var(--red); border: 1px solid var(--red); }
#btnAvant:hover { background: var(--red); color: #fff; }
.devis-container li.double p, .devis-container li p { font-size: 12px; line-height: 1.55; text-align: left !important; }
.nuage { padding: 0; text-align: left; }
.nuage:empty { display: none; }

/* Formulaire de devis : champs encadrés, plus lisibles */
.devis-container { border-top: 4px solid var(--red); }
.devis-container input[type='text'], .devis-container input[type='email'], .devis-container input[type='tel'], .devis-container input[type='number'], .devis-container select, .devis-container textarea {
	padding: 13px 14px;
	border: 1px solid #d3d5d1;
	border-radius: 0;
	background-color: #fff;
	font-size: 14.5px;
	transition: border-color .2s, box-shadow .2s;
}
.devis-container select { padding-right: 34px; background-position: calc(100% - 17px) 50%, calc(100% - 12px) 50%; }
.devis-container input:focus, .devis-container select:focus, .devis-container textarea:focus { border: 1px solid var(--red); box-shadow: 0 0 0 3px rgba(216, 51, 47, .12); }
.devis-container textarea { min-height: 150px; }
.devis-container fieldset > ul > li { padding: 0 8px; }
.devis-container fieldset > ul > li .input { padding: 0 0 18px; }
.devis-container fieldset > ul > li .input > label { margin-bottom: 7px; padding: 0; font-size: 11px; letter-spacing: .06em; color: var(--ink); }
.devis-container fieldset > ul { margin: 0 -8px; }
.devis-container fieldset > ul > h3, .devis-container fieldset > h3 { margin: 4px 8px 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); font-size: 24px; }
.devis-container fieldset > ul > li .row > * { padding: 0 8px 0 0; }
.devis-container fieldset > ul > li .row > *:last-child { padding-right: 0; }
.devis-container .file-btn { margin: 0 12px 0 0; padding: 13px 20px !important; border: 1px dashed var(--red); background: #fff !important; }
.devis-container .file-btn:hover { background: var(--red) !important; }
.devis-container small { font-size: 12px; }
.devis-container .step-buttons { margin-top: 12px; }
.devis-container li.double .input textarea { width: 100%; }

/* Captcha */
#captchagc { margin: 14px 0; border-radius: 0; background: #ebebe8; border-color: #d0d2cf; }
#captchagc > img:nth-of-type(1)+div { border-radius: 0; }

/* Cartes services (bloc3d) */
.service_bloc { padding: var(--band-pad) max(var(--gutter), calc((100% - var(--wrap)) / 2)); background: var(--paper); }
.service_bloc > hr { display: none; }
.bloc3d {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 15px;
	text-align: left;
}
.bloc3d > li { display: block; width: auto; height: 420px; max-width: none; margin: 0; border-radius: 0; perspective: none; }
.bloc3d > li:last-child:nth-child(3n+1) { grid-column: 1 / -1; height: 340px; }
.bloc3d > li > a {
	display: block;
	position: relative;
	width: 100%; height: 100%;
	overflow: hidden;
	border-radius: 0;
	background: var(--dark-card);
	color: #fff;
	transform: none !important;
}
.bloc3d li img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: transform .6s, filter .6s; }
.bloc3d > li > a:hover img { transform: scale(1.05); filter: grayscale(.15); }
.bloc3d > li > a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(13, 16, 16, .92), rgba(13, 16, 16, .1) 72%); }
.bloc3d .titre-bloc {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 2;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	padding: 28px;
	background: none;
	font-family: var(--font-title);
	font-size: 25px;
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: -.03em;
	text-transform: none;
	color: #fff;
}
.bloc3d .titre-bloc::after {
	content: "\2192";
	flex: none;
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	border: 1px solid rgba(255,255,255,.5);
	border-radius: 50%;
	font-family: var(--font-body);
	font-size: 16px;
	transition: background .2s, border-color .2s;
}
.bloc3d > li > a:hover .titre-bloc::after { background: var(--red); border-color: var(--red); }

/* Galerie accueil (slick) */
.band-galerie { padding-bottom: 90px; }
.band-galerie h2 { color: #fff; }
.band-galerie hr { margin-bottom: 44px; }
.slick-slider-contenu { margin: 0; }
.slick-slider-contenu .images { position: relative; margin: 0 7px; overflow: hidden; background: var(--dark-card); }
.slick-slider-contenu .images a { display: block; }
.slick-slider-contenu img { display: block; width: 100% !important; height: 340px !important; object-fit: cover !important; margin: 0 !important; max-width: none !important; max-height: none !important; filter: grayscale(.6); transition: filter .4s, transform .6s; }
.slick-slider-contenu .images:hover img { filter: grayscale(0); transform: scale(1.04); }
.overlay-image { position: absolute; inset: 0; z-index: 1; opacity: 0; background: linear-gradient(0deg, rgba(20,22,22,.78), transparent 70%); transition: opacity .3s; pointer-events: none; }
.images:hover .overlay-image { opacity: 1; }
.item-text-wrapper { position: absolute; left: 0; right: 0; bottom: 18px; }
.item-text-title { display: block; padding: 0 20px; color: #fff; font-size: 13px; font-weight: 700; }
.slick-slide, .slick-slide > div { text-align: left; }
.slick-slide img { max-width: none; max-height: none; }
.slick-track { display: flex; align-items: stretch; }
.slick-slide { float: none; height: auto; margin: 0; }
.slick-initialized .slick-slide { margin: 0; }
.slick-prev, .slick-next { z-index: 3; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.4); background: rgba(15,18,19,.55); transition: background .2s; }
.slick-prev:hover, .slick-next:hover, .slick-prev:focus, .slick-next:focus { background: var(--red); }
.slick-prev { left: 0; } .slick-next { right: 0; }
.slick-prev:before, .slick-next:before { color: #fff; font-size: 18px; }
.slick-dots li button:before { color: var(--red); }
ul.slick-slider { margin: 0; padding: 0; }

/* Bloc image « contenu hero » */
.contenu { position: relative; }
.contenu-articles { margin: 0; }
.contenu-article { margin: 0; }
.contenu-article.hero.image { min-height: 380px; background-position: center; background-attachment: scroll; filter: grayscale(.3); }
.contenu-article.hero.image + .contenu-article { filter: none; }
.contenu-article h2 { margin: 0 0 18px; padding: 0; }
.contenu-article > div > div { max-width: calc(var(--wrap) + var(--gutter) * 2); margin: 0 auto; overflow: visible; }
.contenu-article:not(.image) > div > div { padding: 30px var(--gutter); }
.contenu-article.hero > div:not(.clear) { padding: 0; }

/* Boutons « Vidéos » + pictos */
#content > .center { padding: 70px var(--gutter) 10px; margin: 0 !important; background: var(--paper); text-align: center; }
.page-picto { display: block; margin: 0; padding: 40px max(var(--gutter), calc((100% - var(--wrap)) / 2)) 90px; background: var(--paper); }
.bloc-picto { width: 100%; }
.container-picto { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.container-picto .col-3 { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 28px 24px 4px 0; border-top: 1px solid var(--line); text-align: left; }
.container-picto .col-3 + .col-3 { padding-left: 24px; border-left: 1px solid var(--line); }
.container-picto .col-3 img { width: 54px; height: 54px; object-fit: contain; }
.container-picto .col-3 h3, .col-3 h3 { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink); text-align: left; }
.container-picto .col-3 h3 strong { font-weight: 600; }

/* Bloc « Un projet ? » (2e formulaire) */
.bloc-image-seule { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; width: 100%; height: auto !important; min-height: 480px; margin: 0; background-color: var(--dark) !important; background-size: 60% auto !important; background-position: 20% center !important; overflow: hidden; }
.bloc-image-seule::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(25,28,29,.3), rgba(25,28,29,.85)); }
.bloc-image-seule .slider-rappel {
	position: relative;
	grid-column: 2;
	top: auto; right: auto;
	align-self: center;
	justify-self: end;
	width: 400px;
	margin: 60px max(var(--gutter), calc((100vw - var(--wrap)) / 2)) 60px 0;
	height: auto;
	max-width: calc(100% - 40px);
	transform: none;
	background: #f3f3f0;
}

/* Avis */
.band-avis { padding-top: 100px; padding-bottom: 80px; background: var(--band); }
.band-avis h2 { margin: 0; }
#slide_avis { margin: 0; padding: 0; list-style: none; }
#slide_avis.slick-slider { margin: 0 -9px; }
#slide_avis li { margin: 0; padding: 0 9px; }
.box_avis {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 260px;
	margin: 0 !important;
	padding: 30px 28px !important;
	border: 0;
	border-top: 3px solid var(--red);
	border-radius: 0;
	background: var(--paper);
	box-shadow: none;
}
.box_avis > div:first-child { order: 3; margin-top: 20px; padding: 0 !important; font-family: var(--font-title); font-size: 15px; font-weight: 600 !important; letter-spacing: -.01em; color: var(--ink); }
.box_avis > div:first-child i { display: none; }
.avis-etoile { order: 1; margin: 0 !important; padding: 0 !important; font-size: 13px !important; text-align: left !important; letter-spacing: 3px; }
.avis-etoile i, .box_avis i.fa-star, i.fa-star { color: var(--red); font-size: 13px; }
.box_avis > div:last-child { order: 2; flex: 1; height: auto !important; max-height: 190px; margin-top: 16px; padding: 0 !important; overflow: auto !important; border-radius: 0 !important; background: transparent !important; color: #4f5758 !important; font-size: 14px; line-height: 1.65; }
.band-avis { overflow: hidden; }
.band-avis .slick-prev, .band-avis .slick-next { top: auto; bottom: -88px; z-index: 5; transform: none; border-color: var(--dark); background: transparent; }
.band-avis .slick-prev { left: auto; right: 54px; }
.band-avis .slick-next { right: 0; }
.band-avis .slick-prev:before, .band-avis .slick-next:before { color: var(--dark); }
.band-avis .slick-prev:hover, .band-avis .slick-next:hover { background: var(--red); border-color: var(--red); }
.band-avis .slick-prev:hover:before, .band-avis .slick-next:hover:before { color: #fff; }
.band-avis center, .band-avis .center-link { display: block; margin-top: 44px; text-align: left; }
.band-avis center .button { margin: 0 !important; }

/* Horaires + carte */
#page-horaires { display: grid; grid-template-columns: 1fr 1fr; position: relative; height: auto !important; min-height: 460px; padding: 0 !important; overflow: hidden; background: var(--dark); }
#page-horaires > iframe { display: block; width: 100% !important; height: 100% !important; min-height: 460px; }
#page-horaires .biseau_left { position: relative; display: flex; align-items: center; }
.biseau_left:before, .biseau_right:before { display: none; }
#page-horaires .container.absolute { position: static !important; width: 100%; height: auto; max-width: none; padding: 60px max(var(--gutter), calc((100% - var(--wrap)) / 2)) 60px 56px !important; color: #f4f3f0; }
#page-horaires h2 { margin: 0; color: #fff !important; font-size: clamp(30px, 3.4vw, 44px); text-align: left; padding: 0; }
#page-horaires hr { border-color: var(--red); margin-bottom: 28px; }
.liste { width: 100%; max-width: 440px; margin: 0; padding: 0; list-style: none; }
.liste > li { display: flex; justify-content: space-between; gap: 20px; width: 100%; margin: 0; padding: 0; border-bottom: 1px solid var(--dark-line); font-size: 14px; }
.liste > li > span { display: block; padding: 11px 0; text-align: left; color: #b9bfbc; }
.liste > li > span:first-child + span { text-align: right; color: #fff; }

/* Bouton flottant « Devis gratuit » */
.container-fixe {
	position: fixed;
	right: 0; bottom: 90px;
	z-index: 50;
	display: flex;
	margin: 0;
	width: auto;
	border: 0;
	border-radius: 0;
	background: var(--red);
	box-shadow: 0 10px 30px rgba(0,0,0,.25);
	transform: none;
}
.container-fixe > a { display: flex; flex-direction: row; align-items: center; padding: 22px 13px; writing-mode: vertical-rl; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; text-align: center; }
.container-fixe > a:hover { color: #fff; background: var(--red-dark); }
.container-fixe i { margin: 10px 0 0; font-size: 13px; }

/* =====================================================================
   PAGES INTÉRIEURES
   ===================================================================== */
/* Fil d'Ariane */
.ariane { display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 30px; padding: 0; list-style: none; font-size: 12px; font-weight: 500; letter-spacing: .02em; color: var(--muted); }
.ariane > li { display: inline-flex; align-items: center; margin: 0; padding: 2px 0; font-size: 12px; line-height: 1.4; font-style: normal; font-weight: 500; color: var(--muted); }
.ariane > li:not(:first-child)::before { content: ""; width: 14px; height: 1px; margin: 0 10px; background: var(--red); font-family: inherit; }
.ariane a { font-size: 12px; font-weight: 600; line-height: 1.4; color: var(--ink); text-decoration: none; }
.ariane a:hover { color: var(--red); }

/* Titre de page */
#content > .container > h1, #content > .container > .tetiere + h1 { margin-bottom: 0; }
#content > .container > h1 + hr { margin-top: 24px; margin-bottom: 26px; }
h1[data-aos] + hr[data-aos] { margin: 24px 0 30px; }

/* Tétière (image en haut de page) */
.tetiere {
	position: relative;
	top: auto;
	display: flex;
	align-items: flex-end;
	min-height: 360px;
	margin: 0 0 36px;
	padding: 56px 52px;
	border-radius: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	color: #fff;
}
.tetiere > div { max-width: 640px; }
.tetiere .tetiere-titre { margin: 0 0 16px; color: #fff; font-size: clamp(34px, 4.6vw, 58px); text-align: left; }
.tetiere .tetiere-contenu, .tetiere-contenu { margin: 0; color: #d8dcda; font-size: 16px; line-height: 1.7; text-align: left; }
.tetiere-contenu p:last-child { margin-bottom: 0; }

/* Contenus rédactionnels */
.contenu-accroche, .contenu-texte, .contenu-conclusion, .contenu-article-texte, .actualite-texte, .blog-article-paragraphe, .nuage { color: #4f5758; font-size: 16px; line-height: 1.8; }
.contenu-accroche { font-size: 19px; line-height: 1.6; color: var(--ink); margin-bottom: 26px; }
.contenu-accroche, .contenu-texte, .contenu-conclusion { max-width: 860px; }
#content .contenu-texte h2, #content .contenu-conclusion h2, #content .contenu-article h2, #content .contenu-article-texte h2, #content .blog-article-paragraphe h2 { margin: 1.4em 0 .5em; padding: 0; border: 0; font-size: clamp(26px, 3vw, 38px); color: var(--ink); text-align: left; }
#content .contenu-texte h3, #content .contenu-article-texte h3, #content .blog-article-paragraphe h3 { margin: 1.3em 0 .5em; text-align: left; }
.contenu-texte strong, .contenu-accroche strong, .contenu-article-texte strong { color: var(--ink); }
.contenu-texte a, .contenu-article-texte a, .contenu-conclusion a, .contenu-accroche a, .blog-article-paragraphe a { text-decoration: underline; text-underline-offset: 3px; }
.contenu-texte ul, .contenu-article ul, .contenu-conclusion ul, .contenu-texte ol, .contenu-article ol, .contenu-conclusion ol { display: block; padding-left: 22px; }
.contenu-texte ul li::marker, .contenu-article ul li::marker, .contenu-conclusion ul li::marker { color: var(--red); }
.contenu-article td { padding: 14px 12px; backdrop-filter: none; -webkit-backdrop-filter: none; }
.contenu-article table, .contenu-article table td, .contenu-texte table td, .contenu-texte table { border: 1px solid var(--line) !important; }
.contenu-article-texte, .contenu-texte { overflow-wrap: anywhere; }
#content .contenu-texte img, #content .contenu-article img, #content .contenu-accroche img, #content .contenu-conclusion img { max-width: 100%; height: auto !important; }
.contenu-article > div { margin: 0 auto; }
.contenu-article h2[style] { color: inherit; }

/* Sous-pages (liste de boutons) */
#content .sous_pages { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin: 36px 0; padding: 0; list-style: none; text-align: left; }
#content .sous_pages > li { display: block; width: auto; margin: 0; padding: 0; }
#content .sous_pages > li > a { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 26px 24px; border-radius: 0; background: var(--dark); color: #fff; font-family: var(--font-title); font-size: 18px; letter-spacing: -.02em; text-transform: none; transition: background .2s, transform .2s; }
#content .sous_pages > li > a::after { content: "\2192"; font-family: var(--font-body); }
#content .sous_pages > li > a:hover { background: var(--red); transform: translateY(-2px); }

/* Galeries photos : liste de galeries */
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; margin: 20px 0 40px; }
.gallery-item { width: auto; padding: 0; border-radius: 0; background: #fff; text-align: left; box-shadow: none; transition: transform .25s; }
.gallery-item:hover { transform: translateY(-4px); box-shadow: none; }
.gallery-item a { display: block; color: var(--ink); }
.gallery-item img { display: block; width: 100%; height: 220px; border-radius: 0; object-fit: cover; filter: grayscale(.5); transition: filter .3s; }
.gallery-item:hover img { transform: none; filter: none; }
.gallery-item p { margin: 0; padding: 18px 20px; font-family: var(--font-title); font-size: 18px; font-weight: 500; letter-spacing: -.02em; }

/* Galerie photos (maçonnerie) */
.galerie_pin { width: 100%; }
.galerie_pin > div { column-count: 3; column-gap: 16px; }
.galerie_pin > div > div { margin-bottom: 16px; break-inside: avoid; }
.galerie_pin .images { position: relative; overflow: hidden; background: var(--dark-card); box-shadow: none; }
.galerie_pin .images img { display: block; width: 100%; margin: 0 !important; padding: 0 !important; box-shadow: none; filter: grayscale(.5); transition: filter .3s, transform .5s; }
.galerie_pin .images:hover img { filter: none; transform: scale(1.03); }
.galerie_pin .images .overlay-image { top: 0; opacity: 0; background: linear-gradient(0deg, rgba(20,22,22,.78), transparent 70%); }
.galerie_pin .images a:hover .overlay-image { opacity: 1; top: 0; }

/* Liste de galeries (vignettes) */
#galerie-liste > li { background: var(--dark-card); }
#galerie-liste > li .titre { border-radius: 0; background: rgba(20,22,22,.82); font-family: var(--font-title); font-size: 16px; }

/* Blog */
.blog-categories { margin: 0 0 24px; }
.blog-categories > ul > li > a, .blog-article-categorie, .blog-articles .blog-article-categorie { border-radius: 0; background: var(--red); color: #fff !important; padding: 3px 10px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.blog-articles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0 0 20px; }
.blog-article { position: relative; height: 300px; overflow: hidden; border-radius: 0; background: var(--dark-card); box-shadow: none; }
.blog-article::after { background: linear-gradient(0deg, rgba(13,16,16,.92), rgba(13,16,16,.05) 72%); }
.blog-article > img { filter: grayscale(.5); transition: filter .4s, transform .6s; }
.blog-article:hover > img { transform: scale(1.05); filter: none; }
.blog-article > span { padding: 22px; font-family: var(--font-title); font-size: 20px; line-height: 1.2; letter-spacing: -.02em; }
.blog-article-date, .blog-article-couverture > div > time { color: #cbd0cd; }
.blog-article-couverture { position: relative; height: 440px; margin-top: 0; border-radius: 0; background: var(--dark-card); overflow: hidden; }
.blog-article-couverture > a, .blog-article-couverture > a:focus { left: 24px; top: 24px; }
.blog-article-couverture > div { left: 30px; bottom: 30px; width: calc(100% - 60px); max-width: 720px; }
.blog-article-couverture > div > h1 { color: #fff; font-size: clamp(30px, 4vw, 52px); }
.blog-article-couverture > span { border-radius: 0; background: var(--paper); }
.blog-article-accroche { padding: 30px 0 10px; font-family: var(--font-title); font-size: 21px; font-weight: 500; line-height: 1.5; letter-spacing: -.02em; color: var(--ink); }
.blog-article-sommaire { margin: 28px 0; padding: 22px 26px; border: 0; border-left: 3px solid var(--red); border-radius: 0; background: #fff; box-shadow: none; }
.blog-article-sommaire .titre { font-family: var(--font-title); font-size: 18px; }
.blog-article-sommaire a { color: var(--ink); }
.blog-article-sommaire a:hover { color: var(--red); }

/* Blog : cartes d'articles (texte superposé à l'image) */
a.blog-article { display: block; color: #fff; text-decoration: none; }
.blog-article > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; margin: 0 !important; object-fit: cover; z-index: 1; }
.blog-article::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.blog-article > span { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: block; width: auto; padding: 24px; color: #fff; }
.blog-article-categorie { display: inline-block; margin-right: 8px; }
.blog-article-date { font-size: 12px; color: #cbd0cd; }
.blog-article-titre { margin-top: 10px; font-family: var(--font-title); font-size: 21px; font-weight: 500; line-height: 1.2; letter-spacing: -.025em; color: #fff; }

/* Vidéos : cartes avec vignette, titre visible et bouton lecture */
.item { display: inline-block; position: relative; float: none; vertical-align: top; width: calc((100% - 37px) / 3); margin: 6px; overflow: hidden; background: var(--dark-card); }
.item a { display: block; position: relative; color: #fff; text-decoration: none; }
.item-image { position: relative; height: auto; padding-top: 62%; overflow: hidden; transform: none; }
.item-image::before { display: none; }
.item-image img, .item-image img.landscape, .item-image img.portrait { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; margin: 0 !important; object-fit: cover; transform: none; filter: grayscale(.6); transition: filter .4s, transform .6s; }
.item:hover .item-image img { filter: none; transform: scale(1.05); }
.item-image::after { content: ""; position: absolute; left: 50%; top: 50%; z-index: 2; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") center / 28px no-repeat; transition: transform .25s, background-color .25s; }
.item:hover .item-image::after { transform: scale(1.1); background-color: var(--red-dark); }
.item::after { display: none; }
.item .item-text { position: absolute; left: 0; right: 0; bottom: 0; top: auto; z-index: 3; padding: 40px 20px 18px; opacity: 1; text-align: left; background: linear-gradient(0deg, rgba(20,22,22,.85), transparent); transform: none; transition: none; }
.item .item-text-wrapper { position: static; width: auto; transform: none; }
.item .item-text-title { display: block; padding: 0; margin: 0; font-family: var(--font-title); font-size: 18px; font-weight: 500; line-height: 1.25; letter-spacing: -.02em; text-align: left; color: #fff; }

/* Blog : couverture d'un article */
.blog-article-couverture > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; z-index: 1; margin: 0 !important; filter: grayscale(.35); }
.blog-article-couverture::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(0deg, rgba(13,16,16,.92), rgba(13,16,16,.12) 70%); }
.blog-article-couverture > a, .blog-article-couverture > div, .blog-article-couverture > span { z-index: 3; }
.blog-article-couverture > a { position: absolute; }
.blog-article-couverture > span { position: absolute; right: 20px; bottom: 20px; padding: 6px 8px; color: var(--muted); }
.blog-article-couverture > span > ul > li > a { color: var(--muted); }
.blog-article-couverture > div { position: absolute; }
.blog-article-couverture > span > ul { display: inline-flex; gap: 4px; margin: 0; padding: 0; list-style: none; vertical-align: middle; }
.blog-article-couverture > span > ul > li { margin: 0; padding: 0; }

/* Actualités */
#actualites-liste h2 { margin: 0 0 14px; padding: 0 !important; border: 0; text-align: left; }
#actualites-liste > div > a { margin: 0 0 22px; background: #fff; color: var(--ink); }
#actualites-liste > div > a > div > h2 { font-family: var(--font-title); font-size: 18px; letter-spacing: -.02em; text-transform: none; color: var(--ink); }
.actualite-date { background: #fff; }
.actualite-titre { font-family: var(--font-title); font-size: 18px; text-transform: none; color: var(--ink); }
.actualites-content img { height: auto; max-height: 520px; }

/* FAQ */
#faq { margin: 0; padding: 0; list-style: none; font-weight: 500; }
#faq > li { margin: 0; padding: 0; border-top: 1px solid var(--line); background: transparent; }
#faq > li:last-child { border-bottom: 1px solid var(--line); }
#faq > li > .question { padding: 20px 40px 20px 0; position: relative; font-family: var(--font-title); font-size: 19px; font-weight: 500; letter-spacing: -.02em; cursor: pointer; }
#faq .question > i { display: none; }
#faq > li > .question::after { content: "+"; position: absolute; right: 4px; top: 50%; margin-top: -14px; color: var(--red); font-family: var(--font-body); font-size: 26px; line-height: 1; }
#faq > li.select > .question::after { content: "\2212"; }
#faq > li > .reponse { padding: 0 0 22px; font-style: normal; font-weight: 400; color: #4f5758; max-width: 760px; }
.acordeon > li > div:first-child > i { border-radius: 0; background: transparent; color: var(--red); }
.acordeon > li.select > div:first-child > i { border-radius: 0; background: var(--red); color: #fff; }

/* Avis (page dédiée) */
.avis-liste { margin: 10px 0; column-count: 3; column-gap: 18px; padding: 0; }
.avis { display: inline-block; width: 100%; margin: 0 0 18px; padding: 28px; border: 0; border-top: 3px solid var(--red); border-radius: 0; background: #fff; }
.avis .titre { padding: 4px 0; font-family: var(--font-title); font-weight: 600; text-align: left; }
.avis .date { padding: 2px 0; font-size: 12px; font-style: normal; color: var(--muted); text-align: left; }
.avis .stars { padding: 4px 0; margin: 6px 0; font-size: 14px; text-align: left; }
.avis .message { padding: 4px 0; font-size: 14px; color: #4f5758; }
#avis { list-style: none; margin: 0; padding: 0; }
#avis > li { margin: 0 0 16px; padding: 26px 28px; border-radius: 0; border-top: 3px solid var(--red); background: #fff; }
#avis > li:nth-child(odd):before, #avis > li:nth-child(even):before { display: none; }
#avis > li .titre { font-family: var(--font-title); font-size: 20px; color: var(--ink); }
#avis > li .date { font-size: 12px; font-style: normal; color: var(--muted); }
#avis > li .reponse { margin-top: 16px; padding: 16px 18px; border: 0; border-radius: 0; background: var(--dark); color: #e5e8e5; }
.note > i { font-size: 16px; }

/* Partenaires / documents / vidéos */
#partenaires-liste > li { border: 1px solid var(--line); background: #fff; }
#partenaires-liste > li:hover { box-shadow: none; border-color: var(--red); }
#partenaires-liste > li > a > .partenaires-liste-titre { color: var(--ink); }
#page-partenaires { background: var(--band); }
#galerie-partenaires .slick-slide img { max-width: 160px; max-height: 120px; margin: 0 auto; filter: grayscale(1); opacity: .8; transition: filter .3s, opacity .3s; }
#galerie-partenaires .slick-slide img:hover { filter: none; opacity: 1; }
#documents { list-style: none; margin: 0 0 24px; padding: 0; }
#documents > li { margin: 0 0 8px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 0; background: #fff; transition: border-color .2s; }
#documents > li:hover { background: #fff; border-color: var(--red); }
#form_document_otp input[type='text'] { width: 44px; border: 1px solid var(--line); background: #fff; border-bottom: 2px solid var(--red); }
#charte > div { margin-bottom: 30px; }
#charte h2 { margin: 1.2em 0 .5em !important; padding: 0 !important; border: 0; font-size: clamp(24px, 2.6vw, 32px); text-align: left; }
#charte, #mentions { color: #4f5758; line-height: 1.8; }
#mentions { font-size: 15px; }
#mentions > div { padding: 24px; background: #fff; }
#mentions h2, #mentions h3 { margin: 0 0 12px; text-align: left; font-size: 20px; }
.titre-article { margin: 0; padding: 0 !important; border: 0 !important; font-size: clamp(26px, 3vw, 38px); color: var(--ink); }
.contenu-article [style*="background-color: #FFFFFF"] { background-color: transparent !important; }
.slider_galerie > div:first-child { background: var(--dark-card); }
.slider_galerie > div:first-child+div { background: #e9e9e5; }
.nuage { margin-top: 24px; }

/* Panier / produits */
.cart-items, .cart-summary, .delivery-box { border-radius: 0; background: #fff; box-shadow: none; border: 1px solid var(--line); }
.cart-summary { top: calc(var(--header-h) + var(--topbar-h) + 20px); }
.product-block { border-radius: 0; border: 1px solid var(--line); background: #fff; }
.delivery-form input[type="text"], .delivery-form input[type="tel"], .delivery-form input[type="email"] { border: 0; border-bottom: 1px solid #c9cbc8; border-radius: 0; background: transparent; }
.product-page .caracteristics { border-radius: 0; box-shadow: none; border: 1px solid var(--line); background: #fff; }
.avantage { border-radius: 0; border: 1px solid var(--line); background: #fff; }
.avantage > i { color: var(--red); }

/* =====================================================================
   PIED DE PAGE
   ===================================================================== */
#footer { background: var(--darker); color: #e5e8e5; font-size: 13px; }
#footer > div { position: relative; }
#footer a { color: #9ea5a2; text-decoration: none; }
#footer a:hover { color: var(--red-light); text-decoration: none; }
#footer > .container:first-child {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 36px 30px;
	padding-top: 64px;
	padding-bottom: 44px;
}
#logoFooter { display: block; padding: 0; height: auto; }
#logoFooter > img { display: block; height: 76px; width: auto; max-width: 220px; padding: 8px 14px; background: #f5f5f2; object-fit: contain; }
.reseaux { grid-column: 2; justify-self: end; }
.reseaux .container { display: flex; align-items: center; justify-content: flex-end; gap: 9px; padding: 0 !important; max-width: none; }
.reseaux a { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid #434a48; font-size: 16px; color: #e5e8e5; transition: background .2s, border-color .2s; }
.reseaux a:hover { background: var(--red); border-color: var(--red); color: #fff; }
.social-title { display: block; margin: 0 14px 0 0; }
.social-title::before, .social-title::after { display: none; }
.social-title span { font-size: 11px; font-weight: 700; letter-spacing: .12em; color: #9ea5a2; }
#footer .row { grid-column: 1 / -1; margin: 0; padding: 30px 0 0; border-top: 1px solid #343a39; font-size: 13px; }
.col-L { width: 100%; }
.col-L ul { display: flex; flex-wrap: wrap; gap: 12px 36px; margin: 0; padding: 0; list-style: none; justify-content: flex-start; }
.col-L ul li { margin: 0; }
.col-L ul li a { font-size: 13px; font-weight: 500; color: #c4cbc8; }
#footer > .container:last-child { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 30px; padding-top: 22px; padding-bottom: 28px; }
#footer > .container:last-child::before { content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 1px; background: #343a39; }
#footer .row > * { display: block !important; width: auto !important; padding: 0 !important; }
#footer #infos_site, #footer #infos_complementaires { position: static; padding: 0; font-size: 11.5px; color: #747d79; }
#footer #infos_complementaires a { color: #9ea5a2; }
#footer #infos_complementaires a:hover { color: var(--red-light); }

/* Pop-up « Demande de rappel » (colorbox / iframe) */
body.popup { padding: 22px 28px 28px; background: #f3f3f0 !important; overflow-x: hidden; }
body.popup h1 { margin: 6px 0 14px; font-size: 30px; text-align: center; letter-spacing: -.04em; }
body.popup fieldset > ul > li { display: block; width: 100%; }
body.popup .button, body.popup .bouton { width: 100%; }

/* Tarteaucitron / cookies : ne pas masquer le bouton flottant */
#tarteaucitronRoot { font-family: var(--font-body); }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 1240px) {
	#header > .container { gap: 18px; }
	#menu > ul > li > a { padding: 0 11px; }
	#slider_accueil .slide-contenu > .container > div { max-width: 560px; }
}

@media (max-width: 1100px) {
	:root { --band-pad: 90px; }
	/* La carte du héro passe sous le slider */
	.slider-rappel {
		position: relative;
		top: auto; right: auto;
		z-index: 4;
		display: grid;
		grid-template-columns: minmax(180px, 1fr) 2.4fr;
		align-items: end;
		gap: 10px 36px;
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 34px max(var(--gutter), calc((100% - var(--wrap)) / 2));
		transform: none;
		box-shadow: none;
	}
	.slider-rappel > div:first-child { margin: 0; }
	.slider-rappel h2, .slider-rappel .title-rappel { margin: 0 !important; padding: 0 !important; border: 0; font-size: 30px !important; }
	.slider-rappel > .clear { display: none; }
	.slider-rappel ul { display: grid; grid-template-columns: repeat(3, 1fr) auto; gap: 0 22px; align-items: end; }
	.slider-rappel ul > li { width: auto; }
	.slider-rappel ul > li .button, .slider-rappel ul > li button { margin: 0 !important; white-space: nowrap; }
	.slider-rappel .notification { grid-column: 1 / -1; }
	.bloc-image-seule { grid-template-columns: 1fr; min-height: 0; }
	.bloc-image-seule .slider-rappel { display: none; }
	.bloc-image-seule { display: none; }
	:root { --hero-h: clamp(560px, 86vh, 760px); }
	#slider_accueil .boutonsPagination { bottom: auto !important; top: calc(var(--hero-h) - 40px) !important; }
	#slider_accueil .CJSlider-navigation-gauche, #slider_accueil .CJSlider-navigation-droite { bottom: auto !important; top: calc(var(--hero-h) - 66px) !important; }
}

@media (max-width: 1000px) {
	:root { --gutter: 28px; --header-h: 78px; }
	.band-intro { display: block; padding: 84px var(--gutter) 64px; }
	.band-intro > .container:nth-child(2) { padding-top: 30px; }
	.band-intro > .center { margin-top: 8px !important; }
	.band-intro > .bloc-icones { margin-top: 56px; }
	#header > .container { gap: 12px; height: var(--header-h); }
	.burger { display: block; }
	#menu { margin-left: auto; height: auto; }
	#menu > ul {
		position: absolute;
		top: 100%; left: 0; right: 0;
		display: none;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		height: auto;
		max-height: calc(100vh - var(--header-h) - var(--topbar-h));
		max-height: calc(100dvh - var(--header-h) - var(--topbar-h));
		padding: 8px var(--gutter) 30px;
		overflow-y: auto;
		background: #fafaf8;
		box-shadow: 0 24px 40px rgba(20, 24, 26, .18);
		border-top: 1px solid var(--line);
	}
	body.nav-open #menu > ul { display: flex; }
	body.nav-close #menu > ul { display: none; }
	#menu > ul > li { display: block; height: auto; border-bottom: 1px solid var(--line); }
	#menu > ul > li > a { height: auto; padding: 17px 0; font-size: 15px; }
	#menu > ul > li > a::after { display: none; }
	#menu > ul > li > a > .fa-angle-down.down1 { display: grid; place-items: center; position: absolute; top: 0; right: 0; width: 56px; height: 100%; font-size: 18px; transition: transform .25s; }
	#menu > ul > li > a > .fa-angle-down.down2 { display: none; }
	#menu > ul > li.sous-menu > a { padding-right: 56px; }
	#menu > ul > li.open > a > .fa-angle-down.down1 { transform: rotate(180deg); }
	#menu > ul > li:hover > a > .fa-angle-down.down1 { transform: none; }
	#menu > ul > li.open:hover > a > .fa-angle-down.down1 { transform: rotate(180deg); }
	#menu > ul > li:first-child > a .fa-home-lg::before { content: "Accueil"; font-family: var(--font-body); font-weight: 600; font-size: 15px; }
	#menu > ul > li > ul { position: static; display: none; min-width: 0; padding: 0 0 12px 14px; border: 0; box-shadow: none; background: transparent; opacity: 1; visibility: visible; transform: none; }
	#menu > ul > li > ul > li > a { padding: 9px 0 9px 14px; font-size: 14px; color: var(--muted); border-left: 2px solid var(--line); }
	.slogan { max-width: 130px; }
	#header_top > .container > span:nth-child(n+4) { display: none; }
	#header_top > .container > span:nth-child(3) { display: none; }
	.bloc3d { grid-template-columns: repeat(2, 1fr); }
	.bloc3d > li:last-child:nth-child(3n+1) { grid-column: auto; height: 420px; }
	.bloc3d > li:last-child:nth-child(odd) { grid-column: 1 / -1; height: 340px; }
	.blog-articles { grid-template-columns: repeat(2, 1fr); }
	.item { width: calc((100% - 25px) / 2); }
	.avis-liste { column-count: 2; }
	.galerie_pin > div { column-count: 2; }
	#page-horaires { grid-template-columns: 1fr; }
	#page-horaires > iframe { min-height: 320px; height: 320px !important; }
	#page-horaires .container.absolute { padding: 50px var(--gutter) !important; }
	.slider-rappel ul { grid-template-columns: 1fr 1fr; gap: 0 22px; }
	.slider-rappel ul > li:last-child { grid-column: 1 / -1; margin-top: 12px; }
	.slider-rappel { grid-template-columns: 1fr; gap: 14px; }
	#footer > .container:first-child { grid-template-columns: 1fr; }
	.reseaux { grid-column: 1; justify-self: start; }
	.reseaux .container { justify-content: flex-start; }
}

@media (max-width: 760px) {
	:root { --gutter: 20px; --header-h: 68px; --topbar-h: 34px; --band-pad: 68px; }
	body { font-size: 15px; }
	#header_top > .container { gap: 4px 14px; }
	#header_top > .container > span:first-child { margin-right: auto; }
	#header_top > .container > span:nth-child(2) { display: inline-flex; }
	#logo > img { height: 50px; max-width: 120px; }
	.slogan { font-size: 9px; max-width: 105px; }
	#content > .container:first-child, #content > .container.fadeIn { padding-top: 36px; }

	:root { --hero-h: 600px; }
	#slider_accueil .slide-contenu { align-items: flex-end; padding: calc(var(--header-h) + var(--topbar-h) + 10px) 0 76px; }
	#slider_accueil .slide-texte1 { margin: 16px 0 16px; font-size: clamp(34px, 10.4vw, 48px); }
	#slider_accueil .slide-texte2 { font-size: 14.5px; }
	#slider_accueil .boutonsPagination { top: calc(var(--hero-h) - 36px) !important; }
	#slider_accueil .CJSlider-navigation-gauche, #slider_accueil .CJSlider-navigation-droite { display: none !important; }

	.slider-rappel { padding: 30px var(--gutter) 34px; }
	.slider-rappel ul { grid-template-columns: 1fr; }
	.slider-rappel h2, .slider-rappel .title-rappel { font-size: 28px !important; }

	.band-intro { padding-top: 64px; padding-bottom: 56px; }
	.band-intro h1 { margin-bottom: 28px; }
	.band-intro .container > p, .band-intro .container > ul { font-size: 15px; }
	.band-intro .bloc-icones { margin-top: 48px; }
	.bloc-icones { grid-template-columns: 1fr 1fr; padding-top: 26px; row-gap: 24px; }
	.bloc-icones-border { padding-right: 12px; }
	.bloc-icones-border + .bloc-icones-border { padding-left: 14px; }
	.bloc-icones-border:nth-child(3) { padding-left: 0; border-left: 0; }
	.bloc-icones .main { font-size: 32px; }
	.bloc-icones i + .main { font-size: 18px; }
	#content > .bloc-icones { padding-top: 40px; padding-bottom: 40px; }

	.band-devis { padding-top: 56px; padding-bottom: 56px; }
	.band-devis > .container { padding-left: 0; padding-right: 0; }
	.devis-container { padding: 28px var(--gutter) !important; }
	fieldset > ul > li, fieldset > .contenu > ul > li { display: block; width: 100%; }
	fieldset > ul > li .input { padding-right: 0; }
	.step-bar .step + .step { margin-left: 28px; }
	.step + .step::before { width: 28px; }
	.step-buttons .button { min-width: 0; flex: 1; }

	.service_bloc { padding-top: var(--band-pad); padding-bottom: var(--band-pad); }
	.bloc3d { grid-template-columns: 1fr; gap: 14px; }
	.bloc3d > li, .bloc3d > li:last-child:nth-child(odd) { height: 330px; }
	.bloc3d .titre-bloc { padding: 22px; font-size: 22px; }

	.slick-slider-contenu img { height: 260px !important; }
	.slick-prev { left: 4px; } .slick-next { right: 4px; }
	.container-picto { grid-template-columns: 1fr 1fr; row-gap: 24px; }
	.container-picto .col-3 { padding-right: 12px; }
	.container-picto .col-3 + .col-3 { padding-left: 14px; }
	.container-picto .col-3:nth-child(3) { padding-left: 0; border-left: 0; }
	.container-picto .col-3 img { width: 44px; height: 44px; }
	.container-picto .col-3 h3 { font-size: 15px; }
	.page-picto { padding-bottom: 60px; }
	#content > .center { padding-top: 50px; }

	.band-avis { padding-top: 64px; padding-bottom: 56px; }
	.box_avis { min-height: 0; padding: 24px 22px !important; }

	.tetiere { min-height: 300px; padding: 36px 24px; margin-bottom: 28px; }
	.blog-articles { grid-template-columns: 1fr; }
	.blog-article { height: 260px; }
	.item { width: calc(100% - 12px); }
	.blog-article-couverture { height: 340px; }
	.blog-article-couverture > div { left: 20px; bottom: 20px; width: calc(100% - 40px); }
	.avis-liste { column-count: 1; }
	.galerie_pin > div { column-count: 1; }
	#galerie-liste > li { width: calc(50% - 10px); padding-top: 38%; }
	.ariane { margin-bottom: 22px; }
	.contenu-accroche { font-size: 17px; }
	.contenu-texte, .contenu-conclusion, .contenu-article-texte { font-size: 15.5px; }
	.contenu-article.hero.image { min-height: 240px; }
	#content .sous_pages { grid-template-columns: 1fr; }
	.contenu-article td { padding: 8px 6px; }
	.row > * { display: block !important; width: auto !important; padding: 0 !important; }
	.row { margin: 0; }
	.cart-container, .product-page { flex-direction: column; }
	.cart-summary { width: 100%; min-width: 0; position: static; }
	.cart-item { display: block; }
	.delivery-box { width: 100%; }
	.product-image { max-width: 100%; }
	.mentions > div, #mentions > div:first-child, #mentions > div:first-child+div { display: block; width: auto; margin: 10px 0; }

	#footer > .container:first-child { padding-top: 48px; padding-bottom: 32px; }
	.col-L ul { gap: 10px 24px; }
	#footer > .container:last-child { flex-direction: column; align-items: flex-start; }
	.container-fixe { right: 12px; bottom: 12px; }
	.container-fixe > a { writing-mode: horizontal-tb; padding: 13px 18px; letter-spacing: .06em; }
	.container-fixe i { margin: 0 0 0 10px; }
	.liste { max-width: none; }
}

@media (max-width: 420px) {
	#header_top .fal.fa-phone + a, #header_top > .container > span:nth-child(2) i { font-size: 12px; }
	#header_top a.bouton { padding: 4px 8px !important; }
	.slider-rappel h2, .slider-rappel .title-rappel { font-size: 26px !important; }
	.bloc-icones .main { font-size: 28px; }
	#galerie-liste > li { width: calc(100% - 10px); padding-top: 60%; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* =====================================================================
   ACCUEIL : éléments centrés
   ===================================================================== */
.band-intro { display: block; padding: 100px var(--gutter) 80px; text-align: center; }
.band-intro > .container { max-width: 880px; margin: 0 auto; padding: 0; }
.band-intro > .container:nth-child(2) { padding-top: 26px; }
.band-intro h1, .band-intro .container > h2 { text-align: center; margin-left: auto; margin-right: auto; }
.band-intro h1::before { margin-left: auto; margin-right: auto; }
.band-intro .container > ul { text-align: center; }
.band-intro > .center { margin: 14px auto 0 !important; text-align: center; }
.band-intro > .bloc-icones { max-width: calc(var(--wrap) + var(--gutter) * 2); margin: 70px auto 0; }

.bloc-icones-border { align-items: center; text-align: center; padding: 4px 20px; }
.bloc-icones-border + .bloc-icones-border { padding-left: 20px; }
.container-picto .col-3 { align-items: center; text-align: center; padding: 28px 20px 4px; }
.container-picto .col-3 + .col-3 { padding-left: 20px; }
.container-picto .col-3 h3 { text-align: center; }

.band > .container > h2, .band > .container > h2 + hr, .service_bloc h2, #content > .center { text-align: center; }
.band > .container > hr, .band-avis hr, .band-galerie hr { margin-left: auto; margin-right: auto; }
.band-avis center, .band-avis .center-link { text-align: center; }
.band-avis center .button { margin: 0 auto !important; }

.devis-container h2, .devis-container hr + div > p, .devis-container p { text-align: center !important; }
.devis-container hr { margin-left: auto; margin-right: auto; }
.step-bar { justify-content: center; }
.devis-container fieldset > ul > h3, .devis-container fieldset > h3 { text-align: center; }

#page-horaires .container.absolute { text-align: center; }
#page-horaires h2 { text-align: center; }
#page-horaires hr { margin-left: auto; margin-right: auto; }
#page-horaires .liste { margin: 0 auto; }

/* Bouton « Précédent » du formulaire : texte blanc lisible */
#btnAvant, #btnAvant[style] { background: var(--dark) !important; color: #fff !important; border: 0 !important; }
#btnAvant:hover, #btnAvant[style]:hover { background: var(--ink) !important; color: #fff !important; }
.step-buttons { align-items: center; }

@media (max-width: 760px) {
	.band-intro { padding: 64px var(--gutter) 56px; }
	.bloc-icones-border { padding: 4px 10px; }
	.bloc-icones-border + .bloc-icones-border { padding-left: 10px; }
	.container-picto .col-3 { padding: 22px 10px 4px; }
	.container-picto .col-3 + .col-3 { padding-left: 10px; }
	.container-picto .col-3:nth-child(3), .bloc-icones-border:nth-child(3) { padding-left: 10px; }
}
.step-buttons { justify-content: center; gap: 14px; }

/* Mobile : bouton « Devis gratuit » compact (icône seule) pour ne pas masquer le contenu */
@media (max-width: 760px) {
	.container-fixe { right: 14px; bottom: 14px; border-radius: 50%; }
	.container-fixe > a { width: 54px; height: 54px; padding: 0; justify-content: center; font-size: 0; letter-spacing: 0; border-radius: 50%; }
	.container-fixe i { margin: 0; font-size: 20px; }
	#page-horaires > iframe { height: 260px !important; min-height: 260px; }
}

/* Tablette : pictos et chiffres sur 2 colonnes */
@media (max-width: 900px) {
	.bloc-icones, .container-picto { grid-template-columns: 1fr 1fr; row-gap: 26px; }
	.bloc-icones-border:nth-child(odd), .container-picto .col-3:nth-child(odd) { border-left: 0; }
	.bloc-icones-border:nth-child(even), .container-picto .col-3:nth-child(even) { border-left: 1px solid var(--line); }
	.container-picto .col-3 { border-top: 0; }
}

@media (max-width: 1000px) { #menu > ul > li.open > ul { display: block; } #menu > ul > li > ul { display: none; } #menu > ul > li.open > ul { display: block; } }

/* Avis : flèches précédent / suivant, de part et d'autre du bouton « Tous les avis » */
.band-avis .slick-prev, .band-avis .slick-next { top: auto; bottom: -92px; width: 48px; height: 48px; margin: 0; transform: none; border: 1px solid var(--dark); background: transparent; opacity: 1; z-index: 6; }
.band-avis .slick-prev { left: 0; right: auto; }
.band-avis .slick-next { right: 0; left: auto; }
.band-avis .slick-prev.slick-disabled, .band-avis .slick-next.slick-disabled { opacity: .35; cursor: default; }
.band-avis .slick-prev:before, .band-avis .slick-next:before { opacity: 1; color: var(--dark); line-height: 46px; }
.band-avis .slick-prev:not(.slick-disabled):hover, .band-avis .slick-next:not(.slick-disabled):hover { background: var(--red); border-color: var(--red); }
.band-avis .slick-prev:not(.slick-disabled):hover:before, .band-avis .slick-next:not(.slick-disabled):hover:before { color: #fff; }
@media (max-width: 860px) { .band-avis #slide_avis.slick-slider { margin-bottom: 0; } .band-avis .slick-prev, .band-avis .slick-next { bottom: -90px; } }

/* Page Avis : formulaire « Ajouter un avis » centré */
#content .container > h2:has(+ .bloc) { margin: 70px 0 10px; text-align: center; }
#content .container > h2:has(+ .bloc)::after { content: ""; display: block; width: 48px; margin: 22px auto 0; border-top: 2px solid var(--red); }
#content .bloc { width: 100%; max-width: 760px; margin: 30px auto 0; padding: 40px 44px; border: 0; border-top: 4px solid var(--red); border-radius: 0; background: #fff; text-align: center; }
#content .bloc fieldset > ul > li { display: block; width: 100%; }
#content .bloc fieldset > ul > li .input { padding: 0 0 18px; text-align: left; }
#content .bloc fieldset > ul > li .input > label { margin-bottom: 7px; padding: 0; }
#content .bloc input[type='text'], #content .bloc textarea { padding: 13px 14px; border: 1px solid #d3d5d1; background: #fff; }
#content .bloc input:focus, #content .bloc textarea:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(216, 51, 47, .12); }
#content .bloc .note { display: flex; justify-content: center; gap: 6px; font-size: 26px; }
#content .bloc .note i { cursor: pointer; font-size: 26px; }
#content .bloc li.double.center { text-align: center; }
#content .bloc li.double.center label { display: block; margin-bottom: 8px; font-size: 13px; text-transform: none; letter-spacing: 0; color: var(--muted); }
#content .bloc #captchagc { margin: 10px auto; }
@media (max-width: 760px) { #content .bloc { padding: 28px 20px; } }
#content .bloc fieldset > ul > li .input:has(.note) > label { text-align: center; }

/* Chaque article / bloc de contenu contient ses propres images flottantes (elles ne débordent plus sur l'article suivant) */
.contenu-article, .contenu-article > div, .contenu-article > div > div,
.contenu-texte, .contenu-accroche, .contenu-conclusion, .contenu-article-texte,
.blog-article-paragraphe, .actualite-texte { display: flow-root; }
.contenu-article { clear: both; }
.contenu-article:not(.image) > div > div { padding-top: 40px; padding-bottom: 40px; }
@media (max-width: 760px) {
	.contenu-article:not(.image) > div > div { padding-top: 36px; padding-bottom: 36px; }
	/* Sur mobile, les images flottantes passent au-dessus / en dessous du texte */
	#content .contenu-article img[align], #content .contenu-texte img[align], #content .contenu-article img[style*="float"], #content .contenu-texte img[style*="float"] { float: none !important; display: block; margin: 16px auto !important; max-width: 100%; }
}
