/* Thème sombre premium de la home. Actif uniquement sur body.lv-dark.
   Surcharge les utilitaires Tailwind de home.ejs / header.ejs / footer.ejs. */

body.lv-dark {
  --bg: #08090b;
  --bg-2: #0d0f12;
  --surface: #121418;
  --surface-2: #171a1f;
  --line: rgba(255, 255, 255, 0.08);
  --line-2: rgba(255, 255, 255, 0.14);
  --fg: #ededef;
  --fg-2: #b4b7c0;
  --muted: #7d818c;
  --accent: #7cf2c4;
  --accent-2: #3fd9a0;
  --accent-ink: #04140e;
  --warn: #f5b971;
  --font-sans: 'Geist', ui-sans-serif, system-ui, sans-serif;
  --font-serif: 'Instrument Serif', Georgia, serif;
  --font-mono: 'Geist Mono', ui-monospace, monospace;

  background: var(--bg) !important;
  color: var(--fg-2);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

/* Grain discret sur toute la page */
body.lv-dark::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 60;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

body.lv-dark .font-display,
body.lv-dark h1, body.lv-dark h2, body.lv-dark h3 { font-family: var(--font-sans) !important; }
body.lv-dark > div[style*="background"] { background: transparent !important; }

/* Titres */
body.lv-dark h1 {
  font-weight: 600 !important;
  letter-spacing: -0.035em !important;
  color: #fff !important;
}
body.lv-dark h2 {
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  color: #fff !important;
}
body.lv-dark h3 { font-weight: 600 !important; letter-spacing: -0.015em; color: #fff !important; }
body.lv-dark .grad-text {
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--accent) !important;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
}

/* Textes */
body.lv-dark .text-ink-950 { color: var(--fg) !important; }
body.lv-dark .text-ink-800 { color: var(--fg-2) !important; }
body.lv-dark .text-ink-600,
body.lv-dark .text-ink-500 { color: var(--muted) !important; }
body.lv-dark .text-ink-400 { color: #5f636d !important; }
body.lv-dark .text-primary,
body.lv-dark .text-accent-dark { color: var(--accent) !important; }
body.lv-dark .hover\:text-primary:hover { color: var(--accent) !important; }

/* Étiquettes au-dessus des titres : plus de pastilles, une ligne mono */
body.lv-dark section span.inline-block.rounded-full.uppercase {
  background: none !important;
  color: var(--accent) !important;
  font-family: var(--font-mono);
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  font-size: 11px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
}
body.lv-dark section span.inline-block.rounded-full.uppercase::before {
  content: "";
  width: 18px;
  height: 1px;
  background: var(--accent);
  opacity: .7;
}
body.lv-dark section p.uppercase { font-family: var(--font-mono); font-weight: 500 !important; letter-spacing: 0.12em !important; }

/* Surfaces */
body.lv-dark .bg-white,
body.lv-dark .bg-white\/90,
body.lv-dark .bg-white\/95 { background: var(--surface) !important; }
body.lv-dark .bg-ink-50 { background: var(--surface-2) !important; }
body.lv-dark .bg-primary-light { background: rgba(124, 242, 196, 0.08) !important; }
body.lv-dark .bg-accent-light { background: rgba(124, 242, 196, 0.08) !important; }
body.lv-dark .border-ink-100,
body.lv-dark .border-ink-200 { border-color: var(--line) !important; }
body.lv-dark .border-white { border-color: var(--line-2) !important; }
body.lv-dark [class*="shadow-["] { box-shadow: none !important; }
body.lv-dark .rounded-3xl,
body.lv-dark .rounded-\[2rem\] { border-radius: 18px !important; }
body.lv-dark .hover\:bg-ink-50:hover,
body.lv-dark .hover\:bg-primary-light:hover { background: var(--surface-2) !important; }

/* Cartes : liseré lumineux au survol */
body.lv-dark .lv-card {
  position: relative;
  transition: border-color .35s ease, transform .35s ease;
}
body.lv-dark .lv-card:hover { border-color: var(--line-2) !important; transform: translateY(-2px); }

/* Halos décoratifs d'origine : remplacés par la scène du hero */
body.lv-dark #hero > .pointer-events-none { display: none; }

/* Hero : grille + lueur */
body.lv-dark #hero {
  background:
    radial-gradient(60% 50% at 50% 0%, rgba(124, 242, 196, 0.13), transparent 70%),
    radial-gradient(40% 35% at 85% 30%, rgba(99, 102, 241, 0.10), transparent 70%);
}
body.lv-dark #hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(70% 55% at 50% 20%, #000 30%, transparent 75%);
  mask-image: radial-gradient(70% 55% at 50% 20%, #000 30%, transparent 75%);
  opacity: .55;
}
body.lv-dark #hero h1 { font-size: clamp(2.3rem, 5.6vw, 4.1rem) !important; line-height: 1.02 !important; }
body.lv-dark #hero h1 + p { color: var(--fg-2) !important; font-size: 1.2rem; }
body.lv-dark #hero-video-card { border: 1px solid var(--line-2) !important; border-radius: 18px !important; box-shadow: 0 40px 120px -20px rgba(124, 242, 196, 0.18) !important; }
body.lv-dark #hero-video-card video { border-radius: 17px !important; }

/* Boutons */
body.lv-dark .grad-btn {
  background: var(--accent) !important;
  color: var(--accent-ink) !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 1px rgba(124, 242, 196, .4), 0 10px 40px -10px rgba(124, 242, 196, .55) !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important;
}
body.lv-dark .grad-btn:hover { background: #a3f7d7 !important; transform: translateY(-1px); }
body.lv-dark a.border.rounded-full,
body.lv-dark a.rounded-full.border { background: transparent !important; color: var(--fg) !important; border-color: var(--line-2) !important; }
body.lv-dark a.border.rounded-full:hover { border-color: rgba(255,255,255,.35) !important; }

/* Bloc « Partenaire, pas agence » : déjà sombre, on le détache */
body.lv-dark section.bg-ink-950 {
  background:
    radial-gradient(50% 80% at 100% 0%, rgba(124, 242, 196, 0.08), transparent 60%),
    var(--bg-2) !important;
  border: 1px solid var(--line);
  border-radius: 24px !important;
}

/* Tarifs : la carte mise en avant */
body.lv-dark #pricing .bg-primary {
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(124, 242, 196, 0.16), transparent 55%),
    var(--surface) !important;
  border: 1px solid rgba(124, 242, 196, 0.35);
  color: var(--fg) !important;
}
body.lv-dark #pricing .bg-primary .text-white\/70,
body.lv-dark #pricing .bg-primary .text-white\/90 { color: var(--fg-2) !important; }
body.lv-dark #pricing .bg-primary .text-4xl { font-family: var(--font-sans); letter-spacing: -0.03em; color: #fff; }
body.lv-dark #pricing .bg-primary svg path[stroke="white"] { stroke: var(--accent); }
body.lv-dark #pricing svg path[stroke="#4f46e5"] { stroke: var(--accent); }
body.lv-dark #pricing .bg-primary a.bg-white { background: var(--accent) !important; color: var(--accent-ink) !important; }
body.lv-dark svg.text-primary { color: var(--accent) !important; }

