/* ================================================================
   EffiQ Theme — Buttons
   All button variants, link-buttons, and pill label helpers.
   Loaded on every page (buttons appear in nav and footer).
================================================================ */

/* ── BUTTON BASE ────────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; gap: 8px; font-family: var(--fh); font-weight: 700; border-radius: 10px; transition: all .22s; cursor: pointer; border: none; }

/* ── BUTTON VARIANTS ────────────────────────────────────────────── */
.btn-nv    { font-size: 15px; padding: 14px 28px; background: var(--nv); color: var(--wh); }
.btn-nv:hover    { background: #122d4a; transform: translateY(-2px); box-shadow: 0 10px 28px rgba(11,24,41,.2); }

.btn-grad  { font-size: 15px; padding: 14px 28px; background: var(--grad-bl-pur); color: var(--wh); }
.btn-grad:hover  { filter: brightness(1.1); transform: translateY(-2px); box-shadow: 0 10px 28px rgba(26,115,232,.35); }

.btn-gh    { font-size: 15px; padding: 13px 27px; background: transparent; color: var(--wh); border: 1.5px solid rgba(255,255,255,.25); }
.btn-gh:hover    { border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.06); }

.btn-gh-dk { font-size: 15px; padding: 13px 27px; background: transparent; color: var(--ink); border: 1.5px solid var(--bd); }
.btn-gh-dk:hover { border-color: var(--ink); }

.btn-wh    { font-size: 15px; padding: 14px 28px; background: var(--wh); color: var(--nv); }
.btn-wh:hover    { box-shadow: 0 10px 28px rgba(0,0,0,.15); transform: translateY(-2px); }

/* ── LINK BUTTON ────────────────────────────────────────────────── */
.lnkbtn   { font-family: var(--fh); font-size: 14px; font-weight: 700; color: var(--bl); display: inline-flex; align-items: center; gap: 6px; transition: gap .2s; }
.lnkbtn:hover   { gap: 11px; }
.lnkbtn-w { color: rgba(255,255,255,.65); }
.lnkbtn-w:hover { color: #fff; gap: 11px; }

/* ── PILL / EYEBROW BADGE ───────────────────────────────────────── */
.pill     { display: inline-flex; align-items: center; gap: 8px; background: var(--bls); border: 1px solid var(--blb); padding: 5px 14px 5px 9px; border-radius: 100px; margin-bottom: 38px; }
.pill-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bl); animation: pulseDot 2s infinite; }
.pill-txt { font-family: var(--fh); font-size: 12px; font-weight: 600; color: var(--bl); }

/* ── CTA ACTIONS ROW ────────────────────────────────────────────── */
.cta-acts { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }