/* ===============================================================
   projects.css — 项目作品卡片 (编号式陈列)
   =============================================================== */

.projects__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-xl);
}

/* ── 项目卡片 ── */
.project-card {
  display: block;
  background: var(--paper);
  color: var(--text-on-paper);
  padding: var(--space-2xl) var(--space-xl);
  position: relative;
  text-decoration: none;
  cursor: pointer;
  transition:
    transform var(--duration-base) var(--ease-out),
    box-shadow var(--duration-base) var(--ease-out);
  transform-style: preserve-3d;
  perspective: 800px;
}

.project-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
}

/* 编号 */
.project-card__number {
  font-family: var(--font-sans);
  font-size: 0.65rem;
  letter-spacing: 0.3em;
  color: var(--gold);
  margin-bottom: var(--space-md);
  opacity: 0.8;
}

.project-card__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  margin-bottom: var(--space-sm);
  color: var(--text-on-paper);
  line-height: 1.3;
}

.project-card__desc {
  font-size: 0.85rem;
  color: var(--text-on-paper-secondary);
  line-height: 1.7;
  margin-bottom: var(--space-lg);
}

/* 标签 */
.project-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
}

.project-card__tag {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  padding: 0.2em 0.8em;
  border: 1px solid var(--gold-border);
  color: var(--gold);
  border-radius: var(--radius-sm);
}

/* 底部分割装饰 */
.project-card__rule {
  width: 40px;
  height: 2px;
  background: var(--gold);
  margin-top: var(--space-lg);
  opacity: 0.5;
}

/* 卡片画框内阴影 */
.project-card::after {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(168, 133, 61, 0.15);
  pointer-events: none;
}

/* ── 响应式 ── */
@media (max-width: 480px) {
  .projects__grid {
    grid-template-columns: 1fr;
  }

  .project-card {
    padding: var(--space-xl) var(--space-lg);
  }
}