/*
 * PRATINIUM v436 — Noir de luxe sur l'ensemble du hero
 * Remplace tous les fonds gris/bleu-gris du hero par une palette noir profond,
 * avec des reflets or champagne et cyan très discrets. Le cadre du parcours
 * reste supprimé et les états actifs demeurent parfaitement identifiables.
 */

body#index .pf-hero,
body#index section.pf-hero {
  background:
    radial-gradient(circle at 21% 38%, rgba(202, 164, 83, .10), transparent 31%),
    radial-gradient(circle at 78% 31%, rgba(53, 178, 211, .075), transparent 30%),
    linear-gradient(135deg, #020202 0%, #080808 47%, #030303 100%) !important;
  border-color: rgba(218, 184, 104, .20) !important;
  box-shadow:
    0 36px 110px rgba(0, 0, 0, .58),
    inset 0 1px 0 rgba(255, 255, 255, .055),
    inset 0 -1px 0 rgba(218, 184, 104, .08) !important;
}

body#index .pf-hero__media,
body#index .pf-hero__media picture {
  background: #020202 !important;
}

/* L'illustration reste présente comme texture, mais ne produit plus de grand fond gris. */
body#index .pf-hero__bg-img {
  opacity: .48 !important;
  filter: grayscale(.30) contrast(1.30) saturate(.70) brightness(.42) !important;
}

/* Voile noir continu sur toute la surface, avec seulement deux reflets de prestige. */
body#index .pf-hero::after,
body#index section.pf-hero::after {
  background:
    radial-gradient(ellipse at 22% 43%, rgba(0, 0, 0, .18) 0%, rgba(0, 0, 0, .50) 43%, transparent 66%),
    radial-gradient(ellipse at 77% 42%, rgba(11, 32, 37, .24) 0%, transparent 42%),
    radial-gradient(ellipse at 58% 0%, rgba(219, 184, 105, .075) 0%, transparent 34%),
    linear-gradient(90deg, rgba(0, 0, 0, .72) 0%, rgba(2, 2, 2, .58) 47%, rgba(0, 0, 0, .70) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .18) 0%, rgba(0, 0, 0, .36) 100%) !important;
  opacity: 1 !important;
}

/* L'ancien halo supérieur devient un reflet champagne extrêmement discret. */
body#index .pf-hero::before,
body#index section.pf-hero::before {
  background:
    radial-gradient(ellipse at 18% 48%, rgba(226, 192, 112, .16), transparent 49%),
    radial-gradient(ellipse at 72% 26%, rgba(85, 203, 225, .075), transparent 48%) !important;
  filter: blur(26px) saturate(.90) !important;
  opacity: .46 !important;
}

/* Le grand cadran rond de gauche devient onyx, sans gris laiteux. */
body#index .pf-hero__copy::before,
body#index .pf-hero__copy:before {
  background:
    radial-gradient(circle at 40% 34%, rgba(27, 27, 27, .97) 0%, rgba(11, 11, 11, .985) 46%, rgba(2, 2, 2, .97) 74%, rgba(0, 0, 0, .10) 100%) !important;
  border: 1px solid rgba(218, 184, 104, .12) !important;
  box-shadow:
    0 34px 100px rgba(0, 0, 0, .66),
    inset 0 1px 0 rgba(255, 255, 255, .045),
    inset 0 -24px 70px rgba(0, 0, 0, .34) !important;
}

body#index .pf-hero__title {
  color: #ffffff !important;
  text-shadow: 0 8px 30px rgba(0, 0, 0, .90), 0 1px 0 rgba(255, 255, 255, .06) !important;
}

body#index .pf-hero__subtitle::after,
body#index .pf-hero__subtitle:after {
  color: #f2d990 !important;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .92) !important;
}

/* Parcours sans cadre : uniquement une ombre noire diffuse, sans rectangle perceptible. */
body#index .pf-hero-journey {
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 18px 34px rgba(0, 0, 0, .32)) !important;
}

body#index .pf-hero-journey__title {
  color: #fff8e6 !important;
  text-shadow: 0 3px 14px rgba(0, 0, 0, .96) !important;
}

/* Tous les onglets passent au noir de luxe. */
body#index .pf-hero-journey .pf-tab,
body#index .pf-hero-journey__head .pf-tab {
  color: #f8f5ed !important;
  background:
    linear-gradient(180deg, rgba(23, 23, 22, .96) 0%, rgba(5, 5, 5, .96) 100%) !important;
  border: 1px solid rgba(218, 184, 104, .34) !important;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, .46),
    inset 0 1px 0 rgba(255, 255, 255, .065),
    inset 0 -1px 0 rgba(218, 184, 104, .055) !important;
  text-shadow: 0 2px 7px rgba(0, 0, 0, .92) !important;
}

