/* ══════════════════════════════════════════════════
   DATA PAGE — LIGHT PREMIUM THEME
   white · cyan #06b6d4 · blue #3b82f6
══════════════════════════════════════════════════ */

/* ── Reset & Base ── */
.dp{
  font-family:Inter,'SF Pro Display',sans-serif;
  background:#fff;
  color:#0f172a;
  --cyan:#06b6d4;
  --blue:#3b82f6;
  --cyan-d:#0891b2;
  --text:#0f172a;
  --muted:#64748b;
  --muted-l:#94a3b8;
  --border:rgba(0,0,0,.07);
  --card:#fff;
  --bg-alt:#f7fafd;
  --shadow-sm:0 2px 16px rgba(0,0,0,.07),0 0 0 1px rgba(0,0,0,.05);
  --shadow-md:0 8px 40px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.05);
  --shadow-lg:0 24px 72px rgba(0,0,0,.14),0 0 0 1px rgba(0,0,0,.05);
  --ease:cubic-bezier(.2,.8,.2,1);
}
.dp *,.dp *::before,.dp *::after{box-sizing:border-box;}
.dp a{color:inherit;text-decoration:none;}

/* ── Layout ── */
.dp-wrap{max-width:1200px;margin:0 auto;padding:0 max(5vw,40px);}
.dp-sec{padding:120px 0;position:relative;}
.dp-sec-alt{background:var(--bg-alt);}

/* ── Eyebrow ── */
.dp-ey{
  display:inline-flex;align-items:center;gap:9px;
  font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cyan-d);margin-bottom:18px;
}
.dp-ey::before{
  content:'';width:22px;height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  border-radius:2px;flex-shrink:0;
}

/* ── Headings ── */
.dp-h1{
  font-size:clamp(40px,5.5vw,76px);font-weight:900;letter-spacing:-.055em;
  line-height:1.04;margin:0 0 22px;color:#0f172a;
}
.dp-h2{
  font-size:clamp(28px,3.5vw,50px);font-weight:900;letter-spacing:-.045em;
  line-height:1.1;margin:0 0 18px;color:#0f172a;
}
.dp-h2 em{
  font-style:normal;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.dp-lead{
  font-size:clamp(15px,1.5vw,18px);line-height:1.75;
  color:var(--muted);max-width:560px;margin:0 0 38px;
}

/* ── Buttons ── */
.dp-btn-primary{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 30px;border-radius:14px;font-size:15px;font-weight:700;
  background:linear-gradient(135deg,var(--cyan),var(--blue));color:#fff;
  box-shadow:0 4px 24px rgba(6,182,212,.4);
  transition:transform .25s var(--ease),box-shadow .25s;
}
.dp-btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(6,182,212,.55);}
.dp-btn-ghost{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;border-radius:14px;font-size:15px;font-weight:700;
  border:1.5px solid rgba(0,0,0,.12);color:#374151;
  transition:border-color .25s,color .25s,background .25s;
}
.dp-btn-ghost:hover{border-color:var(--cyan);color:var(--cyan-d);background:rgba(6,182,212,.05);}

/* ── Bouton retour accueil ── */
.dp-hero-nav{
  position:absolute;top:100px;left:max(5vw,40px);z-index:10;
}
.dp-back-btn{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;color:#374151;
  padding:9px 18px;border-radius:99px;
  border:1.5px solid rgba(0,0,0,.1);background:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.08);
  transition:color .2s,border-color .2s,transform .2s,box-shadow .2s;
}
.dp-back-btn i{font-size:11px;transition:transform .2s;}
.dp-back-btn:hover{
  color:var(--cyan-d);border-color:rgba(6,182,212,.3);
  transform:translateX(-3px);box-shadow:0 4px 20px rgba(6,182,212,.18);
}
.dp-back-btn:hover i{transform:translateX(-3px);}

/* ── Avatar carte flottante ── */
.dp-fc-avatar{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#06b6d4,#3b82f6);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:16px;margin-bottom:10px;
  box-shadow:0 4px 14px rgba(6,182,212,.45);
  animation:dpAvatarBob 3.2s ease-in-out infinite;
  position:relative;
}
.dp-fc-avatar::after{
  content:'';position:absolute;inset:-3px;border-radius:50%;
  border:2px solid rgba(6,182,212,.25);
  animation:dpAvatarRing 3.2s ease-in-out infinite;
}
@keyframes dpAvatarBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes dpAvatarRing{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.15);opacity:0}}

