:root{scroll-behavior:smooth}
body{padding-top:76px}


/* NAVBAR: typo + alignement (desktop) */
.navbar{
  --bc-nav-fs: 0.95rem;
}
.navbar .navbar-brand span{
  font-size:1.05rem;
  letter-spacing:.02em;
}
.navbar .nav-link{
  font-weight:600;
  font-size:var(--bc-nav-fs);
  padding:.55rem .75rem;
  white-space:nowrap;
}
.navbar .navbar-nav{
  gap:.15rem;
}
.navbar .btn{
  font-weight:700;
  letter-spacing:.01em;
}

/* Ajustements si largeur intermédiaire: réduire un peu la typo pour éviter les retours à la ligne */
@media (max-width: 1200px){
  .navbar{ --bc-nav-fs: 0.9rem; }
  .navbar .nav-link{ padding:.5rem .6rem; }
}


/* HERO: contraste + lisibilité */
.hero{
  /* Overlay plus sombre pour garantir la lecture sur toutes les photos */
  background: linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,.72)), url("../img/hero-1600.webp") center/cover no-repeat;
  color:#fff;

  /* Bootstrap 5.3: headings utilisent --bs-heading-color (sinon ils restent sombres) */
  --bs-body-color:#fff;
  --bs-body-color-rgb:255,255,255;
  --bs-heading-color:#fff;
}
.hero h1{color:#fff}
.hero .lead{color:rgba(255,255,255,.92)}
.hero h1,.hero .lead{ text-shadow: 0 2px 14px rgba(0,0,0,.75); }

.hero .badge{
  backdrop-filter: blur(6px);
  background: rgba(255,255,255,.92)!important;
}

.section{padding:4rem 0}
.card-hover{transition:transform .15s ease, box-shadow .15s ease}
.card-hover:hover{transform:translateY(-2px)}
.kpi{border-left:4px solid rgba(13,110,253,.8); padding-left:1rem}
.breadcrumb{--bs-breadcrumb-divider:'›'}
.gallery-grid img{border-radius:12px}