/* ============================================================
   Lagriffe Studio — polish.css
   DESIGN SYSTEM SOMBRE PREMIUM
   Encre profonde + accents indigo/violet/rose
   Inclure APRÈS style.css.
   ============================================================ */

/* ─── Design tokens ─── */
:root {
  /* Fond global : encre profonde nuit */
  --c-bg:         #0A0B1E;
  --c-bg-alt:     #0F1226;
  --c-bg-section: #0D0F22;
  --c-surface:    #14172E;
  --c-surface-2:  #1A1D3A;
  --c-surface-3:  #20254A;
  --c-border:     rgba(99, 102, 241, 0.15);
  --c-border-2:   rgba(248, 250, 252, 0.08);
  --c-border-3:   rgba(248, 250, 252, 0.12);

  /* Textes : du blanc au gris bleuté */
  --c-text:       #F8FAFC;
  --c-text-soft:  #CBD5E1;
  --c-text-mute:  #94A3B8;
  --c-text-dim:   #64748B;

  /* Accents : palette indigo / violet / rose / orange */
  --c-indigo:     #818CF8;
  --c-indigo-d:   #6366F1;
  --c-indigo-dd:  #4F46E5;
  --c-indigo-ll:  rgba(99, 102, 241, 0.12);
  --c-violet:     #A78BFA;
  --c-violet-d:   #8B5CF6;
  --c-pink:       #F472B6;
  --c-orange:     #FB923C;
  --c-emerald:    #34D399;
  --c-gold:       #FCD34D;

  --grad-brand: linear-gradient(135deg, #6366F1 0%, #8B5CF6 50%, #EC4899 100%);
  --grad-brand-2: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
  --grad-text:  linear-gradient(90deg, #818CF8 0%, #A78BFA 50%, #F472B6 100%);
  --grad-surface: linear-gradient(180deg, rgba(99,102,241,.04), rgba(99,102,241,0));
  --grad-section: linear-gradient(180deg, var(--c-bg) 0%, var(--c-bg-alt) 100%);

  /* Spacing scale */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;

  /* Radius */
  --rd-sm: 6px; --rd-md: 10px; --rd-lg: 14px; --rd-xl: 20px;
  --rd-2xl: 28px; --rd-full: 999px;

  /* Shadows (sur fond sombre : ombres rares + glow subtil) */
  --sh-soft: 0 4px 24px rgba(0,0,0,.4);
  --sh-card: 0 8px 32px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.04) inset;
  --sh-card-hover: 0 16px 48px rgba(0,0,0,.6), 0 0 0 1px rgba(99,102,241,.3), 0 1px 0 rgba(255,255,255,.06) inset;
  --sh-brand: 0 12px 40px rgba(99,102,241,.45), 0 4px 12px rgba(139,92,246,.30);
  --sh-glow-indigo: 0 0 40px rgba(99,102,241,.25);

  /* Transitions */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --t-fast: 150ms;
  --t-mid: 300ms;
  --t-slow: 500ms;
}

/* ─── Force kill legacy decor (zombie/medieval/usa/etc.) — TRÈS spécifique ─── */
html body [class^="med-"], html body [class*=" med-"],
html body [class^="medieval"], html body [class*=" medieval"],
html body [class^="future-bg"], html body [class*=" future-bg"],
html body [class^="future-"], html body [class*=" future-"],
html body [class^="retro-bg"], html body [class*=" retro-bg"],
html body [class^="retro-"], html body [class*=" retro-"],
html body [class^="zombie"], html body [class*=" zombie"],
html body [class^="usa-"], html body [class*=" usa-"],
html body .dragonfly, html body .butterfly, html body .firefly,
html body .moth, html body .moon-rift, html body .bee,
html body .insect, html body .ornament, html body .sparkle,
html body [class*="dragon"], html body [class*="butterfly"],
html body [class*="firefly"], html body [class*="moth"],
html body [class*="bee"], html body [class*="ornament"],
html body .hero__cards, html body .hero__theme-row,
html body .hero__orb, html body [class^="hpc"], html body [class*=" hpc"],
html body #heroThemeRow,
html body .future-toggle, html body .retro-toggle,
html body .zombie-toggle, html body .medieval-toggle, html body .usa-toggle,
html body [class^="med-"] *, html body [class^="medieval"] *,
html body [class^="future-"] *, html body [class^="retro-"] *,
html body [class^="zombie"] *, html body [class^="usa-"] * {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -99999px !important;
  top: -99999px !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(100%) !important;
}

/* ─── Base : tout en mode dark ─── */
html { scroll-behavior: smooth; }
html, body {
  background: var(--c-bg) !important;
  color: var(--c-text) !important;
}
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-feature-settings: "ss01", "cv11";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
}
::selection { background: var(--c-indigo-dd); color: #FFFFFF; }
img, svg { display: block; max-width: 100%; }

/* ─── Typo polish : titres en blanc, em en gradient ─── */
h1, h2, h3, h4, h5, h6,
.hero__h1, .sim-title__big,
.section__title, .plan-card__name,
.eco-card__title, .step-card h3, .faq__q,
.cmd-hero h1, .cmd-step-head h2,
.guarantee__card h3, .reward-card__title,
.gallery-card__sector, .sector-card h3 {
  font-family: 'Syne', 'Inter', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.08 !important;
  color: var(--c-text) !important;
  text-wrap: balance;
}
h3, .step-card h3, .eco-card__title, .plan-card__name,
.guarantee__card h3, .faq__q, .sector-card h3 {
  font-weight: 700 !important;
  font-size: 1.15rem !important;
  letter-spacing: -0.015em !important;
  line-height: 1.3 !important;
}

/* Em italic : gradient indigo→violet→rose, lisible sur fond sombre */
.section__title em, .hero__h1 em, .cmd-hero h1 em,
.sim-title__big em, .hero__gradient {
  font-style: italic !important;
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  font-family: 'Fraunces', 'Playfair Display', Georgia, serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
}

/* Em à l'intérieur de boutons / strong / liens : pas de gradient (sinon illisible) */
.btn em, button em, a em, strong em,
.nav__cta em, .hero__cta-perso em,
.eco-card em, .plan-card em {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  color: inherit !important;
  font-style: italic;
}

/* ─── Eyebrow / section labels ─── */
.section__label, .eyebrow, .nav__link {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-size: 0.72rem !important;
}
.section__label {
  display: inline-block;
  padding: 6px 14px;
  background: var(--c-indigo-ll);
  color: var(--c-indigo) !important;
  border: 1px solid rgba(99,102,241,.25);
  border-radius: var(--rd-full);
  margin-bottom: var(--sp-4);
}

/* ─── Paragraphes ─── */
p, .lead, .section__sub, .hero__sub,
.step-card p, .eco-card__lead, .faq__a, .faq__a p,
.reward-card__desc, .guarantee__card p {
  color: var(--c-text-soft) !important;
  line-height: 1.7 !important;
}
.section__sub, .hero__sub, .lead {
  font-size: clamp(1rem, 1.4vw, 1.15rem) !important;
  max-width: 640px;
  margin-inline: auto;
  text-wrap: balance;
}
strong { color: var(--c-text) !important; font-weight: 700; }
em { color: var(--c-text); }

/* ─── Sections : padding généreux + fond unifié ─── */
section, .section {
  background: transparent !important;
  padding-block: clamp(72px, 10vw, 128px) !important;
  position: relative;
}
.section__header {
  margin-bottom: clamp(48px, 6vw, 72px) !important;
  text-align: center;
}
.section__header h2, .section__title {
  margin-bottom: var(--sp-4) !important;
  font-size: clamp(2rem, 4.8vw, 3.2rem) !important;
}

/* Sections alternées : une sur deux a un fond légèrement différent */
section:nth-of-type(2n),
.section:nth-of-type(2n),
[data-theme="light"] section:nth-of-type(2n) {
  background: var(--c-bg-alt) !important;
}

/* ─── Container ─── */
.container, [data-theme="light"] .container {
  max-width: 1200px !important;
  padding-inline: clamp(20px, 4vw, 32px) !important;
}

/* ─── Nav header ─── */
.nav, [data-theme="light"] .nav {
  background: rgba(10, 11, 30, 0.7) !important;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--c-border-2) !important;
}
.nav__inner { padding-block: var(--sp-4) !important; }
.nav__logo, .nav__logo .logo-word,
[data-theme="light"] .nav__logo, [data-theme="light"] .nav__logo .logo-word {
  color: var(--c-text) !important;
  font-family: 'Syne', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}
