/* Makai Text Scatter — Final v3.1 (hover/proximity reliable) */
.tss31-wrap {
  width: 100%;
  box-sizing: border-box;
  padding-left: clamp(8px, 2vw, 24px);
  padding-right: clamp(8px, 2vw, 24px);
  text-align: center;
}
.tss31-wrap.align-left { text-align: left; }
.tss31-wrap.align-right { text-align: right; }
.tss31-wrap.align-center { text-align: center; }

.tss31-pressure.tss31-scatter {
  display: inline-block;
  font-family: "Ribery", inherit;
  color: var(--makai-navy, #001F3F);
  background: none !important;

  font-size: clamp(72px, 18vw, 620px);
  line-height: 1.02;
  margin: 0; padding: 0;

  --tss31-pressure: 0;
  --tss31-wght: 780;
  --tss31-lspx: 0;
  --tss31-strength: 0.38;

  letter-spacing: calc(var(--tss31-lspx) * 1px);
  font-variation-settings: "wght" var(--tss31-wght);

  transform: translateZ(0) scale(calc(1 + (var(--tss31-pressure) * var(--tss31-strength))));

  text-shadow: 0 0 calc(2px + 18px * var(--tss31-pressure)) rgba(0,0,0,0.26);
  filter: contrast(calc(1 + var(--tss31-pressure) * 0.38)) brightness(calc(1 + var(--tss31-pressure) * 0.2));

  transition: letter-spacing 0.10s ease, text-shadow 0.10s ease, filter 0.10s ease;
  will-change: transform, letter-spacing, font-variation-settings, filter;

  /* Deshabilitar ligaduras para que "por letra" sea exacto */
  font-variant-ligatures: none;
}

/* Per-letter: permitir transformación independiente y evitar capturar el hover */
.tss31-ch {
  display: inline-block;
  pointer-events: none;
  will-change: transform;
  transition: transform 0.22s cubic-bezier(.2,.8,.2,1);
}
/* Durante hover/proximidad aceleramos la reacción */
.tss31-scatter:hover .tss31-ch { transition: transform 0.12s cubic-bezier(.2,.8,.2,1); }