/* FAQ */
body.lv-dark details { background: transparent !important; border-radius: 0 !important; border-width: 0 0 1px 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
body.lv-dark details summary span { font-weight: 500 !important; }

/* CTA final */
body.lv-dark #contact > div {
  background:
    radial-gradient(60% 120% at 50% 0%, rgba(124, 242, 196, 0.16), transparent 70%),
    var(--bg-2) !important;
  border: 1px solid var(--line);
}

/* En-tête */
body.lv-dark #siteHeader > div,
body.lv-dark #siteHeader nav { background: transparent; }
body.lv-dark #siteHeader .bg-white,
body.lv-dark #siteHeader .bg-white\/90,
body.lv-dark #siteHeader .bg-white\/95 {
  background: rgba(13, 15, 18, 0.72) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-color: var(--line) !important;
}
body.lv-dark #siteHeader .text-ink-800,
body.lv-dark #siteHeader .text-ink-950 { color: var(--fg) !important; }

/* Pied de page */
body.lv-dark footer { background: var(--bg) !important; border-top: 1px solid var(--line); color: var(--muted); }
body.lv-dark footer .bg-ink-950 { background: var(--bg) !important; }

/* Apparition au scroll */
body.lv-dark .lv-reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
body.lv-dark .lv-reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  body.lv-dark .lv-reveal { opacity: 1; transform: none; transition: none; }
  body.lv-dark .lv-card:hover { transform: none; }
}

