/* ═══════════════════════════════════════════════════════════════
   PALIERS RESPONSIVE DE RÉFÉRENCE (audit BUG-22)
   Syntaxe unique imposée : @media (max-width: XXXpx)
   Paliers officiels du site, du plus large au plus étroit :
     1180px · 1100px · 980px · 900px · 860px · 760px · 680px · 640px
   RÈGLE : ne pas introduire de nouveau palier sans nécessité ;
   réutiliser le palier existant le plus proche.
   860px = bascule du menu mobile (burger). Ne pas modifier sans
   vérifier .ds-nav-toggle / .ds-nav-links.is-open.
   ═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   AVERTISSEMENT MAINTENANCE (audit BUG-16)
   Certains sélecteurs [class*="..."] subsistent volontairement dans ce
   fichier comme filets de sécurité hérités des versions antérieures.
   RISQUE : toute NOUVELLE classe contenant l'un de ces fragments
   (ex. "card", "col", "kpi", "-tag", "-label", "-title", "zone",
   "section", "legal", "footer", "countdown", "modal-overlay",
   "modal-box", "band", "hero", "-number") héritera involontairement
   de ces styles.
   RÈGLE À SUIVRE : avant de créer une classe, vérifier qu'elle ne
   contient aucun de ces fragments, ou préfixer systématiquement
   avec "ds-" et un nom de composant explicite (ex. .ds-invest-card).
   ═══════════════════════════════════════════════════════════════ */
/* ============================================================
   DSTART — PRODUCTION STYLESHEET (consolidated)
   « L'Or du Pilotage » · Navy + Or · La Réunion 974
   Build: production unifiée — fusion Qwen design + serpentine V24B
   Ordre: tokens → composants partagés → pages → couche globale → serpentine
   ============================================================ */

/* ===== 1. DESIGN TOKENS ===== */
/* ============================================
   DSTART — PREMIUM DESIGN TOKENS
   "L'Or du Pilotage" — Variables globales
   ============================================ */

:root {
  /* Or signature — 5 nuances */
  --ds-gold-100: #FFF8E1;
  --ds-gold-200: #F8E7A7;
  --ds-gold-300: #E8CC7A;
  --ds-gold-400: #C9A84C;
  --ds-gold-500: #A88938;
  
  /* Nuit océan Indien — 5 profondeurs */
  --ds-night-50:  #1A2547;
  --ds-night-100: #0D1B3E;
  --ds-night-200: #0A0F1E;
  --ds-night-300: #050A18;
  --ds-night-400: #020408;
  
  /* Accents fonctionnels */
  --ds-cyan:      #00B4D8;
  --ds-cyan-glow: rgba(0, 180, 216, 0.25);
  --ds-green:     #4ADE80;
  --ds-orange:    #F97316;
  --ds-red:       #EF4444;
  
  /* Textes */
  --ds-text-100: rgba(255, 255, 255, 0.96);
  --ds-text-200: rgba(255, 255, 255, 0.72);
  --ds-text-300: rgba(255, 255, 255, 0.48);
  --ds-text-400: rgba(255,255,255,.52);
  --ds-text-500: rgba(255,255,255,.62);
  
  /* Bordures */
  --ds-border-100: rgba(201, 168, 76, 0.08);
  --ds-border-200: rgba(201, 168, 76, 0.18);
  --ds-border-300: rgba(201, 168, 76, 0.32);
  --ds-border-400: rgba(201, 168, 76, 0.52);
  
  /* Ombres */
  --ds-shadow-xs: 0 2px 8px rgba(0, 0, 0, 0.18);
  --ds-shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.28);
  --ds-shadow-md: 0 20px 60px rgba(0, 0, 0, 0.38);
  --ds-shadow-lg: 0 32px 100px rgba(0, 0, 0, 0.52);
  --ds-shadow-gold: 0 0 40px rgba(232, 204, 122, 0.18);
  
  /* Espacements — Système 8px */
  --ds-space-xs: 4px;
  --ds-space-sm: 8px;
  --ds-space-md: 16px;
  --ds-space-lg: 24px;
  --ds-space-xl: 32px;
  --ds-space-2xl: 48px;
  --ds-space-3xl: 64px;
  --ds-space-4xl: 96px;
  --ds-space-5xl: 128px;
  
  /* Rayons */
  --ds-radius-sm: 8px;
  --ds-radius-md: 14px;
  --ds-radius-lg: 20px;
  --ds-radius-xl: 28px;
  --ds-radius-pill: 999px;
  
  /* Animations */
  --ds-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ds-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ds-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ds-duration-fast: 180ms;
  --ds-duration-normal: 320ms;
  --ds-duration-slow: 600ms;
  --ds-duration-slower: 1200ms;
  
  /* Layout */
  --ds-page-x: clamp(20px, 4.4vw, 64px);
  --ds-section-y: clamp(72px, 8vw, 128px);
  --ds-grid-gap: clamp(16px, 2vw, 28px);
}
/* ═══ FALLBACK POLICES (audit K/facultatif-7) ═══
   Si le CDN Google Fonts est indisponible, le site reste lisible avec des
   polices système proches. Aucune dépendance bloquante. */
:root{
  --ds-font-display: 'Playfair Display', 'Georgia', 'Times New Roman', serif;
  --ds-font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --ds-font-mono: 'DM Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
  --ds-font-grotesk: 'Space Grotesk', 'Syne', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ===== BUG-33 : échelle z-index documentée ===== */
:root{
  --ds-z-base: 1;
  --ds-z-sticky: 100;
  --ds-z-nav: 500;
  --ds-z-overlay: 900;
  --ds-z-modal: 1000;
  --ds-z-toast: 1100;
  --ds-z-max: 9999;
}

/* ===== 2. COMPOSANTS PARTAGÉS — NAV / HERO / MOCKUP / CARDS / FOOTER (ex ds-index-v3) ===== */
/* ============================================
   DSTART — INDEX V3
   Page d'accueil complète
   ============================================ */

/* === NAVBAR === */
.ds-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 950;
  height: 58px;
  padding: 0 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(10, 15, 30, 0.97);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--ds-border-100);
}

.ds-nav-brand {
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 22px;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}

.ds-brand-ds {
  background: linear-gradient(135deg, #F8E7A7, #C9A84C);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-brand-advisory {
  color: var(--ds-text-100);
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  letter-spacing: 0.5px;
}

.ds-nav-links {
  display: flex;
  gap: 24px;
}

.ds-nav-links a {
  font-size: 13px;
  font-weight: 500;
  color: var(--ds-text-200);
  transition: color var(--ds-duration-fast) ease;
  text-decoration: none;
}

.ds-nav-links a:hover,
.ds-nav-links a.active {
  color: var(--ds-gold-300);
}

.ds-nav-cta {
  padding: 8px 16px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: var(--ds-radius-pill);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}

.ds-nav-cta:hover {
  background: var(--ds-gold-300);
  color: var(--ds-night-300);
  transform: translateY(-2px);
  box-shadow: var(--ds-shadow-gold);
}

@media (max-width: 860px) {
  .ds-nav {
    padding: 10px 20px;
    flex-wrap: wrap;
    height: auto;
  }
  .ds-nav-links {
    display: none;
  }
  .ds-nav-cta {
    font-size: 10px;
    padding: 6px 12px;
  }
}

/* === HERO SIGNATURE V3 === */
.ds-hero-v3 {
  position: relative;
  min-height: calc(100vh - 58px);
  padding: 120px var(--ds-page-x) 80px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.ds-hero-v3-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.ds-hero-v3-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
}

.ds-hero-v3-gradient {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 20% 30%, rgba(201, 168, 76, 0.08) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 80% 70%, rgba(0, 180, 216, 0.05) 0%, transparent 60%);
}

.ds-hero-v3-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.5;
  animation: ds-orb-float 20s ease-in-out infinite;
}

.ds-hero-v3-orb-1 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201, 168, 76, 0.15) 0%, transparent 70%);
  top: -100px;
  left: -100px;
}

.ds-hero-v3-orb-2 {
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(0, 180, 216, 0.12) 0%, transparent 70%);
  bottom: -50px;
  right: -50px;
  animation-delay: -10s;
}

@keyframes ds-orb-float {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(30px, -30px) scale(1.1); }
}

.ds-hero-v3-inner {
  position: relative;
  z-index: 2;
  max-width: 1400px;
  margin: 0 auto;
  width: 100%;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
  align-items: end;
}

.ds-hero-v3-content {
  max-width: 680px;
}

.ds-hero-v3-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 32px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.ds-hero-v3-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
  animation: ds-pulse-dot 2.5s ease-in-out infinite;
}

@keyframes ds-pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.4); }
}

.ds-hero-v3-tag-text {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-hero-v3-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 6.8vw, 88px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.025em;
  margin-bottom: 28px;
  color: var(--ds-text-100);
}

.ds-hero-v3-title-line {
  display: block;
}

.ds-hero-v3-title-accent {
  color: var(--ds-gold-300);
  font-style: italic;
  position: relative;
}

.ds-hero-v3-title-accent em {
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-style: italic;
  position: relative;
}

.ds-hero-v3-title-accent em::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--ds-gold-300), transparent);
  opacity: 0.5;
}

.ds-hero-v3-desc {
  font-size: 18px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 580px;
  margin-bottom: 36px;
}

.ds-hero-v3-desc strong {
  color: var(--ds-text-100);
  font-weight: 600;
}

.ds-hero-v3-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}

.ds-hero-v3-stats {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 24px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
  margin-bottom: 32px;
}

.ds-hero-v3-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ds-hero-v3-stat-num {
  font-family: 'Playfair Display', serif;
  font-size: 42px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
  letter-spacing: -0.02em;
}

.ds-hero-v3-stat-unit {
  font-size: 24px;
  color: var(--ds-gold-400);
  margin-left: 2px;
}

.ds-hero-v3-stat-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-hero-v3-stat-divider {
  width: 1px;
  height: 48px;
  background: var(--ds-border-200);
}

.ds-hero-v3-fe {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: rgba(0, 180, 216, 0.06);
  border: 1px solid rgba(0, 180, 216, 0.2);
  border-radius: var(--ds-radius-md);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
  color: inherit;
}

.ds-hero-v3-fe:hover {
  background: rgba(0, 180, 216, 0.1);
  border-color: var(--ds-cyan);
  transform: translateX(4px);
}

.ds-hero-v3-fe-icon {
  font-size: 22px;
  filter: drop-shadow(0 0 8px var(--ds-cyan-glow));
}

.ds-hero-v3-fe-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ds-hero-v3-fe-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ds-cyan);
  letter-spacing: 0.02em;
}

.ds-hero-v3-fe-desc {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-300);
}

.ds-hero-v3-fe-arrow {
  color: var(--ds-cyan);
  transition: transform var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-hero-v3-fe:hover .ds-hero-v3-fe-arrow {
  transform: translateX(4px);
}

/* === MOCKUP HEALTH SCORE === */
.ds-hero-v3-mockup {
  position: relative;
  perspective: 1200px;
}

.ds-hero-v3-mockup-glow {
  position: absolute;
  inset: -40px;
  background: radial-gradient(circle at center, rgba(232, 204, 122, 0.15) 0%, transparent 60%);
  filter: blur(40px);
  z-index: 0;
  animation: ds-mockup-glow 4s ease-in-out infinite;
}

@keyframes ds-mockup-glow {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.05); }
}

.ds-hero-v3-mockup-card {
  position: relative;
  z-index: 1;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.9) 0%, rgba(10, 15, 30, 0.95) 100%);
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-lg);
  padding: 24px;
  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(232, 204, 122, 0.08) inset;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transform: rotateY(-6deg) rotateX(2deg);
  animation: ds-mockup-float 8s ease-in-out infinite;
}

@keyframes ds-mockup-float {
  0%, 100% { transform: rotateY(-6deg) rotateX(2deg) translateY(0); }
  50% { transform: rotateY(-4deg) rotateX(1deg) translateY(-12px); }
}

.ds-mockup-header {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ds-border-200);
  margin-bottom: 16px;
}

.ds-mockup-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.ds-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ds-stat-label {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-400);
}

.ds-stat-value {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  line-height: 1;
}

.ds-stat-value.positive { color: var(--ds-green); }
.ds-stat-value.warning { color: var(--ds-orange); }

.ds-mockup-score {
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  padding: 16px;
  margin-bottom: 16px;
}

.ds-score-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.ds-score-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-score-badge {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  padding: 3px 8px;
  border-radius: var(--ds-radius-pill);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ds-score-badge.warning {
  background: rgba(249, 115, 22, 0.15);
  color: var(--ds-orange);
  border: 1px solid rgba(249, 115, 22, 0.3);
}

.ds-score-main {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 16px;
}

.ds-score-value {
  font-family: 'Playfair Display', serif;
  font-size: 56px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
  letter-spacing: -0.03em;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-score-max {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: var(--ds-text-400);
}

.ds-score-breakdown {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-score-item {
  display: grid;
  grid-template-columns: 90px 1fr 32px;
  align-items: center;
  gap: 10px;
}

.ds-score-label {
  font-size: 11px;
  color: var(--ds-text-300);
}

.ds-score-bar {
  height: 4px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 2px;
  overflow: hidden;
}

.ds-score-fill {
  height: 100%;
  border-radius: 2px;
  animation: ds-bar-fill 1.5s var(--ds-ease-out) forwards;
  transform-origin: left;
}

@keyframes ds-bar-fill {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

.ds-score-num {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-200);
  text-align: right;
}

.ds-score-item.critical .ds-score-label {
  color: var(--ds-red);
  font-weight: 600;
}

.ds-mockup-copilot {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(201, 168, 76, 0.02) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  padding: 14px;
  margin-bottom: 16px;
}

.ds-copilot-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.ds-copilot-icon {
  font-size: 16px;
}

.ds-copilot-title {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  color: var(--ds-gold-300);
  text-transform: uppercase;
}

.ds-mockup-copilot-text {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-200);
  margin: 0;
}

.ds-mockup-copilot-text strong {
  color: var(--ds-gold-300);
}

.ds-mockup-alerts {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--ds-radius-sm);
  font-size: 11px;
}

.ds-alert.warning {
  background: rgba(249, 115, 22, 0.08);
  border: 1px solid rgba(249, 115, 22, 0.2);
  color: #FCA5A5;
}

.ds-alert.success {
  background: rgba(74, 222, 128, 0.08);
  border: 1px solid rgba(74, 222, 128, 0.2);
  color: #86EFAC;
}

.ds-alert-icon {
  font-size: 13px;
}

.ds-hero-v3-scroll {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: 3;
}

.ds-hero-v3-scroll-text {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-text-400);
}

.ds-hero-v3-scroll-line {
  width: 1px;
  height: 40px;
  background: linear-gradient(180deg, var(--ds-gold-300) 0%, transparent 100%);
  animation: ds-scroll-line 2s ease-in-out infinite;
}

@keyframes ds-scroll-line {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

@media (max-width: 1100px) {
  .ds-hero-v3-inner {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  .ds-hero-v3-mockup-card {
    transform: none;
    max-width: 520px;
    margin: 0 auto;
  }
  @keyframes ds-mockup-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
  }
}

@media (max-width: 760px) {
  .ds-hero-v3 {
    padding: 100px 20px 60px;
    min-height: auto;
  }
  .ds-hero-v3-title {
    font-size: clamp(40px, 10vw, 56px);
  }
  .ds-hero-v3-stats {
    flex-wrap: wrap;
    gap: 20px;
  }
  .ds-hero-v3-stat-divider {
    display: none;
  }
  .ds-hero-v3-stat {
    flex: 1 1 calc(50% - 10px);
  }
  .ds-hero-v3-scroll {
    display: none;
  }
  .ds-mockup-stats {
    grid-template-columns: 1fr;
  }
  .ds-score-item {
    grid-template-columns: 70px 1fr 28px;
  }
}

/* === COUNTDOWN === */
.ds-countdown-section {
  padding: 80px var(--ds-page-x);
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  text-align: center;
}

.ds-countdown-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-cyan);
  margin-bottom: 20px;
}

.ds-countdown-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(32px, 4.5vw, 48px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 40px;
}

.ds-countdown {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  margin-bottom: 32px;
}

.ds-countdown-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.ds-countdown-value {
  font-family: 'Playfair Display', serif;
  font-size: 64px;
  font-weight: 900;
  line-height: 1;
  color: var(--ds-cyan);
  letter-spacing: -0.03em;
}

.ds-countdown-label {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-countdown-separator {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  color: var(--ds-text-400);
  line-height: 1;
}

.ds-countdown-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ds-text-200);
}

.ds-countdown-desc a {
  color: var(--ds-cyan);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 760px) {
  .ds-countdown {
    gap: 16px;
  }
  .ds-countdown-value {
    font-size: 48px;
  }
  .ds-countdown-separator {
    font-size: 32px;
  }
}

/* === VERTICAUX V3 === */
.ds-verticaux-v3 {
  position: relative;
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-verticaux-v3-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-verticaux-v3-header {
  max-width: 780px;
  margin-bottom: 80px;
}

.ds-verticaux-v3-tag {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-verticaux-v3-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-verticaux-v3-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-verticaux-v3-subtitle {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 640px;
}

.ds-verticaux-v3-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 80px;
}

.ds-vertical-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  overflow: hidden;
  isolation: isolate;
}

.ds-vertical-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top right, rgba(201, 168, 76, 0.08) 0%, transparent 60%);
  opacity: 0;
  transition: opacity var(--ds-duration-normal) var(--ds-ease-out);
  z-index: -1;
}

.ds-vertical-card:hover {
  transform: translateY(-8px);
  border-color: var(--ds-border-300);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(232, 204, 122, 0.1);
}

.ds-vertical-card:hover::before {
  opacity: 1;
}

.ds-vertical-card-number {
  position: absolute;
  top: 24px;
  right: 28px;
  font-family: 'Playfair Display', serif;
  font-size: 64px;
  font-weight: 900;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--ds-border-300);
  opacity: 0.4;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-vertical-card:hover .ds-vertical-card-number {
  opacity: 0.8;
  -webkit-text-stroke: 1px var(--ds-gold-400);
  transform: scale(1.1);
}

.ds-vertical-card-icon {
  font-size: 36px;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
  transition: transform var(--ds-duration-normal) var(--ds-ease-spring);
}

.ds-vertical-card:hover .ds-vertical-card-icon {
  transform: scale(1.15) rotate(-5deg);
}

.ds-vertical-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 26px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
  line-height: 1.1;
}

.ds-vertical-card-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

.ds-vertical-card-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.ds-vertical-kpi {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 10px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  color: var(--ds-gold-300);
  transition: all var(--ds-duration-fast) ease;
}

.ds-vertical-card:hover .ds-vertical-kpi {
  background: rgba(201, 168, 76, 0.12);
  border-color: var(--ds-border-300);
}

.ds-vertical-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  text-decoration: none;
  border-top: 1px solid var(--ds-border-200);
  margin-top: auto;
  padding-top: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-vertical-card-cta:hover {
  color: var(--ds-gold-200);
}

.ds-vertical-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

@media (max-width: 1100px) {
  .ds-verticaux-v3-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-verticaux-v3 {
    padding: 80px 0;
  }
  .ds-verticaux-v3-header {
    margin-bottom: 48px;
  }
  .ds-verticaux-v3-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .ds-vertical-card {
    padding: 24px;
  }
  .ds-vertical-card-number {
    font-size: 48px;
    top: 20px;
    right: 20px;
  }
}

/* === GAMME MICRO === */
.ds-micro-section {
  padding: var(--ds-section-y) 0;
}

.ds-micro-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-micro-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-micro-tag {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-micro-tag::before,
.ds-micro-tag::after {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--ds-gold-300);
}

.ds-micro-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-micro-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-micro-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-micro-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ds-micro-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-micro-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-micro-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-micro-card-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
}

.ds-micro-card-icon {
  font-size: 28px;
}

.ds-micro-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-micro-card-desc {
  font-size: 12px;
  line-height: 1.55;
  color: var(--ds-text-300);
  flex: 1;
}

.ds-micro-card-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 8px 0;
}

.ds-micro-card-kpis span {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 4px 8px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-100);
  border-radius: var(--ds-radius-pill);
  color: var(--ds-gold-300);
}

.ds-micro-card .ds-btn-gold {
  padding: 10px 16px;
  font-size: 10px;
  margin-top: auto;
}

@media (max-width: 1100px) {
  .ds-micro-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-micro-grid {
    grid-template-columns: 1fr;
  }
}

/* === DIAGNOSTICS === */
.ds-diagnostics-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-diagnostics-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-diagnostics-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-diagnostics-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-diagnostics-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-diagnostics-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-diag-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.ds-diag-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-diag-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-diag-tag {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-diag-title {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-diag-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

.ds-diag-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-diag-features li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-diag-price {
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-diag-amount {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-diag-note {
  font-size: 12px;
  color: var(--ds-text-400);
  margin-top: 8px;
}

.ds-diag-price-block {
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-diag-price-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-400);
  margin-bottom: 8px;
}

.ds-diag-price-main {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}

.ds-diag-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  color: var(--ds-text-400);
}

.ds-diag-price-note {
  font-size: 12px;
  color: var(--ds-text-400);
  margin-bottom: 8px;
}

.ds-diag-price-deduction {
  font-size: 12px;
  color: var(--ds-gold-300);
  font-weight: 600;
}

.ds-diag-card .ds-btn-primary {
  margin-top: auto;
}

@media (max-width: 900px) {
  .ds-diag-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ds-diag-card {
    padding: 24px;
  }
}

/* === PACKS === */
.ds-packs-section {
  padding: var(--ds-section-y) 0;
}

.ds-packs-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-packs-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-packs-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-packs-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-packs-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-packs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}

.ds-pack-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-pack-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-pack-card.popular {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-pack-card.limited {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.12) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-pack-popular-badge,
.ds-pack-limited-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  padding: 6px 16px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
  white-space: nowrap;
}

.ds-pack-limited-badge {
  background: linear-gradient(135deg, #F97316 0%, #FB923C 100%);
}

.ds-pack-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ds-pack-name {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-pack-tagline {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-pack-desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-300);
}

.ds-pack-price-block {
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-pack-price {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 6px;
}

.ds-pack-amount {
  font-family: 'Playfair Display', serif;
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-pack-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: var(--ds-gold-400);
}

.ds-pack-engagement {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
  margin-bottom: 4px;
}

.ds-pack-setup {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-300);
}

.ds-pack-offert {
  color: var(--ds-gold-300);
  font-weight: 700;
}

.ds-pack-places {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  background: rgba(249, 115, 22, 0.08);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-sm);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
  color: #FCA5A5;
}

.ds-pack-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.ds-pack-features li {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-pack-annual {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--ds-text-400);
  padding-top: 12px;
  border-top: 1px solid var(--ds-border-100);
}

.ds-btn-pack {
  display: inline-block;
  margin-top: auto;
  padding: 12px 20px;
  background: transparent;
  border: 1px solid var(--ds-border-300);
  color: var(--ds-text-100);
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: var(--ds-radius-pill);
  text-decoration: none;
  text-align: center;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-btn-pack:hover {
  background: rgba(201, 168, 76, 0.08);
  border-color: var(--ds-gold-300);
  color: var(--ds-gold-300);
}

.ds-packs-note {
  font-size: 11px;
  line-height: 1.6;
  color: var(--ds-text-400);
  font-style: italic;
  text-align: center;
}

@media (max-width: 1100px) {
  .ds-packs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-packs-grid {
    grid-template-columns: 1fr;
  }
  .ds-pack-card {
    padding: 24px;
  }
}

/* === DS COPILOT IA === */
.ds-copilot-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-copilot-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-copilot-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-copilot-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-copilot-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-copilot-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-copilot-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

/* === FIX collision .ds-copilot-* : versions MOCKUP (hero index) re-scopées
   pour primer sur le header de section FE/IA (même nom de classe) === */
.ds-mockup-copilot .ds-copilot-header {
  text-align: left;
  max-width: none;
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ds-mockup-copilot .ds-copilot-title {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--ds-gold-300);
  margin: 0;
  -webkit-text-fill-color: currentColor;
}
.ds-mockup-copilot .ds-copilot-icon {
  font-size: 13px;
  line-height: 1;
}

.ds-copilot-features {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 860px;
  margin: 0 auto;
}

.ds-copilot-feature {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  text-align: left;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.35) 0%, rgba(10, 15, 30, 0.5) 100%);
  border: 1px solid var(--ds-border-100, rgba(201,168,76,0.10));
  border-radius: var(--ds-radius-md, 12px);
  padding: 20px 24px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-copilot-feature:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-copilot-icon {
  font-size: 32px;
  margin-bottom: 16px;
}

.ds-copilot-feature-title {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 12px;
}

.ds-copilot-feature-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

@media (max-width: 1100px) {
  .ds-copilot-features {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-copilot-features {
    grid-template-columns: 1fr;
  }
}

/* === MÉTHODE === */
.ds-methode-section {
  padding: var(--ds-section-y) 0;
}

.ds-methode-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-methode-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-methode-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-methode-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-methode-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-methode-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.ds-methode-step {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  position: relative;
}

.ds-methode-number {
  font-family: 'Playfair Display', serif;
  font-size: 56px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 16px;
}

.ds-methode-week {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-400);
  margin-bottom: 12px;
}

.ds-methode-step-title {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-methode-step-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

.ds-methode-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--ds-gold-300);
  padding-top: 80px;
}

@media (max-width: 1100px) {
  .ds-methode-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .ds-methode-arrow {
    display: none;
  }
}

@media (max-width: 760px) {
  .ds-methode-steps {
    grid-template-columns: 1fr;
  }
}

/* === CTA FINAL === */
.ds-cta-section {
  padding: 100px 0;
  background: linear-gradient(180deg, var(--ds-night-300) 0%, var(--ds-night-200) 100%);
}

.ds-cta-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
  text-align: center;
}

.ds-cta-content {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.8) 0%, rgba(10, 15, 30, 0.95) 100%);
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-lg);
  padding: 48px;
}

.ds-cta-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 12px;
}

.ds-cta-subtitle {
  font-size: 16px;
  color: var(--ds-text-300);
  margin-bottom: 32px;
}

.ds-cta-form {
  max-width: 500px;
  margin: 0 auto;
}

.ds-form-group {
  margin-bottom: 20px;
  text-align: left;
}

.ds-form-group label {
  display: block;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ds-text-300);
  margin-bottom: 8px;
}

.ds-form-group select {
  width: 100%;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-sm);
  color: var(--ds-text-100);
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  transition: all var(--ds-duration-fast) ease;
}

.ds-form-group select:focus {
  outline: none;
  border-color: var(--ds-gold-400);
  background: rgba(255, 255, 255, 0.06);
}

.ds-form-price {
  padding: 20px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  margin-bottom: 24px;
}

.ds-form-price-amount {
  font-family: 'Playfair Display', serif;
  font-size: 36px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
  margin-bottom: 8px;
}

.ds-form-price-note {
  font-size: 12px;
  color: var(--ds-text-300);
}

.ds-form-success {
  padding: 16px;
  background: rgba(74, 222, 128, 0.08);
  border: 1px solid rgba(74, 222, 128, 0.2);
  border-radius: var(--ds-radius-sm);
  color: #86EFAC;
  font-size: 14px;
}

@media (max-width: 760px) {
  .ds-cta-content {
    padding: 32px 20px;
  }
}

/* === FOOTER SIGNATURE === */
.ds-footer-signature {
  position: relative;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  color: var(--ds-text-200);
  padding-top: 0;
  margin-top: var(--ds-space-5xl);
  overflow: hidden;
}

.ds-footer-gold-line {
  height: 1px;
  background: linear-gradient(90deg, 
    transparent 0%, 
    var(--ds-gold-400) 20%, 
    var(--ds-gold-300) 50%, 
    var(--ds-gold-400) 80%, 
    transparent 100%
  );
  opacity: 0.6;
  margin-bottom: var(--ds-space-3xl);
}

.ds-footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x) var(--ds-space-3xl);
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.1fr 0.9fr;
  gap: var(--ds-space-3xl);
}

.ds-footer-brand-col {
  padding-right: var(--ds-space-xl);
}

.ds-footer-logo {
  display: inline-block;
  margin-bottom: var(--ds-space-lg);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}

.ds-footer-logo:hover {
  transform: translateY(-2px);
  filter: drop-shadow(0 8px 20px rgba(232, 204, 122, 0.3));
}

.ds-footer-tagline {
  font-size: 13px;
  line-height: 1.7;
  color: var(--ds-text-300);
  margin-bottom: var(--ds-space-lg);
  font-style: italic;
}

.ds-footer-social {
  display: flex;
  gap: var(--ds-space-sm);
}

.ds-footer-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: 50%;
  color: var(--ds-text-300);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-footer-social a:hover {
  background: rgba(201, 168, 76, 0.12);
  border-color: var(--ds-gold-400);
  color: var(--ds-gold-300);
  transform: translateY(-2px);
}

.ds-footer-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: var(--ds-space-lg);
  position: relative;
  padding-bottom: var(--ds-space-sm);
}

.ds-footer-title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 24px;
  height: 1px;
  background: var(--ds-gold-400);
  opacity: 0.5;
}

.ds-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ds-footer-links li {
  margin-bottom: 10px;
}

.ds-footer-links a {
  font-size: 13px;
  color: var(--ds-text-300);
  text-decoration: none;
  transition: color var(--ds-duration-fast) ease;
}

.ds-footer-links a:hover {
  color: var(--ds-gold-300);
}

.ds-footer-legal-band {
  background: var(--ds-night-400);
  border-top: 1px solid var(--ds-border-100);
  padding: var(--ds-space-xl) 0;
}

.ds-footer-legal-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
  text-align: center;
}

.ds-footer-legal-text {
  font-size: 11px;
  line-height: 1.7;
  color: var(--ds-text-400);
  max-width: 900px;
  margin: 0 auto var(--ds-space-md);
}

.ds-footer-legal-links {
  display: flex;
  justify-content: center;
  gap: var(--ds-space-md);
  margin-bottom: var(--ds-space-md);
  flex-wrap: wrap;
}

.ds-footer-legal-links a {
  font-size: 11px;
  color: var(--ds-text-300);
  text-decoration: none;
  transition: color var(--ds-duration-fast) ease;
}

.ds-footer-legal-links a:hover {
  color: var(--ds-gold-300);
}

.ds-footer-sep {
  color: var(--ds-text-500);
}

.ds-footer-copyright {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--ds-text-500);
  margin: 0;
}

@media (max-width: 980px) {
  .ds-footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: var(--ds-space-2xl);
  }
  .ds-footer-brand-col {
    grid-column: 1 / -1;
    padding-right: 0;
  }
}

@media (max-width: 600px) {
  .ds-footer-inner {
    grid-template-columns: 1fr;
    gap: var(--ds-space-xl);
  }
  .ds-footer-signature {
    padding: 40px 0 0;
  }
}

/* === BOUTONS GLOBAUX === */
.ds-btn-gold {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: linear-gradient(135deg, var(--ds-gold-400) 0%, var(--ds-gold-300) 100%);
  color: var(--ds-night-300);
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: none;
  border-radius: var(--ds-radius-pill);
  cursor: pointer;
  overflow: hidden;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  box-shadow: 0 8px 24px rgba(201, 168, 76, 0.28);
  text-decoration: none;
}

.ds-btn-gold::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  transition: left 0.6s var(--ds-ease-out);
}

.ds-btn-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(201, 168, 76, 0.42);
}

.ds-btn-gold:hover::before {
  left: 100%;
}

.ds-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: transparent;
  color: var(--ds-text-100);
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-pill);
  cursor: pointer;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}

.ds-btn-ghost:hover {
  background: rgba(201, 168, 76, 0.08);
  border-color: var(--ds-gold-300);
  color: var(--ds-gold-300);
  transform: translateY(-2px);
}

.ds-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 28px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  font-weight: 700;
  font-size: 14px;
  border-radius: var(--ds-radius-pill);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}

.ds-btn-primary:hover {
  background: var(--ds-gold-300);
  color: var(--ds-night-300);
  transform: translateY(-2px);
  box-shadow: var(--ds-shadow-gold);
}
/* ===== 3. PAGE · FACTURATION ÉLECTRONIQUE (ex ds-fe-v3) ===== */
/* ============================================
   DSTART — FE V3
   ============================================ */

.ds-fe-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 80px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-fe-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-fe-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(0, 180, 216, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 180, 216, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-fe-hero-pulse {
  position: absolute;
  top: 20%;
  left: 50%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(0, 180, 216, 0.15) 0%, transparent 70%);
  filter: blur(60px);
  animation: ds-fe-pulse 4s ease-in-out infinite;
  transform: translateX(-50%);
}

@keyframes ds-fe-pulse {
  0%, 100% { opacity: 0.4; transform: translateX(-50%) scale(1); }
  50% { opacity: 0.7; transform: translateX(-50%) scale(1.1); }
}

.ds-fe-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
}

.ds-fe-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(0, 180, 216, 0.08);
  border: 1px solid rgba(0, 180, 216, 0.2);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 24px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-cyan);
}

.ds-fe-hero-tag-pulse {
  width: 6px;
  height: 6px;
  background: var(--ds-cyan);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-cyan);
  animation: ds-pulse-dot 2.5s ease-in-out infinite;
}

.ds-fe-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(44px, 6vw, 76px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ds-text-100);
  margin-bottom: 24px;
}

.ds-fe-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-cyan) 0%, #4DD0E1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 580px;
  margin-bottom: 32px;
}

/* Countdown */
.ds-fe-countdown {
  background: rgba(0, 180, 216, 0.06);
  border: 1px solid rgba(0, 180, 216, 0.2);
  border-radius: var(--ds-radius-md);
  padding: 24px;
  margin-bottom: 32px;
  text-align: center;
}

.ds-fe-countdown-label {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-cyan);
  margin-bottom: 12px;
}

.ds-fe-countdown-grid {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  margin-bottom: 12px;
}

.ds-fe-countdown-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.ds-fe-countdown-value {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  line-height: 1;
  color: var(--ds-cyan);
}

.ds-fe-countdown-unit {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-fe-countdown-sep {
  font-family: 'Playfair Display', serif;
  font-size: 32px;
  font-weight: 900;
  color: var(--ds-text-400);
  line-height: 1;
}

.ds-fe-countdown-deadline {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--ds-text-300);
}

.ds-fe-hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

/* Mockup FE */
.ds-fe-hero-mockup {
  position: relative;
  perspective: 1200px;
}

.ds-fe-mockup-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.9) 0%, rgba(10, 15, 30, 0.95) 100%);
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-lg);
  padding: 24px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
  transform: rotateY(-6deg) rotateX(2deg);
  animation: ds-mockup-float 8s ease-in-out infinite;
}

.ds-fe-mockup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ds-border-200);
  margin-bottom: 16px;
}

.ds-fe-mockup-logo {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ds-fe-mockup-logo-ds {
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 18px;
  color: var(--ds-gold-300);
}

.ds-fe-mockup-logo-name {
  font-size: 13px;
  color: var(--ds-text-200);
}

.ds-fe-mockup-badge {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: rgba(74, 222, 128, 0.15);
  border: 1px solid rgba(74, 222, 128, 0.3);
  color: var(--ds-green);
  border-radius: var(--ds-radius-pill);
}

.ds-fe-mockup-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 8px;
}

.ds-fe-mockup-subtitle {
  font-size: 12px;
  color: var(--ds-text-300);
  margin-bottom: 16px;
}

.ds-fe-mockup-items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}

.ds-fe-mockup-item {
  display: flex;
  gap: 12px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: var(--ds-radius-sm);
}

.ds-fe-mockup-item-icon {
  font-size: 18px;
}

.ds-fe-mockup-item-content {
  flex: 1;
}

.ds-fe-mockup-item-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ds-text-100);
  margin-bottom: 2px;
}

.ds-fe-mockup-item-desc {
  font-size: 11px;
  color: var(--ds-text-300);
}

.ds-fe-mockup-alerts {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-fe-mockup-alert {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--ds-radius-sm);
  font-size: 11px;
  line-height: 1.5;
}

.ds-fe-mockup-alert.warning {
  background: rgba(249, 115, 22, 0.08);
  border: 1px solid rgba(249, 115, 22, 0.2);
  color: #FCA5A5;
}

.ds-fe-mockup-alert.info {
  background: rgba(0, 180, 216, 0.08);
  border: 1px solid rgba(0, 180, 216, 0.2);
  color: #7DD3FC;
}

/* Test FE */
.ds-fe-test-section {
  padding: var(--ds-section-y) 0;
  background: var(--ds-night-300);
}

.ds-fe-test-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-test-card {
  background: linear-gradient(135deg, rgba(0, 180, 216, 0.06) 0%, rgba(13, 27, 62, 0.8) 100%);
  border: 1px solid rgba(0, 180, 216, 0.2);
  border-radius: var(--ds-radius-lg);
  padding: 48px;
  text-align: center;
}

.ds-fe-test-header {
  margin-bottom: 32px;
}

.ds-fe-test-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-cyan);
  margin-bottom: 20px;
}

.ds-fe-test-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(32px, 4.5vw, 48px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 16px;
}

.ds-fe-test-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto 32px;
}

.ds-fe-test-actions {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}

.ds-fe-test-note {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-400);
}

/* Calendrier */
.ds-fe-calendar-section {
  padding: var(--ds-section-y) 0;
}

.ds-fe-calendar-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-calendar-header {
  text-align: center;
  margin-bottom: 64px;
}

.ds-fe-calendar-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-calendar-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
}

.ds-fe-calendar-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-calendar-timeline {
  position: relative;
  padding-left: 40px;
  border-left: 2px solid var(--ds-border-200);
}

.ds-fe-calendar-item {
  position: relative;
  margin-bottom: 32px;
}

.ds-fe-calendar-dot {
  position: absolute;
  left: -50px;
  top: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--ds-night-300);
  border: 2px solid var(--ds-border-300);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}

.ds-fe-calendar-item.urgent .ds-fe-calendar-dot {
  background: var(--ds-orange);
  border-color: var(--ds-orange);
}

.ds-fe-calendar-date {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 8px;
}

.ds-fe-calendar-item-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-fe-calendar-item-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-200);
}

.ds-fe-calendar-warning {
  margin-top: 48px;
  padding: 24px;
  background: rgba(249, 115, 22, 0.04);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-md);
}

.ds-fe-calendar-warning h4 {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 900;
  color: #FCA5A5;
  margin-bottom: 12px;
}

.ds-fe-calendar-warning p {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
  margin-bottom: 16px;
}

.ds-fe-calendar-warning-items {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ds-fe-calendar-warning-item {
  display: flex;
  gap: 10px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
}

/* Services */
.ds-fe-services-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-fe-services-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-services-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-fe-services-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-services-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-fe-services-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.ds-fe-service-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-fe-service-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-fe-service-icon {
  font-size: 32px;
  margin-bottom: 16px;
}

.ds-fe-service-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 12px;
}

.ds-fe-service-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

.ds-fe-services-note {
  padding: 20px 24px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
  margin-bottom: 24px;
}

.ds-fe-services-note strong {
  color: var(--ds-gold-300);
}

.ds-fe-services-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Offres FE */
.ds-fe-offres-section {
  padding: var(--ds-section-y) 0;
}

.ds-fe-offres-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-offres-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-fe-offres-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-offres-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-fe-offres-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-offres-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-fe-offres-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.ds-fe-offre-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-fe-offre-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-fe-offre-card.featured {
  background: linear-gradient(135deg, rgba(0, 180, 216, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: rgba(0, 180, 216, 0.3);
}

.ds-fe-offre-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  padding: 6px 16px;
  background: var(--ds-cyan);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
  white-space: nowrap;
}

.ds-fe-offre-code {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--ds-text-400);
  text-transform: uppercase;
}

.ds-fe-offre-title {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-text-100);
}

.ds-fe-offre-price {
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-fe-offre-amount {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-fe-offre-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 16px;
  color: var(--ds-gold-400);
}

.ds-fe-offre-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
}

.ds-fe-offre-duration {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--ds-text-300);
}

.ds-fe-offre-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.ds-fe-offre-features li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-fe-offres-note {
  padding: 20px 24px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
  text-align: center;
}

.ds-fe-offres-note strong {
  color: var(--ds-gold-300);
}

/* Process */
.ds-fe-process-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-fe-process-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-process-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-fe-process-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-process-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-fe-process-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-process-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-fe-process-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ds-fe-process-step {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
}

.ds-fe-process-num {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 16px;
}

.ds-fe-process-date {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 12px;
}

.ds-fe-process-step-title {
  font-family: 'Playfair Display', serif;
  font-size: 18px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-fe-process-step-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

/* Engagements */
.ds-fe-engagements-section {
  padding: var(--ds-section-y) 0;
}

.ds-fe-engagements-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-engagements-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-fe-engagements-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-engagements-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-fe-engagements-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-engagements-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ds-fe-engagement-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  text-align: center;
}

.ds-fe-engagement-icon {
  font-size: 32px;
  margin-bottom: 16px;
}

.ds-fe-engagement-title {
  font-family: 'Playfair Display', serif;
  font-size: 18px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-fe-engagement-desc {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ds-text-300);
}

/* Contact */
.ds-fe-contact-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-fe-contact-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-fe-contact-header {
  text-align: center;
  margin-bottom: 48px;
}

.ds-fe-contact-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-fe-contact-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 16px;
}

.ds-fe-contact-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-fe-contact-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-fe-contact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}

.ds-fe-contact-card {
  display: flex;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  text-decoration: none;
  color: inherit;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-fe-contact-card:hover {
  border-color: var(--ds-gold-300);
  background: rgba(201, 168, 76, 0.04);
}

.ds-fe-contact-icon {
  font-size: 24px;
  flex-shrink: 0;
}

.ds-fe-contact-content {
  flex: 1;
}

.ds-fe-contact-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-400);
  margin-bottom: 4px;
}

.ds-fe-contact-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--ds-text-100);
}

.ds-fe-contact-cta {
  text-align: center;
}

/* Responsive */
@media (max-width: 1100px) {
  .ds-fe-hero-inner {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .ds-fe-services-grid,
  .ds-fe-offres-grid,
  .ds-fe-engagements-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ds-fe-process-steps {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-fe-hero {
    padding: 100px 20px 60px;
  }

  .ds-fe-services-grid,
  .ds-fe-offres-grid,
  .ds-fe-engagements-grid,
  .ds-fe-process-steps,
  .ds-fe-contact-grid {
    grid-template-columns: 1fr;
  }

  .ds-fe-countdown-grid {
    gap: 16px;
  }

  .ds-fe-countdown-value {
    font-size: 36px;
  }

  .ds-fe-calendar-timeline {
    padding-left: 30px;
  }

  .ds-fe-calendar-dot {
    left: -40px;
    width: 20px;
    height: 20px;
  }
}
/* ===== 4. PAGE · PACKS MÉTIERS (ex ds-packs-v3) ===== */
/* ============================================
   DSTART — PACKS V3
   ============================================ */

.ds-packs-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 80px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-packs-hero-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
}

.ds-packs-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 28px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-packs-hero-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
}

.ds-packs-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(44px, 6vw, 76px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ds-text-100);
  margin-bottom: 24px;
}

.ds-packs-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-packs-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 580px;
  margin-bottom: 32px;
}

.ds-packs-hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.ds-packs-hero-stats {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 20px 0;
  border-top: 1px solid var(--ds-border-200);
}

.ds-packs-hero-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ds-packs-hero-stat-num {
  font-family: 'Playfair Display', serif;
  font-size: 36px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
}

.ds-packs-hero-stat-unit {
  font-size: 20px;
  color: var(--ds-gold-400);
}

.ds-packs-hero-stat-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-packs-hero-stat-divider {
  width: 1px;
  height: 40px;
  background: var(--ds-border-200);
}

.ds-verticaux-section {
  padding: var(--ds-section-y) 0;
  background: var(--ds-night-300);
}

.ds-verticaux-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-verticaux-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-verticaux-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-verticaux-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-verticaux-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-verticaux-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
}

.ds-verticaux-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.ds-vertical-detail {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-vertical-detail:hover {
  transform: translateY(-6px);
  border-color: var(--ds-border-300);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.ds-vertical-detail.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-vertical-detail-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
}

.ds-vertical-detail-header {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ds-vertical-detail-number {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px var(--ds-border-300);
}

.ds-vertical-detail-icon {
  font-size: 32px;
}

.ds-vertical-detail-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ds-vertical-detail-label {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
}

.ds-vertical-detail-target {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
  color: var(--ds-text-400);
  text-transform: uppercase;
}

.ds-vertical-detail-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

.ds-vertical-detail-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ds-vertical-detail-kpi {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 10px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  color: var(--ds-gold-300);
}

.ds-vertical-detail-actions {
  display: flex;
  gap: 10px;
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid var(--ds-border-200);
}

@media (max-width: 1100px) {
  .ds-packs-hero-inner {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  
  .ds-verticaux-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-packs-hero {
    padding: 100px 20px 60px;
  }
  
  .ds-verticaux-grid {
    grid-template-columns: 1fr;
  }
  
  .ds-vertical-detail {
    padding: 24px;
  }
}
/* ===== 5. PAGE · TARIFS (ex ds-tarifs-v3) ===== */
/* ============================================
   DSTART — TARIFS V3
   ============================================ */

/* Hero FE Express */
.ds-tarifs-fe-hero {
  padding: 120px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-tarifs-fe-hero-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.ds-tarifs-fe-hero-tag {
  display: inline-block;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-cyan);
  margin-bottom: 20px;
  padding: 8px 18px;
  background: rgba(0, 180, 216, 0.08);
  border: 1px solid rgba(0, 180, 216, 0.2);
  border-radius: var(--ds-radius-pill);
}

.ds-tarifs-fe-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-tarifs-fe-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-cyan) 0%, #4DD0E1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-tarifs-fe-hero-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 720px;
  margin: 0 auto;
}

/* Section FE */
.ds-tarifs-fe-section {
  padding: 0 0 var(--ds-section-y);
  background: var(--ds-night-300);
}

.ds-tarifs-fe-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-tarifs-fe-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.ds-tarifs-fe-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-tarifs-fe-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-tarifs-fe-card.featured {
  background: linear-gradient(135deg, rgba(0, 180, 216, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: rgba(0, 180, 216, 0.3);
}

.ds-tarifs-fe-card-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  padding: 6px 16px;
  background: var(--ds-cyan);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
  white-space: nowrap;
}

.ds-tarifs-fe-card-code {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--ds-text-400);
  text-transform: uppercase;
}

.ds-tarifs-fe-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-tarifs-fe-card-target {
  font-size: 12px;
  color: var(--ds-text-300);
}

.ds-tarifs-fe-card-price {
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-tarifs-fe-card-amount {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-tarifs-fe-card-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 16px;
  color: var(--ds-gold-400);
}

.ds-tarifs-fe-card-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
}

.ds-tarifs-fe-card-duration {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--ds-text-300);
}

.ds-tarifs-fe-card-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.ds-tarifs-fe-card-features li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-tarifs-fe-card .ds-btn-gold,
.ds-tarifs-fe-card .ds-btn-ghost {
  margin-top: auto;
}

.ds-tarifs-fe-note {
  padding: 20px 24px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
}

.ds-tarifs-fe-note strong {
  color: var(--ds-gold-300);
}

/* Hero Packs */
.ds-tarifs-packs-hero {
  padding: 100px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-300) 0%, var(--ds-night-200) 100%);
}

.ds-tarifs-packs-hero-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.ds-tarifs-packs-hero-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-tarifs-packs-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-tarifs-packs-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-tarifs-packs-hero-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 720px;
  margin: 0 auto 24px;
}

.ds-tarifs-packs-hero-warning {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  background: rgba(249, 115, 22, 0.06);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-md);
  font-size: 13px;
  color: #FCA5A5;
  max-width: 720px;
  text-align: left;
}

/* Section Packs */
.ds-tarifs-packs-section {
  padding: 0 0 var(--ds-section-y);
  background: var(--ds-night-200);
}

.ds-tarifs-packs-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-tarifs-packs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}

.ds-tarifs-pack-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-tarifs-pack-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-tarifs-pack-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-tarifs-pack-card.limited {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.12) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-tarifs-pack-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  padding: 6px 16px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
  white-space: nowrap;
}

.ds-tarifs-pack-limited-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.12em;
  padding: 6px 14px;
  background: linear-gradient(135deg, #F97316 0%, #FB923C 100%);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
  white-space: nowrap;
}

.ds-tarifs-pack-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ds-tarifs-pack-name {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-tarifs-pack-tagline {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-tarifs-pack-desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-300);
}

.ds-tarifs-pack-price {
  padding: 16px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-tarifs-pack-price-main {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 6px;
}

.ds-tarifs-pack-price-amount {
  font-family: 'Playfair Display', serif;
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-tarifs-pack-price-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: var(--ds-gold-400);
}

.ds-tarifs-pack-price-period {
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  color: var(--ds-text-400);
}

.ds-tarifs-pack-price-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
  margin-bottom: 4px;
}

.ds-tarifs-pack-setup {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-300);
}

.ds-tarifs-pack-offert {
  color: var(--ds-gold-300);
  font-weight: 700;
}

.ds-tarifs-pack-places {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  background: rgba(249, 115, 22, 0.08);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-sm);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
  color: #FCA5A5;
}

.ds-tarifs-pack-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.ds-tarifs-pack-features li {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-tarifs-pack-annual {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--ds-text-400);
  padding-top: 12px;
  border-top: 1px solid var(--ds-border-100);
}

.ds-tarifs-pack-card .ds-btn-gold,
.ds-tarifs-pack-card .ds-btn-ghost {
  margin-top: auto;
}

.ds-tarifs-packs-note {
  font-size: 11px;
  line-height: 1.6;
  color: var(--ds-text-400);
  font-style: italic;
  text-align: center;
}

/* Gamme Micro */
.ds-tarifs-micro-section {
  padding: var(--ds-section-y) 0;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
}

.ds-tarifs-micro-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-tarifs-micro-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-tarifs-micro-tag {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-tarifs-micro-tag::before,
.ds-tarifs-micro-tag::after {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--ds-gold-300);
}

.ds-tarifs-micro-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-tarifs-micro-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-tarifs-micro-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-tarifs-micro-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}

.ds-tarifs-micro-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-tarifs-micro-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-tarifs-micro-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.1) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-tarifs-micro-card-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: var(--ds-gold-400);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
}

.ds-tarifs-micro-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-tarifs-micro-card-tagline {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ds-gold-300);
  font-style: italic;
}

.ds-tarifs-micro-card-desc {
  font-size: 12px;
  line-height: 1.55;
  color: var(--ds-text-300);
}

.ds-tarifs-micro-card-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ds-tarifs-micro-card-features li {
  font-size: 11px;
  line-height: 1.5;
  color: var(--ds-text-200);
}

.ds-tarifs-micro-card-price,
.ds-tarifs-micro-card-price-block {
  padding: 14px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
  margin: 8px 0;
}

.ds-tarifs-micro-card-price-main {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 4px;
}

.ds-tarifs-micro-card-amount {
  font-family: 'Playfair Display', serif;
  font-size: 36px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-tarifs-micro-card-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: var(--ds-gold-400);
}

.ds-tarifs-micro-card-period {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
}

.ds-tarifs-micro-card-price-ttc,
.ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card-annual {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  color: var(--ds-text-400);
  line-height: 1.5;
}

.ds-tarifs-micro-card .ds-btn-gold,
.ds-tarifs-micro-card .ds-btn-ghost {
  margin-top: auto;
}

.ds-tarifs-micro-note {
  font-size: 11px;
  line-height: 1.6;
  color: var(--ds-text-400);
  font-style: italic;
  text-align: center;
}

/* Options IA */
.ds-tarifs-options-section {
  padding: var(--ds-section-y) 0;
  background: var(--ds-night-300);
}

.ds-tarifs-options-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-tarifs-options-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 64px;
}

.ds-tarifs-options-tag {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-tarifs-options-tag::before,
.ds-tarifs-options-tag::after {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--ds-gold-300);
}

.ds-tarifs-options-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-tarifs-options-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-tarifs-options-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-tarifs-options-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}

.ds-tarifs-option-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-tarifs-option-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-tarifs-option-name {
  font-family: 'Playfair Display', serif;
  font-size: 16px;
  font-weight: 900;
  color: var(--ds-text-100);
}

.ds-tarifs-option-price {
  display: flex;
  align-items: baseline;
  gap: 4px;
}

.ds-tarifs-option-amount {
  font-family: 'Playfair Display', serif;
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
  color: var(--ds-gold-300);
}

.ds-tarifs-option-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: var(--ds-text-400);
}

.ds-tarifs-option-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  color: var(--ds-text-400);
}

.ds-tarifs-option-desc {
  font-size: 11px;
  line-height: 1.5;
  color: var(--ds-text-300);
}

.ds-tarifs-options-note,
.ds-tarifs-options-warning {
  padding: 16px 20px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  font-size: 12px;
  line-height: 1.6;
  color: var(--ds-text-200);
  margin-bottom: 12px;
}

.ds-tarifs-options-warning {
  background: rgba(249, 115, 22, 0.04);
  border-color: rgba(249, 115, 22, 0.2);
  color: #FCA5A5;
}

.ds-tarifs-options-note strong,
.ds-tarifs-options-warning strong {
  color: var(--ds-gold-300);
}

/* CTA final */
.ds-tarifs-cta {
  padding: 100px 0;
  background: linear-gradient(180deg, var(--ds-night-300) 0%, var(--ds-night-200) 100%);
}

.ds-tarifs-cta-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
  text-align: center;
}

.ds-tarifs-cta-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 24px;
}

.ds-tarifs-cta-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-tarifs-cta-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-tarifs-cta-desc {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  margin-bottom: 32px;
}

.ds-tarifs-cta-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Responsive */
@media (max-width: 1100px) {
  .ds-tarifs-fe-grid,
  .ds-tarifs-packs-grid,
  .ds-tarifs-micro-grid,
  .ds-tarifs-options-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .ds-tarifs-fe-grid,
  .ds-tarifs-packs-grid,
  .ds-tarifs-micro-grid,
  .ds-tarifs-options-grid {
    grid-template-columns: 1fr;
  }

  .ds-tarifs-fe-card,
  .ds-tarifs-pack-card,
  .ds-tarifs-micro-card,
  .ds-tarifs-option-card {
    padding: 24px;
  }

  .ds-tarifs-cta-actions {
    flex-direction: column;
  }

  .ds-tarifs-cta-actions .ds-btn-gold,
  .ds-tarifs-cta-actions .ds-btn-ghost {
    width: 100%;
  }
}
/* ===== 6. PAGE · DIAGNOSTIC PREMIUM (ex ds-diagnostic-v3) ===== */
/* ============================================
   DSTART — DIAGNOSTIC PREMIUM V3
   ============================================ */

.ds-diag-hero {
  position: relative;
  padding: 140px var(--ds-page-x) 80px;
  overflow: hidden;
}

.ds-diag-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-diag-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-diag-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
  align-items: center;
}

.ds-diag-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 24px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-diag-hero-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
  animation: ds-pulse-dot 2.5s ease-in-out infinite;
}

.ds-diag-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(44px, 6vw, 80px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ds-text-100);
  margin-bottom: 28px;
}

.ds-diag-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-diag-hero-desc {
  font-size: 18px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 560px;
  margin-bottom: 36px;
}

.ds-diag-hero-price {
  display: flex;
  align-items: baseline;
  gap: 24px;
  padding: 24px 0;
  border-top: 1px solid var(--ds-border-200);
  border-bottom: 1px solid var(--ds-border-200);
  margin-bottom: 32px;
}

.ds-diag-hero-price-main {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.ds-diag-hero-price-amount {
  font-family: 'Playfair Display', serif;
  font-size: 64px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-diag-hero-price-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 20px;
  color: var(--ds-gold-400);
  margin-left: 4px;
}

.ds-diag-hero-price-details {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--ds-text-300);
}

.ds-diag-hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

.ds-diag-hero-bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.ds-diag-hero-bullets li {
  font-size: 13px;
  color: var(--ds-text-200);
  padding-left: 24px;
  position: relative;
}

.ds-diag-hero-bullets li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--ds-gold-300);
  font-weight: 700;
}

/* Mockup rapport */
.ds-diag-hero-mockup {
  position: relative;
  perspective: 1200px;
}

.ds-diag-mockup-doc {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%);
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(232, 204, 122, 0.1) inset;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transform: rotateY(-4deg) rotateX(2deg);
  animation: ds-doc-float 8s ease-in-out infinite;
}

@keyframes ds-doc-float {
  0%, 100% { transform: rotateY(-4deg) rotateX(2deg) translateY(0); }
  50% { transform: rotateY(-2deg) rotateX(1deg) translateY(-10px); }
}

.ds-diag-mockup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ds-border-200);
  margin-bottom: 24px;
}

.ds-diag-mockup-logo {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ds-diag-mockup-logo-ds {
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 18px;
  color: var(--ds-gold-300);
}

.ds-diag-mockup-logo-name {
  font-size: 13px;
  color: var(--ds-text-200);
  letter-spacing: 0.04em;
}

.ds-diag-mockup-confidential {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: rgba(239, 68, 68, 0.15);
  border: 1px solid rgba(239, 68, 68, 0.3);
  color: var(--ds-red);
  border-radius: var(--ds-radius-pill);
}

.ds-diag-mockup-score {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 24px;
}

.ds-diag-mockup-score-value {
  font-family: 'Playfair Display', serif;
  font-size: 96px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.04em;
}

.ds-diag-mockup-score-max {
  font-family: 'DM Mono', monospace;
  font-size: 20px;
  color: var(--ds-text-400);
}

.ds-diag-mockup-score-label {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-orange);
  margin-left: auto;
  padding: 4px 10px;
  background: rgba(249, 115, 22, 0.1);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-pill);
}

.ds-diag-mockup-radar {
  margin: 32px 0;
  display: flex;
  justify-content: center;
}

.ds-diag-radar-svg {
  width: 200px;
  height: 200px;
}

.ds-diag-mockup-sections {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 24px;
  border-top: 1px solid var(--ds-border-200);
}

.ds-diag-mockup-section {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--ds-text-300);
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.02);
  border-radius: var(--ds-radius-sm);
}

/* Sections génériques */
.ds-diag-section {
  padding: var(--ds-section-y) 0;
  position: relative;
}

.ds-diag-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-diag-section-header {
  max-width: 780px;
  margin-bottom: 64px;
}

.ds-diag-section-tag {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-diag-section-tag::before {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--ds-gold-300);
}

.ds-diag-section-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-diag-section-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-diag-section-subtitle {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 640px;
}

/* Pour qui */
.ds-diag-pourqui-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.ds-diag-pourqui-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-pourqui-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.ds-diag-pourqui-icon {
  font-size: 32px;
  margin-bottom: 16px;
}

.ds-diag-pourqui-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.ds-diag-pourqui-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-300);
}

/* Livrables */
.ds-diag-livrables-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.ds-diag-livrable-item {
  display: flex;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-100);
  border-radius: var(--ds-radius-md);
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-livrable-item:hover {
  background: rgba(201, 168, 76, 0.04);
  border-color: var(--ds-border-200);
}

.ds-diag-livrable-item.featured {
  background: linear-gradient(135deg, rgba(0, 180, 216, 0.08) 0%, rgba(201, 168, 76, 0.04) 100%);
  border-color: rgba(0, 180, 216, 0.3);
}

.ds-diag-livrable-num {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
  min-width: 36px;
}

.ds-diag-livrable-content h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--ds-text-100);
  margin-bottom: 4px;
}

.ds-diag-livrable-content p {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ds-text-300);
  margin: 0;
}

/* 8 axes */
.ds-diag-axes-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ds-diag-axe-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  position: relative;
  overflow: hidden;
}

.ds-diag-axe-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

.ds-diag-axe-card.featured {
  background: linear-gradient(135deg, rgba(0, 180, 216, 0.1) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: rgba(0, 180, 216, 0.3);
}

.ds-diag-axe-num {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px var(--ds-border-300);
  line-height: 1;
  margin-bottom: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-axe-card:hover .ds-diag-axe-num {
  -webkit-text-stroke: 1px var(--ds-gold-300);
}

.ds-diag-axe-title {
  font-family: 'Playfair Display', serif;
  font-size: 18px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-diag-axe-desc {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ds-text-300);
}

/* Process */
.ds-diag-process-steps {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  gap: 12px;
  align-items: center;
}

.ds-diag-process-step {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  position: relative;
}

.ds-diag-process-num {
  font-family: 'Playfair Display', serif;
  font-size: 56px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 16px;
}

.ds-diag-process-content h3 {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-diag-process-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
  margin-bottom: 16px;
}

.ds-diag-process-time {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--ds-gold-300);
  padding: 6px 12px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  display: inline-block;
}

.ds-diag-process-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--ds-gold-300);
  padding-top: 80px;
}

/* FAQ */
.ds-diag-faq-list {
  max-width: 820px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ds-diag-faq-item {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  overflow: hidden;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-faq-item[open] {
  background: rgba(201, 168, 76, 0.04);
  border-color: var(--ds-border-300);
}

.ds-diag-faq-item summary {
  padding: 20px 24px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ds-text-100);
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: color var(--ds-duration-fast) ease;
}

.ds-diag-faq-item summary::-webkit-details-marker {
  display: none;
}

.ds-diag-faq-item summary::after {
  content: '+';
  font-size: 24px;
  color: var(--ds-gold-300);
  transition: transform var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-diag-faq-item[open] summary::after {
  transform: rotate(45deg);
}

.ds-diag-faq-item p {
  padding: 0 24px 20px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--ds-text-200);
  margin: 0;
}

/* CTA final */
.ds-diag-cta {
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  padding: 100px 0;
}

.ds-diag-cta-inner {
  max-width: 780px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
  text-align: center;
}

.ds-diag-cta-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 24px;
}

.ds-diag-cta-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 72px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 40px;
}

.ds-diag-cta-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-diag-cta-price {
  margin-bottom: 40px;
}

.ds-diag-cta-price-main {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  margin-bottom: 12px;
}

.ds-diag-cta-price-amount {
  font-family: 'Playfair Display', serif;
  font-size: 96px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
}

.ds-diag-cta-price-suffix {
  font-family: 'DM Mono', monospace;
  font-size: 28px;
  color: var(--ds-gold-400);
}

.ds-diag-cta-price-ttc {
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--ds-text-300);
}

.ds-diag-cta-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

.ds-diag-cta-note {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--ds-text-400);
  margin-bottom: 16px;
}

.ds-diag-cta-disclaimer {
  font-size: 12px;
  line-height: 1.6;
  color: var(--ds-text-400);
  max-width: 560px;
  margin: 0 auto;
  padding-top: 24px;
  border-top: 1px solid var(--ds-border-100);
}

/* Responsive */
@media (max-width: 1100px) {
  .ds-diag-hero-inner {
    grid-template-columns: 1fr;
    gap: 60px;
  }

  .ds-diag-mockup-doc {
    transform: none;
    max-width: 520px;
    margin: 0 auto;
  }

  .ds-diag-pourqui-grid,
  .ds-diag-livrables-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ds-diag-axes-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .ds-diag-process-steps {
    grid-template-columns: 1fr;
  }

  .ds-diag-process-arrow {
    transform: rotate(90deg);
    padding: 0;
  }
}

@media (max-width: 760px) {
  .ds-diag-hero {
    padding: 100px 20px 60px;
  }

  .ds-diag-hero-bullets {
    grid-template-columns: 1fr;
  }

  .ds-diag-pourqui-grid,
  .ds-diag-livrables-grid,
  .ds-diag-axes-grid {
    grid-template-columns: 1fr;
  }

  .ds-diag-cta-price-amount {
    font-size: 72px;
  }
}
/* ===== 7. PAGE · MISSIONS (ex ds-missions-v3) ===== */
/* ============================================
   DSTART — MISSIONS V3
   ============================================ */

.ds-missions-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 80px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  overflow: hidden;
}

.ds-missions-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-missions-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-missions-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.ds-missions-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 24px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-missions-hero-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
}

.ds-missions-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 24px;
}

.ds-missions-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-missions-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto 32px;
}

.ds-missions-hero-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

.ds-missions-hero-bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  max-width: 600px;
  margin: 0 auto;
  text-align: left;
}

.ds-missions-hero-bullets li {
  font-size: 13px;
  color: var(--ds-text-200);
  padding-left: 24px;
  position: relative;
}

.ds-missions-hero-bullets li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--ds-gold-300);
  font-weight: 700;
}

/* Section missions */
.ds-missions-section {
  padding: var(--ds-section-y) 0;
  background: var(--ds-night-300);
}

.ds-missions-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-missions-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 72px;
}

.ds-missions-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-missions-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(36px, 5vw, 60px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-missions-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-missions-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto;
}

.ds-missions-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.ds-mission-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-mission-card:hover {
  transform: translateY(-6px);
  border-color: var(--ds-border-300);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

.ds-mission-card.featured {
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.08) 0%, rgba(13, 27, 62, 0.8) 100%);
  border-color: var(--ds-border-300);
}

.ds-mission-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 4px 10px;
  background: var(--ds-orange);
  color: var(--ds-night-300);
  border-radius: var(--ds-radius-pill);
  font-weight: 700;
}

.ds-mission-number {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px var(--ds-border-300);
  line-height: 1;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-mission-card:hover .ds-mission-number {
  -webkit-text-stroke: 1px var(--ds-gold-300);
}

.ds-mission-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 900;
  color: var(--ds-text-100);
  letter-spacing: -0.01em;
}

.ds-mission-desc {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-300);
  flex: 1;
}

.ds-mission-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.ds-mission-meta span {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  padding: 4px 10px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  color: var(--ds-gold-300);
}

.ds-mission-cta {
  display: inline-block;
  padding: 10px 0;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  text-decoration: none;
  border-top: 1px solid var(--ds-border-200);
  padding-top: 16px;
  margin-top: auto;
  transition: color var(--ds-duration-fast) ease;
}

.ds
/* ===== 8. PAGE · FAQ (ex ds-faq-v3) ===== */
/* ============================================
   DSTART — FAQ V3
   ============================================ */

.ds-faq-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  text-align: center;
  overflow: hidden;
}

.ds-faq-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-faq-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-faq-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 780px;
  margin: 0 auto;
}

.ds-faq-hero-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-faq-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-faq-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-faq-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 560px;
  margin: 0 auto;
}

.ds-faq-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 60px var(--ds-page-x) 100px;
}

.ds-faq-category {
  margin-bottom: 48px;
}

.ds-faq-cat-title {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-faq-item {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  margin-bottom: 12px;
  overflow: hidden;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-faq-item[open] {
  background: rgba(201, 168, 76, 0.04);
  border-color: var(--ds-border-300);
}

.ds-faq-item summary {
  padding: 18px 24px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ds-text-100);
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: color var(--ds-duration-fast) ease;
}

.ds-faq-item summary::-webkit-details-marker {
  display: none;
}

.ds-faq-item summary::after {
  content: '+';
  font-size: 24px;
  color: var(--ds-gold-300);
  transition: transform var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-faq-item[open] summary::after {
  transform: rotate(45deg);
}

.ds-faq-item p {
  padding: 0 24px 20px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-200);
  margin: 0;
}

.ds-faq-contact {
  text-align: center;
  padding: 40px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  margin-top: 40px;
}

.ds-faq-contact h3 {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

/* Responsive */
@media (max-width: 760px) {
  .ds-faq-hero {
    padding: 100px 20px 40px;
  }

  .ds-faq-item summary {
    padding: 16px 20px;
    font-size: 14px;
  }

  .ds-faq-item p {
    padding: 0 20px 16px;
    font-size: 13px;
  }
}
/* ===== 9. PAGE · CONTACT (ex ds-contact-v3) ===== */
/* ============================================
   DSTART — CONTACT V3
   ============================================ */

.ds-contact-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  text-align: center;
  overflow: hidden;
}

.ds-contact-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-contact-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-contact-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 780px;
  margin: 0 auto;
}

.ds-contact-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 24px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-contact-hero-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
}

.ds-contact-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-contact-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-contact-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 560px;
  margin: 0 auto;
}

/* Section contact */
.ds-contact-section {
  padding: var(--ds-section-y) 0;
}

.ds-contact-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--ds-page-x);
}

.ds-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 40px;
  align-items: start;
}

/* Infos contact */
.ds-contact-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ds-contact-card {
  display: flex;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  text-decoration: none;
  color: inherit;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}

.ds-contact-card:hover {
  border-color: var(--ds-gold-300);
  background: rgba(201, 168, 76, 0.04);
}

.ds-contact-card-icon {
  font-size: 24px;
  flex-shrink: 0;
}

.ds-contact-card-content {
  flex: 1;
}

.ds-contact-card-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-text-400);
  margin-bottom: 4px;
}

.ds-contact-card-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--ds-text-100);
}

.ds-contact-card-sub {
  font-size: 12px;
  color: var(--ds-text-300);
  margin-top: 2px;
}

.ds-contact-links {
  margin-top: 24px;
  padding: 20px;
  background: rgba(201, 168, 76, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
}

.ds-contact-links-title {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 12px;
}

.ds-contact-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ds-contact-links li {
  margin-bottom: 8px;
}

.ds-contact-links a {
  font-size: 13px;
  color: var(--ds-text-200);
  text-decoration: none;
  transition: color var(--ds-duration-fast) ease;
}

.ds-contact-links a:hover {
  color: var(--ds-gold-300);
}

/* Formulaire */
.ds-contact-form {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
}

.ds-contact-form-title {
  font-family: 'Playfair Display', serif;
  font-size: 28px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-contact-form-sub {
  font-size: 13px;
  color: var(--ds-text-300);
  margin-bottom: 24px;
}

.ds-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

.ds-form-group {
  margin-bottom: 16px;
}

.ds-form-group label {
  display: block;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ds-text-300);
  margin-bottom: 6px;
}

.ds-form-group input,
.ds-form-group select,
.ds-form-group textarea {
  width: 100%;
  padding: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-sm);
  color: var(--ds-text-100);
  font-family: inherit;
  font-size: 14px;
  transition: all var(--ds-duration-fast) ease;
}

.ds-form-group input:focus,
.ds-form-group select:focus,
.ds-form-group textarea:focus {
  outline: none;
  border-color: var(--ds-gold-400);
  background: rgba(255, 255, 255, 0.06);
}

.ds-form-group textarea {
  resize: vertical;
  min-height: 120px;
}

.ds-form-check {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 12px;
  color: var(--ds-text-300);
  line-height: 1.5;
  margin-bottom: 20px;
}

.ds-form-check input {
  margin-top: 3px;
  accent-color: var(--ds-gold-400);
}

.ds-form-check a {
  color: var(--ds-gold-300);
  text-decoration: underline;
}

.ds-contact-submit {
  width: 100%;
  margin-top: 8px;
}

.ds-form-success {
  padding: 16px;
  background: rgba(74, 222, 128, 0.08);
  border: 1px solid rgba(74, 222, 128, 0.2);
  border-radius: var(--ds-radius-sm);
  color: #86EFAC;
  font-size: 14px;
  margin-top: 16px;
}

/* Responsive */
@media (max-width: 900px) {
  .ds-contact-grid {
    grid-template-columns: 1fr;
  }

  .ds-form-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ds-contact-hero {
    padding: 100px 20px 40px;
  }

  .ds-contact-form {
    padding: 24px;
  }
}
/* ===== 10. PAGES LÉGALES (ex ds-legal-v3) ===== */
/* ============================================
   DSTART — LEGAL V3
   CGV, Mentions légales, Confidentialité
   ============================================ */

.ds-legal-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  text-align: center;
  overflow: hidden;
}

.ds-legal-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-legal-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-legal-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
}

.ds-legal-hero-tag {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-legal-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-legal-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-legal-hero-version {
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--ds-text-300);
}

.ds-legal-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 60px var(--ds-page-x) 100px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 60px;
  align-items: start;
}

/* Sommaire */
.ds-legal-toc {
  position: sticky;
  top: 80px;
  background: rgba(13, 27, 62, 0.6);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 24px;
}

.ds-legal-toc h3 {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ds-border-200);
}

.ds-legal-toc ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-legal-toc a {
  font-size: 12px;
  color: var(--ds-text-300);
  text-decoration: none;
  transition: color var(--ds-duration-fast) ease;
  display: block;
  padding: 4px 0;
}

.ds-legal-toc a:hover {
  color: var(--ds-gold-300);
}

/* Contenu */
.ds-legal-content {
  max-width: 820px;
}

.ds-legal-section {
  margin-bottom: 60px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--ds-border-100);
}

.ds-legal-section:last-child {
  border-bottom: none;
}

.ds-legal-section h2 {
  font-family: 'Playfair Display', serif;
  font-size: 32px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 20px;
  letter-spacing: -0.01em;
}

.ds-legal-section h3 {
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--ds-gold-300);
  margin: 24px 0 12px;
  letter-spacing: 0.02em;
}

.ds-legal-section p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ds-text-200);
  margin-bottom: 14px;
}

.ds-legal-section ul {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ds-legal-section ul li {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-200);
  padding-left: 20px;
  position: relative;
}

.ds-legal-section ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--ds-gold-300);
}

.ds-legal-section a {
  color: var(--ds-gold-300);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ds-legal-section a:hover {
  color: var(--ds-gold-200);
}

/* Warning box */
.ds-legal-warning {
  background: rgba(249, 115, 22, 0.06);
  border: 1px solid rgba(249, 115, 22, 0.2);
  border-radius: var(--ds-radius-md);
  padding: 24px;
  margin: 24px 0;
}

.ds-legal-warning h4 {
  font-size: 14px;
  font-weight: 700;
  color: #FCA5A5;
  margin-bottom: 12px;
}

.ds-legal-warning p {
  color: var(--ds-text-200);
  font-size: 13px;
  line-height: 1.65;
  margin-bottom: 10px;
}

.ds-legal-warning strong {
  color: var(--ds-text-100);
}

/* Table */
.ds-legal-table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 13px;
}

.ds-legal-table th {
  background: rgba(201, 168, 76, 0.08);
  color: var(--ds-gold-300);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid var(--ds-border-300);
}

.ds-legal-table td {
  padding: 12px;
  border-bottom: 1px solid var(--ds-border-100);
  color: var(--ds-text-200);
  vertical-align: top;
}

.ds-legal-table tr:hover td {
  background: rgba(255, 255, 255, 0.02);
}

/* Blockquote */
.ds-legal-section blockquote {
  background: rgba(201, 168, 76, 0.04);
  border-left: 3px solid var(--ds-gold-400);
  padding: 20px 24px;
  margin: 20px 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--ds-text-200);
  font-style: italic;
  border-radius: 0 var(--ds-radius-sm) var(--ds-radius-sm) 0;
}

/* Responsive */
@media (max-width: 900px) {
  .ds-legal-inner {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .ds-legal-toc {
    position: static;
  }

  .ds-legal-table {
    display: block;
    overflow-x: auto;
  }
}
/* ===== 11. QUIZ / DIAGNOSTICS INTERACTIFS (ex ds-quiz-v3) ===== */
/* ============================================
   DSTART — QUIZ V3
   ============================================ */

.ds-quiz-hero {
  position: relative;
  padding: 120px var(--ds-page-x) 60px;
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  text-align: center;
  overflow: hidden;
}

.ds-quiz-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ds-quiz-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 168, 76, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 168, 76, 0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
}

.ds-quiz-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 820px;
  margin: 0 auto;
}

.ds-quiz-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-pill);
  margin-bottom: 24px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
}

.ds-quiz-hero-tag-dot {
  width: 6px;
  height: 6px;
  background: var(--ds-gold-300);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--ds-gold-300);
  animation: ds-pulse-dot 2.5s ease-in-out infinite;
}

.ds-quiz-hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ds-text-100);
  margin-bottom: 20px;
}

.ds-quiz-hero-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-quiz-hero-desc {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 640px;
  margin: 0 auto 32px;
}

.ds-quiz-hero-stats {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}

.ds-quiz-hero-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
}

.ds-quiz-hero-stat-value {
  font-family: 'Playfair Display', serif;
  font-size: 28px;
  font-weight: 900;
  color: var(--ds-gold-300);
  line-height: 1;
}

.ds-quiz-hero-stat-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-quiz-hero-stat-divider {
  width: 1px;
  height: 40px;
  background: var(--ds-border-200);
}

.ds-quiz-hero-legal {
  font-size: 12px;
  line-height: 1.6;
  color: var(--ds-text-400);
  max-width: 560px;
  margin: 0 auto;
}

/* Quiz wrapper */
.ds-quiz-wrap {
  max-width: 780px;
  margin: 0 auto;
  padding: 40px var(--ds-page-x) 80px;
}

.ds-quiz-progress {
  height: 4px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 12px;
}

.ds-quiz-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--ds-gold-400), var(--ds-gold-200));
  transition: width 0.5s var(--ds-ease-out);
}

.ds-quiz-progress-text {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  text-align: center;
  margin-bottom: 32px;
}

/* Étapes */
.ds-quiz-step {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 40px;
}

.ds-quiz-step-title {
  font-family: 'Playfair Display', serif;
  font-size: 28px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.ds-quiz-step-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ds-text-300);
  margin-bottom: 28px;
}

.ds-quiz-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 28px;
}

.ds-quiz-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  cursor: pointer;
  transition: all var(--ds-duration-fast) ease;
}

.ds-quiz-option:hover {
  background: rgba(201, 168, 76, 0.04);
  border-color: var(--ds-border-300);
}

.ds-quiz-option input[type="radio"] {
  accent-color: var(--ds-gold-400);
  width: 16px;
  height: 16px;
}

.ds-quiz-option input[type="radio"]:checked + span {
  color: var(--ds-gold-300);
  font-weight: 600;
}

.ds-quiz-option span {
  font-size: 14px;
  color: var(--ds-text-200);
}

.ds-quiz-row {
  margin-bottom: 24px;
}

.ds-quiz-row-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ds-gold-300);
  margin-bottom: 12px;
  letter-spacing: 0.02em;
}

.ds-quiz-nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 28px;
}

.ds-quiz-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 28px;
}

.ds-quiz-form input {
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-sm);
  color: var(--ds-text-100);
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  transition: all var(--ds-duration-fast) ease;
}

.ds-quiz-form input:focus {
  outline: none;
  border-color: var(--ds-gold-400);
  background: rgba(255, 255, 255, 0.06);
}

.ds-quiz-checkbox {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12px;
  color: var(--ds-text-300);
  line-height: 1.5;
}

.ds-quiz-checkbox input {
  margin-top: 3px;
  accent-color: var(--ds-gold-400);
}

.ds-quiz-checkbox a {
  color: var(--ds-gold-300);
  text-decoration: underline;
}

/* Résultat */
.ds-quiz-result {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.8) 0%, rgba(10, 15, 30, 0.95) 100%);
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-lg);
  padding: 48px 40px;
  text-align: center;
}

.ds-quiz-result-header {
  margin-bottom: 32px;
}

.ds-quiz-result-tag {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 20px;
}

.ds-quiz-score-circle {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 24px 40px;
  background: radial-gradient(circle, rgba(201, 168, 76, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  margin-bottom: 12px;
}

.ds-quiz-score-value {
  font-family: 'Playfair Display', serif;
  font-size: 96px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200) 0%, var(--ds-gold-400) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.04em;
}

.ds-quiz-score-max {
  font-family: 'DM Mono', monospace;
  font-size: 20px;
  color: var(--ds-text-400);
}

.ds-quiz-score-label {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ds-text-300);
}

.ds-quiz-result-breakdown {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 32px 0;
  text-align: left;
}

.ds-quiz-breakdown-item {
  display: grid;
  grid-template-columns: 120px 1fr 50px;
  gap: 12px;
  align-items: center;
}

.ds-quiz-breakdown-label {
  font-size: 12px;
  color: var(--ds-text-300);
}

.ds-quiz-breakdown-bar {
  height: 6px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 3px;
  overflow: hidden;
}

.ds-quiz-breakdown-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ds-gold-400), var(--ds-gold-200));
  border-radius: 3px;
  transition: width 1s var(--ds-ease-out);
  width: 0;
}

.ds-quiz-breakdown-value {
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  color: var(--ds-gold-300);
  text-align: right;
}

.ds-quiz-result-reco {
  background: rgba(201, 168, 76, 0.06);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-md);
  padding: 24px;
  margin: 32px 0;
}

.ds-quiz-reco-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ds-gold-300);
  margin-bottom: 8px;
}

.ds-quiz-reco-value {
  font-family: 'Playfair Display', serif;
  font-size: 24px;
  font-weight: 900;
  color: var(--ds-text-100);
  margin-bottom: 8px;
}

.ds-quiz-reco-details {
  font-size: 13px;
  line-height: 1.6;
  color: var(--ds-text-200);
}

.ds-quiz-result-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 32px 0;
}

.ds-quiz-share {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--ds-border-200);
}

.ds-quiz-share p {
  font-size: 12px;
  color: var(--ds-text-400);
  margin-bottom: 16px;
}

.ds-quiz-share-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.ds-quiz-disclaimer {
  max-width: 780px;
  margin: 0 auto;
  padding: 20px var(--ds-page-x) 60px;
  font-size: 11px;
  line-height: 1.6;
  color: var(--ds-text-400);
  text-align: center;
  font-style: italic;
}

/* Responsive */
@media (max-width: 640px) {
  .ds-quiz-step {
    padding: 28px 20px;
  }

  .ds-quiz-breakdown-item {
    grid-template-columns: 90px 1fr 40px;
  }

  .ds-quiz-score-value {
    font-size: 72px;
  }

  .ds-quiz-result {
    padding: 32px 20px;
  }

  .ds-quiz-nav {
    flex-direction: column;
  }

  .ds-quiz-nav .ds-btn-gold,
  .ds-quiz-nav .ds-btn-ghost {
    width: 100%;
  }
}
/* ===== 12. COUCHE GLOBALE — corrections & harmonisation (ex global-v4 / fix-global / global-fix / bridge / final-v5) ===== */
/* ============================================
   DSTART — GLOBAL V4
   Fond sombre global + corrections
   ============================================ */

/* === FOND SOMBRE GLOBAL === */
html, body {
  background: #0A0F1E !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

/* === SECTIONS SANS BACKGROUND → FOND SOMBRE === */
section:not([style*="background"]),
.section:not([style*="background"]),
.hero:not([style*="background"]),
.fe-hero:not([style*="background"]),
.pm-hero:not([style*="background"]),
.cgv-hero:not([style*="background"]) {
  background: linear-gradient(180deg, #0A0F1E 0%, #050A18 100%) !important;
}

/* === SECTIONS ALTERNÉES POUR L'EFFET PREMIUM === */
section:nth-of-type(even):not([style*="background"]) {
  background: linear-gradient(180deg, #050A18 0%, #0D1B3E 50%, #050A18 100%) !important;
}

/* === CARTES SANS BACKGROUND → FOND PREMIUM === */
.card,
.metier-card,
.pack-col,
.diag-card,
.mission-card,
.option-card,
.mc-card,
.qcard,
.faq-item,
.contact-card,
.contact-info,
.contact-form,
.fe-card,
.offre-card,
.reco-box,
.engagement-card,
.service-card,
.process-step,
.step-card,
.micro-card,
.index-micro-card,
.axe-card,
.pourqui-card,
.livrable-item,
.tarif-card,
.price-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%) !important;
  border: 1px solid rgba(201, 168, 76, 0.18) !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

/* === TEXTES PAR DÉFAUT === */








/* === INPUTS & FORMULAIRES === */




/* === DETAILS / FAQ === */






/* === TABLEAUX === */






/* === COUNTDOWN === */
.countdown-wrap, .cd-section, [class*="countdown"] {
  background: rgba(0, 180, 216, 0.06) !important;
  border: 1px solid rgba(0, 180, 216, 0.2) !important;
}

/* === FOOTER === */
footer, .ds-footer {
  background: linear-gradient(180deg, #0A0F1E 0%, #020408 100%) !important;
  color: rgba(255, 255, 255, 0.48) !important;
}

/* === SCROLLBAR === */








/* === SERPENTINE Z-INDEX === */


/* Tous les contenus passent AU-DESSUS de la serpentine.
   NB : nav.ds-nav volontairement EXCLU — il doit rester position:fixed
   (sa règle dédiée en fin de feuille gère son empilement). */
main,
section,
header,
footer,
.inner,
.container,
.hero-content,
.hero-ornament {
  position: relative !important;
  z-index: 4 !important;
}/* ============================================
   DSTART — FIX GLOBAL
   Corrige navbar, footer, backgrounds, serpentine
   ============================================ */

/* === BACKGROUNDS SOMBRES POUR NOUVELLES SECTIONS === */
.ds-verticaux-v3,
.ds-micro-section,
.ds-diagnostics-section,
.ds-packs-section,
.ds-copilot-section,
.ds-methode-section,
.ds-cta-section,
.ds-countdown-section {
  background: linear-gradient(180deg, var(--ds-night-200, #0A0F1E) 0%, var(--ds-night-300, #050A18) 100%) !important;
  color: var(--ds-text-100, rgba(255, 255, 255, 0.96)) !important;
}

/* === FOOTER SIGNATURE — STYLES MANQUANTS === */
.ds-footer-signature {
  position: relative;
  background: linear-gradient(180deg, var(--ds-night-200, #0A0F1E) 0%, var(--ds-night-300, #050A18) 100%) !important;
  color: var(--ds-text-200, rgba(255, 255, 255, 0.72)) !important;
  padding-top: 0 !important;
  margin-top: 128px !important;
  overflow: hidden !important;
}

.ds-footer-gold-line {
  height: 1px !important;
  background: linear-gradient(90deg, 
    transparent 0%, 
    var(--ds-gold-400, #C9A84C) 20%, 
    var(--ds-gold-300, #E8CC7A) 50%, 
    var(--ds-gold-400, #C9A84C) 80%, 
    transparent 100%
  ) !important;
  opacity: 0.6 !important;
  margin-bottom: 64px !important;
}

.ds-footer-inner {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 64px 40px !important;
  display: grid !important;
  grid-template-columns: 1.6fr 1fr 1fr 1.1fr !important;
  gap: clamp(20px, 2.5vw, 40px) !important;
}

.ds-footer-brand-col {
  padding-right: 32px !important;
}

.ds-footer-logo {
  display: inline-block !important;
  margin-bottom: 24px !important;
  transition: all 0.32s ease !important;
  text-decoration: none !important;
  font-family: 'Playfair Display', serif !important;
  font-weight: 900 !important;
  font-size: 22px !important;
}

.ds-footer-logo:hover {
  transform: translateY(-2px) !important;
  filter: drop-shadow(0 8px 20px rgba(232, 204, 122, 0.3)) !important;
}

.ds-brand-ds {
  background: linear-gradient(135deg, #F8E7A7, #C9A84C) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  margin-right: 6px !important;
}

.ds-brand-advisory {
  color: rgba(255, 255, 255, 0.96) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
}

.ds-footer-tagline {
  font-size: 13px !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.48) !important;
  margin-bottom: 24px !important;
  font-style: italic !important;
}

.ds-footer-social {
  display: flex !important;
  gap: 8px !important;
}

.ds-footer-social a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(201, 168, 76, 0.18) !important;
  border-radius: 50% !important;
  color: rgba(255, 255, 255, 0.48) !important;
  transition: all 0.32s ease !important;
  text-decoration: none !important;
}

.ds-footer-social a:hover {
  background: rgba(201, 168, 76, 0.12) !important;
  border-color: var(--ds-gold-400, #C9A84C) !important;
  color: var(--ds-gold-300, #E8CC7A) !important;
  transform: translateY(-2px) !important;
}

.ds-footer-col {
  display: flex !important;
  flex-direction: column !important;
}

.ds-footer-title {
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--ds-gold-300, #E8CC7A) !important;
  margin-bottom: 24px !important;
  position: relative !important;
  padding-bottom: 8px !important;
}

.ds-footer-title::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 24px !important;
  height: 1px !important;
  background: var(--ds-gold-400, #C9A84C) !important;
  opacity: 0.5 !important;
}

.ds-footer-links {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ds-footer-links li {
  margin-bottom: 10px !important;
}

.ds-footer-links a {
  font-size: 13px !important;
  color: rgba(255, 255, 255, 0.48) !important;
  text-decoration: none !important;
  transition: color 0.18s ease !important;
}

.ds-footer-links a:hover {
  color: var(--ds-gold-300, #E8CC7A) !important;
}

.ds-footer-legal-band {
  background: var(--ds-night-400, #020408) !important;
  border-top: 1px solid rgba(201, 168, 76, 0.08) !important;
  padding: 32px 0 !important;
}

.ds-footer-legal-inner {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 64px !important;
  text-align: center !important;
}

.ds-footer-legal-text {
  font-size: 11px !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, 0.28) !important;
  max-width: 900px !important;
  margin: 0 auto 16px !important;
}

.ds-footer-legal-links {
  display: flex !important;
  justify-content: center !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
}

.ds-footer-legal-links a {
  font-size: 11px !important;
  color: rgba(255, 255, 255, 0.48) !important;
  text-decoration: none !important;
  transition: color 0.18s ease !important;
}

.ds-footer-legal-links a:hover {
  color: var(--ds-gold-300, #E8CC7A) !important;
}

.ds-footer-sep {
  color: rgba(255, 255, 255, 0.14) !important;
}

.ds-footer-copyright {
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.08em !important;
  color: rgba(255, 255, 255, 0.14) !important;
  margin: 0 !important;
}

/* === RESPONSIVE FOOTER === */
@media (max-width: 980px) {
  .ds-footer-inner {
    grid-template-columns: 1fr 1fr !important;
    gap: 48px !important;
    padding: 0 32px 48px !important;
  }
  
  .ds-footer-brand-col {
    grid-column: 1 / -1 !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 600px) {
  .ds-footer-inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    padding: 0 20px 32px !important;
  }
  
  .ds-footer-signature {
    padding: 40px 0 0 !important;
  }
  
  .ds-footer-legal-inner {
    padding: 0 20px !important;
  }
}

/* === NAVBAR FIX === */
nav.ds-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 950 !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 0 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: rgba(10, 15, 30, 0.97) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(201, 168, 76, 0.12) !important;
}



@media (max-width: 860px) {
  nav.ds-nav {
    padding: 10px 20px !important;
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 58px !important;
  }
  

}

/* === SERPENTINE Z-INDEX FIX === */
.ds-serpentine-layer {
  z-index: 2 !important;
  pointer-events: none !important;
}

/* Tous les contenus passent au-dessus de la serpentine */
nav.ds-nav,
main,
section,
header,
footer,
.inner,
.container,
.hero-content,
.hero-ornament,
.ds-verticaux-v3,
.ds-micro-section,
.ds-diagnostics-section,
.ds-packs-section,
.ds-copilot-section,
.ds-methode-section,
.ds-cta-section,
.ds-countdown-section,
.ds-footer-signature {
  position: relative !important;
  z-index: 4 !important;
}/* ============================================
   DSTART — GLOBAL FIX
   Corrige tous les fonds blancs + navbar + footer
   ============================================ */

/* === 1. BODY & PAGE BACKGROUND === */
html, body {
  background: #0A0F1E !important;
  color: rgba(255, 255, 255, 0.72) !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 100vh !important;
}

/* === 2. TOUTES LES SECTIONS EN SOMBRE === */
section,
.section,
.hero,
.fe-hero,
.pm-hero,
.cgv-hero,
.hero-section,
.countdown-section,
.countdown-wrap,
.cd-section,
.metiers-section,
.packs-section,
.packs-grid-section,
.micro-section,
.micro-zone,
.index-micro-zone,
.diag-section,
.diagnostic-section,
.copilot-section,
.methode-section,
.method-section,
.cta-section,
.cta-band,
.test-section,
.quiz-section,
.faq-section,
.contact-section,
.services-section,
.engagements-section,
.process-section,
.offres-section,
.calendar-section,
.tarifs-section,
.tarifs-hero,
.fe-section,
.fe-band,
.missions-section,
.footer-section,
[class*="section"],
[class*="hero"],
[class*="zone"],
[class*="band"] {
  background: transparent !important;
}

/* Sections spécifiques avec gradient */
section:nth-child(odd),
.section:nth-child(odd) {
  background: linear-gradient(180deg, #0A0F1E 0%, #050A18 100%) !important;
}

section:nth-child(even),
.section:nth-child(even) {
  background: linear-gradient(180deg, #050A18 0%, #0D1B3E 50%, #050A18 100%) !important;
}

/* === 3. CARTES & COMPOSANTS === */
.card,
.metier-card,
.pack-col,
.diag-card,
.mission-card,
.option-card,
.mc-card,
.qcard,
.faq-item,
.contact-card,
.contact-info,
.contact-form,
.fe-card,
.offre-card,
.reco-box,
.engagement-card,
.service-card,
.process-step,
.step-card,
.micro-card,
.index-micro-card,
.axe-card,
.pourqui-card,
.livrable-item,
/* CORRECTION : l'ancien [class*="card"], [class*="col"] appliquait fond +
   bordure dorée à TOUT élément contenant « card » ou « col » dans sa classe
   — y compris les sous-éléments (ds-vertical-card-title, -icon, -number,
   ds-mockup-card, ds-footer-col…), créant des rectangles parasites derrière
   les éléments. Remplacé par la liste explicite des VRAIES cartes (qui ont
   par ailleurs déjà leur propre style dans les sections composants). */
.ds-vertical-card,
.ds-micro-card,
.ds-pack-card,
.ds-mission-card,
.ds-contact-card,
.ds-diag-card,
.ds-diag-axe-card,
.ds-diag-pourqui-card,
.ds-tarifs-pack-card,
.ds-tarifs-option-card,
.ds-tarifs-micro-card,
.ds-tarifs-fe-card,
.ds-fe-service-card,
.ds-fe-engagement-card,
.ds-fe-offre-card,
.ds-fe-contact-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%) !important;
  border: 1px solid rgba(201, 168, 76, 0.18) !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

/* === 4. NAVBAR === */
nav,
nav.ds-nav,
.navbar,
.topnav,
nav.ds-nav, header.ds-nav {
  background: rgba(10, 15, 30, 0.97) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(201, 168, 76, 0.12) !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 950 !important;
}



/* === 5. FOOTER ===
   NB : sélecteur restreint au conteneur <footer> uniquement.
   L'ancien [class*="footer"] attrapait tout élément contenant « footer »
   dans sa classe (dont ds-footer-logo-img), créant un fond rectangulaire
   indésirable derrière le logo transparent. */
footer,
footer.ds-footer,
footer.ds-footer-signature,
.site-footer {
  background: linear-gradient(180deg, #0A0F1E 0%, #020408 100%) !important;
  color: rgba(255, 255, 255, 0.48) !important;
}

/* Footer legal band */
.footer-legal,
.ds-footer-legal,
.ds-footer-legal-band,
.footer-copy,
/* CORRECTION : restreint aux bandeaux légaux réels (l'ancien [class*="legal"]
   collait un fond noir + bordure à tout sous-élément contenant « legal »,
   ex. ds-legal-hero-tag, ds-legal-content → rectangles parasites). */
.ds-footer-legal-band,
.ds-footer-legal,
.footer-legal {
  background: #020408 !important;
  border-top: 1px solid rgba(201, 168, 76, 0.08) !important;
}

/* === 6. TEXTES === */
h1, h2, h3, h4, h5, h6 {
  color: rgba(255, 255, 255, 0.96) !important;
}

p, li, span, label, td, th {
  color: rgba(255, 255, 255, 0.72) !important;
}

a {
  color: #E8CC7A !important;
}

a:hover {
  color: #F8E7A7 !important;
}

/* === 7. INPUTS & FORMULAIRES === */
input, select, textarea {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(201, 168, 76, 0.18) !important;
  color: rgba(255, 255, 255, 0.96) !important;
  border-radius: 8px !important;
  padding: 12px !important;
}

input:focus, select:focus, textarea:focus {
  border-color: #C9A84C !important;
  outline: none !important;
}

/* === 8. TABLEAUX === */
table {
  background: rgba(13, 27, 62, 0.4) !important;
  border: 1px solid rgba(201, 168, 76, 0.12) !important;
}

th {
  background: rgba(201, 168, 76, 0.08) !important;
  color: #E8CC7A !important;
}

td {
  border-bottom: 1px solid rgba(201, 168, 76, 0.06) !important;
}

/* === 9. BOUTONS === */
.btn-gold, .btn-primary, .btn-pack, .btn-cta,
[class*="btn-primary"], [class*="btn-gold"] {
  background: linear-gradient(135deg, #C9A84C 0%, #E8CC7A 100%) !important;
  color: #050A18 !important;
  border: none !important;
}

.btn-ghost, .btn-ghost-light,
[class*="btn-ghost"] {
  background: transparent !important;
  border: 1px solid rgba(201, 168, 76, 0.32) !important;
  color: rgba(255, 255, 255, 0.96) !important;
}

/* === 10. DETAILS / FAQ === */
details, .faq-item {
  background: rgba(13, 27, 62, 0.4) !important;
  border: 1px solid rgba(201, 168, 76, 0.12) !important;
}

details[open] {
  background: rgba(201, 168, 76, 0.04) !important;
  border-color: rgba(201, 168, 76, 0.32) !important;
}

summary {
  color: rgba(255, 255, 255, 0.96) !important;
}

/* === 11. COUNTDOWN === */


/* === 12. MODALS === */
.modal-overlay, .micro-modal-overlay, [class*="modal-overlay"] {
  background: rgba(0, 0, 0, 0.72) !important;
}

.modal-box, .micro-modal-box, [class*="modal-box"] {
  background: #0A0F1E !important;
  border: 1px solid rgba(201, 168, 76, 0.25) !important;
}

/* === 13. GRIDS BACKGROUND === */
.inner, .container {
  background: transparent !important;
}

/* === 14. SCROLLBAR === */






/* ============================================
   DSTART — BRIDGE CSS
   Fait le lien entre anciennes et nouvelles classes
   ============================================ */

/* Variables globales (si pas déjà dans ds-premium-tokens.css) */
:root {
  --ds-gold-100: #FFF8E1;
  --ds-gold-200: #F8E7A7;
  --ds-gold-300: #E8CC7A;
  --ds-gold-400: #C9A84C;
  --ds-gold-500: #A88938;
  
  --ds-night-50:  #1A2547;
  --ds-night-100: #0D1B3E;
  --ds-night-200: #0A0F1E;
  --ds-night-300: #050A18;
  --ds-night-400: #020408;
  
  --ds-cyan: #00B4D8;
  --ds-green: #4ADE80;
  --ds-orange: #F97316;
  --ds-red: #EF4444;
  
  --ds-text-100: rgba(255, 255, 255, 0.96);
  --ds-text-200: rgba(255, 255, 255, 0.72);
  --ds-text-300: rgba(255, 255, 255, 0.48);
  --ds-text-400: rgba(255,255,255,.52);
  
  --ds-border-100: rgba(201, 168, 76, 0.08);
  --ds-border-200: rgba(201, 168, 76, 0.18);
  --ds-border-300: rgba(201, 168, 76, 0.32);
  
  --ds-radius-sm: 8px;
  --ds-radius-md: 14px;
  --ds-radius-lg: 20px;
  --ds-radius-pill: 999px;
  
  --ds-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ds-duration-normal: 320ms;
  
  --ds-page-x: clamp(20px, 4.4vw, 64px);
  --ds-section-y: clamp(72px, 8vw, 128px);
}

/* === MAPPING DES CLASSES === */

/* Hero */
.hero { position: relative; }
.hero-content { max-width: 720px; }
.hero h1 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 6.8vw, 88px);
  font-weight: 900;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ds-text-100);
  margin-bottom: 28px;
}
.hero-desc {
  font-size: 18px;
  line-height: 1.65;
  color: var(--ds-text-200);
  max-width: 580px;
  margin-bottom: 36px;
}
.hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}

/* Boutons */
.btn-gold, .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: linear-gradient(135deg, var(--ds-gold-400) 0%, var(--ds-gold-300) 100%);
  color: var(--ds-night-300);
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: none;
  border-radius: var(--ds-radius-pill);
  cursor: pointer;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}
.btn-gold:hover, .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(201, 168, 76, 0.42);
}

.btn-ghost, .btn-ghost-light {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 32px;
  background: transparent;
  color: var(--ds-text-100);
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: 1px solid var(--ds-border-300);
  border-radius: var(--ds-radius-pill);
  cursor: pointer;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
  text-decoration: none;
}
.btn-ghost:hover, .btn-ghost-light:hover {
  background: rgba(201, 168, 76, 0.08);
  border-color: var(--ds-gold-300);
  color: var(--ds-gold-300);
  transform: translateY(-2px);
}

/* Cartes verticaux */
.metier-card {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}
.metier-card:hover {
  transform: translateY(-8px);
  border-color: var(--ds-border-300);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
}

/* Packs */
.pack-col {
  position: relative;
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}
.pack-col:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

/* Diagnostics */
.diag-card {
  background: linear-gradient(135deg, rgba(13, 27, 62, 0.6) 0%, rgba(10, 15, 30, 0.8) 100%);
  border: 1px solid var(--ds-border-200);
  border-radius: var(--ds-radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all var(--ds-duration-normal) var(--ds-ease-out);
}
.diag-card:hover {
  transform: translateY(-4px);
  border-color: var(--ds-border-300);
}

/* Footer */
footer.ds-footer {
  background: linear-gradient(180deg, var(--ds-night-200) 0%, var(--ds-night-300) 100%);
  padding: 60px var(--ds-page-x) 40px;
}
.footer-brand {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 22px;
  color: var(--ds-text-100);
  margin-bottom: 16px;
}/* ============================================
   DSTART — FINAL V5
   Fusion de tous les CSS + fond sombre global
   ============================================ */

/* === VARIABLES GLOBALES === */
:root{
--ds-page-x: clamp(20px, 4.4vw, 64px);
--ds-section-y: clamp(64px, 7vw, 112px);
--ds-card-radius: 16px;
--ds-card-radius-sm: 12px;
--ds-grid-gap: clamp(16px, 2vw, 28px);
--ds-soft-shadow: 0 22px 70px rgba(10,15,30,.12);
--ds-dark-shadow: 0 24px 80px rgba(0,0,0,.28);
}

/* === FOND SOMBRE GLOBAL === */
html {
  background: #0A0F1E;
}

body {
  background: #0A0F1E;
  color: rgba(255, 255, 255, 0.72);
  max-width: 100%;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video, canvas {
  max-width: 100%;
  height: auto;
}

a, button {
  touch-action: manipulation;
}

*, ::before, *::after {
  min-width: 0;
}

/* === SECTIONS SANS BACKGROUND → FOND SOMBRE === */
section:not([style*="background"]):not(.hero):not(.fe-hero):not(.pm-hero):not(.cgv-hero) {
  background: linear-gradient(180deg, #0A0F1E 0%, #050A18 100%);
}

/* === HERO EXISTANTS === */
.hero, .fe-hero, .pm-hero, .cgv-hero {
  background: linear-gradient(180deg, #0A0F1E 0%, #050A18 100%) !important;
}

/* === FOOTER === */
footer, .ds-footer {
  background: linear-gradient(180deg, #0A0F1E 0%, #020408 100%);
  color: rgba(255, 255, 255, 0.48);
}

/* === TEXTES GLOBAUX === */
h1, h2, h3, h4, h5, h6 {
  color: rgba(255, 255, 255, 0.96);
}

p, li, span, label, td, th {
  color: rgba(255, 255, 255, 0.72);
}

a {
  color: #E8CC7A;
}

a:hover {
  color: #F8E7A7;
}

/* === INPUTS & FORMULAIRES === */
input, select, textarea {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(201, 168, 76, 0.18);
  color: rgba(255, 255, 255, 0.96);
  border-radius: 8px;
  padding: 12px;
}

input:focus, select:focus, textarea:focus {
  border-color: #C9A84C;
  outline: none;
}

/* === SCROLLBAR === */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #0A0F1E;
}

::-webkit-scrollbar-thumb {
  background: rgba(201, 168, 76, 0.3);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(201, 168, 76, 0.5);
}

/* === NAVBAR === */
nav.ds-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 950 !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 0 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: rgba(10, 15, 30, 0.97) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(0, 180, 216, 0.15) !important;
}



body.page-home .hero,
body.page-inner .hero,
body.page-inner .fe-hero,
body.page-inner .pm-hero,
body.page-inner .cgv-hero {
  margin-top: -58px !important;
}

@media (max-width: 860px) {
  nav.ds-nav {
    height: auto !important;
    min-height: 58px !important;
    flex-wrap: wrap !important;
    padding: 10px 20px !important;
  }
  body {
    padding-top: 64px !important;
  }
}

.ds-nav-brand {
  line-height: 1 !important;
}

.ds-nav-links {
  min-width: 0 !important;
}

.ds-nav-links a:empty,
.ds-nav-links a[href=""],
.ds-nav-links a:not([href]) {
  display: none !important;
  width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
}

.ds-nav-links a {
  line-height: 1.2 !important;
  text-align: center !important;
}

.ds-nav-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  line-height: 1.1 !important;
}

@media (max-width: 1180px) {
  .ds-nav-links a {
    font-size: 8.8px !important;
    padding: 5px 6px !important;
  }
  .ds-nav-cta {
    font-size: 8.8px !important;
    padding: 8px 12px !important;
  }
}

@media (max-width: 860px) {
  nav.ds-nav {
    position: sticky !important;
    top: 0 !important;
  }
  .ds-nav-links.open {
    max-height: 70vh !important;
    overflow: auto !important;
  }
  .ds-nav-links a {
    font-size: 10px !important;
    padding: 11px 16px !important;
  }
}

/* === SERPENTINE === */
.ds-serpentine-layer {
  position: fixed !important;
  z-index: 2 !important;
  pointer-events: none !important;
  height: 100vh !important;
  overflow: hidden !important;
}

.ds-serpentine-track {
  pointer-events: none !important;
}

.ds-serpentine-trail-soft {
  opacity: .10 !important;
}

.ds-serpentine-trail {
  opacity: .88 !important;
  stroke-width: 2.25 !important;
}

.ds-serpentine-orn {
  opacity: 0 !important;
  mix-blend-mode: screen !important;
}

.ds-serpentine-orn.is-visible {
  opacity: .07 !important;
}

.ds-serpentine-orn.is-lit {
  opacity: .12 !important;
}

/* Tous les contenus passent AU-DESSUS de la serpentine */
.hero-content, .hero-ornament, .hero-tag, .hero-desc, .hero-actions, .hero-stats,
.inner, .container, .quiz-wrap, .qcard, .result-card,
.card, .metier-card, .diag-card, .pack-col, .price-card, .tarif-card, .offre-card,
.mc-card, .option-card, .process-step, .mission-card, .faq-item, .contact-grid, .contact-info, .contact-form,
.countdown-wrap, .cd-section > *, .fe-band > *, .footer-links, .footer-brand, .footer-copy, .ds-footer > *,
.modal-box {
  position: relative !important;
  z-index: 4 !important;
}

/* === LARGEUR ET RESPIRATION === */
.inner, .container, .cgv-wrap, .quiz-wrap {
  max-width: 1280px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--ds-page-x) !important;
  padding-right: var(--ds-page-x) !important;
}

.metiers-header, .packs-header, .section-head, .hero, .fe-band {
  padding-left: var(--ds-page-x) !important;
  padding-right: var(--ds-page-x) !important;
}

section {
  scroll-margin-top: 96px;
}

/* === TITRES === */
h1, h2, h3, .stitle, .section-title, .metiers-section-title, .hero h1, .pack-name, .diag-title, .mission-title {
  text-wrap: balance;
  overflow-wrap: normal;
  hyphens: none;
}

p, .ssub, .section-sub, .hero-desc, .metier-desc, .diag-desc, .pack-tagline, .pack-sub, .mission-desc, li {
  overflow-wrap: break-word;
}

/* === EN-TÊTES DE SECTIONS === */
.section-head, .packs-header, .metiers-header {
  gap: clamp(20px, 3vw, 44px) !important;
  margin-bottom: clamp(38px, 5vw, 72px) !important;
}

.section-sub, .ssub {
  max-width: 720px;
}

.metiers-header, .packs-header {
  align-items: flex-end !important;
}

@media (max-width: 860px) {
  .metiers-header, .packs-header, .section-head {
    display: block !important;
    text-align: left !important;
  }
  .section-sub, .ssub {
    max-width: 100%;
  }
}

/* === GRILLES === */
.pack-grid, .packs-grid, .options-grid, .offres-grid, .diag-grid, .metiers-grid, .missions-grid, .tarifs-grid, .faq-grid, .features-grid, .axes-grid, .pourqui-grid, .steps-grid, .apercu-grid, .fe-cards, .grid2, .grid3, .grid4, .contact-grid, .form-grid, .process-steps, .hero-stats, .mc-grid, .cards-grid, .stat-grid {
  gap: var(--ds-grid-gap) !important;
  align-items: stretch !important;
}

.packs-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
  border-left: 0 !important;
}

.pack-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)) !important;
}

.metiers-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)) !important;
  border: 0 !important;
}

.diag-grid, .contact-grid, .mission-detail, .livrable-intro, .apercu-grid, .pourqui-grid, .faq-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)) !important;
}

.axes-grid, .steps-grid, .grid4 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
}

.grid3, .missions-grid, .tarifs-grid, .options-grid, .fe-cards {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
}

.grid2, .form-grid, .cta-feats, .modal-grid, .modal-ba, .modal-kpis {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)) !important;
}

/* === CARTES === */
/* === CARTES === (liste explicite — voir correction rectangles parasites) */
.pack-col, .diag-card, .metier-card, .mission-card, .option-card, .mc-card, .faq-item, .qcard, .cgv-section, .contact-info, .contact-form, .fe-card, .cards-grid > *, .stat-grid > *,
.ds-vertical-card, .ds-micro-card, .ds-pack-card, .ds-mission-card, .ds-contact-card, .ds-diag-card, .ds-diag-axe-card, .ds-diag-pourqui-card, .ds-tarifs-pack-card, .ds-tarifs-option-card, .ds-tarifs-micro-card, .ds-tarifs-fe-card, .ds-fe-service-card, .ds-fe-engagement-card, .ds-fe-offre-card, .ds-fe-contact-card {
  min-width: 0 !important;
  height: auto;
  overflow: hidden;
  isolation: isolate;
}

.pack-col, .diag-card, .mission-card, .option-card, .mc-card, .qcard, .cgv-section, .contact-info, .contact-form, .fe-card {
  border-radius: var(--ds-card-radius) !important;
  box-shadow: var(--ds-soft-shadow);
}

.pack-col, .diag-card, .mission-card, .option-card, .mc-card, .fe-card {
  display: flex !important;
  flex-direction: column !important;
}

.pack-col {
  width: auto !important;
  flex: initial !important;
  border-right: 1px solid rgba(255, 255, 255, .08) !important;
}

.pack-col .btn-pack, .pack-col .pack-cta, .diag-card .btn-diag, .mission-card .btn, .option-card .btn, .mc-card .btn {
  margin-top: auto;
}

.metier-card, .diag-card:not(.featured), .qcard, .cgv-section, .contact-form, .contact-info {
  background-clip: padding-box;
}

.packs-section .pack-col, .pack-grid .pack-col, .tarifs-grid > *, .mission-card, .option-card, .fe-card {
  box-shadow: var(--ds-dark-shadow);
}

.metier-card {
  border: 1px solid rgba(10, 15, 30, .08) !important;
  border-radius: var(--ds-card-radius-sm) !important;
}

.metier-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 65px rgba(10, 15, 30, .13);
}

/* === PRIX === */
.price-ht, .amount, .offre-price .amount {
  white-space: nowrap !important;
  line-height: .95 !important;
}

.price-suffix, .suffix, .offre-price .suffix {
  white-space: nowrap !important;
}

.price-ttc, .offre-ttc, .pack-tax, .ttc-line {
  display: block !important;
  margin-top: 7px !important;
  line-height: 1.35 !important;
  word-break: normal !important;
}

.pack-col, .offre-card, .tarif-card, .price-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

.pack-col .btn-pack, .pack-col .pack-cta, .offre-card .offre-cta {
  width: 100% !important;
  text-align: center !important;
}

@media (max-width: 430px) {
  .price-ht, .amount, .offre-price .amount {
    font-size: clamp(34px, 12vw, 48px) !important;
  }
  .price-suffix, .suffix, .offre-price .suffix {
    font-size: 14px !important;
  }
}

.pack-price-area, .hero-price-block, .cta-price-display, .ds-invest-price, .form-price-card {
  max-width: 100%;
}

.pack-price-area, .pack-price-ht, .pack-price, .price-main, .cta-price-n, .ds-invest-ht, .option-price, .diag-price {
  text-wrap: balance;
  overflow-wrap: normal !important;
}

.pack-price-ht, .pack-price, .price-main, .cta-price-n, .ds-invest-ht, .diag-price, .option-price {
  letter-spacing: -.035em;
}

.pack-price-sub, .pack-price-ttc, .pack-setup, .price-detail, .cta-price-s, .ds-invest-ttc, .ds-invest-note, .diag-price-note, .form-price-note {
  max-width: 100%;
  text-wrap: pretty;
}

/* === BOUTONS === */
.hero-actions, .hero-cta-row, .cta-row, .form-actions, .nav-actions {
  display: flex;
  flex-wrap: wrap !important;
  gap: clamp(12px, 1.6vw, 18px) !important;
}

.btn-primary, .btn-ghost-light, .btn-pack, .pack-cta, .btn-reco, .btn-fe, .btn-diag, button {
  white-space: normal !important;
  text-align: center;
  line-height: 1.25 !important;
}

/* === TABLEAUX === */
table {
  max-width: 100%;
  border-collapse: collapse;
}

th, td {
  vertical-align: top;
  overflow-wrap: break-word;
}

@media (max-width: 760px) {
  table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  thead, tbody, tr {
    min-width: 620px;
  }
}

/* === MODALES === */
.modal-overlay {
  padding: 18px !important;
}

.modal-box {
  border-radius: 14px !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .45) !important;
}

.modal-close {
  position: sticky !important;
  top: 10px !important;
  margin-left: auto !important;
  z-index: 6 !important;
}

.modal-foot {
  gap: 14px !important;
}

.modal-btns {
  flex-wrap: wrap !important;
}

.modal-btn1, .modal-btn2 {
  min-height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 640px) {
  .modal-overlay {
    align-items: flex-end !important;
    padding: 10px !important;
  }
  .modal-box {
    max-height: 92vh !important;
    border-radius: 16px 16px 0 0 !important;
  }
  .modal-body {
    padding: 22px !important;
  }
  .modal-btns, .modal-btn1, .modal-btn2 {
    width: 100% !important;
  }
  .modal-foot {
    align-items: stretch !important;
  }
}

/* === QUESTIONNAIRES === */
.qcard {
  border-radius: 14px !important;
}

.q-nav {
  gap: 14px !important;
}

.q-btns {
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
}

.btn-prev, .btn-next, .btn-final {
  min-height: 42px !important;
  border-radius: 999px !important;
}

.ropt {
  border-radius: 12px !important;
}

@media (max-width: 640px) {
  .q-nav {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .q-btns {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  .btn-prev, .btn-next, .btn-final {
    width: 100% !important;
  }
  .qcard {
    padding: 24px 18px !important;
  }
}

/* === FOOTER === */
footer.ds-footer {
  gap: 18px !important;
  align-items: flex-start !important;
}

.ds-footer-legal {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 10px auto 0 !important;
  font-size: 10.5px !important;
  line-height: 1.7 !important;
  color: rgba(255, 255, 255, .28) !important;
  border-top: 1px solid rgba(255, 255, 255, .06) !important;
  padding-top: 14px !important;
}

/* === PAGES INTÉRIEURES === */
body.page-inner .hero,
body.page-inner .fe-hero,
body.page-inner .pm-hero,
body.page-inner .cgv-hero {
  min-height: auto !important;
  padding-top: 88px !important;
  padding-bottom: 34px !important;
}

body.page-inner .section,
body.page-inner #fe-merge > section,
body.page-inner .metiers-section {
  padding-top: 52px !important;
  padding-bottom: 52px !important;
}

body.page-inner .quiz-wrap {
  padding-top: 26px !important;
  padding-bottom: 58px !important;
}

/* === ACCUEIL HERO === */
body.page-home .hero {
  min-height: calc(100vh - 58px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.02fr) minmax(380px, .98fr) !important;
  align-items: end !important;
  gap: 44px !important;
  padding: 108px 56px 70px !important;
}

body.page-home .hero-bg,
body.page-home .hero-lines {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  position: absolute !important;
}

body.page-home .hero-content {
  grid-column: 1 !important;
  grid-row: 1 !important;
  max-width: 720px !important;
  min-width: 0 !important;
  align-self: end !important;
}

body.page-home .hero-ornament {
  grid-column: 2 !important;
  grid-row: 1 !important;
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  border-left: 0 !important;
  background: transparent !important;
  align-self: end !important;
}

body.page-home .hero-ornament > div {
  max-width: 520px !important;
  width: 100% !important;
  margin-left: auto !important;
}

body.page-home .hero h1 {
  margin-bottom: 22px !important;
}

body.page-home .hero-desc {
  max-width: 650px !important;
  margin-bottom: 28px !important;
}

body.page-home .hero-actions {
  margin-bottom: 18px !important;
}

body.page-home .hero-stats {
  margin-top: 22px !important;
}

@media (max-width: 980px) {
  body.page-home .hero {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
    padding: 104px 20px 54px !important;
    gap: 30px !important;
  }
  body.page-home .hero-content,
  body.page-home .hero-ornament {
    grid-column: 1 !important;
  }
  body.page-home .hero-content {
    grid-row: 1 !important;
  }
  body.page-home .hero-ornament {
    grid-row: 2 !important;
  }
  body.page-home .hero-ornament > div {
    margin: 0 auto !important;
  }
}

/* === MOBILE GLOBAL === */
@media (max-width: 760px) {

  .inner, .container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .grid2, .grid3, .grid4, .offres-grid, .metiers-grid {
    grid-template-columns: 1fr !important;
  }
  .btn, .btn-primary, .btn-ghost-light, .btn-gold, .btn-ghost, .btn-cyan {
    width: 100% !important;
    text-align: center !important;
  }
}

/* === TRANSITIONS === */
.pack-col, .diag-card, .mission-card, .option-card, .mc-card, .fe-card, .qcard, .contact-form, .contact-info {
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
}

.pack-col:hover, .diag-card:hover, .mission-card:hover, .option-card:hover, .mc-card:hover, .fe-card:hover, .qcard:hover {
  transform: translateY(-3px);
}
/* ===== 13. SERPENTINE DORÉE (fil conducteur défilant — logique V24B portée) ===== */
body.ds-serpentine-active{position:relative}
.ds-serpentine-layer{position:fixed;inset:0;width:100%;height:100vh;pointer-events:none;z-index:0;overflow:hidden}
.ds-serpentine-track{position:absolute;left:0;top:0;width:100%;will-change:transform}
.ds-serpentine-svg{position:absolute;inset:0 auto auto 0;width:100%;overflow:visible}
.ds-serpentine-svg path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ds-serpentine-trail-soft{stroke:url(#dsSerpSoft);stroke-width:13;filter:blur(8px);opacity:.14}
.ds-serpentine-trail{stroke:url(#dsSerpGold);stroke-width:2.5;filter:drop-shadow(0 0 8px rgba(232,204,122,.72));opacity:.96}
.ds-serpentine-head{fill:#F8E7A7;filter:drop-shadow(0 0 15px rgba(232,204,122,.95))}
.ds-serpentine-head-ring{fill:none;stroke:rgba(248,231,167,.42);stroke-width:1.1}
.ds-serpentine-orn{position:absolute;width:150px;height:150px;opacity:0;transform:translateY(18px) rotate(var(--r,0deg)) scale(.96);transition:opacity .9s ease,transform 1.1s ease;filter:drop-shadow(0 18px 38px rgba(0,0,0,.35))}
.ds-serpentine-orn.is-visible{opacity:.14;transform:translateY(0) rotate(var(--r,0deg)) scale(1)}
.ds-serpentine-orn.is-lit{opacity:.26}
.ds-serpentine-orn svg{width:100%;height:100%}
#ds-logo-footer.ds-serpentine-arrived,.ds-footer-logo.ds-serpentine-arrived{filter:drop-shadow(0 0 26px rgba(232,204,122,.45));transition:filter .8s ease}
@media (max-width: 760px){.ds-serpentine-layer{display:none!important}}

/* ===== 14. SECTION ANCRAGE RÉUNIONNAIS (page missions — carte Réunion dorée) ===== */
.ds-ancrage-section{position:relative;padding:var(--ds-section-y) var(--ds-page-x);background:linear-gradient(180deg,var(--ds-night-300) 0%,var(--ds-night-200) 100%);overflow:hidden}
.ds-ancrage-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,90px);align-items:center}
.ds-ancrage-content{position:relative;z-index:2}
.ds-ancrage-tag{display:inline-flex;align-items:center;gap:8px;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ds-gold-300);padding:6px 14px;border:1px solid var(--ds-border-200);border-radius:var(--ds-radius-pill);margin-bottom:24px}
.ds-ancrage-tag::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--ds-gold-300);box-shadow:0 0 10px var(--ds-gold-300)}
.ds-ancrage-title{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(30px,4vw,46px);line-height:1.08;letter-spacing:-.02em;color:var(--ds-text-100);margin-bottom:22px}
.ds-ancrage-title em{font-style:italic;background:linear-gradient(135deg,#F8E7A7,#C9A84C);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ds-ancrage-desc{font-size:16px;line-height:1.7;color:var(--ds-text-200);margin-bottom:20px;max-width:46ch}
.ds-ancrage-points{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.ds-ancrage-points li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.55;color:var(--ds-text-200)}
.ds-ancrage-points li svg{flex:0 0 auto;width:20px;height:20px;margin-top:1px;color:var(--ds-gold-300)}
.ds-ancrage-points li strong{color:var(--ds-text-100);font-weight:600}
.ds-ancrage-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:360px}
.ds-ancrage-map{position:relative;width:min(100%,440px);filter:drop-shadow(0 24px 60px rgba(0,0,0,.5));opacity:0;transform:translateY(40px) scale(.92);transition:opacity 1.1s var(--ds-ease-out),transform 1.3s var(--ds-ease-out)}
.ds-ancrage-section.is-visible .ds-ancrage-map{opacity:1;transform:translateY(0) scale(1)}
.ds-ancrage-map img{width:100%;height:auto;display:block;animation:ds-ancrage-float 9s ease-in-out infinite}
@keyframes ds-ancrage-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.ds-ancrage-map::after{content:none !important;display:none !important}
.ds-ancrage-pulse{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--ds-gold-200);box-shadow:0 0 18px var(--ds-gold-300);opacity:0;transition:opacity .6s ease .8s}
.ds-ancrage-section.is-visible .ds-ancrage-pulse{opacity:1}
.ds-ancrage-pulse::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1.5px solid var(--ds-gold-300);animation:ds-ancrage-ping 2.4s ease-out infinite}
@keyframes ds-ancrage-ping{0%{transform:scale(.7);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.ds-ancrage-pulse.p1{top:30%;left:62%}
.ds-ancrage-pulse.p2{top:54%;left:38%;animation-delay:.6s}
.ds-ancrage-pulse.p3{top:70%;left:58%;animation-delay:1.2s}
@media (max-width: 860px){.ds-ancrage-inner{grid-template-columns:1fr;gap:48px}.ds-ancrage-visual{order:-1;min-height:280px}.ds-ancrage-map{width:min(78%,340px)}}

/* ===== 15. SECTION PROCESS MISSIONS (classes manquantes dans le build Qwen) ===== */
.ds-missions-process{padding:var(--ds-section-y) var(--ds-page-x);background:var(--ds-night-200);position:relative}
.ds-missions-process-inner{max-width:1100px;margin:0 auto}
.ds-missions-process-header{text-align:center;max-width:680px;margin:0 auto 56px}
.ds-missions-process-tag{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ds-gold-300);margin-bottom:16px}
.ds-missions-process-title{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(28px,4vw,44px);line-height:1.08;letter-spacing:-.02em;color:var(--ds-text-100)}
.ds-missions-process-title em{font-style:italic;background:linear-gradient(135deg,var(--ds-gold-200) 0%,var(--ds-gold-400) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ds-missions-process-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ds-grid-gap)}
.ds-missions-step{position:relative;padding:36px 28px;background:linear-gradient(160deg,rgba(26,37,71,.5) 0%,rgba(13,27,62,.3) 100%);border:1px solid var(--ds-border-100);border-radius:var(--ds-radius-lg);transition:transform var(--ds-duration-normal) var(--ds-ease-out),border-color var(--ds-duration-normal) var(--ds-ease-out)}
.ds-missions-step:hover{transform:translateY(-6px);border-color:var(--ds-border-300)}
.ds-missions-step-num{font-family:'Playfair Display',serif;font-size:48px;font-weight:900;line-height:1;background:linear-gradient(135deg,var(--ds-gold-200) 0%,var(--ds-gold-400) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:18px;opacity:.92}
.ds-missions-step h3{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;color:var(--ds-text-100);margin-bottom:10px}
.ds-missions-step p{font-size:14px;line-height:1.6;color:var(--ds-text-200)}
@media (max-width: 860px){.ds-missions-process-steps{grid-template-columns:1fr;gap:16px}}

/* ===== 16. COMPOSANTS MANQUANTS DU BUILD QWEN — finition production ===== */

/* --- INDEX · bandeau de statistiques sous le hero --- */
.ds-hero-stats-section{padding:48px var(--ds-page-x);background:var(--ds-night-200);border-top:1px solid var(--ds-border-100);border-bottom:1px solid var(--ds-border-100)}
.ds-stats-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--ds-grid-gap)}
.ds-stat-block{text-align:center;padding:8px 12px}
.ds-stat-number{display:block;font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(34px,4.4vw,52px);line-height:1;background:linear-gradient(135deg,var(--ds-gold-200) 0%,var(--ds-gold-400) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:8px}
.ds-hero-stats-section .ds-stat-label{display:block;font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ds-text-300)}
@media (max-width: 860px){.ds-stats-grid{grid-template-columns:repeat(2,1fr);gap:24px}}

/* --- INDEX · détails mockup (alertes + places restantes) --- */
.ds-alert-text{font-size:12px;line-height:1.4;color:var(--ds-text-200)}
.ds-pack-places-label{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ds-gold-300);margin-bottom:4px}
.ds-pack-places-value{font-size:13px;font-weight:600;color:var(--ds-text-100)}
.ds-micro-card-target{font-size:12.5px;line-height:1.5;color:var(--ds-text-300);margin-top:6px}

/* --- PACKS · mockup hero (cockpit métier) --- */
.ds-packs-hero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.ds-packs-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,.04) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 80% 60% at 70% 20%,#000 0%,transparent 75%)}
.ds-packs-hero-content{position:relative;z-index:2}
.ds-packs-hero-mockup{position:relative;perspective:1200px;display:flex;align-items:center;justify-content:center}
.ds-packs-mockup-card{width:min(100%,420px);background:linear-gradient(165deg,rgba(26,37,71,.92) 0%,rgba(10,15,30,.96) 100%);border:1px solid var(--ds-border-200);border-radius:var(--ds-radius-lg);padding:24px;box-shadow:var(--ds-shadow-lg);transform:rotateY(-6deg) rotateX(2deg);animation:ds-mockup-float 8s ease-in-out infinite}
.ds-packs-mockup-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--ds-border-100)}
.ds-packs-mockup-logo{font-family:'Playfair Display',serif;font-weight:900;font-size:17px;display:flex;align-items:center;gap:5px}
.ds-packs-mockup-logo-ds{background:linear-gradient(135deg,#F8E7A7,#C9A84C);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ds-packs-mockup-logo-name{color:var(--ds-text-100);font-family:'DM Sans',sans-serif;font-weight:500;font-size:14px}
.ds-packs-mockup-badge{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:.12em;color:var(--ds-green);padding:3px 9px;border:1px solid rgba(74,222,128,.3);border-radius:var(--ds-radius-pill);background:rgba(74,222,128,.08)}
.ds-packs-mockup-title{font-family:'Playfair Display',serif;font-size:18px;font-weight:700;color:var(--ds-text-100);margin-bottom:18px}
.ds-packs-mockup-kpis{display:grid;gap:12px;margin-bottom:18px}
.ds-packs-mockup-kpi{display:flex;flex-direction:column;gap:3px;padding:10px 12px;background:rgba(13,27,62,.5);border:1px solid var(--ds-border-100);border-radius:var(--ds-radius-sm)}
.ds-packs-mockup-kpi-label{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ds-gold-300)}
.ds-packs-mockup-kpi-value{font-size:12.5px;line-height:1.45;color:var(--ds-text-200)}
.ds-packs-mockup-fe{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.18);border-radius:var(--ds-radius-sm)}
.ds-packs-mockup-fe-icon{font-size:15px;line-height:1.2}
.ds-packs-mockup-fe-text{font-size:11.5px;line-height:1.5;color:var(--ds-text-200)}
@media (max-width: 860px){.ds-packs-mockup-card{transform:none;animation:none;width:100%}}

/* --- PACKS & MISSIONS · sections CTA finales --- */
.ds-packs-cta,.ds-missions-cta{padding:var(--ds-section-y) var(--ds-page-x);background:radial-gradient(ellipse 90% 120% at 50% 0%,rgba(26,37,71,.6) 0%,var(--ds-night-300) 70%);text-align:center;position:relative}
.ds-packs-cta-inner,.ds-missions-cta-inner{max-width:720px;margin:0 auto}
.ds-packs-cta-content{position:relative;z-index:2}
.ds-packs-cta-tag{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ds-gold-300);margin-bottom:18px}
.ds-packs-cta-title,.ds-missions-cta-title{font-family:'Playfair Display',serif;font-weight:900;font-size:clamp(30px,4.4vw,48px);line-height:1.08;letter-spacing:-.02em;color:var(--ds-text-100);margin-bottom:20px}
.ds-packs-cta-title em,.ds-missions-cta-title em{font-style:italic;background:linear-gradient(135deg,var(--ds-gold-200) 0%,var(--ds-gold-400) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ds-packs-cta-desc,.ds-missions-cta-desc{font-size:16px;line-height:1.65;color:var(--ds-text-200);margin-bottom:32px;max-width:540px;margin-left:auto;margin-right:auto}
.ds-packs-cta-actions,.ds-missions-cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* --- MISSIONS · hero content wrapper + note légale --- */
.ds-missions-hero-content{position:relative;z-index:2}
.ds-missions-note{max-width:1100px;margin:40px auto 0;padding:16px 20px;font-size:12.5px;line-height:1.55;color:var(--ds-text-300);background:rgba(13,27,62,.4);border:1px solid var(--ds-border-100);border-radius:var(--ds-radius-md);text-align:center}

/* --- FOOTER · liste contact (déjà héritée mais on fige l'icône/alignement) --- */
.ds-footer-contact li{display:flex;align-items:center;gap:6px}
.ds-footer-location{color:var(--ds-text-300)!important}

/* ===== 17. LOGO IMAGE (nav + footer) & cohérence branding mockups ===== */
/* Logo image dans la navbar — forçage anti-collapse du conteneur <a> */
nav.ds-nav .ds-nav-brand{
  display:flex!important;
  align-items:center!important;
  align-self:center!important;
  gap:0!important;
  height:34px!important;
  line-height:0!important;
  flex:0 0 auto!important;
  font-size:0!important;
}
nav.ds-nav .ds-nav-brand .ds-nav-logo-img{
  height:34px!important;
  width:auto!important;
  display:block!important;
  vertical-align:middle!important;
}
/* Logo image dans le footer */
.ds-footer-logo .ds-footer-logo-img{
  height:46px!important;
  width:225px!important;max-width:none!important;
  display:block!important;object-fit:contain!important;
}
.ds-footer-logo{line-height:0!important;display:inline-block!important}
@media (max-width: 760px){
  nav.ds-nav .ds-nav-brand,nav.ds-nav .ds-nav-brand .ds-nav-logo-img{height:30px!important}
  .ds-footer-logo .ds-footer-logo-img{height:40px!important}
}

/* Mini-branding DANS les mockups : aligné sur le vrai logo (DS blanc + Advisory or) */
.ds-fe-mockup-logo-ds,.ds-diag-mockup-logo-ds,.ds-packs-mockup-logo-ds{
  color:var(--ds-text-100)!important;
  background:none!important;
  -webkit-text-fill-color:var(--ds-text-100)!important;
  font-family:'Playfair Display',serif;font-weight:900;
}
.ds-fe-mockup-logo-name,.ds-diag-mockup-logo-name,.ds-packs-mockup-logo-name{
  background:linear-gradient(135deg,#F8E7A7,#C9A84C)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  font-family:'Playfair Display',serif;font-style:italic;font-weight:700;
}

/* ===== 18. CORRECTION FINALE — navbar fixe au-dessus de la serpentine + logo ===== */
nav.ds-nav{
  position:fixed!important;
  top:0!important;left:0!important;right:0!important;
  z-index:1000!important;
  height:58px!important;min-height:58px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  padding:0 48px!important;
}
body{padding-top:58px!important}
/* Le logo conserve sa taille, le conteneur ne s'étire pas.
   width explicite (ratio 4.9:1) pour contrer le max-width:100% global sur img. */
nav.ds-nav .ds-nav-brand{
  position:relative!important;z-index:1!important;
  flex:0 0 auto!important;width:auto!important;
  display:flex!important;align-items:center!important;
  height:34px!important;line-height:0!important;
}
nav.ds-nav .ds-nav-brand .ds-nav-logo-img{
  height:34px!important;width:auto!important;max-width:300px!important;
  display:block!important;object-fit:contain!important;
}
nav.ds-nav .ds-nav-links{flex:0 1 auto!important}
@media (max-width: 860px){
  nav.ds-nav{position:fixed!important}
  body{padding-top:62px!important}
}
@media (max-width: 760px){
  nav.ds-nav .ds-nav-brand{height:30px!important}
  nav.ds-nav .ds-nav-brand .ds-nav-logo-img{height:30px!important;width:auto!important}
}

/* ===== 19. CORRECTION — colonnes de footer ne doivent PAS être des cartes =====
   Le sélecteur large [class*="col"] (section FIX globale) appliquait un fond
   dégradé + bordure à tout élément contenant « col » dans sa classe, dont
   .ds-footer-col et .ds-footer-brand-col. Résultat : un rectangle visible
   derrière le logo footer (transparent) et les colonnes. On neutralise. */
.ds-footer-col,
.ds-footer-brand-col,
.ds-footer-signature .ds-footer-col,
.ds-footer-signature .ds-footer-brand-col{
  background:none!important;
  border:0!important;
  box-shadow:none!important;
}
/* Le lien-logo et l'image restent strictement sans cadre */
.ds-footer-logo,
.ds-footer-logo-img,
.ds-nav-brand,
.ds-nav-logo-img{
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
}

/* ===== 20. CORRECTION — lisibilité des boutons CTA à fond doré =====
   Demande client : le texte des boutons CTA dorés doit être BLANC
   (il apparaissait doré sur doré = illisible). On cible les boutons à
   REMPLISSAGE doré (nav-cta, btn-gold, pack populaire) → texte blanc.
   Les boutons « fantômes » (texte doré sur fond sombre + bordure) restent inchangés. */
.ds-nav-cta,
.ds-btn-gold,
.ds-pack-card.popular .ds-btn-pack,
a.ds-btn-gold,
button.ds-btn-gold {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  background: linear-gradient(135deg, var(--ds-gold-400, #C9A84C) 0%, var(--ds-gold-300, #E8CC7A) 100%) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.18);
}
.ds-nav-cta *,
.ds-btn-gold *,
.ds-pack-card.popular .ds-btn-pack * {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* ===== 21. CORRECTION — mention « HT » dorée comme le prix =====
   Demande client : la mention HT à côté des prix doit être dorée (elle
   apparaissait en gris à cause d'un double 'color' contradictoire).
   On dore tous les suffixes de prix au même ton or que le montant. */
.ds-tarifs-fe-card-suffix,
.ds-tarifs-micro-card-suffix,
.ds-tarifs-option-suffix,
.ds-tarifs-pack-price-suffix,
.ds-fe-offre-suffix {
  color: var(--ds-gold-300, #E8CC7A) !important;
  background: linear-gradient(135deg, var(--ds-gold-200, #F8E7A7) 0%, var(--ds-gold-400, #C9A84C) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-weight: 600 !important;
}

/* ===== 22. CORRECTION — chiffres de prix non coupés =====
   Demande client : les chiffres des prix étaient tronqués en bas.
   Cause : line-height égal à la font-size (1.0) + overflow:hidden de la carte
   coupait le bas des glyphes dorés (Playfair). On aère le line-height et on
   garantit que le bloc montant n'est jamais rogné. */
.ds-tarifs-fe-card-amount,
.ds-tarifs-micro-card-amount,
.ds-tarifs-option-amount,
.ds-tarifs-pack-price-amount,
.ds-fe-offre-amount,
.ds-pack-amount,
.ds-diag-amount,
.ds-form-price-amount {
  line-height: 1.15 !important;
  padding-bottom: 2px !important;
  overflow: visible !important;
  display: inline-block !important;
}
/* Les blocs/lignes contenant un prix ne rognent pas verticalement */
.ds-tarifs-fe-card-price,
.ds-tarifs-micro-card-price,
.ds-tarifs-micro-card-price-main,
.ds-tarifs-option-price,
.ds-tarifs-pack-price,
.ds-fe-offre-price,
.ds-pack-price,
.ds-diag-price-main {
  overflow: visible !important;
}

/* ===== 23. CORRECTION — bandeaux/badges en haut des cards non tronqués =====
   Demande client : les bandeaux « PACK LE PLUS CHOISI », « OFFRE LIMITÉE »,
   « FE Express TPE » etc. (position:absolute; top:-12px) étaient coupés par
   l'overflow:hidden des cartes. On passe ces cartes en overflow visible et on
   ajoute une marge haute pour laisser respirer le badge. Le ::before radial
   reste confiné par le border-radius. */
.ds-pack-card.popular,
.ds-pack-card.limited,
.ds-tarifs-fe-card,
.ds-tarifs-pack-card,
.ds-tarifs-micro-card,
.ds-fe-offre-card {
  overflow: visible !important;
  margin-top: 16px !important;
}
/* On confine proprement les effets décoratifs internes des cartes */
.ds-pack-card.popular::before,
.ds-pack-card.limited::before,
.ds-tarifs-fe-card::before,
.ds-tarifs-pack-card::before {
  border-radius: inherit !important;
  overflow: hidden !important;
}
/* Le badge passe AU-DESSUS de tout dans la carte */
.ds-pack-popular-badge,
.ds-pack-limited-badge,
.ds-tarifs-fe-card-badge,
.ds-tarifs-pack-badge,
.ds-tarifs-pack-limited-badge,
.ds-fe-offre-badge,
.ds-tarifs-micro-card-badge {
  z-index: 10 !important;
  white-space: nowrap !important;
}

/* ===== 24. SERPENTINE — visible au-dessus du contenu + logo filigrane pré-footer =====
   Demandes client :
   1) la serpentine doit passer DEVANT les encadrés (elle était derrière, z-index 2 < contenu 4)
   2) un logo en filigrane juste AVANT le footer, que la serpentine touche et illumine
   3) appliquer ce comportement sur TOUTES les pages */

/* 1) La serpentine repasse au-dessus du contenu (trait fin + semi-transparent = reste élégant).
   pointer-events:none conservé pour ne jamais bloquer les clics. */
.ds-serpentine-layer{ z-index: 3 !important; pointer-events: none !important; }
.ds-serpentine-track,
.ds-serpentine-svg,


/* 2) Logo filigrane pré-footer : grand, discret, centré, en bas de page */
.ds-prefooter-watermark{
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: clamp(40px, 7vw, 90px) 20px clamp(30px, 5vw, 60px);
  background: linear-gradient(180deg, transparent 0%, rgba(2,4,8,.4) 100%);
  pointer-events: none;
}
.ds-prefooter-watermark-img{
  width: min(52vw, 460px);
  height: auto;
  opacity: .12;
  filter: grayscale(.2) brightness(1.1);
  transition: opacity .9s ease, filter .9s ease, transform .9s ease;
  transform: translateY(8px) scale(.98);
}
/* 3) Illumination quand la serpentine atteint le filigrane */
.ds-prefooter-watermark.ds-serpentine-arrived .ds-prefooter-watermark-img{
  opacity: .42;
  filter: grayscale(0) brightness(1.25) drop-shadow(0 0 34px rgba(232,204,122,.55));
  transform: translateY(0) scale(1);
}
@media (max-width: 760px){

}

/* ===== 25. SERPENTINE — réglages élégants alignés V25.1 =====
   Trait fin et raffiné (pas épais), halo doux. Visible mais subtile,
   comme la V25.1, sans tracé disgracieux. */
.ds-serpentine-trail{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 2.4 !important;
  opacity: .9 !important;
  filter: drop-shadow(0 0 8px rgba(232,204,122,.72)) !important;
}
.ds-serpentine-trail-soft{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 13 !important;
  opacity: .12 !important;
  filter: blur(8px) !important;
}
.ds-serpentine-head{
  fill: #F8E7A7 !important;
  filter: drop-shadow(0 0 15px rgba(232,204,122,.95)) !important;
}
.ds-serpentine-head-ring{ stroke: rgba(248,231,167,.42) !important; stroke-width: 1.1 !important; }
.ds-serpentine-orn.is-visible{ opacity: .09 !important; }
.ds-serpentine-orn.is-lit{ opacity: .15 !important; }

/* ===== 26. CORRECTION — rectangles parasites section compteur FOMO =====
   Le sélecteur large [class*="countdown"] collait un fond bleu + bordure à
   TOUS les sous-éléments (tag, titre, valeurs, séparateurs, labels) → carrés
   et rectangles parasites. On neutralise partout, puis on ré-applique un
   style propre UNIQUEMENT sur les blocs de chiffres. */
.ds-countdown,
.ds-countdown-tag,
.ds-countdown-title,
.ds-countdown-value,
.ds-countdown-separator,
.ds-countdown-label,
.ds-countdown-desc,
.ds-countdown-section{
  background: transparent !important;
  border: 0 !important;
}
/* Bloc chiffre = petite carte élégante (le SEUL élément encadré) */
.ds-countdown-block{
  background: rgba(0, 180, 216, 0.06) !important;
  border: 1px solid rgba(0, 180, 216, 0.20) !important;
  border-radius: 12px !important;
  padding: 14px 10px !important;
  min-width: 70px !important;
}
.ds-countdown-separator{
  background: transparent !important;
  border: 0 !important;
  color: var(--ds-gold-300, #E8CC7A) !important;
}

/* ===== 26b. CORRECTION — rectangles parasites compteur FOMO (page FE) =====
   Le countdown de la page facturation-electronique utilise des classes
   distinctes (ds-fe-countdown-*), également attrapées par [class*="countdown"].
   Même traitement : on neutralise les sous-éléments, on ne garde le style
   « carte » que sur les blocs de chiffres. */
.ds-fe-countdown,
.ds-fe-countdown-label,
.ds-fe-countdown-grid,
.ds-fe-countdown-value,
.ds-fe-countdown-unit,
.ds-fe-countdown-sep,
.ds-fe-countdown-deadline{
  background: transparent !important;
  border: 0 !important;
}
.ds-fe-countdown-block{
  background: rgba(0, 180, 216, 0.06) !important;
  border: 1px solid rgba(0, 180, 216, 0.20) !important;
  border-radius: 12px !important;
  padding: 14px 10px !important;
  min-width: 64px !important;
}
.ds-fe-countdown-sep{
  color: var(--ds-gold-300, #E8CC7A) !important;
}

/* ===== 27. CORRECTION — alignement des prix des 2 cartes « Commencez ici » =====
   Demande client (récurrente) : aligner visuellement le « 0 € » (diagnostic
   gratuit) avec le « 249 € HT » (diagnostic premium) de la carte voisine.
   Les 2 cartes ont maintenant la même structure (price-block) ; on pousse le
   bloc prix en bas de chaque carte pour qu'ils s'alignent, quel que soit le
   nombre de lignes de features au-dessus. */
.ds-diagnostics-section .ds-diag-card{
  display: flex !important;
  flex-direction: column !important;
}
.ds-diagnostics-section .ds-diag-price-block{
  margin-top: auto !important;
}
/* Le bouton CTA garde une marge constante sous le prix */
.ds-diagnostics-section .ds-diag-price-block + .ds-btn-primary,
.ds-diagnostics-section .ds-diag-price-block + .ds-btn-gold{
  margin-top: 18px !important;
}
/* Cohérence visuelle du montant gratuit avec le premium */
.ds-diagnostics-section .ds-diag-price-block{
  min-height: 96px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

/* ===== 28. DS COPILOT — présentation textuelle (sans colonnes centrées) =====
   Demande client : retirer la grille 4 colonnes centrée, présenter comme du
   texte (icône à gauche, titre + description à droite, alignés à gauche). */
.ds-copilot-feature .ds-copilot-icon{
  flex: 0 0 auto;
  font-size: 26px;
  line-height: 1;
  margin: 2px 0 0 0;
}
.ds-copilot-feature .ds-copilot-feature-title{
  text-align: left !important;
  margin: 0 0 4px 0 !important;
  font-size: 14px;
  letter-spacing: 0.06em;
}
.ds-copilot-feature .ds-copilot-feature-desc{
  text-align: left !important;
  margin: 0 !important;
}
.ds-copilot-feature > div:last-child,
.ds-copilot-feature-body{
  flex: 1 1 auto;
}
/* le header de section reste centré (cohérent avec les autres sections) */
@media (max-width: 640px){
  .ds-copilot-feature{ flex-direction: row; }
}

/* ===== 29. NOTRE MÉTHODE — connecteurs propres entre étapes =====
   Demande client : la flèche après le cadre 2 partait seule à gauche (les
   flèches étaient des cellules de grille, cassant la mise en page sur 2 lignes).
   Flèches retirées du flux ; on relie les étapes par un connecteur doré en
   ::after, masqué en bout de ligne et en responsive. */
.ds-methode-steps{
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}
.ds-methode-step{
  position: relative;
}
/* Connecteur doré entre 2 cartes (flèche → ) */
.ds-methode-step:not(:last-child)::after{
  content: "→";
  position: absolute;
  top: 50%;
  right: -18px;
  transform: translateY(-50%);
  color: var(--ds-gold-300, #E8CC7A);
  font-size: 20px;
  font-weight: 700;
  opacity: .7;
  pointer-events: none;
  z-index: 2;
}
/* Sur 2 colonnes : on enlève le connecteur en fin de chaque rangée (2e, 4e) */
@media (max-width: 980px){
  .ds-methode-steps{ grid-template-columns: repeat(2, 1fr) !important; }
  .ds-methode-step:nth-child(2n)::after{ display: none !important; }
  /* connecteur vertical sous les cartes du haut */
  .ds-methode-step:nth-child(-n+2)::after{
    content: "↓";
    top: auto; bottom: -20px;
    right: 50%; transform: translateX(50%);
  }
}
@media (max-width: 560px){
  .ds-methode-steps{ grid-template-columns: 1fr !important; }
  .ds-methode-step::after{
    content: "↓" !important;
    top: auto !important; bottom: -20px !important;
    right: 50% !important; transform: translateX(50%) !important;
    display: block !important;
  }
  .ds-methode-step:last-child::after{ display: none !important; }
}

/* ===== 30. MENU DÉROULANT — options en thème sombre =====
   Demande client : le menu déroulant de sélection d'activité apparaissait
   tout en blanc (rendu natif des <option>). On force un fond sombre et un
   texte clair sur le select et ses options. */
.ds-cta-form select,
.ds-form-group select,
#secteur{
  background-color: #0F1729 !important;
  color: #FFFFFF !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23E8CC7A' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 38px !important;
}
.ds-cta-form select option,
.ds-form-group select option,
#secteur option{
  background-color: #0F1729 !important;
  color: #FFFFFF !important;
}
.ds-cta-form select option:checked,
#secteur option:checked{
  background-color: #1A2547 !important;
  color: #E8CC7A !important;
}

/* ===== 31. GAMME MICRO — numérotation /13 + cohérence avec les verticaux =====
   Demande client : les cartes de la gamme micro doivent avoir les mêmes
   grosses numérotations (10 à 13) et animations que les autres packs métiers. */
.ds-micro-card{
  position: relative;
}
.ds-micro-card-number{
  position: absolute;
  top: 22px;
  right: 26px;
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 40px;
  line-height: 1;
  background: linear-gradient(135deg, var(--ds-gold-200, #F8E7A7) 0%, var(--ds-gold-400, #C9A84C) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: .55;
  transition: opacity .3s ease;
  pointer-events: none;
}
.ds-micro-card:hover .ds-micro-card-number{ opacity: .85; }
/* le "/13" en plus petit après le numéro */
.ds-micro-card-number::after{
  content: none;
}
/* si la carte a un badge en haut, on descend le numéro pour éviter tout chevauchement */
.ds-micro-card.featured .ds-micro-card-number,
.ds-micro-card:has(.ds-micro-card-badge) .ds-micro-card-number{
  top: 56px;
}

/* ===== 32. PACKS MÉTIERS — cartes aperçu cliquables + modal détail =====
   Demande client : restaurer l'affichage en modal du détail de chaque métier
   au clic sur « Découvrir ce pack » (cela renvoyait au formulaire de contact). */

/* Grille de cartes aperçu */
.ds-verticaux-grid{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: var(--ds-grid-gap, 24px) !important;
}
.ds-metier-preview-card{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  text-align: left;
  position: relative;
  padding: 28px 26px;
  background: linear-gradient(135deg, rgba(13,27,62,.6) 0%, rgba(10,15,30,.8) 100%);
  border: 1px solid var(--ds-border-200, rgba(201,168,76,.18));
  border-radius: var(--ds-radius-lg, 16px);
  cursor: pointer;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  font-family: inherit;
  width: 100%;
}
.ds-metier-preview-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,.35);
  border-color: rgba(232,204,122,.45);
}
.ds-metier-preview-number{
  position: absolute;
  top: 20px;
  right: 24px;
  font-family: 'Playfair Display', serif;
  font-weight: 900;
  font-size: 34px;
  line-height: 1;
  background: linear-gradient(135deg, #F8E7A7, #C9A84C);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: .5;
}
.ds-metier-preview-icon{ font-size: 30px; line-height: 1; }
.ds-metier-preview-label{
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 19px;
  color: var(--ds-text-100, #fff);
}
.ds-metier-preview-target{
  font-size: 13px;
  color: var(--ds-text-300, rgba(255,255,255,.6));
  line-height: 1.4;
}
.ds-metier-preview-cta{
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 20px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #E8CC7A;
  background: linear-gradient(135deg, rgba(201,168,76,.12), rgba(232,204,122,.06));
  border: 1px solid rgba(201,168,76,.4);
  border-radius: 999px;
  transition: all .3s ease;
  align-self: flex-start;
}
.ds-metier-preview-card:hover .ds-metier-preview-cta{
  background: linear-gradient(135deg, #C9A84C, #E8CC7A);
  color: #FFFFFF;
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(201,168,76,.3);
}

/* Overlay + boîte modal */
.ds-metier-modal-overlay{
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(2,4,8,.78);
  backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.ds-metier-modal-overlay.is-open{ opacity: 1; visibility: visible; }
.ds-metier-modal-box{
  position: relative;
  width: min(640px, 100%);
  max-height: 88vh;
  overflow-y: auto;
  background: linear-gradient(165deg, rgba(26,37,71,.98) 0%, rgba(10,15,30,.99) 100%);
  border: 1px solid var(--ds-border-300, rgba(201,168,76,.32));
  border-radius: 20px;
  padding: 36px;
  box-shadow: 0 40px 100px rgba(0,0,0,.6);
  transform: translateY(16px) scale(.98);
  transition: transform .35s var(--ds-ease-out, cubic-bezier(.16,1,.3,1));
}
.ds-metier-modal-overlay.is-open .ds-metier-modal-box{ transform: translateY(0) scale(1); }
.ds-metier-modal-close{
  position: absolute;
  top: 16px;
  right: 18px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--ds-border-200, rgba(201,168,76,.18));
  background: rgba(255,255,255,.04);
  color: var(--ds-text-100, #fff);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: all .2s ease;
}
.ds-metier-modal-close:hover{ background: rgba(201,168,76,.18); border-color: var(--ds-gold-300); }
/* le contenu détail reprend les styles ds-vertical-detail-* déjà définis */
.ds-metier-modal-content .ds-vertical-detail-actions{ margin-top: 24px; }

@media (max-width: 980px){
  .ds-verticaux-grid{ grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px){
  .ds-verticaux-grid{ grid-template-columns: 1fr !important; }
  .ds-metier-modal-box{ padding: 28px 22px; }
}

/* ===== 33. POLICE DES TEXTES — DM Sans (alignée sur la V25.1) =====
   Les textes courants et les cartes utilisent DM Sans (comme la V25.1).
   Les gros titres restent en Playfair Display (non touchés). */
body, p, li, span, a, button, input, select, textarea, label, td, th,
.ds-vertical-card, .ds-micro-card, .ds-pack-card, .ds-metier-preview-card,
.ds-pack-desc, .ds-vertical-card-desc, .ds-micro-card-desc,
.ds-diag-desc, .ds-tarifs-fe-card-desc, .ds-copilot-feature-desc {
  font-family: 'DM Sans', sans-serif;
}
/* Les titres restent en Playfair */
h1, h2, h3, .hero h1, .ds-vertical-card-title, .ds-pack-name,
.ds-metier-preview-label, [class*="-title"] {
  font-family: 'Playfair Display', serif;
}
/* Les labels mono restent en DM Mono */
[class*="-tag"], [class*="-label"], [class*="-number"], [class*="kpi"] {
  font-family: 'DM Mono', monospace;
}

/* ===== 34. FILIGRANE PRÉ-FOOTER & LOGO FOOTER (approche V25.1) =====
   Demande client : logo en filigrane DORÉ DISCRET (pas un gros logo blanc).
   On neutralise l'ancien filigrane géant et on adopte l'effet ::before discret
   du footer, comme la V25.1. La serpentine vient finir sur le logo du footer. */

/* Neutralisation de l'ancien filigrane géant (élément supprimé du HTML) */
.ds-prefooter-watermark{ display: none !important; }

/* Filigrane discret doré dans le footer (façon V25.1) */
footer.ds-footer-signature{ position: relative; overflow: hidden; }
footer.ds-footer-signature::before{
  content: "";
  position: absolute;
  right: clamp(14px, 4vw, 60px);
  bottom: clamp(10px, 3vw, 40px);
  width: clamp(180px, 26vw, 340px);
  height: clamp(60px, 9vw, 110px);
  background: url('logo-footer-watermark.png') center/contain no-repeat;
  opacity: .06;
  filter: grayscale(1) brightness(1.5) sepia(.5) saturate(2.2) hue-rotate(5deg);
  pointer-events: none;
  z-index: 0;
}
footer.ds-footer-signature > *{ position: relative; z-index: 1; }

/* Logo footer à la taille V25.1 (42px) */
.ds-footer-logo .ds-footer-logo-img,
.ds-footer-logo-link img,
#ds-logo-footer img{
  height: 40px !important;
  width: auto !important;
  max-width: 220px !important;
  object-fit: contain !important;
}
/* Le logo footer s'illumine quand la serpentine l'atteint */
#ds-logo-footer.ds-serpentine-arrived img,
.ds-footer-logo.ds-serpentine-arrived img{
  filter: drop-shadow(0 0 18px rgba(232,204,122,.7)) brightness(1.15);
  transition: filter .6s ease;
}

/* ===== 35. HERO REHAUSSÉS — alignés sur la V25.1 =====
   Demande client : les hero descendent trop bas et masquent les infos.
   On remonte le contenu sous la navbar et on réduit la hauteur/paddings.
   Ciblage des VRAIES classes hero de chaque page. */
.ds-hero-v3{
  min-height: 90vh !important;
  padding-top: 88px !important;
  padding-bottom: 56px !important;
  margin-top: -58px !important;
}
.ds-fe-hero,
.ds-packs-hero,
.ds-tarifs-fe-hero,
.ds-quiz-hero,
.ds-diag-hero,
.ds-missions-hero,
.ds-faq-hero,
.ds-contact-hero,
.ds-legal-hero{
  padding-top: 88px !important;
  padding-bottom: clamp(40px, 5vw, 64px) !important;
  margin-top: -58px !important;
  min-height: auto !important;
}
@media (max-width: 980px){
  .ds-hero-v3{ padding-top: 80px !important; min-height: auto !important; }
}
@media (max-width: 760px){
  .ds-hero-v3,
  .ds-fe-hero, .ds-packs-hero, .ds-tarifs-fe-hero, .ds-quiz-hero,
  .ds-diag-hero, .ds-missions-hero, .ds-faq-hero, .ds-contact-hero, .ds-legal-hero{
    padding-top: 76px !important; margin-top: -58px !important;
  }
}

/* ===== 36. NAVBAR HARMONISÉE — alignée sur la V25.1 =====
   Demande client : navbar identique à la V25.1 sur toutes les pages, logo
   rétréci et harmonisé avec la hauteur des boutons (34px). */
nav.ds-nav{
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 1000 !important;
  min-height: 58px !important;
  height: 58px !important;
  padding: 0 clamp(18px, 3.2vw, 48px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: rgba(10, 15, 30, 0.97) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(201, 168, 76, 0.18) !important;
}
/* Logo navbar rétréci (38px) et harmonisé avec les boutons */
nav.ds-nav .ds-nav-brand{
  display: flex !important;
  align-items: center !important;
  height: 38px !important;
  line-height: 0 !important;
  flex: 0 0 auto !important;
}
nav.ds-nav .ds-nav-brand .ds-nav-logo-img,
nav.ds-nav .ds-nav-brand img{
  height: 38px !important;
  width: auto !important;
  max-width: min(240px, 30vw) !important;
  object-fit: contain !important;
  display: block !important;
}
/* Liens de navigation */
nav.ds-nav .ds-nav-links{
  display: flex !important;
  align-items: center !important;
  gap: clamp(10px, 1.6vw, 26px) !important;
}
nav.ds-nav .ds-nav-links a{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.72) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
nav.ds-nav .ds-nav-links a:hover,
nav.ds-nav .ds-nav-links a.active{ color: #E8CC7A !important; }
/* Bouton CTA navbar harmonisé (hauteur 34px, texte blanc) */
nav.ds-nav .ds-nav-cta{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 18px !important;
  line-height: 1 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
  background: linear-gradient(135deg, #C9A84C, #E8CC7A) !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
@media (max-width: 1180px){
  nav.ds-nav .ds-nav-links a{ font-size: 11px !important; }
  nav.ds-nav .ds-nav-cta{ font-size: 11px !important; padding: 0 12px !important; }
}
@media (max-width: 980px){
  nav.ds-nav .ds-nav-brand,
  nav.ds-nav .ds-nav-brand img{ height: 34px !important; }
}
@media (max-width: 680px){
  nav.ds-nav .ds-nav-brand,
  nav.ds-nav .ds-nav-brand img{ height: 30px !important; max-width: 170px !important; }
}

/* ===== 37. CORRECTION — "?" tronqué dans le hero FE =====
   L'italique Playfair + background-clip:text rognait le jambage du "?".
   On ajoute de l'air à droite et on garantit l'overflow visible. */
.ds-fe-hero-title,
.ds-fe-hero-title em{
  overflow: visible !important;
  padding-right: 0.12em !important;
  padding-bottom: 0.06em !important;
}
.ds-fe-hero-title em{
  display: inline-block !important;
  margin-right: 0.08em !important;
}

/* ===== 38. EFFET GRADIENT DORÉ ANIMÉ (shimmer) =====
   Demande client : un dégradé doré qui bouge/scintille sur les éléments dorés.
   On anime la position du dégradé pour un effet de reflet subtil et premium. */
@keyframes dsGoldShimmer{
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
/* Titres en deux couleurs (la partie dorée em) + prix + mentions dorées */
.ds-hero-v3-title em,
.ds-verticaux-v3-title em,
.ds-micro-title em,
.ds-diagnostics-title em,
.ds-packs-title em,
.ds-copilot-title em,
.ds-methode-title em,
.ds-cta-title em,
.ds-tarifs-fe-card-amount,
.ds-tarifs-micro-card-amount,
.ds-fe-offre-amount,
.ds-pack-amount,
.ds-diag-amount,
.ds-stat-number,
.ds-micro-card-number,
.ds-metier-preview-number{
  background: linear-gradient(110deg, #C9A84C 0%, #F8E7A7 25%, #FFF6D8 45%, #E8CC7A 65%, #C9A84C 100%) !important;
  background-size: 220% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  animation: dsGoldShimmer 6s ease-in-out infinite !important;
}
@media(prefers-reduced-motion: reduce){
  .ds-hero-v3-title em, .ds-tarifs-fe-card-amount, .ds-pack-amount,
  .ds-diag-amount, .ds-stat-number{ animation: none !important; }
}

/* ===== 39. CORRECTION — prix DS Copilot (tarifs) en doré =====
   Demande client : le prix et la mention HT des options DS Copilot doivent être
   dorés (le prix restait blanc ; seules les mentions après l'étaient). */
.ds-tarifs-option-amount,
.ds-tarifs-option-price .ds-tarifs-option-amount{
  background: linear-gradient(110deg, #C9A84C 0%, #F8E7A7 25%, #FFF6D8 45%, #E8CC7A 65%, #C9A84C 100%) !important;
  background-size: 220% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  animation: dsGoldShimmer 6s ease-in-out infinite !important;
  font-weight: 800 !important;
}
.ds-tarifs-option-suffix{
  color: var(--ds-gold-300, #E8CC7A) !important;
  -webkit-text-fill-color: #E8CC7A !important;
  background: none !important;
  font-weight: 600 !important;
}

/* ===== 40. RESULT-CARD du quiz V25.1 — adapté au thème sombre =====
   Le result-card V25.1 a un fond blanc ; on l'adapte au thème navy du site
   pour la lisibilité, tout en gardant la structure et le ring SVG V25.1. */
.result-card{
  background: linear-gradient(165deg, rgba(26,37,71,.96), rgba(10,15,30,.98)) !important;
  border: 1px solid rgba(201,168,76,.28) !important;
  border-radius: 20px !important;
  color: #fff !important;
  box-shadow: 0 40px 100px rgba(0,0,0,.5) !important;
}
.result-card .result-niveau{ color: #fff !important; }
.result-card .result-axe-n{ color: #E8CC7A !important; }
.result-card .result-axe-l{ color: rgba(255,255,255,.6) !important; }
.result-card .result-body,
.result-card .result-pack,
.result-card p,
.result-card li,
.result-card span:not(.result-axe-n){ color: rgba(255,255,255,.85) !important; }
.result-card .result-pack{
  background: rgba(201,168,76,.08) !important;
  border: 1px solid rgba(201,168,76,.25) !important;
  border-radius: 14px !important;
}
.result-card h3, .result-card h4, .result-card strong{ color: #fff !important; }

/* ===== 41. BOUTONS « DÉCOUVRIR » DES VERTICAUX MÉTIERS (accueil) =====
   Demande client : ces boutons (devenus <button>) affichaient un rectangle gris
   du style natif. On les transforme en vrais boutons dorés élégants. */
button.ds-vertical-card-cta{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin-top: auto !important;
  padding: 12px 20px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  background: linear-gradient(135deg, rgba(201,168,76,.12), rgba(232,204,122,.05)) !important;
  border: 1px solid rgba(201,168,76,.4) !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all .3s ease !important;
}
button.ds-vertical-card-cta:hover{
  background: linear-gradient(135deg, #C9A84C, #E8CC7A) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
  box-shadow: 0 6px 18px rgba(201,168,76,.3) !important;
  transform: translateY(-1px) !important;
}

/* ===== 42. MOCKUP HERO ACCUEIL — remonté + animation float conservée =====
   Demande client : le mockup ne bougeait plus (mon transform fixe écrasait
   l'animation). On garde le scale réduit ET on ré-anime via une keyframe
   dédiée qui intègre le scale. */
.ds-hero-v3-mockup{
  margin-top: -24px !important;
  align-self: center !important;
}
.ds-hero-v3-mockup-card{
  transform-origin: center top !important;
  animation: ds-mockup-float-v8 8s ease-in-out infinite !important;
}
@keyframes ds-mockup-float-v8{
  0%, 100% { transform: perspective(1500px) rotateY(-12deg) rotateX(6deg) scale(.92) translateY(0); }
  50%      { transform: perspective(1500px) rotateY(-10deg) rotateX(5deg) scale(.92) translateY(-12px); }
}
@media (max-width: 980px){
  .ds-hero-v3-mockup{ margin-top: 0 !important; }
  .ds-hero-v3-mockup-card{ animation: none !important; transform: scale(.95) !important; }
}

/* ===== 43. CORRECTION — police des 4 packs tarifs (Essentiel/Standard/Premium/Strategic) =====
   Le sélecteur large [class*="-tag"] (section 33) forçait DM Mono sur
   ds-tarifs-pack-tagline (qui contient « -tag »). Or ce tagline est le NOM du
   pack et doit être en Playfair comme les titres des autres cards. */
.ds-tarifs-pack-tagline{
  font-family: 'Playfair Display', serif !important;
}

/* ===== 44. RESULT-WRAP test-conformite — thème sombre + score lisible =====
   Adaptation du bloc résultat FE (result-wrap) au thème navy du site. */
#result-wrap{
  background: linear-gradient(165deg, rgba(26,37,71,.96), rgba(10,15,30,.98)) !important;
  border: 1px solid rgba(201,168,76,.28) !important;
  border-radius: 20px !important;
  color: #fff !important;
  padding: 36px !important;
  box-shadow: 0 40px 100px rgba(0,0,0,.5) !important;
}
#result-wrap .result-header h2,
#result-wrap #result-title{ color: #fff !important; }
#result-wrap #result-sub,
#result-wrap .result-header p{ color: rgba(255,255,255,.7) !important; }
/* Score bien grand et centré dans le ring */
#result-wrap .score-num{
  font-family: 'Playfair Display', serif !important;
  font-size: 46px !important;
  font-weight: 900 !important;
  color: #E8CC7A !important;
  line-height: 1 !important;
}
#result-wrap .score-label{
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  color: rgba(255,255,255,.5) !important;
  letter-spacing: .1em !important;
}
#result-wrap .score-center{
  position: absolute !important;
  top: 50% !important; left: 50% !important;
  transform: translate(-50%,-50%) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
}
#result-wrap .score-ring-inner{ position: relative !important; }
#result-wrap .axis-bar, #result-wrap .axes-grid{ color: rgba(255,255,255,.85) !important; }
#result-wrap [id*="reco"], #result-wrap [id*="upsell"]{ color: rgba(255,255,255,.85) !important; }

/* ===== 45. CARTES MICRO — animation des émoticônes (comme les cartes métiers) =====
   Demande client : les 4 cartes micro doivent avoir la même animation d'icône
   au survol que les 9 cartes métiers verticales. */
.ds-micro-card-icon{
  display: inline-block;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
  transition: transform var(--ds-duration-normal, .3s) var(--ds-ease-spring, cubic-bezier(.34,1.56,.64,1)) !important;
}
.ds-micro-card:hover .ds-micro-card-icon{
  transform: scale(1.15) rotate(-5deg) !important;
}

/* ===== 46. COMPTEURS FOMO — refonte premium / chic / captivant =====
   Demande client : les compteurs étaient ternes et « sinistres ». Refonte
   haut de gamme : blocs profonds avec halo doré, chiffres en dégradé or animé,
   séparateurs lumineux pulsés, reflets. S'applique à l'accueil ET à la page FE. */

/* ---- Blocs de chiffres : carte premium avec halo doré ---- */
.ds-countdown-block,
.ds-fe-countdown-block{
  position: relative !important;
  background:
    linear-gradient(160deg, rgba(28,40,75,.92) 0%, rgba(11,17,33,.96) 100%) !important;
  border: 1px solid rgba(201,168,76,.32) !important;
  border-radius: 16px !important;
  padding: 20px 18px 14px !important;
  min-width: 92px !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.5),
    0 0 0 1px rgba(232,204,122,.06) inset,
    0 1px 0 rgba(255,255,255,.06) inset !important;
  overflow: visible !important;
  transition: transform .4s cubic-bezier(.16,1,.3,1), border-color .4s ease !important;
}
/* reflet doré supérieur */
.ds-countdown-block::before,
.ds-fe-countdown-block::before{
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(232,204,122,.7), transparent) !important;
}
/* halo lumineux derrière les chiffres */
.ds-countdown-block::after,
.ds-fe-countdown-block::after{
  content: "" !important;
  position: absolute !important;
  top: -40% !important; left: 50% !important;
  width: 120% !important; height: 80% !important;
  transform: translateX(-50%) !important;
  background: radial-gradient(ellipse at center, rgba(232,204,122,.14) 0%, transparent 70%) !important;
  pointer-events: none !important;
}
.ds-countdown-block:hover,
.ds-fe-countdown-block:hover{
  transform: translateY(-4px) !important;
  border-color: rgba(232,204,122,.55) !important;
  box-shadow:
    0 26px 60px rgba(0,0,0,.6),
    0 0 30px rgba(201,168,76,.18),
    0 0 0 1px rgba(232,204,122,.1) inset !important;
}

/* ---- Chiffres : grand, dégradé or animé ---- */
.ds-countdown-value,
.ds-fe-countdown-value{
  position: relative !important;
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 44px !important;
  font-weight: 900 !important;
  line-height: 1.28 !important;
  padding: 4px 2px 6px !important;
  overflow: visible !important;
  background: linear-gradient(160deg, #FFF6D8 0%, #F8E7A7 35%, #E8CC7A 60%, #C9A84C 100%) !important;
  background-size: 200% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  text-shadow: 0 2px 20px rgba(232,204,122,.25) !important;
  animation: dsGoldShimmer 5s ease-in-out infinite !important;
}

/* ---- Labels (JOURS / HEURES...) ---- */
.ds-countdown-label,
.ds-fe-countdown-unit{
  font-family: 'DM Mono', monospace !important;
  font-size: 9.5px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.48) !important;
  margin-top: 8px !important;
}

/* ---- Séparateurs « : » lumineux pulsés ---- */
.ds-countdown-separator,
.ds-fe-countdown-sep{
  font-family: 'Playfair Display', serif !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  color: #E8CC7A !important;
  text-shadow: 0 0 12px rgba(232,204,122,.6) !important;
  animation: dsCountdownPulse 1.8s ease-in-out infinite !important;
  align-self: center !important;
  padding: 0 2px !important;
}
@keyframes dsCountdownPulse{
  0%, 100% { opacity: .35; }
  50%      { opacity: 1; }
}

/* ---- Grille : espacement aéré + alignement centré ---- */
.ds-countdown,
.ds-fe-countdown-grid{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
}

/* ---- Tag d'échéance : badge premium ---- */
.ds-countdown-tag,
.ds-fe-countdown-label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 18px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  background: linear-gradient(135deg, rgba(201,168,76,.14), rgba(232,204,122,.05)) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 999px !important;
}

/* ===== 47. QUESTIONNAIRE test-conformite — ronds de sélection + lisibilité =====
   Demande client : les ronds de choix manquaient sur test-conformite-fe.
   On définit les ronds (rdot) et on soigne la présentation des options. */
#quiz-container .ropt,
.quiz-wrap .ropt{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  cursor: pointer !important;
  padding: 14px 18px !important;
  margin-bottom: 10px !important;
  background: linear-gradient(135deg, rgba(13,27,62,.4), rgba(10,15,30,.5)) !important;
  border: 1.5px solid rgba(201,168,76,.18) !important;
  border-radius: 12px !important;
  transition: all .25s ease !important;
}
#quiz-container .ropt:hover,
.quiz-wrap .ropt:hover{
  border-color: rgba(232,204,122,.5) !important;
  background: linear-gradient(135deg, rgba(201,168,76,.08), rgba(13,27,62,.5)) !important;
  transform: translateX(2px) !important;
}
#quiz-container .ropt input,
.quiz-wrap .ropt input{
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}
/* Le rond de sélection */
#quiz-container .rdot,
.quiz-wrap .rdot{
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  border: 2px solid rgba(201,168,76,.5) !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  position: relative !important;
  transition: all .25s ease !important;
  background: transparent !important;
  display: block !important;
}
#quiz-container .ropt input:checked ~ .rdot,
.quiz-wrap .ropt input:checked ~ .rdot{
  border-color: #E8CC7A !important;
  background: linear-gradient(135deg, #E8CC7A, #C9A84C) !important;
  box-shadow: 0 0 12px rgba(232,204,122,.5) !important;
}
#quiz-container .ropt input:checked ~ .rdot::after,
.quiz-wrap .ropt input:checked ~ .rdot::after{
  content: '' !important;
  position: absolute !important;
  inset: 5px !important;
  background: #0A0F1E !important;
  border-radius: 50% !important;
}
/* Texte des options */
#quiz-container .rtxt,
.quiz-wrap .rtxt{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14.5px !important;
  color: rgba(255,255,255,.82) !important;
  line-height: 1.5 !important;
}
#quiz-container .ropt input:checked ~ .rtxt,
.quiz-wrap .ropt input:checked ~ .rtxt{
  color: #fff !important;
  font-weight: 600 !important;
}

/* ===== 48. QUESTIONNAIRES — typographie soignée (diagnostic-gratuit + test-conformite) =====
   Demande client : gros blocs de texte peu esthétiques. On soigne titres,
   descriptions, espacements et hiérarchie, comme la présentation V25.1. */

/* Titre de question */
.quiz-wrap .qcard h2,
#quiz-container .qcard h2{
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(22px, 2.4vw, 30px) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #fff !important;
  margin-bottom: 10px !important;
}
/* Sous-titre / description de question */
.quiz-wrap .qcard .qcard-sub,
.quiz-wrap .qcard > p,
#quiz-container .qcard .qcard-sub,
#quiz-container .qcard > p{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,.6) !important;
  margin-bottom: 24px !important;
  max-width: 620px !important;
}
/* Étiquette d'étape (ÉTAPE X SUR Y) */
.quiz-wrap .qcard-tag,
#quiz-container .qcard-tag{
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  margin-bottom: 16px !important;
  display: inline-block !important;
}
/* Sous-groupes de questions (titre de bloc) */
.quiz-wrap .rrow-title,
.quiz-wrap .q-group-title,
#quiz-container .rrow-title,
#quiz-container .q-group-title{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  color: rgba(255,255,255,.75) !important;
  margin: 20px 0 12px !important;
}
/* Carte du quiz : respiration + cadre élégant */
.quiz-wrap .qcard,
#quiz-container .qcard{
  padding: clamp(24px, 3vw, 40px) !important;
  background: linear-gradient(165deg, rgba(20,30,58,.5), rgba(10,15,30,.6)) !important;
  border: 1px solid rgba(201,168,76,.14) !important;
  border-radius: 18px !important;
}
/* Boutons de navigation du quiz */
.quiz-wrap .btn-next,
.quiz-wrap .btn-prev,
#quiz-container .btn-next,
#quiz-container .btn-prev{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all .25s ease !important;
}
.quiz-wrap .btn-prev,
#quiz-container .btn-prev{
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: rgba(255,255,255,.7) !important;
}
.quiz-wrap .btn-prev:hover,
#quiz-container .btn-prev:hover{
  border-color: rgba(232,204,122,.5) !important;
  color: #E8CC7A !important;
}
.quiz-wrap .btn-next:not([style*="gradient"]),
#quiz-container .btn-next:not([style*="gradient"]){
  background: linear-gradient(135deg, #C9A84C, #E8CC7A) !important;
  color: #fff !important;
}
/* Barre de progression */
.quiz-wrap .q-progress-fill,
#quiz-container .q-progress-fill,
#qprog{
  background: linear-gradient(90deg, #C9A84C, #E8CC7A) !important;
  box-shadow: 0 0 10px rgba(232,204,122,.4) !important;
}

/* ===== 49. CARD AUTO-ENTREPRENEUR (tarifs) — ajustements ciblés =====
   Demande client (UNIQUEMENT sur la card AE) :
   - centrer le bandeau « OFFRE PHARE »
   - le titre/mentions restent alignés avec les cards voisines
   La card AE est la seule .ds-tarifs-micro-card.featured. */
.ds-tarifs-micro-card.featured .ds-tarifs-micro-card-badge{
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  top: -12px !important;
  white-space: nowrap !important;
}
/* On laisse de la place en haut pour le badge centré */
.ds-tarifs-micro-card.featured{
  overflow: visible !important;
}

/* ===== 50. PRIX DS COPILOT — « /mois » non doré =====
   Demande client : retirer le doré sur le « /mois » à côté des prix HT des
   options DS Copilot. Le « HT » reste doré, le « /mois » redevient discret. */
.ds-tarifs-option-period{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.45) !important;
  -webkit-text-fill-color: rgba(255,255,255,.45) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  animation: none !important;
  margin-left: 2px !important;
}

/* ===== 51. QUESTIONNAIRE — sous-questions (q-label / q-hint) soignées =====
   Demande client : à partir de la page 2, les consignes (sous-questions FE)
   étaient en monospace doré + gros bloc de texte brut. Le sélecteur large
   [class*="-label"] forçait DM Mono sur q-label. On rétablit une présentation
   élégante et cohérente avec la page 1. */
.quiz-wrap .q-label,
#quiz-container .q-label{
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #fff !important;
  line-height: 1.35 !important;
  margin: 22px 0 6px !important;
}
.quiz-wrap .q-hint,
#quiz-container .q-hint{
  display: block !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,.5) !important;
  line-height: 1.55 !important;
  margin: 0 0 16px !important;
  max-width: 640px !important;
}
/* Espace entre les groupes de réponses */
.quiz-wrap .rgroup,
#quiz-container .rgroup{
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}

/* ===== 52. RESULT — section upsell « Diagnostic Premium » soignée =====
   Demande client : la présentation du score final était un gros bloc de texte
   brut. On structure proprement l'encart premium (titre, features en grille,
   urgence, prix, CTA) au thème navy/or. */
.result-card .cta-premium{
  margin-top: 28px !important;
  padding: 28px !important;
  background: linear-gradient(165deg, rgba(201,168,76,.08), rgba(13,27,62,.4)) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 18px !important;
}
.result-card .cta-premium-header{
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 18px !important;
  margin-bottom: 20px !important;
}
.result-card .cta-premium-title{
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 8px !important;
}
.result-card .cta-premium-sub{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,.6) !important;
}
.result-card .cta-premium-badge{
  flex-shrink: 0 !important;
  padding: 6px 14px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  background: rgba(201,168,76,.12) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
/* Features en grille 2 colonnes avec puce dorée */
.result-card .cta-feats{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px 20px !important;
  margin-bottom: 20px !important;
}
.result-card .cta-feat{
  position: relative !important;
  padding-left: 22px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.8) !important;
  line-height: 1.4 !important;
}
.result-card .cta-feat::before{
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  color: #E8CC7A !important;
  font-weight: 700 !important;
}
/* Encart urgence FE */
.result-card .cta-fe-urgence{
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  margin-bottom: 20px !important;
  background: rgba(239,68,68,.08) !important;
  border: 1px solid rgba(239,68,68,.22) !important;
  border-radius: 12px !important;
}
.result-card .cta-fe-dot{
  width: 8px !important; height: 8px !important;
  border-radius: 50% !important;
  background: #EF4444 !important;
  flex-shrink: 0 !important;
  margin-top: 6px !important;
  box-shadow: 0 0 10px rgba(239,68,68,.6) !important;
}
.result-card .cta-fe-txt{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: rgba(255,255,255,.75) !important;
}
.result-card .cta-fe-txt strong{ color: #E8CC7A !important; }
/* Ligne de prix */
.result-card .cta-price-row{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 18px !important;
  margin-bottom: 18px !important;
  background: rgba(255,255,255,.03) !important;
  border-radius: 14px !important;
  flex-wrap: wrap !important;
}
.result-card .cta-amount{
  font-family: 'Playfair Display', serif !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  color: #E8CC7A !important;
  line-height: 1 !important;
}
.result-card .cta-amount-ttc{
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.4) !important;
  margin-top: 4px !important;
}
.result-card .cta-amount-note{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.55) !important;
  margin-top: 6px !important;
}
.result-card .cta-deduction{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12.5px !important;
  color: #4ADE80 !important;
  line-height: 1.4 !important;
  max-width: 280px !important;
}
/* Boutons CTA du result */
.result-card .btn-cta-primary{
  display: block !important;
  text-align: center !important;
  padding: 15px 24px !important;
  margin-bottom: 10px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: linear-gradient(135deg, #C9A84C, #E8CC7A) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: all .25s ease !important;
}
.result-card .btn-cta-primary:hover{
  box-shadow: 0 10px 30px rgba(201,168,76,.35) !important;
  transform: translateY(-2px) !important;
}
.result-card .btn-cta-secondary{
  display: block !important;
  text-align: center !important;
  padding: 13px 24px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,.7) !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: all .25s ease !important;
}
.result-card .btn-cta-secondary:hover{
  border-color: rgba(232,204,122,.5) !important;
  color: #E8CC7A !important;
}
@media (max-width: 640px){
  .result-card .cta-feats{ grid-template-columns: 1fr !important; }
  .result-card .cta-premium-header{ flex-direction: column !important; }
}

/* ===== 53. QUESTIONNAIRES — message de rappel « tout cocher » =====
   Demande client : obliger à répondre à toutes les questions avant de continuer,
   avec un message de rappel. */
.q-reminder{
  display: none;
  margin-top: 18px;
  padding: 12px 16px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #FCA5A5;
  background: rgba(239,68,68,.1);
  border: 1px solid rgba(239,68,68,.3);
  border-radius: 10px;
  animation: dsReminderShake .4s ease;
}
.q-reminder.show{ display: block; }
@keyframes dsReminderShake{
  0%,100%{ transform: translateX(0); }
  25%{ transform: translateX(-5px); }
  75%{ transform: translateX(5px); }
}
/* Surlignage des groupes non répondus */
.q-missing{
  animation: dsMissingPulse 1.1s ease 2;
  border-radius: 12px;
}
@keyframes dsMissingPulse{
  0%,100%{ box-shadow: 0 0 0 0 rgba(239,68,68,0); }
  50%{ box-shadow: 0 0 0 3px rgba(239,68,68,.35); }
}

/* ===== 54. COMPTEURS FOMO — halo doré flash pulsant autour des blocs =====
   Demande client : PAS de pulse sur les chiffres eux-mêmes. À la place, un halo
   flash lumineux doré qui pulse à chaque seconde AUTOUR de chaque bloc compteur
   chiffré, pour capter le regard et renforcer le FOMO. */

/* Les chiffres ne pulsent plus (on garde uniquement le shimmer doré de base) */
.ds-countdown-value.ds-cd-pulse,
.ds-fe-countdown-value.ds-cd-pulse{
  animation: dsGoldShimmer 5s ease-in-out infinite !important;
}

/* Halo doré flash lumineux qui pulse autour du bloc à chaque seconde */
@keyframes dsCountdownHaloFlash{
  0%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.5),
      0 0 0 0 rgba(232,204,122,0),
      0 0 0 1px rgba(232,204,122,.06) inset;
  }
  30%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.5),
      0 0 34px 10px rgba(248,231,167,.7),
      0 0 70px 20px rgba(232,204,122,.45),
      0 0 0 2px rgba(232,204,122,.5) inset;
  }
  100%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.5),
      0 0 0 0 rgba(232,204,122,0),
      0 0 0 1px rgba(232,204,122,.06) inset;
  }
}
/* Glow doré qui pulse sur les chiffres eux-mêmes, synchronisé */
@keyframes dsCountdownDigitGlow{
  0%, 100%{ filter: drop-shadow(0 0 0 rgba(232,204,122,0)); }
  30%{ filter: drop-shadow(0 0 14px rgba(248,231,167,.9)) drop-shadow(0 0 28px rgba(232,204,122,.6)); }
}
.ds-countdown-block.ds-cd-halo,
.ds-fe-countdown-block.ds-cd-halo{
  animation: dsCountdownHaloFlash 1s ease-out !important;
}
.ds-countdown-block.ds-cd-halo .ds-countdown-value,
.ds-fe-countdown-block.ds-cd-halo .ds-fe-countdown-value{
  animation: dsGoldShimmer 5s ease-in-out infinite, dsCountdownDigitGlow 1s ease-out !important;
}

/* ===== 55. SECTION DS COPILOT — header centré comme les autres sections =====
   Demande client : le header était en 3 colonnes désordonnées (tag à gauche,
   gros titre au centre, texte à droite). La classe .ds-copilot-header est aussi
   utilisée dans le mockup en flex, ce qui cassait le header de section.
   On force le header de SECTION à être centré et empilé verticalement. */
.ds-copilot-section > .ds-copilot-inner > .ds-copilot-header,
.ds-copilot-section .ds-copilot-inner > header.ds-copilot-header{
  display: block !important;
  text-align: center !important;
  max-width: 780px !important;
  margin: 0 auto 56px !important;
}
.ds-copilot-section .ds-copilot-header .ds-copilot-tag{
  display: inline-block !important;
  margin: 0 auto 18px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  padding: 8px 18px !important;
  background: linear-gradient(135deg, rgba(201,168,76,.12), rgba(232,204,122,.05)) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 999px !important;
}
.ds-copilot-section .ds-copilot-header .ds-copilot-title{
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(32px, 4vw, 48px) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  color: #fff !important;
  margin: 0 0 20px !important;
}
.ds-copilot-section .ds-copilot-header .ds-copilot-subtitle{
  display: block !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,.6) !important;
  max-width: 620px !important;
  margin: 0 auto !important;
}

/* ===== 56. LOGOS — tailles réduites et optimisées (navbar + footer) =====
   Demande client : logo encore trop massif vs les boutons de la navbar (34px).
   Navbar 30px (légèrement sous le bouton, élégant), footer 34px (un peu plus
   présent car zone moins dense). Tailles différentes navbar/footer assumées. */
nav.ds-nav .ds-nav-brand,
nav.ds-nav .ds-nav-brand .ds-nav-logo-img,
nav.ds-nav .ds-nav-brand img{
  height: 30px !important;
  width: auto !important;
  max-width: 200px !important;
}
.ds-footer-logo,
.ds-footer-logo .ds-footer-logo-img,
.ds-footer-logo-img,
#ds-logo-footer img{
  height: 34px !important;
  width: auto !important;
  max-width: 190px !important;
}
@media (max-width: 680px){
  nav.ds-nav .ds-nav-brand,
  nav.ds-nav .ds-nav-brand img{ height: 27px !important; max-width: 160px !important; }
  .ds-footer-logo .ds-footer-logo-img{ height: 30px !important; }
}

/* ===== 57. CORRECTION — « r » de « métier » tronqué (titre verticaux) =====
   Demande client : le r du mot métier (en italique doré, background-clip:text)
   était rogné. On ajoute de l'air à droite et on garantit l'overflow visible. */
.ds-verticaux-v3-title,
.ds-verticaux-v3-title em{
  overflow: visible !important;
}
.ds-verticaux-v3-title em{
  display: inline-block !important;
  padding-right: 0.14em !important;
  margin-right: -0.04em !important;
}

/* ===== 58. FOOTER — réorganisation (contact sous logo, social dessous, 5 colonnes) =====
   Demande client : contact juste sous le logo (texte inutile retiré), réseaux
   sociaux juste en dessous, et « Légal » sur la même ligne après « Services ». */
.ds-footer-inner{
  gap: clamp(24px, 3vw, 48px) !important;
}
/* Contact sous le logo : style aéré */
.ds-footer-brand-contact{
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}
.ds-footer-brand-contact li{
  margin-bottom: 8px !important;
}
.ds-footer-brand-col .ds-footer-social{
  margin-top: 4px !important;
}
@media (max-width: 980px){
  .ds-footer-inner{ grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 560px){
  .ds-footer-inner{ grid-template-columns: 1fr !important; }
}

/* ===== 59. FOOTER — réduction des espaces vides (moins massif) + Facebook =====
   Demande client : footer trop imposant, supprimer les espaces vides, ajouter
   Facebook (fait en HTML), retirer la colonne Légal (les liens sont déjà en bas).
   Harmonisé sur toutes les pages. */
footer.ds-footer-signature{
  margin-top: 72px !important;
}
.ds-footer-inner{
  padding-top: 48px !important;
  padding-bottom: 36px !important;
}
/* Colonnes : titres et liens plus compacts */
.ds-footer-signature .ds-footer-title{
  margin-bottom: 14px !important;
}
.ds-footer-links li{
  margin-bottom: 7px !important;
}
.ds-footer-links{
  line-height: 1.4 !important;
}
/* Brand : contact et social compacts */
.ds-footer-brand-contact{
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}
.ds-footer-brand-contact li{
  margin-bottom: 7px !important;
}
/* Bande légale du bas plus compacte */
.ds-footer-legal-band{
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}
.ds-footer-legal-text{
  margin-bottom: 14px !important;
}
/* Réseaux sociaux : icônes alignées avec Facebook */
.ds-footer-social{
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

/* ===== 60. NAVBAR — taille de police des liens légèrement augmentée =====
   Demande client : police des liens de la navbar trop petite. On augmente
   légèrement (sans toucher au logo ni au bouton CTA, déjà parfaits).
   Harmonisé sur toutes les pages. */
nav.ds-nav .ds-nav-links a{
  font-size: 14.5px !important;
}
@media (max-width: 1180px){
  nav.ds-nav .ds-nav-links a{ font-size: 12.5px !important; }
}

/* ===== 61. DIAGNOSTIC PREMIUM — 4 étapes process sur une seule ligne =====
   Demande client : la 3e card passait en dessous (les flèches comptaient comme
   colonnes de grille). Grille en 7 colonnes (step/flèche alternés), cards
   réduites pour tenir sur une ligne. */
.ds-diag-process-step{
  padding: 20px 16px !important;
}
.ds-diag-process-num{
  font-size: 40px !important;
  margin-bottom: 10px !important;
}
.ds-diag-process-content h3{
  font-size: 16px !important;
}
.ds-diag-process-content p{
  font-size: 12.5px !important;
  line-height: 1.45 !important;
}
.ds-diag-process-arrow{
  font-size: 22px !important;
  color: #E8CC7A !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
@media (max-width: 900px){
  .ds-diag-process-steps{
    grid-template-columns: 1fr 1fr !important;
  }
  .ds-diag-process-arrow{ display: none !important; }
}
@media (max-width: 520px){
  .ds-diag-process-steps{ grid-template-columns: 1fr !important; }
}

/* ===== 62. QUIZ — cerclage doré sur les boutons continuer / voir mon score =====
   Demande client : test-conformite-fe n'avait pas le cerclage doré des boutons
   du questionnaire diagnostic-gratuit (son style inline forçait un bouton plein).
   On harmonise : bouton doré avec un cerclage lumineux doré sur les deux quiz. */
.quiz-wrap .btn-next,
.quiz-wrap .btn-final,
#quiz-container .btn-next,
#quiz-container .btn-final{
  background: linear-gradient(135deg, #C9A84C, #E8CC7A) !important;
  border: 1.5px solid rgba(248,231,167,.9) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(201,168,76,.35), 0 0 0 1px rgba(232,204,122,.25) !important;
  font-weight: 700 !important;
}
.quiz-wrap .btn-next:hover,
.quiz-wrap .btn-final:hover,
#quiz-container .btn-next:hover,
#quiz-container .btn-final:hover{
  box-shadow: 0 6px 24px rgba(201,168,76,.5), 0 0 0 2px rgba(248,231,167,.5) !important;
  transform: translateY(-1px) !important;
  opacity: 1 !important;
}

/* ===== 63. QUIZ dg — encadré de saisie optionnel agrandi (étape 5) =====
   Demande client : l'encadré optionnel (textarea) était trop petit/tassé. */
.quiz-wrap .ftxt,
#quiz-container .ftxt{
  width: 100% !important;
  min-height: 120px !important;
  padding: 14px 16px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #fff !important;
  background: rgba(13,27,62,.4) !important;
  border: 1.5px solid rgba(201,168,76,.25) !important;
  border-radius: 12px !important;
  resize: vertical !important;
  transition: border-color .25s ease !important;
}
.quiz-wrap .ftxt:focus,
#quiz-container .ftxt:focus{
  outline: none !important;
  border-color: rgba(232,204,122,.6) !important;
}
.quiz-wrap .ftxt::placeholder,
#quiz-container .ftxt::placeholder{
  color: rgba(255,255,255,.35) !important;
}
/* Inputs texte de l'étape coordonnées : cohérents */
.quiz-wrap .finput,
#quiz-container .finput{
  width: 100% !important;
  padding: 12px 16px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  color: #fff !important;
  background: rgba(13,27,62,.4) !important;
  border: 1.5px solid rgba(201,168,76,.25) !important;
  border-radius: 10px !important;
  transition: border-color .25s ease !important;
}
.quiz-wrap .finput:focus,
#quiz-container .finput:focus{
  outline: none !important;
  border-color: rgba(232,204,122,.6) !important;
}
.quiz-wrap .finput::placeholder,
#quiz-container .finput::placeholder{
  color: rgba(255,255,255,.35) !important;
}

/* ===== 64. RESULT dg — bloc « choix du pack » premium (avant l'encart Premium) =====
   Demande client : la première partie (niveau, badge, pack recommandé) avait un
   style trop basique. On la rend premium SANS toucher à l'encart Diagnostic
   Premium en dessous (.cta-premium), qui reste tel quel. */
.result-card .result-niveau{
  font-family: 'Playfair Display', serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-top: 18px !important;
  line-height: 1.3 !important;
}
.result-card .result-badge{
  display: inline-block !important;
  margin-top: 14px !important;
  padding: 8px 20px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: .08em !important;
  color: #E8CC7A !important;
  background: linear-gradient(135deg, rgba(201,168,76,.18), rgba(232,204,122,.06)) !important;
  border: 1px solid rgba(201,168,76,.4) !important;
  border-radius: 999px !important;
}
/* Les 3 axes (FE / Pilotage / Finances) plus élégants */
.result-card .result-axes{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
  margin-top: 26px !important;
}
.result-card .result-axe{
  padding: 16px 12px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(201,168,76,.15) !important;
  border-radius: 14px !important;
  text-align: center !important;
}
.result-card .result-axe-n{
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  color: #E8CC7A !important;
  line-height: 1 !important;
  margin-bottom: 6px !important;
}
.result-card .result-axe-l{
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.55) !important;
}
/* Bloc « Pack DStart recommandé » premium */
.result-card .result-pack{
  background: linear-gradient(135deg, rgba(201,168,76,.12), rgba(13,27,62,.5)) !important;
  border: 1px solid rgba(201,168,76,.35) !important;
  border-radius: 16px !important;
  padding: 22px 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  flex-wrap: wrap !important;
  margin-top: 24px !important;
}
.result-card .rpack-label{
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.55) !important;
  display: block !important;
  margin-bottom: 6px !important;
}
.result-card .rpack-name{
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #fff !important;
}
.result-card .rpack-price{
  font-family: 'Playfair Display', serif !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  color: #E8CC7A !important;
  line-height: 1 !important;
  text-align: right !important;
}
.result-card .rpack-sub{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.5) !important;
  text-align: right !important;
  margin-top: 4px !important;
}


/* ===== 99. PATCH FINAL — SERPENTINE VERROUILLÉE (audit chirurgical) =====
   Objectif: priorité visuelle, tracé devant le contenu, pas visible à l'ouverture,
   apparition au scroll vers ~3/4 d'écran, arrivée sur le logo footer. */
.ds-serpentine-layer{
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 940 !important;
  opacity: 0;
  transition: opacity .22s ease;
}
.ds-serpentine-layer.is-live{ opacity: 1; }
.ds-serpentine-track,
.ds-serpentine-svg,
.ds-serpentine-orn{ pointer-events:none !important; }
.ds-serpentine-track{
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  will-change: transform;
}
.ds-serpentine-svg{
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}
.ds-serpentine-trail-soft{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 10.5 !important;
  opacity: .11 !important;
  filter: blur(7px) !important;
}
.ds-serpentine-trail{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 2.2 !important;
  opacity: .97 !important;
  filter: drop-shadow(0 0 10px rgba(232,204,122,.80)) !important;
}
.ds-serpentine-head,
.ds-serpentine-head-ring{
  opacity: 0;
  transition: opacity .22s ease;
}
.ds-serpentine-layer.is-live .ds-serpentine-head,
.ds-serpentine-layer.is-live .ds-serpentine-head-ring{
  opacity: 1;
}
.ds-serpentine-orn{ z-index: 1 !important; }
.ds-serpentine-orn.is-visible{ opacity: .10 !important; }
.ds-serpentine-orn.is-lit{ opacity: .18 !important; }
/* On garde la navbar au-dessus, mais la ligne passe devant le reste */
.ds-nav,
.ds-navbar,
header.ds-nav,
nav.ds-nav,
.ds-mobile-menu,
.ds-nav-panel{ z-index: 1000 !important; }
/* Le footer et son logo restent la cible finale visuelle */
footer.ds-footer-signature,
#ds-logo-footer,
.ds-footer-logo{ position: relative; }
#ds-logo-footer.ds-serpentine-arrived img,
.ds-footer-logo.ds-serpentine-arrived img{
  filter: drop-shadow(0 0 22px rgba(232,204,122,.78)) brightness(1.18) !important;
  transition: filter .7s ease;
}
@media (max-width: 980px){
  .ds-serpentine-trail-soft{ stroke-width: 8px !important; opacity:.095 !important; }
  .ds-serpentine-trail{ stroke-width: 1.95px !important; }
  .ds-serpentine-orn{ width: 96px !important; height: 96px !important; }
}
@media (max-width: 760px){
  .ds-serpentine-layer{ display:block !important; z-index: 920 !important; }
  .ds-serpentine-trail-soft{ stroke-width: 6px !important; opacity:.08 !important; }
  .ds-serpentine-trail{ stroke-width: 1.7px !important; }
  .ds-serpentine-orn{ display:none !important; }
}


/* ===== 100. PATCH URGENT — SERPENTINE CONTINUE SUR TOUTE LA PAGE =====
   Correction du bug V précédente :
   Le SVG/track était forcé en height:100% !important, donc le tracé complet
   était compressé dans 100vh puis sortait du viewport après le hero.
   On garde le calque fixe, mais le track + SVG reprennent la hauteur réelle
   du document via une variable alimentée par le JS. */
.ds-serpentine-layer{
  height: 100vh !important;
  overflow: hidden !important;
}
.ds-serpentine-track,
.ds-serpentine-svg{
  height: var(--ds-serp-doc-h, 100vh) !important;
  min-height: var(--ds-serp-doc-h, 100vh) !important;
}
.ds-serpentine-svg{
  overflow: visible !important;
}


/* =====================================================================
   DSTART — V10 MASTER PATCH
   Objet : stabilisation chirurgicale polices/prix/badges/footer/questionnaires
   Base conservée : Production 9 + serpentine V3 validée.
   ===================================================================== */

/* 1) Socle typographique stable : évite que des sélecteurs globaux tardifs
   changent la police de labels, prix, formulaires ou CTA non prévus. */
html body,
body input,
body select,
body textarea,
body button {
  font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

h1, h2, h3,
.ds-hero-v3-title,
.ds-packs-hero-title,
.ds-tarifs-packs-hero-title,
.ds-fe-hero-title,
.ds-quiz-hero-title,
.ds-page-title,
.ds-section-title,
.ds-packs-title,
.ds-diagnostics-title,
.ds-copilot-title,
.ds-methode-title,
.ds-pack-name,
.ds-tarifs-pack-name,
.ds-diag-title,
.result-card .cta-premium-title,
.reco-box h3,
.upsell-box h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: -0.025em !important;
  overflow: visible !important;
}

/* Tags/badges : DM Mono uniquement sur les vrais micro-labels, pas sur tous les "-label". */
.ds-hero-v3-tag,
.ds-packs-hero-tag,
.ds-tarifs-packs-hero-tag,
.ds-fe-hero-tag,
.ds-quiz-hero-tag,
.ds-verticaux-v3-tag,
.ds-diagnostics-tag,
.ds-packs-tag,
.ds-copilot-tag,
.ds-methode-tag,
.ds-micro-tag,
.ds-tarifs-micro-tag,
.ds-tarifs-options-tag,
.ds-countdown-tag,
.ds-pack-popular-badge,
.ds-pack-limited-badge,
.ds-tarifs-pack-badge,
.ds-tarifs-pack-limited-badge,
.ds-tarifs-fe-card-badge,
.ds-tarifs-micro-card-badge,
.ds-micro-card-badge,
.result-badge,
.reco-badge,
.cta-premium-badge {
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  letter-spacing: .10em !important;
}

/* Sous-titres / taglines : on neutralise l'effet parasite du global [class*="-tag"]. */
.ds-pack-tagline,
.ds-tarifs-pack-tagline,
.ds-tarifs-micro-card-tagline,
.ds-pack-desc,
.ds-tarifs-pack-desc,
.ds-diag-desc,
.ds-form-note,
.q-hint,
.rpack-sub,
.cta-amount-note,
.cta-fe-txt,
.cta-feat,
.ds-footer a,
.ds-footer p,
.ds-footer li {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  letter-spacing: normal !important;
}

/* 2) Prix : Playfair stable, pas de coupe verticale, pas de rognage par la card. */
.ds-pack-price,
.ds-pack-price-block,
.ds-pack-price-main,
.ds-diag-price-main,
.ds-diag-price-block,
.ds-form-price,
.ds-tarifs-pack-price,
.ds-tarifs-pack-price-main,
.ds-tarifs-fe-card-price,
.ds-tarifs-micro-card-price-main,
.ds-tarifs-option-price,
.ds-fe-offre-price,
.reco-price,
.result-card .cta-price-row {
  overflow: visible !important;
  min-width: 0 !important;
}

.ds-pack-amount,
.ds-diag-amount,
.ds-form-price-amount,
.ds-tarifs-pack-price-amount,
.ds-tarifs-fe-card-amount,
.ds-tarifs-micro-card-amount,
.ds-tarifs-option-amount,
.ds-fe-offre-amount,
.reco-price .amount,
.result-card .cta-amount,
.amount {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 900 !important;
  line-height: 1.16 !important;
  padding: .02em .01em .08em !important;
  display: inline-block !important;
  overflow: visible !important;
  letter-spacing: -0.035em !important;
}

.ds-pack-suffix,
.ds-tarifs-pack-price-suffix,
.ds-tarifs-fe-card-suffix,
.ds-tarifs-micro-card-suffix,
.ds-tarifs-option-suffix,
.ds-fe-offre-suffix,
.reco-price .suffix,
.ds-pack-engagement,
.ds-pack-setup,
.ds-tarifs-pack-price-period,
.ds-tarifs-pack-price-ttc {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  letter-spacing: normal !important;
  line-height: 1.35 !important;
}

/* 3) Badges et rubans : jamais coupés, toujours au-dessus de leur card. */
.ds-pack-card,
.ds-pack-card.popular,
.ds-pack-card.limited,
.ds-tarifs-pack-card,
.ds-tarifs-pack-card.featured,
.ds-tarifs-fe-card,
.ds-tarifs-micro-card,
.ds-fe-offre-card,
.ds-micro-card,
.ds-diag-card,
.result-card,
.reco-box,
.upsell-box {
  overflow: visible !important;
}

.ds-pack-popular-badge,
.ds-pack-limited-badge,
.ds-tarifs-pack-badge,
.ds-tarifs-pack-limited-badge,
.ds-tarifs-fe-card-badge,
.ds-tarifs-micro-card-badge,
.ds-micro-card-badge,
.result-badge,
.reco-badge {
  position: relative;
  z-index: 20 !important;
  white-space: nowrap !important;
}

/* 4) Questionnaires : labels lisibles, boutons fiables, blocs respirants. */
.quiz-wrap label,
.quiz-wrap .q-label,
#quiz-container label,
#quiz-container .q-label {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  line-height: 1.45 !important;
}

.quiz-wrap .qcard-tag,
#quiz-container .qcard-tag {
  font-family: 'DM Mono', ui-monospace, monospace !important;
  letter-spacing: .10em !important;
}

.quiz-wrap .btn-next,
.quiz-wrap .btn-prev,
.quiz-wrap .btn-final,
.quiz-wrap .btn-share,
#quiz-container .btn-next,
#quiz-container .btn-prev {
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
  user-select: none !important;
}

.quiz-wrap .qcard,
#quiz-container .qcard {
  overflow: visible !important;
}

/* 5) CTA dorés : lisibilité premium sur or, sans toucher les boutons ghost. */
.ds-btn-gold,
.ds-btn-primary,
.ds-nav-cta,
.ds-pack-card.popular .ds-btn-pack,
.ds-pack-card.limited .ds-btn-pack,
.ds-tarifs-pack-card.featured .ds-btn-gold,
.btn-cta-primary,
.btn-reco,
.btn-upsell {
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  text-shadow: none !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-weight: 800 !important;
}

/* 6) Footer : taille unique finale du logo et colonnes sans faux cadres. */
#ds-logo-footer img,
.ds-footer-logo img,
.ds-footer-logo .ds-footer-logo-img,
.ds-footer-logo-img {
  height: 34px !important;
  width: auto !important;
  max-width: 190px !important;
  object-fit: contain !important;
}

.ds-footer-inner > *,
.ds-footer-brand-col,
.ds-footer-col {
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 680px) {
  #ds-logo-footer img,
  .ds-footer-logo img,
  .ds-footer-logo .ds-footer-logo-img,
  .ds-footer-logo-img {
    height: 30px !important;
    max-width: 165px !important;
  }

  .ds-pack-popular-badge,
  .ds-pack-limited-badge,
  .ds-tarifs-pack-badge,
  .ds-tarifs-pack-limited-badge,
  .ds-tarifs-fe-card-badge,
  .ds-tarifs-micro-card-badge,
  .ds-micro-card-badge,
  .result-badge,
  .reco-badge {
    white-space: normal !important;
    text-align: center !important;
  }

  .result-card .cta-price-row,
  .reco-price {
    align-items: flex-start !important;
  }
}


/* =====================================================================
   DSTART — V10.1 CIBLAGE FINAL
   Zones validées : mockups, footer, FOMO, résultat diagnostic gratuit.
   ===================================================================== */

/* 1) Mockups : scores non tronqués après suppression Warning */
.ds-score-main,
.ds-diag-mockup-score{
  overflow: visible !important;
  align-items: baseline !important;
}
.ds-score-value,
.ds-diag-mockup-score-value,
.ds-mockup-score .ds-score-value{
  line-height: 1.14 !important;
  padding: .02em .025em .08em !important;
  margin-bottom: -.03em !important;
  overflow: visible !important;
  display: inline-block !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.ds-score-header{
  justify-content: flex-start !important;
}
.ds-diag-mockup-score{
  margin-bottom: 22px !important;
}

/* 2) Footer remanié : métiers + suite verticaux fusionnés et présentés proprement */
.ds-footer-inner-v10-1{
  grid-template-columns: minmax(245px, 1.18fr) minmax(220px, .95fr) minmax(220px, .9fr) minmax(190px, .75fr) !important;
  align-items: flex-start !important;
}
.ds-footer-col-verticals .ds-footer-title,
.ds-footer-col-verticals-secondary .ds-footer-title{
  color: #F8E7A7 !important;
}
.ds-footer-links-v10-1{
  display: grid !important;
  gap: 10px !important;
}
.ds-footer-links-v10-1 li{
  margin: 0 !important;
}
.ds-footer-links-v10-1 a{
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 9px 11px !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(232,204,122,.08) !important;
  text-decoration: none !important;
  transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease !important;
}
.ds-footer-links-v10-1 a:hover{
  transform: translateY(-1px) !important;
  background: rgba(232,204,122,.055) !important;
  border-color: rgba(232,204,122,.24) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.22) !important;
}
.ds-footer-links-v10-1 strong{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  color: rgba(255,255,255,.90) !important;
}
.ds-footer-links-v10-1 span{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
  color: rgba(255,255,255,.48) !important;
}
.ds-footer-links-v10-1-secondary a{
  background: rgba(255,255,255,.018) !important;
}
@media (max-width: 1100px){
  .ds-footer-inner-v10-1{
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 620px){
  .ds-footer-inner-v10-1{
    grid-template-columns: 1fr !important;
  }
}

/* 3) FOMO : halo plus voyant autour des cadres de chiffres */
.ds-countdown-block,
.ds-fe-countdown-block{
  position: relative !important;
  padding: clamp(14px, 2vw, 20px) clamp(15px, 2.2vw, 22px) !important;
  min-width: clamp(72px, 8vw, 105px) !important;
  border-radius: 20px !important;
  border: 1px solid rgba(232,204,122,.24) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(248,231,167,.12), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.45),
    0 0 0 1px rgba(232,204,122,.08) inset,
    0 0 24px rgba(232,204,122,.12) !important;
  overflow: visible !important;
}
.ds-countdown-block::before,
.ds-fe-countdown-block::before{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius: 25px;
  pointer-events:none;
  opacity:.55;
  background: radial-gradient(circle at 50% 50%, rgba(248,231,167,.24), rgba(232,204,122,.07) 45%, transparent 72%);
  filter: blur(10px);
  z-index:-1;
}
@keyframes dsCountdownHaloFlashV10_1{
  0%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.45),
      0 0 0 1px rgba(232,204,122,.08) inset,
      0 0 18px rgba(232,204,122,.10);
  }
  28%{
    box-shadow:
      0 20px 52px rgba(0,0,0,.52),
      0 0 0 2px rgba(248,231,167,.58) inset,
      0 0 34px 9px rgba(248,231,167,.58),
      0 0 78px 24px rgba(232,204,122,.42);
  }
  100%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.45),
      0 0 0 1px rgba(232,204,122,.08) inset,
      0 0 18px rgba(232,204,122,.10);
  }
}
.ds-countdown-block.ds-cd-halo,
.ds-fe-countdown-block.ds-cd-halo{
  animation: dsCountdownHaloFlashV10_1 1s ease-out !important;
}
.ds-countdown-value,
.ds-fe-countdown-value{
  position: relative !important;
  z-index: 1 !important;
}

/* 4) Diagnostic gratuit : résultat premium, insights lisibles, pack/prix centrés, mention ordonnance encadrée */
.result-card .result-body{
  background:
    radial-gradient(circle at 50% 0%, rgba(201,168,76,.065), transparent 45%),
    linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
}
.result-card .insights{
  display: grid !important;
  gap: 12px !important;
  margin: 0 0 24px !important;
}
.result-card .ins{
  display: grid !important;
  grid-template-columns: 34px 1fr !important;
  gap: 13px !important;
  align-items: flex-start !important;
  padding: 16px 17px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(13,27,62,.10) !important;
  background: linear-gradient(145deg, rgba(13,27,62,.045), rgba(255,255,255,.92)) !important;
  box-shadow: 0 12px 28px rgba(13,27,62,.055) !important;
}
.result-card .ins.crit{
  border-color: rgba(239,68,68,.20) !important;
  background: linear-gradient(145deg, rgba(239,68,68,.065), rgba(255,255,255,.95)) !important;
}
.result-card .ins.warn,
.result-card .ins.fe{
  border-color: rgba(201,168,76,.22) !important;
  background: linear-gradient(145deg, rgba(201,168,76,.075), rgba(255,255,255,.95)) !important;
}
.result-card .ins.good{
  border-color: rgba(34,197,94,.20) !important;
  background: linear-gradient(145deg, rgba(34,197,94,.065), rgba(255,255,255,.95)) !important;
}
.result-card .ins-ic{
  width: 34px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: rgba(13,27,62,.075) !important;
  font-size: 16px !important;
}
.result-card .ins-tx{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13.6px !important;
  line-height: 1.62 !important;
  color: rgba(13,27,62,.74) !important;
}
.result-card .ins-tx strong{
  color: #0D1B3E !important;
  font-weight: 850 !important;
}
.result-card .result-pack{
  align-items: center !important;
  padding: 24px !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(232,204,122,.16), transparent 42%),
    linear-gradient(145deg, #0D1B3E 0%, #07101F 100%) !important;
  border: 1px solid rgba(232,204,122,.24) !important;
  box-shadow: 0 18px 45px rgba(7,16,31,.22) !important;
}
.result-card .rpack-copy{
  min-width: min(100%, 320px) !important;
}
.result-card .rpack-label{
  color: rgba(248,231,167,.75) !important;
}
.result-card .rpack-name{
  font-size: clamp(22px, 3vw, 30px) !important;
  line-height: 1.12 !important;
  color: #FFFFFF !important;
}
.result-card .rpack-pricebox{
  min-width: 170px !important;
  text-align: center !important;
  padding: 15px 17px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(232,204,122,.18) !important;
}
.result-card .rpack-price{
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(31px, 4.2vw, 44px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.04em !important;
  color: #F8E7A7 !important;
  text-align: center !important;
}
.result-card .rpack-price span{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: .48em !important;
  font-weight: 750 !important;
  letter-spacing: normal !important;
  color: rgba(255,255,255,.70) !important;
  padding: 0 2px !important;
}
.result-card .rpack-price small{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: .38em !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  color: #F8E7A7 !important;
  vertical-align: baseline !important;
}
.result-card .rpack-sub{
  margin-top: 4px !important;
  color: rgba(255,255,255,.52) !important;
  text-align: center !important;
}
.result-card .legal-note-v10-1,
.legal-note-v10-1{
  margin: 18px 0 0 !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(13,27,62,.055), rgba(201,168,76,.075)) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  color: rgba(13,27,62,.70) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12.8px !important;
  line-height: 1.55 !important;
}
.result-card .legal-note-v10-1 strong,
.legal-note-v10-1 strong{
  color: #0D1B3E !important;
  font-weight: 850 !important;
}
@media (max-width: 680px){
  .result-card .result-pack{
    text-align: center !important;
    justify-content: center !important;
  }
  .result-card .rpack-pricebox{
    width: 100% !important;
  }
  .result-card .ins{
    grid-template-columns: 1fr !important;
  }
}


/* =====================================================================
   DSTART — V10.2 CORRECTIONS CIBLÉES
   Zones validées : footer services, serpentine dynamique, messages quiz,
   score test FE, fond résultat diagnostic gratuit.
   ===================================================================== */

/* 1) Footer : colonne Services alignée visuellement sur les boutons métiers */
.ds-footer-col-services-v10-2 .ds-footer-title{
  color: #F8E7A7 !important;
}
.ds-footer-services-buttons-v10-2 a{
  min-height: 0 !important;
  justify-content: center !important;
}
.ds-footer-services-buttons-v10-2 strong{
  color: rgba(255,255,255,.92) !important;
}
.ds-footer-services-buttons-v10-2 span{
  color: rgba(255,255,255,.50) !important;
}

/* 2) Messages obligatoires questionnaires : rappel intégré, propre et bas de carte */
.quiz-wrap .q-reminder-v10-2{
  display: none;
  margin: 18px 0 0 !important;
  padding: 13px 15px !important;
  border-radius: 14px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(248,231,167,.18), transparent 44%),
    linear-gradient(145deg, rgba(239,68,68,.10), rgba(13,27,62,.42)) !important;
  border: 1px solid rgba(248,231,167,.25) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.22), 0 0 0 1px rgba(239,68,68,.08) inset !important;
  color: rgba(255,255,255,.88) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13.2px !important;
  line-height: 1.48 !important;
  animation: none !important;
}
.quiz-wrap .q-reminder-v10-2.show{
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}
.q-reminder-v10-2 .q-reminder-icon{
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #F8E7A7, #C9A84C) !important;
  color: #07101F !important;
  font-family: 'DM Mono', ui-monospace, monospace !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  line-height: 1 !important;
}
.q-reminder-v10-2 .q-reminder-text{
  color: rgba(255,255,255,.88) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-weight: 650 !important;
  letter-spacing: normal !important;
}
.quiz-wrap .q-missing{
  box-shadow: 0 0 0 2px rgba(248,231,167,.35), 0 0 28px rgba(248,231,167,.18) !important;
  border-radius: 14px !important;
}

/* 3) Diagnostic gratuit : suppression du grand fond blanc du résultat final */
body.page-quiz #result.result-card{
  background:
    radial-gradient(circle at 50% 0%, rgba(232,204,122,.12), transparent 40%),
    linear-gradient(180deg, #07101F 0%, #0D1B3E 48%, #050A18 100%) !important;
  border: 1px solid rgba(232,204,122,.22) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.42) !important;
  overflow: hidden !important;
}
body.page-quiz #result .result-body{
  background: transparent !important;
}
body.page-quiz #result .ins{
  background:
    radial-gradient(circle at 0% 0%, rgba(248,231,167,.09), transparent 45%),
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  border-color: rgba(232,204,122,.16) !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.22) !important;
}
body.page-quiz #result .ins-tx{
  color: rgba(255,255,255,.76) !important;
}
body.page-quiz #result .ins-tx strong{
  color: #F8E7A7 !important;
}
body.page-quiz #result .ins-ic{
  background: rgba(248,231,167,.12) !important;
}
body.page-quiz #result .legal-note-v10-1{
  background: rgba(248,231,167,.07) !important;
  color: rgba(255,255,255,.68) !important;
}
body.page-quiz #result .legal-note-v10-1 strong{
  color: #F8E7A7 !important;
}

/* 4) Test conformité FE : recommandation score propre, sans débordement/flou */
body.page-quiz #result-wrap .reco-box-v10-2{
  position: relative !important;
  overflow: visible !important;
  border-radius: 22px !important;
  padding: clamp(24px, 4vw, 36px) !important;
  border: 1px solid rgba(232,204,122,.30) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,231,167,.15), transparent 42%),
    linear-gradient(145deg, rgba(13,27,62,.92), rgba(5,10,24,.96)) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34) !important;
}
body.page-quiz #result-wrap .reco-topline-v10-2{
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin-bottom: 16px !important;
}
body.page-quiz #result-wrap .reco-badge{
  flex: 0 0 auto !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: visible !important;
  filter: none !important;
  opacity: 1 !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  background: linear-gradient(135deg, #F8E7A7, #C9A84C) !important;
  border: 0 !important;
}
body.page-quiz #result-wrap .reco-context-v10-2{
  flex: 1 1 260px !important;
  min-width: 0 !important;
  color: rgba(255,255,255,.68) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.48 !important;
  text-align: right !important;
}
body.page-quiz #result-wrap .reco-box-v10-2 h3{
  color: #F8E7A7 !important;
  font-size: clamp(26px, 4vw, 38px) !important;
  line-height: 1.1 !important;
  margin-bottom: 10px !important;
}
body.page-quiz #result-wrap .reco-box-v10-2 p{
  color: rgba(255,255,255,.72) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
}
body.page-quiz #result-wrap .reco-price-v10-2{
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 18px 0 22px !important;
  padding: 16px 18px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(232,204,122,.18) !important;
}
body.page-quiz #result-wrap .reco-price-v10-2 .amount{
  font-size: clamp(36px, 5vw, 52px) !important;
  line-height: 1.08 !important;
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}
body.page-quiz #result-wrap .reco-price-v10-2 .suffix{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  color: #F8E7A7 !important;
}
body.page-quiz #result-wrap .reco-price-v10-2 .ttc{
  flex-basis: 100% !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12.5px !important;
  color: rgba(255,255,255,.52) !important;
}
body.page-quiz #result-wrap .reco-meta-v10-2{
  margin-bottom: 20px !important;
  color: rgba(255,255,255,.58) !important;
  font-size: 13px !important;
}
body.page-quiz #result-wrap .reco-actions-v10-2{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 20px !important;
}
body.page-quiz #result-wrap .btn-reco,
body.page-quiz #result-wrap .btn-upsell{
  filter: none !important;
  opacity: 1 !important;
}
body.page-quiz #result-wrap .btn-reco-secondary-v10-2,
body.page-quiz #result-wrap .btn-pack-target-v10-2{
  background: transparent !important;
  border: 1px solid rgba(232,204,122,.32) !important;
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}
@media (max-width: 680px){

  body.page-quiz #result-wrap .reco-actions-v10-2 .btn-reco{
    width: 100% !important;
  }
}


/* =====================================================================
   DSTART — V10.2.1 PATCH FOMO HALO ONLY
   Modification volontairement limitée aux compteurs FOMO.
   Effet demandé : halo qui dépasse autour du cadre + flash doré plus visible.
   ===================================================================== */

.ds-countdown,
.ds-fe-countdown-grid,
.ds-countdown-wrap,
.ds-fe-countdown-wrap,
.ds-countdown-section,


.ds-countdown-block,
.ds-fe-countdown-block{
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  overflow: visible !important;
  border: 1px solid rgba(248,231,167,.42) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(248,231,167,.18), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.020)) !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.46),
    0 0 0 1px rgba(248,231,167,.14) inset,
    0 0 22px rgba(232,204,122,.22),
    0 0 42px rgba(232,204,122,.10) !important;
}

.ds-countdown-block::before,
.ds-fe-countdown-block::before{
  content: "" !important;
  position: absolute !important;
  inset: -20px !important;
  border-radius: 32px !important;
  pointer-events: none !important;
  z-index: -2 !important;
  opacity: .66 !important;
  background:
    radial-gradient(circle at 50% 50%,
      rgba(248,231,167,.50) 0%,
      rgba(232,204,122,.30) 28%,
      rgba(201,168,76,.13) 52%,
      transparent 76%) !important;
  filter: blur(17px) !important;
  transform: scale(.96) !important;
}

.ds-countdown-block::after,
.ds-fe-countdown-block::after{
  content: "" !important;
  position: absolute !important;
  inset: -9px !important;
  border-radius: 25px !important;
  pointer-events: none !important;
  z-index: -1 !important;
  opacity: .50 !important;
  border: 1px solid rgba(248,231,167,.34) !important;
  box-shadow:
    0 0 18px rgba(248,231,167,.24),
    0 0 42px rgba(232,204,122,.15) !important;
}

@keyframes dsFomoOuterHaloFlashV1021{
  0%{
    opacity: .42;
    transform: scale(.94);
    filter: blur(14px);
  }
  18%{
    opacity: 1;
    transform: scale(1.12);
    filter: blur(21px);
  }
  38%{
    opacity: .86;
    transform: scale(1.05);
    filter: blur(18px);
  }
  100%{
    opacity: .52;
    transform: scale(.96);
    filter: blur(16px);
  }
}

@keyframes dsFomoFrameFlashV1021{
  0%{
    border-color: rgba(248,231,167,.30);
    box-shadow:
      0 18px 44px rgba(0,0,0,.46),
      0 0 0 1px rgba(248,231,167,.12) inset,
      0 0 18px rgba(232,204,122,.14);
  }
  22%{
    border-color: rgba(248,231,167,.96);
    box-shadow:
      0 20px 58px rgba(0,0,0,.54),
      0 0 0 2px rgba(248,231,167,.72) inset,
      0 0 38px 10px rgba(248,231,167,.62),
      0 0 86px 28px rgba(232,204,122,.44),
      0 0 126px 42px rgba(201,168,76,.26);
  }
  100%{
    border-color: rgba(248,231,167,.42);
    box-shadow:
      0 18px 44px rgba(0,0,0,.46),
      0 0 0 1px rgba(248,231,167,.14) inset,
      0 0 22px rgba(232,204,122,.22),
      0 0 42px rgba(232,204,122,.10);
  }
}

.ds-countdown-block.ds-cd-halo,
.ds-fe-countdown-block.ds-cd-halo{
  animation: dsFomoFrameFlashV1021 1s ease-out !important;
}

.ds-countdown-block.ds-cd-halo::before,
.ds-fe-countdown-block.ds-cd-halo::before{
  animation: dsFomoOuterHaloFlashV1021 1s ease-out !important;
}

.ds-countdown-block.ds-cd-halo::after,
.ds-fe-countdown-block.ds-cd-halo::after{
  opacity: .98 !important;
  border-color: rgba(248,231,167,.72) !important;
  box-shadow:
    0 0 28px rgba(248,231,167,.58),
    0 0 68px rgba(232,204,122,.36),
    0 0 112px rgba(201,168,76,.24) !important;
}

.ds-countdown-value,
.ds-fe-countdown-value,
.ds-countdown-label,
.ds-fe-countdown-unit{
  position: relative !important;
  z-index: 3 !important;
}


/* =====================================================================
   DSTART — V10.2.2 FIX FOMO RECTANGLES + HERO GOLD GRADIENT
   Modification limitée :
   1) repositionnement du halo FOMO sans rectangle décalé ;
   2) retour gradient doré des chiffres hero Packs ;
   3) retour gradient doré des chiffres hero Diagnostic gratuit.
   ===================================================================== */

/* 1) FOMO : on garde le flash validé, mais on supprime l'effet rectangle décalé.
   Le halo devient un disque/ellipse centré sur le cadre, pas un bloc rectangulaire. */
.ds-countdown-block,
.ds-fe-countdown-block{
  overflow: visible !important;
  isolation: isolate !important;
  position: relative !important;
}

.ds-countdown-block::before,
.ds-fe-countdown-block::before{
  inset: auto !important;
  left: 50% !important;
  top: 50% !important;
  width: calc(100% + 44px) !important;
  height: calc(100% + 44px) !important;
  border-radius: 999px !important;
  transform: translate(-50%, -50%) scale(.94) !important;
  z-index: -2 !important;
  opacity: .56 !important;
  background:
    radial-gradient(ellipse at center,
      rgba(248,231,167,.45) 0%,
      rgba(232,204,122,.25) 30%,
      rgba(201,168,76,.10) 56%,
      rgba(201,168,76,0) 76%) !important;
  filter: blur(16px) !important;
  box-shadow: none !important;
}

.ds-countdown-block::after,
.ds-fe-countdown-block::after{
  inset: auto !important;
  left: 50% !important;
  top: 50% !important;
  width: calc(100% + 22px) !important;
  height: calc(100% + 22px) !important;
  border-radius: 999px !important;
  transform: translate(-50%, -50%) scale(.96) !important;
  z-index: -1 !important;
  opacity: .42 !important;
  border: none !important;
  background:
    radial-gradient(ellipse at center,
      rgba(248,231,167,.20) 0%,
      rgba(232,204,122,.12) 42%,
      transparent 72%) !important;
  box-shadow:
    0 0 18px rgba(248,231,167,.18),
    0 0 40px rgba(232,204,122,.12) !important;
}

/* Flash externe centré : plus de translation parasite, plus de gros rectangle en arrière-plan */
@keyframes dsFomoOuterHaloFlashV1022{
  0%{
    opacity: .40;
    transform: translate(-50%, -50%) scale(.92);
    filter: blur(14px);
  }
  18%{
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.16);
    filter: blur(20px);
  }
  42%{
    opacity: .80;
    transform: translate(-50%, -50%) scale(1.06);
    filter: blur(17px);
  }
  100%{
    opacity: .52;
    transform: translate(-50%, -50%) scale(.94);
    filter: blur(15px);
  }
}

@keyframes dsFomoInnerHaloFlashV1022{
  0%{
    opacity: .34;
    transform: translate(-50%, -50%) scale(.95);
  }
  20%{
    opacity: .92;
    transform: translate(-50%, -50%) scale(1.08);
  }
  100%{
    opacity: .42;
    transform: translate(-50%, -50%) scale(.96);
  }
}

.ds-countdown-block.ds-cd-halo::before,
.ds-fe-countdown-block.ds-cd-halo::before{
  animation: dsFomoOuterHaloFlashV1022 1s ease-out !important;
}

.ds-countdown-block.ds-cd-halo::after,
.ds-fe-countdown-block.ds-cd-halo::after{
  animation: dsFomoInnerHaloFlashV1022 1s ease-out !important;
  border: none !important;
}

/* 2) Page Packs métiers : dernière ligne hero/stats en doré gradient */
.page-packs .ds-packs-hero-stat-num,
.page-packs .ds-packs-hero-stat-unit,
.ds-packs-hero .ds-packs-hero-stat-num,
.ds-packs-hero .ds-packs-hero-stat-unit{
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  background: linear-gradient(135deg, #F8E7A7 0%, #E8CC7A 42%, #C9A84C 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 0 26px rgba(232,204,122,.18) !important;
}

/* 3) Page Diagnostic gratuit : chiffres du hero en doré gradient */
.page-quiz .ds-quiz-hero .ds-quiz-hero-stat-value{
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  background: linear-gradient(135deg, #F8E7A7 0%, #E8CC7A 42%, #C9A84C 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 0 24px rgba(232,204,122,.16) !important;
}


/* =====================================================================
   DSTART — V10.2.3 DIAGNOSTIC + TEST SCORE MOOD
   Modification limitée au mood visuel :
   - diagnostic-gratuit : insights, pack recommandé, ordonnance 45 ;
   - test-conformite-fe : même mood premium appliqué à la recommandation score.
   Aucune logique prix reprise de Claude.
   ===================================================================== */

/* ---------------------------------------------------------------------
   A. DIAGNOSTIC GRATUIT — résultat final : mood Claude repris proprement
   --------------------------------------------------------------------- */

/* Bloc insights : cartes sombres/translucides, colorées par criticité */
body.page-quiz #result .insights{
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 24px 0 !important;
}

body.page-quiz #result .ins{
  display: flex !important;
  align-items: flex-start !important;
  gap: 13px !important;
  padding: 16px 18px !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(201,168,76,.18) !important;
  border-left: 4px solid rgba(201,168,76,.72) !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.22) !important;
  overflow: visible !important;
}

body.page-quiz #result .ins-ic{
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 16px !important;
  line-height: 1 !important;
  background: rgba(201,168,76,.12) !important;
  box-shadow: 0 0 22px rgba(201,168,76,.12) !important;
}

body.page-quiz #result .ins-tx{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13.6px !important;
  line-height: 1.64 !important;
  color: rgba(255,255,255,.82) !important;
  letter-spacing: normal !important;
}

body.page-quiz #result .ins-tx strong{
  color: #FFFFFF !important;
  font-weight: 750 !important;
}

/* Variantes par criticité, inspirées Claude mais plus premium */
body.page-quiz #result .ins.crit{
  background: linear-gradient(145deg, rgba(239,68,68,.11), rgba(255,255,255,.026)) !important;
  border-color: rgba(239,68,68,.30) !important;
  border-left-color: #EF4444 !important;
}

body.page-quiz #result .ins.crit .ins-ic{
  background: rgba(239,68,68,.14) !important;
  box-shadow: 0 0 24px rgba(239,68,68,.16) !important;
}

body.page-quiz #result .ins.crit .ins-tx strong{
  color: #FCA5A5 !important;
}

body.page-quiz #result .ins.warn{
  background: linear-gradient(145deg, rgba(251,191,36,.095), rgba(255,255,255,.026)) !important;
  border-color: rgba(251,191,36,.28) !important;
  border-left-color: #FCD34D !important;
}

body.page-quiz #result .ins.warn .ins-ic{
  background: rgba(251,191,36,.13) !important;
  box-shadow: 0 0 24px rgba(251,191,36,.15) !important;
}

body.page-quiz #result .ins.warn .ins-tx strong{
  color: #FCD34D !important;
}

body.page-quiz #result .ins.fe{
  background: linear-gradient(145deg, rgba(96,165,250,.09), rgba(255,255,255,.026)) !important;
  border-color: rgba(96,165,250,.26) !important;
  border-left-color: #60A5FA !important;
}

body.page-quiz #result .ins.fe .ins-ic{
  background: rgba(96,165,250,.13) !important;
  box-shadow: 0 0 24px rgba(96,165,250,.14) !important;
}

body.page-quiz #result .ins.fe .ins-tx strong{
  color: #93C5FD !important;
}

body.page-quiz #result .ins.good{
  background: linear-gradient(145deg, rgba(74,222,128,.095), rgba(255,255,255,.026)) !important;
  border-color: rgba(74,222,128,.26) !important;
  border-left-color: #4ADE80 !important;
}

body.page-quiz #result .ins.good .ins-ic{
  background: rgba(74,222,128,.13) !important;
  box-shadow: 0 0 24px rgba(74,222,128,.14) !important;
}

body.page-quiz #result .ins.good .ins-tx strong{
  color: #86EFAC !important;
}

/* Bloc choix du pack : conserver notre logique prix, améliorer uniquement le rendu */
body.page-quiz #result .result-pack{
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 18px !important;
  margin: 26px 0 26px !important;
  padding: 26px 28px !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(248,231,167,.13), transparent 50%),
    linear-gradient(145deg, rgba(13,27,62,.88), rgba(5,10,24,.96)) !important;
  border: 1px solid rgba(201,168,76,.30) !important;
  box-shadow: 0 20px 56px rgba(0,0,0,.30) !important;
}

body.page-quiz #result .rpack-copy{
  width: 100% !important;
  text-align: center !important;
}

body.page-quiz #result .rpack-label{
  color: rgba(248,231,167,.74) !important;
  font-family: 'DM Mono', ui-monospace, monospace !important;
  font-size: 10px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

body.page-quiz #result .rpack-name{
  color: #FFFFFF !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(25px, 4vw, 36px) !important;
  line-height: 1.08 !important;
  font-weight: 900 !important;
}

body.page-quiz #result .rpack-pricebox{
  min-width: min(100%, 230px) !important;
  text-align: center !important;
  padding: 15px 20px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.052) !important;
  border: 1px solid rgba(248,231,167,.20) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.22) !important;
}

body.page-quiz #result .rpack-price{
  text-align: center !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(34px, 5vw, 48px) !important;
  line-height: 1.08 !important;
  font-weight: 900 !important;
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
  letter-spacing: -.04em !important;
}

body.page-quiz #result .rpack-price small{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: .38em !important;
  font-weight: 850 !important;
  letter-spacing: .04em !important;
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}

body.page-quiz #result .rpack-sub{
  text-align: center !important;
  margin-top: 5px !important;
  color: rgba(255,255,255,.52) !important;
  font-size: 12px !important;
}

/* Ordonnance 45 : fond doré léger + bordure gauche, façon Claude mais plus lisible */
body.page-quiz #result .legal-note-v10-1,
body.page-quiz #result .legal-note{
  display: block !important;
  margin-top: 20px !important;
  padding: 13px 16px !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(201,168,76,.10), rgba(248,231,167,.045)) !important;
  border: 1px solid rgba(201,168,76,.22) !important;
  border-left: 4px solid #C9A84C !important;
  color: rgba(255,255,255,.66) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.58 !important;
  font-style: italic !important;
  letter-spacing: normal !important;
}

body.page-quiz #result .legal-note-v10-1 strong,
body.page-quiz #result .legal-note strong{
  color: #F8E7A7 !important;
  font-style: normal !important;
  font-weight: 850 !important;
}

/* ---------------------------------------------------------------------
   B. TEST CONFORMITÉ FE — même mood premium sur la page score
   --------------------------------------------------------------------- */

body.page-quiz #result-wrap .reco-box-v10-2{
  border-radius: 22px !important;
  border: 1px solid rgba(201,168,76,.32) !important;
  border-left: 4px solid #C9A84C !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,231,167,.14), transparent 46%),
    linear-gradient(145deg, rgba(13,27,62,.90), rgba(5,10,24,.97)) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34) !important;
  overflow: visible !important;
}

body.page-quiz #result-wrap .reco-badge{
  background: linear-gradient(135deg, #F8E7A7, #C9A84C) !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  filter: none !important;
  opacity: 1 !important;
}

body.page-quiz #result-wrap .reco-context-v10-2{
  color: rgba(255,255,255,.70) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  line-height: 1.55 !important;
  filter: none !important;
  opacity: 1 !important;
}

body.page-quiz #result-wrap .reco-box-v10-2 h3{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
  text-shadow: 0 0 30px rgba(232,204,122,.12) !important;
}

body.page-quiz #result-wrap .reco-box-v10-2 p{
  color: rgba(255,255,255,.76) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  line-height: 1.68 !important;
}

/* Prix mission FE : doré complet, HT/TTC/TVA visibles */
body.page-quiz #result-wrap .reco-price-v10-2{
  border-left: 4px solid #C9A84C !important;
  background: linear-gradient(145deg, rgba(201,168,76,.10), rgba(255,255,255,.035)) !important;
  border-color: rgba(201,168,76,.23) !important;
}

body.page-quiz #result-wrap .reco-price-v10-2 .amount{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}

body.page-quiz #result-wrap .reco-price-v10-2 .suffix{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}

body.page-quiz #result-wrap .reco-price-v10-2 .ttc{
  color: rgba(255,255,255,.60) !important;
}

/* Features de recommandation : petites cartes colorées par mood diagnostic */
body.page-quiz #result-wrap .reco-features{
  display: grid !important;
  gap: 10px !important;
}

body.page-quiz #result-wrap .reco-feat{
  padding: 12px 14px !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(201,168,76,.16) !important;
  border-left: 3px solid rgba(201,168,76,.72) !important;
  color: rgba(255,255,255,.78) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  line-height: 1.48 !important;
}

body.page-quiz #result-wrap .reco-meta-v10-2{
  color: rgba(255,255,255,.58) !important;
}

/* Upsell pack : cohérent avec mood premium, sans changer le contenu */
body.page-quiz #result-wrap .upsell-box{
  background:
    radial-gradient(circle at 0% 0%, rgba(96,165,250,.10), transparent 42%),
    linear-gradient(145deg, rgba(13,27,62,.82), rgba(5,10,24,.94)) !important;
  border: 1px solid rgba(96,165,250,.20) !important;
  border-left: 4px solid #60A5FA !important;
  box-shadow: 0 20px 56px rgba(0,0,0,.28) !important;
}

body.page-quiz #result-wrap .upsell-item{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(96,165,250,.16) !important;
  border-left: 3px solid rgba(96,165,250,.72) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.78) !important;
}

@media (max-width: 680px){
  body.page-quiz #result .ins{
    flex-direction: column !important;
  }
  body.page-quiz #result-wrap .reco-context-v10-2{
    text-align: left !important;
  }
}


/* =====================================================================
   DSTART — V10.2.4 VERROU CORRECTIONS
   Modifications limitées :
   1) FOMO : halo fusionné à la forme des carrés chiffrés, sans ronds visibles.
   2) Bandeaux de cards : remise en position haute absolute, hors flux.
   3) Accueil packs : typographies pack + encadré places restantes restaurés.
   ===================================================================== */

/* 1) FOMO — garder le pulse doré validé, supprimer les ronds visibles derrière */
.ds-countdown,
.ds-fe-countdown-grid,
.ds-countdown-wrap,
.ds-fe-countdown-wrap,
.ds-countdown-section,
.ds-fe-countdown-section{
  overflow: visible !important;
}

.ds-countdown-block,
.ds-fe-countdown-block{
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  overflow: visible !important;
  border-radius: 20px !important;
}

/* Le halo n'est plus un disque rempli : il épouse exactement la forme du bloc */
.ds-countdown-block::before,
.ds-fe-countdown-block::before{
  content: "" !important;
  position: absolute !important;
  inset: -10px !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border-radius: 28px !important;
  pointer-events: none !important;
  z-index: -2 !important;
  opacity: 0 !important;
  background: transparent !important;
  filter: none !important;
  border: 1px solid rgba(248,231,167,.28) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.18),
    0 0 28px rgba(248,231,167,.30),
    0 0 72px rgba(232,204,122,.22) !important;
}

.ds-countdown-block::after,
.ds-fe-countdown-block::after{
  content: "" !important;
  position: absolute !important;
  inset: -18px !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border-radius: 34px !important;
  pointer-events: none !important;
  z-index: -3 !important;
  opacity: 0 !important;
  background: transparent !important;
  filter: none !important;
  border: none !important;
  box-shadow:
    0 0 34px rgba(248,231,167,.30),
    0 0 96px rgba(232,204,122,.23),
    0 0 142px rgba(201,168,76,.15) !important;
}

@keyframes dsFomoMergedFramePulseV1024{
  0%{
    opacity: 0;
    transform: scale(.985);
  }
  18%{
    opacity: 1;
    transform: scale(1.015);
  }
  42%{
    opacity: .72;
    transform: scale(1.006);
  }
  100%{
    opacity: 0;
    transform: scale(.995);
  }
}

@keyframes dsFomoMergedBoxPulseV1024{
  0%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.46),
      0 0 0 1px rgba(248,231,167,.14) inset,
      0 0 18px rgba(232,204,122,.14);
  }
  20%{
    box-shadow:
      0 20px 58px rgba(0,0,0,.54),
      0 0 0 2px rgba(248,231,167,.68) inset,
      0 0 34px 8px rgba(248,231,167,.48),
      0 0 78px 24px rgba(232,204,122,.34);
  }
  100%{
    box-shadow:
      0 18px 44px rgba(0,0,0,.46),
      0 0 0 1px rgba(248,231,167,.14) inset,
      0 0 22px rgba(232,204,122,.18);
  }
}

.ds-countdown-block.ds-cd-halo,
.ds-fe-countdown-block.ds-cd-halo{
  animation: dsFomoMergedBoxPulseV1024 1s ease-out !important;
}

.ds-countdown-block.ds-cd-halo::before,
.ds-fe-countdown-block.ds-cd-halo::before,
.ds-countdown-block.ds-cd-halo::after,
.ds-fe-countdown-block.ds-cd-halo::after{
  animation: dsFomoMergedFramePulseV1024 1s ease-out !important;
}

/* 2) Bandeaux/cards — remettre les rubans au-dessus, sans tasser le contenu */
.ds-pack-card,
.ds-pack-card.popular,
.ds-pack-card.limited,
.ds-tarifs-pack-card,
.ds-tarifs-pack-card.featured,
.ds-tarifs-pack-card.limited,
.ds-tarifs-fe-card,
.ds-tarifs-micro-card,
.ds-fe-offre-card,
.ds-micro-card{
  position: relative !important;
  overflow: visible !important;
}

.ds-pack-popular-badge,
.ds-pack-limited-badge,
.ds-tarifs-pack-badge,
.ds-tarifs-pack-limited-badge,
.ds-tarifs-fe-card-badge,
.ds-tarifs-micro-card-badge,
.ds-fe-offre-badge,
.ds-micro-card-badge{
  position: absolute !important;
  top: -13px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 40 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: calc(100% - 28px) !important;
  margin: 0 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

/* garde un petit espace respirant au-dessus quand le bandeau flotte */
.ds-pack-card.popular,
.ds-pack-card.limited,
.ds-tarifs-pack-card.featured,
.ds-tarifs-pack-card.limited,
.ds-tarifs-fe-card,
.ds-tarifs-micro-card,
.ds-fe-offre-card,
.ds-micro-card{
  margin-top: 18px !important;
}

/* 3) Accueil — Nos packs métiers : typographies d'origine restaurées */
#packs .ds-pack-name,
.ds-packs-section .ds-pack-name{
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: var(--ds-gold-300) !important;
  -webkit-text-fill-color: var(--ds-gold-300) !important;
  background: none !important;
  text-shadow: none !important;
}

#packs .ds-pack-tagline,
.ds-packs-section .ds-pack-tagline{
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 22px !important;
  line-height: 1.12 !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
  background: none !important;
}

/* Accueil — Pack 3 places restantes : écriture propre d'avant */
#packs .ds-pack-places,
.ds-packs-section .ds-pack-places{
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 10px !important;
  letter-spacing: .06em !important;
  color: #FCA5A5 !important;
  background: rgba(249,115,22,.08) !important;
  border: 1px solid rgba(249,115,22,.20) !important;
  border-radius: var(--ds-radius-sm, 10px) !important;
  padding: 10px 12px !important;
  text-align: left !important;
}

#packs .ds-pack-places-label,
.ds-packs-section .ds-pack-places-label{
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--ds-gold-300) !important;
  -webkit-text-fill-color: var(--ds-gold-300) !important;
  margin-bottom: 4px !important;
}

#packs .ds-pack-places-value,
.ds-packs-section .ds-pack-places-value{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
}


/* =====================================================================
   DSTART — V10.2.5 ACCUEIL PACKS ONLY
   Zone strictement ciblée : page accueil > section "Nos packs métiers".
   Objectif :
   - les cards avec bandeau gardent la même taille visuelle que les autres ;
   - les bandeaux ne sont plus tronqués ;
   - le CTA du Pack 3 redevient lisible.
   ===================================================================== */

#index-packs-scope-placeholder{ display:none !important; }

#packs,
#packs .ds-packs-section,
#packs .ds-packs-inner,


#packs .ds-packs-grid{
  align-items: stretch !important;
  padding-top: 22px !important;
}

#packs .ds-pack-card{
  height: auto !important;
  min-height: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Correction du rétrécissement visuel : les cartes à bandeau ne reçoivent plus de margin-top. */
#packs .ds-pack-card.popular,
#packs .ds-pack-card.limited{
  margin-top: 0 !important;
  transform: none !important;
}

/* Bandeaux accueil uniquement : au-dessus des cards, visibles, non tronqués. */
#packs .ds-pack-popular-badge,
#packs .ds-pack-limited-badge{
  position: absolute !important;
  top: -14px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 80 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 6px 16px !important;
  overflow: visible !important;
  white-space: nowrap !important;
  line-height: 1.1 !important;
  pointer-events: none !important;
}

/* Pack 3 — CTA lisible comme bouton premium, sans toucher les autres boutons. */
#packs .ds-pack-card.limited .ds-btn-pack{
  background: linear-gradient(135deg, #F97316 0%, #FB923C 100%) !important;
  border: 1px solid rgba(251,146,60,.90) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.28) !important;
  box-shadow: 0 14px 34px rgba(249,115,22,.24) !important;
}

#packs .ds-pack-card.limited .ds-btn-pack:hover{
  background: linear-gradient(135deg, #FB923C 0%, #F97316 100%) !important;
  border-color: rgba(251,146,60,1) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 18px 42px rgba(249,115,22,.32) !important;
}

#packs .ds-pack-card.limited .ds-btn-pack *,
#packs .ds-pack-card.limited .ds-btn-pack:hover *{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

@media (max-width: 560px){
  #packs .ds-packs-grid{
    padding-top: 26px !important;
  }
  #packs .ds-pack-popular-badge,
  #packs .ds-pack-limited-badge{
    max-width: calc(100% + 28px) !important;
    min-width: 0 !important;
    white-space: normal !important;
    text-align: center !important;
  }
}


/* =====================================================================
   DSTART — V10.2.6 ACCUEIL PACKS + TARIFS MICRO ONLY
   Zones strictement ciblées :
   1) accueil #packs : chevauchement cards / bandeaux / CTA Pack 3 ;
   2) accueil stats sous hero : police des libellés ;
   3) tarifs #micro : alignement card Auto-Entrepreneur.
   ===================================================================== */

/* 1) ACCUEIL — Nos packs métiers : grille stable, sans chevauchement */
#packs,
#packs .ds-packs-inner,
#packs .ds-packs-grid{
  overflow: visible !important;
}

#packs .ds-packs-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: clamp(22px, 2.2vw, 32px) !important;
  row-gap: 42px !important;
  align-items: stretch !important;
  padding-top: 26px !important;
}

#packs .ds-pack-card{
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}

#packs .ds-pack-card.popular,
#packs .ds-pack-card.limited{
  margin: 0 !important;
  padding-top: 32px !important;
}

/* Bandeaux : visibles, contenus dans leur card, sans passer sur les cards voisines */
#packs .ds-pack-popular-badge,
#packs .ds-pack-limited-badge{
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 90 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 24px) !important;
  margin: 0 !important;
  padding: 6px 14px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  box-sizing: border-box !important;
}

/* Pack 3 : bouton remis comme le bouton d'origine, lisible sur fond sombre */
#packs .ds-pack-card.limited .ds-btn-pack{
  background: transparent !important;
  border: 1px solid var(--ds-border-300, rgba(201,168,76,.30)) !important;
  color: var(--ds-text-100, #FFFFFF) !important;
  -webkit-text-fill-color: var(--ds-text-100, #FFFFFF) !important;
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

#packs .ds-pack-card.limited .ds-btn-pack:hover{
  background: rgba(201,168,76,.08) !important;
  border-color: var(--ds-gold-300, #E8CC7A) !important;
  color: var(--ds-gold-300, #E8CC7A) !important;
  -webkit-text-fill-color: var(--ds-gold-300, #E8CC7A) !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Responsive accueil #packs : éviter tout croisement en 2 colonnes / 1 colonne */
@media (max-width: 1100px){
  #packs .ds-packs-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 28px !important;
    row-gap: 42px !important;
  }
}

@media (max-width: 760px){
  #packs .ds-packs-grid{
    grid-template-columns: 1fr !important;
    row-gap: 44px !important;
    padding-top: 30px !important;
  }
  #packs .ds-pack-popular-badge,
  #packs .ds-pack-limited-badge{
    max-width: calc(100% - 22px) !important;
    white-space: normal !important;
    text-align: center !important;
  }
}

/* 2) ACCUEIL — ligne de données sous hero : police harmonisée au site */
.ds-hero-stats-section .ds-stat-label{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: rgba(255,255,255,.62) !important;
}

/* 3) TARIFS — Micro : card Auto-Entrepreneur alignée avec les 3 autres */
#micro .ds-tarifs-micro-card{
  min-width: 0 !important;
}

#micro .ds-tarifs-micro-card .ds-tarifs-micro-card-tagline{
  min-height: 20px !important;
  display: flex !important;
  align-items: center !important;
}

@media (min-width: 1101px){
  #micro .ds-tarifs-micro-card.featured .ds-tarifs-micro-card-tagline{
    white-space: nowrap !important;
    font-size: 12.2px !important;
    letter-spacing: -.01em !important;
  }
}

/* Sécurité alignement vertical : tous les blocs prix Micro partent au même niveau */
#micro .ds-tarifs-micro-card-price-block{
  margin-top: 0 !important;
}


/* =====================================================================
   DSTART — V10.2.7 HERO + MÉTIER + SERPENTINE ONLY
   Zones ciblées :
   1) accueil hero : "devient votre" doré comme "avantage" ;
   2) accueil DS Copilot : titre sans majuscules forcées ;
   3) section métiers : suppression/remplacement du filigrane image incohérent ;
   4) serpentine : derrière les éléments, plus discrète.
   ===================================================================== */

/* 1) HERO ACCUEIL — toute la ligne italique devient dorée gradient */
body.page-home .ds-hero-v3-title-accent{
  display: block !important;
  width: max-content !important;
  max-width: 100% !important;
  font-style: italic !important;
  background: linear-gradient(110deg, #C9A84C 0%, #F8E7A7 25%, #FFF6D8 45%, #E8CC7A 65%, #C9A84C 100%) !important;
  background-size: 220% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  animation: dsGoldShimmer 6s ease-in-out infinite !important;
  overflow: visible !important;
}

body.page-home .ds-hero-v3-title-accent em{
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  background: none !important;
  animation: none !important;
}

/* 2) DS COPILOT — le titre de section ne doit pas être forcé en majuscules */
body.page-home .ds-copilot-section .ds-copilot-header .ds-copilot-title{
  text-transform: none !important;
  font-variant-caps: normal !important;
  letter-spacing: -0.025em !important;
}

/* On ne touche pas au libellé technique dans le mockup hero */
body.page-home .ds-mockup-copilot .ds-copilot-title{
  text-transform: uppercase !important;
}

/* 3) SECTION MÉTIERS / "NOTRE MÉTIER" — remplacement du filigrane image par un motif métier cohérent */
body.page-home .ds-verticaux-v3{
  position: relative !important;
  overflow: hidden !important;
}

body.page-home .ds-verticaux-v3::before{
  content: "13";
  position: absolute;
  right: clamp(18px, 5vw, 90px);
  top: clamp(34px, 7vw, 110px);
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(120px, 18vw, 280px);
  line-height: .78;
  font-weight: 900;
  letter-spacing: -.08em;
  color: transparent;
  -webkit-text-fill-color: transparent;
  background: linear-gradient(135deg, rgba(248,231,167,.15), rgba(201,168,76,.035));
  -webkit-background-clip: text;
  background-clip: text;
  opacity: .36;
  pointer-events: none;
  z-index: 0;
}

body.page-home .ds-verticaux-v3::after{
  content: "";
  position: absolute;
  right: clamp(10px, 4vw, 78px);
  top: clamp(88px, 13vw, 210px);
  width: clamp(220px, 31vw, 460px);
  height: clamp(220px, 31vw, 460px);
  border-radius: 999px;
  border: 1px solid rgba(201,168,76,.10);
  background:
    radial-gradient(circle at 50% 50%, rgba(201,168,76,.065), transparent 62%),
    linear-gradient(90deg, rgba(201,168,76,.045) 1px, transparent 1px),
    linear-gradient(0deg, rgba(201,168,76,.045) 1px, transparent 1px);
  background-size: auto, 34px 34px, 34px 34px;
  mask-image: radial-gradient(circle at center, black 0%, black 58%, transparent 76%);
  -webkit-mask-image: radial-gradient(circle at center, black 0%, black 58%, transparent 76%);
  pointer-events: none;
  z-index: 0;
}

body.page-home .ds-verticaux-v3 > *{
  position: relative !important;
  z-index: 1 !important;
}

/* Même image de filigrane supprimée/replacée ailleurs : plus d'image watermark en footer,
   remplacée par une signature CSS dorée ultra discrète. */
footer.ds-footer-signature::before{
  content: "DS" !important;
  background: none !important;
  right: clamp(18px, 4vw, 64px) !important;
  bottom: clamp(6px, 2vw, 34px) !important;
  width: auto !important;
  height: auto !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(64px, 12vw, 170px) !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: -.08em !important;
  color: rgba(248,231,167,.055) !important;
  -webkit-text-fill-color: rgba(248,231,167,.055) !important;
  opacity: 1 !important;
  filter: none !important;
}

/* 4) SERPENTINE — passe derrière les éléments et devient plus discrète */
.ds-serpentine-layer{
  z-index: 1 !important;
  opacity: 0 !important;
  mix-blend-mode: screen !important;
}

.ds-serpentine-layer.is-live{
  opacity: .48 !important;
}

.ds-serpentine-trail{
  opacity: .42 !important;
  stroke-width: 1.55 !important;
  filter: drop-shadow(0 0 5px rgba(232,204,122,.34)) !important;
}

.ds-serpentine-trail-soft{
  opacity: .045 !important;
  stroke-width: 8 !important;
  filter: blur(7px) !important;
}

.ds-serpentine-head{
  opacity: .44 !important;
  filter: drop-shadow(0 0 8px rgba(232,204,122,.45)) !important;
}

.ds-serpentine-head-ring{
  opacity: .25 !important;
}

/* Les principaux contenus restent au-dessus. */
nav.ds-nav,
main,
section,
footer,
.ds-hero-v3-inner,
.ds-hero-v3-content,
.ds-hero-v3-mockup,
.ds-vertical-card,
.ds-pack-card,
.ds-tarifs-pack-card,
.ds-tarifs-micro-card,
.qcard,
.result-card{
  position: relative !important;
  z-index: 4 !important;
}


/* =====================================================================
   DSTART — V10.2.8 NAVBAR RESTORE ONLY
   Correction ultra ciblée : restauration de la navbar après V10.2.7.
   Aucun autre élément visuel n'est modifié.
   ===================================================================== */

nav.ds-nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 99999 !important;
  display: flex !important;
  align-items: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: none !important;
}

nav.ds-nav .ds-nav-brand,
nav.ds-nav .ds-nav-logo-img,
nav.ds-nav .ds-nav-links,
nav.ds-nav .ds-nav-cta{
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body{
  padding-top: 58px !important;
}

@media (max-width: 860px){
  nav.ds-nav{
    position: fixed !important;
    top: 0 !important;
    min-height: 58px !important;
    z-index: 99999 !important;
  }
}


/* =====================================================================
   DSTART — V10.2.9 SERPENTINE ÉLÉGANTE ONLY
   Zone strictement ciblée : serpentine.
   Objectif : visible comme un fil conducteur, derrière les éléments,
   tracé en couloirs libres, sans toucher logo/cartes/textes/boutons.
   ===================================================================== */

.ds-serpentine-layer{
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 2 !important;
  opacity: 0 !important;
  mix-blend-mode: screen !important;
  transition: opacity .28s ease !important;
}

.ds-serpentine-layer.is-live{
  opacity: .72 !important;
}

.ds-serpentine-track,
.ds-serpentine-svg,
.ds-serpentine-orn{
  pointer-events: none !important;
}

.ds-serpentine-trail{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 1.85 !important;
  opacity: .66 !important;
  filter: drop-shadow(0 0 7px rgba(232,204,122,.48)) !important;
}

.ds-serpentine-trail-soft{
  stroke: url(#dsSerpGold) !important;
  stroke-width: 9 !important;
  opacity: .065 !important;
  filter: blur(7px) !important;
}

.ds-serpentine-head{
  opacity: .70 !important;
  fill: #F8E7A7 !important;
  filter: drop-shadow(0 0 10px rgba(232,204,122,.62)) !important;
}

.ds-serpentine-head-ring{
  opacity: .35 !important;
  stroke: rgba(248,231,167,.32) !important;
}

.ds-serpentine-orn,
.ds-serpentine-orn.is-visible,
.ds-serpentine-orn.is-lit{
  opacity: 0 !important;
  display: none !important;
}

/* La serpentine reste derrière les contenus sans casser la navbar. */
main,
section,
footer,
.ds-hero-v3-inner,
.ds-hero-v3-content,
.ds-hero-v3-mockup,
.ds-vertical-card,
.ds-micro-card,
.ds-diag-card,
.ds-pack-card,
.ds-copilot-feature,
.ds-methode-step,
.ds-tarifs-pack-card,
.ds-tarifs-micro-card,
.qcard,
.result-card,
.faq-item{
  position: relative !important;
  z-index: 4 !important;
}

/* Pas d'illumination footer/logo : la terminaison ne touche plus le logo. */
#ds-logo-footer.ds-serpentine-arrived,
.ds-footer-logo.ds-serpentine-arrived,
#ds-logo-footer.ds-serpentine-arrived img,
.ds-footer-logo.ds-serpentine-arrived img{
  filter: none !important;
}

@media (max-width: 760px){
  .ds-serpentine-layer{
    display: none !important;
  }
}


/* =====================================================================
   DSTART — V11.0 SITE OFFRES/TARIFS + 2 BUGS VISUELS
   Ciblage : contact noms/prénoms, hero accueil, nouvelle grille offres.
   ===================================================================== */

/* Contact : empêche le chevauchement Nom / Prénom */
.ds-contact-form .ds-form-row{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  align-items: start !important;
}

.ds-contact-form .ds-form-row .ds-form-group{
  min-width: 0 !important;
  margin-bottom: 0 !important;
}

.ds-contact-form .ds-form-group input,
.ds-contact-form .ds-form-group select,
.ds-contact-form .ds-form-group textarea{
  width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 720px){
  .ds-contact-form .ds-form-row{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* Accueil : hero remis au même niveau visuel que les autres pages */
body.page-home .ds-hero-v3{
  margin-top: -58px !important;
  padding-top: 78px !important;
}

/* Tarifs : notes de réserve plus lisibles */
.ds-tarifs-packs-note,
.ds-tarifs-micro-note{
  line-height: 1.55 !important;
}

/* Packs : mention plateforme inclus lisible sans casser les cards */
.ds-pack-engagement,
.ds-tarifs-pack-annual,
.ds-tarifs-micro-card-annual{
  line-height: 1.45 !important;
}


/* =====================================================================
   DSTART — V12 REFONTE CONVERSION MICRO & FE
   Architecture de conversion :
   - Parcours Micro / FE Express / Packs Métiers
   - Offre Micro prioritaire
   - Objections commerciales
   - Pages Tarifs et FE clarifiées
   ===================================================================== */

/* --- V12 common --- */
.ds-v12-path-kicker,
.ds-v12-micro-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  font-family:'DM Mono', ui-monospace, monospace!important;
  font-size:11px!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  color:#F8E7A7!important;
  margin-bottom:14px!important;
}

.ds-v12-path-kicker::before,
.ds-v12-micro-kicker::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:#C9A84C;
  box-shadow:0 0 18px rgba(248,231,167,.42);
}

/* --- Parcours accueil --- */
.ds-v12-path-section{
  position:relative!important;
  overflow:hidden!important;
  padding:clamp(76px,8vw,118px) var(--ds-page-x)!important;
  background:
    radial-gradient(circle at 14% 12%, rgba(248,231,167,.10), transparent 32%),
    radial-gradient(circle at 86% 0%, rgba(0,180,216,.08), transparent 38%),
    linear-gradient(180deg,#050A18 0%,#0A0F1E 100%)!important;
}

.ds-v12-path-inner{
  max-width:1240px!important;
  margin:0 auto!important;
}

.ds-v12-path-title,
.ds-v12-objections-head h2,
.ds-v12-micro-title,
.ds-v12-fe-logic-copy h2{
  font-family:'Playfair Display', Georgia, serif!important;
  font-size:clamp(42px,5.8vw,76px)!important;
  line-height:.94!important;
  letter-spacing:-.045em!important;
  color:#fff!important;
  margin:0 0 20px!important;
}

.ds-v12-path-title em,
.ds-v12-objections-head h2 em,
.ds-v12-micro-title em,
.ds-v12-fe-logic-copy h2 em{
  font-style:italic!important;
  background:linear-gradient(110deg,#C9A84C,#F8E7A7,#FFF6D8,#E8CC7A)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}

.ds-v12-path-sub{
  max-width:820px!important;
  color:rgba(255,255,255,.70)!important;
  font-size:17px!important;
  line-height:1.75!important;
  margin:0 0 34px!important;
}

.ds-v12-path-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  align-items:stretch!important;
}

.ds-v12-path-card{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
  padding:28px!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,231,167,.09), transparent 42%),
    linear-gradient(145deg, rgba(13,27,62,.74), rgba(5,10,24,.94))!important;
  border:1px solid rgba(201,168,76,.20)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.28)!important;
  overflow:visible!important;
}

.ds-v12-path-card.featured{
  border-color:rgba(248,231,167,.42)!important;
  box-shadow:0 28px 90px rgba(201,168,76,.13),0 22px 70px rgba(0,0,0,.32)!important;
}

.ds-v12-path-badge{
  position:absolute!important;
  top:-13px!important;
  left:28px!important;
  padding:6px 14px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#F8E7A7,#C9A84C)!important;
  color:#07101F!important;
  -webkit-text-fill-color:#07101F!important;
  font-family:'DM Mono', monospace!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

.ds-v12-path-icon{
  width:48px!important;
  height:48px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:16px!important;
  background:rgba(248,231,167,.09)!important;
  border:1px solid rgba(248,231,167,.18)!important;
  font-size:25px!important;
}

.ds-v12-path-card h3{
  font-family:'Playfair Display', Georgia, serif!important;
  color:#fff!important;
  font-size:30px!important;
  line-height:1.05!important;
  margin:0!important;
}

.ds-v12-path-card p{
  color:rgba(255,255,255,.68)!important;
  line-height:1.62!important;
  margin:0!important;
}

.ds-v12-price-line{
  margin-top:auto!important;
  display:grid!important;
  gap:4px!important;
  padding:14px 16px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(248,231,167,.14)!important;
}

.ds-v12-price-line strong{
  font-family:'Playfair Display', Georgia, serif!important;
  font-size:25px!important;
  line-height:1!important;
  color:#F8E7A7!important;
}

.ds-v12-price-line span{
  color:rgba(255,255,255,.55)!important;
  font-size:12px!important;
}

/* --- Micro conversion accueil --- */
.ds-v12-micro-section{
  position:relative!important;
  padding:clamp(80px,8vw,122px) var(--ds-page-x)!important;
  background:
    radial-gradient(circle at 88% 20%, rgba(248,231,167,.12), transparent 36%),
    linear-gradient(180deg,#0A0F1E 0%,#050A18 100%)!important;
  overflow:hidden!important;
}

.ds-v12-micro-inner{
  max-width:1240px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr)!important;
  gap:clamp(28px,5vw,74px)!important;
  align-items:center!important;
}

.ds-v12-micro-lead{
  font-size:18px!important;
  line-height:1.78!important;
  color:rgba(255,255,255,.72)!important;
  max-width:720px!important;
  margin:0 0 30px!important;
}

.ds-v12-micro-proof{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
  margin:28px 0!important;
}

.ds-v12-micro-proof div{
  padding:16px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(201,168,76,.16)!important;
}

.ds-v12-micro-proof strong{
  display:block!important;
  font-family:'Playfair Display', Georgia, serif!important;
  font-size:24px!important;
  color:#F8E7A7!important;
  line-height:1.05!important;
  margin-bottom:5px!important;
}

.ds-v12-micro-proof span{
  display:block!important;
  color:rgba(255,255,255,.58)!important;
  font-size:12px!important;
  line-height:1.45!important;
}

.ds-v12-micro-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
}

.ds-v12-micro-panel{
  padding:30px!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 0% 0%, rgba(248,231,167,.14), transparent 42%),
    linear-gradient(145deg,rgba(13,27,62,.80),rgba(5,10,24,.96))!important;
  border:1px solid rgba(248,231,167,.26)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.34)!important;
}

.ds-v12-micro-panel h3{
  font-family:'Playfair Display', Georgia, serif!important;
  font-size:34px!important;
  line-height:1.05!important;
  color:#fff!important;
  margin:0 0 20px!important;
}

.ds-v12-micro-panel ul{
  display:grid!important;
  gap:14px!important;
  padding:0!important;
  margin:0!important;
  list-style:none!important;
}

.ds-v12-micro-panel li{
  display:grid!important;
  grid-template-columns:42px 1fr!important;
  gap:12px!important;
  color:rgba(255,255,255,.76)!important;
  line-height:1.55!important;
}

.ds-v12-micro-panel li span{
  font-family:'DM Mono',monospace!important;
  color:#F8E7A7!important;
  letter-spacing:.08em!important;
}

/* --- Objections --- */
.ds-v12-objections-section{
  padding:clamp(72px,7vw,108px) var(--ds-page-x)!important;
  background:linear-gradient(180deg,#050A18 0%,#0A0F1E 100%)!important;
}

.ds-v12-objections-inner{
  max-width:1240px!important;
  margin:0 auto!important;
}

.ds-v12-objections-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
}

.ds-v12-objections-grid article{
  padding:24px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.032)!important;
  border:1px solid rgba(201,168,76,.16)!important;
}

.ds-v12-objections-grid h3{
  font-family:'Playfair Display', Georgia, serif!important;
  font-size:28px!important;
  color:#F8E7A7!important;
  margin:0 0 10px!important;
}

.ds-v12-objections-grid p{
  color:rgba(255,255,255,.68)!important;
  line-height:1.65!important;
  margin:0!important;
}

/* --- Tarifs V12 choice --- */
.ds-v12-tarifs-choice{
  padding:34px var(--ds-page-x) 10px!important;
  background:#050A18!important;
}

.ds-v12-tarifs-choice-inner{
  max-width:1240px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
}

.ds-v12-choice-card{
  display:grid!important;
  grid-template-columns:36px 1fr!important;
  gap:6px 12px!important;
  align-items:center!important;
  padding:18px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(201,168,76,.16)!important;
  text-decoration:none!important;
}

.ds-v12-choice-card.featured{
  border-color:rgba(248,231,167,.38)!important;
  background:linear-gradient(145deg,rgba(201,168,76,.11),rgba(255,255,255,.03))!important;
}

.ds-v12-choice-card span{
  grid-row:1/3!important;
  width:34px!important;
  height:34px!important;
  border-radius:12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:rgba(248,231,167,.10)!important;
  color:#F8E7A7!important;
  font-family:'DM Mono',monospace!important;
}

.ds-v12-choice-card strong{
  color:#fff!important;
  font-size:15px!important;
}

.ds-v12-choice-card em{
  color:rgba(255,255,255,.58)!important;
  font-size:12px!important;
  font-style:normal!important;
}

/* --- Tarifs/FE helper bands --- */
.ds-v12-fe-warning,
.ds-v12-micro-salesband,
.ds-v12-fe-notincluded{
  max-width:1240px!important;
  margin:0 auto 24px!important;
  padding:18px 20px!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(201,168,76,.10),rgba(255,255,255,.028))!important;
  border:1px solid rgba(201,168,76,.20)!important;
  color:rgba(255,255,255,.72)!important;
  line-height:1.6!important;
}

.ds-v12-fe-warning strong,
.ds-v12-fe-notincluded strong{
  color:#F8E7A7!important;
}

.ds-v12-micro-salesband{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin-bottom:26px!important;
}

.ds-v12-micro-salesband strong{
  display:block!important;
  color:#F8E7A7!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:25px!important;
  margin-bottom:4px!important;
}

.ds-v12-micro-salesband span{
  color:rgba(255,255,255,.66)!important;
}

/* --- FE page logic --- */
.ds-v12-fe-logic{
  padding:clamp(66px,7vw,104px) var(--ds-page-x)!important;
  background:
    radial-gradient(circle at 80% 15%, rgba(0,180,216,.08), transparent 36%),
    linear-gradient(180deg,#050A18 0%,#0A0F1E 100%)!important;
}

.ds-v12-fe-logic-inner{
  max-width:1240px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(320px,.95fr)!important;
  gap:44px!important;
  align-items:center!important;
}

.ds-v12-fe-logic-copy p{
  color:rgba(255,255,255,.70)!important;
  font-size:17px!important;
  line-height:1.76!important;
}

.ds-v12-fe-logic-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
}

.ds-v12-fe-logic-grid div{
  min-height:128px!important;
  padding:20px!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(201,168,76,.16)!important;
}

.ds-v12-fe-logic-grid strong{
  display:block!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:38px!important;
  color:#F8E7A7!important;
  line-height:1!important;
  margin-bottom:10px!important;
}

.ds-v12-fe-logic-grid span{
  color:rgba(255,255,255,.70)!important;
  line-height:1.5!important;
}

/* --- responsive --- */
@media (max-width: 980px){
  .ds-v12-path-grid,
  .ds-v12-objections-grid,
  .ds-v12-tarifs-choice-inner{
    grid-template-columns:1fr!important;
  }

  .ds-v12-micro-inner,
  .ds-v12-fe-logic-inner{
    grid-template-columns:1fr!important;
  }

  .ds-v12-micro-proof{
    grid-template-columns:1fr!important;
  }

  .ds-v12-micro-salesband{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
}

@media (max-width: 620px){
  .ds-v12-path-section,
  .ds-v12-micro-section,
  .ds-v12-objections-section,
  .ds-v12-fe-logic{
    padding-left:20px!important;
    padding-right:20px!important;
  }

  .ds-v12-path-title,
  .ds-v12-objections-head h2,
  .ds-v12-micro-title,
  .ds-v12-fe-logic-copy h2{
    font-size:clamp(38px,11vw,54px)!important;
  }

  .ds-v12-fe-logic-grid{
    grid-template-columns:1fr!important;
  }
}


/* =====================================================================
   DSTART — V12.1 CORRECTIONS CIBLÉES
   - CTA navbar non tronqué
   - Serpentine supprimée proprement
   - Hero accueil réduit
   - Packs accueil/tarifs harmonisés
   - Cards FE tarif/FE harmonisées
   - Gamme Micro mise en forme
   ===================================================================== */

/* 1) NAVBAR — CTA droite jamais tronqué */
nav.ds-nav,
.ds-nav{
  overflow: visible !important;
  box-sizing: border-box !important;
  padding-left: clamp(16px, 2.6vw, 42px) !important;
  padding-right: clamp(16px, 2.6vw, 42px) !important;
  gap: clamp(10px, 1.2vw, 20px) !important;
}

.ds-nav-brand{
  flex: 0 0 auto !important;
  min-width: 0 !important;
}

.ds-nav-logo-img{
  max-width: clamp(124px, 14vw, 178px) !important;
  height: auto !important;
}

.ds-nav-links{
  flex: 1 1 auto !important;
  min-width: 0 !important;
  justify-content: center !important;
  gap: clamp(8px, 1.1vw, 18px) !important;
}

.ds-nav-links a{
  white-space: nowrap !important;
}

.ds-nav-cta{
  flex: 0 0 auto !important;
  max-width: none !important;
  min-width: max-content !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  box-sizing: border-box !important;
  padding: 8px 13px !important;
  letter-spacing: .045em !important;
  font-size: 10px !important;
}

@media (max-width: 1080px){
  .ds-nav-links a{
    font-size: 8.5px !important;
    padding-inline: 4px !important;
  }
  .ds-nav-cta{
    font-size: 9px !important;
    padding: 7px 10px !important;
  }
}

@media (max-width: 980px){
  .ds-nav-links{
    display: none !important;
  }
  .ds-nav-cta{
    font-size: 10px !important;
    padding: 7px 12px !important;
  }
}

/* 2) SERPENTINE — suppression propre et sans impact layout */
body.ds-serpentine-active{
  background-attachment: initial !important;
}

.ds-serpentine-layer,
#ds-serpentine-layer,
.ds-serpentine-track,
.ds-serpentine-svg,
.ds-serpentine-orn,
.ds-serpentine-head,
.ds-serpentine-head-ring,
.ds-serpentine-trail,
.ds-serpentine-trail-soft{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* 3) ACCUEIL — hero plus compact pour voir les CTA au chargement */
body.page-home .ds-hero-v3{
  min-height: calc(100vh - 58px) !important;
  padding-top: 70px !important;
  padding-bottom: 42px !important;
  align-items: center !important;
}

body.page-home .ds-hero-v3-title{
  font-size: clamp(44px, 6.6vw, 78px) !important;
  line-height: .90 !important;
  margin-bottom: 18px !important;
}

body.page-home .ds-hero-v3-desc{
  font-size: clamp(14px, 1.25vw, 17px) !important;
  line-height: 1.58 !important;
  margin-bottom: 20px !important;
}

body.page-home .ds-hero-v3-actions{
  margin-top: 18px !important;
  gap: 12px !important;
}

body.page-home .ds-hero-v3-fe{
  margin-top: 14px !important;
}

/* 4) PACKS ACCUEIL + TARIFS — setup blanc, engagements au bon endroit, note premium */
.ds-pack-setup{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-weight: 750 !important;
}

.ds-pack-engagement{
  color: rgba(255,255,255,.72) !important;
  -webkit-text-fill-color: rgba(255,255,255,.72) !important;
  line-height: 1.35 !important;
}

.ds-packs-note.ds-v121-note-premium,
.ds-tarifs-packs-note.ds-v121-note-premium,
.ds-tarifs-micro-note.ds-v121-note-premium{
  margin: 26px auto 0 !important;
  padding: 18px 20px !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(201,168,76,.10), rgba(255,255,255,.028)) !important;
  border: 1px solid rgba(201,168,76,.22) !important;
  color: rgba(255,255,255,.74) !important;
  line-height: 1.62 !important;
  font-size: 14px !important;
  text-align: left !important;
}

.ds-packs-note.ds-v121-note-premium strong,
.ds-tarifs-packs-note.ds-v121-note-premium strong,
.ds-tarifs-micro-note.ds-v121-note-premium strong{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
}

/* Tarifs — cards Packs copiées de l'accueil : même grille et même respiration */
body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 28px) !important;
  align-items: stretch !important;
  padding-top: 26px !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  height: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.popular,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited{
  padding-top: 32px !important;
  transform: none !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-popular-badge,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-limited-badge{
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 80 !important;
  max-width: calc(100% - 24px) !important;
  white-space: nowrap !important;
}

@media (max-width: 1100px){

}
@media (max-width: 760px){
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
    grid-template-columns: 1fr !important;
  }
}

/* 5) FE cards — mêmes styles page Tarifs + Facture électronique, prix centrés et un peu plus grands */
.ds-tarifs-fe-card-price{
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 8px !important;
  margin: 18px auto 8px !important;
}

.ds-tarifs-fe-card-amount{
  font-size: clamp(44px, 4.8vw, 62px) !important;
  line-height: .92 !important;
  text-align: center !important;
}

.ds-tarifs-fe-card-suffix{
  font-size: 14px !important;
  align-self: flex-end !important;
  padding-bottom: 7px !important;
}

.ds-tarifs-fe-card-ttc,
.ds-tarifs-fe-card-duration{
  text-align: center !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 28px) !important;
  align-items: stretch !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
  height: 100% !important;
}

@media (max-width: 980px){

}

/* 6) Tarifs — Gamme Micro : card AE plus premium + meta propre */
.ds-tarifs-micro-card.featured{
  border-width: 2px !important;
  border-color: rgba(248,231,167,.58) !important;
  box-shadow: 0 28px 90px rgba(201,168,76,.18), 0 20px 70px rgba(0,0,0,.32) !important;
}

.ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card-annual{
  margin-top: 8px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(201,168,76,.16) !important;
  color: rgba(255,255,255,.76) !important;
  line-height: 1.42 !important;
  text-align: center !important;
}

.ds-tarifs-micro-card.featured .ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card.featured .ds-tarifs-micro-card-annual{
  border-color: rgba(248,231,167,.22) !important;
  background: rgba(201,168,76,.055) !important;
}


/* =====================================================================
   DSTART — V13 CORRECTIONS CHIRURGICALES
   Périmètre : accueil hero/packs, FE cards, missions, FAQ IA, tarifs.
   ===================================================================== */

/* 1) Accueil hero — “ne subissez plus” au-dessus, même famille/couleur lisible */
body.page-home .ds-hero-v3-title-line{
  display: block !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  background: none !important;
  font-style: normal !important;
  margin: .08em 0 .10em !important;
  line-height: .92 !important;
}

body.page-home .ds-hero-v3-title-accent{
  display: block !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  line-height: .92 !important;
}

/* 2) Pack 2 — encadré doré plus épais sur accueil et tarifs */
.ds-pack-card.popular{
  border-width: 2px !important;
  border-color: rgba(248,231,167,.58) !important;
  box-shadow: 0 28px 90px rgba(201,168,76,.18), 0 20px 70px rgba(0,0,0,.32) !important;
}

/* 3) FE hero — éviter ponctuation isolée et garder un bloc titre propre */
body.page-fe .ds-fe-hero-title{
  text-wrap: balance !important;
}

body.page-fe .ds-fe-hero-title em{
  display: block !important;
  margin-top: .08em !important;
}

/* 4) FE cards — éviter dépassement sur les textes dessous */
.ds-tarifs-fe-section,
.ds-fe-offres-section{
  overflow: visible !important;
  padding-bottom: clamp(72px, 7vw, 112px) !important;
}

.ds-tarifs-fe-grid,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  align-items: stretch !important;
  row-gap: 36px !important;
  margin-bottom: 38px !important;
}

.ds-tarifs-fe-card{
  height: auto !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
}

.ds-tarifs-fe-card-features{
  flex: 1 1 auto !important;
  margin-bottom: 22px !important;
}

.ds-tarifs-fe-card .ds-btn-gold,
.ds-tarifs-fe-card .ds-btn-ghost{
  margin-top: auto !important;
}

.ds-tarifs-fe-note,
.ds-fe-offres-note,
.ds-v12-fe-notincluded{
  position: relative !important;
  z-index: 1 !important;
  clear: both !important;
}

/* 5) Tarifs — choix de parcours : plus de cerclage permanent sur le premier */
.ds-v12-choice-card,
.ds-v12-choice-card.featured{
  border-color: rgba(201,168,76,.16) !important;
  background: rgba(255,255,255,.035) !important;
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease !important;
}

.ds-v12-choice-card:hover,
.ds-v12-choice-card:focus-visible{
  border-color: rgba(248,231,167,.58) !important;
  background: linear-gradient(145deg,rgba(201,168,76,.12),rgba(255,255,255,.04)) !important;
  box-shadow: 0 16px 42px rgba(201,168,76,.14) !important;
  transform: translateY(-2px) !important;
}

body:has(#micro:target) .ds-v12-choice-card[href="#micro"],
body:has(#fe-express:target) .ds-v12-choice-card[href="#fe-express"],
body:has(#offre:target) .ds-v12-choice-card[href="#offre"]{
  border-color: rgba(248,231,167,.68) !important;
  background: linear-gradient(145deg,rgba(201,168,76,.14),rgba(255,255,255,.045)) !important;
  box-shadow: 0 16px 46px rgba(201,168,76,.16) !important;
}

/* 6) Tarifs Packs — ne plus déborder sur les textes dessous */
body.page-tarifs .ds-tarifs-packs-section{
  overflow: visible !important;
  padding-bottom: clamp(72px, 7vw, 112px) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  margin-bottom: 40px !important;
  row-gap: 42px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-features{
  flex: 1 1 auto !important;
  margin-bottom: 20px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-btn-pack{
  margin-top: auto !important;
}

body.page-tarifs .ds-tarifs-packs-note{
  clear: both !important;
  position: relative !important;
  z-index: 1 !important;
}

/* 7) Gamme Micro — lignes setup/engagement disposées comme les packs */
.ds-tarifs-micro-card-price-block{
  display: grid !important;
  gap: 6px !important;
}

.ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card-annual{
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  text-align: center !important;
  line-height: 1.36 !important;
}

.ds-tarifs-micro-card-setup{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-weight: 750 !important;
}

.ds-tarifs-micro-card-annual{
  color: rgba(255,255,255,.72) !important;
  -webkit-text-fill-color: rgba(255,255,255,.72) !important;
  font-weight: 650 !important;
}

/* 8) FAQ — nouvelles réponses IA/données plus lisibles */
.ds-faq-item-v13{
  border-color: rgba(248,231,167,.20) !important;
  background: linear-gradient(145deg, rgba(201,168,76,.055), rgba(255,255,255,.028)) !important;
}

.ds-faq-item-v13 summary{
  color: #F8E7A7 !important;
}


/* =====================================================================
   DSTART — V13.1 CORRECTIONS FINALES CIBLÉES
   Zones strictement ciblées :
   - Accueil hero titre doré compact
   - Débordements cards FE / Packs
   - Gamme Micro : prix centrés + engagements sur 4 cards
   - FAQ wording traité en HTML
   ===================================================================== */

/* 1) Accueil hero — une seule ligne dorée, sans espace parasite */
body.page-home .ds-hero-v3-title{
  display: block !important;
  gap: 0 !important;
  margin-bottom: 16px !important;
}

body.page-home .ds-hero-v3-title br{
  display: block !important;
  content: "" !important;
  margin: 0 !important;
  line-height: 0 !important;
}

body.page-home .ds-hero-v3-title .ds-hero-v3-title-line{
  display: none !important;
}

body.page-home .ds-hero-v3-title .ds-hero-v3-title-accent{
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: .92 !important;
  font-style: italic !important;
  background: linear-gradient(110deg,#C9A84C 0%,#F8E7A7 28%,#FFF6D8 48%,#E8CC7A 72%,#C9A84C 100%) !important;
  background-size: 220% auto !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

/* 2) Cards FE — empêcher tout débordement sur les notes/textes en dessous */
.ds-tarifs-fe-section,
.ds-fe-offres-section{
  overflow: visible !important;
  padding-bottom: clamp(52px, 6vw, 88px) !important;
}

.ds-tarifs-fe-grid,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  align-items: stretch !important;
  row-gap: 34px !important;
  margin-bottom: 34px !important;
  overflow: visible !important;
}

.ds-tarifs-fe-card{
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 24px !important;
}

.ds-tarifs-fe-card-features{
  flex: 0 1 auto !important;
  margin-bottom: 18px !important;
}

.ds-tarifs-fe-card .ds-btn-gold,
.ds-tarifs-fe-card .ds-btn-ghost{
  margin-top: auto !important;
  position: relative !important;
  z-index: 2 !important;
}

.ds-tarifs-fe-note,
.ds-fe-offres-note,
.ds-v12-fe-notincluded{
  position: relative !important;
  z-index: 3 !important;
  clear: both !important;
  margin-top: 30px !important;
}

/* 3) Cards Packs section Tarifs — empêcher débordement sur note dessous */
.ds-tarifs-packs-section{
  overflow: visible !important;
  padding-bottom: clamp(54px, 6vw, 92px) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  row-gap: 36px !important;
  margin-bottom: 34px !important;
  align-items: stretch !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 24px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-features{
  flex: 0 1 auto !important;
  margin-bottom: 18px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-btn-pack,
body.page-tarifs .ds-tarifs-packs-section .ds-btn-gold{
  margin-top: auto !important;
  position: relative !important;
  z-index: 2 !important;
}

.ds-tarifs-packs-note{
  position: relative !important;
  z-index: 4 !important;
  clear: both !important;
  margin-top: 30px !important;
}

/* 4) Gamme Micro — prix centrés + mentions plus premium sur les 4 cards */
.ds-tarifs-micro-card-price-block{
  text-align: center !important;
}

.ds-tarifs-micro-card-price-main{
  display: flex !important;
  justify-content: center !important;
  align-items: baseline !important;
  gap: 7px !important;
  text-align: center !important;
}

.ds-tarifs-micro-card-amount{
  text-align: center !important;
  font-size: clamp(38px, 3.6vw, 52px) !important;
  line-height: .95 !important;
}

.ds-tarifs-micro-card-suffix,
.ds-tarifs-micro-card-period{
  text-align: center !important;
}

.ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card-annual{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  margin-top: 9px !important;
  padding: 10px 13px !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(201,168,76,.075), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(201,168,76,.24) !important;
  color: rgba(255,255,255,.84) !important;
  -webkit-text-fill-color: rgba(255,255,255,.84) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: .01em !important;
  line-height: 1.34 !important;
  text-align: center !important;
}

.ds-tarifs-micro-card-annual{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
  border-color: rgba(248,231,167,.28) !important;
  background: linear-gradient(145deg, rgba(248,231,167,.10), rgba(201,168,76,.045)) !important;
}

.ds-tarifs-micro-card.featured .ds-tarifs-micro-card-setup,
.ds-tarifs-micro-card.featured .ds-tarifs-micro-card-annual{
  border-color: rgba(248,231,167,.36) !important;
}


/* =====================================================================
   DSTART — V13.2 FAQ QA COLOR ONLY
   Correction strictement limitée :
   les dernières Q/R FAQ ajoutées reprennent les couleurs standard FAQ.
   ===================================================================== */





.ds-faq-item-v13 summary{
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
}

.ds-faq-item-v13 p{
  color: var(--ds-text-200) !important;
  -webkit-text-fill-color: var(--ds-text-200) !important;
}


/* =====================================================================
   DSTART — V13.3 VERROU FINAL CIBLÉ
   Modifications strictement limitées :
   1) Croix FAQ sans jaune ;
   2) Pack 3 limité : fond offre limitée + badge doré + halo pulse
      sur accueil et tarifs uniquement.
   ===================================================================== */

/* 1) FAQ — croix d'ouverture harmonisées, sans jaune */
.ds-faq-item summary::after,


/* 2) Accueil + Tarifs — Pack 3 offre limitée */
body.page-home .ds-pack-card.limited,
body.page-tarifs .ds-pack-card.limited{
  background:
    radial-gradient(circle at 82% 10%, rgba(255,255,255,.16), transparent 34%),
    radial-gradient(circle at 18% 0%, rgba(248,231,167,.12), transparent 30%),
    linear-gradient(145deg, rgba(142,43,25,.96), rgba(84,22,18,.97) 48%, rgba(35,13,18,.98) 100%) !important;
  border-color: rgba(248,231,167,.52) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.14),
    0 0 34px rgba(248,120,70,.22),
    0 24px 80px rgba(0,0,0,.42) !important;
  animation: dsPack3LimitedHaloPulseV133 3.8s ease-in-out infinite !important;
}

body.page-home .ds-pack-card.limited::before,
body.page-tarifs .ds-pack-card.limited::before{
  content: "" !important;
  position: absolute !important;
  inset: -6px !important;
  border-radius: inherit !important;
  border: 1px solid rgba(248,231,167,.34) !important;
  box-shadow:
    0 0 28px rgba(248,231,167,.22),
    0 0 46px rgba(248,120,70,.16) !important;
  opacity: .72 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  animation: dsPack3LimitedHaloRingV133 3.8s ease-in-out infinite !important;
}

body.page-home .ds-pack-card.limited > *,
body.page-tarifs .ds-pack-card.limited > *{
  position: relative !important;
  z-index: 1 !important;
}

body.page-home .ds-pack-limited-badge,
body.page-tarifs .ds-pack-limited-badge{
  background: linear-gradient(135deg,#FFF6D8 0%,#F8E7A7 32%,#C9A84C 100%) !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  border: 1px solid rgba(255,246,216,.72) !important;
  box-shadow: 0 10px 28px rgba(248,231,167,.26) !important;
}

@keyframes dsPack3LimitedHaloPulseV133{
  0%,100%{
    box-shadow:
      0 0 0 1px rgba(248,231,167,.12),
      0 0 26px rgba(248,120,70,.18),
      0 24px 80px rgba(0,0,0,.42);
  }
  50%{
    box-shadow:
      0 0 0 1px rgba(248,231,167,.26),
      0 0 46px rgba(248,231,167,.30),
      0 0 70px rgba(248,120,70,.24),
      0 30px 92px rgba(0,0,0,.48);
  }
}

@keyframes dsPack3LimitedHaloRingV133{
  0%,100%{
    opacity: .44;
    transform: scale(.994);
  }
  50%{
    opacity: .88;
    transform: scale(1.006);
  }
}


/* =====================================================================
   DSTART — V13.4 CORRECTIONS VERROUILLÉES
   Modifications strictement ciblées :
   - halo pulse CTA navbar ;
   - FAQ croix/fonds standardisés ;
   - cards FE et packs : anti-débordement renforcé ;
   - carte Réunion : affichage forcé ;
   - Pack 3 limité : préservé sur accueil/tarifs.
   ===================================================================== */

/* CTA navbar : halo doré pulse flash */
.ds-nav-cta{
  position: relative !important;
  isolation: isolate !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.28),
    0 0 18px rgba(248,231,167,.24) !important;
  animation: dsNavCtaGoldPulseV134 2.4s ease-in-out infinite !important;
}

.ds-nav-cta::after{
  content:"" !important;
  position:absolute !important;
  inset:-7px !important;
  border-radius:999px !important;
  border:1px solid rgba(248,231,167,.36) !important;
  box-shadow:0 0 24px rgba(248,231,167,.30),0 0 38px rgba(201,168,76,.18) !important;
  opacity:.55 !important;
  pointer-events:none !important;
  z-index:-1 !important;
  animation: dsNavCtaGoldRingV134 2.4s ease-in-out infinite !important;
}

@keyframes dsNavCtaGoldPulseV134{
  0%,100%{
    box-shadow:0 0 0 1px rgba(248,231,167,.22),0 0 14px rgba(248,231,167,.20);
  }
  50%{
    box-shadow:0 0 0 1px rgba(248,231,167,.55),0 0 26px rgba(248,231,167,.48),0 0 44px rgba(201,168,76,.28);
  }
}

@keyframes dsNavCtaGoldRingV134{
  0%,100%{opacity:.32;transform:scale(.985)}
  50%{opacity:.88;transform:scale(1.045)}
}

/* FAQ : croix et fonds des Q/R IA strictement comme les autres */
.ds-faq-item summary::after,


.ds-faq-item-v13{
  background: rgba(255,255,255,0.02) !important;
  border-color: var(--ds-border-200) !important;
}

.ds-faq-item-v13[open]{
  background: rgba(201,168,76,0.04) !important;
  border-color: var(--ds-border-300) !important;
}

.ds-faq-item-v13 summary{
  background: transparent !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
}

/* FE : anti-débordement renforcé entre les cards et l'encadré Bon à savoir */
.ds-fe-offres-section,
.ds-tarifs-fe-section{
  overflow: visible !important;
  padding-bottom: clamp(88px, 8vw, 132px) !important;
}

.ds-tarifs-fe-grid,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  display: grid !important;
  align-items: stretch !important;
  row-gap: 42px !important;
  margin-bottom: 78px !important;
  overflow: visible !important;
}

.ds-tarifs-fe-card{
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding-bottom: 30px !important;
  display: flex !important;
  flex-direction: column !important;
}

.ds-tarifs-fe-card .ds-btn-gold,
.ds-tarifs-fe-card .ds-btn-ghost{
  margin-top: auto !important;
  position: relative !important;
  z-index: 3 !important;
}

.ds-fe-offres-note,
.ds-tarifs-fe-note,
.ds-v12-fe-notincluded{
  position: relative !important;
  z-index: 10 !important;
  clear: both !important;
  margin-top: 0 !important;
}

/* Tarifs packs : copie accueil + espace sécurisé avant note */
body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  margin-bottom: 70px !important;
  row-gap: 42px !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding-bottom: 30px !important;
}

body.page-tarifs .ds-tarifs-packs-note{
  position: relative !important;
  z-index: 10 !important;
  clear: both !important;
}

/* Missions : carte Réunion visible, jamais remplacée par le nom de fichier */
.ds-ancrage-map{
  opacity: 1 !important;
  transform: none !important;
  min-height: 260px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
}

.ds-ancrage-map img{
  display: block !important;
  width: 100% !important;
  max-width: 440px !important;
  height: auto !important;
  object-fit: contain !important;
  opacity: 1 !important;
  visibility: visible !important;
}


/* =====================================================================
   DSTART — V13.5 CORRECTIONS VERROUILLÉES FINALES
   Ciblage strict :
   - Modaux Micro : boutons identiques aux 9 univers existants
   - Diagnostic gratuit : encadré vert harmonisé
   - FE : séparation définitive cards / note
   - Tarifs : cards Packs rendues comme l'accueil
   - FAQ IA : fond standard avant ouverture
   ===================================================================== */

/* 1) Boutons micro devenus de vrais déclencheurs modal, même rendu que les 9 autres */
button.ds-vertical-card-cta{
  border: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  width: auto !important;
  text-align: left !important;
  font-family: inherit !important;
}

.ds-micro-card button.ds-btn-gold{
  border: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  width: fit-content !important;
  font-family: inherit !important;
}

/* 2) Diagnostic gratuit : encadré vert même typographie que les CTA premium */
.cta-fe-urgence-green{
  background: rgba(74,222,128,.08) !important;
  border-color: rgba(74,222,128,.25) !important;
  margin-bottom: 12px !important;
}

.cta-fe-dot-green{
  background: #4ADE80 !important;
  box-shadow: 0 0 16px rgba(74,222,128,.42) !important;
}

/* 3) Facture électronique : correction définitive du chevauchement cards / note */
body.page-fe .ds-fe-offres-section{
  overflow: visible !important;
  padding-bottom: clamp(120px, 10vw, 170px) !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  position: relative !important;
  display: grid !important;
  align-items: stretch !important;
  row-gap: 48px !important;
  margin-bottom: clamp(120px, 11vw, 170px) !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
  z-index: 1 !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding-bottom: 34px !important;
  overflow: visible !important;
  z-index: 1 !important;
}

body.page-fe .ds-fe-offres-note{
  position: relative !important;
  z-index: 20 !important;
  clear: both !important;
  display: block !important;
  margin-top: 0 !important;
  transform: translateY(0) !important;
}

body.page-fe .ds-v12-fe-notincluded{
  position: relative !important;
  z-index: 20 !important;
  margin-top: 22px !important;
}

/* 4) Tarifs : les cards Packs doivent reprendre le rendu exact de l'accueil */
body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: clamp(22px, 2.2vw, 32px) !important;
  row-gap: 42px !important;
  align-items: stretch !important;
  padding-top: 26px !important;
  margin-bottom: 70px !important;
  overflow: visible !important;
}







body.page-tarifs .ds-tarifs-packs-section .ds-pack-popular-badge,


body.page-tarifs .ds-tarifs-packs-section .ds-pack-name{
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--ds-gold-300) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-tagline{
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  color: var(--ds-text-100) !important;
  letter-spacing: -.01em !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-desc{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  color: var(--ds-text-300) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-btn-pack{
  background: transparent !important;
  border: 1px solid var(--ds-border-200) !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
  box-shadow: none !important;
  transform: none !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack *{
  background: linear-gradient(135deg,#F8E7A7 0%,#C9A84C 100%) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  border-color: rgba(248,231,167,.55) !important;
}

/* 5) FAQ IA : fond strictement identique aux autres questions fermées */
.ds-faq-item-v13:not([open]){
  background: rgba(255,255,255,0.02) !important;
  border-color: var(--ds-border-200) !important;
}

.ds-faq-item-v13:not([open]) summary{
  background: transparent !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
}

.ds-faq-item-v13 summary::after{
  color: var(--ds-text-200) !important;
  -webkit-text-fill-color: var(--ds-text-200) !important;
}

@media (max-width: 1100px){

}

@media (max-width: 760px){
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
    grid-template-columns: 1fr !important;
    row-gap: 44px !important;
    padding-top: 30px !important;
  }
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-popular-badge,

}


/* =====================================================================
   DSTART — V13.6 CORRECTIONS VERROUILLÉES ULTIMES
   Périmètre strict :
   - Packs Accueil/Tarifs : même police et même rendu visuel
   - FE : écart réduit sans retour du chevauchement
   - FAQ : Q/R IA redevenues exactement des FAQ standard
   ===================================================================== */

/* 1) Accueil — titres des 4 packs alignés sur la police validée côté Tarifs */
body.page-home #packs .ds-pack-name,


body.page-home #packs .ds-pack-tagline,


/* 2) Tarifs — rendu visuel des cards Packs aligné sur la section Accueil */




body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  position: relative !important;
  background: linear-gradient(135deg, rgba(13,27,62,.6) 0%, rgba(10,15,30,.8) 100%) !important;
  border: 1px solid var(--ds-border-200) !important;
  border-radius: var(--ds-radius-lg) !important;
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.popular{
  background: linear-gradient(135deg, rgba(201,168,76,.08) 0%, rgba(13,27,62,.8) 100%) !important;
  border-color: var(--ds-border-300) !important;
  padding-top: 32px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited{
  padding-top: 32px !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-popular-badge,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-limited-badge{
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 90 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 22px) !important;
  margin: 0 !important;
  padding: 6px 16px !important;
  overflow: visible !important;
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-desc{
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  color: var(--ds-text-300) !important;
  letter-spacing: normal !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-price-block{
  padding: 16px 0 !important;
  border-top: 1px solid var(--ds-border-200) !important;
  border-bottom: 1px solid var(--ds-border-200) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-features{
  flex: 1 1 auto !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-btn-pack{
  background: transparent !important;
  border: 1px solid var(--ds-border-200) !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
  box-shadow: none !important;
  transform: none !important;
  margin-top: auto !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-btn-pack:hover{
  background: rgba(201,168,76,.08) !important;
  border-color: var(--ds-gold-300) !important;
  color: var(--ds-gold-300) !important;
  -webkit-text-fill-color: var(--ds-gold-300) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack:hover,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack *,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited .ds-btn-pack:hover *{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* 3) Facture électronique — écart visuel réduit, sans chevauchement */
body.page-fe .ds-fe-offres-section{
  padding-bottom: clamp(72px, 7vw, 112px) !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  margin-bottom: clamp(46px, 4.8vw, 68px) !important;
  row-gap: 38px !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
  padding-bottom: 28px !important;
}

body.page-fe .ds-fe-offres-note{
  margin-top: 0 !important;
}

/* 4) FAQ — garantie : toutes les questions fermées ont le même fond standard */
.ds-faq-category .ds-faq-item:not([open]){
  background: rgba(255,255,255,0.02) !important;
  border-color: var(--ds-border-200) !important;
}

.ds-faq-category .ds-faq-item:not([open]) summary{
  background: transparent !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
}

@media (max-width: 1100px){
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px){
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
    grid-template-columns: 1fr !important;
    row-gap: 44px !important;
  }

  body.page-tarifs .ds-tarifs-packs-section .ds-pack-popular-badge,
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-limited-badge{
    max-width: calc(100% - 22px) !important;
    white-space: normal !important;
  }
}


/* =====================================================================
   DSTART — V13.7 RESPONSIVE PACKS FINAL
   Périmètre strict :
   1) Hover premium cards Packs Accueil
   2) Cards Packs Tarifs visuellement identiques à Accueil
   3) Responsive laptop / questionnaires sans toucher au JS
   ===================================================================== */

/* 1) Packs Accueil + Tarifs : effet hover premium identique */
body.page-home #packs .ds-pack-card,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  transition:
    transform .28s cubic-bezier(.22,.61,.36,1),
    border-color .28s ease,
    box-shadow .28s ease,
    background .28s ease !important;
  will-change: transform !important;
}

body.page-home #packs .ds-pack-card:hover,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card:hover{
  transform: translateY(-8px) !important;
  border-color: rgba(248,231,167,.46) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.12),
    0 20px 58px rgba(0,0,0,.42),
    0 0 34px rgba(201,168,76,.16) !important;
}

body.page-home #packs .ds-pack-card:hover .ds-pack-tagline,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card:hover .ds-pack-tagline{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* 2) Pack 3 offre limitée : même fond, même badge, même halo sur Accueil et Tarifs */
body.page-home #packs .ds-pack-card.limited,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited{
  background:
    radial-gradient(circle at 82% 10%, rgba(255,255,255,.16), transparent 34%),
    radial-gradient(circle at 18% 0%, rgba(248,231,167,.12), transparent 30%),
    linear-gradient(145deg, rgba(142,43,25,.96), rgba(84,22,18,.97) 48%, rgba(35,13,18,.98) 100%) !important;
  border-color: rgba(248,231,167,.52) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.14),
    0 0 34px rgba(248,120,70,.22),
    0 24px 80px rgba(0,0,0,.42) !important;
  animation: dsPack3LimitedHaloPulseV133 3.8s ease-in-out infinite !important;
}

body.page-home #packs .ds-pack-card.limited:hover,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited:hover{
  transform: translateY(-8px) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.30),
    0 0 52px rgba(248,231,167,.30),
    0 0 70px rgba(248,120,70,.26),
    0 30px 92px rgba(0,0,0,.50) !important;
}

body.page-home #packs .ds-pack-card.limited::before,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited::before{
  content: "" !important;
  position: absolute !important;
  inset: -6px !important;
  border-radius: inherit !important;
  border: 1px solid rgba(248,231,167,.34) !important;
  box-shadow:
    0 0 28px rgba(248,231,167,.22),
    0 0 46px rgba(248,120,70,.16) !important;
  opacity: .72 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  animation: dsPack3LimitedHaloRingV133 3.8s ease-in-out infinite !important;
}

body.page-home #packs .ds-pack-card.limited > *,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-card.limited > *{
  position: relative !important;
  z-index: 1 !important;
}

body.page-home #packs .ds-pack-limited-badge,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-limited-badge{
  background: linear-gradient(135deg,#FFF6D8 0%,#F8E7A7 32%,#C9A84C 100%) !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  border: 1px solid rgba(255,246,216,.72) !important;
  box-shadow: 0 10px 28px rgba(248,231,167,.26) !important;
}

/* Encadré places restantes/date : police et rendu strictement identiques */
body.page-home #packs .ds-pack-places,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-places{
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 10px !important;
  letter-spacing: .06em !important;
  line-height: 1.45 !important;
  color: #FCA5A5 !important;
  -webkit-text-fill-color: #FCA5A5 !important;
  background: rgba(249,115,22,.08) !important;
  border: 1px solid rgba(249,115,22,.20) !important;
  border-radius: var(--ds-radius-sm, 10px) !important;
  padding: 10px 12px !important;
  text-align: left !important;
}

/* Titres des packs : police cohérente sur les 2 pages */
body.page-home #packs .ds-pack-name,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-name{
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: var(--ds-gold-300) !important;
  -webkit-text-fill-color: var(--ds-gold-300) !important;
  background: none !important;
  text-shadow: none !important;
}

body.page-home #packs .ds-pack-tagline,
body.page-tarifs .ds-tarifs-packs-section .ds-pack-tagline{
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em !important;
  color: var(--ds-text-100) !important;
  -webkit-text-fill-color: var(--ds-text-100) !important;
  background: none !important;
}

/* Tarifs : structure visuelle calée sur Accueil */
body.page-tarifs .ds-tarifs-packs-section .ds-packs-inner{
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 var(--ds-page-x) !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: clamp(22px, 2.2vw, 32px) !important;
  row-gap: 42px !important;
  align-items: stretch !important;
  padding-top: 26px !important;
  margin-bottom: 32px !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
  position: relative !important;
  border-radius: var(--ds-radius-lg) !important;
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* 3) Responsive laptop 15.6 pouces : cards visibles avec moins de scroll inutile */
@media (min-width: 1024px) and (max-width: 1440px), (max-height: 860px) and (min-width: 900px){
  :root{
    --ds-section-y: clamp(54px, 6vh, 76px) !important;
    --ds-page-x: clamp(22px, 3vw, 48px) !important;
  }

  body.page-home .ds-hero-v3,
  .ds-hero-v3,
  .ds-fe-hero,
  .ds-tarifs-hero,
  .ds-packs-hero,
  .ds-quiz-hero{
    padding-top: clamp(70px, 8vh, 94px) !important;
    padding-bottom: clamp(34px, 5vh, 54px) !important;
    min-height: auto !important;
  }

  .ds-packs-section,
  .ds-tarifs-packs-section,
  .ds-tarifs-fe-section,
  .ds-fe-offres-section,
  .ds-micro-section,
  .ds-tarifs-micro-section{
    padding-top: clamp(52px, 6vh, 78px) !important;
    padding-bottom: clamp(54px, 6vh, 82px) !important;
  }

  #packs .ds-packs-grid,
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid,
  .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(14px, 1.4vw, 22px) !important;
  }

  .ds-pack-card,
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-card,
  .ds-tarifs-fe-card,
  .ds-tarifs-micro-card,
  .ds-micro-card{
    padding: clamp(20px, 1.8vw, 26px) !important;
    gap: clamp(10px, 1vh, 14px) !important;
  }

  .ds-pack-tagline,
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-tagline{
    font-size: clamp(19px, 1.55vw, 22px) !important;
    line-height: 1.08 !important;
  }

  .ds-pack-amount,
  .ds-tarifs-fe-card-amount,
  .ds-tarifs-micro-card-amount{
    font-size: clamp(34px, 3.3vw, 46px) !important;
  }

  .ds-pack-desc,
  .ds-tarifs-fe-card-desc,
  .ds-tarifs-micro-card-desc,
  .ds-micro-card-desc{
    font-size: clamp(11px, .86vw, 12px) !important;
    line-height: 1.42 !important;
  }

  .ds-pack-features,
  .ds-tarifs-fe-card-features,
  .ds-tarifs-micro-card-features{
    gap: 7px !important;
  }

  .ds-pack-features li,
  .ds-tarifs-fe-card-features li,
  .ds-tarifs-micro-card-features li{
    font-size: clamp(11px, .85vw, 12px) !important;
    line-height: 1.32 !important;
  }

  .ds-packs-note,
  .ds-tarifs-packs-note,
  .ds-fe-offres-note,
  .ds-tarifs-fe-note{
    margin-top: clamp(18px, 2.5vh, 28px) !important;
  }
}

/* Laptop plutôt étroit : 2 colonnes propres au lieu de 4 serrées */
@media (min-width: 900px) and (max-width: 1180px){
  #packs .ds-packs-grid,
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid,
  .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Questionnaires et résultats : meilleure tenue sur laptop 15.6 et écrans bas */
@media (min-width: 900px) and (max-height: 860px){
  .quiz-wrap,
  #quiz-container,
  body.page-quiz #result,
  body.page-quiz #result-wrap{
    max-width: min(1120px, calc(100vw - 72px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .qcard,
  .quiz-wrap .qcard,
  #quiz-container .qcard,
  .result-card,
  .reco-box,
  .reco-box-v10-2,
  .upsell-box{
    padding: clamp(20px, 2.6vh, 30px) !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .qcard h2,
  .quiz-wrap h2,
  #quiz-container h2,
  .result-card h2,
  .result-card h3,
  .reco-box h3{
    font-size: clamp(24px, 3.4vh, 34px) !important;
    line-height: 1.08 !important;
    margin-bottom: clamp(12px, 2vh, 20px) !important;
  }

  .quiz-wrap label,
  #quiz-container label,
  .q-option,
  .quiz-option,
  .result-card p,
  .result-card li,
  .reco-box p,
  .reco-box li{
    font-size: clamp(13px, 1.55vh, 15px) !important;
    line-height: 1.42 !important;
  }

  .quiz-wrap .q-options,
  #quiz-container .q-options,
  .quiz-options{
    gap: 10px !important;
  }

  .quiz-wrap .btn-next,
  .quiz-wrap .btn-prev,
  .quiz-wrap .btn-final,
  #quiz-container .btn-next,
  #quiz-container .btn-prev,
  .result-card .ds-btn-gold,
  .reco-box .ds-btn-gold{
    padding-top: 11px !important;
    padding-bottom: 11px !important;
  }
}

/* Très petit laptop / zoom navigateur : éviter l'impression d'écrasement */
@media (max-width: 980px){
  #packs .ds-packs-grid,
  body.page-tarifs .ds-tarifs-packs-section .ds-packs-grid,
  .ds-tarifs-fe-grid,

}

@media (prefers-reduced-motion: reduce){
  body.page-home #packs .ds-pack-card,
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-card{
    transition: none !important;
  }
  body.page-home #packs .ds-pack-card:hover,
  body.page-tarifs .ds-tarifs-packs-section .ds-pack-card:hover{
    transform: none !important;
  }
}


/* =====================================================================
   DSTART — V13.8 CORRECTIONS VERROUILLÉES CGV / FE
   Périmètre strict :
   - Cards FE centrées sur Facture électronique et Tarifs
   - Aucun changement fonctionnel
   ===================================================================== */

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid,
body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid{
  width: min(100%, 1240px) !important;
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
  justify-items: stretch !important;
  place-content: center !important;
}

body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card,
body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-card{
  min-width: 0 !important;
}


/* =====================================================================
   DSTART — V13.9 CORRECTIONS VERROUILLÉES PACKS / FE
   Périmètre strict :
   - Hover premium sur les 3 cards "Choisissez votre parcours"
   - Section abonnements Tarifs alignée visuellement sur Accueil
   - Cards FE centrées sur Tarifs et Facture électronique
   ===================================================================== */

/* 1) Accueil — "Choisissez votre parcours" : hover premium comme les autres éléments */
body.page-home .ds-v12-path-card{
  position: relative !important;
  overflow: visible !important;
  transition:
    transform .28s cubic-bezier(.22,.61,.36,1),
    border-color .28s ease,
    box-shadow .28s ease,
    background .28s ease !important;
  will-change: transform !important;
}

body.page-home .ds-v12-path-card:hover{
  transform: translateY(-8px) !important;
  border-color: rgba(248,231,167,.46) !important;
  background:
    radial-gradient(circle at 80% 0%, rgba(248,231,167,.12), transparent 34%),
    linear-gradient(145deg, rgba(13,27,62,.76), rgba(10,15,30,.90)) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.12),
    0 20px 58px rgba(0,0,0,.42),
    0 0 34px rgba(201,168,76,.16) !important;
}

body.page-home .ds-v12-path-card:hover strong{
  color:#FFFFFF !important;
  -webkit-text-fill-color:#FFFFFF !important;
}

body.page-home .ds-v12-path-card:hover .ds-v12-path-icon{
  transform: translateY(-2px) scale(1.04) !important;
  box-shadow: 0 0 22px rgba(248,231,167,.18) !important;
}

/* 2) Tarifs — section abonnements : même scope visuel que l'accueil */
body.page-tarifs #packs.ds-tarifs-packs-section{
  overflow: visible !important;
}

body.page-tarifs #packs .ds-packs-inner{
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 var(--ds-page-x) !important;
}

body.page-tarifs #packs .ds-packs-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: clamp(22px, 2.2vw, 32px) !important;
  row-gap: 42px !important;
  align-items: stretch !important;
  padding-top: 26px !important;
  margin-bottom: 32px !important;
  overflow: visible !important;
}

body.page-tarifs #packs .ds-pack-card{
  position: relative !important;
  border-radius: var(--ds-radius-lg) !important;
  padding: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.page-tarifs #packs .ds-pack-card.popular,
body.page-tarifs #packs .ds-pack-card.limited{
  padding-top: 32px !important;
}

body.page-tarifs #packs .ds-pack-card.limited{
  background:
    radial-gradient(circle at 82% 10%, rgba(255,255,255,.16), transparent 34%),
    radial-gradient(circle at 18% 0%, rgba(248,231,167,.12), transparent 30%),
    linear-gradient(145deg, rgba(142,43,25,.96), rgba(84,22,18,.97) 48%, rgba(35,13,18,.98) 100%) !important;
  border-color: rgba(248,231,167,.52) !important;
}

body.page-tarifs #packs .ds-pack-limited-badge{
  background: linear-gradient(135deg,#FFF6D8 0%,#F8E7A7 32%,#C9A84C 100%) !important;
  color:#07101F !important;
  -webkit-text-fill-color:#07101F !important;
  border:1px solid rgba(255,246,216,.72) !important;
  box-shadow:0 10px 28px rgba(248,231,167,.26) !important;
}

body.page-tarifs #packs .ds-pack-places{
  font-family:'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size:10px !important;
  letter-spacing:.06em !important;
  line-height:1.45 !important;
  color:#FCA5A5 !important;
  -webkit-text-fill-color:#FCA5A5 !important;
  background:rgba(249,115,22,.08) !important;
  border:1px solid rgba(249,115,22,.20) !important;
  border-radius:var(--ds-radius-sm,10px) !important;
  padding:10px 12px !important;
  text-align:left !important;
}

/* 3) FE — disposition centrée identique sur Tarifs et Facture électronique */
body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  width: 100% !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(260px, 360px)) !important;
  justify-content: center !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  place-content: center !important;
  gap: clamp(20px, 2vw, 28px) !important;
}

body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-card,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
  width: 100% !important;
  max-width: 360px !important;
  min-width: 0 !important;
}

@media (max-width: 1180px){
  body.page-tarifs #packs .ds-packs-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: repeat(3, minmax(240px, 1fr)) !important;
    max-width: 100% !important;
  }
}

@media (max-width: 860px){
  body.page-tarifs #packs .ds-packs-grid,
  body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: 1fr !important;
  }

  body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-card,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
    max-width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce){
  body.page-home .ds-v12-path-card{
    transition:none !important;
  }
  body.page-home .ds-v12-path-card:hover{
    transform:none !important;
  }
}


/* =====================================================================
   DSTART — V13.10 CORRECTIONS VERROUILLÉES BADGE / FE
   Périmètre strict :
   1) Badge Pack 3 placé comme Pack le plus choisi sur Accueil + Tarifs
   2) Grille FE sans chevauchement sur Tarifs + Facture électronique
   ===================================================================== */

/* 1) Accueil + Tarifs — badge Pack 3 exactement au même emplacement que Pack 2 */
body.page-home #packs .ds-pack-card.popular,
body.page-home #packs .ds-pack-card.limited,
body.page-tarifs #packs .ds-pack-card.popular,
body.page-tarifs #packs .ds-pack-card.limited{
  padding-top: 32px !important;
  overflow: visible !important;
}

body.page-home #packs .ds-pack-popular-badge,
body.page-home #packs .ds-pack-limited-badge,
body.page-tarifs #packs .ds-pack-popular-badge,
body.page-tarifs #packs .ds-pack-limited-badge{
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 120 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: calc(100% + 18px) !important;
  margin: 0 !important;
  padding: 6px 16px !important;
  overflow: visible !important;
  white-space: nowrap !important;
  line-height: 1.15 !important;
  pointer-events: none !important;
  border-radius: var(--ds-radius-pill) !important;
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
}

body.page-home #packs .ds-pack-limited-badge,
body.page-tarifs #packs .ds-pack-limited-badge{
  background: linear-gradient(135deg,#FFF6D8 0%,#F8E7A7 32%,#C9A84C 100%) !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  border: 1px solid rgba(255,246,216,.72) !important;
  box-shadow: 0 10px 28px rgba(248,231,167,.26) !important;
}

/* 2) Tarifs + Facture électronique — grille FE propre, centrée, sans chevauchement */
body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
  width: 100% !important;
  max-width: 1160px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(22px, 2.4vw, 32px) !important;
  justify-content: center !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  overflow: visible !important;
}

body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-card,
body.page-fe .ds-fe-offres-section .ds-tarifs-fe-card{
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

@media (max-width: 1080px){
  body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: 780px !important;
  }
}

@media (max-width: 720px){
  body.page-tarifs .ds-tarifs-fe-section .ds-tarifs-fe-grid,
  body.page-fe .ds-fe-offres-section .ds-tarifs-fe-grid{
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }
}


/* =====================================================================
   DSTART — V13.11 VERROU BADGE ACCUEIL / HOVER TARIFS
   Périmètre strict :
   1) Accueil : bandeau "Offre de lancement limitée" positionné comme "Pack le plus choisi"
   2) Tarifs : animation hover uniquement sur les cards abonnements
   ===================================================================== */

/* 1) Accueil — Pack 3 : badge aligné exactement comme le badge du Pack 2 */
body.page-home #packs .ds-pack-card.limited{
  overflow: visible !important;
  padding-top: 32px !important;
}

body.page-home #packs .ds-pack-card.limited .ds-pack-limited-badge,
body.page-home #packs .ds-pack-limited-badge{
  position: absolute !important;
  top: -15px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  z-index: 180 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: calc(100% + 18px) !important;
  margin: 0 !important;
  padding: 6px 16px !important;
  overflow: visible !important;
  white-space: nowrap !important;
  line-height: 1.15 !important;
  pointer-events: none !important;
}

/* 2) Tarifs — animation de mouvement uniquement sur les cards abonnements */
body.page-tarifs #packs .ds-pack-card{
  transition:
    transform .28s cubic-bezier(.22,.61,.36,1),
    border-color .28s ease,
    box-shadow .28s ease,
    background .28s ease !important;
  will-change: transform !important;
}

body.page-tarifs #packs .ds-pack-card:hover{
  transform: translateY(-8px) !important;
  border-color: rgba(248,231,167,.46) !important;
  box-shadow:
    0 0 0 1px rgba(248,231,167,.12),
    0 20px 58px rgba(0,0,0,.42),
    0 0 34px rgba(201,168,76,.16) !important;
}

body.page-tarifs #packs .ds-pack-card:hover .ds-pack-tagline{
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

@media (prefers-reduced-motion: reduce){
  body.page-tarifs #packs .ds-pack-card{
    transition: none !important;
  }
  body.page-tarifs #packs .ds-pack-card:hover{
    transform: none !important;
  }
}


/* =====================================================================
   DSTART — V13.12 DIAGNOSTIC PREMIUM VERROUILLÉ
   Périmètre strict :
   - Prix hero Diagnostic Premium lisible
   - CTA hero Diagnostic Premium vers Diagnostic gratuit
   - Titre "Fait pour vous si" propre
   ===================================================================== */

body.page-diagnostic-premium .ds-diag-hero-price{
  align-items: center !important;
  gap: clamp(16px, 2vw, 26px) !important;
  background: linear-gradient(145deg, rgba(201,168,76,.075), rgba(255,255,255,.028)) !important;
  border: 1px solid rgba(248,231,167,.24) !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.22) !important;
}

body.page-diagnostic-premium .ds-diag-hero-price-amount{
  color: #F8E7A7 !important;
  -webkit-text-fill-color: #F8E7A7 !important;
  background: none !important;
  text-shadow: 0 0 22px rgba(248,231,167,.18) !important;
}

body.page-diagnostic-premium .ds-diag-hero-price-suffix{
  color: #FFF6D8 !important;
  -webkit-text-fill-color: #FFF6D8 !important;
  font-weight: 800 !important;
}

body.page-diagnostic-premium .ds-diag-hero-price-details span{
  color: rgba(255,255,255,.78) !important;
  -webkit-text-fill-color: rgba(255,255,255,.78) !important;
}

body.page-diagnostic-premium .ds-diag-hero-actions .ds-btn-gold{
  background: linear-gradient(135deg,#F8E7A7 0%,#C9A84C 100%) !important;
  color: #07101F !important;
  -webkit-text-fill-color: #07101F !important;
  border: 1px solid rgba(255,246,216,.60) !important;
  box-shadow: 0 14px 36px rgba(201,168,76,.30) !important;
}

body.page-diagnostic-premium .ds-diag-section-title em{
  display: inline-block !important;
  padding-right: .02em !important;
}

@media (max-width: 760px){
  body.page-diagnostic-premium .ds-diag-hero-price{
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}


/* =====================================================================
   DSTART — V13.14 MESSAGES CTA INTELLIGENTS
   Modal secteur + WhatsApp/email pré-rempli. Scope isolé.
   ===================================================================== */
body.ds-smart-cta-lock{ overflow:hidden !important; }
.ds-smart-cta-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:999999!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  background:rgba(3,7,18,.78)!important;
  backdrop-filter:blur(14px)!important;
}
.ds-smart-cta-overlay.is-open{ display:flex!important; }
.ds-smart-cta-modal{
  position:relative!important;
  width:min(100%,720px)!important;
  max-height:min(92vh,780px)!important;
  overflow:auto!important;
  border-radius:28px!important;
  padding:30px!important;
  background:
    radial-gradient(circle at 80% 0%,rgba(248,231,167,.13),transparent 34%),
    linear-gradient(145deg,rgba(13,27,62,.98),rgba(10,15,30,.98))!important;
  border:1px solid rgba(248,231,167,.26)!important;
  box-shadow:0 34px 110px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.035)!important;
  color:#fff!important;
}
.ds-smart-cta-close{
  position:absolute!important;
  top:14px!important;
  right:16px!important;
  width:38px!important;
  height:38px!important;
  border-radius:999px!important;
  border:1px solid rgba(248,231,167,.22)!important;
  background:rgba(255,255,255,.04)!important;
  color:#F8E7A7!important;
  font-size:24px!important;
  line-height:1!important;
  cursor:pointer!important;
}
.ds-smart-cta-kicker{
  font-family:'DM Mono',ui-monospace,monospace!important;
  font-size:11px!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  color:#F8E7A7!important;
  margin-bottom:12px!important;
}
.ds-smart-cta-title{
  font-family:'Playfair Display',serif!important;
  font-size:clamp(30px,4vw,46px)!important;
  line-height:1.05!important;
  margin:0 42px 12px 0!important;
  color:#fff!important;
}
.ds-smart-cta-desc{
  color:rgba(255,255,255,.74)!important;
  line-height:1.6!important;
  margin:0 0 20px!important;
}
.ds-smart-cta-label{
  display:block!important;
  font-family:'DM Mono',ui-monospace,monospace!important;
  font-size:11px!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  color:rgba(248,231,167,.92)!important;
  margin:0 0 8px!important;
}
.ds-smart-cta-select{
  width:100%!important;
  padding:15px 16px!important;
  border-radius:16px!important;
  border:1px solid rgba(248,231,167,.24)!important;
  background:rgba(3,7,18,.72)!important;
  color:#fff!important;
  font-family:'DM Sans',system-ui,sans-serif!important;
  font-size:15px!important;
  outline:none!important;
}
.ds-smart-cta-preview{
  white-space:pre-wrap!important;
  margin:18px 0!important;
  padding:16px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  color:rgba(255,255,255,.76)!important;
  font-size:13px!important;
  line-height:1.55!important;
  max-height:190px!important;
  overflow:auto!important;
}
.ds-smart-cta-actions{
  display:flex!important;
  gap:12px!important;
  flex-wrap:wrap!important;
  margin-top:16px!important;
}
.ds-smart-cta-wa,.ds-smart-cta-mail{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:48px!important;
  padding:14px 20px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,246,216,.54)!important;
  background:linear-gradient(135deg,#F8E7A7 0%,#C9A84C 100%)!important;
  color:#07101F!important;
  -webkit-text-fill-color:#07101F!important;
  font-family:'DM Sans',system-ui,sans-serif!important;
  font-weight:800!important;
  font-size:12px!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  cursor:pointer!important;
  box-shadow:0 14px 34px rgba(201,168,76,.24)!important;
}
.ds-smart-cta-mail{
  background:transparent!important;
  color:#F8E7A7!important;
  -webkit-text-fill-color:#F8E7A7!important;
}
.ds-smart-cta-original{
  display:inline-block!important;
  margin-top:16px!important;
  color:rgba(255,255,255,.58)!important;
  font-size:13px!important;
  text-decoration:underline!important;
  text-underline-offset:4px!important;
}
@media (max-width: 640px){
  .ds-smart-cta-modal{ padding:24px 18px!important; border-radius:22px!important; }
  .ds-smart-cta-actions{ flex-direction:column!important; }
  .ds-smart-cta-wa,.ds-smart-cta-mail{ width:100%!important; }
}


/* =====================================================================
   DSTART — V13.15 FIX DIAGNOSTIC LINKS / TITRES LÉGAUX
   Périmètre strict :
   - Les liens vers diagnostic-gratuit.html et diagnostic-premium.html naviguent normalement
   - Titres hero CGV / Mentions légales / Politique de confidentialité non tronqués
   ===================================================================== */

body.page-cgv .ds-legal-hero,
body.page-mentions-legales .ds-legal-hero,
body.page-politique-confidentialite .ds-legal-hero{
  overflow: visible !important;
}

body.page-cgv .ds-legal-hero-inner,
body.page-mentions-legales .ds-legal-hero-inner,
body.page-politique-confidentialite .ds-legal-hero-inner{
  max-width: min(100%, 1060px) !important;
  overflow: visible !important;
}

body.page-cgv .ds-legal-hero-title,
body.page-mentions-legales .ds-legal-hero-title,
body.page-politique-confidentialite .ds-legal-hero-title{
  overflow: visible !important;
  max-width: 100% !important;
  white-space: normal !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.12 !important;
  padding-bottom: .08em !important;
  font-size: clamp(34px, 4.6vw, 62px) !important;
}

body.page-cgv .ds-legal-hero-title em,
body.page-mentions-legales .ds-legal-hero-title em,
body.page-politique-confidentialite .ds-legal-hero-title em{
  display: inline-block !important;
  padding-bottom: .06em !important;
}


/* V13.15 — complément classes réelles des pages légales */
body.page-mentions .ds-legal-hero,
body.page-confidentialite .ds-legal-hero{
  overflow: visible !important;
}

body.page-mentions .ds-legal-hero-inner,
body.page-confidentialite .ds-legal-hero-inner{
  max-width: min(100%, 1060px) !important;
  overflow: visible !important;
}

body.page-mentions .ds-legal-hero-title,
body.page-confidentialite .ds-legal-hero-title{
  overflow: visible !important;
  max-width: 100% !important;
  white-space: normal !important;
  text-wrap: balance !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.12 !important;
  padding-bottom: .08em !important;
  font-size: clamp(34px, 4.6vw, 62px) !important;
}

body.page-mentions .ds-legal-hero-title em,
body.page-confidentialite .ds-legal-hero-title em{
  display: inline-block !important;
  padding-bottom: .06em !important;
}


/* =====================================================================
   DSTART — V14 NOUVEL ANGLE DONNÉES PROPRES
   Ajouts éditoriaux isolés : aucune modification des composants existants.
   ===================================================================== */

.ds-v14-signal-section,
.ds-v14-data-section,
.ds-v14-diagnostic-note,
.ds-v14-price-angle,
.ds-v14-pack-angle,
.ds-v14-test-note{
  position: relative;
  padding: clamp(54px, 7vw, 92px) var(--ds-page-x);
  background:
    radial-gradient(circle at 12% 10%, rgba(201,168,76,.10), transparent 32%),
    linear-gradient(180deg, rgba(7,16,31,.98), rgba(10,15,30,.96));
  border-top: 1px solid rgba(248,231,167,.10);
  border-bottom: 1px solid rgba(255,255,255,.06);
  overflow: hidden;
}

.ds-v14-signal-inner,
.ds-v14-data-inner,
.ds-v14-diagnostic-inner,
.ds-v14-price-inner,
.ds-v14-pack-inner,
.ds-v14-test-inner{
  position: relative;
  z-index: 2;
  max-width: 1180px;
  margin: 0 auto;
}

.ds-v14-signal-inner,
.ds-v14-data-inner,
.ds-v14-price-inner{
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr);
  gap: clamp(26px, 4vw, 54px);
  align-items: center;
}

.ds-v14-kicker{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #F8E7A7;
  margin-bottom: 16px;
}

.ds-v14-kicker::before{
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(135deg,#FFF6D8,#C9A84C);
  box-shadow: 0 0 18px rgba(248,231,167,.44);
}

.ds-v14-title{
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(32px, 4.7vw, 58px);
  line-height: 1.04;
  letter-spacing: -0.035em;
  color: #FFFFFF;
  margin: 0 0 18px;
  overflow: visible;
}

.ds-v14-title em{
  font-style: italic;
  background: linear-gradient(135deg,#FFF6D8 0%,#F8E7A7 35%,#C9A84C 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ds-v14-lead,
.ds-v14-data-text p,
.ds-v14-diagnostic-inner p,
.ds-v14-price-inner p,
.ds-v14-pack-inner p{
  color: rgba(255,255,255,.74);
  font-size: clamp(16px, 1.5vw, 18px);
  line-height: 1.78;
  max-width: 760px;
  margin: 0;
}

.ds-v14-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.ds-v14-link-primary,
.ds-v14-link-secondary{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 18px;
  border-radius: var(--ds-radius-pill);
  font-weight: 900;
  text-decoration: none;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ds-v14-link-primary{
  background: linear-gradient(135deg,#F8E7A7 0%,#C9A84C 100%);
  color: #07101F;
  box-shadow: 0 14px 36px rgba(201,168,76,.24);
}

.ds-v14-link-secondary{
  color: #FFFFFF;
  border: 1px solid rgba(248,231,167,.26);
  background: rgba(255,255,255,.035);
}

.ds-v14-link-primary:hover,
.ds-v14-link-secondary:hover{
  transform: translateY(-3px);
  border-color: rgba(248,231,167,.50);
}

.ds-v14-signal-grid,
.ds-v14-price-cards{
  display: grid;
  gap: 14px;
}

.ds-v14-signal-card,
.ds-v14-price-cards div,
.ds-v14-alert-box{
  position: relative;
  padding: 20px;
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(255,255,255,.070), rgba(255,255,255,.030));
  border: 1px solid rgba(248,231,167,.16);
  box-shadow: 0 18px 50px rgba(0,0,0,.20);
}

.ds-v14-signal-card span{
  display: inline-flex;
  margin-bottom: 10px;
  padding: 4px 9px;
  border-radius: var(--ds-radius-pill);
  background: rgba(248,231,167,.10);
  border: 1px solid rgba(248,231,167,.22);
  color: #F8E7A7;
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .10em;
}

.ds-v14-signal-card strong,
.ds-v14-price-cards strong,
.ds-v14-alert-box strong{
  display: block;
  color: #FFFFFF;
  font-size: 18px;
  margin-bottom: 8px;
}

.ds-v14-signal-card p,
.ds-v14-price-cards span,
.ds-v14-alert-box p{
  color: rgba(255,255,255,.68);
  line-height: 1.6;
  margin: 0;
}

.ds-v14-data-list{
  display: grid;
  gap: 12px;
}

.ds-v14-data-list div{
  display: grid;
  grid-template-columns: 52px minmax(0,1fr);
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.09);
}

.ds-v14-data-list strong{
  color: #F8E7A7;
  font-family: 'DM Mono', monospace;
  font-size: 13px;
}

.ds-v14-data-list span{
  color: rgba(255,255,255,.76);
  line-height: 1.45;
}

.ds-v14-diagnostic-inner,
.ds-v14-pack-inner{
  max-width: 980px;
  text-align: center;
}

.ds-v14-diagnostic-inner p,
.ds-v14-pack-inner p{
  margin-left: auto;
  margin-right: auto;
}

.ds-v14-mini-grid{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.ds-v14-mini-grid span{
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border-radius: var(--ds-radius-pill);
  background: rgba(248,231,167,.085);
  border: 1px solid rgba(248,231,167,.18);
  color: rgba(255,255,255,.84);
  font-weight: 800;
  font-size: 13px;
}

.ds-v14-test-note{
  padding-top: 28px;
  padding-bottom: 28px;
  background: linear-gradient(135deg, rgba(201,168,76,.10), rgba(7,16,31,.96));
}

.ds-v14-test-inner{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.ds-v14-test-inner strong{
  color: #F8E7A7;
}

.ds-v14-test-inner span{
  color: rgba(255,255,255,.76);
}

.ds-v14-faq-added summary{
  color: #FFF6D8;
}

@media (max-width: 900px){
  .ds-v14-signal-inner,
  .ds-v14-data-inner,
  .ds-v14-price-inner{
    grid-template-columns: 1fr;
  }
  .ds-v14-signal-section,
  .ds-v14-data-section,
  .ds-v14-diagnostic-note,
  .ds-v14-price-angle,
  .ds-v14-pack-angle{
    padding-top: 52px;
    padding-bottom: 58px;
  }
}

@media (max-width: 620px){
  .ds-v14-title{
    font-size: clamp(30px, 11vw, 42px);
  }
  .ds-v14-actions{
    flex-direction: column;
  }
  .ds-v14-link-primary,
  .ds-v14-link-secondary{
    width: 100%;
  }
  .ds-v14-data-list div{
    grid-template-columns: 1fr;
    gap: 6px;
  }
}


/* ═══ V30 — Cards signaux (SIRET / TVA / FLUX) : contour doré + intérieur enrichi ═══ */
.ds-v14-signal-card{
  position: relative;
  border: 1px solid rgba(201,168,76,.55) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,231,167,.10), transparent 55%),
    linear-gradient(160deg, rgba(248,231,167,.05), rgba(13,27,62,.55)) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(248,231,167,.14) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ds-v14-signal-card::before{
  content:""; position:absolute; top:0; left:16px; right:16px; height:2px;
  background: linear-gradient(90deg, transparent, rgba(248,231,167,.65), transparent);
  border-radius: 2px;
}
.ds-v14-signal-card:hover{
  transform: translateY(-3px);
  border-color: rgba(248,231,167,.8) !important;
  box-shadow: 0 20px 44px rgba(0,0,0,.34), 0 0 0 1px rgba(248,231,167,.18) !important;
}
.ds-v14-signal-card span{
  background: linear-gradient(120deg, rgba(248,231,167,.18), rgba(201,168,76,.10)) !important;
  border-color: rgba(248,231,167,.45) !important;
}

/* ═══ V30 — Héro FE : mockup légèrement rehaussé (évite la troncature sur 15,6") ═══ */
.ds-fe-hero-mockup{ transform: translateY(-28px); }
@media (max-width: 900px){ .ds-fe-hero-mockup{ transform: none; } }

/* ═══ V30 — Étapes FE : chiffres 3/4 complets (le dégradé clippé coupait les débords de glyphe) ═══ */
.ds-fe-process-num{ line-height: 1.25 !important; padding: 2px 4px 6px 0 !important; margin-bottom: 8px !important; }

/* ═══ V30 — Tarifs : encadrés "coût visible / coût caché / gain utile" en doré ═══ */
.ds-v14-price-cards > div{
  position: relative;
  border: 1px solid rgba(201,168,76,.55) !important;
  border-radius: 16px !important;
  padding: 18px 18px 16px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(248,231,167,.10), transparent 55%),
    linear-gradient(160deg, rgba(248,231,167,.05), rgba(13,27,62,.55)) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(248,231,167,.14) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ds-v14-price-cards > div::before{
  content:""; position:absolute; top:0; left:16px; right:16px; height:2px;
  background: linear-gradient(90deg, transparent, rgba(248,231,167,.65), transparent);
  border-radius: 2px;
}
.ds-v14-price-cards > div:hover{
  transform: translateY(-3px);
  border-color: rgba(248,231,167,.8) !important;
  box-shadow: 0 20px 44px rgba(0,0,0,.34), 0 0 0 1px rgba(248,231,167,.18) !important;
}
.ds-v14-price-cards > div strong{ color:#F8E7A7 !important; }

/* ===== 23. Services complémentaires FE (partagé tarifs + facturation) ===== */
.ds-tarifs-fe-services{margin-top:32px;padding:26px;background:rgba(201,168,76,.04);border:1px solid rgba(201,168,76,.28);border-radius:14px}
.ds-tarifs-fe-services-title{font-size:17px;color:#C9A84C;margin:0 0 18px;font-weight:700}
.ds-tarifs-fe-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.ds-fe-svc{display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:rgba(255,255,255,.02);border:1px solid rgba(201,168,76,.30);border-radius:10px;transition:all .25s ease}
.ds-fe-svc:hover{border-color:#E8CC7A;background:rgba(201,168,76,.09);transform:translateY(-3px);box-shadow:0 8px 22px rgba(201,168,76,.15)}
.ds-fe-svc-name{font-size:13px;color:#e8e6df;font-weight:600}
.ds-fe-svc-price{font-size:15px;color:#C9A84C;font-weight:800}
.ds-fe-svc-for{font-size:11px;color:rgba(255,255,255,.35)}


/* ===== 24. MENU MOBILE — bouton burger + ouverture (correctif audit BUG-00) ===== */
.ds-nav-toggle{
  display:none; background:none; border:0; cursor:pointer;
  width:42px; height:42px; padding:9px; border-radius:9px;
  align-items:center; justify-content:center; flex-direction:column; gap:5px;
  transition:background .2s ease;
}
.ds-nav-toggle span{
  display:block; width:22px; height:2px; border-radius:2px;
  background:#F8E7A7; transition:transform .25s ease, opacity .2s ease;
}
.ds-nav-toggle:hover{background:rgba(201,168,76,.12)}
.ds-nav-toggle:focus-visible{outline:2px solid #F8E7A7; outline-offset:2px}
.ds-nav-toggle.is-active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ds-nav-toggle.is-active span:nth-child(2){opacity:0}
.ds-nav-toggle.is-active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width: 860px){
  .ds-nav-toggle{display:flex !important}
  nav.ds-nav{flex-wrap:wrap !important}
  /* Le menu s'ouvre quand la classe is-open est posée par le JS */
  .ds-nav-links.is-open{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    flex-basis:100% !important;
    max-height:72vh !important;
    overflow-y:auto !important;
    gap:0 !important;
    margin-top:10px !important;
    padding:8px 0 !important;
    background:rgba(7,16,31,.98) !important;
    border-top:1px solid rgba(201,168,76,.25) !important;
    border-radius:0 0 12px 12px !important;
  }
  .ds-nav-links.is-open a{
    display:block !important;
    width:100% !important;
    padding:13px 18px !important;
    font-size:13px !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important;
  }
  .ds-nav-links.is-open a:last-child{border-bottom:0 !important}
}


/* ===== 25. CONTRASTE CTA DORÉS — WCAG AA (correctif audit BUG-13/23) ===== */
/* Texte navy foncé sur fond doré : ratio ~8:1 au lieu de 1,57:1 */
.ds-nav-cta,
.ds-btn-gold,
.ds-cta-gold,
a.ds-btn-primary,
button.ds-btn-primary,
.ds-hero-cta-primary{
  color:#07101F !important;
  -webkit-text-fill-color:#07101F !important;
  text-shadow:none !important;
  font-weight:700 !important;
}
.ds-nav-cta:hover,
.ds-btn-gold:hover,
.ds-cta-gold:hover,
a.ds-btn-primary:hover,
button.ds-btn-primary:hover,
.ds-hero-cta-primary:hover{
  color:#07101F !important;
  -webkit-text-fill-color:#07101F !important;
}
/* Focus clavier visible (logo + liens de nav) */
.ds-nav-brand:focus-visible,
.ds-nav-links a:focus-visible,
.ds-nav-cta:focus-visible{
  outline:2px solid #F8E7A7 !important;
  outline-offset:3px !important;
  border-radius:6px;
}

/* ===== BUG-17 : focus clavier visible sur les logos (WCAG 2.4.7) ===== */
.ds-nav-brand:focus-visible,
.ds-footer-logo:focus-visible,
a:focus-visible .ds-nav-logo-img,
a:focus-visible .ds-footer-logo-img{
  outline:2px solid #F8E7A7 !important;
  outline-offset:3px !important;
  border-radius:6px;
}


/* ═══ FOCUS CLAVIER GÉNÉRALISÉ (audit K/facultatif-6) ═══
   Anneau de focus visible sur tout élément interactif, pas seulement les champs. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
details > summary:focus-visible{
  outline:2px solid #F8E7A7 !important;
  outline-offset:3px !important;
  border-radius:6px;
}
/* Ne jamais supprimer le focus sans alternative visible */
*:focus-visible{outline-color:#F8E7A7}


/* ═══ SUPPRESSION ENCADRES COMPTEURS FOMO (demande client) ═══
   Les compteurs restent, seuls les encadres qui les entourent disparaissent. */

/* Page Facture Electronique : encadre cyan autour du compte a rebours */
.ds-fe-countdown{
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:8px 0 !important;
  box-shadow:none !important;
}

/* Page Accueil : bandeau de fond degrade autour de la section compteur */
.ds-countdown-section{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* ═══════════════════════════════════════════════════════════════
   COUNTDOWN FE — RÉINITIALISATION FINALE PROPRE (V33)
   Neutralise tout l'empilement historique. Blocs chiffres = pastilles
   dorées autonomes, AUCUN rectangle/bordure autour du groupe.
   ═══════════════════════════════════════════════════════════════ */

/* Conteneur global : totalement transparent, aucun cadre */
.ds-fe-countdown{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 8px 0 !important;
  margin-bottom: 32px !important;
  box-shadow: none !important;
  text-align: center !important;
}

/* Label "Plus que" : pastille dorée discrète */
.ds-fe-countdown-label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 18px !important;
  margin-bottom: 16px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  background: linear-gradient(135deg, rgba(201,168,76,.14), rgba(232,204,122,.05)) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

/* Grille : simple flex, transparent, SANS cadre ni débordement caché */
.ds-fe-countdown-grid{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Blocs chiffres : pastilles dorées autonomes, halo léger, PAS de rectangle */
.ds-fe-countdown-block{
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  padding: clamp(14px,2vw,20px) clamp(15px,2.2vw,22px) !important;
  min-width: clamp(72px,8vw,105px) !important;
  border-radius: 18px !important;
  border: 1px solid rgba(232,204,122,.24) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(248,231,167,.10), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.016)) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.38) !important;
  isolation: isolate !important;
  overflow: visible !important;
}

/* On ÉTEINT DÉFINITIVEMENT les pseudo-éléments qui créaient les cadres fantômes */
.ds-fe-countdown-block::before,
.ds-fe-countdown-block::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* Chiffres dorés */
.ds-fe-countdown-value{
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(34px,4.5vw,46px) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  background: linear-gradient(160deg, #FFF6D8 0%, #F8E7A7 35%, #E8CC7A 60%, #C9A84C 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* Unité (jours/h/m) */
.ds-fe-countdown-unit{
  font-family: 'DM Mono', monospace !important;
  font-size: 9.5px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.48) !important;
  margin-top: 6px !important;
}

/* Séparateur ":" doré, sans cadre */
.ds-fe-countdown-sep{
  font-family: 'Playfair Display', serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: #E8CC7A !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  align-self: center !important;
  padding: 0 2px !important;
}

/* Deadline sous le compteur */
.ds-fe-countdown-deadline{
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .08em !important;
  color: rgba(255,255,255,.55) !important;
  background: transparent !important;
  border: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════
   COUNTDOWN ACCUEIL — RÉINITIALISATION FINALE PROPRE (V35)
   Neutralise le grand rectangle doré hérité d'un patch FE
   qui s'appliquait par erreur à .ds-countdown-section.
   La section = transparente. Seuls les blocs-chiffres ont un cadre.
   ═══════════════════════════════════════════════════════════════ */

/* La SECTION et le groupe : aucun cadre, aucun fond, aucune ombre */
.ds-countdown-section,
.ds-countdown-wrap,
.ds-countdown{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  isolation: auto !important;
}
.ds-countdown-section{
  background: linear-gradient(180deg, var(--ds-night-200,#0A0F1E) 0%, var(--ds-night-300,#050A18) 100%) !important;
  padding: 80px var(--ds-page-x) !important;
  text-align: center !important;
}
.ds-countdown-section::before,
.ds-countdown-section::after,
.ds-countdown-wrap::before,
.ds-countdown-wrap::after,
.ds-countdown::before,
.ds-countdown::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* Les 4 blocs-chiffres : pastilles dorées autonomes (le SEUL cadre voulu) */
.ds-countdown-block{
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 14px !important;
  min-width: 76px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(232,204,122,.24) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(248,231,167,.10), transparent 58%),
    linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.016)) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.38) !important;
  isolation: isolate !important;
}
.ds-countdown-block::before,
.ds-countdown-block::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* Chiffres dorés + labels + séparateur, sans cadre */
.ds-countdown-value{
  font-family: 'Playfair Display', serif !important;
  font-size: clamp(30px,4vw,44px) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  background: linear-gradient(160deg,#FFF6D8 0%,#F8E7A7 35%,#E8CC7A 60%,#C9A84C 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
.ds-countdown-label{
  font-family: 'DM Mono', monospace !important;
  font-size: 9.5px !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.48) !important;
  background: transparent !important;
  border: 0 !important;
}
.ds-countdown-separator{
  font-family: 'Playfair Display', serif !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  color: #E8CC7A !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  align-self: center !important;
}
.ds-countdown-tag{
  color: #E8CC7A !important;
  background: transparent !important;
  border: 0 !important;
}

/* Deadline FE reformatée en pastille dorée — copie fidèle du tag accueil (V35) */
.ds-fe-countdown-deadline{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 14px !important;
  padding: 8px 18px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #E8CC7A !important;
  background: linear-gradient(135deg, rgba(201,168,76,.14), rgba(232,204,122,.05)) !important;
  border: 1px solid rgba(201,168,76,.3) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   FAQ — SUPPRESSION DU RECTANGLE AUTOUR DES CROIX (V35)
   Le contour de focus doré s'affichait au clic sur les summary.
   On le retire sur les summary FAQ (le "+/×" reste, sans cadre),
   tout en gardant l'accessibilité clavier via un focus discret.
   ═══════════════════════════════════════════════════════════════ */
.ds-faq-item > summary:focus,
.ds-faq-item > summary:focus-visible{
  outline: none !important;
  outline-offset: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* Accessibilité clavier conservée : léger halo doré uniquement au clavier */
.ds-faq-item > summary:focus-visible{
  color: #F8E7A7 !important;
}
/* La croix elle-même : jamais de cadre ni fond */
.ds-faq-item summary::after,
.ds-faq-item summary::marker,
.ds-faq-item summary::-webkit-details-marker{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════
   GARDE-FOU RESPONSIVE MOBILE (V35)
   Défense anti-débordement horizontal + sécurisation des décoratifs.
   ═══════════════════════════════════════════════════════════════ */
html, body{
  max-width: 100% !important;
  overflow-x: hidden !important;
}
/* Décoratifs : jamais de débordement, jamais d'interception de clic */
.ds-hero-v3-orb-1,
.ds-fe-hero-pulse{
  max-width: 100vw !important;
  pointer-events: none !important;
}
/* Sur très petit écran, réduire les décoratifs surdimensionnés */
@media (max-width: 560px){
  .ds-hero-v3-orb-1{ width: 280px !important; height: 280px !important; }
  .ds-fe-hero-pulse{ width: 320px !important; height: 320px !important; }
  /* Tableaux et grilles : jamais plus larges que l'écran */
  table, .ds-countdown, .ds-fe-countdown-grid{
    max-width: 100% !important;
  }
}


/* ============================================================
   CORRECTIF RESPONSIVE NAVBAR — V35 (audit iPhone)
   Répare l'entassement des liens sur mobile : en dessous de 860px,
   on masque les liens (sauf menu ouvert) et on montre le burger.
   Spécificité forte (nav.ds-nav ...) pour battre les !important existants.
   ============================================================ */
@media (max-width: 860px){
  /* Les liens fermés sont masqués (le burger prend le relais) */
  nav.ds-nav .ds-nav-links:not(.is-open){
    display:none !important;
    flex-basis:auto !important;
  }
  /* Le burger est visible et cliquable */
  nav.ds-nav .ds-nav-toggle{
    display:flex !important;
    order:3 !important;
  }
  /* La navbar reste sur une ligne : logo | CTA | burger */
  nav.ds-nav{
    flex-wrap:wrap !important;
    align-items:center !important;
    row-gap:0 !important;
  }
  /* Le menu ouvert occupe toute la largeur, sous la barre */
  nav.ds-nav .ds-nav-links.is-open{
    order:4 !important;
    flex-basis:100% !important;
  }
  /* Le CTA "Offre" reste compact et ne pousse pas le burger hors écran */
  nav.ds-nav .ds-nav-cta{
    order:2 !important;
    margin-left:auto !important;
    margin-right:8px !important;
    white-space:nowrap !important;
  }
}


/* ============================================================
   CORRECTIF DÉBORDEMENTS MOBILE — V35 (audit iPhone)
   Empêche les boutons, liens et blocs de dépasser la largeur écran.
   ============================================================ */
@media (max-width: 640px){
  /* Boutons et liens d'action : jamais plus larges que l'écran */
  .ds-btn-gold, .ds-btn-ghost,
  .ds-v14-link-primary, .ds-v14-link-secondary{
    max-width:100% !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    text-align:center !important;
  }
  /* Bloc compte à rebours : contraint dans l'écran */
  .ds-countdown-block, .ds-countdown, .ds-countdown-label,
  .ds-fe-countdown-grid{
    max-width:100% !important;
    box-sizing:border-box !important;
    flex-wrap:wrap !important;
  }
  /* Éléments décoratifs du hero qui débordaient (orbe, glow) : on les borne */
  .ds-hero-v3-orb, .ds-hero-v3-mockup-glow{
    max-width:100vw !important;
    overflow:hidden !important;
  }
  /* Filet de sécurité global : rien ne crée de scroll horizontal */
  body{overflow-x:hidden !important;}
}


/* Correctif orbe hero (position absolute qui débordait à droite) */
@media (max-width: 640px){
  .ds-hero-v3-orb{
    right:auto !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    max-width:90vw !important;
  }
  /* Le conteneur du hero masque tout débordement de ses décorations */
  [class*="ds-hero"]{ overflow-x:clip !important; }
}


/* Confinement des décorations du hero sur TOUS les écrans (orbe + glow) */
.ds-hero-v3, [class*="ds-hero-v3"]{
  overflow-x:clip;
}
.ds-hero-v3-orb-2, .ds-hero-v3-mockup-glow{
  max-width:100%;
}


/* Confinement de TOUS les orbes décoratifs du hero (1 et 2) */
[class*="ds-hero-v3-orb"]{
  max-width:100% !important;
}


/* SOLUTION SOURCE : le conteneur du hero masque les orbes qui débordent
   (orbes en position absolute avec décalages négatifs volontaires -100px/-50px).
   On confine au parent plutôt que de déplacer les décorations. */
.ds-hero-v3, section.ds-hero-v3, .ds-hero-v3-wrap, [class*="ds-hero-v3"]:not([class*="orb"]):not([class*="glow"]){
  overflow:hidden !important;
}


/* Ciblage direct et simple : la section hero et son fond masquent les orbes */
section.ds-hero-v3{ overflow:hidden !important; }
.ds-hero-v3-bg{ overflow:hidden !important; }

/* ===== Correctif ciblé : CTA header page Diagnostic Premium (lisibilité) ===== */
/* Le bouton doré du hero était trop clair/peu lisible : on renforce le contraste
   UNIQUEMENT sur cette page, sans impacter les autres .ds-btn-gold du site. */
body.page-diagnostic-premium .ds-diag-hero-actions .ds-btn-gold {
  background: linear-gradient(135deg, #C9A84C 0%, #B8942F 100%) !important;
  color: #050A18 !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 24px rgba(201, 168, 76, 0.40) !important;
}
body.page-diagnostic-premium .ds-diag-hero-actions .ds-btn-gold span {
  color: #050A18 !important;
}
body.page-diagnostic-premium .ds-diag-hero-actions .ds-btn-gold svg {
  stroke: #050A18 !important;
}

/* ===== Correctif responsive : grille "Nos missions" (7 encadrés) ===== */
/* La grille .ds-missions-grid restait en 3 colonnes sur mobile → cartes écrasées.
   On passe à 2 colonnes sur tablette et 1 colonne sur mobile. */
@media (max-width: 900px) {
  .ds-missions-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
}
@media (max-width: 640px) {
  .ds-missions-grid { grid-template-columns: 1fr; gap: 16px; }
}