html,
body {
  background:
    radial-gradient(1200px 720px at 50% -12%, rgb(var(--white-rgb) / 0.012), transparent 58%),
    radial-gradient(920px 560px at 8% 10%, rgb(var(--yellow-rgb) / 0.014), transparent 52%),
    radial-gradient(980px 620px at 96% 88%, rgb(var(--pink-rgb) / 0.022), transparent 58%),
    linear-gradient(180deg, rgb(var(--bg-rgb)) 0%, rgb(var(--bg-deep-rgb)) 100%) !important;
  color: var(--text);
}

.demarche,
.prestations,
.expertise,
.avis,
.offres {
  background:
    radial-gradient(900px 540px at 12% 12%, rgb(var(--yellow-rgb) / 0.012), transparent 56%),
    radial-gradient(900px 560px at 92% 82%, rgb(var(--pink-rgb) / 0.024), transparent 62%),
    linear-gradient(180deg, rgb(var(--bg-rgb)) 0%, rgb(var(--bg-deep-rgb)) 100%),
    var(--bg) !important;
}

.hero {
  background:
    radial-gradient(980px 620px at 50% 0%, rgb(var(--white-rgb) / 0.010), transparent 58%),
    radial-gradient(900px 560px at 18% 14%, rgb(var(--yellow-rgb) / 0.016), transparent 54%),
    radial-gradient(920px 590px at 82% 78%, rgb(var(--pink-rgb) / 0.026), transparent 60%),
    linear-gradient(180deg, rgb(var(--bg-rgb)) 0%, rgb(var(--bg-rgb)) 48%, rgb(var(--bg-deep-rgb)) 100%) !important;
}

/* Texte gradient général */
.accent,
.hero__content .accent {
  color: var(--yellow) !important;
  text-shadow: 0 0 10px rgb(var(--yellow-rgb) / 0.20), 0 0 20px rgb(var(--orange-rgb) / 0.10);
}

.accent--gradient,
.hero-gradient-word,
.profile__txt h3,
.expertise-profile__body h3,
.reserve-front-title,
.reserve-title {
  background-image: var(--brand-gradient) !important;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  filter: drop-shadow(0 0 8px rgb(var(--yellow-rgb) / 0.08)) drop-shadow(0 0 14px rgb(var(--pink-rgb) / 0.10));
}

/* Surfaces */
.card,
.service,
.offer-card,
.avis .review,
.values li,
.reserve-dialog,
.mnav__sheet {
  background:
    radial-gradient(520px 240px at 16% 8%, rgb(var(--white-rgb) / 0.030), transparent 58%),
    radial-gradient(620px 300px at 90% 92%, rgb(var(--pink-rgb) / 0.022), transparent 62%),
    linear-gradient(180deg, rgb(var(--white-rgb) / 0.034), rgb(var(--white-rgb) / 0.012)),
    rgb(var(--card-rgb)) !important;
  border-color: rgb(var(--white-rgb) / 0.090) !important;
}

.card,
.avis .review {
  box-shadow: 0 22px 58px rgb(var(--black-rgb) / 0.58), 0 0 0 1px rgb(var(--white-rgb) / 0.015) inset;
}

.prestations .service::before,
.offer-card::before {
  background:
    radial-gradient(circle at 18% 15%, rgb(var(--white-rgb) / 0.026), transparent 26%),
    radial-gradient(circle at 82% 88%, rgb(var(--pink-rgb) / 0.040), transparent 34%),
    radial-gradient(circle at 50% 100%, rgb(var(--orange-rgb) / 0.012), transparent 42%) !important;
}

/* Boutons */
.btn {
  transition: transform 0.2s ease, box-shadow 0.22s ease, border-color 0.22s ease, filter 0.22s ease;
}

.btn-primary {
  color: var(--ink) !important;
  background: linear-gradient(135deg, rgb(var(--pink-rgb)) 0%, rgb(var(--orange-rgb)) 52%, rgb(var(--yellow-rgb)) 100%) !important;
  box-shadow: 0 16px 34px rgb(var(--black-rgb) / 0.30), 0 0 24px rgb(var(--pink-rgb) / 0.14), 0 0 18px rgb(var(--orange-rgb) / 0.10);
}

.btn-primary:hover,
.btn-primary:focus-visible {
  filter: brightness(1.05) saturate(1.05);
  transform: translateY(-1px);
}

