/* =========================================================
   Shared section badge — Integrations pill style
   Used for section subheadings / kickers site-wide
   ========================================================= */

.nx-badge,
.nx-int__badge,
.nx-services-eyebrow,
.nx-portfolio__eyebrow,
.nx-why__eyebrow,
.nx-process__eyebrow,
.nx-proof__eyebrow,
.nx-cta__eyebrow,
.nx-contact-kicker,
.nx-price-kicker,
.bc-eyebrow,
.bc-label,
.service-eyebrow,
.work-hero-eyebrow,
.nx-res-kicker,
.nx-entity__eyebrow,
.nx-web-hero__eyebrow,
.nx-web-kicker,
.nx-app-kicker,
.nx-seo-hero__eyebrow,
.nx-seo-solutions__eyebrow,
.nx-seo-process__eyebrow,
.nx-seo-use-cases__eyebrow,
.nx-seo-why__eyebrow,
.nx-seo-faq__eyebrow,
.nx-seo-final-cta__eyebrow,
.nx-ai-hero__eyebrow,
.nx-ai-solutions__eyebrow,
.nx-ai-process__eyebrow,
.nx-ai-use-cases__eyebrow,
.nx-ai-why__eyebrow,
.nx-ai-faq__eyebrow,
.nx-ai-final-cta__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 1.15rem;
    padding: 0.38rem 0.8rem 0.38rem 0.58rem;
    border-radius: 999px;
    background: rgba(79, 124, 255, 0.12);
    border: 1px solid rgba(79, 124, 255, 0.28);
    color: #c5d2ff;
    font-family: var(--font-body, 'DM Sans', sans-serif);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    line-height: 1.2;
    box-sizing: border-box;
}

/* Blue dot — empty <i> or generated when no accent span */
.nx-badge > i,
.nx-int__badge > i,
.nx-contact-kicker > i,
.nx-price-kicker > i,
.nx-res-kicker > i {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0;
    border-radius: 50%;
    background: var(--nx-accent, #4f7cff);
    flex-shrink: 0;
    box-shadow: none;
}

.nx-services-eyebrow::before,
.nx-portfolio__eyebrow::before,
.nx-why__eyebrow::before,
.nx-process__eyebrow::before,
.nx-proof__eyebrow::before,
.nx-cta__eyebrow::before,
.bc-eyebrow::before,
.bc-label::before,
.service-eyebrow::before,
.work-hero-eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--nx-accent, #4f7cff);
    flex-shrink: 0;
}

/* Numbered service accents → blue dot */
.nx-web-hero__eyebrow > span:first-child,
.nx-web-kicker > span:first-child,
.nx-app-kicker > span:first-child,
.nx-seo-hero__eyebrow-accent,
.nx-seo-solutions__eyebrow-accent,
.nx-seo-process__eyebrow-accent,
.nx-seo-use-cases__eyebrow-accent,
.nx-seo-why__eyebrow-accent,
.nx-seo-faq__eyebrow-accent,
.nx-seo-final-cta__eyebrow-accent,
.nx-ai-hero__eyebrow-accent,
.nx-ai-solutions__eyebrow-accent,
.nx-ai-process__eyebrow-accent,
.nx-ai-use-cases__eyebrow-accent,
.nx-ai-why__eyebrow-accent,
.nx-ai-faq__eyebrow-accent,
.nx-ai-final-cta__eyebrow-accent {
    display: inline-block;
    width: 6px;
    height: 6px;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    background: var(--nx-accent, #4f7cff);
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0;
    overflow: hidden;
    flex-shrink: 0;
}

.nx-web-hero__eyebrow > span[aria-hidden="true"],
.nx-web-kicker > span[aria-hidden="true"],
.nx-app-kicker > span[aria-hidden="true"],
.nx-seo-hero__eyebrow > span[aria-hidden="true"],
.nx-seo-solutions__eyebrow > span[aria-hidden="true"],
.nx-seo-process__eyebrow > span[aria-hidden="true"],
.nx-seo-use-cases__eyebrow > span[aria-hidden="true"],
.nx-seo-why__eyebrow > span[aria-hidden="true"],
.nx-seo-faq__eyebrow > span[aria-hidden="true"],
.nx-seo-final-cta__eyebrow > span[aria-hidden="true"],
.nx-ai-hero__eyebrow > span[aria-hidden="true"],
.nx-ai-solutions__eyebrow > span[aria-hidden="true"],
.nx-ai-process__eyebrow > span[aria-hidden="true"],
.nx-ai-use-cases__eyebrow > span[aria-hidden="true"],
.nx-ai-why__eyebrow > span[aria-hidden="true"],
.nx-ai-faq__eyebrow > span[aria-hidden="true"],
.nx-ai-final-cta__eyebrow > span[aria-hidden="true"] {
    display: none;
}

/* App kickers use "02 / Label" text nodes — hide slash via letter-spacing already ok;
   the first span is the number converted to a dot above. */

/* Grid-placed homepage eyebrows keep placement */
.nx-services-eyebrow,
.nx-portfolio__eyebrow,
.nx-why__eyebrow,
.nx-process__eyebrow,
.nx-proof__eyebrow {
    justify-self: start;
}

/* Pricing / contact already have margin rules — keep compact under titles */
.nx-price-kicker,
.nx-contact-kicker {
    margin-bottom: 0.85rem;
}

.nx-price-hero__copy .nx-price-kicker {
    margin-bottom: 1rem;
}