@charset "UTF-8";
@import url(main.css);
h1.display-4.fw-bold.bandeauTitre.titles.text-color-seventh { color: #3c2554 !important; }

h2.display-6.fw-bold.p-3.pt-lg-3.m-0.titles { color: #3c2554; }

div.shadow-lg { box-shadow: none !important; }

.navbar-brand { height: 9vh !important; width: 9vw !important; }

.logo_nav { height: 8vh !important; }

.services { padding: 2rem 1.5rem; background-color: #fff7ec; }

.services-container { max-width: 1200px; margin: 0 auto; }

.services h2 { text-align: center; margin-bottom: 3.5rem; color: #3c2554; font-weight: 700 !important; }

.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2rem; }

.service-content h3 { font-size: 1.6rem; margin-bottom: 0.8rem; color: #3c2554; font-weight: 600 !important; }

.service-content p { font-size: 1.1rem; color: #01174f; }

/* CARTE – état normal */
.service-card { background-color: #3c2554; padding: 2.5rem 1.5rem; border-radius: 8px; text-decoration: none; /* couleur pilote pour le SVG */ color: #faa42c; text-align: center; position: relative; overflow: hidden; transition: background-color 0.45s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1); }

.service-card:link, .service-card:visited { color: #faa42c; text-decoration: none; }

/* Icône hérite toujours */
.service-card svg { color: inherit; transition: color 0.3s ease; }

/* CARTE – hover / focus */
.service-card:hover, .service-card:focus-visible { background-color: #faa42c !important; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25); /* couleur pilote icône + texte */ color: #3c2554 !important; }

/* SVG – plus grand */
.service-card svg { width: 104px; height: 104px; display: block; margin: 0 auto; transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1); }

/* Héritage couleur SVG */
.service-card svg path { fill: currentColor; }

/* Animation icône */
.service-card:hover svg, .service-card:focus-visible svg { transform: translateY(-10px); }

/* TEXTE */
.service-content h3, .service-content p { color: currentColor; }

.service-card svg { margin-bottom: 1.2rem; }

/* Mobile : pas de hover, on montre le texte */
@media (max-width: 768px) { .service-content { opacity: 1; transform: none; } }

@media (max-width: 600px) { .services-grid { grid-template-columns: 1fr; } }

/* Contour autour de l'iframe Facebook */
.col.p-2.d-flex.justify-content-center.order-2.order-lg-1 iframe { margin: 20px auto; border: 2px solid #faa42c; border-radius: 12px; box-shadow: 0 12px 30px rgba(250, 164, 44, 0.15); overflow: hidden; }

/* Contour Instagram */
.col.p-2.d-flex.justify-content-center.order-2 iframe { border: 2px solid #faa42c; border-radius: 12px; box-shadow: 0 12px 30px rgba(250, 164, 44, 0.15); margin: 20px 0; }

.text-center.titles.text-color-sixth { padding: 30px 40px; max-width: 800px; margin: 0 auto; }

.row.mt-5.flex-lg-row, .row.mt-5.flex-lg-row-reverse { margin-top: 1rem !important; }

/* Inverser image / texte uniquement pour le bloc #reverse */
@media (min-width: 992px) { #reverse .row.flex-lg-row-reverse { flex-direction: row !important; } }

/*---------------------------------------------------------Avant - Après------------------------------*/
/*------Couleur des lignes---*/
.slider-before-after-images:before, .slider-before-after-images:after { background: #faa42c !important; }

/*------Couleur du rond---*/
.slider-before-after-images { border: 3px solid #faa42c !important; background: #faa42c !important; }

/*------Couleur des flêches---*/
.bi-chevron-left::before, .bi-chevron-right::before { color: #3c2554; }

/*-------------------------------------------------------------------------------------------Bloc réalisations---*/
.realisations-section { background: #fff7ec; padding: 60px 20px; }

.overlay { max-width: 1200px; margin: 0 auto; padding: 40px 20px; }

.realisations-main-title { text-align: center; font-size: 2.8rem; color: #3c2554; font-weight: 700; margin-bottom: 32px; font-family: 'Source Sans3', Arial, sans-serif; }

.filter-tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 32px; flex-wrap: wrap; }

.filter-btn { background: #faa42c; border: none; color: #333; font-size: 1.1rem; padding: 12px 24px; border-radius: 30px; cursor: pointer; font-weight: 600; box-shadow: none; display: flex; align-items: center; justify-content: center; min-height: 52px; line-height: 1.2; transition: background 0.2s; text-align: center; }

.filter-btn.active { background: #3c2554; color: #fff; }

button.filter-btn > p { margin-bottom: 0px !important; }

.realisations-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }

.realisation-card { border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); transition: transform 0.2s; }

.realisation-card:hover { transform: translateY(-4px); }

.realisation-card img { width: 100%; height: 320px; object-fit: cover; display: block; cursor: pointer; }

.realisation-card.hidden { display: none; }

/* Modal pour l’image agrandie */
.modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.85); align-items: center; justify-content: center; }

.modal-content { max-width: 500px; max-height: 70vh; width: auto; height: auto; border-radius: 8px; background: #fff; }

.modal-close { position: absolute; top: 24px; right: 32px; color: #fff; font-size: 36px; font-weight: bold; cursor: pointer; z-index: 1100; }

.modal-close:hover { color: #ffae42; }

@media (max-width: 900px) { .filter-tabs { gap: 8px; font-size: 0.9rem; } .filter-btn { padding: 10px 20px; font-size: 1rem; min-height: 48px; } .realisations-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; } .realisation-card img { height: 240px; } .modal-content { max-width: 90%; max-height: 90%; } }

/*# sourceMappingURL=custom.css.map */