body#index .pf-hero-journey .pf-tab:hover,
body#index .pf-hero-journey__head .pf-tab:hover {
  color: #fff8e4 !important;
  background: linear-gradient(180deg, #1d1a13 0%, #080704 100%) !important;
  border-color: rgba(242, 211, 135, .72) !important;
  box-shadow:
    0 14px 30px rgba(0, 0, 0, .52),
    0 0 0 1px rgba(218, 184, 104, .13),
    inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

/* Profil actif : reste noir, distingué par l'or plutôt que par un fond gris clair. */
body#index .pf-hero-journey .pf-tab--active,
body#index .pf-hero-journey .pf-tab[aria-selected="true"],
body#index .pf-hero-journey__head .pf-tab--active,
body#index .pf-hero-journey__head .pf-tab[aria-selected="true"] {
  color: #ffe7a5 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(231, 193, 105, .18), transparent 68%),
    linear-gradient(180deg, #19150d 0%, #050504 100%) !important;
  border-color: #e3c06d !important;
  box-shadow:
    0 0 0 2px rgba(227, 192, 109, .22),
    0 16px 34px rgba(0, 0, 0, .54),
    inset 0 1px 0 rgba(255, 239, 196, .18),
    inset 0 -1px 0 rgba(227, 192, 109, .16) !important;
  text-shadow: 0 2px 9px rgba(0, 0, 0, .94) !important;
}

/* Le CTA or reste le seul grand point lumineux du hero. */
body#index .pf-hero-login-cta,
body#index .pf-hero-journey__head .pf-hero-login-cta {
  color: #171006 !important;
  background: linear-gradient(135deg, #fff0b1 0%, #e7c164 47%, #b98226 100%) !important;
  border-color: rgba(255, 244, 210, .82) !important;
  box-shadow:
    0 16px 38px rgba(0, 0, 0, .48),
    0 0 28px rgba(213, 165, 58, .20),
    inset 0 1px 0 rgba(255, 255, 255, .74) !important;
}

body#index .pf-hero-login-cta:hover,
body#index .pf-hero-login-cta:focus-visible {
  color: #120d05 !important;
  background: linear-gradient(135deg, #fff5ca 0%, #edcb77 48%, #c58d2c 100%) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, .56),
    0 0 34px rgba(225, 181, 78, .28),
    inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

body#index .pf-hero-journey .pf-step__num {
  color: #f5d98f !important;
  background: linear-gradient(180deg, #1b1811 0%, #050505 100%) !important;
  border-color: rgba(226, 191, 107, .72) !important;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, .52),
    inset 0 1px 0 rgba(255, 240, 198, .10) !important;
}

body#index .pf-hero-journey .pf-step__title {
  color: #fffdf7 !important;
  text-shadow: 0 3px 12px rgba(0, 0, 0, .96) !important;
}

body#index .pf-hero-journey .pf-step__desc {
  color: rgba(245, 242, 233, .88) !important;
  text-shadow: 0 2px 9px rgba(0, 0, 0, .96) !important;
}

body#index .pf-hero-journey .pf-step__arrow {
  color: rgba(224, 194, 122, .54) !important;
}

/* La preuve sociale reste or champagne, mieux intégrée au noir. */
body#index .pf-hero__badge {
  background: linear-gradient(145deg, #fff0b0 0%, #e8c269 48%, #bd8528 100%) !important;
  border-color: rgba(255, 244, 211, .76) !important;
  box-shadow:
    0 20px 46px rgba(0, 0, 0, .52),
    0 0 24px rgba(213, 165, 58, .16),
    inset 0 1px 0 rgba(255, 255, 255, .70) !important;
}

/* Les ornements restent subtils et métalliques, jamais gris laiteux. */
body#index .pf-hero__overlay::before {
  opacity: .48 !important;
  filter: sepia(.15) contrast(1.12) brightness(.72) drop-shadow(0 0 12px rgba(199, 162, 78, .09)) !important;
}

body#index .pf-hero__overlay::after {
  opacity: .23 !important;
  mix-blend-mode: screen !important;
}

@media (max-width: 1180px) {
  body#index .pf-hero::after,
  body#index section.pf-hero::after {
    background:
      radial-gradient(ellipse at 50% 22%, rgba(0, 0, 0, .20), rgba(0, 0, 0, .68) 56%, transparent 76%),
      radial-gradient(ellipse at 50% 78%, rgba(14, 30, 31, .18), transparent 46%),
      linear-gradient(180deg, rgba(0, 0, 0, .62), rgba(2, 2, 2, .72)) !important;
  }

  body#index .pf-hero__bg-img {
    opacity: .42 !important;
    filter: grayscale(.34) contrast(1.28) saturate(.66) brightness(.38) !important;
  }
}

@media (max-width: 767px) {
  body#index .pf-hero,
  body#index section.pf-hero {
    background:
      radial-gradient(circle at 50% 12%, rgba(207, 169, 80, .085), transparent 29%),
      linear-gradient(155deg, #020202 0%, #090909 52%, #010101 100%) !important;
  }

  body#index .pf-hero__copy::before,
  body#index .pf-hero__copy:before {
    background: radial-gradient(circle at 42% 36%, #191919 0%, #080808 53%, #010101 82%, rgba(0,0,0,.08) 100%) !important;
  }
}