body {
  background: black;
  color: white;
  font-family: 'Inter', sans-serif;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

/* FILA SUPERIOR: LOGO + FRASE */
.fila-superior {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0px;   /* más juntos que antes */
}


/* Tamaños base (ajustables) */
.logo {
  width: 180px;
  height: auto;
}

.frase {
  width: 300px;   /* ← antes 260px, ahora más grande */
  height: auto;
}

/* EL CONTADOR OCUPA EL ANCHO DE AMBOS JUNTOS */
.contador {
  width: calc(180px + 300px + 10px); /* logo + frase nueva + gap */
  text-align: center;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 1px;
  opacity: 0.9;
}


@media (max-width: 700px) {
  .fila-superior {
    flex-direction: column;
    gap: 15px;
  }

  .logo {
    width: 140px;
  }

  .frase {
    width: 260px; /* frase más grande también en mobile */
  }

  .contador {
    width: 260px;
    font-size: 20px;
  }
}