.nav__logo .logo-dot, [data-theme="light"] .nav__logo .logo-dot {
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}
.nav__link, [data-theme="light"] .nav__link {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-size: 0.92rem !important;
  color: var(--c-text-soft) !important;
  position: relative;
}
.nav__link::after, [data-theme="light"] .nav__link::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--grad-brand);
  border-radius: var(--rd-full);
  transition: all var(--t-fast) var(--ease-out);
  transform: translateX(-50%);
}
.nav__link:hover, [data-theme="light"] .nav__link:hover { color: var(--c-text) !important; }
.nav__link:hover::after, [data-theme="light"] .nav__link:hover::after { width: 100%; }

/* ─── Buttons ─── */
.btn, button[type="submit"], #submit-btn {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
  border-radius: var(--rd-lg) !important;
  transition: transform var(--t-fast) var(--ease-out),
              box-shadow var(--t-fast) var(--ease-out),
              background var(--t-fast) !important;
  border: none;
  cursor: pointer;
}
.btn--primary, .nav__cta, a.btn--primary,
[data-theme="light"] .btn--primary, [data-theme="light"] .nav__cta, [data-theme="light"] a.btn--primary {
  background: var(--grad-brand-2) !important;
  color: #FFFFFF !important;
  border: none !important;
  padding: 14px 28px !important;
  box-shadow: var(--sh-brand);
}
.btn--primary:hover, .nav__cta:hover, a.btn--primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 50px rgba(99,102,241,.55), 0 6px 16px rgba(139,92,246,.4) !important;
}
.btn--primary *, a.btn--primary * { color: #FFFFFF !important; }
.btn--lg { padding: 16px 36px !important; font-size: 1.05rem !important; }
.btn--ghost, [data-theme="light"] .btn--ghost {
  background: rgba(99,102,241,.08) !important;
  border: 1.5px solid rgba(99,102,241,.3) !important;
  color: var(--c-text) !important;
  padding: 14px 28px !important;
  backdrop-filter: blur(8px);
}
.btn--ghost:hover, [data-theme="light"] .btn--ghost:hover {
  border-color: var(--c-indigo) !important;
  background: rgba(99,102,241,.18) !important;
  color: #FFFFFF !important;
}
.btn--outline, [data-theme="light"] .btn--outline {
  background: transparent !important;
  border: 1.5px solid var(--c-border-3) !important;
  color: var(--c-text) !important;
}
.btn--outline:hover {
  border-color: var(--c-indigo) !important;
  background: var(--c-indigo-ll) !important;
}
.btn--full { width: 100% !important; }

/* ─── Hero ─── */
.hero, [data-theme="light"] .hero {
  background: var(--c-bg) !important;
  padding-block: clamp(96px, 12vw, 160px) clamp(64px, 8vw, 112px) !important;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.hero__layout {
  display: block !important;
  max-width: 880px;
  margin-inline: auto !important;
  text-align: center;
}
.hero__copy {
  max-width: 720px;
  margin-inline: auto !important;
  text-align: center;
}
.hero__copy .hero__badge,
.hero__copy .hero__actions,
.hero__copy .hero__trust {
  justify-content: center !important;
  display: inline-flex;
}
.hero__copy .hero__actions {
  display: flex !important;
  justify-content: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-block: var(--sp-8);
}
.hero__copy .hero__trust,
.hero .hero__trust,
ul.hero__trust {
  display: flex !important;
  flex-wrap: wrap;
  gap: var(--sp-6);
  margin: var(--sp-6) auto 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
  justify-content: center !important;
  align-items: center;
}
.hero__trust li {
  display: inline-flex !important;
  align-items: center;
  gap: var(--sp-2);
  margin: 0 !important;
  padding: 0 !important;
}
.hero__copy .hero__sub {
  margin-inline: auto !important;
  text-align: center;
}
.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 25%, rgba(99,102,241,.22), transparent 50%),
    radial-gradient(circle at 85% 75%, rgba(236,72,153,.18), transparent 55%),
    radial-gradient(circle at 50% 90%, rgba(139,92,246,.15), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.hero > * { position: relative; z-index: 1; }
.hero__bg-grid {
  background-image:
    linear-gradient(rgba(248,250,252,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(248,250,252,.04) 1px, transparent 1px) !important;
  background-size: 64px 64px !important;
  mask-image: radial-gradient(ellipse 70% 50% at 50% 30%, #000 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 70% 50% at 50% 30%, #000 30%, transparent 80%);
}
.hero__orb { display: none !important; }

.hero__h1, .hero__h1 span,
[data-theme="light"] .hero__h1, [data-theme="light"] .hero__h1 span {
  color: var(--c-text) !important;
  font-size: clamp(2.6rem, 7vw, 5.2rem) !important;
  line-height: 1.02 !important;
  margin-bottom: var(--sp-6) !important;
}
.hero__h1 .hero__gradient,
[data-theme="light"] .hero__h1 .hero__gradient {
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  font-family: 'Fraunces', serif !important;
  font-style: italic;
  font-weight: 700 !important;
}
.hero__sub, [data-theme="light"] .hero__sub {
  font-size: clamp(1.08rem, 1.6vw, 1.3rem) !important;
  line-height: 1.65 !important;
  color: var(--c-text-soft) !important;
  max-width: 600px;
}
.hero__sub strong { color: #FFFFFF !important; }
.hero__sub em {
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  font-style: italic;
  font-weight: 600;
}
.hero__badge, [data-theme="light"] .hero__badge {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid var(--c-border-3) !important;
  color: var(--c-text-soft) !important;
  box-shadow: none !important;
  padding: 8px 18px !important;
  border-radius: var(--rd-full);
  backdrop-filter: blur(12px);
  font-size: 0.88rem;
}
.hero__badge-dot {
  background: var(--c-emerald) !important;
  box-shadow: 0 0 12px rgba(52,211,153,.6), 0 0 0 4px rgba(52,211,153,.18);
}
.hero__trust li {
  color: var(--c-text-soft) !important;
  font-size: 0.92rem;
}
.hero__trust li svg { color: var(--c-emerald) !important; }
.hero__scroll svg { color: var(--c-text-mute); }

/* ─── Marquee ─── */
.marquee-strip, [data-theme="light"] .marquee-strip {
  background: linear-gradient(90deg, var(--c-bg-alt), var(--c-surface), var(--c-bg-alt)) !important;
  color: var(--c-text) !important;
  padding-block: 16px !important;
  border-block: 1px solid var(--c-border) !important;
  font-family: 'Syne', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  font-size: 0.92rem;
}
.marquee__inner .mx {
  color: var(--c-indigo) !important;
  opacity: 0.5;
}

/* ─── Method steps (4 cartes) ─── */
.steps__grid { gap: var(--sp-5) !important; }
.step-card, [data-theme="light"] .step-card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--rd-xl) !important;
  padding: var(--sp-8) var(--sp-6) !important;
  box-shadow: var(--sh-card);
  transition: transform var(--t-mid) var(--ease-out),
              box-shadow var(--t-mid) var(--ease-out),
              border-color var(--t-mid) !important;
  position: relative;
  overflow: hidden;
}
.step-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--grad-surface);
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--t-mid);
}
.step-card:hover, [data-theme="light"] .step-card:hover {
  transform: translateY(-6px);
  border-color: rgba(99,102,241,.4) !important;
  box-shadow: var(--sh-card-hover);
}
.step-card:hover::before { opacity: 1; }
.step-card__num, [data-theme="light"] .step-card__num {
  font-family: 'Syne', sans-serif !important;
  font-weight: 800 !important;
  font-size: 3.6rem !important;
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  opacity: 0.35 !important;
  line-height: 1 !important;
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-5);
}
.step-card__icon, [data-theme="light"] .step-card__icon {
  display: inline-flex;
  width: 52px; height: 52px;
  align-items: center;
  justify-content: center;
  background: var(--grad-brand-2);
  border-radius: var(--rd-lg);
  margin-bottom: var(--sp-4);
  color: #FFFFFF;
  box-shadow: var(--sh-glow-indigo);
  position: relative;
  z-index: 1;
}
.step-card__icon svg { width: 24px; height: 24px; color: #FFFFFF; }
.step-card h3, [data-theme="light"] .step-card h3 {
  font-size: 1.2rem !important;
  margin-bottom: var(--sp-3) !important;
  color: var(--c-text) !important;
  position: relative;
  z-index: 1;
}
.step-card p, [data-theme="light"] .step-card p {
  font-size: 0.95rem !important;
  line-height: 1.7 !important;
  color: var(--c-text-soft) !important;
  position: relative;
  z-index: 1;
}
.step-card p strong { color: #FFFFFF !important; }
.step-card__arrow, [data-theme="light"] .step-card__arrow {
  color: var(--c-text-mute) !important;
  font-size: 1.6rem;
  align-self: center;
  opacity: 0.5;
}

/* ─── Pricing : plan unique ─── */
.pricing__plans--single {
  display: flex !important;
  justify-content: center !important;
  grid-template-columns: none !important;
}
.plan-card--single { max-width: 600px; width: 100%; }
.plan-card, .plan-card--single, .plan-card--featured,
[data-theme="light"] .plan-card--single, [data-theme="light"] .plan-card--featured {
  background: linear-gradient(180deg, var(--c-surface-2), var(--c-surface)) !important;
  border: 1px solid rgba(99,102,241,.4) !important;
  border-radius: var(--rd-2xl) !important;
  box-shadow: var(--sh-card), 0 0 60px rgba(99,102,241,.15);
  padding: var(--sp-12) var(--sp-10) !important;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.plan-card--single::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -30%;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, rgba(139,92,246,.20), transparent 60%);
  pointer-events: none;
}
.plan-card__badge, [data-theme="light"] .plan-card__badge {
  display: inline-flex !important;
  align-items: center;
  background: var(--grad-brand-2) !important;
  color: #FFFFFF !important;
  padding: 8px 20px !important;
  border-radius: var(--rd-full) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase;
  box-shadow: var(--sh-brand);
  /* Reset des éventuels position:absolute hérités du style.css principal */
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  margin: 0 auto var(--sp-6) !important;
  width: max-content;
  max-width: 100%;
}
.plan-card__name, [data-theme="light"] .plan-card__name {
  font-family: 'Syne', sans-serif !important;
  font-size: 1.7rem !important;
  font-weight: 800 !important;
  color: var(--c-text) !important;
}
.plan-card__desc { color: var(--c-text-soft) !important; }
.plan-card__price {
  display: inline-flex !important;
  align-items: flex-start;
  justify-content: center;
  gap: var(--sp-2);
  margin-inline: auto !important;
}
.plan-card__amount, [data-theme="light"] .plan-card__amount {
  font-family: 'Syne', sans-serif !important;
  font-size: 5.5rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  line-height: 1 !important;
}
.plan-card__right {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 12px;
}
.plan-card__currency, .plan-card__period,
[data-theme="light"] .plan-card__currency, [data-theme="light"] .plan-card__period {
  color: var(--c-text-soft) !important;
}
.plan-card__launch, [data-theme="light"] .plan-card__launch {
  color: var(--c-text-mute) !important;
  font-size: 0.88rem;
}
.plan-card__features li, [data-theme="light"] .plan-card__features li {
  padding: var(--sp-2) 0 !important;
  font-size: 0.97rem !important;
  color: var(--c-text-soft) !important;
}
.plan-card__features strong, [data-theme="light"] .plan-card__features strong {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
.plan-card__features svg.ci, [data-theme="light"] .plan-card__features svg.ci {
  color: var(--c-emerald) !important;
}
.plan-card__mention { color: var(--c-text-mute) !important; }

/* ─── Options grid (12 fonctionnalités) ─── */
.options-block { margin-top: var(--sp-16) !important; }
.options-block__header { text-align: center; margin-bottom: var(--sp-10); }
.options-block__header h3, [data-theme="light"] .options-block__header h3 {
  font-family: 'Syne', sans-serif !important;
  font-size: 1.6rem !important;
  margin-bottom: var(--sp-3) !important;
  color: var(--c-text) !important;
}
.options-block__header .options-price,
[data-theme="light"] .options-block__header .options-price {
  background: var(--grad-text) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}
.options-block__header p {
  color: var(--c-text-soft) !important;
}
.options-grid, [data-theme="light"] .options-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: var(--sp-3) !important;
  max-width: 1100px;
  margin-inline: auto;
}
.options-grid li, [data-theme="light"] .options-grid li {
  position: relative;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: var(--sp-3) !important;
  padding: var(--sp-5) var(--sp-5) !important;
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-lg) !important;
  color: var(--c-text-soft) !important;
  font-size: 0.93rem !important;
  min-height: 64px;
  transition: transform var(--t-fast) var(--ease-out),
              border-color var(--t-fast),
              background var(--t-fast) !important;
}
.options-grid li:hover {
  transform: translateY(-3px);
  background: var(--c-surface-2) !important;
  border-color: rgba(99,102,241,.4) !important;
}
.options-grid li > span[aria-hidden="true"]:first-child {
  position: static !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  font-size: 1.5rem;
  line-height: 1;
  background: rgba(99,102,241,.1);
  border-radius: var(--rd-md);
}
.options-grid li > span:not([aria-hidden="true"]) {
  font-weight: 700 !important;
  color: var(--c-text) !important;
  line-height: 1.35 !important;
}
.options-promo { color: var(--c-text-soft) !important; }
.options-promo strong { color: var(--c-text) !important; }

