/* ================================================================
   EffiQ Theme — Typography
   Eyebrow labels, heading scale, body text, section header helpers.
   Loaded on every page.
================================================================ */

/* ── EYEBROW LABEL ──────────────────────────────────────────────── */
.ey { font-family: var(--fh); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--bl); display: inline-flex; align-items: center; gap: 9px; margin-bottom: 16px; }
.ey::before { content: ""; width: 20px; height: 1.5px; background: var(--bl); flex-shrink: 0; }
.ey-w { color: rgba(255,255,255,.55); }
.ey-w::before { background: rgba(255,255,255,.4); }
.ey-pur { color: #A78BFA; }
.ey-pur::before { background: #A78BFA; }

/* inline category / chip label (used in service page templates) */
.ci { font-family: var(--fh); font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--bl); margin-bottom: 13px; }

/* ── HEADING SCALE ──────────────────────────────────────────────── */
.headline { font-family: var(--fh); font-size: clamp(44px,6.5vw,92px); font-weight: 800; letter-spacing: -.05em; line-height: .92; color: var(--wh); }
.headline em { font-style: normal; background: var(--grad-bl-pur); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

.h2 { font-family: var(--fh); font-size: clamp(28px,3.8vw,46px); font-weight: 700; letter-spacing: -.04em; line-height: 1.06; color: var(--ink); }
.h2-w { color: var(--wh); }
.h3 { font-family: var(--fh); font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
.h4 { font-family: var(--fh); font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }

/* ── BODY TEXT ──────────────────────────────────────────────────── */
.lead   { font-size: 17px; line-height: 1.76; color: var(--mid); }
.lead-w { color: rgba(255,255,255,.55); }
.body   { font-size: 15px; line-height: 1.75; color: var(--mid); }
.sm     { font-size: 13px; line-height: 1.68; color: var(--mid); }

/* page hero sub-heading (used inside .pgh sections) */
.pg-s { font-size: 16px; line-height: 1.72; color: rgba(255,255,255,.85); max-width: 540px; }

/* ── SECTION HEADER ─────────────────────────────────────────────── */
.sh { margin-bottom: 64px; }
.sh .rule { margin-top: 24px; height: 1px; background: var(--bd); }
