/* ============================================================
   Icon Feature Grid — style.css
   Prefix: bblockx-ifg-
   ============================================================ */

.bblockx-ifg-wrap {
    box-sizing: border-box;
    width: 100%;
    background: var(--bblockx-ifg-bg, #ffffff);
    padding: var(--bblockx-ifg-pt, 64px) 0 var(--bblockx-ifg-pb, 64px);
}

/* ---- Section header ---- */
.bblockx-ifg-header {
    margin-bottom: var(--bblockx-ifg-sect-gap, 56px);
}

.bblockx-ifg-heading-align--center .bblockx-ifg-header {
    text-align: center;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

.bblockx-ifg-wrap .bblockx-ifg-heading,
.bblockx-ifg-wrap h2.bblockx-ifg-heading {
    margin: 0 0 14px;
    font-family: var(--bblockx-ifg-hd-font-family, inherit);
    font-size: var(--bblockx-ifg-hd-font-size-d, var(--bblockx-ifg-heading-sz, 36px));
    font-weight: var(--bblockx-ifg-hd-font-weight, var(--bblockx-ifg-heading-w, 800));
    font-style: var(--bblockx-ifg-hd-font-style, normal);
    text-decoration: var(--bblockx-ifg-hd-text-decoration, none);
    text-transform: var(--bblockx-ifg-hd-text-transform, none);
    color: var(--bblockx-ifg-heading-c, #0f172a);
    letter-spacing: var(--bblockx-ifg-hd-letter-spacing-d, -.03em);
    line-height: var(--bblockx-ifg-hd-line-height-d, var(--bblockx-ifg-heading-lh, 1.15));
    word-spacing: var(--bblockx-ifg-hd-word-spacing-d, normal);
}

.bblockx-ifg-wrap .bblockx-ifg-sub {
    margin: 0;
    font-family: var(--bblockx-ifg-sh-font-family, inherit);
    font-size: var(--bblockx-ifg-sh-font-size-d, var(--bblockx-ifg-sub-sz, 18px));
    font-weight: var(--bblockx-ifg-sh-font-weight, var(--bblockx-ifg-sub-w, 600));
    font-style: var(--bblockx-ifg-sh-font-style, normal);
    text-decoration: var(--bblockx-ifg-sh-text-decoration, none);
    text-transform: var(--bblockx-ifg-sh-text-transform, none);
    color: var(--bblockx-ifg-sub-c, #64748b);
    letter-spacing: var(--bblockx-ifg-sh-letter-spacing-d, normal);
    line-height: var(--bblockx-ifg-sh-line-height-d, var(--bblockx-ifg-sub-lh, 1.65));
    word-spacing: var(--bblockx-ifg-sh-word-spacing-d, normal);
}

/* ---- Grid ---- */
.bblockx-ifg-grid {
    display: grid;
    grid-template-columns: repeat(var(--bblockx-ifg-cols, 3), 1fr);
    gap: var(--bblockx-ifg-gap, 20px);
}

/* ---- Card ---- */
.bblockx-ifg-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: var(--bblockx-ifg-card-pad, 28px);
    border-radius: var(--bblockx-ifg-card-r, 14px);
    background: var(--bblockx-ifg-card-bg, #ffffff);
    transition: transform .18s, box-shadow .18s;
}

/* ---- Icon box ---- */
.bblockx-ifg-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: var(--bblockx-ifg-icon-box, 52px);
    height: var(--bblockx-ifg-icon-box, 52px);
    border-radius: var(--bblockx-ifg-icon-r, 50px);
    background: var(--bblockx-ifg-icon-bg, rgba(108,63,181,0.10));
}

/* plain: no background */
.bblockx-ifg-icon-style--plain .bblockx-ifg-icon-wrap {
    background: transparent;
    width: auto;
    height: auto;
    border-radius: 0;
}

/* square */
.bblockx-ifg-icon-style--square .bblockx-ifg-icon-wrap {
    border-radius: 12px;
}

/* outline */
.bblockx-ifg-icon-style--outline .bblockx-ifg-icon-wrap {
    background: transparent;
}

.bblockx-ifg-icon-wrap .dashicons {
    font-size: var(--bblockx-ifg-icon-sz, 24px);
    width: var(--bblockx-ifg-icon-sz, 24px);
    height: var(--bblockx-ifg-icon-sz, 24px);
}

/* ---- Feature title ---- */
.bblockx-ifg-card .bblockx-ifg-title,
.bblockx-ifg-card h3.bblockx-ifg-title {
    margin: 0;
    font-family: var(--bblockx-ifg-tt-font-family, inherit);
    font-size: var(--bblockx-ifg-tt-font-size-d, var(--bblockx-ifg-title-sz, 18px));
    font-weight: var(--bblockx-ifg-tt-font-weight, var(--bblockx-ifg-title-w, 700));
    font-style: var(--bblockx-ifg-tt-font-style, normal);
    text-decoration: var(--bblockx-ifg-tt-text-decoration, none);
    text-transform: var(--bblockx-ifg-tt-text-transform, none);
    color: var(--bblockx-ifg-title-c, #0f172a);
    letter-spacing: var(--bblockx-ifg-tt-letter-spacing-d, -.01em);
    line-height: var(--bblockx-ifg-tt-line-height-d, var(--bblockx-ifg-title-lh, 1.3));
    word-spacing: var(--bblockx-ifg-tt-word-spacing-d, normal);
}

/* ---- Description ---- */
.bblockx-ifg-card .bblockx-ifg-desc {
    margin: 0;
    font-family: var(--bblockx-ifg-ds-font-family, inherit);
    font-size: var(--bblockx-ifg-ds-font-size-d, var(--bblockx-ifg-desc-sz, 15px));
    font-weight: var(--bblockx-ifg-ds-font-weight, var(--bblockx-ifg-desc-w, 400));
    font-style: var(--bblockx-ifg-ds-font-style, normal);
    text-decoration: var(--bblockx-ifg-ds-text-decoration, none);
    text-transform: var(--bblockx-ifg-ds-text-transform, none);
    color: var(--bblockx-ifg-desc-c, #475569);
    letter-spacing: var(--bblockx-ifg-ds-letter-spacing-d, normal);
    line-height: var(--bblockx-ifg-ds-line-height-d, var(--bblockx-ifg-desc-lh, 1.7));
    word-spacing: var(--bblockx-ifg-ds-word-spacing-d, normal);
}

/* ============================================================
   Style Variants
   ============================================================ */

/* card */
.bblockx-ifg-style--card .bblockx-ifg-card {
    border: 1px solid rgba(108, 63, 181, 0.08);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 30px rgba(108, 63, 181, 0.08);
    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.28s ease, border-color 0.28s ease;
}
.bblockx-ifg-style--card .bblockx-ifg-card:hover {
    transform: translateY(-6px);
    border-color: rgba(108, 63, 181, 0.18);
    box-shadow: 0 16px 40px rgba(108, 63, 181, 0.15), 0 4px 10px rgba(15, 23, 42, 0.04);
}

/* bordered */
.bblockx-ifg-style--bordered .bblockx-ifg-card {
    border: 1px solid var(--bblockx-ifg-card-border, #e2e8f0);
}
.bblockx-ifg-style--bordered .bblockx-ifg-card:hover {
    border-color: var(--bblockx-ifg-global-accent, #6c3fb5);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 22px rgba(15, 23, 42, 0.07);
}

/* minimal */
.bblockx-ifg-style--minimal .bblockx-ifg-card {
    background: transparent;
    padding-left: 0;
    padding-right: 0;
    border-top: 2px solid var(--bblockx-ifg-card-border, #e2e8f0);
    border-radius: 0;
}

/* gradient */
.bblockx-ifg-style--gradient .bblockx-ifg-card {
    background: linear-gradient(140deg, color-mix(in srgb, var(--bblockx-ifg-global-accent, #6c3fb5) 6%, #ffffff), #ffffff);
    border: 1px solid color-mix(in srgb, var(--bblockx-ifg-global-accent, #6c3fb5) 12%, transparent);
}

/* dark */
.bblockx-ifg-style--dark { background: #0f172a; }
.bblockx-ifg-style--dark .bblockx-ifg-heading { color: #ffffff; }
.bblockx-ifg-style--dark .bblockx-ifg-sub { color: rgba(255,255,255,.5); }
.bblockx-ifg-style--dark .bblockx-ifg-card {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
}
.bblockx-ifg-style--dark .bblockx-ifg-title { color: rgba(255,255,255,.9); }
.bblockx-ifg-style--dark .bblockx-ifg-desc { color: rgba(255,255,255,.55); }
.bblockx-ifg-style--dark .bblockx-ifg-card:hover { background: rgba(255,255,255,.08); }

/* ---- Responsive typography ---- */
@media (max-width: 1024px) {
    .bblockx-ifg-wrap .bblockx-ifg-heading,
    .bblockx-ifg-wrap h2.bblockx-ifg-heading {
        font-size: var(--bblockx-ifg-hd-font-size-t, var(--bblockx-ifg-hd-font-size-d, var(--bblockx-ifg-heading-sz, 36px)));
        line-height: var(--bblockx-ifg-hd-line-height-t, var(--bblockx-ifg-hd-line-height-d, var(--bblockx-ifg-heading-lh, 1.15)));
        letter-spacing: var(--bblockx-ifg-hd-letter-spacing-t, var(--bblockx-ifg-hd-letter-spacing-d, -.03em));
        word-spacing: var(--bblockx-ifg-hd-word-spacing-t, var(--bblockx-ifg-hd-word-spacing-d, normal));
    }
    .bblockx-ifg-wrap .bblockx-ifg-sub {
        font-size: var(--bblockx-ifg-sh-font-size-t, var(--bblockx-ifg-sh-font-size-d, var(--bblockx-ifg-sub-sz, 18px)));
        line-height: var(--bblockx-ifg-sh-line-height-t, var(--bblockx-ifg-sh-line-height-d, var(--bblockx-ifg-sub-lh, 1.65)));
        letter-spacing: var(--bblockx-ifg-sh-letter-spacing-t, var(--bblockx-ifg-sh-letter-spacing-d, normal));
        word-spacing: var(--bblockx-ifg-sh-word-spacing-t, var(--bblockx-ifg-sh-word-spacing-d, normal));
    }
    .bblockx-ifg-card .bblockx-ifg-title,
    .bblockx-ifg-card h3.bblockx-ifg-title {
        font-size: var(--bblockx-ifg-tt-font-size-t, var(--bblockx-ifg-tt-font-size-d, var(--bblockx-ifg-title-sz, 18px)));
        line-height: var(--bblockx-ifg-tt-line-height-t, var(--bblockx-ifg-tt-line-height-d, var(--bblockx-ifg-title-lh, 1.3)));
        letter-spacing: var(--bblockx-ifg-tt-letter-spacing-t, var(--bblockx-ifg-tt-letter-spacing-d, -.01em));
        word-spacing: var(--bblockx-ifg-tt-word-spacing-t, var(--bblockx-ifg-tt-word-spacing-d, normal));
    }
    .bblockx-ifg-card .bblockx-ifg-desc {
        font-size: var(--bblockx-ifg-ds-font-size-t, var(--bblockx-ifg-ds-font-size-d, var(--bblockx-ifg-desc-sz, 15px)));
        line-height: var(--bblockx-ifg-ds-line-height-t, var(--bblockx-ifg-ds-line-height-d, var(--bblockx-ifg-desc-lh, 1.7)));
        letter-spacing: var(--bblockx-ifg-ds-letter-spacing-t, var(--bblockx-ifg-ds-letter-spacing-d, normal));
        word-spacing: var(--bblockx-ifg-ds-word-spacing-t, var(--bblockx-ifg-ds-word-spacing-d, normal));
    }
}
@media (max-width: 767px) {
    .bblockx-ifg-wrap .bblockx-ifg-heading,
    .bblockx-ifg-wrap h2.bblockx-ifg-heading {
        font-size: var(--bblockx-ifg-hd-font-size-m, var(--bblockx-ifg-hd-font-size-t, var(--bblockx-ifg-hd-font-size-d, var(--bblockx-ifg-heading-sz, 36px))));
        line-height: var(--bblockx-ifg-hd-line-height-m, var(--bblockx-ifg-hd-line-height-t, var(--bblockx-ifg-hd-line-height-d, var(--bblockx-ifg-heading-lh, 1.15))));
        letter-spacing: var(--bblockx-ifg-hd-letter-spacing-m, var(--bblockx-ifg-hd-letter-spacing-t, var(--bblockx-ifg-hd-letter-spacing-d, -.03em)));
        word-spacing: var(--bblockx-ifg-hd-word-spacing-m, var(--bblockx-ifg-hd-word-spacing-t, var(--bblockx-ifg-hd-word-spacing-d, normal)));
    }
    .bblockx-ifg-wrap .bblockx-ifg-sub {
        font-size: var(--bblockx-ifg-sh-font-size-m, var(--bblockx-ifg-sh-font-size-t, var(--bblockx-ifg-sh-font-size-d, var(--bblockx-ifg-sub-sz, 18px))));
        line-height: var(--bblockx-ifg-sh-line-height-m, var(--bblockx-ifg-sh-line-height-t, var(--bblockx-ifg-sh-line-height-d, var(--bblockx-ifg-sub-lh, 1.65))));
        letter-spacing: var(--bblockx-ifg-sh-letter-spacing-m, var(--bblockx-ifg-sh-letter-spacing-t, var(--bblockx-ifg-sh-letter-spacing-d, normal)));
        word-spacing: var(--bblockx-ifg-sh-word-spacing-m, var(--bblockx-ifg-sh-word-spacing-t, var(--bblockx-ifg-sh-word-spacing-d, normal)));
    }
    .bblockx-ifg-card .bblockx-ifg-title,
    .bblockx-ifg-card h3.bblockx-ifg-title {
        font-size: var(--bblockx-ifg-tt-font-size-m, var(--bblockx-ifg-tt-font-size-t, var(--bblockx-ifg-tt-font-size-d, var(--bblockx-ifg-title-sz, 18px))));
        line-height: var(--bblockx-ifg-tt-line-height-m, var(--bblockx-ifg-tt-line-height-t, var(--bblockx-ifg-tt-line-height-d, var(--bblockx-ifg-title-lh, 1.3))));
        letter-spacing: var(--bblockx-ifg-tt-letter-spacing-m, var(--bblockx-ifg-tt-letter-spacing-t, var(--bblockx-ifg-tt-letter-spacing-d, -.01em)));
        word-spacing: var(--bblockx-ifg-tt-word-spacing-m, var(--bblockx-ifg-tt-word-spacing-t, var(--bblockx-ifg-tt-word-spacing-d, normal)));
    }
    .bblockx-ifg-card .bblockx-ifg-desc {
        font-size: var(--bblockx-ifg-ds-font-size-m, var(--bblockx-ifg-ds-font-size-t, var(--bblockx-ifg-ds-font-size-d, var(--bblockx-ifg-desc-sz, 15px))));
        line-height: var(--bblockx-ifg-ds-line-height-m, var(--bblockx-ifg-ds-line-height-t, var(--bblockx-ifg-ds-line-height-d, var(--bblockx-ifg-desc-lh, 1.7))));
        letter-spacing: var(--bblockx-ifg-ds-letter-spacing-m, var(--bblockx-ifg-ds-letter-spacing-t, var(--bblockx-ifg-ds-letter-spacing-d, normal)));
        word-spacing: var(--bblockx-ifg-ds-word-spacing-m, var(--bblockx-ifg-ds-word-spacing-t, var(--bblockx-ifg-ds-word-spacing-d, normal)));
    }
}

/* Responsive */
@media (max-width: 900px) {
    .bblockx-ifg-grid { grid-template-columns: repeat(min(var(--bblockx-ifg-cols, 3), 2), 1fr); }
}
@media (max-width: 560px) {
    .bblockx-ifg-grid { grid-template-columns: 1fr; }
}