/* ============================================================
   components/page-header.css
   Archive list header + page header
   ============================================================ */

/* ===== LIST HEADER (ARCHIVE PAGES) ===== */
.list-header {
  margin-top: var(--space-16);
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  padding: var(--space-8) var(--space-5);
}
.list-header__inner { max-width: 1280px; margin: 0 auto; }
.list-header__title { font-size: 24px; font-weight: 900; color: #fff; margin-bottom: 8px; }
.list-header__stats { font-size: 14px; color: rgba(255,255,255,0.85); }
.list-header__stats strong { color: #fff; font-weight: 700; }

/* ===== PAGE HEADER ===== */
.page-header {
  background: linear-gradient(135deg, var(--primary-bg) 0%, var(--primary-bg-strong) 100%);
  padding: var(--space-12) var(--space-5); text-align: center;
}
.page-header--pink {
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  padding: var(--space-8) var(--space-5); text-align: center;
}
.page-header__label {
  display: inline-block;
  font-size: var(--font-sm); font-weight: 700; color: var(--primary);
  background: rgba(var(--primary-rgb),0.1); padding: 4px 16px; border-radius: 50px;
  margin-bottom: var(--space-3);
}
.page-header__title { font-size: 32px; font-weight: 900; color: var(--text); margin-bottom: 12px; }
.page-header__title--white { font-size: 24px; font-weight: 900; color: #fff; }
.page-header__desc { font-size: 15px; color: #666; }
.page-header__updated { font-size: 12px; color: #bbb; margin-top: 16px; }