/* ─── FAQ ─── */
.faq__list, [data-theme="light"] .faq__list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.faq__item, [data-theme="light"] .faq__item {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-lg) !important;
  overflow: hidden;
  transition: all var(--t-fast);
}
.faq__item:hover { border-color: rgba(99,102,241,.3) !important; }
.faq__item[open], [data-theme="light"] .faq__item[open] {
  border-color: rgba(99,102,241,.5) !important;
  background: var(--c-surface-2) !important;
  box-shadow: var(--sh-glow-indigo);
}
.faq__q, [data-theme="light"] .faq__q {
  padding: var(--sp-5) var(--sp-6) !important;
  font-weight: 700 !important;
  color: var(--c-text) !important;
  font-size: 1rem !important;
  cursor: pointer;
  font-family: 'Inter', sans-serif !important;
}
.faq__chev, [data-theme="light"] .faq__chev {
  color: var(--c-indigo) !important;
  transition: transform var(--t-mid) var(--ease-out);
}
.faq__item[open] .faq__chev { transform: rotate(180deg); }
.faq__a, .faq__a p, [data-theme="light"] .faq__a, [data-theme="light"] .faq__a p {
  padding: 0 var(--sp-6) var(--sp-5) !important;
  color: var(--c-text-soft) !important;
  line-height: 1.75 !important;
}
.faq__a strong, .faq__a p strong { color: #FFFFFF !important; }
.faq__a a { color: var(--c-indigo) !important; text-decoration: underline; }

/* ─── Cfg section (Commander) ─── */
.cfg-section, [data-theme="light"] .cfg-section {
  background: linear-gradient(135deg, var(--c-bg) 0%, var(--c-surface) 60%, var(--c-bg-alt) 100%) !important;
  position: relative;
  overflow: hidden;
}
.cfg-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 25% 30%, rgba(99,102,241,.20), transparent 50%),
    radial-gradient(circle at 75% 70%, rgba(236,72,153,.15), transparent 50%);
  pointer-events: none;
}
.cfg-section > .container { position: relative; z-index: 1; }

