/* Body */
a {
  text-decoration: none;
  color: var(--bs-secondary);
}

a:hover {
  color: var(--bs-tertiary);
}

ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

/* Navbar */
.navbar-custom {
  transition:
    background-color 0.5s,
    color 0.5s,
    padding 0.5s,
    box-shadow 0.5s;
  padding: 5px 20px;
}

.navbar-custom.scrolled {
  background-color: var(--bs-altlight);
  padding: 5px 20px;
  box-shadow: 0px 9px 10px rgba(0, 0, 0, 0.1);
}

.nav-link {
  color: var(--bs-primary);
}

.nav-link:hover {
  color: var(--bs-tertiary);
}

#home-nav {
  color: var(--bs-altlight);
}

#home-nav .nav-link {
  color: var(--bs-altlight);
  transition: color 0.2s;
}

#home-nav .nav-link:hover {
  color: var(--bs-secondary);
}

#home-nav.scrolled .nav-link {
  color: var(--bs-primary);
}

#home-nav.scrolled .nav-link:hover {
  color: var(--bs-tertiary);
}

#home-nav #ugas {
  color: var(--bs-altlight);
  transition: color 0.5s;
}

#home-nav.scrolled #ugas {
  color: var(--bs-primary);
}

/* Landing */
.bg-image {
  background-image: url('../images/uga-sunpose2.jpg');
  background-size: cover;
  background-position: right;
  height: 100vh;
  width: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: -1;
}

.bg-overlay {
  background-color: rgba(0, 0, 0, 0.2);
  /* Optional: Add a dark overlay for better text readability */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#hero {
  position: relative;
  top: 50%;
  z-index: 2;
  /* Ensure text is above the overlay */
}

/* Google fonts */
.navbar-brand,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Buda';
  color: var(--bs-primary);
}

/* Testing */
