/* Motion + custom cursor — Lumina live shell */

/* ——— Custom cursor ——— */
.cursor-dot,
.cursor-ring {
  display: none;
}

@media (pointer: fine) {
  body.cursor-on {
    cursor: none;
  }

  body.cursor-on a,
  body.cursor-on button,
  body.cursor-on summary,
  body.cursor-on [role="button"],
  body.cursor-on input,
  body.cursor-on label,
  body.cursor-on .card,
  body.cursor-on .download-card,
  body.cursor-on .btn,
  body.cursor-on .heatmap-zone {
    cursor: none;
  }

  body.cursor-on .cursor-dot,
  body.cursor-on .cursor-ring {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    will-change: transform, width, height, background, border-color;
  }

  body.cursor-on .cursor-dot {
    width: 6px;
    height: 6px;
    background: var(--primary);
    transition: width 0.2s ease, height 0.2s ease, background 0.2s ease, opacity 0.2s ease;
  }

  body.cursor-on .cursor-ring {
    width: 36px;
    height: 36px;
    border: 1.5px solid color-mix(in srgb, var(--primary) 55%, transparent);
    background: color-mix(in srgb, var(--secondary) 6%, transparent);
    transition: width 0.25s ease, height 0.25s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
  }

  body.cursor-on.cursor-hover .cursor-dot {
    width: 10px;
    height: 10px;
    background: var(--secondary);
  }

  body.cursor-on.cursor-hover .cursor-ring {
    width: 56px;
    height: 56px;
    border-color: var(--secondary);
    background: color-mix(in srgb, var(--secondary) 12%, transparent);
  }

  body.cursor-on.cursor-click .cursor-dot {
    width: 4px;
    height: 4px;
  }

  body.cursor-on.cursor-click .cursor-ring {
    width: 28px;
    height: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.cursor-on {
    cursor: auto;
  }

  body.cursor-on .cursor-dot,
  body.cursor-on .cursor-ring {
    display: none !important;
  }
}

/* ——— Interactive lift ——— */
.btn,
.card,
.download-card,
.feature-card,
.team-card,
.insight-card {
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease,
    background-color 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .btn:hover {
    transform: translateY(-2px);
  }

  .card:hover,
  .download-card:hover,
  .feature-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(28, 27, 27, 0.06);
  }

  .insight-card:hover {
    border-left-color: var(--secondary);
  }
}

/* ——— Scroll reveal ——— */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

.reveal-delay-1 { transition-delay: 0.08s; }
.reveal-delay-2 { transition-delay: 0.16s; }
.reveal-delay-3 { transition-delay: 0.24s; }
.reveal-delay-4 { transition-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .btn:hover,
  .card:hover,
  .download-card:hover,
  .feature-card:hover {
    transform: none;
  }
}

/* ——— Heatmap pulse ——— */
@keyframes heat-pulse {
  0%, 100% { opacity: 0.75; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.04); }
}

.heatmap-blob {
  animation: heat-pulse 4s ease-in-out infinite;
}

.heatmap-blob:nth-child(2) { animation-delay: 0.6s; }
.heatmap-blob:nth-child(3) { animation-delay: 1.2s; }
.heatmap-blob:nth-child(4) { animation-delay: 1.8s; }

@media (prefers-reduced-motion: reduce) {
  .heatmap-blob {
    animation: none;
  }
}

/* ——— Island link micro ——— */
.island .nav-desktop a {
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.island .nav-desktop a:hover {
  transform: translateY(-1px);
}