/* ============================================================================
   Signamax · Surcouche de thème "Yes We Prompt"
   ----------------------------------------------------------------------------
   Ne touche NI à la typographie NI au contenu : ne fait que remapper les
   jetons de couleur de la marque (échelle --c-forest-*) vers le bleu YWP
   (bleu bleuet / royal échantillonné sur le logo : #5576FF → #648FFF).
   Chargé après landing.css → ces déclarations gagnent.
   ========================================================================= */

:root {
  /* Échelle bleue YWP (remplace l'échelle verte « forest ») */
  --c-forest-100: #e8ecff;   /* pâle — fonds teintés, chips douces */
  --c-forest-500: #6d86ff;   /* moyen — secondaire, illustrations */
  --c-forest-600: #4f6bff;   /* PRIMAIRE · bleu de marque YWP */
  --c-forest-700: #3a51e6;   /* hover / press */
  --c-forest-900: #1c1c1e;   /* anthracite neutre — surfaces sombres (= couleur du menu YWP) */

  /* Surfaces : on quitte l'ivoire chaud (ancienne marque verte) pour le
     blanc + lavande froide de yes-we-prompt.fr */
  --c-paper-sunk: #eef1fb;   /* sections alternées, champs, placeholders — lavande très pâle */
  --c-paper-elev: #ffffff;   /* cartes */

  /* L'anneau de focus suivait le vert ; on le repasse en bleu */
  --ring-focus: 0 0 0 3px rgba(79, 107, 255, 0.20), inset 0 0 0 1px var(--c-forest-600);
}

/* Anneaux de focus codés en dur dans les feuilles (étaient verts) */
.btn:focus-visible,
.nav-link:focus-visible,
.chip:focus-visible,
.devis-option:focus-visible {
  box-shadow: 0 0 0 3px rgba(79, 107, 255, 0.22) !important;
}
.input:focus, .select:focus, .textarea:focus {
  border-color: var(--c-forest-600);
  box-shadow: 0 0 0 3px rgba(79, 107, 255, 0.14);
}

/* ============================================================================
   HERO — dégradé identique à yes-we-prompt.fr
   ----------------------------------------------------------------------------
   Leur hero est CLAIR : blanc en haut → mauve/lavande très pâle en bas
   (#ffffff → #e2e6ff), texte foncé, mots-clés en bleu royal.
   Le gradient lui-même est posé en inline (tweak heroBg = chaîne CSS) ;
   ici on rend simplement le texte du hero lisible sur fond clair.
   ========================================================================= */
.hero-gradient-bg {
  background: linear-gradient(180deg, #ffffff 0%, #f1f3ff 50%, #e2e6ff 100%);
}

/* Le template force la classe .hero-has-video (texte blanc). Sur fond clair,
   on repasse tout le texte du hero en foncé. */
.hero.hero-has-video { color: var(--c-ink); }
.hero.hero-has-video .hero-static-line,
.hero.hero-has-video .hero-rotator { color: var(--c-ink); }

/* Filet de sécurité : si l'animation d'entrée (rAF) ne se déclenche pas
   — ex. onglet non focalisé au chargement — les lettres restent visibles. */
.hero-static-line .hero-letter { animation: ywp-letter-in 0.4s ease 1.1s forwards; }
.hero-static-line .hero-letter.is-in { animation: none; }
@keyframes ywp-letter-in { to { opacity: 1; transform: none; } }
.hero.hero-has-video .hero-rotator-word {
  color: var(--c-forest-600);
  mix-blend-mode: normal;
}
.hero.hero-has-video .hero-sub { color: var(--c-ink-70); }
.hero.hero-has-video .hero-marquee,
.hero.hero-has-video .hero-marquee strong { color: var(--c-ink-55); }
.hero.hero-has-video .hero-marquee strong { color: var(--c-ink); }

/* Badge région : pastille blanche, texte foncé (comme les badges YWP) */
.hero.hero-has-video .hero-tag {
  background: #ffffff;
  color: var(--c-ink);
  border: 1px solid var(--c-ink-12);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 1px 2px rgba(14, 19, 15, 0.05);
}
.hero.hero-has-video .hero-tag::before { background: var(--c-forest-600); }

/* Bouton secondaire : blanc, texte foncé, fine bordure (style YWP) */
.hero.hero-has-video .btn-secondary {
  color: var(--c-ink);
  background: rgba(255, 255, 255, 0.7);
  box-shadow: inset 0 0 0 1px var(--c-ink-12);
}
.hero.hero-has-video .btn-secondary:hover { background: #ffffff; }

/* Stats / placeholder éventuels à droite : cartes claires lisibles */
.hero.hero-has-video .hero-stat-num { color: var(--c-ink); }
.hero.hero-has-video .hero-stat-label { color: var(--c-ink-55); }
.hero.hero-has-video .hero-stat { border-top-color: var(--c-ink-12); }
.hero.hero-has-video .hero-image,
.hero.hero-has-video .hero-image-placeholder {
  background: rgba(79, 107, 255, 0.06);
  border-color: var(--c-ink-12);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Si une image de fond de hero est posée, garder un voile clair cohérent */
.hero-video-overlay {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.45) 0%, rgba(226, 230, 255, 0.35) 100%);
}
.hero-video-overlay.hero-image-overlay {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.30) 0%, rgba(226, 230, 255, 0.45) 100%);
}

/* ============================================================================
   MENU / NAV — mêmes couleurs que yes-we-prompt.fr
   ----------------------------------------------------------------------------
   Barre blanche · liens noir, lien actif/survol bleu royal (#4062ff) ·
   bouton CTA anthracite (#292929) texte blanc. Tout est limité à .nav :
   aucune autre partie du site n'est touchée.
   ========================================================================= */
.nav { background: rgba(255, 255, 255, 0.92); }
.nav .nav-link { color: #1c1c1e; font-size: 16px; }
.nav .nav-link:hover { color: #4062ff; background: transparent; }
.nav .nav-link.is-active { color: #4062ff; }

.nav .nav-cta-desktop.btn-primary {
  background: #292929;
  color: #ffffff;
  font-size: 15px;
}
.nav .nav-cta-desktop.btn-primary:hover { background: #3a3a3a; }

/* Bandeau logos clients — réglages issus des éditions directes */
.trust .trust-logos { color: rgba(15, 15, 15, 0.88); }
.trust .trust-logo img { object-fit: scale-down; }

/* Étapes de pose sur fond sombre (page Film solaire) — texte lisible */
.section-dark .process-step h3 { color: var(--c-on-forest); }
.section-dark .process-step p { color: var(--c-on-forest-muted); }
.section-dark .process-step-tag { color: var(--c-on-forest-faint); }
.section-dark .process-step,
.section-dark .process-step:last-child { border-color: var(--c-on-forest-line); }