/* ═══════════════════════════════════════════════════════════
   LEDKARAIB — Slider UI (WebGL gère les transitions)
   Ken Burns · Stagger texte · Dots · Compteur · Barre
   ═══════════════════════════════════════════════════════════ */

/* ── Structure : toutes les slides empilées ────────── */
.lk-slider-track {
  display: block !important;
  position: relative !important;
  height: 100% !important;
  transition: none !important;
  transform: none !important;
}

.lk-slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  pointer-events: none;
  z-index: 0;
}

.lk-slide.is-active {
  opacity: 1 !important;
  pointer-events: auto;
  z-index: 2;
}

/* ── Text stagger ────────────────────────────────────── */
.lk-slide-text .lk-kicker,
.lk-slide-text h2,
.lk-slide-text p {
  opacity: 0;
  transform: translateY(20px);
}

.lk-slide.is-active .lk-slide-text .lk-kicker {
  animation: lk-txt .5s .2s  cubic-bezier(.22,1,.36,1) forwards;
}
.lk-slide.is-active .lk-slide-text h2 {
  animation: lk-txt .5s .38s cubic-bezier(.22,1,.36,1) forwards;
}
.lk-slide.is-active .lk-slide-text p {
  animation: lk-txt .5s .54s cubic-bezier(.22,1,.36,1) forwards;
}

@keyframes lk-txt {
  to { opacity: 1; transform: translateY(0); }
}

/* ── Dots — barres de progression ───────────────────── */
.lk-slider-dots button {
  width: 24px !important;
  height: 3px !important;
  border-radius: 2px !important;
  background: rgba(255,255,255,.3) !important;
  transform: none !important;
  transition: width .3s ease !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 0 !important;
}

.lk-slider-dots button::after {
  content: '';
  position: absolute;
  inset: 0;
  background: #fff;
  transform: scaleX(0);
  transform-origin: left;
}

.lk-slider-dots button.is-active {
  width: 48px !important;
}

.lk-slider-dots button.is-active::after {
  animation: lk-dot-fill 5.5s linear forwards;
}

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

/* ── Prev/Next ──────────────────────────────────────── */
.lk-slider-prev,
.lk-slider-next {
  transition: background .2s, transform .25s, box-shadow .2s !important;
  z-index: 11 !important;
}
.lk-slider-prev:hover {
  background: rgba(255,255,255,.55) !important;
  transform: translateY(-50%) scale(1.14) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.28) !important;
}
.lk-slider-next:hover {
  background: rgba(255,255,255,.55) !important;
  transform: translateY(-50%) scale(1.14) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.28) !important;
}

/* ── Compteur ────────────────────────────────────────── */
.lk-slide-counter {
  position: absolute;
  top: 16px;
  right: 20px;
  color: rgba(255,255,255,.6);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  z-index: 11;
  pointer-events: none;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
  font-variant-numeric: tabular-nums;
}
.lk-slide-counter span {
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}

/* ── Barre gradient bas ─────────────────────────────── */
.lk-slider-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: rgba(255,255,255,.1);
  z-index: 11;
  pointer-events: none;
}
.lk-slider-progress::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #38bdf8, #818cf8, #f472b6);
  transform: scaleX(0);
  transform-origin: left;
}
.lk-slider-progress.is-running::after {
  animation: lk-progress 5.5s linear forwards;
}
@keyframes lk-progress {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}