@import url("./consent-manager-base.css");

/* Harmonisation mobile stricte : même halo violet sur toutes les pages, jour et nuit. */
@media (max-width: 720px) {
  #contenu > .section:not(.conversion-band)::before,
  #contenu > article .section:not(.conversion-band)::before,
  #contenu > .home-hero ~ .home-problems::before,
  #contenu > .home-hero ~ .home-offers::before,
  #contenu > .home-hero ~ .home-engagements::before,
  #contenu > .home-hero ~ .home-method::before,
  #contenu > .home-hero ~ .home-safety::before,
  #contenu > .home-hero ~ .behind-section::before,
  #contenu > .home-hero ~ .faq-section::before,
  #contenu > .home-hero ~ .location-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
      radial-gradient(circle at 84% 24%, rgba(94, 23, 235, 0.14), transparent 42%),
      radial-gradient(circle at 16% 78%, rgba(139, 92, 246, 0.08), transparent 46%) !important;
  }
}

/* Mobile secteurs : halo violet adouci au niveau validé sur Spa & hôtellerie. */
@media (max-width: 720px) {
  body.medicine-page #contenu > .section:not(.conversion-band):not(.section-aqua)::before,
  body.thalasso-page #contenu > .section:not(.conversion-band):not(.section-aqua)::before,
  body.institutes-page #contenu > .section:not(.conversion-band):not(.section-aqua)::before,
  body.pme-page #contenu > .section:not(.conversion-band):not(.section-aqua)::before {
    background:
      radial-gradient(circle at 84% 24%, rgba(94, 23, 235, 0.085), transparent 42%),
      radial-gradient(circle at 16% 78%, rgba(139, 92, 246, 0.045), transparent 46%) !important;
  }
}

/* Mobile jour : aucune nuée de particules sur le corps de l'accueil. */
@media (max-width: 720px) and (prefers-color-scheme: light) {
  html:not(.theme-dark) #contenu > .home-hero ~ .home-problems::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .home-offers::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .home-engagements::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .home-method::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .home-safety::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .behind-section::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .faq-section::after,
  html:not(.theme-dark) #contenu > .home-hero ~ .location-section::after {
    content: none !important;
    display: none !important;
    background: none !important;
    opacity: 0 !important;
  }
}

/* Mode jour : aucun fond de nuit ne doit déborder sur le corps des pages. */
@media (prefers-color-scheme: light) {
  html:not(.theme-dark) body {
    background: #ffffff !important;
    color: #1e2a50 !important;
  }

  html:not(.theme-dark) #contenu > .section:not(.conversion-band) {
    color: #1e2a50;
  }

  html:not(.theme-dark) #contenu > .section:not(.conversion-band):not(.section-soft):not(.section-mist):not(.section-warm):not(.positioning-section) {
    background-color: #ffffff !important;
  }

  html:not(.theme-dark) #contenu > .section.section-soft {
    background: #f7f8fc !important;
  }

  html:not(.theme-dark) #contenu > .section.section-mist {
    background: linear-gradient(135deg, #f7f8fc 0%, #ffffff 52%, #eef4ff 100%) !important;
  }

  html:not(.theme-dark) #contenu > .section.section-warm {
    background: linear-gradient(135deg, #ffffff 0%, #fbfaff 52%, #f1f5ff 100%) !important;
  }

  html:not(.theme-dark) #contenu > .section:not(.conversion-band) p,
  html:not(.theme-dark) #contenu > .section:not(.conversion-band) strong,
  html:not(.theme-dark) #contenu > .section:not(.conversion-band) h1,
  html:not(.theme-dark) #contenu > .section:not(.conversion-band) h2 {
    color: #1e2a50;
  }
}