/* ─── Sectors / Gallery cards ─── */
.gallery-card, [data-theme="light"] .gallery-card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-xl) !important;
  overflow: hidden;
  box-shadow: var(--sh-card);
  transition: all var(--t-mid) var(--ease-out) !important;
}
.gallery-card:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: var(--sh-card-hover);
  border-color: rgba(99,102,241,.4) !important;
}
.gallery-card__sector { color: var(--c-text) !important; }
.gallery-card__metier { color: var(--c-text-soft) !important; }

.sector-card, [data-theme="light"] .sector-card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-lg) !important;
  padding: var(--sp-6) var(--sp-5) !important;
  transition: all var(--t-mid) var(--ease-out);
  text-align: center;
  color: var(--c-text-soft);
}
.sector-card:hover {
  transform: translateY(-4px);
  border-color: rgba(99,102,241,.4) !important;
  background: var(--c-surface-2) !important;
}
.sector-card h3 { color: var(--c-text) !important; }

/* ─── Eco cards ─── */
.eco-card, [data-theme="light"] .eco-card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-xl) !important;
  padding: var(--sp-8) !important;
  box-shadow: var(--sh-card);
  transition: all var(--t-mid) var(--ease-out) !important;
}
.eco-card:hover {
  transform: translateY(-6px);
  border-color: rgba(99,102,241,.3) !important;
  box-shadow: var(--sh-card-hover);
}
.eco-card__title { font-family: 'Syne', sans-serif !important; font-size: 1.35rem !important; color: var(--c-text) !important; }
.eco-card__lead, .eco-card__features li, .eco-card__hint {
  color: var(--c-text-soft) !important;
  line-height: 1.7 !important;
}
.eco-card__brand, .eco-card__badge, .eco-card__price {
  color: var(--c-text) !important;
}
.eco-card__badge {
  background: var(--c-indigo-ll) !important;
  color: var(--c-indigo) !important;
  border: 1px solid rgba(99,102,241,.25);
}

