/* ====== GENERAL TYPOGRAPHY ====== */
.header {
  color: aliceblue;
  text-align: left;
  white-space: nowrap;
  font-size: 2vw;
}

@media (max-width: 575.98px) {
  .h3-no-wrap {
    white-space: normal;
  }
}

.undim-titles {
  position: relative;
  z-index: 1;
  color: white;
}

/* ====== NAVBAR ====== */
.logo {
  height: 50px;
  width: auto;
}

.navbar-custom {
  background-color: #2d333e; /* Deep black background */
  border-bottom: 2px solid #B3C8CF; /* Accent underline */
}

.start-here {
  color: rgb(206, 204, 204) !important;
}

.navbar .nav-link {
  position: relative;
  transition: color 0.3s ease;
}

.navbar .nav-link:hover {
  color: #B3C8CF !important;
}

.navbar .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: #B3C8CF;
  transition: width 0.3s;
}

.navbar .nav-link:hover::after {
  width: 100%;
}

/* ====== BUTTONS & LINKS ====== */
#icon-link {
  color: #B3C8CF;
  text-align: center;
  text-decoration: none;
  border: 3px solid #B3C8CF;
  border-radius: 20%;
  transition: all 0.3s ease;
}

#icon-link:hover {
  border-color: whitesmoke;
  color: whitesmoke;
}

/* ====== BACKGROUND SECTIONS ====== */
.bg-overlay {
  background-color: rgba(37, 37, 240, 1);
  opacity: 1;
}

.bg-body-tertiary {
  background-image: url("../../images/pic01.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transition: all 0.3s ease-in-out;
  display: block;
  z-index: 0;
}

.bg-body-tertiary:hover {
  opacity: 1.0;
}

.h2-style {
  color: whitesmoke;
  text-decoration: none;
}

/* ====== GRID SECTIONS (Worklife, Projects, etc.) ====== */
.worklife,
.projects,
.education,
.skills {
  position: relative;
  height: 25vw;
  text-decoration: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: all 0.3s ease-in-out;
  display: block;
  z-index: 0;
}

.worklife {
  background-image: url("../../images/pic02.jpg");
}

.projects {
  background-image: url("../../images/pic03.jpg");
}

.education {
  background-image: url("../../images/pic04.jpg");
}

.skills {
  background-image: url("../../images/pic05.jpg");
}

/* ====== IMAGE OVERLAY EFFECT ====== */
.image-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease-in-out;
}

.image-container:hover::before {
  background: rgba(0, 0, 0, 0.2);
}

/* ====== FOOTER ====== */
.border-top {
  border-style: ridge;
  border-width: 0;
}

.language-switcher .nav-link {
  font-weight: 600;
  color: #ccc; /* lighter than dim gray */
  transition: color 0.2s ease, transform 0.2s ease;
}

.language-switcher .nav-link:hover {
  color: #76ABAE; /* brand accent */
  transform: translateY(-1px); /* subtle hover lift */
}

.language-switcher .nav-link.active {
  color: #ffffff; /* bright white for active */
  font-weight: 700; /* extra emphasis */
}

.language-switcher .separator {
  margin: 0 8px;
  color: #777; /* muted but visible */
}