/* =============================================
   SYNE AEROSPACE — Missions Page CSS
   ============================================= */

/* ---- Filter Bar ---- */
.filter-bar {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.filter-btn {
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 500;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--col-border);
  background: var(--col-bg);
  color: var(--col-muted);
  cursor: pointer;
  transition: all var(--transition);
}
.filter-btn:hover {
  border-color: var(--col-accent);
  color: var(--col-accent);
}
.filter-btn.active {
  background: var(--col-accent);
  border-color: var(--col-accent);
  color: #fff;
}

/* ---- Mission cards hidden state ---- */
.mission-card {
  transition: opacity 0.3s ease, transform 0.3s ease, box-shadow var(--transition);
}
.mission-card[style*="none"] {
  display: none;
}