/* ── Reveal (scroll) ── */
.dp-reveal{
  opacity:0;transform:translateY(26px);
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.dp-reveal.dp-vis{opacity:1;transform:translateY(0);}
.dp-reveal-left{
  opacity:0;transform:translateX(-26px);
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.dp-reveal-left.dp-vis{opacity:1;transform:translateX(0);}
.dp-reveal-right{
  opacity:0;transform:translateX(26px);
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.dp-reveal-right.dp-vis{opacity:1;transform:translateX(0);}

/* ══════════════════════════════════════════════════
   HERO
══════════════════════════════════════════════════ */
.dp-hero{
  min-height:100vh;
  display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;max-width:1400px;margin:0 auto;width:100%;
  padding:140px max(5vw,40px) 100px;
  max-width:1200px;margin:0 auto;
  position:relative;z-index:2;
}
.dp-hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:32px;}
.dp-hero-meta{
  display:flex;align-items:center;gap:14px;
  font-size:12px;color:var(--muted);flex-wrap:wrap;
}
.dp-hero-meta-live{
  display:flex;align-items:center;gap:7px;
  padding:5px 12px;border-radius:99px;
  background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.2);
  color:#059669;font-weight:700;
}
.dp-hero-meta-dot{
  width:7px;height:7px;border-radius:50%;background:#10b981;
  box-shadow:0 0 8px rgba(16,185,129,.8);
  animation:dpLivePulse 2s ease-in-out infinite;flex-shrink:0;
}
@keyframes dpLivePulse{0%,100%{opacity:1}50%{opacity:.25}}
.dp-hero-meta-sep{color:rgba(0,0,0,.15);}

/* ── Hero visual : pré-caché bureau (GSAP le révèle) ── */
@media(min-width:768px){
  .dp-hero-visual{opacity:0;}
  .dp-hero-copy>*{opacity:0;}
  .dp-node{opacity:0;}
  .dp-float-card{opacity:0;}
}

/* ── Hero visual ── */
.dp-hero-visual{
  position:relative;height:540px;
  display:flex;align-items:center;justify-content:center;
}
.dp-network-wrap{
  position:relative;width:100%;height:100%;
  transform-style:preserve-3d;
}

/* SVG réseau */
.dp-network-svg{
  position:absolute;inset:0;width:100%;height:100%;
  filter:drop-shadow(0 0 20px rgba(6,182,212,.12));
}
.dp-net-line{
  stroke:rgba(6,182,212,.3);stroke-width:1.2;
  stroke-dasharray:5 5;
  animation:dpLineDash 3s linear infinite;
}
.dp-net-line-dim{
  stroke:rgba(59,130,246,.2);stroke-width:1;
  stroke-dasharray:4 7;
  animation:dpLineDash 4.5s linear infinite reverse;
}
@keyframes dpLineDash{to{stroke-dashoffset:-20}}

/* Hub central */
.dp-hub{
  position:absolute;top:calc(50% - 44px);left:calc(50% - 44px);
  width:88px;height:88px;z-index:3;
}
.dp-hub-inner{
  width:88px;height:88px;border-radius:50%;
  background:linear-gradient(135deg,#06b6d4,#3b82f6);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 40px rgba(6,182,212,.5),0 2px 8px rgba(59,130,246,.3);
  position:relative;z-index:2;
}
.dp-hub-inner i{font-size:30px;color:#fff;}
.dp-hub-ring{
  position:absolute;border-radius:50%;border:1.5px solid rgba(6,182,212,.25);
  top:50%;left:50%;transform:translate(-50%,-50%);
  animation:dpRingPulse 3.5s ease-out infinite;
}
.dp-hub-ring:nth-child(2){width:120px;height:120px;animation-delay:0s;}
.dp-hub-ring:nth-child(3){width:170px;height:170px;animation-delay:1.2s;border-color:rgba(6,182,212,.14);}
.dp-hub-ring:nth-child(4){width:230px;height:230px;animation-delay:2.4s;border-color:rgba(6,182,212,.07);}
@keyframes dpRingPulse{
  0%{opacity:.7;transform:translate(-50%,-50%) scale(.75)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.15)}
}

/* Nœuds satellites */
.dp-node{
  position:absolute;
  width:48px;height:48px;border-radius:50%;
  background:#fff;border:1.5px solid rgba(6,182,212,.35);
  display:flex;align-items:center;justify-content:center;
  font-size:17px;color:var(--cyan-d);
  box-shadow:0 4px 20px rgba(6,182,212,.2),0 0 0 4px rgba(6,182,212,.07);
  z-index:2;
  transition:box-shadow .3s;
}
.dp-node:hover{box-shadow:0 8px 32px rgba(6,182,212,.35),0 0 0 6px rgba(6,182,212,.1);}
.dp-node:nth-child(1){top:5%;left:42%;}
.dp-node:nth-child(2){top:18%;right:8%;}
.dp-node:nth-child(3){top:50%;right:2%;}
.dp-node:nth-child(4){bottom:12%;right:18%;}
.dp-node:nth-child(5){bottom:8%;left:38%;}
.dp-node:nth-child(6){top:50%;left:2%;}
.dp-node:nth-child(7){top:18%;left:8%;}

/* Cartes flottantes hero */
.dp-float-card{
  position:absolute;
  background:#fff;border:1px solid rgba(0,0,0,.08);
  border-radius:14px;padding:12px 16px;
  box-shadow:0 8px 40px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06);
  font-size:11px;color:#374151;white-space:nowrap;z-index:5;
}
.dp-float-card::before{
  content:'';position:absolute;top:0;left:24px;right:24px;height:2px;
  background:linear-gradient(90deg,transparent,rgba(6,182,212,.5),transparent);
  border-radius:99px;
}
.dp-fc-label{font-size:9px;font-weight:800;color:var(--cyan-d);text-transform:uppercase;letter-spacing:.12em;margin-bottom:7px;}
.dp-fc-row{display:flex;align-items:center;gap:6px;margin-bottom:3px;font-weight:600;color:#1e293b;}
.dp-fc-row i{color:var(--cyan-d);font-size:9px;flex-shrink:0;}
.dp-fc-badge{
  display:inline-flex;align-items:center;gap:4px;margin-top:6px;
  background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.25);
  color:#059669;font-size:9px;font-weight:800;padding:3px 9px;border-radius:99px;
}
/* Float CSS pour les cartes (démarrent après révélation GSAP) */
.dp-float-card.dp-fc-1{top:0%;left:-10%;animation:dpFC1 5.5s ease-in-out infinite 1.8s;}
.dp-float-card.dp-fc-2{bottom:3%;right:-8%;animation:dpFC2 6.5s ease-in-out infinite 2s;}
.dp-float-card.dp-fc-3{top:36%;right:-16%;animation:dpFC3 5s ease-in-out infinite 1.9s;}
@keyframes dpFC1{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes dpFC2{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}
@keyframes dpFC3{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ══════════════════════════════════════════════════
   SECTION 2 — VALEUR
══════════════════════════════════════════════════ */
.dp-value-inner{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;
}
.dp-value-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.dp-stat-card{
  padding:28px 22px;border-radius:20px;
  background:#fff;border:1px solid var(--border);
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s;
}
.dp-stat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.dp-stat-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);border-radius:3px 3px 0 0;
}
.dp-stat-card:hover::before{transform:scaleX(1);}
.dp-stat-card:nth-child(1){animation:dpFloat1 5s ease-in-out infinite;}
.dp-stat-card:nth-child(2){animation:dpFloat2 6s ease-in-out infinite;}
.dp-stat-card:nth-child(3){animation:dpFloat3 5.5s ease-in-out infinite;}
.dp-stat-card:nth-child(4){animation:dpFloat4 4.8s ease-in-out infinite;}
@keyframes dpFloat1{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes dpFloat2{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes dpFloat3{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes dpFloat4{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
.dp-stat-ico{
  width:44px;height:44px;border-radius:13px;margin-bottom:18px;
  display:flex;align-items:center;justify-content:center;font-size:19px;
}
.dp-stat-val{
  font-size:clamp(28px,3vw,40px);font-weight:900;letter-spacing:-.04em;
  color:#0f172a;line-height:1;margin-bottom:6px;
}
.dp-stat-val b{
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.dp-stat-lbl{font-size:12px;color:var(--muted);line-height:1.55;}

/* ══════════════════════════════════════════════════
   SECTION 3 — TYPES
══════════════════════════════════════════════════ */
.dp-types-head{text-align:center;max-width:600px;margin:0 auto 56px;}
.dp-types-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.dp-type-card{
  border-radius:24px;padding:36px 28px;
  background:#fff;border:1px solid var(--border);
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s;
}
.dp-type-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);}
.dp-type-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  border-radius:0 0 24px 24px;
  transform:scaleX(0);transform-origin:center;
  transition:transform .4s var(--ease);
}
.dp-type-card.dp-b2b::after{background:linear-gradient(90deg,var(--cyan),var(--blue));}
.dp-type-card.dp-b2c::after{background:linear-gradient(90deg,#8b5cf6,#06b6d4);}
.dp-type-card.dp-custom::after{background:linear-gradient(90deg,#10b981,#06b6d4);}
.dp-type-card:hover::after{transform:scaleX(1);}
.dp-type-card.dp-b2b::before{content:'';position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(6,182,212,.06),transparent 65%);}
.dp-type-card.dp-b2c::before{content:'';position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(139,92,246,.06),transparent 65%);}
.dp-type-card.dp-custom::before{content:'';position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(16,185,129,.06),transparent 65%);}
.dp-type-icon{
  width:56px;height:56px;border-radius:18px;margin-bottom:24px;
  display:flex;align-items:center;justify-content:center;font-size:24px;
  box-shadow:0 4px 16px rgba(0,0,0,.15);
}
.dp-type-card h3{font-size:22px;font-weight:900;letter-spacing:-.03em;color:#0f172a;margin:0 0 8px;}
.dp-type-desc{font-size:13px;color:var(--muted);margin:0 0 24px;line-height:1.65;}
.dp-type-fields{list-style:none;display:flex;flex-direction:column;gap:7px;}
.dp-type-field{
  display:flex;align-items:center;gap:9px;
  padding:9px 12px;border-radius:10px;
  background:var(--bg-alt);border:1px solid rgba(0,0,0,.05);
  font-size:12px;font-weight:600;color:#374151;
  transition:background .2s,border-color .2s;
}
.dp-type-field:hover{background:rgba(6,182,212,.06);border-color:rgba(6,182,212,.2);}
.dp-type-field i{font-size:11px;width:14px;text-align:center;flex-shrink:0;}
.dp-type-badge{
  display:inline-flex;align-items:center;gap:6px;margin-top:20px;
  padding:7px 14px;border-radius:99px;font-size:11px;font-weight:800;
}

/* ══════════════════════════════════════════════════
   SECTION 4 — QUALITÉ
══════════════════════════════════════════════════ */
.dp-quality-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.dp-pipeline{display:flex;flex-direction:column;gap:0;}
.dp-pipe-step{display:flex;gap:20px;align-items:flex-start;padding:0 0 32px;position:relative;}
.dp-pipe-step:not(:last-child)::before{
  content:'';position:absolute;left:19px;top:44px;bottom:0;width:2px;
  background:linear-gradient(to bottom,rgba(6,182,212,.3),transparent);
  border-radius:2px;
}
.dp-pipe-num{
  width:40px;height:40px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,rgba(6,182,212,.15),rgba(59,130,246,.1));
  border:1.5px solid rgba(6,182,212,.3);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:900;color:var(--cyan-d);
}
.dp-pipe-title{font-size:15px;font-weight:800;color:#0f172a;margin:8px 0 6px;}
.dp-pipe-desc{font-size:13px;color:var(--muted);line-height:1.65;}

/* Dashboard qualité — dark (contrast premium) */
.dp-qual-dash{
  border-radius:24px;overflow:hidden;
  box-shadow:0 32px 80px rgba(0,0,0,.18),0 0 0 1px rgba(255,255,255,.1);
  position:relative;
}
.dp-qual-dash::before{
  content:'';position:absolute;top:0;left:40px;right:40px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(6,182,212,.6),transparent);z-index:2;
}
.dp-qd-header{
  display:flex;align-items:center;gap:10px;
  padding:14px 20px;background:#0d1117;border-bottom:1px solid rgba(255,255,255,.06);
}
.dp-qd-dots{display:flex;gap:6px;}
.dp-qd-dot{width:10px;height:10px;border-radius:50%;}
.dp-qd-title{font-size:12px;font-weight:600;color:rgba(255,255,255,.35);margin:0 auto;}
.dp-qd-body{padding:20px 22px;background:#0d1117;}
.dp-qd-row{
  display:flex;align-items:center;gap:12px;
  padding:10px 14px;border-radius:10px;margin-bottom:8px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);
}
.dp-qd-label{font-size:11px;color:rgba(255,255,255,.4);width:110px;flex-shrink:0;}
.dp-qd-bar-wrap{flex:1;height:4px;background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden;}
.dp-qd-bar{height:100%;border-radius:2px;animation:dpBarGrow 1.8s ease both;}
.dp-qd-row:nth-child(1) .dp-qd-bar{animation-delay:.2s}
.dp-qd-row:nth-child(2) .dp-qd-bar{animation-delay:.4s}
.dp-qd-row:nth-child(3) .dp-qd-bar{animation-delay:.6s}
.dp-qd-row:nth-child(4) .dp-qd-bar{animation-delay:.8s}
.dp-qd-row:nth-child(5) .dp-qd-bar{animation-delay:1s}
@keyframes dpBarGrow{from{width:0}to{width:var(--w,80%)}}
.dp-qd-pct{font-size:11px;font-weight:800;color:#fff;width:34px;text-align:right;flex-shrink:0;}
.dp-qd-check{
  width:18px;height:18px;border-radius:50%;flex-shrink:0;
  background:rgba(16,185,129,.15);border:1px solid rgba(16,185,129,.3);
  display:flex;align-items:center;justify-content:center;color:#10b981;font-size:8px;
}
.dp-qd-score{
  margin-top:16px;padding:14px 16px;border-radius:12px;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.2);
  display:flex;align-items:center;gap:14px;
}
.dp-qd-score-val{
  font-size:32px;font-weight:900;letter-spacing:-.04em;
  background:linear-gradient(135deg,#06b6d4,#3b82f6);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.dp-qd-score-lbl{font-size:11px;color:rgba(255,255,255,.45);line-height:1.5;}
.dp-qd-score-lbl strong{display:block;font-size:13px;color:#fff;}

/* ══════════════════════════════════════════════════
   SECTION 5 — USAGES
══════════════════════════════════════════════════ */
.dp-uses-head{text-align:center;max-width:580px;margin:0 auto 56px;}
.dp-uses-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.dp-use-card{
  padding:32px 26px;border-radius:22px;
  background:#fff;border:1px solid var(--border);
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s;
}
.dp-use-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.dp-use-card::after{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  border-radius:3px 3px 0 0;
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
.dp-use-card:hover::after{transform:scaleX(1);}
.dp-use-card:nth-child(1)::after,.dp-use-card:nth-child(4)::after{background:linear-gradient(90deg,var(--cyan),var(--blue));}
.dp-use-card:nth-child(2)::after,.dp-use-card:nth-child(5)::after{background:linear-gradient(90deg,#8b5cf6,#06b6d4);}
.dp-use-card:nth-child(3)::after,.dp-use-card:nth-child(6)::after{background:linear-gradient(90deg,#f59e0b,var(--cyan));}
.dp-use-ico{
  width:56px;height:56px;border-radius:18px;margin-bottom:20px;
  display:flex;align-items:center;justify-content:center;font-size:22px;
  box-shadow:0 4px 16px rgba(0,0,0,.12);
}
.dp-use-card h4{font-size:17px;font-weight:800;letter-spacing:-.02em;color:#0f172a;margin:0 0 10px;}
.dp-use-card p{font-size:13px;color:var(--muted);line-height:1.65;margin:0 0 16px;}
.dp-use-tag{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:800;color:var(--cyan-d);letter-spacing:.06em;text-transform:uppercase;
}
.dp-use-tag::after{content:'→';margin-left:2px;transition:transform .2s;}
.dp-use-card:hover .dp-use-tag::after{transform:translateX(5px);}

/* ══════════════════════════════════════════════════
   SECTION 6 — POURQUOI
══════════════════════════════════════════════════ */
.dp-why-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.dp-why-points{display:flex;flex-direction:column;gap:20px;}
.dp-why-point{
  display:flex;gap:18px;align-items:flex-start;
  padding:22px;border-radius:18px;background:#fff;
  border:1px solid var(--border);box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s,border-color .3s;
}
.dp-why-point:hover{transform:translateX(6px);box-shadow:var(--shadow-md);border-color:rgba(6,182,212,.2);}
.dp-why-ico{
  width:44px;height:44px;border-radius:13px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:19px;
  box-shadow:0 2px 12px rgba(0,0,0,.12);
}
.dp-why-point h4{font-size:15px;font-weight:800;color:#0f172a;margin:0 0 5px;}
.dp-why-point p{font-size:12px;color:var(--muted);line-height:1.65;margin:0;}

/* Story card */
.dp-story-card{
  border-radius:28px;padding:40px;
  background:linear-gradient(145deg,#f0f9ff,#eff6ff);
  border:1px solid rgba(6,182,212,.18);
  box-shadow:0 24px 64px rgba(6,182,212,.12),0 0 0 1px rgba(6,182,212,.08);
  position:relative;overflow:hidden;
}
.dp-story-card::before{
  content:'';position:absolute;top:0;left:40px;right:40px;height:2px;
  background:linear-gradient(90deg,transparent,rgba(6,182,212,.5),transparent);
}
.dp-story-card::after{
  content:'';position:absolute;bottom:-80px;right:-80px;width:250px;height:250px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(59,130,246,.1),transparent 65%);
}
.dp-story-number{
  font-size:clamp(56px,6.5vw,90px);font-weight:900;letter-spacing:-.06em;line-height:1;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  margin-bottom:14px;
}
.dp-story-label{font-size:14px;color:#374151;line-height:1.7;max-width:340px;}
.dp-story-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;}
.dp-story-tag{
  padding:6px 14px;border-radius:99px;font-size:11px;font-weight:700;
  background:rgba(6,182,212,.1);border:1px solid rgba(6,182,212,.2);color:var(--cyan-d);
}

/* ══════════════════════════════════════════════════

/* ══════════════════════════════════════════════════
   CTA FINAL
══════════════════════════════════════════════════ */
.dp-cta-sec{
  padding:120px max(5vw,40px);text-align:center;
  background:linear-gradient(145deg,#0f172a 0%,#1e3a5f 60%,#0c2340 100%);
  position:relative;overflow:hidden;
}
.dp-cta-sec::before{
  content:'';position:absolute;top:-200px;left:50%;transform:translateX(-50%);
  width:700px;height:700px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(6,182,212,.15) 0%,transparent 65%);
}
.dp-cta-h2{
  font-size:clamp(34px,5vw,64px);font-weight:900;letter-spacing:-.05em;
  line-height:1.06;margin:0 0 18px;color:#fff;position:relative;z-index:1;
}
.dp-cta-lead{font-size:clamp(15px,1.5vw,17px);color:rgba(255,255,255,.55);max-width:520px;margin:0 auto 44px;line-height:1.75;position:relative;z-index:1;}
.dp-cta-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;position:relative;z-index:1;}
.dp-cta-btn-ghost{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;border-radius:14px;font-size:15px;font-weight:700;
  border:1.5px solid rgba(255,255,255,.2);color:rgba(255,255,255,.8);
  transition:border-color .25s,color .25s;
}
.dp-cta-btn-ghost:hover{border-color:rgba(6,182,212,.5);color:var(--cyan);}

/* ══════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════ */
@media(max-width:1024px){
  .dp-hero{grid-template-columns:1fr;min-height:auto;padding-top:120px;}
  .dp-hero-visual{height:400px;}
  .dp-value-inner,.dp-quality-inner,.dp-why-inner{grid-template-columns:1fr;gap:50px;}
  .dp-types-grid{grid-template-columns:1fr;}
  .dp-uses-grid{grid-template-columns:1fr 1fr;}
  .dp-float-card{display:none;}
}
@media(max-width:680px){
  .dp-value-stats{grid-template-columns:1fr;}
  .dp-uses-grid{grid-template-columns:1fr;}
  .dp-hero-visual{display:none;}
}

/* ── Form section ── */
.dp-form-sec{padding:100px 0;background:var(--bg-alt);}
.dp-form-inner{
  display:grid;grid-template-columns:360px minmax(0,1fr);gap:60px;align-items:start;
}
.dp-form-left{position:sticky;top:100px;}
.dp-form-guarantees{display:flex;flex-direction:column;gap:10px;margin-top:28px;}
.dp-form-guarantee{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;border-radius:12px;
  background:#fff;border:1px solid var(--border);
  font-size:13px;color:var(--text);box-shadow:var(--shadow-sm);
}
.dp-form-guarantee i{color:#10b981;font-size:14px;flex-shrink:0;}

/* ── Form card ── */
.dp-form-card{
  background:#fff;border-radius:24px;padding:40px;
  border:1px solid var(--border);box-shadow:var(--shadow-sm);
}
.dp-fg{display:flex;flex-direction:column;gap:6px;margin-bottom:20px;}
.dp-fg.dp-fg-half{flex:1;}
.dp-fg-row{display:flex;gap:16px;}
.dp-fg label{
  font-size:11px;font-weight:800;color:var(--text);
  text-transform:uppercase;letter-spacing:.08em;
}
.dp-fg label .req{color:var(--cyan);margin-left:2px;}
.dp-fg input,
.dp-fg select,
.dp-fg textarea{
  width:100%;padding:13px 16px;
  background:#fff;border:1.5px solid rgba(0,0,0,.1);
  border-radius:10px;font-family:Inter,sans-serif;font-size:14px;
  color:var(--text);transition:border-color .2s,box-shadow .2s;
  appearance:none;-webkit-appearance:none;
}
.dp-fg input:focus,
.dp-fg select:focus,
.dp-fg textarea:focus{
  outline:none;border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(6,182,212,.12);
}
.dp-fg input.dp-err,
.dp-fg select.dp-err,
.dp-fg textarea.dp-err{border-color:#f87171;box-shadow:0 0 0 3px rgba(248,113,113,.1);}
.dp-fg textarea{min-height:110px;resize:vertical;}
.dp-fg select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364748b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;
}
.dp-field-err{font-size:11px;color:#f87171;margin-top:3px;display:none;font-weight:600;}

/* ── Toggles (type de données, format) ── */
.dp-toggles{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}
.dp-toggle{
  position:relative;padding:9px 14px;border:1.5px solid rgba(0,0,0,.1);
  border-radius:9px;text-align:center;cursor:pointer;
  font-size:13px;font-weight:600;color:var(--muted);
  transition:all .2s;background:#fff;user-select:none;
}
.dp-toggle input{position:absolute;opacity:0;width:0;height:0;}
.dp-toggle:has(input:checked),
.dp-toggle.dp-sel{
  border-color:var(--cyan);background:rgba(6,182,212,.07);color:var(--cyan-d);font-weight:700;
}

/* ── Checkboxes canaux ── */
.dp-cbs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:4px;}
.dp-cb{
  display:flex;align-items:center;gap:9px;
  padding:10px 12px;border:1.5px solid rgba(0,0,0,.1);
  border-radius:9px;cursor:pointer;font-size:13px;
  color:var(--muted);transition:all .2s;background:#fff;user-select:none;
}
.dp-cb input{display:none;}
.dp-cb-box{
  width:16px;height:16px;border:1.5px solid rgba(0,0,0,.15);
  border-radius:4px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  transition:all .2s;
}
.dp-cb:has(input:checked){border-color:var(--cyan);background:rgba(6,182,212,.06);color:var(--text);}
.dp-cb:has(input:checked) .dp-cb-box{background:var(--cyan);border-color:var(--cyan);}
.dp-cb:has(input:checked) .dp-cb-box::after{
  content:'';display:block;width:4px;height:7px;
  border:1.5px solid #fff;border-top:none;border-left:none;
  transform:rotate(45deg) translateY(-1px);
}
.dp-cb i{font-size:12px;color:var(--cyan-d);flex-shrink:0;}
.dp-cb:has(input:checked) i{color:var(--cyan);}

/* ── Section label separator ── */
.dp-form-sep{
  display:flex;align-items:center;gap:10px;margin:24px 0 20px;
  font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--cyan-d);
}
.dp-form-sep::before,.dp-form-sep::after{
  content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(6,182,212,.3),transparent);
}
.dp-form-sep::after{background:linear-gradient(270deg,rgba(6,182,212,.3),transparent);}

/* ── Budget ── */
.dp-budget-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:4px;}
@media(max-width:640px){.dp-budget-grid{grid-template-columns:repeat(2,1fr);}}
.dp-budget-opt{
  position:relative;padding:10px 6px;border:1.5px solid rgba(0,0,0,.1);
  border-radius:9px;text-align:center;cursor:pointer;
  font-size:12px;font-weight:600;color:var(--muted);
  transition:all .2s;background:#fff;line-height:1.35;
}
.dp-budget-opt input{position:absolute;opacity:0;width:0;height:0;}
.dp-budget-opt:has(input:checked){
  border-color:var(--cyan);background:rgba(6,182,212,.07);color:var(--cyan-d);font-weight:700;
}

/* ── Submit ── */
.dp-form-submit{
  width:100%;padding:16px;border-radius:14px;border:none;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  color:#fff;font-size:16px;font-weight:700;font-family:inherit;
  cursor:pointer;margin-top:8px;position:relative;overflow:hidden;
  box-shadow:0 8px 28px rgba(6,182,212,.3);
  transition:transform .2s var(--ease),box-shadow .2s;
}
.dp-form-submit::before{
  content:'';position:absolute;top:0;left:-150%;width:60%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);
  transform:skewX(-25deg);animation:dpSweep 3.5s linear infinite;
}
@keyframes dpSweep{to{left:150%;}}
.dp-form-submit:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(6,182,212,.45);}
.dp-form-submit:active{transform:translateY(0);}
.dp-form-submit.dp-loading{pointer-events:none;opacity:.7;}

/* ── Success ── */
.dp-form-success{
  display:none;text-align:center;padding:40px 32px;
  background:rgba(16,185,129,.05);border:1.5px solid rgba(16,185,129,.2);
  border-radius:16px;margin-top:12px;
}
.dp-form-success i{font-size:40px;color:#10b981;margin-bottom:14px;display:block;}
.dp-form-success h3{color:var(--text);margin:0 0 8px;font-size:20px;}
.dp-form-success p{color:var(--muted);font-size:14px;margin:0;}

/* ── Responsive form ── */
@media(max-width:1024px){
  .dp-form-inner{grid-template-columns:1fr;gap:40px;}
  .dp-form-left{position:static;}
}
@media(max-width:580px){
  .dp-form-card{padding:24px 20px;}
  .dp-fg-row{flex-direction:column;}
  .dp-cbs{grid-template-columns:1fr;}
  .dp-budget-grid{grid-template-columns:1fr 1fr;}
}

.tw-cta-strip{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
.tw-btn{display:inline-flex;align-items:center;gap:12px;padding:14px 28px;border-radius:16px;text-decoration:none;cursor:pointer;border:none;position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;white-space:nowrap;font-family:inherit}
.tw-btn:hover{transform:translateY(-4px) scale(1.025)}
.tw-btn::after{content:'';position:absolute;top:0;left:-80%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);transform:skewX(-18deg);transition:left .5s ease;pointer-events:none}
.tw-btn:hover::after{left:130%}
.tw-btn-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:16px}
.tw-btn-lbl{display:flex;flex-direction:column;line-height:1.25;text-align:left}
.tw-btn-lbl strong{font-size:14.5px;font-weight:800;letter-spacing:-.01em}
.tw-btn-lbl small{font-size:9.5px;font-weight:600;letter-spacing:.04em;opacity:.6}
.tw-btn-visio{background:linear-gradient(145deg,#152e47,#1a3d5c);color:#fff !important;border:1.5px solid rgba(6,182,212,.6);box-shadow:0 4px 22px rgba(0,0,0,.35),0 0 0 1px rgba(6,182,212,.22),inset 0 1px 0 rgba(255,255,255,.08)}
.tw-btn-visio .tw-btn-ico{background:rgba(6,182,212,.12)}
.tw-btn-visio .tw-btn-ico i{color:#06b6d4;filter:drop-shadow(0 0 6px rgba(6,182,212,.55))}
.tw-btn-visio:hover{border-color:rgba(6,182,212,.65);color:#fff !important;box-shadow:0 0 0 3px rgba(6,182,212,.12),0 10px 36px rgba(0,0,0,.38),0 0 28px rgba(6,182,212,.18)}
.tw-btn-crm{background:linear-gradient(135deg,#06b6d4 0%,#0891b2 50%,#0f766e 100%);background-size:200% 200%;color:#fff !important;box-shadow:0 4px 22px rgba(6,182,212,.35),inset 0 1px 0 rgba(255,255,255,.18)}
.tw-btn-crm .tw-btn-ico{background:rgba(255,255,255,.15)}
.tw-btn-crm .tw-btn-ico i{filter:drop-shadow(0 0 6px rgba(255,255,255,.35))}
.tw-btn-crm:hover{color:#fff !important;background-position:right center;box-shadow:0 8px 40px rgba(6,182,212,.5),inset 0 1px 0 rgba(255,255,255,.18)}
@media(max-width:520px){.tw-btn{padding:12px 20px}.tw-btn-lbl strong{font-size:13px}}