@charset "UTF-8";
@import url(main.css);
/* ========================================================= NAVBAR ========================================================= */
nav.navbar { box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 20px -20px; color: #045786 !important; font-weight: 600; }

.animated-border-button:after { background-color: #f7d767; }

#navbarSupportedContent > div > a.button_header, #navbarSupportedContent > div > a.grow.button_header { position: relative !important; overflow: hidden !important; background-color: transparent !important; border: 2px solid #045786 !important; border-radius: 0 !important; color: #045786 !important; font-weight: 600; transition: color 0.3s ease !important; z-index: 1 !important; }

#navbarSupportedContent > div > a.button_header::before, #navbarSupportedContent > div > a.grow.button_header::before { content: "" !important; position: absolute !important; inset: 0 !important; width: 0 !important; background-color: #045786 !important; transition: width 0.35s ease !important; z-index: -1 !important; }

#navbarSupportedContent > div > a.button_header:hover, #navbarSupportedContent > div > a.grow.button_header:hover { color: #ffffff !important; }

#navbarSupportedContent > div > a.button_header:hover::before, #navbarSupportedContent > div > a.grow.button_header:hover::before { width: 100% !important; }

/* ========================================================= HERO (SECTION ACCUEIL) ========================================================= */
.fondDegradeLogo { width: 250px; height: auto; max-width: 100%; }

@media (max-width: 768px) { .fondDegradeLogo { width: 150px; } }

/* ========================================================= H1 HERO ========================================================= */
.h1, h1 { letter-spacing: 1px; }

/* ========================================================= PRESENTATION ENTREPRISE ========================================================= */
#presentation h2 span { position: relative; display: inline-block; padding-bottom: 15px; }

#presentation h2 span::after { content: ""; position: absolute; left: 0; bottom: 0; width: 10%; height: 3px; background: #f7d767; }

.button-contact { position: relative; overflow: hidden; background-color: transparent !important; border: 2px solid #045786 !important; border-radius: 0 !important; color: #045786 !important; transition: color 0.3s ease; z-index: 1; }

.button-contact::before { content: ""; position: absolute; inset: 0; width: 0; background-color: #045786; transition: width 0.35s ease; z-index: -1; }

.button-contact:hover { color: #ffffff !important; }

.button-contact:hover::before { width: 100%; }

/* ========================================================= SECTION ENGAGEMENT ========================================================= */
.engagement-card { background: rgba(0, 0, 0, 0) !important; }

.engagement-icon { width: 100px; height: 100px; object-fit: contain; filter: brightness(1.2); }

.engagement-overlay { background: rgba(0, 0, 0, 0); z-index: 0; }

#engagement h2 { position: relative; display: inline-block; background: transparent; color: #ffffff; padding-bottom: 22px; }

#engagement h2::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 250px; height: 3px; background: #f7d767; transform: translateX(-50%); }

/* ========================================================= BLOC SERVICES ========================================================= */
.bloc-k9m4-services { padding: 90px 24px; background: #f6f6f6; }

.bloc-k9m4-services__container { max-width: 1320px; margin: 0 auto; }

.bloc-k9m4-services__header { position: relative; text-align: center; margin-bottom: 60px; padding-bottom: 25px; }

.bloc-k9m4-services__header::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 120px; height: 3px; background: #f7d767; transform: translateX(-50%); }

.bloc-k9m4-services__header > * { margin: 0; }

.bloc-k9m4-services__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }

.bloc-k9m4-services__card { position: relative; min-height: 380px; background-size: cover; background-position: center; overflow: visible; border-radius: 0; display: flex; align-items: flex-end; transition: transform 0.35s ease; }

.bloc-k9m4-services__card:hover { transform: translateY(-12px); }

.bloc-k9m4-services__card:hover::before { top: -20px; left: -20px; }

.bloc-k9m4-services__card:hover::after { border: 2px solid #ffffff; }

.bloc-k9m4-services__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.65) 100%); z-index: 1; transition: opacity 0.35s ease; }

.bloc-k9m4-services__card:hover .bloc-k9m4-services__overlay { opacity: 0.8; }

.bloc-k9m4-services__content { position: relative; z-index: 3; padding: 35px; color: #ffffff; }

.bloc-k9m4-services__content > *:first-child { margin: 0 0 14px; font-size: 28px; line-height: 1.2; }

.bloc-k9m4-services__content > *:last-child { margin: 0; font-size: 16px; line-height: 1; /* était 1.7 dans la 1ère déclaration, écrasé par la 2ème */ }

.bloc-k9m4-services__content ul { list-style: none; padding: 0; margin: 12px 0 0; }

.bloc-k9m4-services__content li { position: relative; padding-left: 18px; margin-bottom: 6px; line-height: 1; }

.bloc-k9m4-services__content li::before { content: ""; position: absolute; left: 0; top: 0.65em; width: 6px; height: 6px; background: #f7d767; transform: translateY(-50%); }

@media screen and (max-width: 1024px) { .bloc-k9m4-services__grid { grid-template-columns: repeat(2, 1fr); } .bloc-k9m4-services__header > * { font-size: 34px; } }

@media screen and (max-width: 768px) { .bloc-k9m4-services { padding: 70px 20px; } .bloc-k9m4-services__grid { gap: 28px; } .bloc-k9m4-services__card { min-height: 340px; } }

@media screen and (max-width: 640px) { .bloc-k9m4-services__grid { grid-template-columns: 1fr; } .bloc-k9m4-services__header > * { font-size: 28px; } .bloc-k9m4-services__content { padding: 28px; } .bloc-k9m4-services__content > *:first-child { font-size: 24px; } }

/* ========================================================= BLOC ZONE D'INTERVENTION ========================================================= */
.jb-isoplac-zone { width: 100%; padding: 70px 20px; background: #ffffff; box-sizing: border-box; }

.jb-isoplac-zone__container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 90px); align-items: center; }

.jb-isoplac-zone__image { width: 100%; height: clamp(420px, 42vw, 640px); overflow: hidden; }

.jb-isoplac-zone__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.jb-isoplac-zone__content { min-height: clamp(420px, 42vw, 640px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }

.jb-isoplac-zone__title-small { position: relative; display: inline-block; margin: 0 0 14px 0; padding-bottom: 6px; text-transform: uppercase; color: #000000; letter-spacing: 0.04em; }

.jb-isoplac-zone__title-small p { margin: 0; }

.jb-isoplac-zone__title-small::after { content: ""; position: absolute; left: 0; top: 100%; width: 100px; height: 3px; background: #f7d767; }

.jb-isoplac-zone__title-main { margin: 0 0 12px 0; line-height: 1.1; color: #000000; }

.jb-isoplac-zone__title-second { margin: 0 0 18px 0; color: #000000; }

.jb-isoplac-zone__description { margin: 0; max-width: 620px; color: #777777; line-height: 1.65; }

@media (max-width: 992px) { .jb-isoplac-zone { padding: 55px 18px; } .jb-isoplac-zone__container { grid-template-columns: 1fr; gap: 35px; } .jb-isoplac-zone__image { height: 420px; } .jb-isoplac-zone__content { min-height: auto; } }

@media (max-width: 600px) { .jb-isoplac-zone { padding: 40px 15px; } .jb-isoplac-zone__image { height: 300px; } .jb-isoplac-zone__title-small { margin-bottom: 12px; padding-bottom: 5px; } .jb-isoplac-zone__title-small::after { width: 90px; } .jb-isoplac-zone__title-main { margin-bottom: 10px; } .jb-isoplac-zone__title-second { margin-bottom: 16px; } }

.text-color-secondary { color: #045786 !important; }

#bandeau-title-seo > div > h2 { color: #045786 !important; }

a.button_homepageDoubleScreen { border-radius: 0px !important; }

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