/* ============================================
   星河入梦工作室 — 排版系统
   ============================================ */

/* —— 标题层级 —— */
h1, .h1 {
  font-family: var(--font-display);
  font-size: var(--font-size-h1);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-tight);
}

h2, .h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
}

h3, .h3 {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
}

h4, .h4 {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
}

/* —— Hero 标题 —— */
.hero-title {
  font-family: var(--font-display);
  font-size: var(--font-size-hero);
  font-weight: var(--font-weight-bold);
  line-height: 1.1;
  letter-spacing: var(--letter-spacing-tight);
}

.hero-subtitle {
  font-family: var(--font-display);
  font-size: clamp(0.9rem, 1.5vw, 1.2rem);
  font-weight: var(--font-weight-light);
  letter-spacing: var(--letter-spacing-wider);
  text-transform: uppercase;
  color: var(--color-text-secondary);
}

/* —— 区块标签 —— */
.section-label {
  display: inline-block;
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--letter-spacing-wider);
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--space-md);
}

/* —— Slogan —— */
.slogan {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  font-weight: var(--font-weight-light);
  color: var(--color-text-secondary);
  letter-spacing: var(--letter-spacing-wide);
}

/* —— 服务标签 —— */
.service-tags {
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-regular);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-muted);
}

.service-tags .dot {
  display: inline-block;
  margin: 0 0.75em;
  color: var(--color-accent);
  opacity: 0.6;
}

.service-tags .tag-item {
  display: inline-block;
  padding: 4px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-full);
  font-size: var(--font-size-xs);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-muted);
  transition: all var(--transition-base);
}

.service-tags .tag-item:hover {
  border-color: var(--color-accent);
  color: var(--color-accent);
  background: rgba(201, 168, 76, 0.05);
}

.service-tags .tag-dot {
  display: inline-block;
  margin: 0 0.5em;
  color: var(--color-accent);
  opacity: 0.4;
}

/* —— 正文段落 —— */
.text-body {
  font-size: var(--font-size-body);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  max-width: 65ch;
}

.text-body-large {
  font-size: 1.125rem;
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
}

/* —— 文本渐变 —— */
.text-gradient {
  background: linear-gradient(135deg, var(--color-accent) 0%, #e2c96f 50%, var(--color-accent) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientShift 3s ease infinite;
}

/* —— 数字亮点 —— */
.stat-number {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: var(--font-weight-bold);
  color: var(--color-accent);
  line-height: 1;
}

.stat-label {
  font-size: var(--font-size-small);
  color: var(--color-text-muted);
  letter-spacing: var(--letter-spacing-wide);
  text-transform: uppercase;
  margin-top: var(--space-xs);
}

/* —— 邮箱展示 —— */
.email-display {
  font-family: var(--font-mono);
  font-size: clamp(1.2rem, 3vw, 1.8rem);
  font-weight: var(--font-weight-regular);
  color: var(--color-text-primary);
  letter-spacing: 0.03em;
}
