@keyframes gradientBG {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
#bg{
  background: linear-gradient(270deg, #25559e, #133b6e, #1824c5);
  color: #fff;
  animation: gradientBG 15s ease infinite;
  box-shadow: 0 20px 24px rgba(0, 0, 0, 0.747);
  background-size: 800% 800%;
  border-radius: 12px;
  width: 93%;
  transition: all 0.4s ease;
}
#bg:hover{
  transform: scale(1.01);
  box-shadow: 0 10px 18px rgba(16, 154, 235, 0.39);
}
/* RESPONSIVIDADES */
@media (min-width: 1024px) {
  /* Resposividade Ipad Pro 7 */
  #bg{
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media (min-width: 912px) {
  /* Resposividade Surface Pro 7 */
  #bg{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 90%;
  }
}
@media (min-width: 853px) {
  /* Azus Zenbook Fold */
  #bg{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 90%;
  }
}

.iii{
  font-size: 25px;
  color: #fff;
}

#imgLg{
  width: 180px;
  height: 180px;
  box-shadow: 0 20px 24px rgba(0, 0, 0, 0.747);
  transition: all 0.2s ease;
}
#imgLg:hover{
  transform: scale(1.02);
  box-shadow: 0 10px 18px rgba(131, 146, 219, 0.623);
}

/* Botão Falar com Parceiro */
@keyframes pulse {
  0%{
    box-shadow: 0 0 0 0 #11ac4c79;
  }
  70%{
    box-shadow: 0 0 0 20px rgba(37, 211, 102, 0);
  }
  100%{
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}
.Bhv{
    animation: pulse 2s infinite;
}
.Bhv{
    background: linear-gradient(90deg, #142010 0%, #11853b 100%);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 12px 28px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgba(255, 255, 255, 0.397);
}
.Bhv:hover{
  transform: scale(1.03);
}

/* Botões de Redes e Contato */
#btnInstagram{
    background: radial-gradient(circle at 30% 107%, #fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 5px 15px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgb(192, 34, 231);
}
#btnFacebook{
  background: #1877f2;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 5px 15px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgb(22, 56, 247);
}
#btnSite{
    background: #18a2f2;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 5px 15px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgb(40, 151, 255);
}
#btnGoogleMaps{
    background: #797b7c;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 5px 15px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgba(155, 155, 155, 0.856);
}

/* Efeito Lamina */
@keyframes shineMove{
  0%{
    left: -75%;
  }
  100%{
    left: 125%;
  }
}

.shine{
  position: relative;
  overflow: hidden;
}

.shine::before{
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
      120deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.4) 50%,
      rgba(255, 255, 255, 0) 100%
  );
  transform: skew(-25deg);

  /* Animação Automática */
  animation: shineMove 3s infinite linear;
}

.shine:hover{
  transform: scale(1.1);
}

/* Section - Rodapé */
.bg-rodape{
    background: radial-gradient(circle at top, #00111a, #000);
}

/* Section - Rodapé */
.btnVoltar{
    background: radial-gradient(circle at top, #000000, #00111a);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    padding: 12px 28px;
    text-decoration: none;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 6px 12px rgba(255, 255, 255, 0.25);
}
.btnVoltar:hover{
    background: radial-gradient(circle at top, #053149, #000);
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 10px 18px rgba(11, 39, 71, 0.589);
}
.btnVoltar:active{
  transform: translateY(1px) scale(0.98);
  box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.3);
}