/* ═══════════════════════════════════════════════
   UMIDON — pages.css: khung chung cho các trang trong
   Nạp SAU style.css. Style riêng từng trang đặt ở css/page-<slug>.css
   ═══════════════════════════════════════════════ */

/* banner đầu trang trong */
.page-hero {
  padding: clamp(140px, 16vw, 200px) 0 clamp(40px, 5vw, 70px);
  position: relative;
}
.page-hero__kicker { margin-bottom: 14px; }
.page-hero__title {
  font-size: clamp(40px, 7vw, 92px);
  line-height: 0.98;
  letter-spacing: -.015em;
  text-transform: uppercase;
  max-width: 14ch;
}
.page-hero__title em { font-style: normal; color: var(--red); }
.page-hero__desc {
  max-width: 560px;
  margin-top: 22px;
  font-size: clamp(15px, 1.25vw, 17.5px);
  color: rgba(30, 26, 21, .78);
}

/* card giấy sáng nằm trong section đen: chữ phải là mực tối,
   không kế thừa màu kem của section (nếu không tiêu đề vô hình) */
.section--black .note,
.section--black .note h3 { color: var(--ink); }

/* breadcrumb kiểu tem mono — luôn một dòng riêng, không dính kicker */
.crumb {
  display: flex; gap: 8px; align-items: center;
  margin-bottom: 12px;
  font-size: 11px; letter-spacing: .14em;
  color: rgba(30, 26, 21, .55);
  text-transform: uppercase;
}
.crumb a { color: inherit; text-decoration: none; }
.crumb a:hover { color: var(--red); }

@media (max-width: 880px) {
  .page-hero { padding-top: 120px; }
}