/* BRASA — the ember cursor. Desktop pointers only; script never runs on touch. */

.cursor {
  position: fixed;
  top: 0; left: 0;
  z-index: var(--z-cursor);
  pointer-events: none;
  mix-blend-mode: normal;
  will-change: transform;
}
.cursor__dot {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--ember);
  transition: width .3s var(--ease-out), height .3s var(--ease-out), opacity .3s;
}
.cursor__word {
  position: absolute;
  transform: translate(-50%, -50%) scale(.7);
  display: grid;
  place-content: center;
  width: 78px; height: 78px;
  border-radius: 50%;
  background: rgba(255, 106, 36, .92);
  color: var(--black);
  font-size: var(--t-label);
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity .3s var(--ease-out), transform .35s var(--ease-out);
}
.cursor.is-active .cursor__dot { width: 0; height: 0; opacity: 0; }
.cursor.is-active .cursor__word { opacity: 1; transform: translate(-50%, -50%) scale(1); }

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
  .cursor { display: none; }
}