/* Téléphone du header : passage bleu actif partout, sur toutes les pages et tous les supports. */
.site-header .header-phone-direct,
.site-header .header-phone-direct:hover,
.site-header .header-phone-direct:focus-visible {
  --header-phone-base: #5e17eb;
  color: var(--header-phone-base) !important;
  background-color: var(--header-phone-base) !important;
  background-image: linear-gradient(
    105deg,
    var(--header-phone-base) 0%,
    var(--header-phone-base) 38%,
    rgba(67, 91, 216, 0.34) 45%,
    rgba(0, 176, 255, 0.42) 50%,
    rgba(67, 91, 216, 0.34) 55%,
    var(--header-phone-base) 62%,
    var(--header-phone-base) 100%
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 260% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: header-phone-wave-text 7s ease-in-out infinite !important;
}

html.theme-dark .site-header .header-phone-direct,
html.theme-dark .site-header .header-phone-direct:hover,
html.theme-dark .site-header .header-phone-direct:focus-visible {
  --header-phone-base: #ffffff;
}

@media (prefers-color-scheme: dark) {
  html:not(.theme-light) .site-header .header-phone-direct,
  html:not(.theme-light) .site-header .header-phone-direct:hover,
  html:not(.theme-light) .site-header .header-phone-direct:focus-visible {
    --header-phone-base: #ffffff;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header .header-phone-direct,
  .site-header .header-phone-direct:hover,
  .site-header .header-phone-direct:focus-visible {
    animation: none !important;
    background-image: none !important;
    -webkit-text-fill-color: currentColor !important;
  }
}

/* Accueil — desktop nuit uniquement : restaure un passage bleu franc sur le téléphone. */
@keyframes header-phone-night-blue-wave {
  0%, 28%, 100% { background-position: 100% 50%; }
  52% { background-position: 0% 50%; }
}

@media (min-width: 1100px) {
  html.theme-dark body:has(.home-hero) .site-header .header-phone-direct,
  html.theme-dark body:has(.home-hero) .site-header .header-phone-direct:hover,
  html.theme-dark body:has(.home-hero) .site-header .header-phone-direct:focus-visible {
    color: #ffffff !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(
      105deg,
      #ffffff 0%,
      #ffffff 31%,
      #5d7cff 40%,
      #00b0ff 48%,
      #248cff 56%,
      #ffffff 67%,
      #ffffff 100%
    ) !important;
    background-repeat: no-repeat !important;
    background-size: 280% 100% !important;
    background-position: 100% 50%;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: 0 0 10px rgba(0, 176, 255, 0.10);
    animation: header-phone-night-blue-wave 6s ease-in-out infinite !important;
  }
}

@media (min-width: 1100px) and (prefers-color-scheme: dark) {
  html:not(.theme-light) body:has(.home-hero) .site-header .header-phone-direct,
  html:not(.theme-light) body:has(.home-hero) .site-header .header-phone-direct:hover,
  html:not(.theme-light) body:has(.home-hero) .site-header .header-phone-direct:focus-visible {
    color: #ffffff !important;
    background-color: #ffffff !important;
    background-image: linear-gradient(
      105deg,
      #ffffff 0%,
      #ffffff 31%,
      #5d7cff 40%,
      #00b0ff 48%,
      #248cff 56%,
      #ffffff 67%,
      #ffffff 100%
    ) !important;
    background-repeat: no-repeat !important;
    background-size: 280% 100% !important;
    background-position: 100% 50%;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: 0 0 10px rgba(0, 176, 255, 0.10);
    animation: header-phone-night-blue-wave 6s ease-in-out infinite !important;
  }
}

@media (min-width: 1100px) and (prefers-reduced-motion: reduce) {
  html.theme-dark body:has(.home-hero) .site-header .header-phone-direct,
  html:not(.theme-light) body:has(.home-hero) .site-header .header-phone-direct {
    animation: none !important;
    background-image: linear-gradient(105deg, #ffffff 0%, #ffffff 36%, #00b0ff 50%, #ffffff 64%, #ffffff 100%) !important;
    background-size: 100% 100% !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
  }
}

/* Mode nuit — liseré unique violet → bleu sur tous les blocs bénéfice / conclusion. */
html.theme-dark #contenu [class*="benefit"],
html.theme-dark #contenu .sector-reality-conclusion,
html.theme-dark #contenu .sector-method-conclusion,
html.theme-dark #contenu .institutes-reality-conclusion,
html.theme-dark #contenu .institutes-method-conclusion,
html.theme-dark #contenu .medicine-reality-conclusion,
html.theme-dark #contenu .medicine-method-conclusion,
html[data-theme="dark"] #contenu [class*="benefit"],
html[data-theme="dark"] #contenu .sector-reality-conclusion,
html[data-theme="dark"] #contenu .sector-method-conclusion {
  position: relative;
  overflow: hidden;
  border-left: 0 !important;
}

html.theme-dark #contenu [class*="benefit"]::before,
html.theme-dark #contenu .sector-reality-conclusion::before,
html.theme-dark #contenu .sector-method-conclusion::before,
html.theme-dark #contenu .institutes-reality-conclusion::before,
html.theme-dark #contenu .institutes-method-conclusion::before,
html.theme-dark #contenu .medicine-reality-conclusion::before,
html.theme-dark #contenu .medicine-method-conclusion::before,
html[data-theme="dark"] #contenu [class*="benefit"]::before,
html[data-theme="dark"] #contenu .sector-reality-conclusion::before,
html[data-theme="dark"] #contenu .sector-method-conclusion::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: 3px !important;
  height: auto !important;
  border: 0 !important;
  box-shadow: none !important;
  background: linear-gradient(180deg, rgba(94, 23, 235, 0.82) 0%, rgba(0, 176, 255, 0.76) 100%) !important;
}

