/* ===================================================
   EYEBROW UNIFIED — emovere.agency
   Applies consistent eyebrow styles across all pages.
   Loaded last so it overrides page-specific CSS.
   =================================================== */

/* --- Base: section-eyebrow container --- */
.section-eyebrow,
.hero-eyebrow {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-family: 'Berkeley Mono', 'Courier New', monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--color-primary, #f0eee8) !important;
}

/* --- Line: unified 32px × 2px accent bar --- */
.section-eyebrow-line,
.hero-eyebrow-line {
  background: var(--accent, #4a7ef0) !important;
  width: 32px !important;
  height: 2px !important;
  flex-shrink: 0 !important;
  border-radius: 1px !important;
  display: block !important;
}

/* --- Proyectos hero eyebrow (different class) --- */
.projects-hero-eyebrow {
  font-family: 'Berkeley Mono', 'Courier New', monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--color-primary, #f0eee8) !important;
}

/* --- Keep contact hero special margin intact --- */
@media (min-width: 901px) {
  .contact-hero-title-wrap .section-eyebrow {
    margin-bottom: 100px !important;
  }
}