.btn-ghost {
  border-color: rgb(var(--white-rgb) / 0.12) !important;
  color: var(--cream) !important;
  background: linear-gradient(180deg, rgb(var(--white-rgb) / 0.040), rgb(var(--white-rgb) / 0.012)), rgb(var(--card-rgb) / 0.78) !important;
  box-shadow: 0 14px 28px rgb(var(--black-rgb) / 0.28);
}

/* Progress bar */
.progress {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  z-index: 5000 !important;
  display: block !important;
  width: 100vw !important;
  height: 4px !important;
  margin: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: rgb(var(--white-rgb) / 0.070) !important;
  pointer-events: none !important;
}

.progress span {
  display: block !important;
  width: 0;
  height: 100% !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, rgb(var(--yellow-rgb)) 0%, rgb(var(--orange-rgb)) 48%, rgb(var(--pink-rgb)) 100%) !important;
  box-shadow: 0 0 14px rgb(var(--yellow-rgb) / 0.20), 0 0 18px rgb(var(--pink-rgb) / 0.16);
}

/* Nav */
@media (min-width: 761px) {
  .nav {
    top: 18px !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    width: min(1120px, 92vw) !important;
    margin-inline: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .nav>.logo {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    height: auto !important;
    margin-left: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .nav>.logo .logo__img {
    height: 42px !important;
    width: auto !important;
    filter: drop-shadow(0 12px 26px rgb(var(--black-rgb) / 0.62)) drop-shadow(0 0 12px rgb(var(--yellow-rgb) / 0.08));
  }

  .nav__links {
    margin-left: auto !important;
    gap: 18px !important;
    padding: 8px 16px 8px 18px !important;
    border: 1px solid rgb(var(--white-rgb) / 0.075) !important;
    border-radius: var(--radius-full) !important;
    background: linear-gradient(180deg, rgb(var(--white-rgb) / 0.038), rgb(var(--white-rgb) / 0.010)), rgb(var(--bg-deep-rgb) / 0.36) !important;
    box-shadow: 0 16px 42px rgb(var(--black-rgb) / 0.28), 0 0 0 1px rgb(var(--white-rgb) / 0.010) inset !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  .nav__links a:not(.btn) {
    padding: 8px 10px !important;
    color: rgb(var(--cream-rgb) / 0.91);
    border-radius: var(--radius-full);
    text-shadow: 0 1px 0 rgb(var(--black-rgb) / 0.22);
  }

  .nav__links a:not(.btn):hover {
    color: var(--cream);
    background: rgb(var(--white-rgb) / 0.030);
  }

  .nav__links .btn.btn-primary {
    border-radius: 13px !important;
    padding: 0.78rem 1.28rem !important;
    margin-left: 8px !important;
    min-width: max-content;
  }
}

@media (max-width: 760px) {
  .nav {
    top: 14px !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  .nav>.logo .logo__img {
    height: 36px !important;
    filter: drop-shadow(0 10px 22px rgb(var(--black-rgb) / 0.58)) drop-shadow(0 0 10px rgb(var(--yellow-rgb) / 0.08));
  }

  .nav__links {
    display: none !important;
  }

  .nav__burger {
    width: 52px;
    height: 52px;
  }

  .progress {
    height: 3px !important;
  }
}

/* Offres : abandon du glossy, lisibilité premium stable */
.offer-card h3 {
  position: relative;
  display: block;
  width: auto;
  max-width: 100%;
  color: var(--cream) !important;
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  text-shadow: 0 1px 0 rgb(var(--white-rgb) / 0.030), 0 8px 18px rgb(var(--black-rgb) / 0.22) !important;
  filter: none !important;
  animation: none !important;
}

.offer-card h3::before,
.offer-card h3::after {
  content: none !important;
  display: none !important;
}

.offer-card__tagline {
  color: var(--yellow) !important;
  text-shadow: 0 0 10px rgb(var(--yellow-rgb) / 0.10), 0 0 16px rgb(var(--orange-rgb) / 0.07);
}

.offer-card__link {
  color: rgb(var(--pink-rgb) / 0.94) !important;
}

/* Icons */
.ic-badge--iconoir,
.ic-badge--iconoir i,
.mnav__icon i {
  color: var(--yellow) !important;
  filter: drop-shadow(0 0 10px rgb(var(--yellow-rgb) / 0.14)) drop-shadow(0 6px 12px rgb(var(--black-rgb) / 0.20));
}

.prestations .service:nth-child(even) .ic-badge--iconoir i {
  color: rgb(var(--pink-rgb)) !important;
  filter: drop-shadow(0 0 10px rgb(var(--pink-rgb) / 0.18)) drop-shadow(0 6px 14px rgb(var(--black-rgb) / 0.20));
}

/* Current hero SVG */
.hero-mountain--back {
  fill: rgb(var(--card-strong-rgb) / 0.22) !important;
  stroke: rgb(var(--white-rgb) / 0.040) !important;
}

.hero-mountain--front {
  fill: rgb(var(--card-strong-rgb) / 0.34) !important;
  stroke: rgb(var(--pink-rgb) / 0.035) !important;
}

.hero-snow,
.hero-snow--front {
  fill: rgb(var(--cream-rgb) / 0.065) !important;
}

.scene #sunRays line {
  stroke: rgb(var(--yellow-rgb)) !important;
  filter: drop-shadow(0 0 8px rgb(var(--yellow-rgb) / 0.20)) drop-shadow(0 0 14px rgb(var(--orange-rgb) / 0.10));
}

.scene #sunFace circle:first-child {
  fill: rgb(var(--yellow-rgb)) !important;
  filter: drop-shadow(0 0 16px rgb(var(--yellow-rgb) / 0.18)) drop-shadow(0 0 28px rgb(var(--orange-rgb) / 0.08));
}

.scene #roadBg,
.section-road .bg {
  stroke: rgb(var(--road-bg-rgb)) !important;
}

.scene #roadDash,
.section-road .dash {
  stroke: rgb(var(--road-dash-rgb)) !important;
}

.scene #carHero rect:first-child {
  fill: rgb(var(--pink-rgb)) !important;
}

.scene #carHero rect:nth-child(2) {
  fill: rgb(255 210 228) !important;
}