/* Angles nets : on casse le style « tout arrondi » */
body.lv-dark [class*="rounded"]:not(img):not(.w-9):not(.h-9) { border-radius: 4px !important; }
body.lv-dark a[class*="rounded-full"],
body.lv-dark button[class*="rounded-full"] { border-radius: 3px !important; }
body.lv-dark #hero-video-card, body.lv-dark #hero-video-card video { border-radius: 6px !important; }
body.lv-dark section.bg-ink-950, body.lv-dark #contact > div { border-radius: 6px !important; }
body.lv-dark img.rounded-full { border-radius: 50% !important; }
/* Coins repères sur les cartes, façon plan technique */
body.lv-dark .lv-card::after {
  content: ""; position: absolute; top: -1px; left: -1px; width: 10px; height: 10px;
  border-top: 1px solid var(--accent); border-left: 1px solid var(--accent); opacity: .7;
}
/* Avis mis en avant : plus de dégradé violet */
body.lv-dark .bg-gradient-to-br.from-primary {
  background: radial-gradient(110% 90% at 0% 0%, rgba(124,242,196,.14), transparent 60%), var(--surface) !important;
  border: 1px solid rgba(124,242,196,.3) !important;
}
body.lv-dark .bg-gradient-to-br.from-primary > p:first-child { font-family: var(--font-serif); font-style: italic; font-weight: 400 !important; font-size: 1.55rem !important; line-height: 1.3 !important; letter-spacing: -0.01em; color: #fff !important; }
body.lv-dark .bg-gradient-to-br.from-primary a { color: var(--accent) !important; }

/* Hero en 2 colonnes : texte + téléphone du client */
.lvh-grid { display: grid; gap: 3.5rem; align-items: center; }
@media (min-width: 1024px) {
  .lvh-grid { grid-template-columns: 1.15fr 340px; gap: 4rem; padding-top: 1.5rem; }
  .lvh-text { text-align: left !important; margin: 0 !important; max-width: none !important; }
  .lvh-text p.mx-auto { margin-left: 0 !important; }
  .lvh-text .justify-center { justify-content: flex-start !important; }
}
body.lv-dark #hero .lvh-text h1 { font-size: clamp(2.3rem, 5vw, 4rem) !important; }
@media (max-width: 1023px) { .lvh-grid .tph-phone { width: 272px; height: 540px; } .lvh-grid .ntf-clock b { font-size: 3.3rem; } .lvh-grid { gap: 2.5rem; } }
@media (max-width: 480px) { .tph .tph-phone { width: 272px; height: 560px; } }

/* Bloc vidéo */
.lvv-head { margin-bottom: 1.5rem; }
.lvv-eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); display: inline-flex; align-items: center; gap: 10px; }
.lvv-eyebrow::before { content: ""; width: 18px; height: 1px; background: var(--accent); opacity: .7; }
.lvv-title { margin-top: .8rem; font-size: clamp(1.6rem, 3vw, 2.2rem); }

/* ===== Pages guides (sdr-prospection, système multicanal, offre claire, SaaS) : variables retournées ===== */
body.lv-dark {
  --sp-noir: #ffffff; --noir: #ffffff;
  --sp-encre: #ededef; --encre: #ededef;
  --sp-gris-texte: #b4b7c0; --gris-texte: #b4b7c0;
  --sp-gris-doux: #121418; --gris-doux: #121418;
  --sp-gris-bord: rgba(255,255,255,.1); --gris-bord: rgba(255,255,255,.1);
  --sp-accent: #7cf2c4; --accent: #7cf2c4;
  --sp-accent-clair: rgba(124,242,196,.08); --accent-clair: rgba(124,242,196,.08);
  --sp-vert: #7cf2c4; --vert: #7cf2c4;
  --sp-vert-clair: rgba(124,242,196,.08); --vert-clair: rgba(124,242,196,.08);
  --sp-blanc: #0d0f12; --blanc: #0d0f12;

  /* Études de cas */
  --indigo-950: #08090b; --indigo-900: #0d0f12; --indigo-700: #a3f7d7; --indigo-600: #7cf2c4;
  --indigo-500: #7cf2c4; --indigo-400: #7cf2c4; --indigo-100: rgba(124,242,196,.14); --indigo-50: rgba(124,242,196,.06);
  --slate-900: #ededef; --slate-700: #b4b7c0; --slate-500: #7d818c; --slate-200: rgba(255,255,255,.1);
  --white: #0d0f12;
}
body.lv-dark .sp-wrap, body.lv-dark .page-container { font-family: var(--font-sans) !important; }
body.lv-dark h1, body.lv-dark h2, body.lv-dark h3, body.lv-dark h4 { font-family: var(--font-sans) !important; }

