@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600;700&display=swap');
/* Thème « marine & orange » (15/10/2026, SRB Couverture : carte de visite bleu marine, accents orange). Dérivé de noir-or.
   Activé par "style": "noir-or" dans fiche.json ; la couleur dorée = fiche["couleur"] (--primary). */
:root { --footer-bg: #131d2b !important; --noir: #131d2b; --noir-2: #1b2738; }

/* boutons dorés : texte noir, lisible (le blanc sur doré manque de contraste) */
.nav-cta, nav.nav-transparent.scrolled .nav-cta, .nav-phone-mobile, nav.nav-transparent.scrolled .nav-phone-mobile,
.btn-dark, .contact-cta-btn, .form-submit-btn, .step-num { color: #ffffff !important; }
.nav-cta svg, .nav-phone-mobile svg, .btn-dark svg, .contact-cta-btn svg, .form-submit-btn svg { stroke: #ffffff; }
.cta-band { background: var(--noir) !important; border-top: 1px solid var(--primary); border-bottom: 1px solid var(--primary); }
.cta-band .btn-dark, .cta-band a[class*="btn"] { background: var(--primary) !important; color: #ffffff !important; }

/* barre du haut : noire une fois qu'on défile (et sur les pages intérieures) */
nav.nav-transparent.scrolled, nav:not(.nav-transparent) {
  background: rgba(19,29,43,.97) !important; border-bottom-color: rgba(255,255,255,.06) !important;
  box-shadow: 0 1px 14px rgba(0,0,0,.35) !important;
}
nav.nav-transparent.scrolled .nav-logo, nav:not(.nav-transparent) .nav-logo { color: #fff !important; }
nav.nav-transparent.scrolled .nav-links a, nav:not(.nav-transparent) .nav-links a { color: rgba(255,255,255,.78) !important; }
nav.nav-transparent.scrolled .nav-links a:hover, nav:not(.nav-transparent) .nav-links a:hover { color: var(--primary) !important; background: rgba(255,255,255,.05) !important; }
nav.nav-transparent.scrolled .hamburger span, nav:not(.nav-transparent) .hamburger span { background: #fff !important; }
.sub-links { background: var(--noir-2) !important; border-color: rgba(255,255,255,.08) !important; }
.sub-links a { color: rgba(255,255,255,.8) !important; }
.sub-links a:hover { color: var(--primary) !important; }

/* bande de chiffres : noir profond, chiffres dorés, liseré courbe doré comme sur la carte */
.stats-inner {
  background: var(--noir) !important; position: relative; overflow: hidden;
  border: 1px solid rgba(224,104,36,.28);
}
#stats.stats-classique { border-top: 1px solid rgba(224,104,36,.45); border-bottom: 1px solid rgba(224,104,36,.45); }
.stat-val { color: var(--primary) !important; position: relative; }
.stat-lbl { color: rgba(255,255,255,.62) !important; position: relative; }
.stats-divider { background: rgba(224,104,36,.35) !important; }

/* titres : soulignement doré */
.title-underline { background: var(--primary) !important; }

/* pied de page */
footer { border-top: 2px solid var(--primary); }
footer h3, footer h4, footer .footer-title { color: var(--primary) !important; }
footer a:hover { color: var(--primary) !important; }

/* variante « classique » de la bande de chiffres (fond plein) : noir au lieu du doré */
#stats.stats-classique { background: var(--noir) !important; }
#stats.stats-classique .stats-inner { border: 0; }
/* textes : noir franc, pas le brun dérivé du doré */
:root { --text: #131d2b !important; --muted: rgba(19,29,43,.66) !important; }
.section-title, h1.section-title, h2 { color: #131d2b; }
.hero h1, .hero-inner h1, .cta-band h2, footer h2 { color: #fff; }
/* le bouton d'appel est dans .nav-links : la règle des liens blancs ne doit pas le toucher */
nav .nav-links a.nav-cta, nav.nav-transparent.scrolled .nav-links a.nav-cta, nav:not(.nav-transparent) .nav-links a.nav-cta { color: #ffffff !important; background: var(--primary) !important; }
nav .nav-links a.nav-cta:hover { color: #ffffff !important; opacity: .88; }
/* voile des bandeaux photo : noir, pas brun */
:root { --hero-overlay: rgba(14,14,16,.68) !important; }
/* pastille téléphone (mobile) et bouton d'appel : dorés dès le haut de page, sinon texte noir sur la photo */
nav .nav-phone-mobile, nav.nav-transparent .nav-phone-mobile { background: var(--primary) !important; border: 0 !important; color: #ffffff !important; }
nav.nav-transparent .nav-cta { background: var(--primary) !important; border: 0 !important; color: #ffffff !important; }

/* ── SRB : slogan, bandeau urgence, horaires (15/10/2026) ── */
#hero p.hero-slogan, .hero-slogan { font-family: 'Dancing Script', cursive; font-size: clamp(1.9rem, 3.6vw, 2.9rem) !important; font-weight: 700; color: #ffb27a !important; margin: .2rem 0 1.1rem; line-height: 1.15; text-shadow: 0 2px 14px rgba(0,0,0,.45); max-width: none; }
#hero p.hero-slogan em, .hero-slogan em { font-style: normal; color: #fff; }
.urgence-band { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .5rem 1.4rem; background: var(--primary); color: #fff; text-decoration: none; padding: 1.05rem 5%; text-align: center; border-bottom: 3px solid var(--noir); }
.urgence-band b { font-size: clamp(1.05rem, 2vw, 1.35rem); font-weight: 800; letter-spacing: .01em; text-transform: uppercase; }
.urgence-band .u-txt { opacity: .92; font-size: .95rem; }
.urgence-band .u-tel { background: var(--noir); color: #fff; border-radius: 999px; padding: .5rem 1.1rem; font-weight: 800; white-space: nowrap; }
.urgence-band .u-dot { width: 11px; height: 11px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 0 rgba(255,255,255,.8); animation: upulse 1.8s infinite; }
@keyframes upulse { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.75); } 100% { box-shadow: 0 0 0 14px rgba(255,255,255,0); } }
.urgence-band:hover .u-tel { background: #0c141f; }
.horaire-heures { color: var(--primary) !important; font-weight: 700; }
.urgence-band { flex-wrap: nowrap; gap: 1rem; }
.urgence-band .u-txt { font-size: .9rem; }
@media (max-width: 1250px) { .urgence-band .u-txt { display: none; } }
@media (max-width: 560px) { .urgence-band { flex-wrap: wrap; gap: .55rem .8rem; } .urgence-band b { font-size: 1rem; } }
/* SRB : deux numéros + e-mail (flyer) */
.urgence-band a.u-tel { color: #fff; text-decoration: none; }
.urgence-band a.u-tel:hover { background: #0c141f; }
.contact-direct { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.4rem; margin: 1rem auto 0; }
.contact-direct a { display: inline-flex; align-items: center; gap: .45rem; color: var(--noir); font-weight: 700; text-decoration: none; border: 1px solid rgba(224,104,36,.35); border-radius: 999px; padding: .45rem 1rem; background: #fff; }
.contact-direct a:hover { border-color: var(--primary); color: var(--primary); }
@media (max-width: 560px) { .urgence-band .u-tel { padding: .45rem .8rem; font-size: .9rem; } }
