/* ORBES */
.orbe { position: fixed; border-radius: 50%; filter: blur(110px); pointer-events: none; z-index: 0; animation: orbeFloat 8s ease-in-out infinite; }
.orbe1 { width: 520px; height: 520px; background: radial-gradient(circle, rgba(255,0,0,.09), transparent 70%); top: -160px; right: -80px; animation-delay: 0s; }
.orbe2 { width: 420px; height: 420px; background: radial-gradient(circle, rgba(100,60,255,.07), transparent 70%); bottom: 20%; left: -100px; animation-delay: 3s; }
.orbe3 { width: 360px; height: 360px; background: radial-gradient(circle, rgba(255,0,0,.06), transparent 70%); bottom: 0; right: 20%; animation-delay: 6s; }
@keyframes orbeFloat { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-30px) scale(1.05); } }

/* ══════════════════════════════════════
   ANIMATIONS D'APPARITION
══════════════════════════════════════ */
.fade-up { opacity: 0; transform: translateY(36px); transition: opacity .7s ease, transform .7s ease; }
.fade-left { opacity: 0; transform: translateX(-44px); transition: opacity .7s ease, transform .7s ease; }
.fade-right { opacity: 0; transform: translateX(44px); transition: opacity .7s ease, transform .7s ease; }
.fade-scale { opacity: 0; transform: scale(.92); transition: opacity .7s ease, transform .7s ease; }
.fade-up.vis, .fade-left.vis, .fade-right.vis, .fade-scale.vis { opacity: 1; transform: none; }

/* Délais cascade */
[data-delay="1"] { transition-delay: .10s; }
[data-delay="2"] { transition-delay: .20s; }
[data-delay="3"] { transition-delay: .30s; }
[data-delay="4"] { transition-delay: .40s; }
[data-delay="5"] { transition-delay: .50s; }
[data-delay="6"] { transition-delay: .60s; }

/* Hero load */
@keyframes heroIn { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
.hero-badge { animation: heroIn .6s ease .1s both; }
.hero-titre { animation: heroIn .7s ease .3s both; }
.hero-desc { animation: heroIn .7s ease .5s both; }
.hero-btns { animation: heroIn .7s ease .65s both; }
.hero-stats { animation: heroIn .7s ease .8s both; }

/* Separateur de section animé */
.sep { width: 60px; height: 4px; background: var(--rouge); border-radius: 2px; margin: 24px 0; position: relative; overflow: hidden; }
.sep::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent); animation: sepShine 2s ease-in-out infinite; }
@keyframes sepShine { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }

/* Scroll indicator */
.scroll-ind { position: absolute; bottom: 36px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 8px; animation: heroIn .7s ease 1.2s both; z-index: 3; }
.scroll-ind span { font-size: 11px; color: rgba(255,255,255,.5); letter-spacing: 1.5px; font-weight: 600; text-transform: uppercase; }
.scroll-mouse { width: 24px; height: 38px; border: 2px solid rgba(255,255,255,.3); border-radius: 12px; position: relative; }
.scroll-wheel { width: 3px; height: 7px; background: #fff; border-radius: 2px; position: absolute; top: 6px; left: 50%; transform: translateX(-50%); animation: scrollWheel 1.6s ease-in-out infinite; }
@keyframes scrollWheel { 0% { opacity: 1; top: 6px; } 100% { opacity: 0; top: 22px; } }

/* ACCESSIBILITÉ */
@media(prefers-reduced-motion: reduce) {
  .fade-up, .fade-left, .fade-right, .fade-scale, .hero-badge, .hero-titre, .hero-desc, .hero-btns, .hero-stats { opacity: 1; transform: none; animation: none; transition: none; }
  .orbe { animation: none; }
  .sep::after { animation: none; }
  .scroll-wheel { animation: none; }
  .badge-dot { animation: none; }
  .typed-cursor { animation: none; }
}
/* ══════════════════════════════════════
   CONSTELLATION CSS (POUR LES SECTIONS)
══════════════════════════════════════ */
.bg-anim-tech {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0;
}
.tech-node {
  position: absolute; background: var(--rouge); border-radius: 50%; opacity: 0.12;
  will-change: transform;
}
.tech-line {
  position: absolute; background: var(--rouge); opacity: 0.08;
  will-change: transform;
}

/* Positionnement et animation des éléments */
.n1 { width: 8px; height: 8px; top: 15%; left: 10%; animation: floatA 14s infinite alternate ease-in-out; }
.n2 { width: 14px; height: 14px; top: 70%; left: 85%; animation: floatB 18s infinite alternate ease-in-out; }
.n3 { width: 5px; height: 5px; top: 40%; left: 75%; animation: floatC 12s infinite alternate ease-in-out; }
.n4 { width: 10px; height: 10px; top: 85%; left: 20%; animation: floatA 16s infinite alternate-reverse ease-in-out; }

/* Lignes de connexion simulées */
.l1 { width: 180px; height: 1px; top: 16%; left: 10%; transform-origin: left; animation: floatLineA 14s infinite alternate ease-in-out; }
.l2 { width: 120px; height: 1px; top: 71%; left: 70%; transform-origin: right; animation: floatLineB 18s infinite alternate ease-in-out; }

@keyframes floatA { 0% { transform: translate3d(0,0,0); } 100% { transform: translate3d(40px, 30px, 0); } }
@keyframes floatB { 0% { transform: translate3d(0,0,0); } 100% { transform: translate3d(-50px, -20px, 0); } }
@keyframes floatC { 0% { transform: translate3d(0,0,0); } 100% { transform: translate3d(20px, -40px, 0); } }

@keyframes floatLineA { 0% { transform: translate3d(0,0,0) rotate(15deg); } 100% { transform: translate3d(40px, 30px, 0) rotate(22deg); } }
@keyframes floatLineB { 0% { transform: translate3d(0,0,0) rotate(-25deg); } 100% { transform: translate3d(-50px, -20px, 0) rotate(-15deg); } }