@charset "UTF-8";
@import url(main.css);
/* ----------------------- Changer les couleurs de la ligne du header -------------------------------*/
.animated-border-button:after { background-color: #e71e24; }

/*---------------------------------------------------------
GALERIE RÉALISATIONS 
---------------------------------------------------------*/
.am-realisations { padding: 60px 20px; }

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

/*---------------------------------------------------------
TITRE
---------------------------------------------------------*/
.am-realisations__title { text-align: center; margin-bottom: 35px; }

.am-realisations__title > * { margin: 0; }

/*---------------------------------------------------------
BOUTONS FILTRES - AM MENUISERIE
---------------------------------------------------------*/
.filter-tabs { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 15px; margin-bottom: 45px; }

.filter-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid #e71e24; border-radius: 50rem; color: #e71e24; font-size: 16px; font-weight: 600; padding: 14px 28px; cursor: pointer; transition: all 0.3s ease; }

.filter-btn p { margin-bottom: 0px; }

/* HOVER */
.filter-btn:hover { background: #e71e24; border-color: #e71e24; color: #fff; }

/* BOUTON ACTIF */
.filter-btn.active { background: #e71e24; border-color: #e71e24; color: #fff; }

/*---------------------------------------------------------
GALERIE
---------------------------------------------------------*/
.realisations-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }

.realisation-card { overflow: hidden; border-radius: 0; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08); transition: transform 0.3s ease; }

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

.realisation-card img { width: 100%; height: 360px; object-fit: cover; display: block; cursor: pointer; transition: transform 0.5s ease; }

.realisation-card:hover img { transform: scale(1.04); }

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

/*---------------------------------------------------------
MODALE IMAGE
---------------------------------------------------------*/
.image-modal { display: none; position: fixed; z-index: 9999; inset: 0; background: rgba(0, 0, 0, 0.75); align-items: center; justify-content: center; padding: 40px; }

.image-modal__content { width: auto; max-width: 80vw; max-height: 80vh; object-fit: contain; border-radius: 3px; box-shadow: 0 15px 50px rgba(0, 0, 0, 0.35); }

.modal-close { position: absolute; top: 25px; right: 35px; color: #ffffff; font-size: 40px; font-weight: 400; cursor: pointer; line-height: 1; transition: color 0.3s ease; }

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

/*---------------------------------------------------------
RESPONSIVE
---------------------------------------------------------*/
@media (max-width: 991px) { .realisations-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } .realisation-card img { height: 300px; } }

/* MOBILE */
@media (max-width: 768px) { .am-realisations { padding: 40px 15px; } .am-realisations__container { padding: 25px 10px; } .filter-tabs { gap: 10px; } .filter-btn { font-size: 14px; padding: 11px 20px; min-height: 46px; } .realisations-grid { grid-template-columns: 1fr; } .realisation-card img { height: 280px; } .image-modal { padding: 20px; } .image-modal__content { max-width: 95vw; max-height: 80vh; } .modal-close { top: 15px; right: 20px; } }

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