/* ─── Guarantee ─── */
.guarantee__card, [data-theme="light"] .guarantee__card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  border-radius: var(--rd-xl) !important;
  padding: var(--sp-8) var(--sp-6) !important;
  box-shadow: var(--sh-card);
  transition: all var(--t-mid);
}
.guarantee__card:hover {
  transform: translateY(-4px);
  border-color: rgba(99,102,241,.3) !important;
}
.guarantee__card h3 { color: var(--c-text) !important; }
.guarantee__card p { color: var(--c-text-soft) !important; }
.guarantee__card p strong { color: #FFFFFF !important; }

/* ─── Partners ─── */
.partners__logo {
  color: var(--c-text-mute) !important;
  opacity: .7;
  transition: opacity var(--t-fast), color var(--t-fast);
}
.partners__logo:hover { opacity: 1; color: var(--c-text) !important; }

/* ─── Market ─── */
.market-table {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
}
.market-row { border-bottom-color: var(--c-border-2) !important; }
.market-cell { color: var(--c-text-soft) !important; }
.market-cell strong { color: var(--c-text) !important; }

/* ─── Footer ─── */
.footer, [data-theme="light"] .footer {
  background: #050616 !important;
  color: var(--c-text-mute) !important;
  padding-block: var(--sp-16) var(--sp-8) !important;
  border-top: 1px solid var(--c-border-2);
}
.footer h4, [data-theme="light"] .footer h4 {
  color: #FFFFFF !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  margin-bottom: var(--sp-4) !important;
}
.footer a, .footer p, [data-theme="light"] .footer a, [data-theme="light"] .footer p {
  color: var(--c-text-mute) !important;
  font-size: 0.92rem;
  line-height: 1.8;
}
.footer a:hover, [data-theme="light"] .footer a:hover {
  color: var(--c-indigo) !important;
}
.footer__bottom {
  border-top: 1px solid var(--c-border-2);
  margin-top: var(--sp-10);
  padding-top: var(--sp-6);
  color: var(--c-text-dim) !important;
  font-size: 0.85rem;
}

/* ─── Social rail (icônes flottantes Facebook/Insta/X) ─── */
.social-rail__link, [data-theme="light"] .social-rail__link {
  background: var(--c-surface) !important;
  color: var(--c-text-soft) !important;
  border: 1px solid var(--c-border-2) !important;
  box-shadow: var(--sh-soft);
  transition: all var(--t-fast) var(--ease-out);
}
.social-rail__link:hover, [data-theme="light"] .social-rail__link:hover {
  background: var(--grad-brand-2) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
  transform: translateX(4px);
}

/* ─── Reveal animations ─── */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--t-slow) var(--ease-out),
              transform var(--t-slow) var(--ease-out);
}
.reveal.is-visible, .reveal[data-revealed="true"] {
  opacity: 1;
  transform: none;
}
html.no-js .reveal, .reveal:not([data-revealed]) {
  opacity: 1;
  transform: none;
}

