/* letsgo.css */
header h1 {
  position: fixed;
  top: 20%;
  /* Porcentaje de la VENTANA, como estaba desde el principio. El cuerpo de
     letra lo pone letsgo.js escalado con la escena. */
  left: 30%;
  transform: translateX(-150%);
  font-weight: bold;
  /* mix-blend-mode: difference; */
  z-index: 16; /* 🔥 Por delante de Kaia */
  pointer-events: none;
  line-height: 0.9;
  font-family: 'IBM Plex Mono', monospace;
  /* Las letras van en spans sueltos (entrada letra a letra) y sin esto PUEDEN
     saltar de línea: en ventana estrecha el LET'S se partía en "LET" / "'S".
     El bloque original era inquebrable; esto lo devuelve. */
  white-space: nowrap;
}

.lets-part,
.go-part {
  display: inline-block;
  opacity: 0;
  /* Filo cian del aro, 3 px detrás de la letra. Ata el título a la paleta de
     la escena sin parecer un efecto pegado encima. drop-shadow sigue la forma
     del glifo, así que en el LET'S hueco marca sólo el contorno. */
  filter: drop-shadow(3px 2px 0 rgba(0, 234, 255, 0.85));
}

/* Cada letra entra por su cuenta, con su retardo y su rebote. Sin transición
   CSS: las mueve el scroll, y una transición las dejaría arrastrándose. */
.letra {
  display: inline-block;
  opacity: 0;
  transform: translateX(-55vw);
  will-change: transform, opacity;
}

.lets-part {
  color: transparent; /* Detectable por canvas sin ser visible */
  -webkit-text-stroke: 4px white;
  mix-blend-mode: lighten;
  line-height: 0.9;
  /* -0.12em y no -0.20em: con el trazo de 4px, a -0.20 los contornos de las
     letras se montaban unos sobre otros y el LET'S se leía pesado. Sigue
     compacto, pero cada letra queda entera. colocaTitulo() remide el ancho en
     load/resize, así que el centrado y los topes se reajustan solos. */
  letter-spacing: -0.12em;
  /* El cuerpo lo pone letsgo.js escalado con la escena (344px en 3440x1305). */
  font-size: 344px;
  text-align: left;

}

.go-part {
  color: white;
  display: block;
  letter-spacing: -0.15em; /* Ajusta el valor a tu gusto */
  font-size: 516px;
  text-align: left;
}


