/* ============================================================
   GLOBAL
   ============================================================ */
body {
  background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
              url('https://images.unsplash.com/photo-1542751371-adc38448a05e');
  background-size: cover;
  background-position: center;
  font-family: 'Arial', sans-serif;
  color: #fff;
  margin: 0;
  padding-top: 80px; /* space for sticky navbar */
}

.main-wrapper {
  min-height: calc(100vh - 140px); /* header + footer */
}

/* ============================================================
   STICKY NAVBAR HEADER
   ============================================================ */
.sticky-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 3000;
}

.main-navbar {
  background: rgba(0,0,0,0.9);
  backdrop-filter: blur(4px);
  border-bottom: 1px solid #555;
}

/* Brand / Company name */
.company-name {
  font-size: 20px;
  font-weight: bold;
  color: #ffd700 !important;
}

/* ============================================================
   CUSTOM PNG HAMBURGER ICON  (THIS IS THE ONE WE USE)
   ============================================================ */
.menu-icon-img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  border-radius: 50%;
  filter: drop-shadow(0 0 4px rgba(255,215,0,0.9)); /* gold glow */
}

/* ============================================================
   NAV LINKS (About / Contact)
   ============================================================ */
.navbar-nav .nav-link {
  color: #ddd;
  font-size: 14px;
  padding-left: 1rem;
  padding-right: 1rem;
  border-left: 1px solid rgba(255,255,255,0.12);
}

.navbar-nav .nav-link:first-child {
  border-left: none;
}

.navbar-nav .nav-link:hover {
  color: #ffd700;
}

/* Top-link class kept for clarity */
.top-link {
  text-decoration: none;
}

/* ============================================================
   AUTH BUTTONS (Login / Register)
   ============================================================ */
.btn-login,
.btn-register {
  color: #fff;
  border: 1px solid #ffd700;
  padding: 6px 16px;
  border-radius: 5px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.btn-login:hover,
.btn-register:hover {
  background-color: #ffd700;
  color: #000;
}

/* ============================================================
   MOBILE COLLAPSE STYLING
   ============================================================ */
@media (max-width: 767.98px) {
  .navbar-collapse {
    background: rgba(0,0,0,0.95);
    padding: 10px 15px 15px;
    border-top: 1px solid #444;
  }

  .navbar-nav .nav-link {
    border-left: none;
    padding-left: 0;
  }

  .auth-buttons {
    margin-top: 10px;
  }
}

/* ============================================================
   COMING SOON BOX
   ============================================================ */
.coming-box {
  background: rgba(0,0,0,0.55);
  padding: 40px;
  border-radius: 15px;
  max-width: 500px;
  width: 100%;
  box-shadow: 0 0 12px rgba(255,255,255,0.2);
}

.highlight {
  color: #ffd700;
}

.btn-custom {
  background-color: #ffd700;
  color: #000;
  font-weight: bold;
  border: none;
}
.btn-custom:hover {
  background-color: #e6c200;
}

/* ============================================================
   FOOTER
   ============================================================ */
footer {
  position: fixed;
  bottom: 5px;
  width: 100%;
  text-align: center;
  color: #ccc;
  font-size: 14px;
}

.footer-links a {
  color: #ffd700;
  text-decoration: none;
}
.footer-links a:hover {
  text-decoration: underline;
}

/* ============================================================
   MOBILE RESPONSIVE TWEAKS
   ============================================================ */
@media (max-width: 576px) {
  .company-name {
    font-size: 16px;
  }
  .coming-box {
    padding: 25px;
  }
}