/* ─── Reward / Perk cards (si présentes) ─── */
.reward-card {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border-2) !important;
  color: var(--c-text-soft) !important;
}
.reward-card__title { color: var(--c-text) !important; }

/* ─── Theme toggle (ampoule) : visible pour basculer clair / sombre ─── */
#themeToggle, .theme-toggle {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 52px;
  height: 52px;
  border-radius: var(--rd-full);
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border) !important;
  color: var(--c-text) !important;
  cursor: pointer;
  z-index: 50;
  box-shadow: var(--sh-card);
  transition: all var(--t-fast) var(--ease-out);
}
#themeToggle:hover, .theme-toggle:hover {
  transform: translateY(-2px);
  border-color: var(--c-indigo) !important;
  box-shadow: var(--sh-card-hover);
}
.lang-sw, #langSwitcher { display: none !important; }

/* ─── Contact section ─── */
.contact, .contact__box {
  background: var(--c-surface) !important;
  color: var(--c-text) !important;
  border-radius: var(--rd-2xl);
}
.contact a { color: var(--c-indigo) !important; }

/* ─── Hero CTAs override (s'assurer que les boutons sont visibles) ─── */
.hero__actions .btn--primary,
.hero__actions a.btn--primary {
  background: var(--grad-brand-2) !important;
  color: #FFFFFF !important;
}
.hero__actions .btn--ghost {
  background: rgba(99,102,241,.08) !important;
  border: 1.5px solid rgba(99,102,241,.35) !important;
  color: var(--c-text) !important;
}
.hero__actions a.btn--primary em,
.hero__actions a.btn--primary i,
a.btn--primary em, a.btn--primary i,
.btn em, .btn i, .nav__cta em, .nav__cta i {
  color: #FFFFFF !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-style: italic;
  opacity: 0.9;
  font-family: 'Fraunces', 'Playfair Display', Georgia, serif !important;
  font-weight: 500;
}

