/* =====================================================================
   Charte Bassam Lives² — chargée APRÈS style.min.css et custom.min.css.
   Les valeurs viennent de l'admin (Paramètres du site > Identité) :
   --bl-fond (Evergreen), --bl-accent (Verdigris), --bl-detail (Cayenne Orange),
   --bl-police-titres (Bricolage Grotesque), --bl-police-texte (Montserrat).
   ===================================================================== */
:root {
    --brown-color: var(--bl-accent);
    --green-color: var(--bl-detail);
    --black-color: var(--bl-fond);
    --main-font: var(--bl-police-texte);
    --second-font: var(--bl-police-titres);
}

/* ---------- Typographie ---------- */
body, p, li, a, input, select, textarea, button, label, span, td, th,
.custom-form input, .custom-form label, .custom-form select, .enteremail, .subscribe-button,
#the-project .offer-box .count {
    font-family: var(--bl-police-texte), sans-serif;
}
h1, h2, h3, h4,
.hero-carousel_item h2, .hero_section_content h2, .featured_works-header h2,
.half-carousel-content h3, .footer-content-header, .subcribe_title,
#the-project .toglle-header h3, .fixed-bar_item h2, .flip-card-back h4 {
    font-family: var(--bl-police-titres), sans-serif;
    letter-spacing: -0.01em;
}

/* ---------- En-tête : le logo est toujours posé sur l'Evergreen ---------- */
.header-inner { background: var(--bl-fond); border-bottom-color: transparent; }
.logo-holder { height: 100px; display: flex; align-items: center; }
.logo-holder img { height: 64px; width: auto; }
.header-contacts { border-left-color: rgba(255, 255, 255, .15); }
.header-contacts li span, .header-contacts li a, .header-contacts li { color: #fff; }
.nav_logo-holder img { width: 44px; border-radius: 6px; }

/* ---------- Éléments de détail en Cayenne Orange (petites touches) ---------- */
.header-page_title:before, .scroller { background: var(--bl-detail); }
.toglle-header span i, .hero-promo-btn i { color: var(--bl-detail); }
.featured_works-header h2:after, .hero-carousel_item h2:after {
    content: ""; display: block; width: 90px; height: 3px; margin-top: 18px; background: var(--bl-detail);
}

/* ---------- Grandes surfaces : Evergreen / Verdigris (jamais l'orange) ---------- */
.sub-footer { background: var(--bl-accent); }
.contact-page .offer-box .overlay { background: var(--bl-accent); }
.irs--flat .irs-handle.state_hover > i:first-child,
.irs--flat .irs-handle:hover > i:first-child { background: var(--bl-fond); }
.service-box .service-tooltip small { background: var(--bl-fond) !important; }
.home-map-offer-info span { background-color: var(--bl-fond); }

/* ---------- Motif graphique (décor) ---------- */
.footer-inner { background-color: var(--bl-fond); }
.featured_works-header_dec {
    background: var(--bl-fond) url(../images/bg/motif.png) center / 260px auto repeat;
    opacity: .9;
}

/* ---------- Pages légales ---------- */
.legal-page { padding: 90px 90px 120px; max-width: 900px; }
.legal-page h2 { font-size: 2.6em; margin-bottom: 30px; text-align: left; }
.legal-page h3 { font-size: 1.4em; margin: 34px 0 12px; text-align: left; }
.legal-page p, .legal-page li { font-size: 15px; line-height: 26px; text-align: left; color: var(--black-color2); }
.legal-page ul { margin: 0 0 12px 18px; }
.legal-page ul li { display: list-item; list-style: disc; }
.policy-box .legal-links a { margin-left: 18px; color: #fff; opacity: .85; }
.policy-box .legal-links a:hover { opacity: 1; }

/* ---------- Consentement du formulaire ---------- */
.custom-form .consent { display: flex; gap: 10px; align-items: flex-start; padding: 6px 20px 18px; text-align: left; }
.custom-form .consent input { width: auto; height: auto; margin-top: 3px; flex: 0 0 auto; }
.custom-form .consent label { line-height: 18px; font-size: 12px; display: block; }
.custom-form .consent a { text-decoration: underline; color: inherit; display: inline; }

@media (max-width: 768px) {
    .legal-page { padding: 50px 24px 80px; }
    /* logo centré comme sur le modèle (style.min.css : left 50% + translateX(-50%)) */
    .logo-holder { left: 50%; }
    .logo-holder img { height: 48px; }
}

/* Icône Font Awesome à la place d'un pictogramme image (onglet Localisation) */
.location-tab .offer-box .offer-box_item .commodite-icone {
    display: inline-block; vertical-align: middle; width: 13%; font-size: 1.9em; text-align: center; color: var(--bl-accent);
}

.header-contacts li a, .header-contacts li span { white-space: nowrap; }

/* ---------- Barre de menu sur tablette ---------- */
/* Le modèle met MENU à 250px et RÉSERVER à 50% : trou blanc entre les deux (541-768px)
   et titre de page coupé par RÉSERVER (769-1068px). On partage la barre en deux moitiés comme sur téléphone. */
@media (min-width: 541px) and (max-width: 1068px) {
    .nav-button-container { width: 50%; }
    .header-page_title { display: none; }
}
/* Coordonnées de l'en-tête : le modèle utilise .95vw, illisible sous 1068px (~8px) */
.header-contacts li { font-size: clamp(11px, .95vw, 15px); }

/* Titre « Formulaire de réservation » (onglet Biens) : collé aux bords sur téléphone */
@media (max-width: 540px) {
    .fixed-bar_item h2 { font-size: 1.5em; padding: 0 20px; }
}

/* Cartes « Lieux de vie » : le modèle prévoit un pictogramme à 70 % ; Bassam y met des photos,
   qui remplissent donc toute la carte (recadrées au centre) */
.flip-card-front { overflow: hidden; }
.flip-card-front img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* 4 équipements : grille 2 × 2 plutôt que 3 + 1 */
@media (min-width: 769px) {
    #lieux-de-vie .offer_container { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Pied de page ---------- */
/* Titre newsletter : le modèle fixe height/line-height à 90px, la 2e ligne débordait sur le champ e-mail */
.subcribe_title { height: auto; min-height: 90px; line-height: 1.2; display: flex; align-items: center; padding-top: 18px; padding-bottom: 18px; }

@media (max-width: 768px) {
    /* Bande du bas : dans le flux et hauteur libre, sinon les liens légaux passent sous la bande (blanc sur blanc) */
    .subcribe-form { padding-bottom: 0; }
    .sub-footer { position: relative; height: auto; line-height: 1.6; padding: 18px 70px 18px 40px; }
    .policy-box span { display: block; }
    .policy-box .legal-links { margin-top: 6px; }
    .policy-box .legal-links a { display: inline-block; margin: 0 18px 0 0; }
    .sub-footer .to-top_btn { top: 50%; line-height: 1; }
}