@charset "UTF-8";
@import url(main.css);
.mb-5.googleReviews-div { padding-top: 50px !important; padding-bottom: 50px !important; }

div#titre { margin-top: 50px !important; }

#titre .h2 { text-align: center !important; margin-top: 35px !important; margin-bottom: 35px !important; }

i.bi.bi-geo-alt { color: #efc337; }

i.bi.bi-telephone { color: #efc337; }

i.bi.bi-facebook.fs-4 { color: #e8bb42; }

h5.mb-3 { color: #eec346; }

h5.mb-4 { color: #eec04b; }

.col-md-10.d-flex.justify-content-center.col-lg-6 { margin-top: 6rem !important; }

.mx-auto.col-lg-11.px-4.py-4.mb-5.mt-5.text-color-primary.rounded-3.shadow-lg.bg-primaryColor.position-relative { box-shadow: none !important; }

.mx-auto.col-lg-11.px-4.py-4.mb-5.mt-5.text-color-primary.rounded-3.shadow-lg.bg-primaryColor.position-relative { border: 2px solid #efc245; border-radius: 20px !important; box-shadow: none !important; transition: 0.3s ease; }

img.d-block.mx-lg-auto.img-fluid { border-radius: 20px !important; }

div#fullHeight { height: 89vh; }

.b-bloc-divider { border: none !important; border-width: none !important; box-shadow: none !important; background-color: #f6e8db !important; }

#grand.d-flex.align-items-center.justify-content-center.px-4.py-5.text-center.cta_banner.bg-sixthColor.position-relative { padding-top: 5rem !important; padding-bottom: 5rem !important; }

.spacer { display: none !important; }

.border-top { border-top: var(--bs-border-width) var(--bs-border-style) #edc046 !important; }

.card.p-2.rounded-3.shadow-lg.px-4.border-0.d-flex.justify-content-lg-between { box-shadow: none !important; }

.card.rounded-3.shadow-lg.mx-4.mb-4 { box-shadow: none !important; }

nav#navigation-bar-hide { border-bottom: 1px solid rgba(225, 178, 58, 0.35); }

nav#navigation-bar-show { border-bottom: 1px solid rgba(225, 178, 58, 0.35); }

nav#navigation-bar-show { border-bottom: 1px solid rgba(225, 178, 58, 0.35); }

nav#navigation-bar-show { border-bottom: 1px solid rgba(225, 178, 58, 0.35); }

.fs-6.animated-border-button.obftrucs { color: #ffffff; /* couleur normale */ transition: color 0.3s ease; }

/* Hover */
.fs-6.animated-border-button.obftrucs:hover { color: #e1b23a; }

/* Après clic (focus + active) */
.fs-6.animated-border-button.obftrucs:focus, .fs-6.animated-border-button.obftrucs:active { color: #e1b23a; }

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

.sliderLogoContainer { width: 25vw !important; }

.container.m-4.mx-auto { margin-top: 60px !important; }

div#google-reviews-widget { margin-top: 50px !important; background-color: #f6e8db !important; }

.mb-5.googleReviews-div { background-color: #f6e8db; }

.carousel-inner-homepage .carousel-item-homepage > img { animation: none !important; -webkit-animation: none !important; -o-animation: none !important; }

.logo-footer > .logo_nav { height: 15vh !important; }

/* 🟢 Force le texte à gauche dans tout le bloc du slider */
.bloc-slider-homepage.text-center { text-align: left !important; }

/* 🟢 Supprime le centrage automatique du logo */
.sliderLogoContainer.mx-auto { margin: 0 !important; }

/* 🟢 Force les titres à gauche aussi */
.titleText.text-white.text-center.fs-2.mb-4.mt-lg-5.titles { text-align: left !important; }

/* 🟢 Bonus : si Bootstrap réapplique .text-center, tu peux écraser globalement */
.bloc-slider-homepage .text-center, .titleText.text-center { text-align: left !important; }

/*------------------- bouton accueil --------------------------*/
a#phone-analytics-tag-video-bloc { display: inline-block; border: 2px solid #ffffff; border-radius: 10px; padding: 10px 28px; background: transparent !important; color: #ffffff !important; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; text-decoration: none; }

/* Hover */
a#phone-analytics-tag-video-bloc:hover, a#phone-analytics-tag-video-bloc:focus, a#phone-analytics-tag-video-bloc:active { background-color: #f0c146 !important; border-color: #f0c146; color: #1a1a1a !important; box-shadow: 0 6px 18px rgba(240, 193, 70, 0.35); }

/* Bonus */
a#phone-analytics-tag-video-bloc:hover span, a#phone-analytics-tag-video-bloc:hover strong, a#phone-analytics-tag-video-bloc:hover svg { color: #1a1a1a !important; fill: #1a1a1a !important; }

/*------------------- bouton CTA --------------------------*/
a.button_homepageDoubleScreen.ctaLinks-button.text-color-fourth.p-3.fs-6.fw-bold.m-2 { display: inline-block; border: 2px solid #f0c146; border-radius: 10px; padding: 10px 28px; background: transparent !important; color: #f0c146 !important; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; text-decoration: none; }

/* Hover */
a.button_homepageDoubleScreen.ctaLinks-button.text-color-fourth.p-3.fs-6.fw-bold.m-2:hover, a.button_homepageDoubleScreen.ctaLinks-button.text-color-fourth.p-3.fs-6.fw-bold.m-2:focus, a.button_homepageDoubleScreen.ctaLinks-button.text-color-fourth.p-3.fs-6.fw-bold.m-2:active { background-color: #f0c146 !important; border-color: #f0c146; color: #1a1a1a !important; box-shadow: 0 6px 18px rgba(240, 193, 70, 0.35); }

/* Bonus */
a.button_homepageDoubleScreen.ctaLinks-button:hover span, a.button_homepageDoubleScreen.ctaLinks-button:hover strong { color: #1a1a1a !important; }

/*------------------- bouton nav --------------------------*/
a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone { display: inline-block; border: 2px solid #f0c146; border-radius: 10px !important; padding: 10px 28px; background: transparent !important; color: #ffffff !important; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; text-decoration: none; }

/* Hover */
a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone:hover, a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone:focus, a.grow.button_header.text-color-fourth.mx-3.mx-lg-2.p-2.rounded-pill.text-decoration-none.button-header-telephone:active { background-color: #f0c146 !important; border-color: #f0c146; color: #1a1a1a !important; box-shadow: 0 6px 18px rgba(240, 193, 70, 0.35); }

/* Bonus */
a.grow.button_header.text-color-fourth:hover span, a.grow.button_header.text-color-fourth:hover svg { color: #1a1a1a !important; fill: #1a1a1a !important; }

/*--------------------------------------------------------------------------------------------- Présentation-------------------------------------------------------------------------------------------------*/
/* ============================= SECTION PRÉSENTATION SOLOGNE ============================= */
.presentation-sologne-section { padding: 100px 20px; background-color: #f6e8db; }

/* ============================= CONTAINER ============================= */
.presentation-sologne-wrapper { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center; }

/* ============================= IMAGE ============================= */
.presentation-sologne-image { position: relative; display: flex; justify-content: flex-start; align-items: center; overflow: hidden; }

.presentation-sologne-bg-shape { position: absolute; inset: 0; width: 140%; margin: auto; z-index: 1; pointer-events: none; }

.presentation-sologne-main-image { position: relative; z-index: 2; width: 95%; border-radius: 24px; object-fit: cover; display: block; }

/* ============================= CONTENU ============================= */
.presentation-sologne-content { color: #1a1a1a; }

.presentation-sologne-mini-tag { display: inline-block; padding: 10px 26px; margin-bottom: 12px; border-radius: 999px; background-color: #f9efcf; color: #d79b00; font-size: 0.95rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }

.presentation-sologne-title { font-size: 2.8rem; font-weight: 800; line-height: 1.2; margin-bottom: 28px; color: #111; }

.presentation-sologne-content p { max-width: 720px; margin-bottom: 18px; font-size: 1.05rem; line-height: 1.7; color: #444; }

/* ============================= RESPONSIVE ============================= */
@media (max-width: 900px) { .presentation-sologne-section { padding: 80px 16px; } .presentation-sologne-wrapper { grid-template-columns: 1fr; gap: 40px; text-align: center; } .presentation-sologne-image { justify-content: center; } .presentation-sologne-bg-shape { display: none; } .presentation-sologne-main-image { width: 100%; } .presentation-sologne-title { font-size: 2.2rem; } .presentation-sologne-content p { max-width: 100%; } }

/*--------------------------------------------------------------------------------------------- Prestations-------------------------------------------------------------------------------------------------*/
/* ================================================= SECTION ================================================= */
.services-sologne-section { background: radial-gradient(circle at top, #1a120a, #0b0704); padding: 100px 20px; color: #ffffff; }

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

/* ================================================= HEADER ================================================= */
.services-sologne-header { text-align: center; margin-bottom: 70px; }

.services-sologne-eyebrow { display: inline-block; margin-bottom: 10px; color: #f0c146; font-size: 1.1rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }

.services-sologne-title { font-size: 3rem; font-weight: 700; margin-bottom: 22px; color: #f5f5f5; }

.services-sologne-title span { color: #f0c146; }

.services-sologne-subtitle { max-width: 720px; margin: 0 auto; color: #cfcfcf; font-size: 1.05rem; line-height: 1.7; }

/* ================================================= GRID ================================================= */
.services-sologne-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }

/* ================================================= CARD ================================================= */
.services-sologne-card { background: linear-gradient(145deg, #1a120a, #0e0a06); border-radius: 22px; padding: 30px 28px; border: 1px solid rgba(240, 193, 70, 0.22); transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; }

.services-sologne-card:hover { transform: translateY(-4px); border-color: rgba(240, 193, 70, 0.6); box-shadow: 0 14px 32px rgba(240, 193, 70, 0.15); }

/* ================================================= ICON ================================================= */
.services-sologne-icon { width: 74px; height: 74px; border-radius: 14px; background: rgba(240, 193, 70, 0.15); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; }

.services-sologne-icon img { width: 106px; height: 106px; object-fit: contain; }

/* ================================================= TEXT ================================================= */
.services-sologne-card h3 { font-size: 1.35rem; margin-bottom: 10px; color: #f5f5f5; }

.services-sologne-desc { font-size: 0.95rem; color: #c9c9c9; line-height: 1.6; margin-bottom: 16px; }

/* ================================================= TAGS ================================================= */
.services-sologne-tags { display: flex; gap: 8px; margin-bottom: 18px; }

.services-sologne-tags span { padding: 5px 12px; border-radius: 999px; background: rgba(240, 193, 70, 0.15); color: #f0c146; font-size: 0.8rem; font-weight: 600; }

/* ================================================= CTA ================================================= */
.services-sologne-link { display: inline-flex; align-items: center; gap: 8px; color: #f0c146; font-weight: 600; font-size: 0.95rem; text-decoration: none; }

.services-sologne-link span { transition: transform 0.25s ease; }

.services-sologne-card:hover .services-sologne-link span { transform: translateX(5px); }

/* ================================================= RESPONSIVE ================================================= */
@media (max-width: 1000px) { .services-sologne-grid { grid-template-columns: 1fr; } .services-sologne-title { font-size: 2.4rem; } }

@media (max-width: 600px) { .services-sologne-section { padding: 80px 16px; } .services-sologne-header { margin-bottom: 50px; } .services-sologne-card { padding: 26px 24px; } }

/*--------------------------------------------------------------------------------------------- Monuments-------------------------------------------------------------------------------------------------*/
/* ================================================= SECTION ================================================= */
.monument-sologne-section { background-color: #f6e8db; padding: 120px 20px; color: #2a1d12; }

/* WRAPPER */
.monument-sologne-wrapper { max-width: 1350px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 60px; align-items: center; }

/* ================================================= CONTENU ================================================= */
.monument-sologne-content { max-width: 720px; }

/* ================================================= BILLE ================================================= */
.monument-sologne-pill { display: inline-flex; align-items: center; gap: 14px; padding: 7px 20px; margin-bottom: 18px; border-radius: 999px; background-color: #f9ecd0; }

.monument-sologne-pill-icon { width: 42px; height: 42px; border-radius: 14px; background-color: #fff3d6; display: flex; align-items: center; justify-content: center; }

.monument-sologne-pill-icon img { width: 30px; height: 30px; object-fit: contain; }

.monument-sologne-pill span { font-size: 0.85rem; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: #d79b00; }

/* ================================================= TITRE ================================================= */
.monument-sologne-title { font-size: 3.2rem; font-weight: 700; line-height: 1.15; margin-bottom: 26px; color: #1f140c; }

.monument-sologne-title span { color: #d79b00; }

/* ================================================= TEXTE ================================================= */
.monument-sologne-text { font-size: 1.1rem; line-height: 1.7; color: #5c4a3a; margin-bottom: 18px; }

/* ================================================= CTA – CONTOUR TRANSPARENT ================================================= */
.monument-sologne-cta { display: inline-block; margin-top: 28px; padding: 14px 36px; border-radius: 10px; font-size: 1.05rem; font-weight: 600; text-decoration: none; color: #d79b00; border: 2px solid #d79b00; background: transparent; transition: all 0.3s ease; }

.monument-sologne-cta:hover { background-color: #d79b00; color: #1f140c; transform: translateY(-3px); box-shadow: 0 10px 28px rgba(225, 178, 58, 0.35); }

/* ================================================= IMAGE ================================================= */
.monument-sologne-image img { width: 100%; height: auto; object-fit: cover; border-radius: 28px; }

/* ================================================= RESPONSIVE ================================================= */
@media (max-width: 992px) { .monument-sologne-wrapper { grid-template-columns: 1fr; gap: 50px; } .monument-sologne-image { order: -1; } .monument-sologne-title { font-size: 2.4rem; } .monument-sologne-content { max-width: 100%; } }

@media (max-width: 600px) { .monument-sologne-cta { width: 100%; text-align: center; } }

/*--------------------------------------------------------------------------------------------- Avantages-------------------------------------------------------------------------------------------------*/
/* ================================================= SECTION ================================================= */
.method-sologne-section { background-color: #0b0704; background-image: linear-gradient(rgba(240, 193, 70, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(240, 193, 70, 0.08) 1px, transparent 1px); background-size: 120px 120px; padding: 120px 20px; color: #fff; }

/* CONTAINER */
.method-sologne-container { max-width: 1400px; margin: 0 auto; }

/* ================================================= HEADER ================================================= */
.method-sologne-header { text-align: center; margin-bottom: 90px; }

.method-sologne-eyebrow { color: #f0c146; font-size: 0.9rem; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; display: block; margin-bottom: 16px; }

.method-sologne-title { font-size: 3.2rem; font-weight: 700; margin-bottom: 20px; }

.method-sologne-title span { color: #f0c146; }

.method-sologne-subtitle { color: #cfcfcf; font-size: 1.1rem; }

/* ================================================= TIMELINE ================================================= */
.method-sologne-timeline { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }

/* Ligne pointillée */
.method-sologne-line { position: absolute; top: 42px; left: 0; right: 0; height: 1px; border-top: 2px dashed rgba(240, 193, 70, 0.3); }

/* ================================================= STEP ================================================= */
.method-sologne-step { text-align: center; position: relative; }

/* Icône */
.method-sologne-icon { width: 90px; height: 90px; margin: 0 auto 24px; border-radius: 50%; border: 2px solid rgba(240, 193, 70, 0.4); display: flex; align-items: center; justify-content: center; font-size: 1.8rem; color: #f0c146; position: relative; }

.method-sologne-icon img { width: 84px; height: 84px; object-fit: contain; display: block; }

/* Numéro */
.method-sologne-number { position: absolute; top: -12px; right: -12px; background-color: #f0c146; color: #0b0704; font-size: 0.75rem; font-weight: 700; padding: 6px 10px; border-radius: 999px; }

/* Texte */
.method-sologne-step h3 { font-size: 1.4rem; margin-bottom: 10px; }

.method-sologne-step p { font-size: 0.95rem; color: #cfcfcf; line-height: 1.6; }

/* ================================================= RESPONSIVE ================================================= */
@media (max-width: 1000px) { .method-sologne-timeline { grid-template-columns: 1fr; gap: 60px; } .method-sologne-line { display: none; } }

/*--------------------------------------------------------------------------------------------- Réseaux-------------------------------------------------------------------------------------------------*/
/* ------------------------------ SECTION RÉSEAUX — SOLOGNE ------------------------------ */
.reseaux-sologne { background: #140e0e; padding: 80px 20px; text-align: center; }

/* HEADER */
.reseaux-sologne-top { color: #efc245; font-size: 1rem; font-weight: 700; letter-spacing: 1px; margin-bottom: 10px; }

.reseaux-sologne h2 { font-size: 2.6rem; font-weight: 800; color: #fff; margin-bottom: 10px; }

.reseaux-sologne p { font-size: 1.1rem; color: #fff; margin-bottom: 50px; }

/* ICONS */
.reseaux-sologne-icons { display: flex; justify-content: center; }

/* ITEM */
.reseaux-sologne-item { text-decoration: none; color: #fff; }

/* CERCLE IMAGE */
.reseaux-sologne-icon { position: relative; width: 160px; height: 160px; display: flex; justify-content: center; align-items: center; transition: transform 0.4s ease; }

/* IMAGE DE FOND (ROND) */
.reseaux-sologne-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; /* jamais coupée */ }

/* LOGOS */
.reseaux-sologne-logo { position: absolute; width: 100px; height: 100px; object-fit: contain; z-index: 2; transition: opacity 0.3s ease; }

/* États */
.reseaux-sologne-logo.icon-default { opacity: 1; }

.reseaux-sologne-logo.icon-hover { opacity: 0; }

/* HOVER */
.reseaux-sologne-item:hover .reseaux-sologne-icon { transform: scale(1.12); }

.reseaux-sologne-item:hover .icon-default { opacity: 0; }

.reseaux-sologne-item:hover .icon-hover { opacity: 1; }

/* TEXTE */
.reseaux-sologne-item span { display: block; margin-top: 14px; font-size: 1.2rem; font-weight: 600; transition: color 0.3s ease; }

.reseaux-sologne-item:hover span { color: #efc245; }

/*--------------------------------------------------------------------------------------------- video-------------------------------------------------------------------------------------------------*/
/* ================================================= SECTION VIDEO – SOLOGNE ================================================= */
.video-sologne-section { background: #140e0e; padding: 120px 20px; color: #ffffff; }

/* CONTAINER */
.video-sologne-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.05fr; /* 🔁 vidéo gauche / texte droite */ gap: 80px; align-items: center; }

/* ================= CONTENU ================= */
.video-sologne-eyebrow { display: inline-block; margin-bottom: 0px; color: #f0c146; font-size: 0.9rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }

.video-sologne-title { font-size: 3rem; font-family: Arvo; font-weight: 700; margin-bottom: 22px; line-height: 1.2; }

.video-sologne-title span { color: #f0c146; }

.video-sologne-text { font-size: 1.2rem; line-height: 1.7; color: #cfcfcf; max-width: 520px; margin-bottom: 36px; }

/* ================= CTA ================= */
.video-sologne-cta { display: inline-block; padding: 14px 36px; border-radius: 10px; font-size: 1.05rem; font-weight: 600; text-decoration: none; color: #f0c146; border: 2px solid #f0c146; background: transparent; transition: all 0.3s ease; }

.video-sologne-cta:hover { background-color: #f0c146; color: #1f140c; transform: translateY(-3px); box-shadow: 0 10px 28px rgba(240, 193, 70, 0.35); }

/* ================= VIDÉO (BRUTE) ================= */
.video-sologne-media { width: 100%; }

.video-sologne-video { width: 85%; height: auto; display: block; object-fit: cover; /* ❌ aucun effet */ border-radius: 0; box-shadow: none; filter: none; }

/* ================= RESPONSIVE OPTIMISÉ ================= */
@media (max-width: 1000px) { .video-sologne-container { grid-template-columns: 1fr; gap: 26px; text-align: center; /* 🔥 centre tout le texte */ justify-items: center; /* 🔥 centre les blocs */ } /* VIDEO AU CENTRE */ .video-sologne-media { width: 100%; max-width: 680px; /* 🔥 évite trop large */ margin: 0 auto; /* 🔥 centre horizontalement */ display: flex; justify-content: center; } .video-sologne-video { width: 100%; height: 100%; object-fit: cover; object-position: center; } /* TEXTE CENTRÉ */ .video-sologne-text { margin-left: auto; margin-right: auto; } /* CTA CENTRÉ */ .video-sologne-cta { margin-left: auto; margin-right: auto; } }

/*---------------------------------------------------------------------------------------------Photovoltaïque-------------------------------------------------------------------------------------------------*/
/* ================================================= BARDAGES – SOLOGNE ================================================= */
.bardage-sologne { background: #140e0e; padding: 120px 20px; color: #fff; }

.bardage-sologne-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 90px; align-items: center; }

/* ================= IMAGE ================= */
.bardage-sologne-media img { width: 100%; height: auto; object-fit: cover; border-radius: 26px; }

/* ================= TEXTE ================= */
.bardage-sologne-title { font-size: 3.1rem; font-weight: 700; margin-bottom: 22px; color: #fff; }

.bardage-sologne-title span { color: #e1b23a; }

.bardage-sologne-text { font-size: 1.05rem; line-height: 1.7; color: #fff; max-width: 520px; margin-bottom: 36px; }

/* ================= SOUS-TITRE ================= */
.bardage-sologne-subtitle { font-size: 1.25rem; font-weight: 600; margin-bottom: 18px; color: #fff; }

/* ================= LISTE ================= */
.bardage-sologne-list { list-style: none; padding: 0; margin: 0; }

.bardage-sologne-list li { position: relative; padding-left: 28px; margin-bottom: 14px; font-size: 1rem; color: #fff; }

.bardage-sologne-list li::before { content: "✓"; position: absolute; left: 0; top: 2px; color: #e1b23a; font-weight: 700; }

/* ================= RESPONSIVE ================= */
@media (max-width: 1000px) { .bardage-sologne-container { grid-template-columns: 1fr; gap: 60px; } .bardage-sologne-title { font-size: 2.4rem; } }

/*---------------------------------------------------------------------------------------------Démoussage-------------------------------------------------------------------------------------------------*/
/* ================================================= INVERSE IMAGE – SOLOGNE ================================================= */
.inverse-image { background: #f6e8db; padding: 120px 20px; color: #000; }

.inverse-image-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 90px; align-items: center; }

/* ================= IMAGE ================= */
.inverse-image-media img { width: 100%; height: auto; object-fit: cover; border-radius: 26px; }

/* ================= TEXTE ================= */
.inverse-image-title { font-size: 3.1rem; font-weight: 700; margin-bottom: 22px; color: #1f140c; }

.inverse-image-title span { color: #d79b00; }

.inverse-image-text { font-size: 1.05rem; line-height: 1.7; color: #1f140c; max-width: 520px; margin-bottom: 36px; }

/* ================= SOUS-TITRE ================= */
.inverse-image-subtitle { font-size: 1.25rem; font-weight: 600; margin-bottom: 18px; color: #1f140c; }

/* ================= LISTE ================= */
.inverse-image-list { list-style: none; padding: 0; margin: 0; }

.inverse-image-list li { position: relative; padding-left: 28px; margin-bottom: 14px; font-size: 1rem; color: #000; }

.inverse-image-list li::before { content: "✓"; position: absolute; left: 0; top: 2px; color: #e1b23a; font-weight: 700; }

/* ================= RESPONSIVE ================= */
@media (max-width: 1000px) { .inverse-image-container { grid-template-columns: 1fr; gap: 60px; } .inverse-image-title { font-size: 2.4rem; } }

/*---------------------------------------------------------------------------------------------intro claire-------------------------------------------------------------------------------------------------*/
/* ================================================= LOGO CLAIR – SECTION VIDÉO (CLEAN & SAFE) ================================================= */
.logo-clair-section { background: #f6e8db; padding: 120px 20px; color: #1f140c; }

/* ================================================= CONTAINER ================================================= */
.logo-clair-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1.05fr 1fr; /* texte gauche / vidéo droite */ gap: 80px; align-items: center; }

/* ================================================= TEXTE ================================================= */
.logo-clair-content { max-width: 100%; }

/* Bulle "Notre savoir-faire" */
.logo-clair-bubble { display: inline-block; margin-bottom: 25px; padding: 8px 20px; background: #f9efcf; color: #e1b23a; font-size: 0.95rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; border-radius: 999px; }

/* Titre */
.logo-clair-title { font-size: 3rem; font-family: Arvo; font-weight: 700; margin-bottom: 26px; line-height: 1.2; }

.logo-clair-title span { color: #d79b00; }

/* Texte */
.logo-clair-text { font-size: 1.1rem; line-height: 1.75; color: #3a2a1d; max-width: 560px; }

/* ================================================= CTA ================================================= */
.logo-clair-cta { display: inline-block; margin-top: 30px; padding: 14px 38px; border: 2px solid #d79b00; border-radius: 10px; background: transparent; color: #d79b00; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.5px; text-decoration: none; transition: all 0.3s ease; }

.logo-clair-cta:hover, .logo-clair-cta:focus, .logo-clair-cta:active { background-color: #d79b00; color: #1f140c; transform: translateY(-3px); box-shadow: 0 10px 28px rgba(225, 178, 58, 0.35); outline: none; }

/* ================================================= VIDÉO – VERSION ULTRA SAFE (ANTI TRAITS NOIRS) ================================================= */
.logo-clair-media { position: relative; width: 100%; overflow: hidden; background: #f6e8db; /* même couleur que la section */ }

.logo-clair-video { width: 101%; height: 101%; display: block; object-fit: cover; object-position: center; border-radius: 0; box-shadow: none; filter: none; }

/* ================================================= RESPONSIVE ================================================= */
@media (max-width: 1000px) { .logo-clair-section { padding: 80px 16px; } .logo-clair-container { grid-template-columns: 1fr; gap: 26px; text-align: center; justify-items: center; } /* Vidéo au-dessus */ .logo-clair-media { order: -1; width: 100%; height: 260px; } .logo-clair-content { display: flex; flex-direction: column; align-items: center; } .logo-clair-title { font-size: 2.2rem; } .logo-clair-text { max-width: 680px; } .logo-clair-cta { margin-top: 22px; } }

@media (max-width: 600px) { .logo-clair-media { height: 220px; } .logo-clair-title { font-size: 2rem; } .logo-clair-text { font-size: 1.02rem; } }

/*-------------------Galerie Custom--------------------------*/
#custom-gallery { padding-top: 40px; background-color: #f6e8db; }

@media screen and (min-width: 991px) { #custom-gallery { padding: 60px 30px 0 30px; } }

#custom-gallery .image { height: 400px !important; margin: 20px 0; }

.img-wrapper { position: relative; height: 100%; margin-top: 15px; }

.img-wrapper img { width: 100%; }

.img-overlay { background: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; opacity: 0; }

.img-overlay i { color: #fff; font-size: 3em; }

#overlay { background: rgba(0, 0, 0, 0.7); width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: flex; justify-content: center; align-items: center; z-index: 999; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

#overlay img { margin: 0; width: 80%; height: auto; object-fit: contain; padding: 5%; }

@media screen and (min-width: 768px) { #overlay img { width: 60%; } }

@media screen and (min-width: 1200px) { #overlay img { width: 50%; } }

#nextButton { color: #fff; font-size: 2em; transition: opacity 0.8s; }

#nextButton:hover { opacity: 0.7; }

@media screen and (min-width: 768px) { #nextButton { font-size: 3em; } }

#prevButton { color: #fff; font-size: 2em; transition: opacity 0.8s; }

#prevButton:hover { opacity: 0.7; }

@media screen and (min-width: 768px) { #prevButton { font-size: 3em; } }

#exitButton { color: #fff; font-size: 2em; transition: opacity 0.8s; position: absolute; top: 15px; right: 15px; }

#exitButton:hover { opacity: 0.7; }

@media screen and (min-width: 768px) { #exitButton { font-size: 3em; } }

.img-responsive { height: 100% !important; object-fit: cover !important; }

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