/* ============================================================
   css/home/index.css —— 首页私有样式
   命名：site-<区块>；颜色/圆角/阴影一律引用 /css/main.css 的令牌
   ============================================================ */

/* ==================== 英雄区 ==================== */
.site-hero {
  padding: clamp(2rem, 1.2rem + 4vw, 4.5rem) 0 clamp(2rem, 1.5rem + 3vw, 3.5rem);
  background: var(--site-surface);
  border-bottom: 1px solid var(--site-border);
}

.site-hero-title {
  font-size: clamp(2.1rem, 1.4rem + 3.4vw, 3.6rem);
  line-height: 1.15;
  margin-bottom: 0.35rem;
}

.site-hero-tagline {
  font-size: clamp(1.05rem, 0.9rem + 0.8vw, 1.5rem);
  font-weight: 600;
  color: var(--site-primary);
  letter-spacing: 0.06em;
  margin-bottom: 0.9rem;
}

.site-hero-desc {
  max-width: 34rem;
  color: var(--site-muted);
  font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.06rem);
  line-height: 1.9;
  margin-bottom: 1.6rem;
}

.site-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.site-hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.1rem;
  color: var(--site-muted);
  font-size: 0.86rem;
}

.site-hero-badges i {
  color: var(--site-primary);
  margin-right: 0.3rem;
}

/* 人像占位图：跟随容器宽度缩放 */
.site-hero-photo {
  max-width: 22rem;
  margin-inline: auto;
  border-radius: var(--site-radius);
  overflow: hidden;
  box-shadow: var(--site-shadow-hover);
  border: 1px solid var(--site-border);
}

.site-hero-photo svg {
  display: block;
  width: 100%;
  height: auto;
}

/* ==================== 自我介绍摘要 ==================== */
.site-intro-text p {
  color: var(--site-muted);
  line-height: 1.95;
}

.site-intro-text p:last-child {
  margin-bottom: 0;
}

/* ==================== 快速导航卡片 ==================== */
.site-quick-card {
  display: block;
  height: 100%;
  color: var(--site-ink);
}

.site-quick-card:hover {
  color: var(--site-ink);
}

.site-quick-icon {
  display: inline-grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: 0.85rem;
  border-radius: var(--site-radius-sm);
  font-size: 1.25rem;
  color: #fff;
  background: var(--site-primary);
}

.site-quick-title {
  font-size: 1.06rem;
  margin-bottom: 0.35rem;
}

.site-quick-desc {
  color: var(--site-muted);
  font-size: 0.9rem;
  line-height: 1.75;
}

/* ==================== 响应式微调 ==================== */
@media (max-width: 991.98px) {
  .site-hero-photo {
    max-width: 18rem;
  }
}