@media (prefers-color-scheme: dark) {
  html:not(.theme-light) #contenu [class*="benefit"],
  html:not(.theme-light) #contenu .sector-reality-conclusion,
  html:not(.theme-light) #contenu .sector-method-conclusion,
  html:not(.theme-light) #contenu .institutes-reality-conclusion,
  html:not(.theme-light) #contenu .institutes-method-conclusion,
  html:not(.theme-light) #contenu .medicine-reality-conclusion,
  html:not(.theme-light) #contenu .medicine-method-conclusion {
    position: relative;
    overflow: hidden;
    border-left: 0 !important;
  }

  html:not(.theme-light) #contenu [class*="benefit"]::before,
  html:not(.theme-light) #contenu .sector-reality-conclusion::before,
  html:not(.theme-light) #contenu .sector-method-conclusion::before,
  html:not(.theme-light) #contenu .institutes-reality-conclusion::before,
  html:not(.theme-light) #contenu .institutes-method-conclusion::before,
  html:not(.theme-light) #contenu .medicine-reality-conclusion::before,
  html:not(.theme-light) #contenu .medicine-method-conclusion::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: 3px !important;
    height: auto !important;
    border: 0 !important;
    box-shadow: none !important;
    background: linear-gradient(180deg, rgba(94, 23, 235, 0.82) 0%, rgba(0, 176, 255, 0.76) 100%) !important;
  }
}

/* Instituts & indépendantes — mode jour uniquement : textes de cartes allégés et lien interne violet lavande. */
html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-editorial-content p,
html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-onboarding-copy,
html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-onboarding-benefit {
  font-weight: 400 !important;
}

html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-editorial-benefit strong,
html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-onboarding-benefit strong {
  font-weight: 700 !important;
}

html[data-theme="light"] body.institutes-page .section-soft.section-aqua .institutes-editorial-content p > a {
  color: #6b4bb3 !important;
  -webkit-text-fill-color: #6b4bb3 !important;
}

@media (prefers-color-scheme: light) {
  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-editorial-content p,
  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-onboarding-copy,
  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-onboarding-benefit {
    font-weight: 400 !important;
  }

  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-editorial-benefit strong,
  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-onboarding-benefit strong {
    font-weight: 700 !important;
  }

  html:not(.theme-dark):not([data-theme="dark"]) body.institutes-page .section-soft.section-aqua .institutes-editorial-content p > a {
    color: #6b4bb3 !important;
    -webkit-text-fill-color: #6b4bb3 !important;
  }
}

/* Spa & Hôtellerie — mode jour uniquement : titre Turnover harmonisé et textes Bénéfice allégés. */
html[data-theme="light"] body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-heading h3 {
  color: #5422b3 !important;
  -webkit-text-fill-color: #5422b3 !important;
}

html[data-theme="light"] body.spa-page #contenu > .section.section-soft.section-aqua .sector-editorial-benefit,
html[data-theme="light"] body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-benefit {
  font-weight: 400 !important;
}

html[data-theme="light"] body.spa-page #contenu > .section.section-soft.section-aqua .sector-editorial-benefit strong,
html[data-theme="light"] body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-benefit strong {
  font-weight: 600 !important;
}

@media (prefers-color-scheme: light) {
  html:not(.theme-dark):not([data-theme="dark"]) body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-heading h3 {
    color: #5422b3 !important;
    -webkit-text-fill-color: #5422b3 !important;
  }

  html:not(.theme-dark):not([data-theme="dark"]) body.spa-page #contenu > .section.section-soft.section-aqua .sector-editorial-benefit,
  html:not(.theme-dark):not([data-theme="dark"]) body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-benefit {
    font-weight: 400 !important;
  }

  html:not(.theme-dark):not([data-theme="dark"]) body.spa-page #contenu > .section.section-soft.section-aqua .sector-editorial-benefit strong,
  html:not(.theme-dark):not([data-theme="dark"]) body.spa-page #contenu > .section.section-soft.section-aqua .spa-turnover-benefit strong {
    font-weight: 600 !important;
  }
}