/* ============================================================
   BUSTA UNIFIED TYPOGRAPHY SYSTEM (v1.8.1)
   Modelled on the #campaigns section, applied site-wide.
   Loaded by every marketing page via <link href="/static/style.css">.
   ============================================================ */

/* Eyebrow pill — small caps tag above section headings (dark bg variant) */
.busta-eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.875rem;
    margin-bottom: 1rem;
    border-radius: 9999px;
    background-color: rgba(220, 249, 61, 0.15);
    border: 1px solid rgba(220, 249, 61, 0.3);
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #dcf93d;
    font-weight: 500;
    letter-spacing: 0.01em;
}
.busta-eyebrow-light {
    background-color: rgba(220, 249, 61, 0.2);
    border-color: rgba(26, 26, 26, 0.08);
    color: #1a1a1a;
}
.busta-eyebrow i { margin-right: 0.5rem; }

/* Section headings — tracking-tight, balanced wrap, optical line-height */
.busta-h1 {
    font-size: clamp(2.75rem, 5vw + 1rem, 4.5rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.05;
    margin-bottom: 1.5rem;
    text-wrap: balance;
}
.busta-h2 {
    font-size: clamp(2.25rem, 3vw + 1rem, 3rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin-bottom: 1.5rem;
    text-wrap: balance;
}
.busta-h3 {
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
    margin-bottom: 0.5rem;
}
.busta-h3-lg {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
    margin-bottom: 0.75rem;
}

/* Lead body copy — large, generous line-height, soft color */
.busta-lead {
    font-size: 1.25rem;
    line-height: 1.7;
    color: #6b7280;
    font-weight: 400;
    text-wrap: pretty;
}
.busta-lead-dark { color: #9ca3af; }

/* Card body — small, leading-relaxed, soft */
.busta-body {
    font-size: 0.9375rem;
    line-height: 1.65;
    color: #6b7280;
    text-wrap: pretty;
}
.busta-body-dark { color: #9ca3af; }
.busta-body-sm {
    font-size: 0.875rem;
    line-height: 1.6;
    color: #6b7280;
    text-wrap: pretty;
}

/* Section spacing rhythm */
.busta-section { padding-top: 6rem; padding-bottom: 6rem; }
.busta-section-header { text-align: center; max-width: 48rem; margin-left: auto; margin-right: auto; margin-bottom: 4rem; }

/* Mobile typography */
@media (max-width: 640px) {
    .busta-section { padding-top: 4rem; padding-bottom: 4rem; }
    .busta-section-header { margin-bottom: 2.5rem; }
    .busta-lead { font-size: 1.0625rem; line-height: 1.65; }
    .busta-h1 { line-height: 1.1; }
}

/* Smooth font rendering everywhere */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Legacy h1 fallback (used by /app and admin where Tailwind config differs) */
h1.legacy-h1 { font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', Inter, system-ui, sans-serif; }