/* Header */
header .main-navbar {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 2rem 0 0;
  transition: var(--transition);
}
header #logoCanvas {
  max-width: 7rem;
  transition: var(--transition);
}
.navbar {
  --bs-navbar-nav-link-padding-x: 1rem;
}
.header-menu .navbar {
  justify-content: flex-end;
  padding: 0;
}
.nav-link {
  position: relative;
}
.nav-link:after {
  background-color: var(--mg5-light-green);
  bottom: 0;
  box-shadow: 0 3px 16px 1px #c0ff00a3;
  content: "";
  display: block;
  height: 1px;
  left: 50%;
  opacity: 0;
  position: absolute;
  transform: translate(-50%);
  width: 0;
  margin: 0;
  border: none;
  transition: opacity var(--transition), width var(--transition), bottom var(--transition);
}
.nav-link:hover:after {
  opacity: 1;
  width: calc(100% - (var(--bs-navbar-nav-link-padding-x)*2));
}

/* Dropdown Menu */
.dropdown-menu {
  --bs-dropdown-link-color: var(--white);
  --bs-dropdown-link-hover-color: var(--mg5-light-green);
  --bs-dropdown-link-hover-bg: transparent;
  --bs-dropdown-item-padding-x: 0;
}
.dropdown-item {
  font-weight: 600;
}
.dropdown-menu-content {
  padding: 0.5rem 1rem;
}


/* Fixed Header */
#image-gallery {
  display: none;
}

.sliderImage:hover {
  opacity: 1;
}


.mask:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(circle farthest-corner at left center, rgb(0 0 0) 0%, rgb(60 20 89 / 0%) 20%), radial-gradient(circle at top center, rgb(0 0 0) -20%, rgb(60 20 89 / 0%) 30%), radial-gradient(circle farthest-corner at top left, rgb(0 0 0 / 0%) 0%, rgb(60 20 89 / 0%) 31%), radial-gradient(circle farthest-corner at top left, rgb(2 1 4) 0%, rgb(0 0 0 / 0%) 50%), radial-gradient(circle farthest-side at top right, rgb(0 0 0 / 0%) 0%, rgba(181, 176, 177, 0) 10%), radial-gradient(circle farthest-corner at bottom right, rgb(0 0 0) 0%, rgba(204, 104, 119, 0) 33%), radial-gradient(circle farthest-corner at top right, rgb(173 73 187 / 0%) 0%, rgb(255 255 255 / 0%) 50%), radial-gradient(ellipse at bottom center, rgb(0 0 0 / 0%) 0%, rgb(254 43 0 / 0%) 80%), radial-gradient(circle farthest-corner at bottom left, rgb(0 0 0) 0%, rgb(0 0 0 / 0%) 40%);
}

.gallery-section {
  min-height: var(--dynamic-height);
  display: grid;
  align-items: center;
  overflow: hidden;
}
.gallery-section .container-fluid,
.gallery-section .row {
  height: 100%;
}



.intro-inner-col {
  z-index: 99999;
  pointer-events: none;
  height: 100%;
}
.intro-inner {
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: center;
  padding-top: var(--header-height);
  padding-bottom: 2rem;
  height: 100%;
}
.intro-top {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}



.deadline {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--white);
}
.deadline-format {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 7rem;
  background: #00000033;
  padding: 1rem;
  border-radius: 0.5em;
  backdrop-filter: blur(15px);
  box-shadow: 0 0 1px 0px white;
}
.deadline-format h2 {
  margin-bottom: 0;
}
.deadline-format span {
  letter-spacing: 0.2em;
  font-weight: 100;
}

/* Coming Soon Footer */
.intro-bot {
  display: flex;
  justify-content: space-between;
}

.intro-inner .module-contact {
  align-self: flex-end;
}
.intro-inner .module-contact ul {
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 3rem;
}
.intro-inner .module-contact ul a {
  pointer-events: all;
}
.powered-by {
  position: relative;
  max-width: 18rem;
}
.powered-by:before {
  content: 'Powered by';
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 100;
  color: var(--white);
  font-size: var(--text-xs);
  letter-spacing: 0.2em;
}
#follower {
  position: absolute;
  display: flex;
  align-items: center;
  z-index: 9999999;
  width: 2.6rem;
  height: 2.6rem;
  border: 1px solid #fff;
  pointer-events: none;
  padding: 0.5rem;
  border-radius: 100%;
  white-space: nowrap;
  color: var(--white);
  font-size: var(--text-xs);
}
#follower.clicked {
  background: var(--white);
  mix-blend-mode: soft-light;
  color: var(--black);
}
