/* ===== NAV LAYOUT + SOLAR ANIMA ===== */

/* Desktop default */
.navlinks {
  display: flex;
  gap: 16px;
}

.nav-toggle {
  display: none;
}

/* ===== SOLAR ANIMA KEYFRAMES ===== */
@keyframes solarAnimaOpen {
  0% {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
    box-shadow: none;
  }

  70% {
    opacity: 1;
    transform: translateY(0) scale(1.01);
    box-shadow:
      0 0 14px rgba(255, 214, 102, 0.35),
      0 0 28px rgba(255, 186, 73, 0.25);
  }

  100% {
    transform: scale(1);
    box-shadow:
      0 0 10px rgba(255, 214, 102, 0.2);
  }
}

/* ===== MOBILE ===== */
@media (max-width: 767px) {

  header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }

  .nav-toggle {
    display: block;
    font-size: 1.6rem;
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
  }

  nav {
    width: 100%;
  }

  .navlinks {
    display: none;
    flex-direction: column;
    align-items: center;
    margin-top: 12px;
    padding: 14px 0;
    border-radius: 10px;

    /* ✅ TRANSPARENT CONTAINER */
    background: transparent;
  }

  .navlinks.open {
    display: flex;
    animation: solarAnimaOpen 0.45s ease-out;
  }

  .navlinks li {
    margin: 8px 0;
  }
}