/* home-accent.css — Home 页 per-page accent 注入（节点 1）
 *
 * 页面：src/index.html — Home / Landing
 * 结构：hero collage + scrollytelling 4 slides + about prose + variant demo strip
 *       + 底部 2 CTA 按钮（"毕业留言" + "往届合照"）+ footer
 *
 * 规则（per spec §2.4 + brief C6）：
 *   1) 唯一一处 accent 表面：.cta.cta--accent（底部 2 按钮）
 *   2) accent = #6B5640 (accent-6, warm earthy brown) — 直接引用 var(--accent-6)
 *   3) 文字色 = #F5E8D1 (cream, contrast 5.9:1 ≥4.5 ✓)
 *   4) border-radius: 0 (C13)
 *   5) 所有 transition 用 var(--dur-micro) + var(--ease) — 无 cubic-bezier 字面量
 *   6) 无 @keyframes — 全 transition
 *   7) 占整页表面 ≤5%（2 × 200×48 = ~19K px² / 4.3M px² → 0.44% ✓）
 *   8) hero CTA 用 .cta.cta--cream（accent 即 cream-on-forest，与 demo 一致）— 不是 accent 表面
 *
 * 注：demo.html 的 scrollytelling / hero collage 样式在 src/index.html per-page <style>
 *     内联（避免 shared CSS 文件膨胀，且全 transition 无 keyframes）
 */

.cta.cta--accent {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  border: none;
  border-radius: 0;
  background: var(--accent-6);
  color: #F5E8D1;
  font-family: var(--font-utility);
  font-size: var(--fs-utility);
  font-weight: 500;
  letter-spacing: 0.96px;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    transform var(--dur-micro) var(--ease),
    box-shadow var(--dur-micro) var(--ease),
    background-color var(--dur-micro) var(--ease);
}

.cta.cta--accent:hover {
  transform: translateY(-2px);
  box-shadow: var(--elev-3);
}

.cta.cta--accent:active {
  transform: translateY(-1px);
}

.cta.cta--accent:focus {
  outline: 2px solid var(--accent-6);
  outline-offset: 2px;
}

.cta.cta--accent .arrow {
  transition: transform var(--dur-micro) var(--ease);
}

.cta.cta--accent:hover .arrow {
  transform: translateX(4px);
}