/* ─── Mobile responsive ─── */
@media (max-width: 880px) {
  .step-card__arrow { display: none; }
  .steps__grid { grid-template-columns: 1fr !important; }
}

/* ============================================================
   MODE CLAIR — override quand <html data-theme="light">
   Inverse les surfaces : fond clair, surfaces blanches, texte sombre.
   ============================================================ */
html[data-theme="light"] {
  --c-bg:         #FBF8F2;
  --c-bg-alt:     #F5F1E8;
  --c-bg-section: #FBF8F2;
  --c-surface:    #FFFFFF;
  --c-surface-2:  #FAFAFA;
  --c-surface-3:  #F1F5F9;
  --c-border:     rgba(15, 23, 42, 0.1);
  --c-border-2:   rgba(15, 23, 42, 0.08);
  --c-border-3:   rgba(15, 23, 42, 0.12);
  --c-text:       #0F172A;
  --c-text-soft:  #334155;
  --c-text-mute:  #64748B;
  --c-text-dim:   #94A3B8;
  --c-indigo-ll:  rgba(99, 102, 241, 0.08);
  --grad-surface: linear-gradient(180deg, rgba(99,102,241,.02), rgba(99,102,241,0));
  --sh-soft:      0 4px 16px rgba(15,23,42,.06);
  --sh-card:      0 4px 20px rgba(15,23,42,.06), 0 1px 0 rgba(255,255,255,.6) inset;
  --sh-card-hover:0 12px 36px rgba(15,23,42,.10), 0 0 0 1px rgba(99,102,241,.2) inset;
  --sh-glow-indigo: 0 0 30px rgba(99,102,241,.15);
}
html[data-theme="light"] body {
  background: var(--c-bg) !important;
  color: var(--c-text) !important;
}
html[data-theme="light"] .hero {
  background: var(--c-bg) !important;
}
html[data-theme="light"] .hero__h1 {
  color: var(--c-text) !important;
}
html[data-theme="light"] .hero__sub {
  color: var(--c-text-soft) !important;
}
html[data-theme="light"] .hero__sub strong { color: var(--c-text) !important; }
html[data-theme="light"] .hero__badge {
  background: #FFFFFF !important;
  border-color: var(--c-border) !important;
  color: var(--c-text-soft) !important;
  box-shadow: var(--sh-soft) !important;
}
html[data-theme="light"] .hero__trust li { color: var(--c-text-soft) !important; }
html[data-theme="light"] .hero__bg-grid {
  background-image:
    linear-gradient(rgba(15,23,42,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,.04) 1px, transparent 1px) !important;
}

