@import url("https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");

body {
  background-image: url("background.webp");
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  font-family: "Ubuntu", sans-serif;
  font-weight: 400;
  font-style: normal;
  min-height: 100vh; /* Adiciona altura mínima */
  display: flex; /* Adiciona flexbox */
  flex-direction: column; /* Direção coluna */
}

.ubuntu-light {
  font-family: "Ubuntu", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.ubuntu-regular {
  font-family: "Ubuntu", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.ubuntu-medium {
  font-family: "Ubuntu", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.ubuntu-bold {
  font-family: "Ubuntu", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.opb-3 {
  --bs-bg-opacity: 0.6;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.opb-3:hover {
  border: 1px solid #aaa;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}
.nop {
  opacity: 1 !important;
}

/* geral */
a {
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  text-decoration: none;
}
a:link {
  text-decoration: none;
  color: #666666;
}
a:active {
  text-decoration: none;
  color: #666666;
}
a:checked {
  outline: none;
  text-decoration: none;
  color: #666666;
}
a:visited {
  outline: none;
  text-decoration: none;
  color: #666666;
}
a:hover {
  text-decoration: none;
  color: #333333;
}
a:focus {
  outline: none;
  text-decoration: none;
  color: #333333;
}
/* geral */

.footer {
  position: relative; /* Mudança de absolute para relative */
  width: 100%;
  height: 60px;
  line-height: 60px;
  --bs-bg-opacity: 0.6;
  margin-top: auto; /* Adiciona margem superior automática */
}

/* Faz o main ocupar o espaço disponível */
main {
  flex: 1; /* Adiciona flex grow */
}

/* Efeito de borda brilhante azul */
.glow-effect {
  border: 2px solid #00bfff;
  box-shadow: 
    0 0 10px #00bfff,
    0 0 20px #00bfff,
    0 0 30px #00bfff,
    inset 0 0 10px rgba(0, 191, 255, 0.1);
  border-radius: 8px;
}

/* Versão mais intensa do efeito */
.glow-effect-intense {
  border: 3px solid #00bfff;
  box-shadow: 
    0 0 15px #00bfff,
    0 0 30px #00bfff,
    0 0 45px #00bfff,
    0 0 60px rgba(0, 191, 255, 0.4),
    inset 0 0 15px rgba(0, 191, 255, 0.2);
  border-radius: 12px;
}

/* Efeito animado (pulsante) */
.glow-effect-animated {
  border: 2px solid #00bfff;
  border-radius: 8px;
  animation: glowPulse 2s ease-in-out infinite alternate;
}

@keyframes glowPulse {
  from {
    box-shadow: 
      0 0 10px #00bfff,
      0 0 20px #00bfff,
      0 0 30px #00bfff;
  }
  to {
    box-shadow: 
      0 0 20px #00bfff,
      0 0 30px #00bfff,
      0 0 40px #00bfff,
      0 0 50px rgba(0, 191, 255, 0.3);
  }
}

/* Efeito de borda brilhante rosa para vídeo */
.glow-effect-pink {
  border: 3px solid #ff1493;
  box-shadow: 
    0 0 15px #ff1493,
    0 0 30px #ff1493,
    0 0 45px #ff1493,
    0 0 60px rgba(255, 20, 147, 0.4),
    inset 0 0 15px rgba(255, 20, 147, 0.1);
  border-radius: 12px;
}

/* Versão animada rosa */
.glow-effect-pink-animated {
  border: 3px solid #ff1493;
  border-radius: 12px;
  animation: glowPulsePink 2s ease-in-out infinite alternate;
}

@keyframes glowPulsePink {
  from {
    box-shadow: 
      0 0 15px #ff1493,
      0 0 30px #ff1493,
      0 0 45px #ff1493;
  }
  to {
    box-shadow: 
      0 0 25px #ff1493,
      0 0 40px #ff1493,
      0 0 55px #ff1493,
      0 0 70px rgba(255, 20, 147, 0.5);
  }
}