.scene #carHero rect:last-child {
  fill: rgb(var(--yellow-rgb)) !important;
}

/* Preloader / modal */
#preloader {
  background: radial-gradient(1000px 620px at 50% 18%, rgb(var(--white-rgb) / 0.014), transparent 56%), radial-gradient(900px 520px at 18% 12%, rgb(var(--yellow-rgb) / 0.024), transparent 52%), radial-gradient(900px 520px at 82% 88%, rgb(var(--pink-rgb) / 0.036), transparent 58%), linear-gradient(180deg, rgb(var(--bg-rgb)), rgb(var(--bg-deep-rgb))), var(--bg) !important;
}

.reserve-backdrop {
  background: rgb(var(--bg-deep-rgb) / 0.82) !important;
}

.reserve-dialog::before {
  opacity: .88;
  background: radial-gradient(760px 360px at 16% 8%, rgb(var(--yellow-rgb) / 0.052), transparent 58%), radial-gradient(780px 380px at 82% 12%, rgb(var(--pink-rgb) / 0.066), transparent 62%), radial-gradient(760px 440px at 50% 105%, rgb(var(--white-rgb) / 0.018), transparent 66%), linear-gradient(180deg, rgb(var(--white-rgb) / 0.026), rgb(var(--white-rgb) / 0.006)) !important;
}

.reserve-btn--primary {
  --btn-border: rgb(var(--yellow-rgb) / 0.34);
  background: linear-gradient(135deg, rgb(var(--pink-rgb) / 0.96), rgb(var(--orange-rgb) / 0.92) 48%, rgb(var(--yellow-rgb) / 0.96)) !important;
}

.footer {
  background: linear-gradient(180deg, rgb(var(--bg-rgb) / 0.98), rgb(var(--bg-deep-rgb) / 1)) !important;
  border-top: 1px solid rgb(var(--white-rgb) / 0.055);
}

/* =========================================================
   HERO - Montagnes sobres et sûres
   Correction après test : suppression des halos agressifs.
   Objectif : reliefs un peu plus lisibles, sans élargir le site.
   ========================================================= */

.hero {
  overflow: hidden !important;
}

.scene {
  overflow: hidden !important;
  contain: paint !important;
}

#heroMountains {
  opacity: 0.40 !important;
  filter: none !important;
  transform-box: fill-box;
  transform-origin: center bottom;
  pointer-events: none;
}

.hero-mountain--back {
  fill: rgb(var(--card-strong-rgb) / 0.20) !important;
  stroke: rgb(var(--yellow-rgb) / 0.060) !important;
  stroke-width: 1.7 !important;
  opacity: 0.78 !important;
  filter: none !important;
}

.hero-mountain--front {
  fill: rgb(var(--card-strong-rgb) / 0.40) !important;
  stroke: rgb(var(--cream-rgb) / 0.075) !important;
  stroke-width: 1.8 !important;
  opacity: 0.90 !important;
  filter: none !important;
}

.hero-snow {
  fill: rgb(var(--cream-rgb) / 0.105) !important;
  opacity: 0.82 !important;
  filter: none !important;
}

