/* ════════════════════════════════════════════════════════════════════════════
 * CURSOR
 * Custom brutalist cursor
 * ════════════════════════════════════════════════════════════════════════════
 */

/* ──────────────────────────  CUSTOM CURSOR — brutaliste signature  ────────────────────────── */
@media (pointer:fine){
  /* Outer ring — circle with a tick mark at 12 o'clock (compass / measurement signal) */
  .cursor{position:fixed;top:0;left:0;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--periwinkle);pointer-events:none;z-index:9998;mix-blend-mode:difference;transform:translate(-50%,-50%);transition:width .4s cubic-bezier(.16,1,.3,1),height .4s cubic-bezier(.16,1,.3,1),background .25s,border-color .25s,opacity .2s,border-radius .35s cubic-bezier(.16,1,.3,1);will-change:transform;}
  .cursor::before{content:"";position:absolute;left:50%;top:-5px;width:1.5px;height:5px;background:var(--periwinkle);transform:translateX(-50%);transition:opacity .25s;}
  /* Inner element — brutaliste plus sign instead of a dot */
  .cursor-dot{position:fixed;top:0;left:0;width:14px;height:14px;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);will-change:transform;}
  .cursor-dot::before,.cursor-dot::after{content:"";position:absolute;left:50%;top:50%;background:var(--periwinkle);box-shadow:0 0 10px var(--periwinkle),0 0 20px var(--violet);transition:width .3s cubic-bezier(.16,1,.3,1),height .3s cubic-bezier(.16,1,.3,1),background .25s;}
  .cursor-dot::before{width:1.5px;height:14px;transform:translate(-50%,-50%);} /* vertical */
  .cursor-dot::after{width:14px;height:1.5px;transform:translate(-50%,-50%);} /* horizontal */

  /* Hover state: link — subtle scale-up, no morphed label */
  .cursor.is-link{width:36px;height:36px;border-color:var(--periwinkle);border-width:1.5px;background:rgba(94,106,210,.05);mix-blend-mode:normal;}

  /* Hover state: magnet zone — slightly larger ring, no text label */
  .cursor.is-magnet{width:64px;height:64px;border-color:var(--periwinkle);border-width:1px;background:rgba(94,106,210,.05);mix-blend-mode:normal;}
  .cursor.is-magnet::before{top:-7px;height:7px;}

  /* Hover state: David cover (Play) — circular play indicator */
  .cursor.is-play{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--indigo),var(--violet));border-color:transparent;mix-blend-mode:normal;}
  .cursor.is-play::before{opacity:0;}
  .cursor.is-play::after{content:"▶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--paper);font-size:14px;font-weight:700;}

  /* Hover state: hero photo — minimal ring scale-up, no label */
  .cursor.is-photo{width:42px;height:42px;border-color:var(--periwinkle);border-width:1.5px;background:rgba(94,106,210,.04);mix-blend-mode:normal;}

  /* Hover state: text — caret */
  .cursor.is-text{width:2px;height:28px;border-radius:2px;border:none;background:var(--periwinkle);mix-blend-mode:normal;}
  .cursor.is-text::before{opacity:0;}
  .cursor.is-input{width:3px;height:24px;border-radius:2px;border:none;background:var(--periwinkle);mix-blend-mode:normal;animation:caret-blink 1s steps(2) infinite;}
  .cursor.is-input::before{opacity:0;}
  @keyframes caret-blink{50%{opacity:0;}}

  /* When ring is morphed into a label, hide the inner plus */
  .cursor.is-link ~ .cursor-dot,
  .cursor.is-play ~ .cursor-dot,
  .cursor.is-photo ~ .cursor-dot,
  .cursor.is-text ~ .cursor-dot,
  .cursor.is-input ~ .cursor-dot{opacity:0;}

  .cursor.is-hidden,.cursor-dot.is-hidden{opacity:0;}
}
@media (pointer:coarse){.cursor,.cursor-dot{display:none;}}