html[data-theme="light"] section:nth-of-type(2n) {
  background: var(--c-bg-alt) !important;
}

html[data-theme="light"] .nav {
  background: rgba(251, 248, 242, 0.85) !important;
  border-bottom: 1px solid var(--c-border) !important;
}
html[data-theme="light"] .nav__logo, html[data-theme="light"] .nav__logo .logo-word { color: var(--c-text) !important; }
html[data-theme="light"] .nav__link { color: var(--c-text-soft) !important; }
html[data-theme="light"] .nav__link:hover { color: var(--c-text) !important; }

html[data-theme="light"] .step-card,
html[data-theme="light"] .plan-card,
html[data-theme="light"] .plan-card--single,
html[data-theme="light"] .plan-card--featured,
html[data-theme="light"] .options-grid li,
html[data-theme="light"] .faq__item,
html[data-theme="light"] .eco-card,
html[data-theme="light"] .guarantee__card,
html[data-theme="light"] .gallery-card,
html[data-theme="light"] .sector-card {
  background: var(--c-surface) !important;
  border-color: var(--c-border) !important;
  box-shadow: var(--sh-card);
}
html[data-theme="light"] .plan-card,
html[data-theme="light"] .plan-card--single,
html[data-theme="light"] .plan-card--featured {
  background: linear-gradient(180deg, #FFFFFF, #FAFAFA) !important;
  border: 2px solid rgba(99,102,241,.3) !important;
}
html[data-theme="light"] .step-card h3,
html[data-theme="light"] .options-grid li > span:not([aria-hidden="true"]),
html[data-theme="light"] .faq__q,
html[data-theme="light"] .plan-card__name,
html[data-theme="light"] .plan-card__features strong,
html[data-theme="light"] .step-card p strong,
html[data-theme="light"] .faq__a strong,
html[data-theme="light"] .hero__sub strong,
html[data-theme="light"] strong {
  color: var(--c-text) !important;
}
html[data-theme="light"] .step-card p,
html[data-theme="light"] .faq__a, html[data-theme="light"] .faq__a p,
html[data-theme="light"] .plan-card__features li,
html[data-theme="light"] .eco-card__lead,
html[data-theme="light"] .guarantee__card p,
html[data-theme="light"] .section__sub,
html[data-theme="light"] p, html[data-theme="light"] .lead {
  color: var(--c-text-soft) !important;
}
html[data-theme="light"] .marquee-strip {
  background: linear-gradient(90deg, #0F172A, #1E1B4B, #0F172A) !important;
  color: #F8FAFC !important;
}
html[data-theme="light"] .cfg-section {
  background: linear-gradient(135deg, #0F172A, #1E1B4B) !important;
}
html[data-theme="light"] .cfg-section .section__title,
html[data-theme="light"] .cfg-section h1, html[data-theme="light"] .cfg-section h2 {
  color: #FFFFFF !important;
}
html[data-theme="light"] .cfg-section .section__sub,
html[data-theme="light"] .cfg-section p { color: rgba(248,250,252,.85) !important; }
html[data-theme="light"] .footer { background: #0F172A !important; color: var(--c-text-dim) !important; }
html[data-theme="light"] .footer h4 { color: #FFFFFF !important; }
html[data-theme="light"] .footer a { color: var(--c-text-dim) !important; }
html[data-theme="light"] .footer a:hover { color: var(--c-indigo) !important; }
html[data-theme="light"] #themeToggle {
  background: #FFFFFF !important;
  color: var(--c-text) !important;
  border-color: var(--c-border) !important;
}
html[data-theme="light"] .social-rail__link {
  background: #FFFFFF !important;
  color: var(--c-text-soft) !important;
  border-color: var(--c-border) !important;
}
html[data-theme="light"] .options-grid li > span[aria-hidden="true"]:first-child {
  background: var(--c-indigo-ll) !important;
}