.hero-snow--front {
  fill: rgb(var(--cream-rgb) / 0.125) !important;
  opacity: 0.84 !important;
  filter: none !important;
}

/* La séparation lumineuse reste très fine, sans effet de halo massif. */
.hero::after {
  height: 1px !important;
  background: linear-gradient(90deg,
      rgb(var(--white-rgb) / 0) 0%,
      rgb(var(--yellow-rgb) / 0.18) 24%,
      rgb(var(--white-rgb) / 0.10) 50%,
      rgb(var(--pink-rgb) / 0.18) 76%,
      rgb(var(--white-rgb) / 0) 100%) !important;
  box-shadow:
    0 0 8px rgb(var(--yellow-rgb) / 0.035),
    0 0 8px rgb(var(--pink-rgb) / 0.035) !important;
}

#road {
  filter: none !important;
}

@media (max-width: 760px) {
  #heroMountains {
    opacity: 0.32 !important;
    transform: translateY(42px) scale(1.08);
  }

  .hero-mountain--back,
  .hero-mountain--front {
    stroke-width: 1.25 !important;
  }

  .hero-snow,
  .hero-snow--front {
    opacity: 0.66 !important;
  }
}

@media (max-width: 560px) {
  #heroMountains {
    opacity: 0.28 !important;
    transform: translateY(60px) scale(1.16);
  }
}

/* =========================================================
   THEME V10.1 - Ajustements fins
   - Montagnes Hero un peu plus visibles, sans drop-shadow large
   - Sous-texte du loader plus blanc / lisible
   ========================================================= */

/* Montagnes : plus visibles mais sans halo débordant */
#heroMountains {
  opacity: 0.46 !important;
  filter: none !important;
  transform-box: fill-box;
  transform-origin: center bottom;
  pointer-events: none;
}

.hero-mountain--back {
  fill: rgb(var(--card-strong-rgb) / 0.23) !important;
  stroke: rgb(var(--cream-rgb) / 0.075) !important;
  stroke-width: 1.7 !important;
  opacity: 0.86 !important;
  filter: none !important;
}

.hero-mountain--front {
  fill: rgb(var(--card-strong-rgb) / 0.43) !important;
  stroke: rgb(var(--cream-rgb) / 0.095) !important;
  stroke-width: 1.8 !important;
  opacity: 0.94 !important;
  filter: none !important;
}

.hero-snow {
  fill: rgb(var(--cream-rgb) / 0.145) !important;
  opacity: 0.88 !important;
  filter: none !important;
}

.hero-snow--front {
  fill: rgb(var(--cream-rgb) / 0.165) !important;
  opacity: 0.90 !important;
  filter: none !important;
}

/* Ligne basse : visible, mais sans créer de lueur envahissante */
.hero::after {
  height: 1px !important;
  background: linear-gradient(90deg,
      rgb(var(--white-rgb) / 0) 0%,
      rgb(var(--yellow-rgb) / 0.20) 24%,
      rgb(var(--white-rgb) / 0.12) 50%,
      rgb(var(--pink-rgb) / 0.20) 76%,
      rgb(var(--white-rgb) / 0) 100%) !important;
  box-shadow:
    0 0 6px rgb(var(--yellow-rgb) / 0.030),
    0 0 6px rgb(var(--pink-rgb) / 0.030) !important;
}

/* Loader : sous-texte plus blanc et plus premium */
#preloader .loader-subline {
  color: rgb(var(--white-rgb) / 0.82) !important;
  text-shadow:
    0 0 10px rgb(var(--white-rgb) / 0.10),
    0 0 16px rgb(var(--black-rgb) / 0.42) !important;
  letter-spacing: 0.085em !important;
}

/* Sécurité anti-scroll horizontal conservée */
html,
body {
  overflow-x: clip;
}

.hero,
.scene {
  overflow: hidden !important;
}

@media (max-width: 760px) {
  #heroMountains {
    opacity: 0.36 !important;
  }

  .hero-mountain--back {
    fill: rgb(var(--card-strong-rgb) / 0.20) !important;
    stroke: rgb(var(--cream-rgb) / 0.060) !important;
  }

  .hero-mountain--front {
    fill: rgb(var(--card-strong-rgb) / 0.36) !important;
    stroke: rgb(var(--cream-rgb) / 0.075) !important;
  }

  .hero-snow,
  .hero-snow--front {
    opacity: 0.74 !important;
  }
}

@media (max-width: 560px) {
  #heroMountains {
    opacity: 0.30 !important;
  }
}