body{
  margin:0;
  font-family:sans-serif;
  background:var(--page-bg);
}

.navbar-nav .nav-link{
  padding:10px 15px;
  color:var(--text-main);
  background:transparent;
  border-radius:var(--radius-sm);
  font-weight:400;
  transition:all var(--trans-mid);
}

.navbar-nav .nav-link:hover{
  color:var(--white);
  background-color:var(--nav-hover-bg);
  border-radius:var(--radius-sm);
}

.btn{
  transition:transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.btn:hover{
  transform:scale(1.05);
  box-shadow:var(--shadow-btn);
}

.telegram-btn,
.tiktok-btn{
  display:inline-block;
  padding:10px 22px;
  font-size:14px;
  font-weight:bold;
  border-radius:var(--radius-md);
  text-align:center;
  text-decoration:none;
  transition:0.3s;
}

.telegram-btn{
  background-color:var(--telegram-bg);
  color:var(--white);
  border:none;
}

.tiktok-btn{
  background:var(--tiktok-gradient);
  color:var(--white);
  border:none;
}

.tiktok-btn:hover{
  opacity:1.0;
  color:var(--white);
}

.telegram-btn:hover{
  opacity:1.0;
  color:var(--telegram-bg);
}

@media (max-width: 768px){
  .navbar-nav{
    flex-direction:column;
    align-items:center;
    margin-top:20px;
  }

  .navbar-nav .nav-item{
    margin-bottom:4px;
  }

  .navbar-nav .nav-link{
    padding:5px 10px;
    max-width:200px;
    text-align:center;
  }

  .btn{
    width:200px;
    margin-bottom:4px;
  }
}
