/* HERO */
body, .col.texto, .hud {
  font-family: 'Press Start 2P', cursive;
}

.intro {
  position: relative;
  height: 100vh;          /* dá altura à seção do vídeo */
  overflow: hidden;       /* evita overflow do vídeo */
}

.intro video {
  position: absolute;
  inset: 0;               /* top/right/bottom/left: 0 */
  width: 100%;
  height: 100%;
  object-fit: cover;      /* cobre toda a área sem distorcer */
  z-index: 0;             /* fica atrás de tudo dentro da .intro */
  display: block;
  pointer-events: none;   /* cliques passam para elementos acima */
}

.intro .logo {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: 40%;
}

.intro .ember {
  position: absolute;
  top: 10%;
  left: 5%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: 8%;
  transition: transform 0.4s ease;
}

.plataformas {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;   /* Espaçamento entre os logos */
  z-index: 2;
}

.plataformas img {
  max-width: 250px;
  max-height: 150px;
  background-color: azure;
  border-radius: 8px; /* deixa arredondado de leve */
  padding: 20px;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.plataformas img:hover {
  transform: scale(1.1); /* animação no hover */
}


.intro .ember:hover {
  transform: translate(-50%, -60%) scale(1.1);
  cursor: pointer;
}

.xs {
  padding: 8px !important;
}

footer {
  position: relative;
  text-align: center;
}


body { background-color: #ffffff; }


@media screen and (max-width: 768px) {
  .plataformas {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    top: 65%;
  }

  .plataformas img {
    width: 200px;
  }

  .intro .logo {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: 80%;
}

  .intro .ember {
  position: absolute;
  top: 10%;
  left: 10%;
  transform: translate(-50%, -50%);
  z-index: 2;
  max-width: 20%;
  transition: transform 0.4s ease;
}

}