/* Études de cas : blocs dont le fond utilisait --slate-900 (devenu une couleur de texte) */
body.lv-dark #results,
body.lv-dark .insight-box,
body.lv-dark .script-box { background: #0d0f12 !important; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
body.lv-dark .insight-box, body.lv-dark .script-box { border: 1px solid rgba(124,242,196,.25); }

/* ===== Tailwind : violets, roses et fonds clairs des autres pages ===== */
body.lv-dark .bg-primary,
body.lv-dark [class*="bg-fuchsia-5"], body.lv-dark [class*="bg-fuchsia-6"],
body.lv-dark [class*="bg-indigo-5"], body.lv-dark [class*="bg-indigo-6"],
body.lv-dark [class*="bg-violet-5"], body.lv-dark [class*="bg-violet-6"] {
  background: var(--accent) !important; color: var(--accent-ink) !important;
}
body.lv-dark .bg-primary *:not(svg):not(path) { color: inherit; }
body.lv-dark .bg-primary .text-white, body.lv-dark .bg-primary .text-white\/70,
body.lv-dark .bg-primary .text-white\/80, body.lv-dark .bg-primary .text-white\/90 { color: var(--accent-ink) !important; }
/* Cartes de prix mises en avant : surface + liseré plutôt qu'un aplat */
body.lv-dark section .rounded-3xl.bg-primary, body.lv-dark section .rounded-2xl.bg-primary {
  background: radial-gradient(120% 90% at 0% 0%, rgba(124,242,196,.16), transparent 55%), var(--surface) !important;
  border: 1px solid rgba(124,242,196,.35); color: var(--fg) !important;
}
body.lv-dark section .rounded-3xl.bg-primary .text-white, body.lv-dark section .rounded-3xl.bg-primary [class*="text-white/"],
body.lv-dark section .rounded-2xl.bg-primary .text-white, body.lv-dark section .rounded-2xl.bg-primary [class*="text-white/"] { color: var(--fg-2) !important; }
body.lv-dark section .rounded-3xl.bg-primary a.bg-white, body.lv-dark section .rounded-2xl.bg-primary a.bg-white { background: var(--accent) !important; color: var(--accent-ink) !important; }
body.lv-dark [class*="text-fuchsia-"], body.lv-dark [class*="text-indigo-"], body.lv-dark [class*="text-violet-"],
body.lv-dark .text-primary-light, body.lv-dark .hover\:text-primary-dark:hover { color: var(--accent) !important; }
body.lv-dark [class*="border-fuchsia-"], body.lv-dark [class*="border-indigo-"], body.lv-dark .border-primary { border-color: rgba(124,242,196,.35) !important; }
body.lv-dark [class~="bg-fuchsia-50"], body.lv-dark [class~="bg-fuchsia-100"], body.lv-dark [class*="bg-fuchsia-500\/"],
body.lv-dark [class~="bg-indigo-50"], body.lv-dark [class~="bg-indigo-100"] { background: rgba(124,242,196,.08) !important; color: var(--fg-2) !important; }
body.lv-dark .bg-gray-50, body.lv-dark .bg-gray-100, body.lv-dark .bg-slate-50, body.lv-dark .bg-slate-100 { background: var(--surface-2) !important; }
body.lv-dark .text-gray-900, body.lv-dark .text-slate-900 { color: var(--fg) !important; }
body.lv-dark .text-gray-700, body.lv-dark .text-slate-700, body.lv-dark .text-gray-800, body.lv-dark .text-slate-800 { color: var(--fg-2) !important; }
body.lv-dark .text-gray-500, body.lv-dark .text-gray-600, body.lv-dark .text-slate-500, body.lv-dark .text-slate-600 { color: var(--muted) !important; }
body.lv-dark [class*="to-fuchsia-"], body.lv-dark [class*="to-violet"], body.lv-dark [class*="from-primary"] { --tw-gradient-to: transparent !important; --tw-gradient-from: rgba(124,242,196,.08) !important; }
body.lv-dark .bg-clip-text { -webkit-text-fill-color: var(--accent); background: none !important; }
/* Bouton violet de l'en-tête des pages d'offre */
body.lv-dark header .bg-primary, body.lv-dark header a.bg-primary { background: var(--accent) !important; color: var(--accent-ink) !important; }
body.lv-dark header.sticky { background: rgba(13,15,18,.8) !important; border-color: var(--line) !important; backdrop-filter: blur(14px); }

/* Boutons en dégradé indigo/violet */
body.lv-dark a[class*="from-indigo-"], body.lv-dark button[class*="from-indigo-"],
body.lv-dark a[class*="from-fuchsia-"], body.lv-dark a[class*="from-purple-"] {
  background-image: none !important; background-color: var(--accent) !important; color: var(--accent-ink) !important; border-radius: 3px !important;
}
body.lv-dark a[class*="from-indigo-"] *, body.lv-dark a[class*="from-fuchsia-"] * { color: var(--accent-ink) !important; }
body.lv-dark a[class*="bg-fuchsia-5"] *, body.lv-dark a.bg-primary * { color: var(--accent-ink) !important; }
