/* Charte graphique DB Construction */
/* Couleurs : Rouge #df1700, Bleu #31b0ff, Blanc #FFFFFF, Sombre #2b2b2b */

:root {
  --btn-text-color: #fff;
  --primary-color: #df1700;
  --primary-color-dark: #b81200;
  --secondary-color: #df1700;
  --accent-color: #31b0ff;
  --text-color: #2e2e2e;
  --white-color: #ffffff;
  --dark-footer: #1e1e1e;
}

/* ── Boutons ── */
.thm-btn,
.main-btn {
  background-color: var(--secondary-color) !important;
  color: var(--btn-text-color) !important;
  border-color: var(--secondary-color) !important;
}

.thm-btn:hover,
.main-btn:hover {
  background-color: var(--primary-color-dark) !important;
  color: var(--btn-text-color) !important;
  border-color: var(--primary-color-dark) !important;
}

/* ── Header ── */
header.main-header {
  background-color: var(--white-color) !important;
}

.main-header-top-wrapper {
  background-color: #f5f5f5 !important;
}

.main-menu-list li a:hover {
  color: var(--secondary-color) !important;
}

/* ── Section titles ── */
.section-title-icon span {
  color: var(--secondary-color) !important;
}

/* ── Banner / Hero ── */
.banner-one-bg {
  background: url('../images/customs/maison_mur_fenetres.jpeg') no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
}

.banner-one-bg-shape {
  background: linear-gradient(
    278deg,
    rgba(26, 26, 26, 0.85) 35%,
    rgba(223, 23, 0, 0.45) 100%
  ) !important;
  opacity: 1 !important;
}

/* ── About section ── */
.about-one {
  background-color: #ffffff !important;
}

.about-one-single-box {
  background-color: #ffffff !important;
  border: 1px solid #f0f0f0 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

/* ── Services ── */
.services-one {
  background-color: #f8f8f8 !important;
}

/* Icônes des services */
.services-one-single-icon span,
.about-one-single-icon span {
  color: var(--secondary-color) !important;
}

.services-one-single-icon i {
  color: var(--secondary-color) !important;
}

.services-one-single-btn a {
  background-color: var(--secondary-color) !important;
  color: var(--white-color) !important;
}

.services-one-single-btn a:hover {
  background-color: var(--primary-color-dark) !important;
  color: var(--white-color) !important;
}

/* Uniformiser la hauteur des cartes du carousel services */
.services-one-slider .owl-item {
  display: flex;
  height: auto;
}

.services-one-slider .services-one-single-box {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 450px;
}

.services-one-single-text {
  flex-grow: 1;
}

/* ── CTA / Why choose section ── */
.why-choose-two-bg {
  background: url('../images/customs/travaux_ferraillage.jpeg') no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
}

.why-choose-two-bg-2 {
  background: linear-gradient(
    90deg,
    rgba(26, 26, 26, 0.92) 30%,
    rgba(26, 26, 26, 0.4) 100%
  ) !important;
}

.why-choose-two {
  background-color: #1a1a1a !important;
}

/* ── Promo ticker ── */
.promo-one {
  background-color: var(--secondary-color) !important;
}

/* ── Testimonials ── */
.testimonial-one {
  background-color: #f8f8f8 !important;
}

/* ── Footer ── */
.footer-one {
  background-color: var(--dark-footer) !important;
}

/* ── Links ── */
a {
  color: var(--secondary-color);
}

a:hover {
  color: var(--primary-color-dark);
}

/* ── Hero 75vh en desktop ── */
@media (min-width: 992px) {
  .banner-one {
    min-height: 75vh !important;
    padding-top: 80px !important;
    padding-bottom: 100px !important;
  }
}

/* ── Icônes Phosphor dans section-title-icon ── */
.section-title-box .section-title-icon i {
  font-size: 36px;
  color: var(--secondary-color);
}

/* ── Icône Phosphor about-one-top ── */
.about-one-icon i {
  font-size: 56px;
  color: #1e1e1e;
}

/* ── Icônes Phosphor promo-one ── */
.promo-one-single i {
  font-size: 22px;
  color: #ffffff;
  margin-right: 10px;
}

/* ── Numéro navbar toujours visible ── */
.main-menu-right-number-box {
  display: flex !important;
}

@media only screen and (max-width: 1199px) {
  /* Garder main-menu-right visible pour le numéro */
  .main-menu-right {
    display: flex !important;
  }
  /* Cacher le bouton devis sur petit écran */
  .main-menu-right .main-menu-btn {
    display: none !important;
  }
}

@media only screen and (max-width: 575px) {
  /* Sur très petit écran, cacher le texte "Appelez-nous" et garder juste le numéro */
  .main-menu-right-number-detail p {
    display: none;
  }
}

/* ── Smooth scroll ── */
html {
  scroll-behavior: smooth;
}

/* ── Map embed ── */
.google-map-embed iframe {
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.contact-page-contact-details p {
  line-height: 1.6;
}

/* ── Contact section ── */
.contact-page {
  background-color: #ffffff !important;
}

/* ══════════════════════════════════════════════════
   CORRECTIONS TEXTES BLANCS SUR FOND BLANC
   (le thème utilise --elton-light = #fff sur fonds sombres)
   ══════════════════════════════════════════════════ */

/* About-one : titres et textes */
.about-one-top .about-one-top-title h3 {
  color: #1e1e1e !important;
}

.about-one-top-text p {
  color: #444444 !important;
}

.about-one-single-title h5 {
  color: #1e1e1e !important;
}

.about-one-single-title p {
  color: #555555 !important;
}

/* Formes blanches dans les boxes → rouges */
.about-one-single-shape-1,
.about-one-single-shape-2 {
  background-color: var(--secondary-color) !important;
}

/* Icône : fond gris clair au lieu de dark */
.about-one-single-icon {
  background-color: #f4f4f4 !important;
}

.about-one-single-icon span {
  color: var(--secondary-color) !important;
}

/* Why-choose-two : section CTA (fond sombre → texte blanc) */
.why-choose-two-top-detail .section-title-box .section-title-title h2 {
  color: #ffffff !important;
}

.why-choose-two-top-detail .section-title-box .section-title-text p {
  color: #dddddd !important;
}

.why-choose-two-top-detail .section-title-box .section-title-text-two p {
  color: #dddddd !important;
}

.why-choose-two-top-detail .section-title-box .section-title-text-two p span {
  color: var(--secondary-color) !important;
}

/* Testimonials : titre de section */
.testimonial-one-title-box .section-title-box .section-title-title h2 {
  color: #1e1e1e !important;
}

/* Section-title globaux sur fonds clairs */
.section-title-box .section-title-title h2 {
  color: #1e1e1e !important;
}

.section-title-box .section-title-text p {
  color: #555555 !important;
}