/* =========================================================
   Precision cursor — crosshair + instrument ring (desktop only)
   Activated by JS only on fine pointers with hover support.
   ========================================================= */
.cursor { position: fixed; left: 0; top: 0; z-index: 2000; pointer-events: none; opacity: 0; transition: opacity .3s; mix-blend-mode: normal; }
.has-cursor .cursor { opacity: 1; }
.has-cursor .cursor.is-hidden { opacity: 0; }
.cursor__dot, .cursor__ring { position: fixed; left: 0; top: 0; pointer-events: none; will-change: transform; }

/* Crosshair */
.cursor__dot { width: 18px; height: 18px; margin: -9px 0 0 -9px; }
.cursor__dot::before, .cursor__dot::after { content: ""; position: absolute; background: var(--blue); transition: background .3s, transform .3s var(--ease); }
.cursor__dot::before { left: 8.5px; top: 0; width: 1px; height: 18px; }
.cursor__dot::after { top: 8.5px; left: 0; height: 1px; width: 18px; }

/* Instrument ring with four alignment ticks */
.cursor__ring { width: 40px; height: 40px; margin: -20px 0 0 -20px; }
.cursor__ring-inner { position: absolute; inset: 0; border: 1px solid rgba(26, 26, 46, .45); border-radius: 50%; transition: transform .45s var(--ease-out), border-color .3s, background .3s; }
.cursor__ring-inner i { position: absolute; background: currentColor; color: rgba(26, 26, 46, .6); transition: color .3s; }
.cursor__ring-inner i:nth-child(1) { left: 50%; top: -5px; width: 1px; height: 5px; }
.cursor__ring-inner i:nth-child(2) { left: 50%; bottom: -5px; width: 1px; height: 5px; }
.cursor__ring-inner i:nth-child(3) { top: 50%; left: -5px; height: 1px; width: 5px; }
.cursor__ring-inner i:nth-child(4) { top: 50%; right: -5px; height: 1px; width: 5px; }

/* Interactive hover: ring expands, accent shifts green, ticks rotate into alignment */
.cursor.is-hover .cursor__ring-inner { transform: scale(1.45) rotate(45deg); border-color: var(--green); background: rgba(92, 184, 92, .06); }
.cursor.is-hover .cursor__ring-inner i { color: var(--green); }
.cursor.is-hover .cursor__dot::before, .cursor.is-hover .cursor__dot::after { background: var(--green); transform: scale(.6); }
.cursor.is-media .cursor__ring-inner { transform: scale(1.9); border-color: rgba(255, 255, 255, .9); }
.cursor.is-media .cursor__ring-inner i { color: #fff; }
.cursor.is-media .cursor__dot::before, .cursor.is-media .cursor__dot::after { background: #fff; }
.cursor.is-down .cursor__ring-inner { transform: scale(.8); }
.cursor.is-text .cursor__ring-inner { transform: scale(.5); opacity: .4; }

/* On dark sections the instrument goes light */
.cursor.on-dark .cursor__ring-inner { border-color: rgba(255, 255, 255, .55); }
.cursor.on-dark .cursor__ring-inner i { color: rgba(255, 255, 255, .7); }
.cursor.on-dark .cursor__dot::before, .cursor.on-dark .cursor__dot::after { background: #fff; }
.cursor.on-dark.is-hover .cursor__ring-inner { border-color: var(--green); }
.cursor.on-dark.is-hover .cursor__dot::before, .cursor.on-dark.is-hover .cursor__dot::after { background: var(--green); }

/* Hide native pointer only where custom cursor is active; keep text caret on form fields */
.has-cursor, .has-cursor a, .has-cursor button, .has-cursor [role="button"], .has-cursor label { cursor: none; }
.has-cursor input, .has-cursor textarea, .has-cursor select { cursor: auto; }

@media (hover: none), (pointer: coarse) { .cursor { display: none !important; } }