/* === GLOBAL FIX: Remove Horizontal Overflow === */
html, body {
  overflow-x: hidden !important;
  margin: 0;
  padding: 0;
  max-width: 100vw;
}

*, *::before, *::after {
  box-sizing: border-box;
}

/* === Ensure All Sections Stay Within Screen === */
section, header, footer, main {
  max-width: 100%;
  overflow-x: hidden;
}

/* === CERTIFICATES: Scrollable but No Scrollbar === */
.certificates-scroll-container {
  overflow-x: auto !important;
  overflow-y: hidden;
  white-space: nowrap;
  max-width: 100%;
  padding-bottom: 10px;
  margin-bottom: 20px;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

.certificates-scroll-container::-webkit-scrollbar {
  display: none;
}

.certificates-scroll-container {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* === Project Card Safe Width === */
.project-card {
  max-width: 100%;
  overflow-wrap: break-word;
}

/* === Desktop Nav Wrap Fix === */
@media screen and (min-width: 992px) {
  nav ul {
    flex-wrap: wrap;
    justify-content: center;
    max-width: 100%;
    overflow: hidden;
  }
}

/* === ✅ NAVIGATION LINK UNDERLINE FIX === */
.nav-section li a {
  position: relative;
  display: inline-block;
  padding-bottom: 4px;
  text-decoration: none;
  color: inherit;
  transition: all 0.3s ease;
}

/* Create hidden underline */
.nav-section li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 0%;
  background-color: #ffffff; /* Your active link underline color */
  transition: width 0.3s ease;
}

/* Show underline on hover */
.nav-section li a:hover::after {
  width: 100%;
}

/* Show underline for active section link */
.nav-section li a.active::after {
  width: 100%;
}