/* ─── Mixed Heading ─── */
.bkbg-mhd-outer {
    display: block;
}

.bkbg-mhd-heading {
    word-break: break-word;
    margin: 0 auto;
    padding: 0;
}

/* ── Typography (CSS-var driven, heading specificity for h1-h6) ── */

.bkbg-mhd-outer .bkbg-mhd-heading {
    font-family: var(--bkbg-mhd-hd-font-family, inherit);
    font-size: var(--bkbg-mhd-hd-font-size-d, 48px);
    font-weight: var(--bkbg-mhd-hd-font-weight, normal);
    line-height: var(--bkbg-mhd-hd-line-height-d, 1.15);
    font-style: var(--bkbg-mhd-hd-font-style, normal);
    text-decoration: var(--bkbg-mhd-hd-text-decoration, none);
    text-transform: var(--bkbg-mhd-hd-text-transform, none);
    letter-spacing: var(--bkbg-mhd-hd-letter-spacing-d, normal);
}

/* Segment base — display inline by default, overridden per style */
.bkbg-mhd-seg {
    display: inline;
}

/* Gradient segment */
.bkbg-mhd-seg.style-gradient {
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* Highlight segment */
.bkbg-mhd-seg.style-highlight {
    border-radius: 4px;
    padding: 0 4px;
    display: inline;
}

/* Stroke / outlined segment */
.bkbg-mhd-seg.style-stroke {
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* Badge / pill segment */
.bkbg-mhd-seg.style-badge {
    display: inline-block;
    vertical-align: middle;
}

/* Monospace / code segment */
.bkbg-mhd-seg.style-mono {
    font-family: 'Courier New', Courier, monospace;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.88em;
}

/* Ghost segment */
.bkbg-mhd-seg.style-ghost {
    opacity: 0.35;
}

/* ── Typography responsive ── */

@media (max-width: 1024px) {
    .bkbg-mhd-outer .bkbg-mhd-heading {
        font-size: var(--bkbg-mhd-hd-font-size-t, var(--bkbg-mhd-hd-font-size-d, 48px));
        line-height: var(--bkbg-mhd-hd-line-height-t, var(--bkbg-mhd-hd-line-height-d, 1.15));
            letter-spacing: var(--bkbg-mhd-hd-letter-spacing-t, var(--bkbg-mhd-hd-letter-spacing-d, normal));
    }
}

@media (max-width: 767px) {
    .bkbg-mhd-outer .bkbg-mhd-heading {
        font-size: var(--bkbg-mhd-hd-font-size-m, var(--bkbg-mhd-hd-font-size-t, var(--bkbg-mhd-hd-font-size-d, 36px)));
        line-height: var(--bkbg-mhd-hd-line-height-m, var(--bkbg-mhd-hd-line-height-t, var(--bkbg-mhd-hd-line-height-d, 1.15)));
            letter-spacing: var(--bkbg-mhd-hd-letter-spacing-m, var(--bkbg-mhd-hd-letter-spacing-t, var(--bkbg-mhd-hd-letter-spacing-d, normal)));
    }
}