/* ============================================================
   CURSOR · puntero estilo Kiralia/Awwwards
   Dot + Ring con lerp smooth · mix-blend-difference · adaptive
   ============================================================ */

@media (hover: hover) and (pointer: fine) {
  /* Oculta el cursor nativo en todo */
  *, *::before, *::after { cursor: none !important; }

  .kir-cursor {
    position: fixed; top: 0; left: 0;
    pointer-events: none; z-index: 99999;
    will-change: transform;
  }

  /* Dot · verde brand del logo (#22C55E) · sigue al instante */
  .kir-dot {
    width: 8px; height: 8px;
    background: #22C55E;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow:
      0 0 0 1px rgba(15, 42, 68, 0.15),
      0 0 12px rgba(34, 197, 94, 0.55);
    transition: width .25s cubic-bezier(0.16, 1, 0.3, 1),
                height .25s cubic-bezier(0.16, 1, 0.3, 1),
                background .25s,
                opacity .25s,
                box-shadow .3s;
  }

  /* Ring · círculo verde brand que sigue con lerp suave */
  .kir-ring {
    width: 38px; height: 38px;
    border: 1.5px solid #22C55E;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 18px rgba(34, 197, 94, 0.18);
    transition: width .35s cubic-bezier(0.16, 1, 0.3, 1),
                height .35s cubic-bezier(0.16, 1, 0.3, 1),
                background .25s,
                border-color .25s,
                opacity .25s,
                border-radius .35s,
                box-shadow .3s;
  }

  /* Estado HOVER en elementos interactivos · ring se llena de verde sutil */
  .kir-ring.is-hover {
    width: 64px; height: 64px;
    background: rgba(34, 197, 94, 0.14);
    border-color: rgba(34, 197, 94, 0.85);
    box-shadow: 0 0 28px rgba(34, 197, 94, 0.32);
  }
  .kir-dot.is-hover {
    width: 4px; height: 4px;
    background: #16A34A;
    opacity: 0.7;
  }

  /* Estado TEXT · barra vertical verde sobre inputs/textarea */
  .kir-ring.is-text {
    width: 4px; height: 28px;
    border-radius: 2px;
    border: 0;
    background: #22C55E;
    box-shadow: 0 0 12px rgba(34, 197, 94, 0.6);
  }
  .kir-dot.is-text { opacity: 0; }

  /* Estado CLICK · ring se encoge + pulse */
  .kir-ring.is-down {
    width: 28px; height: 28px;
    background: rgba(34, 197, 94, 0.22);
    transition: width .15s, height .15s, background .15s;
  }
  .kir-dot.is-down {
    background: #16A34A;
  }

  /* Hidden cuando sale del viewport */
  .kir-cursor.is-hidden { opacity: 0; }

  /* Sobre fondos oscuros · brillo extra para que se vea mejor */
  .hero .kir-dot,
  .hero .kir-ring,
  .section--inverted .kir-dot,
  .section--inverted .kir-ring,
  .stats .kir-dot,
  .stats .kir-ring {
    /* Hereda · el verde con glow ya se ve perfecto en ambos */
  }
}

/* Desactiva en touch / móvil · cursor nativo */
@media (hover: none), (pointer: coarse) {
  .kir-cursor { display: none !important; }
}

/* Respeta prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .kir-cursor { display: none !important; }
  * { cursor: auto !important; }
  a, button, [role=button] { cursor: pointer !important; }
  input, textarea { cursor: text !important; }
}