/* NAV */
nav { background-color: white; border-bottom: 1px solid var(--neutral-200); box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
nav ul { list-style: none; display: flex; }
nav button { background: none; border: none; padding: 18px 24px; cursor: pointer; font-size: 12px; font-weight: 600; color: var(--neutral-600); border-bottom: 3px solid transparent; transition: all 0.3s ease; letter-spacing: 0.2px; text-transform: uppercase; position: relative; }
nav button:hover { color: var(--primary); background-color: var(--neutral-50); }
nav button.active { color: var(--primary); border-bottom-color: var(--primary); }
.logo-image {
  width: 56px; height: 56px;
  background-color: rgba(255,255,255,0.15);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.2);
  animation: slideInRight 0.6s cubic-bezier(0.4,0,0.2,1);
  font-size: 26px;
  object-fit: cover;
}
.logo-text .app-name { font-size: 20px; font-weight: 700; letter-spacing: -0.3px; }
.logo-text .app-subtitle { font-size: 12px; opacity: 0.9; font-weight: 500; }

@media (max-width: 480px) {
    .logo-text .app-name{
      font-size: 15px;
      width: 200px;
    }
  }