
/* ═══════════════════════════════════════════════════════
   THEME CLAIR — SURCHARGES POUR PRÉSENTATION SOIGNÉE
   ═══════════════════════════════════════════════════════ */

/* ── Nom de marque dans la navigation ── */
.nav-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.15rem;
  letter-spacing: 2px;
  color: #1E3A5F;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ── Hero title : blanc sur fond photo sombre ── */
.hero-title {
  color: #FFFFFF !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
.hero-title .saumon {
  color: #60A5FA !important;
}
.hero-location {
  color: rgba(255,255,255,0.8) !important;
}

/* ── Body & fond général ── */
body {
  background: #F8FAFC !important;
  color: #111827 !important;
}

/* ── Navigation (bandeau blanc épuré) ── */
nav {
  background: rgba(255,255,255,0.97) !important;
  border-bottom: 1px solid rgba(30,58,95,0.1) !important;
  box-shadow: 0 1px 8px rgba(30,58,95,0.06);
}
header.scrolled nav {
  box-shadow: 0 2px 20px rgba(30,58,95,0.12) !important;
}
.nav-links a {
  color: #1E3A5F !important;
}
.nav-links a:hover {
  color: #2563EB !important;
}
.logo-icon {
  background: linear-gradient(135deg, #1E3A5F 0%, #2563EB 100%) !important;
}

/* ── Sections : fond blanc / gris alternés + texte noir ── */
section:nth-child(odd) {
  background: #FFFFFF !important;
}
section:nth-child(even) {
  background: #F1F5F9 !important;
}
section h2, section h3, section p, section span {
  color: inherit;
}
.section-title {
  color: #1E3A5F !important;
}
.section-tag {
  color: #2563EB !important;
}
.section-header {
  border-left: 4px solid #2563EB !important;
}

/* ── Cards épurées ── */
.card {
  background: #FFFFFF !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(30,58,95,0.07) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}
.card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 30px rgba(30,58,95,0.13) !important;
  border-color: #2563EB !important;
}
.card h3 {
  color: #1E3A5F !important;
}
.card p {
  color: #4B5563 !important;
}

/* ── Zone cards ── */
.zone-card {
  background: #FFFFFF !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(30,58,95,0.07) !important;
}
.zone-card h3 {
  color: #1E3A5F !important;
}
.zone-card p {
  color: #4B5563 !important;
}
.zone-number {
  color: #2563EB !important;
  border-color: rgba(37,99,235,0.25) !important;
}

/* ── Boutons principaux ── */
.btn-primary {
  background: linear-gradient(135deg, #1E3A5F 0%, #2563EB 100%) !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(37,99,235,0.3) !important;
  font-weight: 700 !important;
}
.btn-primary:hover {
  box-shadow: 0 8px 28px rgba(37,99,235,0.45) !important;
  transform: translateY(-2px) !important;
}
.btn-outline {
  border: 2px solid #2563EB !important;
  color: #2563EB !important;
  background: transparent !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
}
.btn-outline:hover {
  background: rgba(37,99,235,0.08) !important;
}

/* ── Bouton hero outline blanc (hero a un fond sombre) ── */
#hero .btn-outline {
  border: 2px solid rgba(255,255,255,0.85) !important;
  color: #FFFFFF !important;
  background: rgba(255,255,255,0.1) !important;
}
#hero .btn-outline:hover {
  background: rgba(255,255,255,0.2) !important;
}

/* ── Contact section ── */
#contact {
  background: #F8FAFC !important;
}
#contact .section-title {
  color: #1E3A5F !important;
}
.contact-block h3 {
  color: #1E3A5F !important;
}
.contact-block p, .contact-block a {
  color: #374151 !important;
}
.contact-block a:hover {
  color: #2563EB !important;
}

/* ── Footer ── */
footer {
  background: #1E3A5F !important;
  color: #F8FAFC !important;
}
footer h4 {
  color: #FFFFFF !important;
}
footer a {
  color: #CBD5E1 !important;
}
footer a:hover {
  color: #FFFFFF !important;
}
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.12) !important;
  color: rgba(255,255,255,0.6) !important;
}

/* ── Ticker bandeau ── */
.ticker-wrap {
  background: #1E3A5F !important;
  border-top: none !important;
  border-bottom: none !important;
}
.ticker-item {
  color: rgba(255,255,255,0.9) !important;
}
.ticker-sep {
  color: #2563EB !important;
}

/* ── Scroll-to-top ── */
#scrollTop {
  background: linear-gradient(135deg, #1E3A5F, #2563EB) !important;
  color: #FFF !important;
}

/* ── Service badges ── */
.service-badge {
  background: rgba(37,99,235,0.1) !important;
  color: #2563EB !important;
  border: 1px solid rgba(37,99,235,0.25) !important;
}

/* ── Floating devis btn ── */
#floating-devis-btn {
  background: linear-gradient(135deg, #1E3A5F, #2563EB) !important;
  color: #FFF !important;
  box-shadow: 0 4px 20px rgba(37,99,235,0.4) !important;
}

/* ── Trust bar ── */
.hero-trust-bar {
  background: rgba(255,255,255,0.12) !important;
  border-left-color: #60A5FA !important;
}
.trust-item {
  color: rgba(255,255,255,0.85) !important;
}
.trust-item strong {
  color: #FFFFFF !important;
}

/* ── Section garantie cards ── */
#garantie .card h3 {
  color: #1E3A5F !important;
}

/* ── Images : pas de filtre sombre ── */
img, video {
  filter: none !important;
}

/* ── Hero badge ── */
.hero-badge {
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.4) !important;
  color: rgba(255,255,255,0.95) !important;
}

/* ── Availability badge ── */
.availability-badge.online {
  background: rgba(22,163,74,0.15) !important;
  color: #15803D !important;
  border-color: rgba(22,163,74,0.3) !important;
}
.availability-badge.offline {
  background: rgba(100,116,139,0.1) !important;
  color: #374151 !important;
}

/* ── Contact form inputs sur fond blanc ── */
.contact-form-bottom input,
.contact-form-bottom textarea,
.contact-form-bottom select {
  background: #F8FAFC !important;
  color: #111827 !important;
  border: 1.5px solid #CBD5E1 !important;
}
.contact-form-bottom input::placeholder,
.contact-form-bottom textarea::placeholder {
  color: #9CA3AF !important;
}
.contact-form-bottom {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 2px 12px rgba(30,58,95,0.07) !important;
}
.contact-form-bottom h3 {
  color: #1E3A5F !important;
}

/* ── Undo primary bg on odd sections ── */
#hero {
  background: transparent !important;
}
