/* ==========================================================================
   Section header  (.pf-section-head)
   The "PROJECTS" / "CONTACT" centred heads and the left-aligned case-study
   section heads. Optional eyebrow (overline) and short accent rule.
   ========================================================================== */

.pf-section-head {
  display: flex;
  flex-direction: column;
  gap: var(--pf-space-2);
}

.pf-section-head--center {
  align-items: center;
  text-align: center;
}

.pf-section-head__eyebrow {
  font-family: var(--pf-font-body);
  font-size: var(--pf-text-small);
  text-transform: uppercase;
  letter-spacing: var(--pf-tracking-caps);
  color: var(--pf-ink-secondary); /* ink eyebrow — Rapha keeps these black */
}

.pf-section-head__title {
  font-family: var(--pf-font-display);
  font-weight: var(--pf-weight-display);
  font-size: var(--pf-text-h1);
  line-height: var(--pf-lh-heading);
  letter-spacing: var(--pf-tracking-display);
  text-transform: uppercase;
  color: var(--pf-ink);
}

/* Short pink rule beneath a heading — the one place the brand pink shines */
.pf-section-head__rule {
  width: 48px;
  height: var(--pf-border-strong);
  background: var(--pf-accent);
  border: 0;
  margin: var(--pf-space-1) 0 0;
}
.pf-section-head--center .pf-section-head__rule {
  margin-inline: auto;
}