:root {
    /* --- Astra-Style Design Tokens --- */
    --cgb-bg-app: #f9f9f9;
    --cgb-bg-inspector: #ffffff;
    --cgb-bg-card: #ffffff;

    --cgb-text-main: #3c434a;
    --cgb-text-muted: #646970;
    --cgb-text-hint: #8c8f94;

    /* Astra Purple */
    --cgb-primary: #5e17eb;
    --cgb-primary-dark: #4a11b8;
    --cgb-primary-soft: #edecfb;

    --cgb-border-subtle: #e2e4e7;
    --cgb-border-strong: #dcdcde;

    /* Subtler Shadows */
    --cgb-shadow-card: 0 2px 4px rgba(0, 0, 0, 0.06);
    --cgb-shadow-hover: 0 4px 10px rgba(0, 0, 0, 0.1);

    /* Squarer UI */
    --cgb-radius-card: 4px;
    --cgb-radius-input: 3px;
    --cgb-radius-pill: 4px;
}/* Container */
.ccb-app-features {
    --ccb-af-bg: var(--ccb-af-bg-desktop, #f9fafb);
    --ccb-af-pt: var(--ccb-af-pt-desktop, 80px);

    --ccb-af-pb: var(--ccb-af-pb-desktop, 80px);
        --ccb-af-head-color: var(--ccb-af-head-color-desktop, #111827);
    --ccb-af-feat-title: var(--ccb-af-feat-title-desktop, #111827);
    --ccb-af-feat-desc: var(--ccb-af-feat-desc-desktop, #4b5563);
    --ccb-af-icon-color: var(--ccb-af-icon-color-desktop, #3b82f6);
    --ccb-af-icon-size: var(--ccb-af-icon-size-desktop, 32px);
    --ccb-af-item-align: var(--ccb-af-item-align-desktop, flex-start);
    --ccb-af-icon-offset-y: var(--ccb-af-icon-offset-y-desktop, 0px);
    --ccb-af-fs-title: var(--ccb-af-fs-title-desktop, 18px);
    --ccb-af-fs-desc: var(--ccb-af-fs-desc-desktop, 15px);
    --ccb-af-col-gap: var(--ccb-af-col-gap-desktop, 40px);
    --ccb-af-item-spacing: var(--ccb-af-item-spacing-desktop, 40px);
    --ccb-af-left-pl: var(--ccb-af-left-pl-desktop, 0px);
    --ccb-af-right-pl: var(--ccb-af-right-pl-desktop, 0px);
    --ccb-af-title-list-gap: var(--ccb-af-title-list-gap-desktop, 6px);
    --ccb-af-image-max: var(--ccb-af-image-max-desktop, 500px);
    --ccb-af-container-max: var(--ccb-af-container-max-desktop, 1280px);
    --ccb-af-col-va-left: var(--ccb-af-col-va-left-desktop, center);
    --ccb-af-col-va-center: var(--ccb-af-col-va-center-desktop, center);
    --ccb-af-col-va-right: var(--ccb-af-col-va-right-desktop, center);
    --ccb-af-text-align: var(--ccb-af-text-align-desktop, center);
    background-color: var(--ccb-af-bg, #f9fafb);
    padding-top: var(--ccb-af-pt, 80px);
    padding-bottom: var(--ccb-af-pb, 80px);
    width: 100%;
}

/* Shared RichText format: Highlight */
.cgb-highlight {
    color: var(--cgb-primary);
    background: var(--cgb-primary-soft, transparent);
    padding: 0 0.18em;
    border-radius: 0.2em;
}

/* Leadership Team */
.ccb-leadership-team{--ccb-lt-maxw:var(--ccb-lt-maxw-desktop,1200px);--ccb-lt-pt:var(--ccb-lt-pt-desktop,60px);--ccb-lt-pb:var(--ccb-lt-pb-desktop,60px);--ccb-lt-mt:var(--ccb-lt-mt-desktop,0px);--ccb-lt-mb:var(--ccb-lt-mb-desktop,0px);--ccb-lt-cols:var(--ccb-lt-cols-desktop,3);--ccb-lt-gap:var(--ccb-lt-gap-desktop,60px);--ccb-lt-photo:var(--ccb-lt-photo-desktop,96px);--ccb-lt-item-gap:var(--ccb-lt-item-gap-desktop,20px);--ccb-lt-heading-fs:var(--ccb-lt-heading-fs-desktop,inherit);--ccb-lt-heading-fw:var(--ccb-lt-heading-fw-desktop,inherit);--ccb-lt-heading-color:var(--ccb-lt-heading-color-desktop,inherit);--ccb-lt-name-color:var(--ccb-lt-name-color-desktop,inherit);--ccb-lt-role-color:var(--ccb-lt-role-color-desktop,inherit);--ccb-lt-title-color:var(--ccb-lt-title-color-desktop,inherit);--ccb-lt-link-color:var(--ccb-lt-link-color-desktop,inherit);margin-top:var(--ccb-lt-mt);margin-bottom:var(--ccb-lt-mb);padding-top:var(--ccb-lt-pt);padding-bottom:var(--ccb-lt-pb);background-color:var(--ccb-lt-bg,transparent);width:100%}
@media (max-width:1024px){.ccb-leadership-team{--ccb-lt-maxw:var(--ccb-lt-maxw-tablet,var(--ccb-lt-maxw-desktop,1200px));--ccb-lt-pt:var(--ccb-lt-pt-tablet,var(--ccb-lt-pt-desktop,60px));--ccb-lt-pb:var(--ccb-lt-pb-tablet,var(--ccb-lt-pb-desktop,60px));--ccb-lt-mt:var(--ccb-lt-mt-tablet,var(--ccb-lt-mt-desktop,0px));--ccb-lt-mb:var(--ccb-lt-mb-tablet,var(--ccb-lt-mb-desktop,0px));--ccb-lt-cols:var(--ccb-lt-cols-tablet,var(--ccb-lt-cols-desktop,3));--ccb-lt-gap:var(--ccb-lt-gap-tablet,var(--ccb-lt-gap-desktop,60px));--ccb-lt-photo:var(--ccb-lt-photo-tablet,var(--ccb-lt-photo-desktop,96px));--ccb-lt-item-gap:var(--ccb-lt-item-gap-tablet,var(--ccb-lt-item-gap-desktop,20px));--ccb-lt-heading-fs:var(--ccb-lt-heading-fs-tablet,var(--ccb-lt-heading-fs-desktop,inherit));--ccb-lt-heading-fw:var(--ccb-lt-heading-fw-tablet,var(--ccb-lt-heading-fw-desktop,inherit));--ccb-lt-heading-color:var(--ccb-lt-heading-color-tablet,var(--ccb-lt-heading-color-desktop,inherit));--ccb-lt-name-color:var(--ccb-lt-name-color-tablet,var(--ccb-lt-name-color-desktop,inherit));--ccb-lt-role-color:var(--ccb-lt-role-color-tablet,var(--ccb-lt-role-color-desktop,inherit));--ccb-lt-title-color:var(--ccb-lt-title-color-tablet,var(--ccb-lt-title-color-desktop,inherit));--ccb-lt-link-color:var(--ccb-lt-link-color-tablet,var(--ccb-lt-link-color-desktop,inherit))}}
@media (max-width:768px){.ccb-leadership-team{--ccb-lt-maxw:var(--ccb-lt-maxw-mobile,var(--ccb-lt-maxw-tablet,var(--ccb-lt-maxw-desktop,1200px)));--ccb-lt-pt:var(--ccb-lt-pt-mobile,var(--ccb-lt-pt-tablet,var(--ccb-lt-pt-desktop,60px)));--ccb-lt-pb:var(--ccb-lt-pb-mobile,var(--ccb-lt-pb-tablet,var(--ccb-lt-pb-desktop,60px)));--ccb-lt-mt:var(--ccb-lt-mt-mobile,var(--ccb-lt-mt-tablet,var(--ccb-lt-mt-desktop,0px)));--ccb-lt-mb:var(--ccb-lt-mb-mobile,var(--ccb-lt-mb-tablet,var(--ccb-lt-mb-desktop,0px)));--ccb-lt-cols:var(--ccb-lt-cols-mobile,var(--ccb-lt-cols-tablet,var(--ccb-lt-cols-desktop,3)));--ccb-lt-gap:var(--ccb-lt-gap-mobile,var(--ccb-lt-gap-tablet,var(--ccb-lt-gap-desktop,60px)));--ccb-lt-photo:var(--ccb-lt-photo-mobile,var(--ccb-lt-photo-tablet,var(--ccb-lt-photo-desktop,96px)));--ccb-lt-item-gap:var(--ccb-lt-item-gap-mobile,var(--ccb-lt-item-gap-tablet,var(--ccb-lt-item-gap-desktop,20px)));--ccb-lt-heading-fs:var(--ccb-lt-heading-fs-mobile,var(--ccb-lt-heading-fs-tablet,var(--ccb-lt-heading-fs-desktop,inherit)));--ccb-lt-heading-fw:var(--ccb-lt-heading-fw-mobile,var(--ccb-lt-heading-fw-tablet,var(--ccb-lt-heading-fw-desktop,inherit)));--ccb-lt-heading-color:var(--ccb-lt-heading-color-mobile,var(--ccb-lt-heading-color-tablet,var(--ccb-lt-heading-color-desktop,inherit)));--ccb-lt-name-color:var(--ccb-lt-name-color-mobile,var(--ccb-lt-name-color-tablet,var(--ccb-lt-name-color-desktop,inherit)));--ccb-lt-role-color:var(--ccb-lt-role-color-mobile,var(--ccb-lt-role-color-tablet,var(--ccb-lt-role-color-desktop,inherit)));--ccb-lt-title-color:var(--ccb-lt-title-color-mobile,var(--ccb-lt-title-color-tablet,var(--ccb-lt-title-color-desktop,inherit)));--ccb-lt-link-color:var(--ccb-lt-link-color-mobile,var(--ccb-lt-link-color-tablet,var(--ccb-lt-link-color-desktop,inherit)))}}
.ccb-leadership-team.cgb--fullwidth{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.ccb-leadership-team .cgb-inner{max-width:var(--ccb-lt-maxw);margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
.ccb-lt__title{text-align:center;margin:0 0 50px 0;color:var(--ccb-lt-heading-color);font-size:var(--ccb-lt-heading-fs);font-weight:var(--ccb-lt-heading-fw)}
.ccb-lt__grid{display:flex;flex-wrap:wrap;gap:var(--ccb-lt-gap);align-items:flex-start;justify-content:center}
.ccb-lt__grid>.ccb-lt__card{flex:0 0 calc((100% - ((var(--ccb-lt-cols) - 1) * var(--ccb-lt-gap))) / var(--ccb-lt-cols))}
@media (max-width:768px){.ccb-lt__title{margin-bottom:30px}}
.ccb-lt__card{display:flex;align-items:center;gap:var(--ccb-lt-item-gap);min-width:0}
.ccb-lt__photoWrap{flex:0 0 auto}
.ccb-lt__photo{width:var(--ccb-lt-photo);height:var(--ccb-lt-photo);border-radius:999px;object-fit:cover;display:block}
.ccb-lt__photoPlaceholder{width:var(--ccb-lt-photo);height:var(--ccb-lt-photo);border-radius:999px;background:rgba(0,0,0,0.06)}
.ccb-lt__text{min-width:0}
.ccb-lt__name{margin:0;font-weight:700;line-height:1.2;color:var(--ccb-lt-name-color)}
.ccb-lt__role{margin:6px 0 0 0;font-weight:600;color:var(--ccb-lt-role-color)}
.ccb-lt__titleLine{margin:6px 0 0 0;color:var(--ccb-lt-title-color)}
.ccb-lt__link{display:inline-block;margin-top:8px;color:var(--ccb-lt-link-color);text-decoration:none}
.ccb-lt__link:hover{text-decoration:underline}
.editor-styles-wrapper .ccb-lt__photoBtn{padding:0;border:0;background:none;cursor:pointer;line-height:0}
.editor-styles-wrapper .ccb-lt__photoBtn:focus{outline:2px solid currentColor;outline-offset:2px}

.ccb-app-features__device {
    display: none;
}

.ccb-app-features__device[data-device="desktop"] {
    display: block;
}

.ccb-app-features[data-preview-device="tablet"] .ccb-app-features__device,
.ccb-app-features[data-preview-device="mobile"] .ccb-app-features__device {
    display: none;
}

.ccb-app-features[data-preview-device="tablet"] .ccb-app-features__device[data-device="tablet"],
.ccb-app-features[data-preview-device="mobile"] .ccb-app-features__device[data-device="mobile"] {
    display: block;
}

.ccb-app-features[data-preview-device="tablet"] {
    --ccb-af-bg: var(--ccb-af-bg-tablet, var(--ccb-af-bg-desktop, #f9fafb));
    --ccb-af-pt: var(--ccb-af-pt-tablet, var(--ccb-af-pt-desktop, 80px));
    --ccb-af-pb: var(--ccb-af-pb-tablet, var(--ccb-af-pb-desktop, 80px));
    --ccb-af-head-color: var(--ccb-af-head-color-tablet, var(--ccb-af-head-color-desktop, #111827));
    --ccb-af-sub-color: var(--ccb-af-sub-color-tablet, var(--ccb-af-sub-color-desktop, #3b82f6));
    --ccb-af-feat-title: var(--ccb-af-feat-title-tablet, var(--ccb-af-feat-title-desktop, #111827));
    --ccb-af-feat-desc: var(--ccb-af-feat-desc-tablet, var(--ccb-af-feat-desc-desktop, #4b5563));
    --ccb-af-icon-color: var(--ccb-af-icon-color-tablet, var(--ccb-af-icon-color-desktop, #3b82f6));
    --ccb-af-icon-size: var(--ccb-af-icon-size-tablet, var(--ccb-af-icon-size-desktop, 32px));
    --ccb-af-item-align: var(--ccb-af-item-align-tablet, var(--ccb-af-item-align-desktop, flex-start));
    --ccb-af-icon-offset-y: var(--ccb-af-icon-offset-y-tablet, var(--ccb-af-icon-offset-y-desktop, 0px));
    --ccb-af-fs-title: var(--ccb-af-fs-title-tablet, var(--ccb-af-fs-title-desktop, 18px));
    --ccb-af-fs-desc: var(--ccb-af-fs-desc-tablet, var(--ccb-af-fs-desc-desktop, 15px));
    --ccb-af-col-gap: var(--ccb-af-col-gap-tablet, var(--ccb-af-col-gap-desktop, 40px));
    --ccb-af-item-spacing: var(--ccb-af-item-spacing-tablet, var(--ccb-af-item-spacing-desktop, 40px));
    --ccb-af-left-pl: var(--ccb-af-left-pl-tablet, var(--ccb-af-left-pl-desktop, 0px));
    --ccb-af-right-pl: var(--ccb-af-right-pl-tablet, var(--ccb-af-right-pl-desktop, 0px));
    --ccb-af-title-list-gap: var(--ccb-af-title-list-gap-tablet, var(--ccb-af-title-list-gap-desktop, 6px));
    --ccb-af-image-max: var(--ccb-af-image-max-tablet, var(--ccb-af-image-max-desktop, 500px));
    --ccb-af-container-max: var(--ccb-af-container-max-tablet, var(--ccb-af-container-max-desktop, 1280px));
    --ccb-af-col-va-left: var(--ccb-af-col-va-left-tablet, var(--ccb-af-col-va-left-desktop, center));
    --ccb-af-col-va-center: var(--ccb-af-col-va-center-tablet, var(--ccb-af-col-va-center-desktop, center));
    --ccb-af-col-va-right: var(--ccb-af-col-va-right-tablet, var(--ccb-af-col-va-right-desktop, center));
    --ccb-af-text-align: var(--ccb-af-text-align-tablet, var(--ccb-af-text-align-desktop, center));
}

.ccb-app-features[data-preview-device="mobile"] {
    --ccb-af-bg: var(--ccb-af-bg-mobile, var(--ccb-af-bg-tablet, var(--ccb-af-bg-desktop, #f9fafb)));
    --ccb-af-pt: var(--ccb-af-pt-mobile, var(--ccb-af-pt-tablet, var(--ccb-af-pt-desktop, 80px)));
    --ccb-af-pb: var(--ccb-af-pb-mobile, var(--ccb-af-pb-tablet, var(--ccb-af-pb-desktop, 80px)));
    --ccb-af-head-color: var(--ccb-af-head-color-mobile, var(--ccb-af-head-color-tablet, var(--ccb-af-head-color-desktop, #111827)));
    --ccb-af-sub-color: var(--ccb-af-sub-color-mobile, var(--ccb-af-sub-color-tablet, var(--ccb-af-sub-color-desktop, #3b82f6)));
    --ccb-af-feat-title: var(--ccb-af-feat-title-mobile, var(--ccb-af-feat-title-tablet, var(--ccb-af-feat-title-desktop, #111827)));
    --ccb-af-feat-desc: var(--ccb-af-feat-desc-mobile, var(--ccb-af-feat-desc-tablet, var(--ccb-af-feat-desc-desktop, #4b5563)));
    --ccb-af-icon-color: var(--ccb-af-icon-color-mobile, var(--ccb-af-icon-color-tablet, var(--ccb-af-icon-color-desktop, #3b82f6)));
    --ccb-af-icon-size: var(--ccb-af-icon-size-mobile, var(--ccb-af-icon-size-tablet, var(--ccb-af-icon-size-desktop, 32px)));
    --ccb-af-item-align: var(--ccb-af-item-align-mobile, var(--ccb-af-item-align-tablet, var(--ccb-af-item-align-desktop, flex-start)));
    --ccb-af-icon-offset-y: var(--ccb-af-icon-offset-y-mobile, var(--ccb-af-icon-offset-y-tablet, var(--ccb-af-icon-offset-y-desktop, 0px)));
    --ccb-af-fs-title: var(--ccb-af-fs-title-mobile, var(--ccb-af-fs-title-tablet, var(--ccb-af-fs-title-desktop, 18px)));
    --ccb-af-fs-desc: var(--ccb-af-fs-desc-mobile, var(--ccb-af-fs-desc-tablet, var(--ccb-af-fs-desc-desktop, 15px)));
    --ccb-af-col-gap: var(--ccb-af-col-gap-mobile, var(--ccb-af-col-gap-tablet, var(--ccb-af-col-gap-desktop, 40px)));
    --ccb-af-item-spacing: var(--ccb-af-item-spacing-mobile, var(--ccb-af-item-spacing-tablet, var(--ccb-af-item-spacing-desktop, 40px)));
    --ccb-af-left-pl: var(--ccb-af-left-pl-mobile, var(--ccb-af-left-pl-tablet, var(--ccb-af-left-pl-desktop, 0px)));
    --ccb-af-right-pl: var(--ccb-af-right-pl-mobile, var(--ccb-af-right-pl-tablet, var(--ccb-af-right-pl-desktop, 0px)));
    --ccb-af-title-list-gap: var(--ccb-af-title-list-gap-mobile, var(--ccb-af-title-list-gap-tablet, var(--ccb-af-title-list-gap-desktop, 6px)));
    --ccb-af-image-max: var(--ccb-af-image-max-mobile, var(--ccb-af-image-max-tablet, var(--ccb-af-image-max-desktop, 500px)));
    --ccb-af-container-max: var(--ccb-af-container-max-mobile, var(--ccb-af-container-max-tablet, var(--ccb-af-container-max-desktop, 1280px)));
    --ccb-af-col-va-left: var(--ccb-af-col-va-left-mobile, var(--ccb-af-col-va-left-tablet, var(--ccb-af-col-va-left-desktop, center)));
    --ccb-af-col-va-center: var(--ccb-af-col-va-center-mobile, var(--ccb-af-col-va-center-tablet, var(--ccb-af-col-va-center-desktop, center)));
    --ccb-af-col-va-right: var(--ccb-af-col-va-right-mobile, var(--ccb-af-col-va-right-tablet, var(--ccb-af-col-va-right-desktop, center)));
    --ccb-af-text-align: var(--ccb-af-text-align-mobile, var(--ccb-af-text-align-tablet, var(--ccb-af-text-align-desktop, center)));
}

.ccb-app-features__container {
    max-width: var(--ccb-af-container-max, 1280px);
    margin: 0 auto;
    padding: 0 24px;
}

/* === Generic Layout Blocks (Builder Layer) === */

/* Section (Layout) */
.ccb-section{position:relative;width:100%}
.ccb-section__overlay{position:absolute;inset:0;pointer-events:none}
.ccb-section__container{position:relative;width:100%;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px;box-sizing:border-box}
.ccb-section__container--full{max-width:none!important}

/* Stack (Layout) */
.ccb-stack{--ccb-stack-direction:var(--ccb-stack-direction-desktop,column);--ccb-stack-gap:var(--ccb-stack-gap-desktop,24px);--ccb-stack-pt:var(--ccb-stack-pt-desktop,0px);--ccb-stack-pb:var(--ccb-stack-pb-desktop,0px);--ccb-stack-px:var(--ccb-stack-px-desktop,0px);--ccb-stack-mt:var(--ccb-stack-mt-desktop,0px);--ccb-stack-mb:var(--ccb-stack-mb-desktop,0px);display:flex;flex-direction:var(--ccb-stack-direction);gap:var(--ccb-stack-gap);align-items:var(--ccb-stack-align-items,stretch);justify-content:var(--ccb-stack-justify-content,flex-start);flex-wrap:var(--ccb-stack-flex-wrap,nowrap);background-color:var(--ccb-stack-bg,transparent);padding-top:var(--ccb-stack-pt);padding-bottom:var(--ccb-stack-pb);padding-left:var(--ccb-stack-px);padding-right:var(--ccb-stack-px);margin-top:var(--ccb-stack-mt);margin-bottom:var(--ccb-stack-mb)}
.ccb-stack__inner{--ccb-stack-inner-maxw:var(--ccb-stack-maxw-desktop,none);width:100%;max-width:var(--ccb-stack-inner-maxw);box-sizing:border-box;margin-left:var(--ccb-stack-inner-ml,auto);margin-right:var(--ccb-stack-inner-mr,auto)}
@media (max-width:1024px){.ccb-stack{--ccb-stack-direction:var(--ccb-stack-direction-tablet,var(--ccb-stack-direction-desktop,column));--ccb-stack-gap:var(--ccb-stack-gap-tablet,var(--ccb-stack-gap-desktop,24px));--ccb-stack-pt:var(--ccb-stack-pt-tablet,var(--ccb-stack-pt-desktop,0px));--ccb-stack-pb:var(--ccb-stack-pb-tablet,var(--ccb-stack-pb-desktop,0px));--ccb-stack-px:var(--ccb-stack-px-tablet,var(--ccb-stack-px-desktop,0px));--ccb-stack-mt:var(--ccb-stack-mt-tablet,var(--ccb-stack-mt-desktop,0px));--ccb-stack-mb:var(--ccb-stack-mb-tablet,var(--ccb-stack-mb-desktop,0px))}}
@media (max-width:1024px){.ccb-stack__inner{--ccb-stack-inner-maxw:var(--ccb-stack-maxw-tablet,var(--ccb-stack-maxw-desktop,none))}}
@media (max-width:768px){.ccb-stack{--ccb-stack-direction:var(--ccb-stack-direction-mobile,var(--ccb-stack-direction-tablet,var(--ccb-stack-direction-desktop,column)));--ccb-stack-gap:var(--ccb-stack-gap-mobile,var(--ccb-stack-gap-tablet,var(--ccb-stack-gap-desktop,24px)));--ccb-stack-pt:var(--ccb-stack-pt-mobile,var(--ccb-stack-pt-tablet,var(--ccb-stack-pt-desktop,0px)));--ccb-stack-pb:var(--ccb-stack-pb-mobile,var(--ccb-stack-pb-tablet,var(--ccb-stack-pb-desktop,0px)));--ccb-stack-px:var(--ccb-stack-px-mobile,var(--ccb-stack-px-tablet,var(--ccb-stack-px-desktop,0px)));--ccb-stack-mt:var(--ccb-stack-mt-mobile,var(--ccb-stack-mt-tablet,var(--ccb-stack-mt-desktop,0px)));--ccb-stack-mb:var(--ccb-stack-mb-mobile,var(--ccb-stack-mb-tablet,var(--ccb-stack-mb-desktop,0px)))}}
@media (max-width:768px){.ccb-stack__inner{--ccb-stack-inner-maxw:var(--ccb-stack-maxw-mobile,var(--ccb-stack-maxw-tablet,var(--ccb-stack-maxw-desktop,none)))}}

/* Grid (Layout) */
.ccb-grid{--ccb-grid-cols:var(--ccb-grid-cols-desktop,3);--ccb-grid-gap:var(--ccb-grid-gap-desktop,24px);display:grid;grid-template-columns:repeat(var(--ccb-grid-cols),minmax(0,1fr));gap:var(--ccb-grid-gap)}
.ccb-grid.is-dense{grid-auto-flow:dense}
@media (max-width:1024px){.ccb-grid{--ccb-grid-cols:var(--ccb-grid-cols-tablet,var(--ccb-grid-cols-desktop,3));--ccb-grid-gap:var(--ccb-grid-gap-tablet,var(--ccb-grid-gap-desktop,24px))}}
@media (max-width:768px){.ccb-grid{--ccb-grid-cols:var(--ccb-grid-cols-mobile,var(--ccb-grid-cols-tablet,var(--ccb-grid-cols-desktop,3)));--ccb-grid-gap:var(--ccb-grid-gap-mobile,var(--ccb-grid-gap-tablet,var(--ccb-grid-gap-desktop,24px)))}}

/* Spacer (Responsive) */
.ccb-spacer{--ccb-spacer-h:var(--ccb-spacer-h-desktop,40px);height:var(--ccb-spacer-h)}
@media (max-width:1024px){.ccb-spacer{--ccb-spacer-h:var(--ccb-spacer-h-tablet,var(--ccb-spacer-h-desktop,40px))}}
@media (max-width:768px){.ccb-spacer{--ccb-spacer-h:var(--ccb-spacer-h-mobile,var(--ccb-spacer-h-tablet,var(--ccb-spacer-h-desktop,40px)))}}

/* Header */
.ccb-app-features__header {
    text-align: center;
    margin-bottom: 60px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.ccb-app-features__heading {
    font-size: 36px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 16px;
    color: var(--ccb-af-head-color, #111827);
}

.ccb-app-features__subtitle {
    font-size: 20px;
    font-weight: 500;
    color: var(--ccb-af-sub-color, #3b82f6);
    margin: 0;
}

/* Grid Layout (Desktop) - 1fr AUTO 1fr */
.ccb-app-features__grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    column-gap: var(--ccb-af-col-gap, 40px);
    row-gap: 40px;
    width: 100%;
}

.ccb-app-features__device[data-has-media="1"][data-media-position="left"] .ccb-app-features__grid {
    grid-template-columns: auto 1fr 1fr;
}

.ccb-app-features__device[data-has-media="1"][data-media-position="right"] .ccb-app-features__grid {
    grid-template-columns: 1fr 1fr auto;
}

.ccb-app-features__device[data-has-media="0"] .ccb-app-features__grid {
    grid-template-columns: 1fr 1fr;
}

/* Columns */
.ccb-app-features__col {
    min-width: 0;
}

.ccb-app-features__col--center {
    align-self: var(--ccb-af-col-va-center, center);
    display: flex;
    justify-content: center;
    align-items: center;
}

.ccb-app-features__col--left {
    padding-left: var(--ccb-af-left-pl, 0px);
    align-self: var(--ccb-af-col-va-left, center);
}

.ccb-app-features__col--right {
    padding-left: var(--ccb-af-right-pl, 0px);
    align-self: var(--ccb-af-col-va-right, center);
}

/* Center Image */
.ccb-app-features__main-img {
    max-width: min(100%, var(--ccb-af-image-max, 500px));
    height: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 20px 25px -5px rgba(0, 0, 0, 0.1));
}

/* Feature Item - ALWAYS LEFT ALIGNED (Icon -> Text) */
.ccb-app-features__item {
    display: flex;
    flex-direction: row;
    align-items: var(--ccb-af-item-align, flex-start);
    gap: 16px;
    margin-bottom: var(--ccb-af-item-spacing, 40px);
    text-align: var(--ccb-af-text-align, center);
}

.ccb-app-features__item:last-child {
    margin-bottom: 0;
}

/* Linked item: no underline by default; underline title on hover */
.ccb-app-features__item[href] {
    text-decoration: none;
    color: inherit;
}

.ccb-app-features__item[href]:hover .ccb-app-features__item-title {
    text-decoration: underline;
}

.ccb-app-features__item[href]:focus-visible .ccb-app-features__item-title {
    text-decoration: underline;
}

/* Icon */
.ccb-app-features__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--ccb-af-icon-size, 32px);
    height: var(--ccb-af-icon-size, 32px);
    border-radius: 0;
    background: none;
}

.ccb-app-features__icon svg {
    width: var(--ccb-af-icon-size, 32px);
    height: var(--ccb-af-icon-size, 32px);
    fill: var(--ccb-af-icon-color, #3b82f6);
    transform: translateY(calc(var(--ccb-af-icon-offset-y, 0px) - 1px));
}

/* Features Text */
.ccb-app-features__item-title {
    font-weight: 700;
    margin-bottom: var(--ccb-af-title-list-gap, 6px);
    line-height: 1.3;
    color: var(--ccb-af-feat-title, #111827);
    font-size: var(--ccb-af-fs-title, 18px);
}

/* --- System Requirements --- */
/* System Requirements */
.ccb-system-requirements{
    --ccb-sr-bg: var(--ccb-sr-bg-desktop, #f9fafb);
    --ccb-sr-title-color: var(--ccb-sr-title-color-desktop, #111827);
    --ccb-sr-text-color: var(--ccb-sr-text, #111827);

    --ccb-sr-pt: var(--ccb-sr-pt-desktop, 72px);
    --ccb-sr-pb: var(--ccb-sr-pb-desktop, 72px);

    --ccb-sr-title-fs: var(--ccb-sr-title-fs-desktop, 36px);
    --ccb-sr-cell-fs: var(--ccb-sr-cell-fs-desktop, 15px);

    --ccb-sr-table-bg-color: var(--ccb-sr-table-bg, #ffffff);
    --ccb-sr-header-bg-color: var(--ccb-sr-header-bg, #f3f4f6);
    --ccb-sr-border-color: var(--ccb-sr-border, #e5e7eb);

    background: var(--ccb-sr-bg);
    padding-top: var(--ccb-sr-pt);
    padding-bottom: var(--ccb-sr-pb);
    color: var(--ccb-sr-text-color);
    width: 100%;
}

@media (max-width: 1024px) {
    .ccb-system-requirements{
        --ccb-sr-pt: var(--ccb-sr-pt-tablet, var(--ccb-sr-pt-desktop, 72px));
        --ccb-sr-pb: var(--ccb-sr-pb-tablet, var(--ccb-sr-pb-desktop, 72px));
        --ccb-sr-title-fs: var(--ccb-sr-title-fs-tablet, var(--ccb-sr-title-fs-desktop, 36px));
        --ccb-sr-cell-fs: var(--ccb-sr-cell-fs-tablet, var(--ccb-sr-cell-fs-desktop, 15px));
    }
}

@media (max-width: 768px) {
    .ccb-system-requirements{
        --ccb-sr-pt: var(--ccb-sr-pt-mobile, var(--ccb-sr-pt-tablet, var(--ccb-sr-pt-desktop, 72px)));
        --ccb-sr-pb: var(--ccb-sr-pb-mobile, var(--ccb-sr-pb-tablet, var(--ccb-sr-pb-desktop, 72px)));

        --ccb-sr-title-fs: var(--ccb-sr-title-fs-mobile, var(--ccb-sr-title-fs-tablet, var(--ccb-sr-title-fs-desktop, 36px)));
        --ccb-sr-cell-fs: var(--ccb-sr-cell-fs-mobile, var(--ccb-sr-cell-fs-tablet, var(--ccb-sr-cell-fs-desktop, 15px)));
    }
}

.ccb-system-requirements__inner{
    max-width: var(--ccb-sr-max-width, 1280px);
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

.ccb-system-requirements__header{margin-bottom:24px}

.ccb-system-requirements__title{
    margin: 0;
    font-size: var(--ccb-sr-title-fs);
    line-height: 1.15;
    color: var(--ccb-sr-title-color);
}

.ccb-system-requirements__intro{margin:12px 0 0;max-width:72ch}

.ccb-system-requirements__table-wrap{
    border-radius: 10px;
    overflow: hidden;
    background: var(--ccb-sr-table-bg-color);
    border: 1px solid var(--ccb-sr-border-color);
}

.ccb-system-requirements .ccb-system-requirements__table{
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: var(--ccb-sr-cell-fs);
}

.ccb-system-requirements__caption{
    caption-side: bottom;
    padding: 10px 14px;
    text-align: left;
    color: var(--ccb-sr-text-color);
    opacity: 0.85;
}

.ccb-system-requirements__thead th{
    background: var(--ccb-sr-header-bg-color);
    text-align: left;
    font-weight: 600;
}

.ccb-system-requirements__col-label{
    width: 40%;
}

.ccb-system-requirements__table th,
.ccb-system-requirements__table td{
    padding: 14px 16px;
    border-bottom: 1px solid var(--ccb-sr-border-color);
    vertical-align: middle;
}

.ccb-system-requirements__tbody tr:last-child th,
.ccb-system-requirements__tbody tr:last-child td{border-bottom:0}

.ccb-system-requirements__row-label{width:40%;font-weight:600}

.ccb-system-requirements__cell{width:auto}

.ccb-system-requirements__icon{width:20px;height:20px;display:inline-block;vertical-align:middle;fill:currentColor}

/* Mobile handling */
@media (max-width: 768px) {
    .ccb-system-requirements[data-mobile-mode="scroll"] .ccb-system-requirements__table-wrap{
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .ccb-system-requirements[data-mobile-mode="scroll"] .ccb-system-requirements__table{
        min-width: calc(360px + (160px * var(--ccb-sr-cols, 2)));
    }

    /* Stack mode: table becomes card layout */
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__table{
        display: block;
        width: 100%;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__table colgroup,
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__thead{
        display: none;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__caption{
        display: block;
        padding: 12px 16px 8px;
        font-weight: 600;
        opacity: 1;
        font-size: 0.95em;
        letter-spacing: 0.02em;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__tbody{
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 12px;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__row{
        display: block;
        background: var(--ccb-sr-header-bg-color);
        border-radius: 8px;
        padding: 14px 16px;
        border-bottom: 0;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__row-label{
        display: block;
        width: auto;
        padding: 0 0 10px;
        margin: 0;
        border: 0;
        border-bottom: 1px solid var(--ccb-sr-border-color);
        font-size: 0.95em;
        letter-spacing: 0.01em;
        color: var(--ccb-sr-text-color);
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell{
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        width: auto;
        padding: 8px 0 0;
        border: 0;
        font-size: var(--ccb-sr-cell-fs);
        gap: 8px;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell[data-label=""]::before,
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell:not([data-label])::before{
        display: none;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell[data-label]::before{
        content: attr(data-label);
        flex-shrink: 0;
        font-weight: 500;
        font-size: 0.85em;
        color: var(--ccb-sr-text-color);
        opacity: 0.6;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }
    /* Single-column tables: full-width value, left-aligned */
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell[data-label=""] .ccb-system-requirements__cell-text,
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell:not([data-label]) .ccb-system-requirements__cell-text{
        text-align: left;
        width: 100%;
    }
    /* Multi-column tables: value right-aligned */
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__cell-text{
        text-align: right;
    }
    .ccb-system-requirements[data-mobile-mode="stack"] .ccb-system-requirements__table-wrap{
        border-radius: 10px;
        overflow: hidden;
    }
}

/* Editor helpers (safe for frontend too) */
.ccb-system-requirements__row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}

.ccb-app-features__item-desc {
    line-height: 1.6;
    color: var(--ccb-af-feat-desc, #4b5563);
    margin: 0;
    font-size: var(--ccb-af-fs-desc, 15px);
}

.ccb-app-features__bullets {
    margin: 0;
    padding-left: 1.15em;
    color: var(--ccb-af-feat-desc, #4b5563);
    font-size: var(--ccb-af-fs-desc, 15px);
    line-height: 1.6;
}

.ccb-app-features__bullets li {
    margin: 0;
}

/* Tablet / Mobile preview overrides */
.ccb-app-features[data-preview-device="tablet"] .ccb-app-features__grid,
.ccb-app-features[data-preview-device="mobile"] .ccb-app-features__grid {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

.ccb-app-features[data-preview-device="mobile"] {
    padding-top: var(--ccb-af-pt, 40px);
    padding-bottom: var(--ccb-af-pb, 40px);
}

/* Mobile Responsiveness */
@media (max-width: 1024px) {
    .ccb-app-features:not([data-preview-device]) {
        --ccb-af-bg: var(--ccb-af-bg-tablet, var(--ccb-af-bg-desktop, #f9fafb));
        --ccb-af-pt: var(--ccb-af-pt-tablet, var(--ccb-af-pt-desktop, 80px));
        --ccb-af-pb: var(--ccb-af-pb-tablet, var(--ccb-af-pb-desktop, 80px));
        --ccb-af-head-color: var(--ccb-af-head-color-tablet, var(--ccb-af-head-color-desktop, #111827));
        --ccb-af-sub-color: var(--ccb-af-sub-color-tablet, var(--ccb-af-sub-color-desktop, #3b82f6));
        --ccb-af-feat-title: var(--ccb-af-feat-title-tablet, var(--ccb-af-feat-title-desktop, #111827));
        --ccb-af-feat-desc: var(--ccb-af-feat-desc-tablet, var(--ccb-af-feat-desc-desktop, #4b5563));
        --ccb-af-icon-color: var(--ccb-af-icon-color-tablet, var(--ccb-af-icon-color-desktop, #3b82f6));
        --ccb-af-icon-size: var(--ccb-af-icon-size-tablet, var(--ccb-af-icon-size-desktop, 32px));
        --ccb-af-fs-title: var(--ccb-af-fs-title-tablet, var(--ccb-af-fs-title-desktop, 18px));
        --ccb-af-fs-desc: var(--ccb-af-fs-desc-tablet, var(--ccb-af-fs-desc-desktop, 15px));
        --ccb-af-col-gap: var(--ccb-af-col-gap-tablet, var(--ccb-af-col-gap-desktop, 40px));
        --ccb-af-item-spacing: var(--ccb-af-item-spacing-tablet, var(--ccb-af-item-spacing-desktop, 40px));
        --ccb-af-left-pl: var(--ccb-af-left-pl-tablet, var(--ccb-af-left-pl-desktop, 0px));
        --ccb-af-right-pl: var(--ccb-af-right-pl-tablet, var(--ccb-af-right-pl-desktop, 0px));
        --ccb-af-title-list-gap: var(--ccb-af-title-list-gap-tablet, var(--ccb-af-title-list-gap-desktop, 6px));
        --ccb-af-image-max: var(--ccb-af-image-max-tablet, var(--ccb-af-image-max-desktop, 500px));
        --ccb-af-col-va-left: var(--ccb-af-col-va-left-tablet, var(--ccb-af-col-va-left-desktop, center));
        --ccb-af-col-va-center: var(--ccb-af-col-va-center-tablet, var(--ccb-af-col-va-center-desktop, center));
        --ccb-af-col-va-right: var(--ccb-af-col-va-right-tablet, var(--ccb-af-col-va-right-desktop, center));
    }

    .ccb-app-features:not([data-preview-device]) .ccb-app-features__device {
        display: none;
    }

    .ccb-app-features:not([data-preview-device]) .ccb-app-features__device[data-device="tablet"] {
        display: block;
    }

    .ccb-app-features__grid {
        display: flex;
        flex-direction: column;
        gap: 60px;
    }

    .ccb-app-features__device:not([data-media-position]) .ccb-app-features__col--center,
    .ccb-app-features__device[data-media-position="center"] .ccb-app-features__col--center {
        order: -1;
        width: 100%;
    }

    .ccb-app-features__col {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
        padding-left: 0 !important;
    }
}

@media (max-width: 768px) {
    .ccb-app-features:not([data-preview-device]) {
        --ccb-af-bg: var(--ccb-af-bg-mobile, var(--ccb-af-bg-tablet, var(--ccb-af-bg-desktop, #f9fafb)));
        --ccb-af-pt: var(--ccb-af-pt-mobile, var(--ccb-af-pt-tablet, var(--ccb-af-pt-desktop, 80px)));
        --ccb-af-pb: var(--ccb-af-pb-mobile, var(--ccb-af-pb-tablet, var(--ccb-af-pb-desktop, 80px)));
        --ccb-af-head-color: var(--ccb-af-head-color-mobile, var(--ccb-af-head-color-tablet, var(--ccb-af-head-color-desktop, #111827)));
        --ccb-af-sub-color: var(--ccb-af-sub-color-mobile, var(--ccb-af-sub-color-tablet, var(--ccb-af-sub-color-desktop, #3b82f6)));
        --ccb-af-feat-title: var(--ccb-af-feat-title-mobile, var(--ccb-af-feat-title-tablet, var(--ccb-af-feat-title-desktop, #111827)));
        --ccb-af-feat-desc: var(--ccb-af-feat-desc-mobile, var(--ccb-af-feat-desc-tablet, var(--ccb-af-feat-desc-desktop, #4b5563)));
        --ccb-af-icon-color: var(--ccb-af-icon-color-mobile, var(--ccb-af-icon-color-tablet, var(--ccb-af-icon-color-desktop, #3b82f6)));
        --ccb-af-icon-size: var(--ccb-af-icon-size-mobile, var(--ccb-af-icon-size-tablet, var(--ccb-af-icon-size-desktop, 32px)));
        --ccb-af-fs-title: var(--ccb-af-fs-title-mobile, var(--ccb-af-fs-title-tablet, var(--ccb-af-fs-title-desktop, 18px)));
        --ccb-af-fs-desc: var(--ccb-af-fs-desc-mobile, var(--ccb-af-fs-desc-tablet, var(--ccb-af-fs-desc-desktop, 15px)));
        --ccb-af-col-gap: var(--ccb-af-col-gap-mobile, var(--ccb-af-col-gap-tablet, var(--ccb-af-col-gap-desktop, 40px)));
        --ccb-af-item-spacing: var(--ccb-af-item-spacing-mobile, var(--ccb-af-item-spacing-tablet, var(--ccb-af-item-spacing-desktop, 40px)));
        --ccb-af-left-pl: var(--ccb-af-left-pl-mobile, var(--ccb-af-left-pl-tablet, var(--ccb-af-left-pl-desktop, 0px)));
        --ccb-af-right-pl: var(--ccb-af-right-pl-mobile, var(--ccb-af-right-pl-tablet, var(--ccb-af-right-pl-desktop, 0px)));
        --ccb-af-title-list-gap: var(--ccb-af-title-list-gap-mobile, var(--ccb-af-title-list-gap-tablet, var(--ccb-af-title-list-gap-desktop, 6px)));
        --ccb-af-image-max: var(--ccb-af-image-max-mobile, var(--ccb-af-image-max-tablet, var(--ccb-af-image-max-desktop, 500px)));
        --ccb-af-col-va-left: var(--ccb-af-col-va-left-mobile, var(--ccb-af-col-va-left-tablet, var(--ccb-af-col-va-left-desktop, center)));
        --ccb-af-col-va-center: var(--ccb-af-col-va-center-mobile, var(--ccb-af-col-va-center-tablet, var(--ccb-af-col-va-center-desktop, center)));
        --ccb-af-col-va-right: var(--ccb-af-col-va-right-mobile, var(--ccb-af-col-va-right-tablet, var(--ccb-af-col-va-right-desktop, center)));
    }

    .ccb-app-features:not([data-preview-device]) .ccb-app-features__device[data-device="tablet"] {
        display: none;
    }

    .ccb-app-features:not([data-preview-device]) .ccb-app-features__device[data-device="mobile"] {
        display: block;
    }

    .ccb-app-features {
        padding-top: var(--ccb-af-pt, 40px);
        padding-bottom: var(--ccb-af-pb, 40px);
    }

    .ccb-app-features__heading {
        font-size: 28px;
    }
}
/* ===========================
   INDUSTRY CARD (ccb/card-industry)
=========================== */

.ccb-industry-card-wrapper {
    width: 100%;
}

.ccb-industry-card {
    max-width: 420px;
    margin: 0 auto;
    background: transparent;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.ccb-industry-image-wrap {
    border-radius: var(--cgb-radius-card) var(--cgb-radius-card) 0 0;
    overflow: hidden;
}

.ccb-industry-image-wrap img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.ccb-industry-box {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ccb-industry-title {
    margin: 0;
    font-weight: 700;
}

.ccb-industry-body {
    margin: 0;
    line-height: 1.5;
}/* ===========================
   MODERN PRO CARD (ccb/card-pro)
=========================== */

.ccb-pro-card-wrapper {
    width: 100%;
}

.ccb-pro-card {
    overflow: hidden;
    background: #ffffff;
    transition: transform .25s ease, box-shadow .25s ease;
}

.ccb-pro-card:hover {
    transform: translateY(-4px);
}

.ccb-pro-image {
    width: 100%;
    overflow: hidden;
}

.ccb-pro-image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform .35s ease;
}

.ccb-pro-card:hover .ccb-pro-image img {
    transform: scale(1.03);
}

.ccb-pro-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ccb-pro-title {
    margin: 0;
    line-height: 1.3;
}

.ccb-pro-body {
    margin: 0;
    line-height: 1.6;
    opacity: .95;
}

.ccb-pro-link {
    display: inline-block;
    margin-top: 6px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: opacity .2s ease;
}

.ccb-pro-link:hover {
    opacity: .8;
}
/* ===========================
   FEATURE CARD (ccb/card)
=========================== */

/*
Block → selectors found
CARD → .ccb-card-wrapper, .ccb-card-link, .ccb-card, .ccb-card.ccb-card--hover-enabled:hover, .ccb-card-image-wrap, .ccb-card-image-wrap img, .ccb-card-accent, .ccb-card-accent--top, .ccb-card-accent--bottom, .ccb-card-heading, .ccb-card-list, .ccb-card-list li, .ccb-card-list-icon, .ccb-card-list-text, .ccb-card-button, .ccb-card-button.ccb-button--hover-enabled:hover
*/

.ccb-card-wrapper {
    width: 100%;
}

.ccb-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.ccb-card {
    max-width: 420px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #ffffff;
    border-radius: var(--cgb-radius-card);
    position: relative;
    overflow: hidden;
    /* transizioni parametrizzate via var */
    transition:
        transform var(--ccb-card-transition, 180ms) ease,
        box-shadow var(--ccb-card-transition, 180ms) ease;
}

/* hover card elegante e non invasivo */
.ccb-card.ccb-card--hover-enabled:hover {
    transform:
        translateY(var(--ccb-card-hover-lift, -3px)) scale(var(--ccb-card-hover-scale, 1.01));
    box-shadow:
        0 calc(var(--ccb-card-hover-shadow-offset, 6px)) var(--ccb-card-hover-shadow, 18px) rgba(15, 23, 42, 0.18);
}

.ccb-card-image-wrap {
    border-radius: var(--cgb-radius-card);
    overflow: hidden;
    margin-bottom: 4px;
}

.ccb-card-image-wrap img {
    display: block;
    width: 100%;
    height: auto;
}

.ccb-card-accent {
    width: 100%;
    background: var(--cgb-primary);
    border-radius: var(--cgb-radius-pill);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28);
    opacity: 0.95;
}

.ccb-card-accent--top {
    margin-bottom: 8px;
}

.ccb-card-accent--bottom {
    margin-top: 10px;
}

/* Heading */
.ccb-card-heading {
    margin: 0;
    font-weight: 600;
}

/* Responsive heading per card */
@media (max-width: 992px) {
    .ccb-card-heading {
        font-size: var(--ccb-card-heading-fs-tablet, inherit) !important;
    }
}

@media (max-width: 768px) {
    .ccb-card-heading {
        font-size: var(--ccb-card-heading-fs-mobile, inherit) !important;
    }
}

/* Lista con icona */
.ccb-card-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ccb-card-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.ccb-card-list-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 20px;
    height: 20px;
    border-radius: var(--cgb-radius-pill);
    font-size: 11px;
    background: var(--cgb-primary-soft);
    color: var(--cgb-primary);
    margin-top: 2px;
}

.ccb-card-list-text {
    font-size: 14px;
    line-height: 1.4;
}

/* Pulsante */
.ccb-card-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 6px;
    padding: 9px 18px;
    border-radius: var(--cgb-radius-pill);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition:
        transform var(--ccb-button-transition, 120ms) ease,
        box-shadow var(--ccb-button-transition, 120ms) ease,
        filter var(--ccb-button-transition, 120ms) ease;
}

/* hover pulsante elegante */
.ccb-card-button.ccb-button--hover-enabled:hover {
    transform: translateY(var(--ccb-button-hover-lift, -1px));
    box-shadow:
        0 var(--ccb-button-hover-shadow, 10px) calc(var(--ccb-button-hover-shadow, 10px) * 2) rgba(15, 23, 42, 0.20);
    filter: brightness(var(--ccb-button-hover-brightness, 1.04));
}/* Cards Grid block styles */

.ccb-cards-grid-heading {
    margin: 0;
}

.ccb-cards-grid-wrapper {
    width: 100%;
}

.ccb-cards-grid-wrapper .cgb-inner {
    width: 100%;
    box-sizing: border-box;
}

.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-cards-grid {
    display: grid;
}

/* Backend editor: make Gutenberg wrappers transparent
   so the cards become direct children of the grid */
.ccb-cards-grid .block-editor-inner-blocks,
.ccb-cards-grid .block-editor-block-list__layout {
    display: contents;
}

/* Desktop: colonne da data-attribute */
.ccb-cards-grid[data-cols-desktop="1"] { grid-template-columns: repeat(1, minmax(0,1fr)); }
.ccb-cards-grid[data-cols-desktop="2"] { grid-template-columns: repeat(2, minmax(0,1fr)); }
.ccb-cards-grid[data-cols-desktop="3"] { grid-template-columns: repeat(3, minmax(0,1fr)); }
.ccb-cards-grid[data-cols-desktop="4"] { grid-template-columns: repeat(4, minmax(0,1fr)); }
.ccb-cards-grid[data-cols-desktop="5"] { grid-template-columns: repeat(5, minmax(0,1fr)); }
.ccb-cards-grid[data-cols-desktop="6"] { grid-template-columns: repeat(6, minmax(0,1fr)); }

/* Backend: rendi i blocchi figli diretti della grid */
@media (max-width: 992px) {
    .ccb-cards-grid[data-cols-tablet="1"] { grid-template-columns: repeat(1, minmax(0,1fr)); }
    .ccb-cards-grid[data-cols-tablet="2"] { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .ccb-cards-grid[data-cols-tablet="3"] { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .ccb-cards-grid[data-cols-tablet="4"] { grid-template-columns: repeat(4, minmax(0,1fr)); }

    /* padding/margini tablet (se settati) */
    .ccb-cards-grid-wrapper {
        padding-top:    var(--ccb-grid-padding-top-tablet,    inherit) !important;
        padding-bottom: var(--ccb-grid-padding-bottom-tablet, inherit) !important;
        margin-top:     var(--ccb-grid-margin-top-tablet,     inherit) !important;
        margin-bottom:  var(--ccb-grid-margin-bottom-tablet,  inherit) !important;
    }

    .ccb-cards-grid-wrapper .cgb-inner {
        padding-left:  var(--ccb-grid-padding-x-tablet, var(--ccb-grid-padding-x-desktop));
        padding-right: var(--ccb-grid-padding-x-tablet, var(--ccb-grid-padding-x-desktop));
    }

    /* gap tablet */
    .ccb-cards-grid {
        gap: var(--ccb-grid-gap-tablet, inherit) !important;
    }

    /* heading tablet */
    .ccb-cards-grid-heading {
        font-size: var(--ccb-grid-heading-fs-tablet, inherit) !important;
    }
}

@media (max-width: 768px) {
    .ccb-cards-grid[data-cols-mobile="1"] { grid-template-columns: repeat(1, minmax(0,1fr)); }
    .ccb-cards-grid[data-cols-mobile="2"] { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .ccb-cards-grid[data-cols-mobile="3"] { grid-template-columns: repeat(3, minmax(0,1fr)); }

    .ccb-cards-grid-wrapper {
        padding-top:    var(--ccb-grid-padding-top-mobile,    inherit) !important;
        padding-bottom: var(--ccb-grid-padding-bottom-mobile, inherit) !important;
        margin-top:     var(--ccb-grid-margin-top-mobile,     inherit) !important;
        margin-bottom:  var(--ccb-grid-margin-bottom-mobile,  inherit) !important;
    }

    .ccb-cards-grid-wrapper .cgb-inner {
        padding-left:  var(--ccb-grid-padding-x-mobile, var(--ccb-grid-padding-x-desktop));
        padding-right: var(--ccb-grid-padding-x-mobile, var(--ccb-grid-padding-x-desktop));
    }

    .ccb-cards-grid {
        gap: var(--ccb-grid-gap-mobile, inherit) !important;
    }

    .ccb-cards-grid-heading {
        font-size: var(--ccb-grid-heading-fs-mobile, inherit) !important;
    }
}
/* ===========================
   IMAGE CAROUSEL (ccb/carousel)
=========================== */

.ccb-carousel {
    position: relative;
    overflow: hidden;
    --ccb-carousel-gap: 16px;
    --ccb-carousel-radius: var(--cgb-radius-card);
    --ccb-carousel-height: 360px;
    --ccb-carousel-filter: none;
    --ccb-carousel-padding: 0px;
    --ccb-carousel-item-padding: 0px;
    --ccb-carousel-item-margin: 0px;
    --ccb-carousel-mt-desktop: 0px;
    --ccb-carousel-mb-desktop: 0px;
    --ccb-carousel-maxw: none;
    --ccb-image-max-width: 100%;
    --ccb-image-max-height: none;
    --ccb-image-fit: cover;
    padding-left: var(--ccb-carousel-padding);
    padding-right: var(--ccb-carousel-padding);
    padding-top: var(--ccb-carousel-pt-desktop, var(--ccb-carousel-padding));
    padding-bottom: var(--ccb-carousel-pb-desktop, var(--ccb-carousel-padding));
    margin-top: var(--ccb-carousel-mt-desktop, 0px);
    margin-bottom: var(--ccb-carousel-mb-desktop, 0px);
}

.ccb-carousel__inner {
    width: 100%;
    max-width: var(--ccb-carousel-maxw, none);
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
}

.ccb-carousel__section-title {
    margin-top: var(--ccb-carousel-sec-title-mt-desktop, 0px);
    margin-bottom: var(--ccb-carousel-sec-title-mb-desktop, var(--ccb-carousel-gap));
    text-align: var(--ccb-carousel-sec-title-align, left);
    color: var(--ccb-carousel-sec-title-color-desktop, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-carousel-sec-title-fs-desktop, 32px);
    line-height: var(--ccb-carousel-sec-title-lh-desktop, 1.2);
    font-weight: var(--ccb-carousel-sec-title-fw-desktop, 800);
    letter-spacing: var(--ccb-carousel-sec-title-ls-desktop, 0em);
}

.ccb-carousel__section-subtitle {
    margin-top: var(--ccb-carousel-sec-subtitle-mt-desktop, 0px);
    margin-bottom: var(--ccb-carousel-sec-subtitle-mb-desktop, var(--ccb-carousel-gap));
    text-align: var(--ccb-carousel-sec-subtitle-align, left);
    color: var(--ccb-carousel-sec-subtitle-color-desktop, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-carousel-sec-subtitle-fs-desktop, 18px);
    line-height: var(--ccb-carousel-sec-subtitle-lh-desktop, 1.4);
    font-weight: var(--ccb-carousel-sec-subtitle-fw-desktop, 500);
    letter-spacing: var(--ccb-carousel-sec-subtitle-ls-desktop, 0em);
}

.ccb-carousel__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: var(--ccb-carousel-bg-opacity, 1);
}

.ccb-carousel__bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 1024px) {
    .ccb-carousel {
        margin-top: var(--ccb-carousel-mt-tablet, var(--ccb-carousel-mt-desktop, 0px));
        margin-bottom: var(--ccb-carousel-mb-tablet, var(--ccb-carousel-mb-desktop, 0px));
        padding-top: var(--ccb-carousel-pt-tablet, var(--ccb-carousel-pt-desktop, var(--ccb-carousel-padding)));
        padding-bottom: var(--ccb-carousel-pb-tablet, var(--ccb-carousel-pb-desktop, var(--ccb-carousel-padding)));
    }

    .ccb-carousel__section-title {
        margin-top: var(--ccb-carousel-sec-title-mt-tablet, var(--ccb-carousel-sec-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-carousel-sec-title-mb-tablet, var(--ccb-carousel-sec-title-mb-desktop, var(--ccb-carousel-gap)));
        color: var(--ccb-carousel-sec-title-color-tablet, var(--ccb-carousel-sec-title-color-desktop, var(--cgb-text-main, #3c434a)));
        font-size: var(--ccb-carousel-sec-title-fs-tablet, var(--ccb-carousel-sec-title-fs-desktop, 32px));
        line-height: var(--ccb-carousel-sec-title-lh-tablet, var(--ccb-carousel-sec-title-lh-desktop, 1.2));
        font-weight: var(--ccb-carousel-sec-title-fw-tablet, var(--ccb-carousel-sec-title-fw-desktop, 800));
        letter-spacing: var(--ccb-carousel-sec-title-ls-tablet, var(--ccb-carousel-sec-title-ls-desktop, 0em));
    }

    .ccb-carousel__section-subtitle {
        margin-top: var(--ccb-carousel-sec-subtitle-mt-tablet, var(--ccb-carousel-sec-subtitle-mt-desktop, 0px));
        margin-bottom: var(--ccb-carousel-sec-subtitle-mb-tablet, var(--ccb-carousel-sec-subtitle-mb-desktop, var(--ccb-carousel-gap)));
        color: var(--ccb-carousel-sec-subtitle-color-tablet, var(--ccb-carousel-sec-subtitle-color-desktop, var(--cgb-text-main, #3c434a)));
        font-size: var(--ccb-carousel-sec-subtitle-fs-tablet, var(--ccb-carousel-sec-subtitle-fs-desktop, 18px));
        line-height: var(--ccb-carousel-sec-subtitle-lh-tablet, var(--ccb-carousel-sec-subtitle-lh-desktop, 1.4));
        font-weight: var(--ccb-carousel-sec-subtitle-fw-tablet, var(--ccb-carousel-sec-subtitle-fw-desktop, 500));
        letter-spacing: var(--ccb-carousel-sec-subtitle-ls-tablet, var(--ccb-carousel-sec-subtitle-ls-desktop, 0em));
    }
}

@media (max-width: 768px) {
    .ccb-carousel {
        margin-top: var(--ccb-carousel-mt-mobile, var(--ccb-carousel-mt-tablet, var(--ccb-carousel-mt-desktop, 0px)));
        margin-bottom: var(--ccb-carousel-mb-mobile, var(--ccb-carousel-mb-tablet, var(--ccb-carousel-mb-desktop, 0px)));
        padding-top: var(--ccb-carousel-pt-mobile, var(--ccb-carousel-pt-tablet, var(--ccb-carousel-pt-desktop, var(--ccb-carousel-padding))));
        padding-bottom: var(--ccb-carousel-pb-mobile, var(--ccb-carousel-pb-tablet, var(--ccb-carousel-pb-desktop, var(--ccb-carousel-padding))));
    }

    .ccb-carousel__section-title {
        margin-top: var(--ccb-carousel-sec-title-mt-mobile, var(--ccb-carousel-sec-title-mt-tablet, var(--ccb-carousel-sec-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-carousel-sec-title-mb-mobile, var(--ccb-carousel-sec-title-mb-tablet, var(--ccb-carousel-sec-title-mb-desktop, var(--ccb-carousel-gap))));
        color: var(--ccb-carousel-sec-title-color-mobile, var(--ccb-carousel-sec-title-color-tablet, var(--ccb-carousel-sec-title-color-desktop, var(--cgb-text-main, #3c434a))));
        font-size: var(--ccb-carousel-sec-title-fs-mobile, var(--ccb-carousel-sec-title-fs-tablet, var(--ccb-carousel-sec-title-fs-desktop, 32px)));
        line-height: var(--ccb-carousel-sec-title-lh-mobile, var(--ccb-carousel-sec-title-lh-tablet, var(--ccb-carousel-sec-title-lh-desktop, 1.2)));
        font-weight: var(--ccb-carousel-sec-title-fw-mobile, var(--ccb-carousel-sec-title-fw-tablet, var(--ccb-carousel-sec-title-fw-desktop, 800)));
        letter-spacing: var(--ccb-carousel-sec-title-ls-mobile, var(--ccb-carousel-sec-title-ls-tablet, var(--ccb-carousel-sec-title-ls-desktop, 0em)));
    }

    .ccb-carousel__section-subtitle {
        margin-top: var(--ccb-carousel-sec-subtitle-mt-mobile, var(--ccb-carousel-sec-subtitle-mt-tablet, var(--ccb-carousel-sec-subtitle-mt-desktop, 0px)));
        margin-bottom: var(--ccb-carousel-sec-subtitle-mb-mobile, var(--ccb-carousel-sec-subtitle-mb-tablet, var(--ccb-carousel-sec-subtitle-mb-desktop, var(--ccb-carousel-gap))));
        color: var(--ccb-carousel-sec-subtitle-color-mobile, var(--ccb-carousel-sec-subtitle-color-tablet, var(--ccb-carousel-sec-subtitle-color-desktop, var(--cgb-text-main, #3c434a))));
        font-size: var(--ccb-carousel-sec-subtitle-fs-mobile, var(--ccb-carousel-sec-subtitle-fs-tablet, var(--ccb-carousel-sec-subtitle-fs-desktop, 18px)));
        line-height: var(--ccb-carousel-sec-subtitle-lh-mobile, var(--ccb-carousel-sec-subtitle-lh-tablet, var(--ccb-carousel-sec-subtitle-lh-desktop, 1.4)));
        font-weight: var(--ccb-carousel-sec-subtitle-fw-mobile, var(--ccb-carousel-sec-subtitle-fw-tablet, var(--ccb-carousel-sec-subtitle-fw-desktop, 500)));
        letter-spacing: var(--ccb-carousel-sec-subtitle-ls-mobile, var(--ccb-carousel-sec-subtitle-ls-tablet, var(--ccb-carousel-sec-subtitle-ls-desktop, 0em)));
    }
}

.ccb-carousel-link {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.ccb-mode-slider .ccb-track {
    display: flex;
    gap: var(--ccb-carousel-gap);
    transition: transform 0.4s ease;
    will-change: transform;
}

.ccb-mode-slider .ccb-item {
    display: flex;
    align-items: stretch;
    height: var(--ccb-carousel-height);
    box-sizing: border-box;
    padding: var(--ccb-carousel-item-padding);
    margin: var(--ccb-carousel-item-margin);
}

.ccb-carousel-figure {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: var(--ccb-carousel-radius);
    background: var(--ccb-carousel-figure-bg, #f8fafc);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.ccb-carousel-figure img {
    width: 100%;
    height: 100%;
    object-fit: var(--ccb-image-fit);
    max-width: var(--ccb-image-max-width);
    max-height: var(--ccb-image-max-height);
    filter: var(--ccb-carousel-filter);
    display: block;
}

.ccb-carousel-caption {
    padding: 10px 12px;
    font-size: 14px;
    color: var(--ccb-carousel-caption-color, var(--cgb-text-main));
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(4px);
}

/* Navigation arrows */
.ccb-carousel-prev,
.ccb-carousel-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: rgba(17, 24, 39, 0.78);
    color: #fff;
    padding: 0.45em 0.75em;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1;
    z-index: 5;
    border-radius: 50%;
    transition: background 0.2s ease, transform 0.2s ease;
}

.ccb-carousel-prev {
    left: 10px;
}

.ccb-carousel-next {
    right: 10px;
}

.ccb-carousel-prev:hover,
.ccb-carousel-next:hover {
    background: rgba(17, 24, 39, 0.95);
    transform: translateY(-50%) scale(1.04);
}

/* Dots pagination */
.ccb-carousel-dots {
    display: inline-flex;
    gap: 10px;
    padding: 10px 12px;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.ccb-carousel-dot {
    width: 10px;
    height: 10px;
    border-radius: var(--cgb-radius-pill);
    border: 1px solid var(--cgb-border-strong);
    background: var(--cgb-bg-app);
    cursor: pointer;
    padding: 0;
    transition: all 0.2s ease;
}

.ccb-carousel-dot.is-active {
    background: var(--cgb-primary);
    border-color: var(--cgb-primary);
    width: 18px;
}

.ccb-carousel-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 6px;
    color: #6b7280;
    font-size: 12px;
}

/* ===== GRIGLIA ===== */

.ccb-mode-grid .ccb-grid {
    width: 100%;
    display: grid;
    gap: var(--ccb-carousel-gap);
    padding: var(--ccb-carousel-padding);
    grid-template-columns: repeat(var(--ccb-columns-desktop, 4), minmax(0, 1fr));
}

.ccb-mode-grid .ccb-item {
    padding: var(--ccb-carousel-item-padding);
    margin: var(--ccb-carousel-item-margin);
}

.ccb-mode-grid .ccb-carousel-item {
    height: var(--ccb-carousel-grid-item-h, var(--ccb-carousel-height, auto));
}

.ccb-mode-grid .ccb-carousel-figure {
    height: 100%;
    box-shadow: var(--ccb-carousel-shadow, none);
}

/* ===== SPLIT (GRID ONLY) ===== */

.ccb-mode-grid .ccb-carousel__split {
    width: 100%;
    display: flex;
    gap: var(--ccb-carousel-gap);
    align-items: stretch;
}

.ccb-mode-grid .ccb-carousel__left {
    flex: 0 0 var(--ccb-carousel-left-w, 35%);
    max-width: var(--ccb-carousel-left-w, 35%);
    min-width: 0;
}

.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-top,
.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-center,
.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-bottom {
    display: flex;
    flex-direction: column;
}

.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-top {
    justify-content: flex-start;
}

.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-center {
    justify-content: center;
}

.ccb-mode-grid .ccb-carousel__left.ccb-left-v-align-bottom {
    justify-content: flex-end;
}

.ccb-carousel--compact-right-grid.ccb-mode-grid .ccb-carousel__right .ccb-grid {
    gap: calc(var(--ccb-carousel-gap) * 0.25);
    padding: 0px;
}

.ccb-carousel--compact-right-grid.ccb-mode-grid .ccb-carousel__right .ccb-item {
    padding: calc(var(--ccb-carousel-item-padding) * 0.25);
    margin: calc(var(--ccb-carousel-item-margin) * 0.25);
}

.ccb-mode-grid .ccb-carousel__right {
    flex: 1 1 auto;
    min-width: 0;
}

.ccb-mode-grid .ccb-carousel__left ul {
    margin: 0;
}

.ccb-mode-grid .ccb-carousel__left li {
    word-break: break-word;
}

@media (max-width: 1024px) {
    .ccb-mode-grid .ccb-grid {
        grid-template-columns: repeat(var(--ccb-columns-tablet, var(--ccb-columns-desktop, 4)), minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .ccb-mode-grid .ccb-grid {
        /* Mobile: colonne da CSS variable (default 2) */
        grid-template-columns: repeat(var(--ccb-columns-mobile, 2), minmax(0, 1fr));
    }

    .ccb-mode-grid .ccb-carousel__split {
        flex-direction: column;
    }

    .ccb-mode-grid .ccb-carousel__left,
    .ccb-mode-grid .ccb-carousel__right {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
    }
}

.ccb-mode-grid .ccb-item {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ===========================/* ===========================
   COUNTER (ccb/counter)
=========================== */

.ccb-counter-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.ccb-counter {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.ccb-counter--align-left {
    align-items: flex-start;
    text-align: center;
}
.ccb-counter--align-center {
    align-items: center;
    text-align: center;
}
.ccb-counter--align-right {
    align-items: flex-end;
    text-align: right;
}

.ccb-counter__prefix {
    margin-bottom: 2px;
}

.ccb-counter__number {
    font-size: 48px;
    font-weight: 600;
    line-height: 1.1;
}

.ccb-counter__label {
    margin-top: var(--ccb-counter-label-gap, 8px);
    font-size: 18px;
}

/* responsive font-size numero */
@media (max-width: 992px) {
    .ccb-counter__number {
        font-size: var(--ccb-counter-number-fs-tablet, inherit) !important;
    }
    .ccb-counter__label {
        font-size: var(--ccb-counter-label-fs-tablet, inherit) !important;
    }
}
@media (max-width: 768px) {
    .ccb-counter__number {
        font-size: var(--ccb-counter-number-fs-mobile, inherit) !important;
    }
    .ccb-counter__label {
        font-size: var(--ccb-counter-label-fs-mobile, inherit) !important;
    }
}
/* CTA Banner block styles */

.ccb-cta-banner {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    background: var(--ccb-cta-bg, #0f172a);
    color: var(--ccb-cta-text, #ffffff);
    padding: var(--ccb-cta-pad-y-desktop, 72px) var(--ccb-cta-pad-x-desktop, 32px);
    min-height: var(--ccb-cta-min-h-desktop, auto);
    border-radius: var(--ccb-cta-radius, var(--cgb-radius-card));
    box-shadow: var(--ccb-cta-shadow, none);
    display: flex;
    flex-direction: column;
    justify-content: var(--ccb-cta-content-v-align, flex-start);
}

.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-cta-banner .cgb-inner {
    max-width: var(--ccb-cta-inner-max-desktop, 1200px);
    margin: 0 auto;
    text-align: inherit;
    width: 100%;
}

.ccb-cta-banner__layout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ccb-cta-right-gap, 32px);
}

.ccb-cta-banner__layout.is-image-left {
    flex-direction: row-reverse;
}

.ccb-cta-banner__content {
    flex: 1 1 auto;
    min-width: 0;
}

.ccb-cta-banner__media {
    flex: 0 0 auto;
}

.ccb-cta-banner__media img {
    display: block;
    width: 100%;
    height: auto;
    max-width: var(--ccb-cta-right-img-max-w, 420px);
    border-radius: var(--ccb-cta-right-img-radius, var(--cgb-radius-card));
}

.ccb-cta-banner--align-center .ccb-cta-banner__media {
    display: flex;
    justify-content: center;
}

.ccb-cta-banner--align-left {
    text-align: center;
}

.ccb-cta-banner--align-center {
    text-align: center;
}

.ccb-cta-banner__eyebrow {
    margin-top: var(--ccb-cta-eyebrow-mt-desktop, 0px);
    margin-bottom: var(--ccb-cta-eyebrow-mb-desktop, 12px);
    margin-left: 0;
    margin-right: 0;
    padding-top: var(--ccb-cta-eyebrow-pt-desktop, 0px);
    padding-bottom: var(--ccb-cta-eyebrow-pb-desktop, 0px);
    font-size: var(--ccb-cta-eyebrow-size-desktop, 14px);
    line-height: var(--ccb-cta-eyebrow-line-desktop, 1.6);
    letter-spacing: var(--ccb-cta-eyebrow-letter-desktop, 1px);
    font-weight: var(--ccb-cta-eyebrow-fw, 600);
    text-transform: uppercase;
    font-style: var(--ccb-cta-eyebrow-style, normal);
    opacity: 0.9;
}

.ccb-cta-banner h2.ccb-cta-banner__title {
    margin-top: var(--ccb-cta-heading-mt-desktop, 0px);
    margin-bottom: var(--ccb-cta-heading-mb-desktop, 12px);
    margin-left: 0;
    margin-right: 0;
    padding-top: var(--ccb-cta-heading-pt-desktop, 0px);
    padding-bottom: var(--ccb-cta-heading-pb-desktop, 0px);
    font-size: var(--ccb-cta-heading-size-desktop, 34px);
    line-height: var(--ccb-cta-heading-line-desktop, 1.2);
    font-weight: var(--ccb-cta-heading-fw, 700);
    font-style: var(--ccb-cta-heading-style, normal);
    color: var(--ccb-cta-heading-color, inherit);
}

.ccb-cta-banner__description {
    margin-top: var(--ccb-cta-description-mt-desktop, 0px);
    margin-bottom: var(--ccb-cta-description-mb-desktop, 20px);
    margin-left: 0;
    margin-right: 0;
    padding-top: var(--ccb-cta-description-pt-desktop, 0px);
    padding-bottom: var(--ccb-cta-description-pb-desktop, 0px);
    font-size: var(--ccb-cta-description-size-desktop, 18px);
    line-height: var(--ccb-cta-description-line-desktop, 1.6);
    font-weight: var(--ccb-cta-description-fw, inherit);
    color: var(--ccb-cta-description-color, inherit);
    opacity: 0.92;
    font-style: var(--ccb-cta-description-style, normal);
}

.ccb-cta-banner__actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 12px;
}

.ccb-cta-banner__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    box-sizing: border-box;
    border-radius: var(--ccb-cta-button-radius, var(--cgb-radius-pill));
    font-weight: var(--ccb-cta-button-fw, 700);
    font-size: var(--ccb-cta-button-size-desktop, 16px);
    text-decoration: none;
    transition: transform var(--ccb-cta-btn-hover-duration, 120ms) var(--ccb-cta-btn-hover-ease, ease), box-shadow var(--ccb-cta-btn-hover-duration, 120ms) var(--ccb-cta-btn-hover-ease, ease), opacity var(--ccb-cta-btn-hover-duration, 120ms) var(--ccb-cta-btn-hover-ease, ease);
}

.ccb-cta-banner__button.is-primary {
    background: var(--ccb-cta-primary-bg, var(--cgb-primary));
    color: var(--ccb-cta-primary-color, #0f172a);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2);
    width: var(--ccb-cta-primary-btn-w-desktop, auto);
}

.ccb-cta-banner__button.is-secondary {
    background: var(--ccb-cta-secondary-bg, rgba(255, 255, 255, 0.14));
    color: var(--ccb-cta-secondary-color, #ffffff);
    border: 1px solid rgba(255, 255, 255, 0.45);
}

.ccb-cta-banner__button:hover {
    transform: translateY(var(--ccb-cta-btn-hover-y, -1px)) scale(var(--ccb-cta-btn-hover-scale, 1));
    opacity: var(--ccb-cta-btn-hover-opacity, 0.96);
}

@media (max-width: 1024px) {
    .ccb-cta-banner {
        padding: var(--ccb-cta-pad-y-tablet, var(--ccb-cta-pad-y-desktop, 72px)) var(--ccb-cta-pad-x-tablet, var(--ccb-cta-pad-x-desktop, 32px));
        min-height: var(--ccb-cta-min-h-tablet, var(--ccb-cta-min-h-desktop, auto));
    }

    .ccb-cta-banner .cgb-inner {
        max-width: var(--ccb-cta-inner-max-tablet, var(--ccb-cta-inner-max-desktop, 1200px));
    }

    .ccb-cta-banner__eyebrow {
        margin-top: var(--ccb-cta-eyebrow-mt-tablet, var(--ccb-cta-eyebrow-mt-desktop, 0px));
        margin-bottom: var(--ccb-cta-eyebrow-mb-tablet, var(--ccb-cta-eyebrow-mb-desktop, 12px));
        padding-top: var(--ccb-cta-eyebrow-pt-tablet, var(--ccb-cta-eyebrow-pt-desktop, 0px));
        padding-bottom: var(--ccb-cta-eyebrow-pb-tablet, var(--ccb-cta-eyebrow-pb-desktop, 0px));
        font-size: var(--ccb-cta-eyebrow-size-tablet, var(--ccb-cta-eyebrow-size-desktop, 14px));
        line-height: var(--ccb-cta-eyebrow-line-tablet, var(--ccb-cta-eyebrow-line-desktop, 1.6));
        letter-spacing: var(--ccb-cta-eyebrow-letter-tablet, var(--ccb-cta-eyebrow-letter-desktop, 1px));
    }

    .ccb-cta-banner__title {
        margin-top: var(--ccb-cta-heading-mt-tablet, var(--ccb-cta-heading-mt-desktop, 0px));
        margin-bottom: var(--ccb-cta-heading-mb-tablet, var(--ccb-cta-heading-mb-desktop, 12px));
        padding-top: var(--ccb-cta-heading-pt-tablet, var(--ccb-cta-heading-pt-desktop, 0px));
        padding-bottom: var(--ccb-cta-heading-pb-tablet, var(--ccb-cta-heading-pb-desktop, 0px));
        font-size: var(--ccb-cta-heading-size-tablet, var(--ccb-cta-heading-size-desktop, 34px));
        line-height: var(--ccb-cta-heading-line-tablet, var(--ccb-cta-heading-line-desktop, 1.2));
    }

    .ccb-cta-banner__description {
        margin-top: var(--ccb-cta-description-mt-tablet, var(--ccb-cta-description-mt-desktop, 0px));
        margin-bottom: var(--ccb-cta-description-mb-tablet, var(--ccb-cta-description-mb-desktop, 20px));
        padding-top: var(--ccb-cta-description-pt-tablet, var(--ccb-cta-description-pt-desktop, 0px));
        padding-bottom: var(--ccb-cta-description-pb-tablet, var(--ccb-cta-description-pb-desktop, 0px));
        font-size: var(--ccb-cta-description-size-tablet, var(--ccb-cta-description-size-desktop, 18px));
        line-height: var(--ccb-cta-description-line-tablet, var(--ccb-cta-description-line-desktop, 1.6));
    }

    .ccb-cta-banner__button {
        font-size: var(--ccb-cta-button-size-tablet, var(--ccb-cta-button-size-desktop, 16px));
    }

    .ccb-cta-banner__button.is-primary {
        width: var(--ccb-cta-primary-btn-w-tablet, var(--ccb-cta-primary-btn-w-desktop, auto));
    }
}

@media (max-width: 640px) {
    .ccb-cta-banner {
        padding: var(--ccb-cta-pad-y-mobile, var(--ccb-cta-pad-y-tablet, 56px)) var(--ccb-cta-pad-x-mobile, var(--ccb-cta-pad-x-tablet, 28px));
        min-height: var(--ccb-cta-min-h-mobile, var(--ccb-cta-min-h-tablet, var(--ccb-cta-min-h-desktop, auto)));
    }

    .ccb-cta-banner .cgb-inner {
        max-width: var(--ccb-cta-inner-max-mobile, var(--ccb-cta-inner-max-tablet, var(--ccb-cta-inner-max-desktop, 1200px)));
    }

    .ccb-cta-banner__eyebrow {
        margin-top: var(--ccb-cta-eyebrow-mt-mobile, var(--ccb-cta-eyebrow-mt-tablet, var(--ccb-cta-eyebrow-mt-desktop, 0px)));
        margin-bottom: var(--ccb-cta-eyebrow-mb-mobile, var(--ccb-cta-eyebrow-mb-tablet, var(--ccb-cta-eyebrow-mb-desktop, 12px)));
        padding-top: var(--ccb-cta-eyebrow-pt-mobile, var(--ccb-cta-eyebrow-pt-tablet, var(--ccb-cta-eyebrow-pt-desktop, 0px)));
        padding-bottom: var(--ccb-cta-eyebrow-pb-mobile, var(--ccb-cta-eyebrow-pb-tablet, var(--ccb-cta-eyebrow-pb-desktop, 0px)));
        font-size: var(--ccb-cta-eyebrow-size-mobile, var(--ccb-cta-eyebrow-size-tablet, var(--ccb-cta-eyebrow-size-desktop, 14px)));
        line-height: var(--ccb-cta-eyebrow-line-mobile, var(--ccb-cta-eyebrow-line-tablet, var(--ccb-cta-eyebrow-line-desktop, 1.6)));
        letter-spacing: var(--ccb-cta-eyebrow-letter-mobile, var(--ccb-cta-eyebrow-letter-tablet, var(--ccb-cta-eyebrow-letter-desktop, 1px)));
    }

    .ccb-cta-banner__title {
        margin-top: var(--ccb-cta-heading-mt-mobile, var(--ccb-cta-heading-mt-tablet, var(--ccb-cta-heading-mt-desktop, 0px)));
        margin-bottom: var(--ccb-cta-heading-mb-mobile, var(--ccb-cta-heading-mb-tablet, var(--ccb-cta-heading-mb-desktop, 12px)));
        padding-top: var(--ccb-cta-heading-pt-mobile, var(--ccb-cta-heading-pt-tablet, var(--ccb-cta-heading-pt-desktop, 0px)));
        padding-bottom: var(--ccb-cta-heading-pb-mobile, var(--ccb-cta-heading-pb-tablet, var(--ccb-cta-heading-pb-desktop, 0px)));
        font-size: var(--ccb-cta-heading-size-mobile, var(--ccb-cta-heading-size-tablet, var(--ccb-cta-heading-size-desktop, 34px)));
        line-height: var(--ccb-cta-heading-line-mobile, var(--ccb-cta-heading-line-tablet, var(--ccb-cta-heading-line-desktop, 1.2)));
    }

    .ccb-cta-banner__description {
        margin-top: var(--ccb-cta-description-mt-mobile, var(--ccb-cta-description-mt-tablet, var(--ccb-cta-description-mt-desktop, 0px)));
        margin-bottom: var(--ccb-cta-description-mb-mobile, var(--ccb-cta-description-mb-tablet, var(--ccb-cta-description-mb-desktop, 20px)));
        padding-top: var(--ccb-cta-description-pt-mobile, var(--ccb-cta-description-pt-tablet, var(--ccb-cta-description-pt-desktop, 0px)));
        padding-bottom: var(--ccb-cta-description-pb-mobile, var(--ccb-cta-description-pb-tablet, var(--ccb-cta-description-pb-desktop, 0px)));
        font-size: var(--ccb-cta-description-size-mobile, var(--ccb-cta-description-size-tablet, var(--ccb-cta-description-size-desktop, 18px)));
        line-height: var(--ccb-cta-description-line-mobile, var(--ccb-cta-description-line-tablet, var(--ccb-cta-description-line-desktop, 1.6)));
    }

    .ccb-cta-banner__actions {
        width: 100%;
        justify-content: center;
    }

    .ccb-cta-banner__button.is-primary {
        width: var(--ccb-cta-primary-btn-w-mobile, var(--ccb-cta-primary-btn-w-tablet, var(--ccb-cta-primary-btn-w-desktop, auto)));
    }
}

/* === SPLIT SECTION === */
.ccb-split-section {
    width: 100%;
    overflow: hidden;
    --ccb-split-media-size: var(--ccb-split-media-size-d, 100%);
    --ccb-list-note-size: var(--ccb-list-note-size-d, var(--ccb-desc-size, 18px));
    --ccb-list-note-line: var(--ccb-list-note-line-d, var(--ccb-desc-line, 1.6));
    padding-top: var(--ccb-split-pt-d, 80px);
    padding-bottom: var(--ccb-split-pb-d, 80px);
    box-sizing: border-box;
}

/* Ensure full-viewport section when using cgb--fullwidth.
   Needed because .ccb-split-section { width: 100% } is declared after global .cgb--fullwidth. */
.ccb-split-section.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-split-section__container {
    margin: 0 auto;
    max-width: var(--ccb-split-maxw, 1200px);
    padding-left: var(--ccb-split-px-d, 24px);
    padding-right: var(--ccb-split-px-d, 24px);
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    box-sizing: border-box;
    gap: var(--ccb-split-gap-d, var(--ccb-split-gap, 32px));
    align-items: center;
}

.ccb-split-section__container.is-top {
    align-items: flex-start;
}

.ccb-split-section__container.is-reverse {
    flex-direction: row-reverse;
}

.ccb-split-section__media {
    flex: 0 1 var(--ccb-split-img-w-d, 45%);
    max-width: var(--ccb-split-img-w-d, 45%);
    min-width: 0;
    position: relative;
    z-index: var(--ccb-split-media-z, 1);
    padding: var(--ccb-split-media-pad-y, 0) var(--ccb-split-media-pad-x, 0);
    box-sizing: border-box;
    display: flex;
    justify-content: center;
}

.ccb-split-section__media img,
.ccb-split-section__media video {
    width: var(--ccb-split-media-size, 100%);
    max-width: var(--ccb-split-media-size, 100%);
    height: auto;
    display: block;
}

.ccb-split-section__youtube-wrapper {
    position: relative;
    width: var(--ccb-split-media-size, 100%);
    max-width: var(--ccb-split-media-size, 100%);
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.ccb-split-section__youtube-wrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.ccb-split-section__youtube-preview {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: transparent;
}

.ccb-split-section__youtube-poster {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.ccb-split-section__youtube-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    transform: translate(-50%, -50%);
    background: rgba(255, 0, 0, 0.9);
    border-radius: 4px;
}

.ccb-split-section__youtube-play:before {
    content: '';
    position: absolute;
    left: 28px;
    top: 16px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 14px solid #fff;
}

.ccb-split-section__youtube-preview.is-playing {
    cursor: default;
}

.ccb-split-section__youtube-preview:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.ccb-split-section__content {
    flex: 0 1 var(--ccb-split-content-w-d, 55%);
    max-width: var(--ccb-split-content-w-d, 55%);
    min-width: 0;
    position: relative;
    z-index: var(--ccb-split-content-z, 1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: var(--ccb-split-content-pad-y, 0);
    padding-bottom: var(--ccb-split-content-pad-y, 0);
    padding-right: var(--ccb-split-content-pad-x, 0);
    padding-left: calc(var(--ccb-split-content-pad-x, 0px) + var(--ccb-split-pl-content-d, 0px));
    box-sizing: border-box;
}

.ccb-split-section__eyebrow {
    color: var(--ccb-eyebrow-color, #2563EB);
    font-size: var(--ccb-eyebrow-size, 13px);
    line-height: var(--ccb-eyebrow-line, 1.3);
    font-weight: var(--ccb-eyebrow-weight, 700);
    letter-spacing: var(--ccb-eyebrow-letter, 0.05em);
    margin-bottom: 12px;
}

.ccb-split-section__heading {
    color: var(--ccb-head-color, #111827);
    font-size: var(--ccb-heading-size, 34px);
    font-weight: var(--ccb-heading-weight, 800);
    line-height: var(--ccb-heading-line, 1.2);
    margin: 0 0 20px 0;
}

.ccb-split-section__description {
    color: var(--ccb-desc-color, #4B5563);
    font-size: var(--ccb-desc-size, 18px);
    line-height: var(--ccb-desc-line, 1.6);
    font-weight: var(--ccb-desc-weight, 400);
    margin-bottom: var(--ccb-desc-mb, 24px);
}

.ccb-split-section__list {
    margin: 0 0 24px 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--ccb-list-gap, 10px);
}

.ccb-split-section__list.is-cols-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ccb-list-gap, 10px) 24px;
}

@media (max-width: 640px) {
    .ccb-split-section__list.is-cols-2 {
        grid-template-columns: 1fr;
    }
}

.ccb-split-section__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: var(--ccb-list-color, var(--ccb-desc-color, #374151));
    font-size: var(--ccb-list-size, 16px);
    line-height: var(--ccb-list-line, 1.5);
    font-weight: var(--ccb-list-weight, 400);
}

.ccb-split-section__list-note {
    color: var(--ccb-list-note-color, var(--ccb-desc-color, #4B5563));
    font-size: var(--ccb-list-note-size, var(--ccb-desc-size, 18px));
    line-height: var(--ccb-list-note-line, var(--ccb-desc-line, 1.6));
    font-weight: var(--ccb-list-note-weight, var(--ccb-desc-weight, 400));
    margin: 0 0 24px 0;
}

.ccb-split-section__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-top: 2px;
    color: var(--ccb-list-color, var(--ccb-desc-color, #374151));
}

.ccb-split-section__icon svg {
    width: var(--ccb-list-icon-size, 20px);
    height: var(--ccb-list-icon-size, 20px);
}

.ccb-split-section__cta-wrapper {
    margin-top: 8px;
}

.ccb-split-section__cta {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    text-decoration: none;
    transition: opacity 0.2s;
    font-size: var(--ccb-cta-font-size, 16px);
}

.ccb-split-section__cta:hover {
    opacity: 0.8;
}

.ccb-split-section__cta.is-link {
    background: transparent;
    color: var(--ccb-cta-color, #2563EB);
    padding: 0;
}

.ccb-split-section__cta.is-primary {
    background: var(--ccb-cta-color, #2563EB);
    color: #fff;
    padding: var(--ccb-cta-pad-y, 12px) var(--ccb-cta-pad-x, 24px);
    border-radius: var(--ccb-cta-radius, 6px);
}

.ccb-split-section__cta.is-secondary {
    background: #f3f4f6;
    color: #1f2937;
    padding: var(--ccb-cta-pad-y, 12px) var(--ccb-cta-pad-x, 24px);
    border-radius: var(--ccb-cta-radius, 6px);
}

.ccb-cta-arrow {
    margin-left: 6px;
    font-family: monospace;
}

@media (max-width: 1024px) {
    .ccb-split-section {
        padding-top: var(--ccb-split-pt-t, 60px);
        padding-bottom: var(--ccb-split-pb-t, 60px);
        --ccb-split-media-size: var(--ccb-split-media-size-t, var(--ccb-split-media-size-d, 100%));
        --ccb-list-note-size: var(--ccb-list-note-size-t, var(--ccb-list-note-size-d, var(--ccb-desc-size, 18px)));
        --ccb-list-note-line: var(--ccb-list-note-line-t, var(--ccb-list-note-line-d, var(--ccb-desc-line, 1.6)));
    }

    .ccb-split-section__container {
        padding-left: var(--ccb-split-px-t, 24px);
        padding-right: var(--ccb-split-px-t, 24px);
        gap: var(--ccb-split-gap-t, var(--ccb-split-gap-d, var(--ccb-split-gap, 32px)));
    }

    .ccb-split-section__media {
        flex: 0 1 var(--ccb-split-img-w-t, 50%);
        max-width: var(--ccb-split-img-w-t, 50%);
    }

    .ccb-split-section__content {
        flex: 0 1 var(--ccb-split-content-w-t, 50%);
        max-width: var(--ccb-split-content-w-t, 50%);
        padding-left: calc(var(--ccb-split-content-pad-x, 0px) + var(--ccb-split-pl-content-t, 0px));
    }

    .ccb-split-section__container.mobile-img-bottom {
        flex-direction: column-reverse;
    }

    .ccb-split-section__container.mobile-img-bottom > .ccb-split-section__media,
    .ccb-split-section__container.mobile-img-bottom > .ccb-split-section__content {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .ccb-split-section {
        padding-top: var(--ccb-split-pt-m, 40px);
        padding-bottom: var(--ccb-split-pb-m, 40px);
        --ccb-split-media-size: var(--ccb-split-media-size-m, 100%);
        --ccb-list-note-size: var(--ccb-list-note-size-m, var(--ccb-list-note-size-t, var(--ccb-list-note-size-d, var(--ccb-desc-size, 18px))));
        --ccb-list-note-line: var(--ccb-list-note-line-m, var(--ccb-list-note-line-t, var(--ccb-list-note-line-d, var(--ccb-desc-line, 1.6))));
    }

    .ccb-split-section__container {
        flex-direction: column;
        padding-left: var(--ccb-split-px-m, 20px);
        padding-right: var(--ccb-split-px-m, 20px);
        gap: var(--ccb-split-gap-m, var(--ccb-split-gap-t, var(--ccb-split-gap-d, var(--ccb-split-gap, 32px))));
    }

    .ccb-split-section__container.is-reverse {
        flex-direction: column;
    }

    .ccb-split-section__container.mobile-img-bottom {
        flex-direction: column-reverse;
    }

    .ccb-split-section__media {
        flex-basis: var(--ccb-split-img-w-m, 100%);
        max-width: var(--ccb-split-img-w-m, 100%);
    }

    .ccb-split-section__content {
        flex-basis: var(--ccb-split-content-w-m, 100%);
        max-width: var(--ccb-split-content-w-m, 100%);
        padding-left: calc(var(--ccb-split-content-pad-x, 0px) + var(--ccb-split-pl-content-m, 0px));
    }

    .ccb-split-section__heading {
        font-size: 28px;
    }
}

/* === Feature Layout === */
.ccb-feature-grid {
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

.ccb-feature-grid__heading {
    margin: 0;
    font-weight: var(--ccb-feature-heading-weight, 700);
}

.ccb-feature-grid__items {
    display: grid;
    grid-template-columns: repeat(var(--ccb-feature-cols-d, 3), minmax(0, 1fr));
    gap: var(--ccb-feature-gap, 24px);
}

@media (max-width: 900px) {
    .ccb-feature-grid__items {
        grid-template-columns: repeat(var(--ccb-feature-cols-t, 2), minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .ccb-feature-grid__items {
        grid-template-columns: repeat(var(--ccb-feature-cols-m, 1), minmax(0, 1fr));
    }
}

.ccb-feature-grid__card {
    transition: transform 140ms ease, box-shadow 140ms ease;
}

.ccb-feature-grid__card:hover {
    transform: translateY(-3px);
}

.ccb-feature-grid__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--ccb-feature-icon-mb-d, 12px);
}

.ccb-feature-grid__icon svg,
.ccb-feature-grid__icon .ccb-feature-grid__svg {
    display: block;
    height: 100%;
    width: auto;
    stroke-width: var(--ccb-feature-icon-stroke, 1.5);
}

.ccb-feature-grid__icon img {
    display: block;
}

.ccb-feature-grid__title {
    margin: 0 0 var(--ccb-feature-item-mb-d, 8px);
    font-size: var(--ccb-feature-item-size-d, 18px);
    font-weight: var(--ccb-feature-item-weight, 700);
    line-height: 1.3;
}

.ccb-feature-grid__description {
    margin: 0;
    line-height: 1.5;
}

.ccb-feature-grid__controls {
    margin-top: 20px;
    text-align: center;
}

.ccb-feature-grid__item-actions {
    margin-top: 12px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* Feature Layout block styles */

.ccb-feature-grid {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    padding-top: var(--cgb-pad-top-d, 60px);
    padding-bottom: var(--cgb-pad-bottom-d, 60px);
    overflow: hidden;
}

.ccb-feature-grid__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background-image: var(--ccb-feature-bg-img, none);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    opacity: var(--ccb-feature-bg-opacity, 1);
}

.ccb-feature-grid.ccb-feature-grid--parallax .ccb-feature-grid__bg {
    background-attachment: fixed;
}

@media (max-width: 768px) {
    .ccb-feature-grid.ccb-feature-grid--parallax .ccb-feature-grid__bg {
        background-attachment: scroll;
    }
}

/* Ensure full-viewport section when using cgb--fullwidth.
   Needed because .ccb-feature-grid { width: 100% } is declared after global .cgb--fullwidth. */
.ccb-feature-grid.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-feature-grid .cgb-inner {
    max-width: var(--cgb-inner-max-d, 1200px);
    margin: 0 auto;
    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
    position: relative;
    z-index: 1;
}

.ccb-feature-grid__heading {
    margin: 0;
    font-weight: var(--ccb-feature-heading-weight, 700);
    font-size: var(--ccb-feature-heading-size-d, 30px);
    margin-bottom: var(--ccb-feature-heading-mb-d, 36px);
}

.ccb-feature-grid__items {
    display: grid;
    grid-template-columns: repeat(var(--ccb-feature-cols-d, 3), minmax(0, 1fr));
    gap: var(--ccb-feature-gap-d, 24px);
}

@media (max-width: 1024px) {
    .ccb-feature-grid {
        padding-top: var(--cgb-pad-top-t, var(--cgb-pad-top-d, 60px));
        padding-bottom: var(--cgb-pad-bottom-t, var(--cgb-pad-bottom-d, 60px));
    }

    .ccb-feature-grid .cgb-inner {
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        max-width: var(--cgb-inner-max-t, var(--cgb-inner-max-d, 1200px));
    }

    .ccb-feature-grid__heading {
        font-size: var(--ccb-feature-heading-size-t, var(--ccb-feature-heading-size-d, 30px));
        margin-bottom: var(--ccb-feature-heading-mb-t, var(--ccb-feature-heading-mb-d, 36px));
    }

    .ccb-feature-grid__items {
        gap: var(--ccb-feature-gap-t, var(--ccb-feature-gap-d, 24px));
    }

    .ccb-feature-grid__icon {
        margin-bottom: var(--ccb-feature-icon-mb-t, var(--ccb-feature-icon-mb-d, 12px));
    }

    .ccb-feature-grid__title {
        font-size: var(--ccb-feature-item-size-t, var(--ccb-feature-item-size-d, 18px));
        margin-bottom: var(--ccb-feature-item-mb-t, var(--ccb-feature-item-mb-d, 8px));
    }
}

@media (max-width: 640px) {
    .ccb-feature-grid {
        padding-top: var(--cgb-pad-top-m, var(--cgb-pad-top-t, var(--cgb-pad-top-d, 60px)));
        padding-bottom: var(--cgb-pad-bottom-m, var(--cgb-pad-bottom-t, var(--cgb-pad-bottom-d, 60px)));
    }

    .ccb-feature-grid .cgb-inner {
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-desktop, 24px));
        max-width: var(--cgb-inner-max-m, var(--cgb-inner-max-t, var(--cgb-inner-max-d, 1200px)));
    }

    .ccb-feature-grid__heading {
        font-size: var(--ccb-feature-heading-size-m, var(--ccb-feature-heading-size-t, var(--ccb-feature-heading-size-d, 30px)));
        margin-bottom: var(--ccb-feature-heading-mb-m, var(--ccb-feature-heading-mb-t, var(--ccb-feature-heading-mb-d, 36px)));
    }

    .ccb-feature-grid__items {
        gap: var(--ccb-feature-gap-m, var(--ccb-feature-gap-t, var(--ccb-feature-gap-d, 24px)));
    }

    .ccb-feature-grid__icon {
        margin-bottom: var(--ccb-feature-icon-mb-m, var(--ccb-feature-icon-mb-t, var(--ccb-feature-icon-mb-d, 12px)));
    }

    .ccb-feature-grid__title {
        font-size: var(--ccb-feature-item-size-m, var(--ccb-feature-item-size-t, var(--ccb-feature-item-size-d, 18px)));
        margin-bottom: var(--ccb-feature-item-mb-m, var(--ccb-feature-item-mb-t, var(--ccb-feature-item-mb-d, 8px)));
    }
}

@media (max-width: 900px) {
    .ccb-feature-grid__items {
        grid-template-columns: repeat(var(--ccb-feature-cols-t, 2), minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .ccb-feature-grid__items {
        grid-template-columns: repeat(var(--ccb-feature-cols-m, 1), minmax(0, 1fr));
    }
}

.ccb-feature-grid__card {
    transition: transform 140ms ease, box-shadow 140ms ease;
}

.ccb-feature-grid__card:hover {
    transform: translateY(-3px);
}

.ccb-feature-grid__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--ccb-feature-icon-mb-d, 12px);
}

.ccb-feature-grid__icon img {
    display: block;
}

.ccb-feature-grid__title {
    margin: 0 0 var(--ccb-feature-item-mb-d, 8px);
    font-size: var(--ccb-feature-item-size-d, 18px);
    font-weight: var(--ccb-feature-item-weight, 700);
    line-height: 1.3;
}

.ccb-feature-grid__description {
    margin: 0;
    line-height: 1.5;
}

.ccb-feature-grid__controls {
    margin-top: 20px;
    text-align: center;
}

.ccb-feature-grid__item-actions {
    margin-top: 12px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
/* ===========================
   HERO SECTION (ccb/hero)
=========================== */

.ccb-hero {
    position: relative;
    overflow: hidden;
    min-height: var(--ccb-hero-min-h-desktop, auto);
    --ccb-hero-primary-btn-w: var(--ccb-hero-primary-btn-w-desktop, auto);
    /* Responsive Spacing Defaults (Desktop) */
    padding-top: var(--ccb-hero-pt-desktop, 80px);
    padding-bottom: var(--ccb-hero-pb-desktop, 80px);
    margin-top: var(--ccb-hero-mt-desktop, 0);
    margin-bottom: var(--ccb-hero-mb-desktop, 0);
    box-sizing: border-box;
}

/* Force full viewport width even inside boxed themes */
.ccb-hero.cgb--fullwidth,
.ccb-hero.ccb-hero--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

/* Theme safety-net: allow Gutenberg align wide/full to break out of container */
.wp-block-ccb-hero.alignwide,
.wp-block-ccb-hero.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

/* overlay */
.ccb-hero-overlay {
    pointer-events: none;
}

/* background image opacity (img/picture) */
.ccb-hero-bg-img,
.ccb-hero-bg-wrapper {
    opacity: var(--ccb-hero-bg-opacity, 1);
}

/* wrapper interno: una o due colonne */
.ccb-hero-inner {
    position: relative;
    display: block;
}

.ccb-hero .cgb-inner {
    width: 100%;
    max-width: var(--cgb-inner-max, 1200px);
    margin: 0 auto;
    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
    box-sizing: border-box;
}

/* Astra safety-net: some templates hard-limit blocks to ~900px/920px.
   Force breakout when alignwide/full or when Hero is configured fullwidth. */
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-hero.alignwide,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-hero.alignfull,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-hero.ccb-hero--fullwidth,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-hero.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

.ccb-hero-inner--with-side {
    display: grid;
    grid-template-columns: minmax(0, var(--ccb-hero-left-col-width, 55%)) minmax(0, 1fr);
    gap: 40px;
    align-items: center;
}

/* Side media visibility (responsive) */
.ccb-hero[data-side-media-desktop="0"] .ccb-hero-media {
    display: none;
}

@media (min-width: 1025px) {
    .ccb-hero[data-side-media-desktop="0"] .ccb-hero-inner--with-side {
        grid-template-columns: minmax(0, 1fr);
    }

    .ccb-hero[data-side-media-desktop="0"] .ccb-hero-inner--with-side.ccb-hero-inner--media-left .ccb-hero-text {
        grid-column: auto;
    }
}

@media (max-width: 1024px) {
    .ccb-hero[data-side-media-tablet="0"] .ccb-hero-media {
        display: none;
    }
}

@media (max-width: 768px) {
    .ccb-hero[data-side-media-mobile="0"] .ccb-hero-media {
        display: none;
    }
}

@media (min-width: 1025px) {
    .ccb-hero-inner--with-side.ccb-hero-inner--media-left .ccb-hero-text {
        grid-column: 2;
    }

    .ccb-hero-inner--with-side.ccb-hero-inner--media-left .ccb-hero-media {
        grid-column: 1;
    }
}

/* colonna testo */
.ccb-hero-text {
    position: relative;
    z-index: 1;
}

/* colonna media a destra */
.ccb-hero-media {
    position: relative;
    z-index: 1;
    width: var(--side-img-width-desktop, 100%);
    margin: var(--side-img-align-desktop, 0 auto);
    transform: translate(var(--side-img-x-desktop, 0), var(--side-img-y-desktop, 0));
}

@media (max-width: 1024px) {
    .ccb-hero {
        --ccb-hero-primary-btn-w: var(--ccb-hero-primary-btn-w-tablet, var(--ccb-hero-primary-btn-w-desktop, auto));
    }

    .ccb-hero-media {
        width: var(--side-img-width-tablet);
        margin: var(--side-img-align-tablet);
        transform: translate(var(--side-img-x-tablet), var(--side-img-y-tablet));
    }
}

@media (max-width: 768px) {
    .ccb-hero {
        --ccb-hero-primary-btn-w: var(--ccb-hero-primary-btn-w-mobile, var(--ccb-hero-primary-btn-w-tablet, var(--ccb-hero-primary-btn-w-desktop, auto)));
    }

    .ccb-hero-media {
        width: var(--side-img-width-mobile);
        margin: var(--side-img-align-mobile);
        transform: translate(var(--side-img-x-mobile), var(--side-img-y-mobile));
    }
}

.ccb-hero-media img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--cgb-radius-card);
}

.ccb-hero-video-wrapper {
    position: relative;
    padding-top: 56.25%;
    /* 16:9 */
    border-radius: var(--cgb-radius-card);
    overflow: hidden;
}

.ccb-hero-video-wrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* YouTube lazy-load preview (Hero) */
.ccb-hero__youtube-preview {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: transparent;
}

.ccb-hero__youtube-poster {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.ccb-hero__youtube-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    transform: translate(-50%, -50%);
    background: rgba(255, 0, 0, 0.9);
    border-radius: 4px;
}

.ccb-hero__youtube-play:before {
    content: '';
    position: absolute;
    left: 28px;
    top: 16px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 14px solid #fff;
}

.ccb-hero__youtube-preview:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* testi hero */
.ccb-hero-eyebrow {
    font-size: var(--ccb-hero-eyebrow-fs-desktop);
    font-weight: 600;
    text-transform: uppercase;
    margin-top: var(--ccb-eye-mt-desktop);
    margin-bottom: var(--ccb-eye-mb-desktop);
}

.ccb-hero-heading {
    font-size: var(--ccb-hero-heading-fs-desktop) !important;
    margin-top: var(--ccb-head-mt-desktop);
    margin-bottom: var(--ccb-head-mb-desktop);
}

.ccb-hero-sub {
    font-size: var(--ccb-hero-sub-fs-desktop);
    max-width: 640px;
    margin-top: var(--ccb-sub-mt-desktop);
    margin-bottom: var(--ccb-sub-mb-desktop);
    margin-left: 0;
    margin-right: 0;
}

.ccb-hero-sub ul,
.ccb-hero-sub ol,
.ccb-hero-sub li {
    color: inherit;
}

.ccb-hero-sub a {
    color: inherit;
}

.ccb-hero.ccb-hero--content-center .ccb-hero-sub {
    margin-left: auto;
    margin-right: auto;
}

.ccb-hero.ccb-hero--content-right .ccb-hero-sub {
    margin-left: auto;
    margin-right: 0;
}


/* bottoni hero */
.ccb-hero-buttons {
    margin-top: 16px;
}

/* variante: testo pre-CTA + store badges */
.ccb-hero-precta {
    margin: 16px 0 8px 0;
    font-size: 14px;
    line-height: 1.4;
}

.ccb-hero-store-badges {
    margin-top: 12px;
}

.ccb-hero-store-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.ccb-hero-store-badge img {
    display: block;
    height: 44px;
    width: auto;
    max-width: 100%;
}

.ccb-hero-store-badge:hover {
    opacity: 0.9;
}

.ccb-hero-button {
    transition: var(--ccb-hero-btn-transition, transform 200ms ease, filter 200ms ease, background-color 200ms ease, color 200ms ease, border-color 200ms ease, box-shadow 200ms ease);
    will-change: transform;
    background-color: var(--ccb-hero-btn-bg, transparent);
    color: var(--ccb-hero-btn-color, inherit);
    border-color: var(--ccb-hero-btn-border, currentColor);
    box-sizing: border-box;
}

.ccb-hero-button--primary {
    --ccb-hero-btn-bg: var(--ccb-hero-primary-bg);
    --ccb-hero-btn-color: var(--ccb-hero-primary-color);
    --ccb-hero-btn-border: var(--ccb-hero-primary-border);
    width: var(--ccb-hero-primary-btn-w, var(--ccb-hero-primary-btn-w-desktop, auto));
    max-width: 100%;
}

.ccb-hero-button--secondary {
    --ccb-hero-btn-bg: var(--ccb-hero-secondary-bg);
    --ccb-hero-btn-color: var(--ccb-hero-secondary-color);
    --ccb-hero-btn-border: var(--ccb-hero-secondary-border);
}

.ccb-hero-button.ccb-button--hover-enabled:hover {
    transform: translateY(var(--ccb-hero-btn-hover-y, var(--ccb-hero-btn-hover-lift, 0px))) scale(var(--ccb-hero-btn-hover-scale, 1));
    opacity: var(--ccb-hero-btn-hover-opacity, 1);
    filter: brightness(var(--ccb-hero-btn-hover-brightness, 1));
    box-shadow: var(--ccb-hero-btn-hover-shadow, none);
}

.ccb-hero-button--primary.ccb-button--hover-enabled:hover {
    background-color: var(--ccb-hero-primary-bg-hover, var(--ccb-hero-primary-bg));
    color: var(--ccb-hero-primary-color-hover, var(--ccb-hero-primary-color));
    border-color: var(--ccb-hero-primary-border-hover, var(--ccb-hero-primary-border));
}

.ccb-hero-button--secondary.ccb-button--hover-enabled:hover {
    background-color: var(--ccb-hero-secondary-bg-hover, var(--ccb-hero-secondary-bg));
    color: var(--ccb-hero-secondary-color-hover, var(--ccb-hero-secondary-color));
    border-color: var(--ccb-hero-secondary-border-hover, var(--ccb-hero-secondary-border));
}

/* icona dentro i pulsanti hero */
.ccb-hero-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* preview immagini nel pannello */
.ccb-hero-bg-preview,
.ccb-hero-side-preview {
    max-width: 100%;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 8px;
}

.ccb-hero-bg-preview img,
.ccb-hero-side-preview img {
    display: block;
    width: 100%;
    height: auto;
}

/* messaggio errore YouTube */
.ccb-hero-video-error {
    font-size: 12px;
    color: #f97316;
    /* arancio di warning */
    background: rgba(249, 115, 22, 0.08);
    padding: 6px 8px;
    border-radius: 4px;
    margin-top: 6px;
}

/* ===========================
   RESPONSIVE TEXT (mobile)
   usa variabili CSS impostate dal JS
=========================== */

@media (max-width: 1024px) {

    /* Tablet Spacing based on JS strict inheritance */
    .ccb-hero {
        min-height: var(--ccb-hero-min-h-tablet, var(--ccb-hero-min-h-desktop, auto));
        padding-top: var(--ccb-hero-pt-tablet);
        padding-bottom: var(--ccb-hero-pb-tablet);
        margin-top: var(--ccb-hero-mt-tablet);
        margin-bottom: var(--ccb-hero-mb-tablet);
    }

    .ccb-hero .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px));
        padding-left: var(--cgb-inner-pad-x-tablet);
        padding-right: var(--cgb-inner-pad-x-tablet);
    }

    .ccb-hero-inner--with-side {
        grid-template-columns: minmax(0, 1fr);
    }

    .ccb-hero-media {
        margin-top: 24px;
    }

    .ccb-hero-eyebrow {
        font-size: var(--ccb-hero-eyebrow-fs-tablet);
        margin-top: var(--ccb-eye-mt-tablet);
        margin-bottom: var(--ccb-eye-mb-tablet);
    }

    .ccb-hero-heading {
        font-size: var(--ccb-hero-heading-fs-tablet) !important;
        margin-top: var(--ccb-head-mt-tablet);
        margin-bottom: var(--ccb-head-mb-tablet);
    }

    .ccb-hero-sub {
        font-size: var(--ccb-hero-sub-fs-tablet);
        margin-top: var(--ccb-sub-mt-tablet);
        margin-bottom: var(--ccb-sub-mb-tablet);
    }

    .ccb-hero-button--primary {
        width: var(--ccb-hero-primary-btn-w-tablet, var(--ccb-hero-primary-btn-w-desktop, auto));
    }
}

@media (max-width: 768px) {

    /* Mobile Spacing based on JS strict inheritance */
    .ccb-hero {
        min-height: var(--ccb-hero-min-h-mobile, var(--ccb-hero-min-h-tablet, var(--ccb-hero-min-h-desktop, auto)));
        padding-top: var(--ccb-hero-pt-mobile);
        padding-bottom: var(--ccb-hero-pb-mobile);
        margin-top: var(--ccb-hero-mt-mobile);
        margin-bottom: var(--ccb-hero-mb-mobile);
    }

    .ccb-hero .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px)));
        padding-left: var(--cgb-inner-pad-x-mobile);
        padding-right: var(--cgb-inner-pad-x-mobile);
    }

    .ccb-hero-heading {
        font-size: var(--ccb-hero-heading-fs-mobile) !important;
        margin-top: var(--ccb-head-mt-mobile);
        margin-bottom: var(--ccb-head-mb-mobile);
    }

    .ccb-hero-sub {
        font-size: var(--ccb-hero-sub-fs-mobile);
        margin-top: var(--ccb-sub-mt-mobile);
        margin-bottom: var(--ccb-sub-mb-mobile);
    }

    .ccb-hero-button--primary {
        width: var(--ccb-hero-primary-btn-w-mobile, var(--ccb-hero-primary-btn-w-tablet, var(--ccb-hero-primary-btn-w-desktop, auto)));
    }

    .ccb-hero-eyebrow {
        font-size: var(--ccb-hero-eyebrow-fs-mobile);
        margin-top: var(--ccb-eye-mt-mobile);
        margin-bottom: var(--ccb-eye-mb-mobile);
    }
}



.ccb-hero .cgb-inner>.ccb-hero-inner {
    width: 100%;
}/* Parent Container */
.cgb-image-grid-container {
    width: 100%;
    margin-bottom: 0;
    padding-top: var(--cgb-ig-pt);
    padding-bottom: var(--cgb-ig-pb);

    --cgb-ig-pt: var(--cgb-ig-pt-desktop, 0px);
    --cgb-ig-pb: var(--cgb-ig-pb-desktop, 0px);
    --cgb-ig-ot-fs: var(--cgb-ig-ot-fs-desktop, 16px);
    --cgb-ig-ot-lh: var(--cgb-ig-ot-lh-desktop, 1.2);
    --cgb-ig-ot-fw: var(--cgb-ig-ot-fw-desktop, 700);
    --cgb-ig-ot-ls: var(--cgb-ig-ot-ls-desktop, 0em);
    --cgb-ig-ot-color: var(--cgb-ig-ot-color-desktop, inherit);
    --cgb-ig-os-fs: var(--cgb-ig-os-fs-desktop, 14px);
    --cgb-ig-os-lh: var(--cgb-ig-os-lh-desktop, 1.2);
    --cgb-ig-os-fw: var(--cgb-ig-os-fw-desktop, 400);
    --cgb-ig-os-ls: var(--cgb-ig-os-ls-desktop, 0em);
    --cgb-ig-os-color: var(--cgb-ig-os-color-desktop, inherit);

    --cgb-ig-title-fs: var(--cgb-ig-title-fs-desktop, 40px);
    --cgb-ig-title-lh: var(--cgb-ig-title-lh-desktop, 1.2);
    --cgb-ig-title-fw: var(--cgb-ig-title-fw-desktop, 700);
    --cgb-ig-title-ls: var(--cgb-ig-title-ls-desktop, 0em);
    --cgb-ig-title-color: var(--cgb-ig-title-color-desktop, inherit);
    --cgb-ig-title-mb: var(--cgb-ig-title-mb-desktop, 8px);

    --cgb-ig-sub-fs: var(--cgb-ig-sub-fs-desktop, 18px);
    --cgb-ig-sub-lh: var(--cgb-ig-sub-lh-desktop, 1.6);
    --cgb-ig-sub-fw: var(--cgb-ig-sub-fw-desktop, 400);
    --cgb-ig-sub-ls: var(--cgb-ig-sub-ls-desktop, 0em);
    --cgb-ig-sub-color: var(--cgb-ig-sub-color-desktop, inherit);
    --cgb-ig-sub-mt: var(--cgb-ig-sub-mt-desktop, 0px);

    --cgb-ig-heading-mb: var(--cgb-ig-heading-mb-desktop, 24px);
}

.cgb-image-grid__heading {
    width: 100%;
    text-align: center;
    margin: 0 0 var(--cgb-ig-heading-mb) 0;
}

.cgb-image-grid__title {
    margin: 0 0 var(--cgb-ig-title-mb) 0;
    font-size: var(--cgb-ig-title-fs);
    line-height: var(--cgb-ig-title-lh);
    font-weight: var(--cgb-ig-title-fw);
    letter-spacing: var(--cgb-ig-title-ls);
    color: var(--cgb-ig-title-color);
}

.cgb-image-grid__subtitle {
    margin: var(--cgb-ig-sub-mt) 0 0 0;
    font-size: var(--cgb-ig-sub-fs);
    line-height: var(--cgb-ig-sub-lh);
    font-weight: var(--cgb-ig-sub-fw);
    letter-spacing: var(--cgb-ig-sub-ls);
    color: var(--cgb-ig-sub-color);
}

.cgb-image-grid-wrapper {
    display: grid;
    grid-template-columns: repeat(var(--cgb-grid-cols, 4), 1fr);
    gap: var(--cgb-grid-gap, 0px);
}

/* Responsive */
@media (max-width: 1024px) {
    .cgb-image-grid-container {
        --cgb-ig-pt: var(--cgb-ig-pt-tablet, var(--cgb-ig-pt-desktop, 0px));
        --cgb-ig-pb: var(--cgb-ig-pb-tablet, var(--cgb-ig-pb-desktop, 0px));
        --cgb-ig-ot-fs: var(--cgb-ig-ot-fs-tablet, var(--cgb-ig-ot-fs-desktop, 16px));
        --cgb-ig-ot-lh: var(--cgb-ig-ot-lh-tablet, var(--cgb-ig-ot-lh-desktop, 1.2));
        --cgb-ig-ot-fw: var(--cgb-ig-ot-fw-tablet, var(--cgb-ig-ot-fw-desktop, 700));
        --cgb-ig-ot-ls: var(--cgb-ig-ot-ls-tablet, var(--cgb-ig-ot-ls-desktop, 0em));
        --cgb-ig-ot-color: var(--cgb-ig-ot-color-tablet, var(--cgb-ig-ot-color-desktop, inherit));
        --cgb-ig-os-fs: var(--cgb-ig-os-fs-tablet, var(--cgb-ig-os-fs-desktop, 14px));
        --cgb-ig-os-lh: var(--cgb-ig-os-lh-tablet, var(--cgb-ig-os-lh-desktop, 1.2));
        --cgb-ig-os-fw: var(--cgb-ig-os-fw-tablet, var(--cgb-ig-os-fw-desktop, 400));
        --cgb-ig-os-ls: var(--cgb-ig-os-ls-tablet, var(--cgb-ig-os-ls-desktop, 0em));
        --cgb-ig-os-color: var(--cgb-ig-os-color-tablet, var(--cgb-ig-os-color-desktop, inherit));

        --cgb-ig-title-fs: var(--cgb-ig-title-fs-tablet, var(--cgb-ig-title-fs-desktop, 40px));
        --cgb-ig-title-lh: var(--cgb-ig-title-lh-tablet, var(--cgb-ig-title-lh-desktop, 1.2));
        --cgb-ig-title-fw: var(--cgb-ig-title-fw-tablet, var(--cgb-ig-title-fw-desktop, 700));
        --cgb-ig-title-ls: var(--cgb-ig-title-ls-tablet, var(--cgb-ig-title-ls-desktop, 0em));
        --cgb-ig-title-color: var(--cgb-ig-title-color-tablet, var(--cgb-ig-title-color-desktop, inherit));
        --cgb-ig-title-mb: var(--cgb-ig-title-mb-tablet, var(--cgb-ig-title-mb-desktop, 8px));

        --cgb-ig-sub-fs: var(--cgb-ig-sub-fs-tablet, var(--cgb-ig-sub-fs-desktop, 18px));
        --cgb-ig-sub-lh: var(--cgb-ig-sub-lh-tablet, var(--cgb-ig-sub-lh-desktop, 1.6));
        --cgb-ig-sub-fw: var(--cgb-ig-sub-fw-tablet, var(--cgb-ig-sub-fw-desktop, 400));
        --cgb-ig-sub-ls: var(--cgb-ig-sub-ls-tablet, var(--cgb-ig-sub-ls-desktop, 0em));
        --cgb-ig-sub-color: var(--cgb-ig-sub-color-tablet, var(--cgb-ig-sub-color-desktop, inherit));
        --cgb-ig-sub-mt: var(--cgb-ig-sub-mt-tablet, var(--cgb-ig-sub-mt-desktop, 0px));

        --cgb-ig-heading-mb: var(--cgb-ig-heading-mb-tablet, var(--cgb-ig-heading-mb-desktop, 24px));
    }

    .cgb-image-grid-wrapper {
        grid-template-columns: repeat(var(--cgb-grid-cols-tablet, 2), 1fr) !important;
    }
}

@media (max-width: 600px) {
    .ccb-cta-banner__layout {
        flex-direction: column;
        align-items: stretch;
    }

    .ccb-cta-banner__media img {
        max-width: 100%;
    }

    .ccb-cta-banner__button {
        font-size: var(--ccb-cta-button-size-mobile, var(--ccb-cta-button-size-tablet, var(--ccb-cta-button-size-desktop, 16px)));
    }

    .cgb-image-grid-wrapper {
        grid-template-columns: repeat(var(--cgb-grid-cols-mobile, 1), 1fr) !important;
    }

    .cgb-image-grid-container {
        --cgb-ig-pt: var(--cgb-ig-pt-mobile, var(--cgb-ig-pt-tablet, var(--cgb-ig-pt-desktop, 0px)));
        --cgb-ig-pb: var(--cgb-ig-pb-mobile, var(--cgb-ig-pb-tablet, var(--cgb-ig-pb-desktop, 0px)));
        --cgb-ig-ot-fs: var(--cgb-ig-ot-fs-mobile, var(--cgb-ig-ot-fs-tablet, var(--cgb-ig-ot-fs-desktop, 16px)));
        --cgb-ig-ot-lh: var(--cgb-ig-ot-lh-mobile, var(--cgb-ig-ot-lh-tablet, var(--cgb-ig-ot-lh-desktop, 1.2)));
        --cgb-ig-ot-fw: var(--cgb-ig-ot-fw-mobile, var(--cgb-ig-ot-fw-tablet, var(--cgb-ig-ot-fw-desktop, 700)));
        --cgb-ig-ot-ls: var(--cgb-ig-ot-ls-mobile, var(--cgb-ig-ot-ls-tablet, var(--cgb-ig-ot-ls-desktop, 0em)));
        --cgb-ig-ot-color: var(--cgb-ig-ot-color-mobile, var(--cgb-ig-ot-color-tablet, var(--cgb-ig-ot-color-desktop, inherit)));
        --cgb-ig-os-fs: var(--cgb-ig-os-fs-mobile, var(--cgb-ig-os-fs-tablet, var(--cgb-ig-os-fs-desktop, 14px)));
        --cgb-ig-os-lh: var(--cgb-ig-os-lh-mobile, var(--cgb-ig-os-lh-tablet, var(--cgb-ig-os-lh-desktop, 1.2)));
        --cgb-ig-os-fw: var(--cgb-ig-os-fw-mobile, var(--cgb-ig-os-fw-tablet, var(--cgb-ig-os-fw-desktop, 400)));
        --cgb-ig-os-ls: var(--cgb-ig-os-ls-mobile, var(--cgb-ig-os-ls-tablet, var(--cgb-ig-os-ls-desktop, 0em)));
        --cgb-ig-os-color: var(--cgb-ig-os-color-mobile, var(--cgb-ig-os-color-tablet, var(--cgb-ig-os-color-desktop, inherit)));

        --cgb-ig-title-fs: var(--cgb-ig-title-fs-mobile, var(--cgb-ig-title-fs-tablet, var(--cgb-ig-title-fs-desktop, 40px)));
        --cgb-ig-title-lh: var(--cgb-ig-title-lh-mobile, var(--cgb-ig-title-lh-tablet, var(--cgb-ig-title-lh-desktop, 1.2)));
        --cgb-ig-title-fw: var(--cgb-ig-title-fw-mobile, var(--cgb-ig-title-fw-tablet, var(--cgb-ig-title-fw-desktop, 700)));
        --cgb-ig-title-ls: var(--cgb-ig-title-ls-mobile, var(--cgb-ig-title-ls-tablet, var(--cgb-ig-title-ls-desktop, 0em)));
        --cgb-ig-title-color: var(--cgb-ig-title-color-mobile, var(--cgb-ig-title-color-tablet, var(--cgb-ig-title-color-desktop, inherit)));
        --cgb-ig-title-mb: var(--cgb-ig-title-mb-mobile, var(--cgb-ig-title-mb-tablet, var(--cgb-ig-title-mb-desktop, 8px)));

        --cgb-ig-sub-fs: var(--cgb-ig-sub-fs-mobile, var(--cgb-ig-sub-fs-tablet, var(--cgb-ig-sub-fs-desktop, 18px)));
        --cgb-ig-sub-lh: var(--cgb-ig-sub-lh-mobile, var(--cgb-ig-sub-lh-tablet, var(--cgb-ig-sub-lh-desktop, 1.6)));
        --cgb-ig-sub-fw: var(--cgb-ig-sub-fw-mobile, var(--cgb-ig-sub-fw-tablet, var(--cgb-ig-sub-fw-desktop, 400)));
        --cgb-ig-sub-ls: var(--cgb-ig-sub-ls-mobile, var(--cgb-ig-sub-ls-tablet, var(--cgb-ig-sub-ls-desktop, 0em)));
        --cgb-ig-sub-color: var(--cgb-ig-sub-color-mobile, var(--cgb-ig-sub-color-tablet, var(--cgb-ig-sub-color-desktop, inherit)));
        --cgb-ig-sub-mt: var(--cgb-ig-sub-mt-mobile, var(--cgb-ig-sub-mt-tablet, var(--cgb-ig-sub-mt-desktop, 0px)));

        --cgb-ig-heading-mb: var(--cgb-ig-heading-mb-mobile, var(--cgb-ig-heading-mb-tablet, var(--cgb-ig-heading-mb-desktop, 24px)));
    }
}

/* Item Base */
.cgb-image-grid-item {
    position: relative;
    width: 100%;
    /* Switched from aspect-ratio padding to fixed height as requested */
    height: var(--cgb-row-height, 300px);
    overflow: hidden;
    background: #f0f0f0;
    display: block;
    text-decoration: none !important;
    border: none;
}

a.cgb-image-grid-item {
    color: inherit;
    cursor: pointer;
}

.cgb-image-grid-item__inner,
.cgb-image-grid-item__image-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.cgb-image-grid-img,
.cgb-image-grid-item__image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.3s ease;
}

/* Hover Effects */
.cgb-image-grid-item:hover .cgb-image-grid-img {
    transform: scale(1.05);
}

a.cgb-image-grid-item:hover .cgb-image-grid-img {
    filter: brightness(1.1);
}

/* Overlay Content */
.cgb-image-grid-item__content,
.cgb-image-grid-item__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px 15px;
    text-align: center;
    color: #fff;
    z-index: 2;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 100%);
    pointer-events: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

.cgb-image-grid-item__overlay>* {
    pointer-events: auto;
}

.cgb-image-grid-item__title {
    font-size: var(--cgb-ig-ot-fs);
    font-weight: var(--cgb-ig-ot-fw);
    margin-bottom: 4px;
    line-height: var(--cgb-ig-ot-lh);
    letter-spacing: var(--cgb-ig-ot-ls);
    color: var(--cgb-ig-ot-color);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}

.cgb-image-grid-item__icon {
    display: block;
    width: 32px;
    height: 32px;
    object-fit: contain;
    margin: 0 auto 8px auto;
}

.cgb-image-grid-item__subtitle {
    font-size: var(--cgb-ig-os-fs);
    font-weight: var(--cgb-ig-os-fw);
    opacity: 0.95;
    line-height: var(--cgb-ig-os-lh);
    letter-spacing: var(--cgb-ig-os-ls);
    color: var(--cgb-ig-os-color);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}

/* Editor Specific Controls */
.cgb-grid-item-controls {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 10;
    display: flex;
    gap: 4px;
}

.cgb-grid-control-btn {
    background: rgba(255, 255, 255, 0.95) !important;
    border-radius: 4px;
    padding: 2px !important;
    min-width: 24px !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid #ddd !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.cgb-grid-control-btn.is-destructive {
    color: #d63638 !important;
}

.cgb-grid-control-btn.has-link {
    background: #e6f7ff !important;
    border-color: #007cba !important;
}

/* Link Editor Mode */
.cgb-grid-link-editor {
    background: #fff;
    color: #333;
    padding: 10px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    text-align: center;
}

.cgb-grid-link-editor .components-base-control__label {
    color: #333;
    font-size: 11px;
    margin-bottom: 4px;
}
.cgb-grid-link-editor input {
    font-size: 13px;
    padding: 6px;
}

.components-placeholder {
    grid-column: 1 / -1;
    background: #f8f9fa;
    border: 1px dashed #ccc;
    padding: 40px;
}/* Media List block styles */

/* ===========================
   MEDIA LIST (ccb/media-list)
=========================== */

.ccb-media-list {
    position: relative;
    width: 100%;
    display: flex;
    /* Stretches children height */
    align-items: stretch;

    margin-top: var(--ccb-ml-mt-desktop, 0px);
    margin-bottom: var(--ccb-ml-mb-desktop, 0px);
    margin-left: 0;
    margin-right: 0;

    box-shadow: var(--ccb-ml-shadow, none);

    overflow: hidden;
    padding: 0;

    /* Variable Defaults */
    --ccb-ml-image-fit: cover;
    /* HARDCODED DEFAULT */
}

/* Height Modes */
.ccb-media-list--height-min {
    /* Default behavior: Expands if content is larger */
    min-height: var(--ccb-ml-row-h-desktop, 400px);
}

.ccb-media-list--height-fixed {
    /* Fixed behavior: Exact height. */
    height: var(--ccb-ml-row-h-desktop, 400px);
    min-height: auto;
}

/* Inner Container */
.ccb-media-list__inner {
    display: flex;
    flex: 1 1 auto;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Position */
.ccb-media-list--img-left .ccb-media-list__inner {
    flex-direction: row;
}

.ccb-media-list--img-right .ccb-media-list__inner {
    flex-direction: row-reverse;
}

/* Vertical Align (Applies to CONTENT side only) */
.ccb-media-list--valign-top .ccb-media-list__inner {
    align-items: flex-start;
}

.ccb-media-list--valign-center .ccb-media-list__inner {
    align-items: center;
}

.ccb-media-list--valign-bottom .ccb-media-list__inner {
    align-items: flex-end;
}

/* Image Column: 50% Explicit, Flush */
.ccb-media-list__image {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
    padding: 0;
    /* FLUSH */
    margin: 0;
    min-height: 100%;
    /* Always stretch to full height regardless of parent align-items */
    align-self: stretch;
    /* Fill height of flex parent */
    display: flex;
}

.ccb-media-list__image img {
    display: block;
    width: 100%;
    height: 100%;
    /* Force height to fill column */
    min-height: 100%;

    /* ALWAYS COVER */
    object-fit: var(--ccb-ml-image-fit, cover);
    object-position: center;
    border-radius: 0;
}

.ccb-media-list__youtube-preview {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: transparent;
}

.ccb-media-list__youtube-poster {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: var(--ccb-ml-image-fit, cover);
    object-position: center;
}

.ccb-media-list__youtube-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    transform: translate(-50%, -50%);
    background: rgba(255, 0, 0, 0.9);
    border-radius: 4px;
}

.ccb-media-list__youtube-play:before {
    content: '';
    position: absolute;
    left: 28px;
    top: 16px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 14px solid #fff;
}

.ccb-media-list__youtube-preview.is-playing {
    cursor: default;
}

/* Content Column: 50% Explicit, with Padding */
.ccb-media-list__content {
    flex: 0 0 50%;
    max-width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;

    /* Internal Padding from Attributes */
    padding-top: var(--ccb-ml-pt-desktop, 60px);
    padding-bottom: var(--ccb-ml-pb-desktop, 60px);
    padding-left: var(--ccb-ml-pl-desktop, 60px);
    padding-right: var(--ccb-ml-pr-desktop, 60px);

    box-sizing: border-box;
    background-color: transparent;
    /* allow parent bg to show if needed, but usually block has bg */

    text-align: var(--ccb-ml-text-align-desktop, left);
}

/* Typography & Lists */
.ccb-media-list__heading {
    margin: 0 0 16px 0;
    line-height: var(--ccb-ml-heading-lh-desktop, 1.2);
    font-size: var(--ccb-ml-heading-fs-desktop, 32px);
    color: var(--ccb-ml-cta-color, #3b82f6);
}

.ccb-media-list__divider {
    margin-bottom: 24px;
    background-color: var(--ccb-ml-divider-color, #3b82f6);
    height: var(--ccb-ml-divider-h-desktop, 3px);
    width: var(--ccb-ml-divider-w-desktop, 60px);

    margin-left: var(--ccb-ml-divider-ml-desktop, 0);
    margin-right: var(--ccb-ml-divider-mr-desktop, 0);
}

.ccb-media-list__description {
    margin: 0 0 20px 0;
    font-size: var(--ccb-ml-list-fs-desktop, 16px);
    line-height: var(--ccb-ml-list-lh-desktop, 1.6);
    color: var(--ccb-ml-list-color, #374151);
}

.ccb-media-list__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: var(--ccb-ml-list-color, #374151);
}

.ccb-media-list__list-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: var(--ccb-ml-list-fs-desktop, 16px);
    line-height: var(--ccb-ml-list-lh-desktop, 1.6);
}

.ccb-media-list__note {
    margin: 20px 0 0 0;
    font-size: var(--ccb-ml-list-fs-desktop, 16px);
    line-height: var(--ccb-ml-list-lh-desktop, 1.6);
    color: var(--ccb-ml-list-color, #374151);
}

/* Updated selector to use span color if set inline, or inherit */
.ccb-media-list__bullet {
    flex: 0 0 auto;
    margin-top: 2px;
    font-weight: bold;
    color: var(--ccb-ml-divider-color, #3b82f6);
    /* Use divider color for bullet by default per JS logic */
}

/* CTA */
.ccb-media-list__cta-link {
    display: inline-block;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
    transition: opacity 0.2s;
    margin-top: 24px;
    color: var(--ccb-ml-cta-color, #3b82f6);
}

.ccb-media-list__cta-link:hover {
    opacity: 0.8;
}

/* Placeholder (scoped) */
.ccb-media-list .components-placeholder {
    padding: 20px;
    background: #f0f0f0;
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
}

/* ... (unchanged) ... */

/* =========================================
   RESPONSIVE
   ========================================= */

/* Tablet (1024px and down) */
@media (max-width: 1024px) {

    .ccb-media-list {
        margin-top: var(--ccb-ml-mt-tablet, var(--ccb-ml-mt-desktop, 0px));
        margin-bottom: var(--ccb-ml-mb-tablet, var(--ccb-ml-mb-desktop, 0px));
    }

    .ccb-media-list--height-min {
        min-height: var(--ccb-ml-row-h-tablet, var(--ccb-ml-row-h-desktop, 400px));
    }

    .ccb-media-list--height-fixed {
        height: auto;
        min-height: var(--ccb-ml-row-h-tablet, var(--ccb-ml-row-h-desktop, 400px));
    }

    .ccb-media-list__inner {
        flex-direction: column !important;
        /* Stack */
    }

    .ccb-media-list__image,
    .ccb-media-list__content {
        flex: 1 1 100%;
        max-width: 100%;
        width: 100%;
    }

    .ccb-media-list__image {
        height: 300px;
        min-height: 300px;
    }

    .ccb-media-list__content {
        padding-top: var(--ccb-ml-pt-tablet, 32px);
        padding-bottom: var(--ccb-ml-pb-tablet, 32px);
        padding-left: var(--ccb-ml-pl-tablet, 24px);
        padding-right: var(--ccb-ml-pr-tablet, 24px);

        text-align: var(--ccb-ml-text-align-tablet, var(--ccb-ml-text-align-desktop, left));
    }

    .ccb-media-list__heading {
        color: var(--ccb-ml-cta-color-tablet, var(--ccb-ml-cta-color, #3b82f6));
        font-size: var(--ccb-ml-heading-fs-tablet, var(--ccb-ml-heading-fs-desktop, 32px));
        line-height: var(--ccb-ml-heading-lh-tablet, var(--ccb-ml-heading-lh-desktop, 1.2));
    }

    .ccb-media-list__list {
        color: var(--ccb-ml-list-color-tablet, var(--ccb-ml-list-color, #374151));
    }

    .ccb-media-list__cta-link {
        color: var(--ccb-ml-cta-color-tablet, var(--ccb-ml-cta-color, #3b82f6));
    }

    .ccb-media-list__divider {
        height: var(--ccb-ml-divider-h-tablet, var(--ccb-ml-divider-h-desktop, 3px));
        width: var(--ccb-ml-divider-w-tablet, var(--ccb-ml-divider-w-desktop, 60px));

        margin-left: var(--ccb-ml-divider-ml-tablet, var(--ccb-ml-divider-ml-desktop, 0));
        margin-right: var(--ccb-ml-divider-mr-tablet, var(--ccb-ml-divider-mr-desktop, 0));
    }

    .ccb-media-list__list-item {
        font-size: var(--ccb-ml-list-fs-tablet, var(--ccb-ml-list-fs-desktop, 16px));
        line-height: var(--ccb-ml-list-lh-tablet, var(--ccb-ml-list-lh-desktop, 1.6));
    }
}

/* Mobile (600px and down) */
@media (max-width: 600px) {

    .ccb-media-list {
        margin-top: var(--ccb-ml-mt-mobile, var(--ccb-ml-mt-tablet, var(--ccb-ml-mt-desktop, 0px)));
        margin-bottom: var(--ccb-ml-mb-mobile, var(--ccb-ml-mb-tablet, var(--ccb-ml-mb-desktop, 0px)));
    }
    .ccb-media-list--height-min {
        min-height: var(--ccb-ml-row-h-mobile, var(--ccb-ml-row-h-tablet, var(--ccb-ml-row-h-desktop, 400px)));
    }

    .ccb-media-list--height-fixed {
        height: auto;
        min-height: var(--ccb-ml-row-h-mobile, var(--ccb-ml-row-h-tablet, var(--ccb-ml-row-h-desktop, 400px)));
    }

    .ccb-media-list__content {
        padding-top: var(--ccb-ml-pt-mobile, var(--ccb-ml-pt-tablet, 24px));
        padding-bottom: var(--ccb-ml-pb-mobile, var(--ccb-ml-pb-tablet, 24px));
        padding-left: var(--ccb-ml-pl-mobile, var(--ccb-ml-pl-tablet, 20px));
        padding-right: var(--ccb-ml-pr-mobile, var(--ccb-ml-pr-tablet, 20px));

        text-align: var(--ccb-ml-text-align-mobile, var(--ccb-ml-text-align-tablet, var(--ccb-ml-text-align-desktop, left)));
    }

    .ccb-media-list__image {
        min-height: 250px;
        height: 250px;
    }

    .ccb-media-list__heading {
        color: var(--ccb-ml-cta-color-mobile, var(--ccb-ml-cta-color-tablet, var(--ccb-ml-cta-color, #3b82f6)));
        font-size: var(--ccb-ml-heading-fs-mobile, var(--ccb-ml-heading-fs-tablet, var(--ccb-ml-heading-fs-desktop, 32px)));
        line-height: var(--ccb-ml-heading-lh-mobile, var(--ccb-ml-heading-lh-tablet, var(--ccb-ml-heading-lh-desktop, 1.2)));
    }

    .ccb-media-list__list {
        color: var(--ccb-ml-list-color-mobile, var(--ccb-ml-list-color-tablet, var(--ccb-ml-list-color, #374151)));
    }

    .ccb-media-list__cta-link {
        color: var(--ccb-ml-cta-color-mobile, var(--ccb-ml-cta-color-tablet, var(--ccb-ml-cta-color, #3b82f6)));
    }

    .ccb-media-list__divider {
        height: var(--ccb-ml-divider-h-mobile, var(--ccb-ml-divider-h-tablet, var(--ccb-ml-divider-h-desktop, 3px)));
        width: var(--ccb-ml-divider-w-mobile, var(--ccb-ml-divider-w-tablet, var(--ccb-ml-divider-w-desktop, 60px)));

        margin-left: var(--ccb-ml-divider-ml-mobile, var(--ccb-ml-divider-ml-tablet, var(--ccb-ml-divider-ml-desktop, 0)));
        margin-right: var(--ccb-ml-divider-mr-mobile, var(--ccb-ml-divider-mr-tablet, var(--ccb-ml-divider-mr-desktop, 0)));
    }

    .ccb-media-list__list-item {
        font-size: var(--ccb-ml-list-fs-mobile, var(--ccb-ml-list-fs-tablet, var(--ccb-ml-list-fs-desktop, 16px)));
        line-height: var(--ccb-ml-list-lh-mobile, var(--ccb-ml-list-lh-tablet, var(--ccb-ml-list-lh-desktop, 1.6)));
    }
}

/* ===========================
   MEDIA TEXT (ccb/media-text)
=========================== */

.ccb-media-text {
    position: relative;
    width: 100%;
    display: flex;
    align-items: stretch;

    margin-top: var(--ccb-mtx-mt-desktop, 0px);
    margin-bottom: var(--ccb-mtx-mb-desktop, 0px);

    box-shadow: var(--ccb-mtx-shadow, none);

    overflow: hidden;
    padding: 0;
}

.ccb-media-text--has-overlay::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient(
        var(--ccb-mtx-ov-angle, 180deg),
        var(--ccb-mtx-ov-start, rgba(0, 0, 0, 0)),
        var(--ccb-mtx-ov-end, rgba(0, 0, 0, 0))
    );
    z-index: 0;
}

/* Ensure fullwidth breakout wins vs width:100% */
.ccb-media-text.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-media-text--height-min {
    min-height: var(--ccb-mtx-row-h-desktop, 400px);
}

.ccb-media-text--height-min .ccb-media-text__inner {
    min-height: var(--ccb-mtx-row-h-desktop, 400px);
}

.ccb-media-text--height-fixed {
    height: var(--ccb-mtx-row-h-desktop, 400px);
    min-height: auto;
}

.ccb-media-text--height-fixed .ccb-media-text__inner {
    height: var(--ccb-mtx-row-h-desktop, 400px);
}

.ccb-media-text__inner {
    display: flex;
    flex: 1 1 auto;
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
}

.ccb-media-text--img-left .ccb-media-text__inner {
    flex-direction: row;
}

.ccb-media-text--img-right .ccb-media-text__inner {
    flex-direction: row-reverse;
}

.ccb-media-text--valign-top .ccb-media-text__inner {
    align-items: flex-start;
}

.ccb-media-text--valign-center .ccb-media-text__inner {
    align-items: center;
}

.ccb-media-text--valign-bottom .ccb-media-text__inner {
    align-items: flex-end;
}

.ccb-media-text__image {
    flex: 0 0 50%;
    max-width: 50%;
    position: relative;
    padding: 0;
    margin: 0;
    margin-bottom: var(--ccb-mtx-media-mb-desktop, 0px);
    height: 100%;
    display: flex;
}

.ccb-media-text__image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
}

.ccb-media-text__image iframe {
    display: block;
    width: 100%;
    height: 100%;
    flex: 1 1 auto;
    aspect-ratio: auto;
    border: 0;
}

.ccb-media-text__youtube-preview {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: transparent;
}

/* Editor placeholder should not mask the section background */
.ccb-media-text__image .components-placeholder {
    background: transparent;
    box-shadow: none;
    border: 0;
}

.ccb-media-text__image .components-placeholder__label,
.ccb-media-text__image .components-placeholder__instructions {
    color: inherit;
}

.ccb-media-text__youtube-poster {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.ccb-media-text__youtube-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 68px;
    height: 48px;
    transform: translate(-50%, -50%);
    background: rgba(255, 0, 0, 0.9);
    border-radius: 4px;
}

.ccb-media-text__youtube-play:before {
    content: '';
    position: absolute;
    left: 28px;
    top: 16px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 14px solid #fff;
}

.ccb-media-text__content {
    flex: 0 0 50%;
    max-width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;

    padding-top: var(--ccb-mtx-pt-desktop, 60px);
    padding-bottom: var(--ccb-mtx-pb-desktop, 60px);
    padding-left: var(--ccb-mtx-pl-desktop, 60px);
    padding-right: var(--ccb-mtx-pr-desktop, 60px);

    text-align: var(--ccb-mtx-text-align-desktop, left);
}

.ccb-media-text__eyebrow {
    margin: 0 0 var(--ccb-mtx-eyebrow-mb-desktop, 12px) 0;
    line-height: var(--ccb-mtx-eyebrow-lh-desktop, 1.4);
    font-size: var(--ccb-mtx-eyebrow-fs-desktop, 14px);
    color: var(--ccb-mtx-eyebrow-color, #3b82f6);
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.02em;
}

.ccb-media-text__title {
    margin: var(--ccb-mtx-title-mt-desktop, 0px) 0 var(--ccb-mtx-title-mb-desktop, 16px) 0;
    line-height: var(--ccb-mtx-title-lh-desktop, 1.2);
    font-size: var(--ccb-mtx-title-fs-desktop, 32px);
    color: var(--ccb-mtx-title-color, #111827);
}

.ccb-media-text__description {
    margin: 0 0 var(--ccb-mtx-desc-mb-desktop, 20px) 0;
    line-height: var(--ccb-mtx-desc-lh-desktop, 1.6);
    font-size: var(--ccb-mtx-desc-fs-desktop, 16px);
    color: var(--ccb-mtx-desc-color, #374151);
}

.ccb-media-text__description p {
    margin: 0 0 1em 0;
}

.ccb-media-text__description p:last-child {
    margin-bottom: 0;
}

.ccb-media-text__cta {
    margin-top: var(--ccb-mtx-cta-mt-desktop, 0px);
}

.ccb-media-text__cta-link {
    display: inline-block;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
    transition: opacity 0.2s;
    color: var(--ccb-mtx-cta-color, #3b82f6);
    line-height: var(--ccb-mtx-cta-lh-desktop, 1.4);
    font-size: var(--ccb-mtx-cta-fs-desktop, 16px);
}

.ccb-media-text__cta-link:hover {
    opacity: 0.8;
}

/* Partner card variant — contained logos instead of cover photos */
.partner-card .ccb-media-text__image {
    flex: 0 0 280px;
    max-width: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: #f8fafc;
}

.partner-card .ccb-media-text__image img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 140px;
    min-height: auto;
    object-fit: contain;
    object-position: center;
}

.partner-card .ccb-media-text__content {
    flex: 1 1 0%;
    max-width: none;
}

@media (max-width: 1024px) {
    .partner-card .ccb-media-text__image {
        flex: 0 0 auto;
        max-width: 100%;
        height: auto;
        min-height: auto;
        padding: 24px 40px;
    }

    .partner-card .ccb-media-text__image img {
        max-height: 100px;
    }
}

@media (max-width: 600px) {
    .partner-card .ccb-media-text__image {
        padding: 20px 24px;
    }

    .partner-card .ccb-media-text__image img {
        max-height: 80px;
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .ccb-media-text {
        margin-top: var(--ccb-mtx-mt-tablet, var(--ccb-mtx-mt-desktop, 0px));
        margin-bottom: var(--ccb-mtx-mb-tablet, var(--ccb-mtx-mb-desktop, 0px));
    }

    .ccb-media-text--height-min {
        min-height: var(--ccb-mtx-row-h-tablet, var(--ccb-mtx-row-h-desktop, 400px));
    }

    .ccb-media-text--height-fixed {
        height: auto;
        min-height: var(--ccb-mtx-row-h-tablet, var(--ccb-mtx-row-h-desktop, 400px));
    }

    .ccb-media-text__inner {
        flex-direction: column !important;
    }

    .ccb-media-text__image,
    .ccb-media-text__content {
        flex: 1 1 100%;
        max-width: 100%;
        width: 100%;
    }

    .ccb-media-text__image {
        height: 300px;
        min-height: 300px;
        margin-bottom: var(--ccb-mtx-media-mb-tablet, var(--ccb-mtx-media-mb-desktop, 0px));
    }

    .ccb-media-text__content {
        padding-top: var(--ccb-mtx-pt-tablet, var(--ccb-mtx-pt-desktop, 60px));
        padding-bottom: var(--ccb-mtx-pb-tablet, var(--ccb-mtx-pb-desktop, 60px));
        padding-left: var(--ccb-mtx-pl-tablet, var(--ccb-mtx-pl-desktop, 60px));
        padding-right: var(--ccb-mtx-pr-tablet, var(--ccb-mtx-pr-desktop, 60px));

        text-align: var(--ccb-mtx-text-align-tablet, var(--ccb-mtx-text-align-desktop, left));
    }

    .ccb-media-text__eyebrow {
        color: var(--ccb-mtx-eyebrow-color-tablet, var(--ccb-mtx-eyebrow-color, #3b82f6));
        font-size: var(--ccb-mtx-eyebrow-fs-tablet, var(--ccb-mtx-eyebrow-fs-desktop, 14px));
        line-height: var(--ccb-mtx-eyebrow-lh-tablet, var(--ccb-mtx-eyebrow-lh-desktop, 1.4));
        margin-bottom: var(--ccb-mtx-eyebrow-mb-tablet, var(--ccb-mtx-eyebrow-mb-desktop, 12px));
    }

    .ccb-media-text__title {
        color: var(--ccb-mtx-title-color-tablet, var(--ccb-mtx-title-color, #111827));
        font-size: var(--ccb-mtx-title-fs-tablet, var(--ccb-mtx-title-fs-desktop, 32px));
        line-height: var(--ccb-mtx-title-lh-tablet, var(--ccb-mtx-title-lh-desktop, 1.2));
        margin-top: var(--ccb-mtx-title-mt-tablet, var(--ccb-mtx-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-mtx-title-mb-tablet, var(--ccb-mtx-title-mb-desktop, 16px));
    }

    .ccb-media-text__description {
        color: var(--ccb-mtx-desc-color-tablet, var(--ccb-mtx-desc-color, #374151));
        font-size: var(--ccb-mtx-desc-fs-tablet, var(--ccb-mtx-desc-fs-desktop, 16px));
        line-height: var(--ccb-mtx-desc-lh-tablet, var(--ccb-mtx-desc-lh-desktop, 1.6));
        margin-bottom: var(--ccb-mtx-desc-mb-tablet, var(--ccb-mtx-desc-mb-desktop, 20px));
    }

    .ccb-media-text__cta {
        margin-top: var(--ccb-mtx-cta-mt-tablet, var(--ccb-mtx-cta-mt-desktop, 0px));
    }

    .ccb-media-text__cta-link {
        color: var(--ccb-mtx-cta-color-tablet, var(--ccb-mtx-cta-color, #3b82f6));
        font-size: var(--ccb-mtx-cta-fs-tablet, var(--ccb-mtx-cta-fs-desktop, 16px));
        line-height: var(--ccb-mtx-cta-lh-tablet, var(--ccb-mtx-cta-lh-desktop, 1.4));
    }
}

/* Mobile */
@media (max-width: 600px) {
    .ccb-media-text {
        margin-top: var(--ccb-mtx-mt-mobile, var(--ccb-mtx-mt-tablet, var(--ccb-mtx-mt-desktop, 0px)));
        margin-bottom: var(--ccb-mtx-mb-mobile, var(--ccb-mtx-mb-tablet, var(--ccb-mtx-mb-desktop, 0px)));
    }

    .ccb-media-text--height-min {
        min-height: var(--ccb-mtx-row-h-mobile, var(--ccb-mtx-row-h-tablet, var(--ccb-mtx-row-h-desktop, 400px)));
    }

    .ccb-media-text--height-fixed {
        height: auto;
        min-height: var(--ccb-mtx-row-h-mobile, var(--ccb-mtx-row-h-tablet, var(--ccb-mtx-row-h-desktop, 400px)));
    }

    .ccb-media-text__content {
        padding-top: var(--ccb-mtx-pt-mobile, var(--ccb-mtx-pt-tablet, var(--ccb-mtx-pt-desktop, 60px)));
        padding-bottom: var(--ccb-mtx-pb-mobile, var(--ccb-mtx-pb-tablet, var(--ccb-mtx-pb-desktop, 60px)));
        padding-left: var(--ccb-mtx-pl-mobile, var(--ccb-mtx-pl-tablet, var(--ccb-mtx-pl-desktop, 60px)));
        padding-right: var(--ccb-mtx-pr-mobile, var(--ccb-mtx-pr-tablet, var(--ccb-mtx-pr-desktop, 60px)));

        text-align: var(--ccb-mtx-text-align-mobile, var(--ccb-mtx-text-align-tablet, var(--ccb-mtx-text-align-desktop, left)));
    }

    .ccb-media-text__image {
        min-height: 250px;
        height: 250px;
        margin-bottom: var(--ccb-mtx-media-mb-mobile, var(--ccb-mtx-media-mb-tablet, var(--ccb-mtx-media-mb-desktop, 0px)));
    }

    .ccb-media-text__eyebrow {
        color: var(--ccb-mtx-eyebrow-color-mobile, var(--ccb-mtx-eyebrow-color-tablet, var(--ccb-mtx-eyebrow-color, #3b82f6)));
        font-size: var(--ccb-mtx-eyebrow-fs-mobile, var(--ccb-mtx-eyebrow-fs-tablet, var(--ccb-mtx-eyebrow-fs-desktop, 14px)));
        line-height: var(--ccb-mtx-eyebrow-lh-mobile, var(--ccb-mtx-eyebrow-lh-tablet, var(--ccb-mtx-eyebrow-lh-desktop, 1.4)));
        margin-bottom: var(--ccb-mtx-eyebrow-mb-mobile, var(--ccb-mtx-eyebrow-mb-tablet, var(--ccb-mtx-eyebrow-mb-desktop, 12px)));
    }

    .ccb-media-text__title {
        color: var(--ccb-mtx-title-color-mobile, var(--ccb-mtx-title-color-tablet, var(--ccb-mtx-title-color, #111827)));
        font-size: var(--ccb-mtx-title-fs-mobile, var(--ccb-mtx-title-fs-tablet, var(--ccb-mtx-title-fs-desktop, 32px)));
        line-height: var(--ccb-mtx-title-lh-mobile, var(--ccb-mtx-title-lh-tablet, var(--ccb-mtx-title-lh-desktop, 1.2)));
        margin-top: var(--ccb-mtx-title-mt-mobile, var(--ccb-mtx-title-mt-tablet, var(--ccb-mtx-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-mtx-title-mb-mobile, var(--ccb-mtx-title-mb-tablet, var(--ccb-mtx-title-mb-desktop, 16px)));
    }

    .ccb-media-text__description {
        color: var(--ccb-mtx-desc-color-mobile, var(--ccb-mtx-desc-color-tablet, var(--ccb-mtx-desc-color, #374151)));
        font-size: var(--ccb-mtx-desc-fs-mobile, var(--ccb-mtx-desc-fs-tablet, var(--ccb-mtx-desc-fs-desktop, 16px)));
        line-height: var(--ccb-mtx-desc-lh-mobile, var(--ccb-mtx-desc-lh-tablet, var(--ccb-mtx-desc-lh-desktop, 1.6)));
        margin-bottom: var(--ccb-mtx-desc-mb-mobile, var(--ccb-mtx-desc-mb-tablet, var(--ccb-mtx-desc-mb-desktop, 20px)));
    }

    .ccb-media-text__cta {
        margin-top: var(--ccb-mtx-cta-mt-mobile, var(--ccb-mtx-cta-mt-tablet, var(--ccb-mtx-cta-mt-desktop, 0px)));
    }

    .ccb-media-text__cta-link {
        color: var(--ccb-mtx-cta-color-mobile, var(--ccb-mtx-cta-color-tablet, var(--ccb-mtx-cta-color, #3b82f6)));
        font-size: var(--ccb-mtx-cta-fs-mobile, var(--ccb-mtx-cta-fs-tablet, var(--ccb-mtx-cta-fs-desktop, 16px)));
        line-height: var(--ccb-mtx-cta-lh-mobile, var(--ccb-mtx-cta-lh-tablet, var(--ccb-mtx-cta-lh-desktop, 1.4)));
    }
}

/* Page Header Block Styles */

.cgb-page-header {
    position: relative;
    background-color: var(--cgb-ph-bg, #0f172a);
    background-image: var(--cgb-ph-bg-img);
    background-position: var(--cgb-ph-bg-pos);
    background-size: cover;
    background-repeat: no-repeat;

    padding-top: var(--cgb-ph-pt-mobile, 60px);
    padding-bottom: var(--cgb-ph-pb-mobile, 60px);
    min-height: var(--cgb-ph-min-h-mobile, 200px);

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    color: #fff;
}

.cgb-page-header__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-color: var(--cgb-ph-overlay-col, #000);
    opacity: var(--cgb-ph-overlay-op, 0.7);
    /* If gradient is provided, it applies here. Note: opacity applies to whole div */
    background-image: var(--cgb-ph-overlay-grad, none);
}

.cgb-page-header__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Typography */
.cgb-page-header__title {
    font-size: var(--cgb-ph-t-fs-mobile, 28px) !important;
    line-height: var(--cgb-ph-t-lh, 1.2) !important;
    color: var(--cgb-ph-t-color, #fff) !important;
    margin-top: 0;
    margin-bottom: var(--cgb-ph-t-mb, 16px) !important;
    font-weight: 700 !important;
}

.cgb-page-header__sub {
    font-size: var(--cgb-ph-s-fs-mobile, 16px) !important;
    line-height: var(--cgb-ph-s-lh, 1.6) !important;
    color: var(--cgb-ph-s-color, #e2e8f0) !important;
    margin-bottom: var(--cgb-ph-s-mb, 0px) !important;
    max-width: 800px;
}

/* Tablet */
@media (min-width: 768px) {
    .cgb-page-header {
        padding-top: var(--cgb-ph-pt-tablet);
        padding-bottom: var(--cgb-ph-pb-tablet);
        min-height: var(--cgb-ph-min-h-tablet);
    }

    .cgb-page-header__title {
        font-size: var(--cgb-ph-t-fs-tablet) !important;
    }

    .cgb-page-header__sub {
        font-size: var(--cgb-ph-s-fs-tablet) !important;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    .cgb-page-header {
        padding-top: var(--cgb-ph-pt-desktop);
        padding-bottom: var(--cgb-ph-pb-desktop);
        min-height: var(--cgb-ph-min-h-desktop);
    }

    .cgb-page-header__title {
        font-size: var(--cgb-ph-t-fs-desktop) !important;
    }

    .cgb-page-header__sub {
        font-size: var(--cgb-ph-s-fs-desktop) !important;
    }
}/* Pre Footer (Mega Footer) Styles */

.cgb-pre-footer {
    display: block;
    box-sizing: border-box;
    width: 100%;

    --cgb-pf-py: var(--cgb-pf-py-desktop, 60px);
    --cgb-pf-mt: var(--cgb-pf-mt-desktop, 0px);
    --cgb-pf-mb: var(--cgb-pf-mb-desktop, 0px);
    --cgb-pf-gap: var(--cgb-pf-gap-desktop, 40px);
    --cgb-pf-section-gap: var(--cgb-pf-section-gap-desktop, 16px);
    --cgb-pf-h-fs: var(--cgb-pf-h-fs-desktop, 18px);
    --cgb-pf-h-mb: var(--cgb-pf-h-mb-desktop, 12px);
    --cgb-pf-item-fs: var(--cgb-pf-item-fs-desktop, 14px);
    --cgb-pf-item-mb: var(--cgb-pf-item-mb-desktop, 4px);

    margin-top: var(--cgb-pf-mt);
    margin-bottom: var(--cgb-pf-mb);
    padding-top: var(--cgb-pf-py);
    padding-bottom: var(--cgb-pf-py);
}

/* Frontend: ensure full-viewport background when using cgb--fullwidth */
.cgb-pre-footer.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: clip;
}

/* Main Container */
.cgb-pre-footer__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;

    display: grid;
    grid-template-columns: repeat(var(--cgb-pf-cols, 5), minmax(0, 1fr));
    gap: var(--cgb-pf-gap, 40px);
}

/* Editor layout fix: Make InnerBlocks wrappers transparent so columns become grid items */
.wp-block-ccb-pre-footer .cgb-pre-footer__inner > .block-editor-inner-blocks,
.wp-block-ccb-pre-footer .cgb-pre-footer__inner > .block-editor-inner-blocks > .block-editor-block-list__layout {
    display: contents;
}

/* Ensure the editor appender (+) isn't squeezed into a single grid column */
.wp-block-ccb-pre-footer .cgb-pre-footer__inner .block-list-appender {
    grid-column: 1 / -1;
}

/* Editor Full Width Override (editor-only) */
.block-editor-block-list__block.wp-block-ccb-pre-footer {
    max-width: none !important;
    width: 100% !important;
}

/* Columns */
.cgb-pre-footer__col {
    display: flex;
    flex-direction: column;
    gap: var(--cgb-pf-section-gap, 16px);
    min-width: 0;
}

/* Headings (Core Heading Block support) */
.cgb-pre-footer .wp-block-heading,
.cgb-pre-footer__heading,
.cgb-pre-footer__menu-title {
    color: var(--cgb-pf-text, #fff);
    font-size: var(--cgb-pf-h-fs, 18px) !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700 !important;
    margin-bottom: var(--cgb-pf-h-mb, 12px) !important;
    margin-top: 0 !important;
}

/* Lists (Core List Block support) */
.cgb-pre-footer .wp-block-list,
.cgb-pre-footer ul {
    list-style: none !important;
    display: inline-block;
    text-align: left;
    padding: 0 !important;
    margin: 0 !important;
}

.cgb-pre-footer .wp-block-list li,
.cgb-pre-footer ul li {
    margin-bottom: var(--cgb-pf-item-mb, 4px) !important;
    font-size: var(--cgb-pf-item-fs, 14px);
    line-height: 1.4;
    color: var(--cgb-pf-text, #fff) !important;
}

.cgb-pre-footer .wp-block-list a,
.cgb-pre-footer ul li a {
    color: inherit;
    text-decoration: none;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.cgb-pre-footer .wp-block-list a:hover,
.cgb-pre-footer ul li a:hover {
    opacity: 1;
}

/* Paragraphs */
.cgb-pre-footer p {
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 16px 0;
    color: var(--cgb-pf-text, #fff);
}

/* Images / Logos (Core Image + Site Logo) */
.cgb-pre-footer .wp-block-image,
.cgb-pre-footer .wp-block-site-logo {
    margin: 0;
}

/* Reduce gap between consecutive store badges (App Store + Google Play) */
.cgb-pre-footer__col > .wp-block-image + .wp-block-image {
    margin-top: calc(-1 * var(--cgb-pf-section-gap, 16px) + 6px);
}

.cgb-pre-footer .wp-block-image img,
.cgb-pre-footer .wp-block-site-logo img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Pre Footer Menu (pf-menu) */
.cgb-pre-footer__menu-section {
    display: block;
    min-width: 0;
}

.cgb-pre-footer__menu-list {
    list-style: none !important;
    display: inline-block;
    text-align: left;
    padding: 0 !important;
    margin: 0 !important;
}

.cgb-pre-footer__menu-item {
    margin-bottom: var(--cgb-pf-item-mb, 4px) !important;
}

.cgb-pre-footer__menu-link {
    color: inherit;
    text-decoration: none;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.cgb-pre-footer__menu-link:hover {
    opacity: 1;
}

/* Badges Block */
.cgb-pre-footer__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.cgb-pre-footer__badges img {
    width: 150px;
    height: auto;
    display: block;
}

/* Socials Block */
.cgb-pre-footer__socials {
    margin-top: 20px;
}

.cgb-soc-title {
    display: block;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 14px;
    color: var(--cgb-pf-text, #fff);
}

.cgb-social-row {
    display: flex;
    gap: 12px;
}

.cgb-soc-icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    transition: background 0.2s;
}

.cgb-soc-icon:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* Language Switcher Block */
.cgb-pre-footer__lang-switcher {
    margin-top: 10px;
    margin-bottom: 10px;
}

.cgb-pre-footer__lang-title {
    font-family: Lato, sans-serif;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--cgb-pf-text, #fff);
    margin-bottom: 8px !important;
    margin-top: 0 !important;
}

.cgb-pre-footer__lang-select {
    width: 100%;
    max-width: 250px;
    padding: 8px 10px;
    font-size: 14px;
    font-family: Lato, sans-serif;
    color: #333;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
    appearance: auto;
}

.cgb-pre-footer__lang-select:focus {
    outline: 2px solid #0073aa;
    outline-offset: -2px;
}

/* Mobile Stack */
@media (max-width: 1024px) {
    .cgb-pre-footer {
        --cgb-pf-py: var(--cgb-pf-py-tablet, var(--cgb-pf-py-desktop, 60px));
        --cgb-pf-mt: var(--cgb-pf-mt-tablet, var(--cgb-pf-mt-desktop, 0px));
        --cgb-pf-mb: var(--cgb-pf-mb-tablet, var(--cgb-pf-mb-desktop, 0px));
        --cgb-pf-gap: var(--cgb-pf-gap-tablet, var(--cgb-pf-gap-desktop, 40px));
        --cgb-pf-section-gap: var(--cgb-pf-section-gap-tablet, var(--cgb-pf-section-gap-desktop, 16px));
        --cgb-pf-h-fs: var(--cgb-pf-h-fs-tablet, var(--cgb-pf-h-fs-desktop, 18px));
        --cgb-pf-h-mb: var(--cgb-pf-h-mb-tablet, var(--cgb-pf-h-mb-desktop, 12px));
        --cgb-pf-item-fs: var(--cgb-pf-item-fs-tablet, var(--cgb-pf-item-fs-desktop, 14px));
        --cgb-pf-item-mb: var(--cgb-pf-item-mb-tablet, var(--cgb-pf-item-mb-desktop, 4px));
    }
}

@media (max-width: 768px) {
    .cgb-pre-footer {
        --cgb-pf-py: var(--cgb-pf-py-mobile, var(--cgb-pf-py-tablet, var(--cgb-pf-py-desktop, 60px)));
        --cgb-pf-mt: var(--cgb-pf-mt-mobile, var(--cgb-pf-mt-tablet, var(--cgb-pf-mt-desktop, 0px)));
        --cgb-pf-mb: var(--cgb-pf-mb-mobile, var(--cgb-pf-mb-tablet, var(--cgb-pf-mb-desktop, 0px)));
        --cgb-pf-gap: var(--cgb-pf-gap-mobile, var(--cgb-pf-gap-tablet, var(--cgb-pf-gap-desktop, 40px)));
        --cgb-pf-section-gap: var(--cgb-pf-section-gap-mobile, var(--cgb-pf-section-gap-tablet, var(--cgb-pf-section-gap-desktop, 16px)));
        --cgb-pf-h-fs: var(--cgb-pf-h-fs-mobile, var(--cgb-pf-h-fs-tablet, var(--cgb-pf-h-fs-desktop, 18px)));
        --cgb-pf-h-mb: var(--cgb-pf-h-mb-mobile, var(--cgb-pf-h-mb-tablet, var(--cgb-pf-h-mb-desktop, 12px)));
        --cgb-pf-item-fs: var(--cgb-pf-item-fs-mobile, var(--cgb-pf-item-fs-tablet, var(--cgb-pf-item-fs-desktop, 14px)));
        --cgb-pf-item-mb: var(--cgb-pf-item-mb-mobile, var(--cgb-pf-item-mb-tablet, var(--cgb-pf-item-mb-desktop, 4px)));
    }

    .cgb-pre-footer__inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

:root {
    /* Fallbacks */
    --ccb-bg-color: #ffffff;
    --ccb-title-color: #1f2933;
    --ccb-btn-bg: #10b981;
    --ccb-btn-text: #ffffff;
}

.ccb-schedule-demo-wrapper {
    margin: 0 auto;
    padding: 30px;
    font-family: inherit;
    box-sizing: border-box;
    background-color: var(--ccb-bg-color, #ffffff);
    border-radius: 4px;
    min-height: var(--ccb-min-height, 0);
    /* Module Height */
}

.ccb-schedule-demo-title {
    text-align: center;
    font-size: 2.2em;
    font-weight: 700;
    color: var(--ccb-title-color, #1f2933);
    line-height: 1.2;

    /* Responsive Spacing (Mobile First) */
    padding-top: var(--ccb-title-pt-m, 0);
    padding-bottom: var(--ccb-title-pb-m, 20px);
    margin-top: var(--ccb-title-mt-m, 0);
    margin-bottom: var(--ccb-title-mb-m, 0);
}

@media (min-width: 600px) {
    .ccb-schedule-demo-title {
        padding-top: var(--ccb-title-pt-t, 0);
        padding-bottom: var(--ccb-title-pb-t, 30px);
        margin-top: var(--ccb-title-mt-t, 0);
        margin-bottom: var(--ccb-title-mb-t, 0);
    }
}

@media (min-width: 1024px) {
    .ccb-schedule-demo-title {
        padding-top: var(--ccb-title-pt-d, 0);
        padding-bottom: var(--ccb-title-pb-d, 40px);
        margin-top: var(--ccb-title-mt-d, 0);
        margin-bottom: var(--ccb-title-mb-d, 0);
    }
}

.ccb-schedule-demo-form {
    display: block;
    background: transparent;
    /* Allow wrapper bg to show */
    width: 100%;
}

.ccb-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 768px) {
    .ccb-form-grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
}

.ccb-field-group {
    display: flex;
    flex-direction: column;
}

.ccb-full-width {
    grid-column: 1 / -1;
}

/* Inputs & Selects */
.ccb-field-group input,
.ccb-field-group select,
.ccb-field-group textarea {
    width: 100%;
    height: 52px;
    /* Explicit height */
    padding: 12px 16px;
    /* Adjusted padding */
    border: 1px solid #d1d5db;
    background-color: #ffffff;
    color: #111827;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1.5;
    box-sizing: border-box;
    transition: all 0.2s ease;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    vertical-align: middle;
}

.ccb-field-group select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px;
    padding-right: 40px;
}

.ccb-field-group input:focus,
.ccb-field-group select:focus,
.ccb-field-group textarea:focus {
    border-color: #2563eb;
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    outline: none;
}

.ccb-field-group input::placeholder,
.ccb-field-group textarea::placeholder {
    color: #9ca3af;
}

.ccb-field-group textarea {
    min-height: 120px;
    resize: vertical;
}

/* Checkboxes */
.ccb-consent-group {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ccb-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14px;
    color: var(--ccb-title-color, #4b5563);
    /* Adapt text color to title color for consistency if bg is dark? Risk. Keeping legible fallback. */
    color: #4b5563;
    /* Safer to keep dark gray for reading policies unless we add specific text color control. User only asked for Title color. */
    line-height: 1.4;
    cursor: pointer;
}

.ccb-checkbox-label input[type="checkbox"] {
    margin-top: 2px;
    width: 18px;
    height: 18px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
    accent-color: var(--ccb-btn-bg, #2563eb);
    /* Match button accent */
}

.ccb-checkbox-label a {
    color: var(--ccb-btn-bg, #2563eb);
    text-decoration: none;
    font-weight: 500;
}

.ccb-checkbox-label a:hover {
    text-decoration: underline;
}

/* Actions */
.ccb-form-actions {
    margin-top: 40px;
    text-align: center;
}

.ccb-submit-btn {
    background-color: var(--ccb-btn-bg, #10b981);
    color: var(--ccb-btn-text, #ffffff);
    border: none;
    padding: var(--ccb-btn-py, 14px) var(--ccb-btn-px, 60px);
    font-size: var(--ccb-btn-fs, 16px);
    font-weight: var(--ccb-btn-weight, 700);
    border-radius: var(--ccb-btn-radius, 50px);
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.ccb-submit-btn:hover {
    filter: brightness(90%);
    /* Simple darken for any color */
    transform: translateY(-1px);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1);
}

.ccb-submit-btn:disabled {
    filter: grayscale(100%);
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Inline Messages */
.ccb-form-message {
    margin-top: 24px;
    padding: 16px;
    border-radius: 4px;
    text-align: center;
    font-weight: 500;
}

.ccb-message-success {
    background-color: #ecfdf5;
    color: #047857;
    border: 1px solid #d1fae5;
}

.ccb-message-error {
    background-color: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fee2e2;
}

.ccb-input-error {
    border-color: #ef4444 !important;
    background-color: #fef2f2 !important;
}

.ccb-error-text {
    font-size: 13px;
    color: #ef4444;
    margin-top: 6px;
}

/* Toast Notification */
.ccb-toast-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    background-color: #10b981;
    /* Success Green */
    color: #ffffff;
    padding: 16px 20px;
    border-radius: 4px;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: inherit;
    font-size: 15px;
    font-weight: 500;
    min-width: 300px;
    max-width: 90vw;
    animation: ccb-slide-in 0.3s ease-out forwards;
}

.ccb-toast-notification.ccb-toast-error {
    background-color: #ef4444;
    /* Error Red */
}

.ccb-toast-close {
    margin-left: auto;
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    transition: background 0.2s;
}

.ccb-toast-close:hover {
    background-color: rgba(0, 0, 0, 0.1);
    color: #ffffff;
}

@keyframes ccb-slide-in {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes ccb-fade-out {
    from {
        opacity: 1;
        transform: translateX(0);
    }

    to {
        opacity: 0;
        transform: translateX(20px);
    }
}/* Section Box block styles */

.ccb-section-box {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top:    var(--ccb-sec-pt-desktop, 0px);
    padding-bottom: var(--ccb-sec-pb-desktop, 0px);
    padding-left:   var(--ccb-sec-px-desktop, 0px);
    padding-right:  var(--ccb-sec-px-desktop, 0px);
    margin-top:     var(--ccb-sec-mt-desktop, 0px);
    margin-bottom:  var(--ccb-sec-mb-desktop, 0px);
}

/* Responsive BG/FG visibility via data attributes (emitted by save) */
.ccb-section-box[data-bg-desktop="0"] {
    background-image: none !important;
}
.ccb-section-box[data-fg-desktop="0"]>.ccb-section-box__foreground {
    display: none !important;
}

@media (max-width: 992px) {
    .ccb-section-box[data-bg-tablet="0"] {
        background-image: none !important;
    }
    .ccb-section-box[data-fg-tablet="0"]>.ccb-section-box__foreground {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .ccb-section-box[data-bg-mobile="0"] {
        background-image: none !important;
    }
    .ccb-section-box[data-fg-mobile="0"]>.ccb-section-box__foreground {
        display: none !important;
    }

    /* Mobile-specific background/foreground images (opt-in via data flags) */
    .ccb-section-box[data-bg-mobile="1"][data-bg-has-mobile="1"] {
        background-image: var(--ccb-sec-bg-img-mobile, var(--ccb-sec-bg-img-desktop)) !important;
    }

    .ccb-section-box[data-fg-mobile="1"][data-fg-has-mobile="1"]>.ccb-section-box__foreground {
        background-image: var(--ccb-sec-fg-img-mobile, var(--ccb-sec-fg-img-desktop)) !important;
    }
}

.cgb--fullwidth{
    width:100vw;
    max-width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
}

/* overlay */
.ccb-section-box__overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* foreground (es. skyline) */
.ccb-section-box__foreground {
    pointer-events: none;
}

/* inner contenuto */
.ccb-section-box__inner {
    position: relative;
    z-index: 1;
}

/* Defensive layout rules (prevents mobile overflow from long words/media) */
.ccb-section-box .cgb-inner {
    width: 100%;
    box-sizing: border-box;
}

.ccb-section-box__heading,
.ccb-section-box__subheading {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ccb-section-box__heading {
    text-align: var(--ccb-sec-heading-ta, inherit) !important;
}

.ccb-section-box__subheading {
    text-align: var(--ccb-sec-sub-ta, inherit) !important;
}

.ccb-section-box__grid,
.ccb-section-box__grid > * {
    min-width: 0;
}

.ccb-section-box img,
.ccb-section-box video,
.ccb-section-box iframe,
.ccb-section-box svg {
    max-width: 100%;
}

.ccb-section-box .cgb-inner{
    max-width: var(--cgb-inner-max, 1200px);
    margin: 0 auto;
    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}
@media (max-width:1024px){
    .ccb-section-box .cgb-inner{
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
    }
}
@media (max-width:640px){
    .ccb-section-box .cgb-inner{
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-desktop, 24px));
    }
}

.ccb-section-box__inner--align-left {
    text-align: center;
}
.ccb-section-box__inner--align-center {
    text-align: center;
}
.ccb-section-box__inner--align-right {
    text-align: right;
}

/* heading */
.ccb-section-box__heading {
    margin: 0;
    font-size: var(--ccb-sec-heading-fs-desktop, inherit);
    margin-top: var(--ccb-sec-heading-mt-desktop, 0px);
    margin-bottom: var(--ccb-sec-heading-mb-desktop, 0px);
    letter-spacing: var(--ccb-sec-heading-ls-desktop, 0em);
}

/* sottotitolo */
.ccb-section-box__subheading {
    margin: 0;
    font-size: var(--ccb-sec-sub-fs-desktop, inherit);
    margin-bottom: var(--ccb-sec-sub-mb-desktop, 0px);
}

/* heading/subheading responsive (se servono in futuro) */
@media (max-width: 992px) {
    .ccb-section-box__heading {
        font-size: var(--ccb-sec-heading-fs-tablet, var(--ccb-sec-heading-fs-desktop));
        margin-top: var(--ccb-sec-heading-mt-tablet, var(--ccb-sec-heading-mt-desktop, 0px));
        margin-bottom: var(--ccb-sec-heading-mb-tablet, var(--ccb-sec-heading-mb-desktop, 0px));
        letter-spacing: var(--ccb-sec-heading-ls-tablet, var(--ccb-sec-heading-ls-desktop, 0em));
    }
    .ccb-section-box__subheading {
        font-size: var(--ccb-sec-sub-fs-tablet, var(--ccb-sec-sub-fs-desktop));
        margin-bottom: var(--ccb-sec-sub-mb-tablet, var(--ccb-sec-sub-mb-desktop, 0px));
    }
}
@media (max-width: 768px) {
    .ccb-section-box__heading {
        font-size: var(--ccb-sec-heading-fs-mobile, var(--ccb-sec-heading-fs-desktop));
        margin-top: var(--ccb-sec-heading-mt-mobile, var(--ccb-sec-heading-mt-desktop, 0px));
        margin-bottom: var(--ccb-sec-heading-mb-mobile, var(--ccb-sec-heading-mb-desktop, 0px));
        letter-spacing: var(--ccb-sec-heading-ls-mobile, var(--ccb-sec-heading-ls-desktop, 0em));
    }
    .ccb-section-box__subheading {
        font-size: var(--ccb-sec-sub-fs-mobile, var(--ccb-sec-sub-fs-desktop));
        margin-bottom: var(--ccb-sec-sub-mb-mobile, var(--ccb-sec-sub-mb-desktop, 0px));
    }
}

/* griglia interna */
.ccb-section-box__grid {
    display: grid;
}
/* EDITOR: rendi trasparenti i wrapper Gutenberg dentro la grid */
.ccb-section-box__grid .block-editor-inner-blocks,
.ccb-section-box__grid .block-editor-block-list__layout {
    display: contents;
}

/* desktop */
.ccb-section-box__grid[data-cols-desktop="1"] { grid-template-columns: repeat(1,minmax(0,1fr)); }
.ccb-section-box__grid[data-cols-desktop="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ccb-section-box__grid[data-cols-desktop="3"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ccb-section-box__grid[data-cols-desktop="4"] { grid-template-columns: repeat(4,minmax(0,1fr)); }
.ccb-section-box__grid[data-cols-desktop="5"] { grid-template-columns: repeat(5,minmax(0,1fr)); }
.ccb-section-box__grid[data-cols-desktop="6"] { grid-template-columns: repeat(6,minmax(0,1fr)); }

/* tablet */
@media (max-width: 992px) {
    .ccb-section-box__grid[data-cols-tablet="1"] { grid-template-columns: repeat(1,minmax(0,1fr)); }
    .ccb-section-box__grid[data-cols-tablet="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ccb-section-box__grid[data-cols-tablet="3"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

/* mobile */
@media (max-width: 768px) {
    .ccb-section-box__grid[data-cols-mobile="1"] { grid-template-columns: repeat(1,minmax(0,1fr)); }
    .ccb-section-box__grid[data-cols-mobile="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ccb-section-box__grid[data-cols-mobile="3"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

/* spacing responsive (usa CSS vars settate dal JS) */
@media (max-width: 992px) {
    .ccb-section-box {
        padding-top:    var(--ccb-sec-pt-tablet,    var(--ccb-sec-pt-desktop, 0px));
        padding-bottom: var(--ccb-sec-pb-tablet,    var(--ccb-sec-pb-desktop, 0px));
        padding-left:   var(--ccb-sec-px-tablet,    var(--ccb-sec-px-desktop, 0px));
        padding-right:  var(--ccb-sec-px-tablet,    var(--ccb-sec-px-desktop, 0px));
        margin-top:     var(--ccb-sec-mt-tablet,    var(--ccb-sec-mt-desktop, 0px));
        margin-bottom:  var(--ccb-sec-mb-tablet,    var(--ccb-sec-mb-desktop, 0px));
    }
}
@media (max-width: 768px) {
    .ccb-section-box {
        padding-top:    var(--ccb-sec-pt-mobile,    var(--ccb-sec-pt-desktop, 0px));
        padding-bottom: var(--ccb-sec-pb-mobile,    var(--ccb-sec-pb-desktop, 0px));
        padding-left:   var(--ccb-sec-px-mobile,    var(--ccb-sec-px-desktop, 0px));
        padding-right:  var(--ccb-sec-px-mobile,    var(--ccb-sec-px-desktop, 0px));
        margin-top:     var(--ccb-sec-mt-mobile,    var(--ccb-sec-mt-desktop, 0px));
        margin-bottom:  var(--ccb-sec-mb-mobile,    var(--ccb-sec-mb-desktop, 0px));
    }
}
/* Divider */
.ccb-divider {
    --ccb-div-th: var(--ccb-div-th-desktop, 2px);
    --ccb-div-w: var(--ccb-div-w-desktop, 100%);
    --ccb-div-mt: var(--ccb-div-mt-desktop, 24px);
    --ccb-div-mb: var(--ccb-div-mb-desktop, 24px);
    --ccb-div-sh-h: var(--ccb-div-sh-h-desktop, 60px);
    --ccb-div-color: #e5e7eb;
    --ccb-div-grad-angle: 90deg;
    --ccb-div-grad-c1: var(--ccb-div-color);
    --ccb-div-grad-c2: transparent;

    display: flex;
    margin-top: var(--ccb-div-mt);
    margin-bottom: var(--ccb-div-mb);

    /* Decorative layer: should sit above backgrounds but under content */
    position: relative;
    z-index: var(--ccb-div-z, 0);
}

.ccb-divider[data-align="left"] { justify-content: flex-start; }
.ccb-divider[data-align="center"] { justify-content: center; }
.ccb-divider[data-align="right"] { justify-content: flex-end; }

.ccb-divider__line {
    width: var(--ccb-div-w);
    box-sizing: border-box;
    pointer-events: none;
}

.ccb-divider__shape {
    width: 100%;
    height: var(--ccb-div-sh-h);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: 50% 0;
    pointer-events: none;
}

/* line-like presets */
.ccb-divider[data-preset="solid"] .ccb-divider__line,
.ccb-divider[data-preset="dashed"] .ccb-divider__line,
.ccb-divider[data-preset="dotted"] .ccb-divider__line,
.ccb-divider[data-preset="double"] .ccb-divider__line {
    height: 0;
    border-top-width: var(--ccb-div-th);
    border-top-style: solid;
    border-top-color: var(--ccb-div-color);
}

.ccb-divider[data-preset="dashed"] .ccb-divider__line { border-top-style: dashed; }
.ccb-divider[data-preset="dotted"] .ccb-divider__line { border-top-style: dotted; }
.ccb-divider[data-preset="double"] .ccb-divider__line { border-top-style: double; }

/* gradient preset */
.ccb-divider[data-preset="gradient"] .ccb-divider__line {
    height: var(--ccb-div-th);
    background-image: linear-gradient(var(--ccb-div-grad-angle), var(--ccb-div-grad-c1), var(--ccb-div-grad-c2));
}

@media (max-width: 1024px) {
    .ccb-divider {
        --ccb-div-th: var(--ccb-div-th-tablet, var(--ccb-div-th));
        --ccb-div-w: var(--ccb-div-w-tablet, var(--ccb-div-w));
        --ccb-div-mt: var(--ccb-div-mt-tablet, var(--ccb-div-mt));
        --ccb-div-mb: var(--ccb-div-mb-tablet, var(--ccb-div-mb));
        --ccb-div-sh-h: var(--ccb-div-sh-h-tablet, var(--ccb-div-sh-h));
    }
}

@media (max-width: 768px) {
    .ccb-divider {
        --ccb-div-th: var(--ccb-div-th-mobile, var(--ccb-div-th));
        --ccb-div-w: var(--ccb-div-w-mobile, var(--ccb-div-w));
        --ccb-div-mt: var(--ccb-div-mt-mobile, var(--ccb-div-mt));
        --ccb-div-mb: var(--ccb-div-mb-mobile, var(--ccb-div-mb));
        --ccb-div-sh-h: var(--ccb-div-sh-h-mobile, var(--ccb-div-sh-h));
    }
}

/* =========================
 * Pricing Plans (ccb/pricing-plans)
 * ========================= */
.ccb-pricing {
    --ccb-pr-cols: var(--ccb-pr-cols-desktop, 4);
    --ccb-pr-gap: var(--ccb-pr-gap-desktop, 24px);
    --ccb-pr-py: var(--ccb-pr-py-desktop, 80px);
    --ccb-pr-px: var(--ccb-pr-px-desktop, 24px);
    --ccb-pr-card-pad: var(--ccb-pr-card-pad-desktop, 28px);
    --ccb-pr-title-size: var(--ccb-pr-title-size-desktop, 44px);
    --ccb-pr-plan-size: var(--ccb-pr-plan-size-desktop, 18px);
    --ccb-pr-price-size: var(--ccb-pr-price-size-desktop, 36px);

    padding: var(--ccb-pr-py) var(--ccb-pr-px);
    width: 100%;
    box-sizing: border-box;
    color: var(--ccb-pr-text, #111827);
}

/* Ensure full-viewport section when using cgb--fullwidth.
   Needed because .ccb-pricing { width: 100% } is declared after global .cgb--fullwidth. */
.ccb-pricing.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

@media (max-width: 1024px) {
    .ccb-pricing {
        --ccb-pr-cols: var(--ccb-pr-cols-tablet, var(--ccb-pr-cols-desktop, 4));
        --ccb-pr-gap: var(--ccb-pr-gap-tablet, var(--ccb-pr-gap-desktop, 24px));
        --ccb-pr-py: var(--ccb-pr-py-tablet, var(--ccb-pr-py-desktop, 80px));
        --ccb-pr-px: var(--ccb-pr-px-tablet, var(--ccb-pr-px-desktop, 24px));
        --ccb-pr-card-pad: var(--ccb-pr-card-pad-tablet, var(--ccb-pr-card-pad-desktop, 28px));
        --ccb-pr-title-size: var(--ccb-pr-title-size-tablet, var(--ccb-pr-title-size-desktop, 44px));
        --ccb-pr-plan-size: var(--ccb-pr-plan-size-tablet, var(--ccb-pr-plan-size-desktop, 18px));
        --ccb-pr-price-size: var(--ccb-pr-price-size-tablet, var(--ccb-pr-price-size-desktop, 36px));
    }
}

@media (max-width: 768px) {
    .ccb-pricing {
        --ccb-pr-cols: var(--ccb-pr-cols-mobile, var(--ccb-pr-cols-tablet, var(--ccb-pr-cols-desktop, 4)));
        --ccb-pr-gap: var(--ccb-pr-gap-mobile, var(--ccb-pr-gap-tablet, var(--ccb-pr-gap-desktop, 24px)));
        --ccb-pr-py: var(--ccb-pr-py-mobile, var(--ccb-pr-py-tablet, var(--ccb-pr-py-desktop, 80px)));
        --ccb-pr-px: var(--ccb-pr-px-mobile, var(--ccb-pr-px-tablet, var(--ccb-pr-px-desktop, 24px)));
        --ccb-pr-card-pad: var(--ccb-pr-card-pad-mobile, var(--ccb-pr-card-pad-tablet, var(--ccb-pr-card-pad-desktop, 28px)));
        --ccb-pr-title-size: var(--ccb-pr-title-size-mobile, var(--ccb-pr-title-size-tablet, var(--ccb-pr-title-size-desktop, 44px)));
        --ccb-pr-plan-size: var(--ccb-pr-plan-size-mobile, var(--ccb-pr-plan-size-tablet, var(--ccb-pr-plan-size-desktop, 18px)));
        --ccb-pr-price-size: var(--ccb-pr-price-size-mobile, var(--ccb-pr-price-size-tablet, var(--ccb-pr-price-size-desktop, 36px)));
    }
}

/* Editor toolbar device preview override */
.ccb-pricing[data-preview-device="tablet"] {
    --ccb-pr-cols: var(--ccb-pr-cols-tablet, var(--ccb-pr-cols-desktop, 4));
    --ccb-pr-gap: var(--ccb-pr-gap-tablet, var(--ccb-pr-gap-desktop, 24px));
    --ccb-pr-py: var(--ccb-pr-py-tablet, var(--ccb-pr-py-desktop, 80px));
    --ccb-pr-px: var(--ccb-pr-px-tablet, var(--ccb-pr-px-desktop, 24px));
    --ccb-pr-card-pad: var(--ccb-pr-card-pad-tablet, var(--ccb-pr-card-pad-desktop, 28px));
    --ccb-pr-title-size: var(--ccb-pr-title-size-tablet, var(--ccb-pr-title-size-desktop, 44px));
    --ccb-pr-plan-size: var(--ccb-pr-plan-size-tablet, var(--ccb-pr-plan-size-desktop, 18px));
    --ccb-pr-price-size: var(--ccb-pr-price-size-tablet, var(--ccb-pr-price-size-desktop, 36px));
}

.ccb-pricing[data-preview-device="mobile"] {
    --ccb-pr-cols: var(--ccb-pr-cols-mobile, var(--ccb-pr-cols-tablet, var(--ccb-pr-cols-desktop, 4)));
    --ccb-pr-gap: var(--ccb-pr-gap-mobile, var(--ccb-pr-gap-tablet, var(--ccb-pr-gap-desktop, 24px)));
    --ccb-pr-py: var(--ccb-pr-py-mobile, var(--ccb-pr-py-tablet, var(--ccb-pr-py-desktop, 80px)));
    --ccb-pr-px: var(--ccb-pr-px-mobile, var(--ccb-pr-px-tablet, var(--ccb-pr-px-desktop, 24px)));
    --ccb-pr-card-pad: var(--ccb-pr-card-pad-mobile, var(--ccb-pr-card-pad-tablet, var(--ccb-pr-card-pad-desktop, 28px)));
    --ccb-pr-title-size: var(--ccb-pr-title-size-mobile, var(--ccb-pr-title-size-tablet, var(--ccb-pr-title-size-desktop, 44px)));
    --ccb-pr-plan-size: var(--ccb-pr-plan-size-mobile, var(--ccb-pr-plan-size-tablet, var(--ccb-pr-plan-size-desktop, 18px)));
    --ccb-pr-price-size: var(--ccb-pr-price-size-mobile, var(--ccb-pr-price-size-tablet, var(--ccb-pr-price-size-desktop, 36px)));
}

.ccb-pricing__inner {
    max-width: var(--ccb-pr-maxw, 1320px);
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

.ccb-pricing__header {
    text-align: center;
    margin-bottom: 56px;
}

.ccb-pricing .ccb-pricing__title {
    font-size: var(--ccb-pr-title-size, 44px) !important;
    font-weight: 800;
    line-height: 1.1;
    margin: 0 0 18px;
    color: var(--ccb-pr-text, #111827);
}

.ccb-pricing__billing {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.ccb-pricing__billingLabel {
    font-size: 14px;
    font-weight: 600;
    color: var(--ccb-pr-text, #111827);
    opacity: 0.7;
}

.ccb-pricing__billingLabel.is-green {
    color: var(--ccb-pr-accent-green, #22c55e);
    opacity: 1;
}

.ccb-switch {
    appearance: none;
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    line-height: 0;
}

.ccb-switch__track {
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: var(--ccb-pr-border-color, #e5e7eb);
    position: relative;
    display: inline-block;
    transition: background-color 0.2s ease;
}

.ccb-switch__thumb {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    position: absolute;
    top: 2px;
    left: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16);
    transition: transform 0.2s ease;
}

.ccb-switch[aria-pressed="true"] .ccb-switch__track {
    background: var(--ccb-pr-accent-green, #22c55e);
}

.ccb-switch[aria-pressed="true"] .ccb-switch__thumb {
    transform: translateX(20px);
}

.ccb-pricing__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-pr-cols), minmax(0, 1fr));
    grid-template-rows: auto auto auto auto auto 1fr auto;
    column-gap: var(--ccb-pr-gap);
    row-gap: 0;
    padding-top: var(--ccb-pr-badge-h, 32px);
}

.ccb-pricingCard {
    display: grid;
    grid-row: span 7;
    grid-template-rows: subgrid;
    border: var(--ccb-pr-border, 1px) solid var(--ccb-pr-border-color, #e5e7eb);
    border-radius: var(--ccb-pr-radius, 16px);
    background: var(--ccb-pr-card-bg, #ffffff);
    box-shadow: var(--ccb-pr-shadow, none);
    overflow: visible;
    min-height: 0;
}

.ccb-pricingCard.is-featured {
    position: relative;
    background: var(--ccb-pr-featured-bg, #edecfb);
    border-color: var(--ccb-pr-badge-bg, #5e17eb);
    border-width: 2px;
}

.ccb-pricingCard__badge {
    position: absolute;
    bottom: 100%;
    left: -2px;
    right: -2px;
    background: var(--ccb-pr-badge-bg, #5e17eb);
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    padding: 7px 12px;
    border-radius: var(--ccb-pr-radius, 16px) var(--ccb-pr-radius, 16px) 0 0;
    box-sizing: border-box;
}

.ccb-pricingCard__content {
    display: grid;
    grid-row: span 7;
    grid-template-rows: subgrid;
    padding: var(--ccb-pr-card-pad);
    box-sizing: border-box;
}

.ccb-pricingCard__brandTop {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ccb-pr-text, #111827);
    opacity: 0.6;
    margin-bottom: 10px;
}

.ccb-pricing .ccb-pricingCard__plan {
    font-size: var(--ccb-pr-plan-size) !important;
    font-weight: 800;
    margin: 0 0 10px;
    color: var(--ccb-pr-text, #111827);
}

.ccb-pricingCard__description {
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 18px;
    color: var(--ccb-pr-text, #111827);
    opacity: 0.75;
}

.ccb-pricingCard__price {
    display: grid; grid-row: span 3; grid-template-rows: subgrid; gap: 0; margin: 0;
}

.ccb-pricing .ccb-pricingCard__priceMain {
    font-size: var(--ccb-pr-price-size) !important;
    font-weight: 900;
    line-height: 1.1;
    margin: 0;
    color: var(--ccb-pr-text, #111827);
}

.ccb-pricingCard__priceSuffix,
.ccb-pricingCard__freeNote {
    text-align: center;
    font-size: 13px;
    line-height: 1.4;
    margin-top: 6px;
    color: var(--ccb-pr-text, #111827);
    opacity: 0.7;
}

.ccb-pricingCard__freeNote ul,
.ccb-pricingCard__freeNote ol {
    margin: 0;
    padding-left: 0;
    list-style-position: inside;
}

.ccb-pricingCard__freeNote li {
    margin: 0;
}

.ccb-pricingCard__cta {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ccb-pricingCard__primaryCta,
.ccb-pricingCard__secondaryCta {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 16px;
    font-weight: 700;
    border-radius: calc(var(--ccb-pr-radius, 16px) - 6px);
    box-sizing: border-box;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.ccb-pricingCard__primaryCta {
    background: var(--ccb-pr-cta1-bg, var(--ccb-pr-accent-blue, #3b82f6));
    color: var(--ccb-pr-cta1-text, #ffffff);
    border: 1px solid var(--ccb-pr-cta1-bg, var(--ccb-pr-accent-blue, #3b82f6));
}

.ccb-pricingCard__primaryCta:hover {
    background: var(--ccb-pr-cta1-bg-hover, var(--ccb-pr-cta1-bg, var(--ccb-pr-accent-blue, #3b82f6)));
    color: var(--ccb-pr-cta1-text-hover, var(--ccb-pr-cta1-text, #ffffff));
    border-color: var(--ccb-pr-cta1-bg-hover, var(--ccb-pr-cta1-bg, var(--ccb-pr-accent-blue, #3b82f6)));
}

.ccb-pricingCard__secondaryCta {
    background: var(--ccb-pr-cta2-bg, transparent);
    color: var(--ccb-pr-cta2-text, var(--ccb-pr-text, #111827));
    border: 1px solid var(--ccb-pr-cta2-border, var(--ccb-pr-border-color, #e5e7eb));
}

.ccb-pricingCard__secondaryCta:hover {
    background: var(--ccb-pr-cta2-bg-hover, var(--ccb-pr-cta2-bg, transparent));
    color: var(--ccb-pr-cta2-text-hover, var(--ccb-pr-cta2-text, var(--ccb-pr-text, #111827)));
    border-color: var(--ccb-pr-cta2-border-hover, var(--ccb-pr-cta2-border, var(--ccb-pr-border-color, #e5e7eb)));
}

.ccb-pricingCard__bottomLink {
    text-decoration: none;
    font-weight: 700;
    color: var(--ccb-pr-text, #111827);
    text-align: center;
    padding-top: 2px;
}

/* Hide mobile-only elements on desktop */
.ccb-pricingCard__storeBadges,
.ccb-pricingCard__featuresWrap {
    display: none;
}

/* ── Pricing: tablet wrapping fix (2-col with 4+ cards) ── */
@media (max-width: 1024px) {
    .ccb-pricing__grid {
        grid-template-columns: repeat(var(--ccb-pr-cols), minmax(0, 1fr));
        grid-template-rows: none;
        gap: var(--ccb-pr-gap);
        padding-top: 0;
    }
    .ccb-pricingCard {
        display: flex;
        flex-direction: column;
        grid-row: auto;
    }
    .ccb-pricingCard.is-featured {
        margin-top: var(--ccb-pr-badge-h, 32px);
    }
    .ccb-pricingCard__content {
        display: flex;
        flex-direction: column;
        flex: 1;
        grid-row: auto;
    }
    .ccb-pricingCard__cta {
        margin-top: auto;
    }
}

/* ── Pricing: mobile stacking fix ── */
@media (max-width: 768px) {
    .ccb-pricing__grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        gap: var(--ccb-pr-gap);
        padding-top: 0;
    }
    .ccb-pricingCard {
        display: flex;
        flex-direction: column;
        grid-row: auto;
    }
    .ccb-pricingCard.is-featured {
        margin-top: var(--ccb-pr-badge-h, 32px);
    }
    .ccb-pricingCard__content {
        display: flex;
        flex-direction: column;
        flex: 1;
        grid-row: auto;
        text-align: center;
        align-items: center;
    }
    .ccb-pricingCard__cta {
        margin-top: auto;
        width: 100%;
    }
    .ccb-pricing__header {
        margin-bottom: 32px;
    }

    /* Hide brandTop on mobile */
    .ccb-pricingCard__brandTop {
        display: none;
    }

    /* Reorder: plan → price → storeBadges/CTA → description → features → cta-hidden */
    .ccb-pricingCard__plan { order: 1; }
    .ccb-pricingCard__price { order: 2; }
    .ccb-pricingCard__storeBadges { order: 3; }
    .ccb-pricingCard__description {
        order: 4;
        padding-top: 18px;
        border-top: 1px solid var(--ccb-pr-border-color, #e5e7eb);
        width: 100%;
        margin-bottom: 0;
    }
    .ccb-pricingCard__featuresWrap { order: 5; }
    .ccb-pricingCard__cta { order: 6; }

    /* Quote cards: CTA stays visible and ordered after price */
    .ccb-pricingCard--quote-mobile .ccb-pricingCard__cta {
        order: 3;
        margin-top: 0;
        margin-bottom: 0;
        padding: 12px 0;
    }

    /* Store badges container (injected by JS) */
    .ccb-pricingCard__storeBadges {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        margin: 20px 0;
    }
    .ccb-pricingCard__storeBadges a {
        display: block;
    }
    .ccb-pricingCard__storeBadges img {
        height: 48px;
        width: auto;
    }

    /* Features collapsible wrap */
    .ccb-pricingCard__featuresWrap {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        border-top: 1px solid var(--ccb-pr-border-color, #e5e7eb);
        padding-top: 16px;
        margin-top: 16px;
    }
    .ccb-pricingCard__featuresToggle {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        cursor: pointer;
        font-weight: 700;
        font-size: 16px;
        color: var(--ccb-pr-text, #111827);
        background: none;
        border: none;
        padding: 0;
        width: 100%;
    }
    .ccb-pricingCard__featuresToggle .ccb-toggle-icon {
        display: inline-flex;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        border: 2px solid currentColor;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        line-height: 1;
        transition: transform .2s ease;
    }
    .ccb-pricingCard__featuresToggle[aria-expanded="true"] .ccb-toggle-icon {
        transform: rotate(45deg);
    }
    .ccb-pricingCard__featuresBody {
        overflow: hidden;
        max-height: 0;
        transition: max-height .3s ease;
        width: 100%;
    }
    .ccb-pricingCard__featuresBody.is-open {
        max-height: 600px;
    }
    .ccb-pricingCard__featuresBody ul,
    .ccb-pricingCard__featuresBody ol {
        text-align: left;
        padding: 12px 0 0 0;
        display: inline-block;
        margin: 0;
        list-style: none !important;
    }

    /* CTA buttons full width */
    .ccb-pricingCard__primaryCta,
    .ccb-pricingCard__secondaryCta {
        width: 100%;
    }
}

/* Editor tablet preview: same fix */
.ccb-pricing[data-preview-device="tablet"] .ccb-pricing__grid {
    grid-template-columns: repeat(var(--ccb-pr-cols), minmax(0, 1fr));
    grid-template-rows: none;
    gap: var(--ccb-pr-gap);
    padding-top: 0;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard {
    display: flex;
    flex-direction: column;
    grid-row: auto;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard.is-featured {
    margin-top: var(--ccb-pr-badge-h, 32px);
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__content {
    display: flex;
    flex-direction: column;
    flex: 1;
    grid-row: auto;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__cta {
    margin-top: auto;
}

/* Editor mobile preview: same fix */
.ccb-pricing[data-preview-device="mobile"] .ccb-pricing__grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: var(--ccb-pr-gap);
    padding-top: 0;
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard {
    display: flex;
    flex-direction: column;
    grid-row: auto;
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard.is-featured {
    margin-top: var(--ccb-pr-badge-h, 32px);
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__content {
    display: flex;
    flex-direction: column;
    flex: 1;
    grid-row: auto;
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__cta {
    margin-top: auto;
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricing__header {
    margin-bottom: 32px;
}

/* Pillars Tabs */
.ccb-pillars-tabs{
    --ccb-pt: var(--ccb-pt-desktop, 80px);
    --ccb-pr: var(--ccb-pr-desktop, 24px);
    --ccb-tabs-gap: var(--ccb-tabs-gap-desktop, 10px);
    --ccb-content-gap: var(--ccb-content-gap-desktop, 44px);
    --ccb-tabs-mt: var(--ccb-tabs-mt-desktop, 28px);
    --ccb-panel-mt: var(--ccb-panel-mt-desktop, 28px);

    --ccb-title-size: var(--ccb-title-size-desktop, 44px);
    --ccb-kicker-size: var(--ccb-kicker-size-desktop, 12px);
    --ccb-heading-size: var(--ccb-heading-size-desktop, 28px);
    --ccb-body-size: var(--ccb-body-size-desktop, 16px);
    --ccb-tab-label-size: var(--ccb-tab-label-size-desktop, 15px);
    --ccb-list-gap: var(--ccb-list-gap-desktop, 10px);

    color: var(--ccb-text, #1F2430);
    padding-top: var(--ccb-pt, 80px);
    padding-bottom: var(--ccb-pt, 80px);
    width: 100%;
}

/* Editor preview device (suite convention) */
.ccb-pillars-tabs[data-preview-device="tablet"]{
    --ccb-pt: var(--ccb-pt-tablet, var(--ccb-pt-desktop, 80px));
    --ccb-pr: var(--ccb-pr-tablet, var(--ccb-pr-desktop, 24px));
    --ccb-tabs-gap: var(--ccb-tabs-gap-tablet, var(--ccb-tabs-gap-desktop, 10px));
    --ccb-content-gap: var(--ccb-content-gap-tablet, var(--ccb-content-gap-desktop, 44px));
    --ccb-tabs-mt: var(--ccb-tabs-mt-tablet, var(--ccb-tabs-mt-desktop, 28px));
    --ccb-panel-mt: var(--ccb-panel-mt-tablet, var(--ccb-panel-mt-desktop, 28px));

    --ccb-title-size: var(--ccb-title-size-tablet, var(--ccb-title-size-desktop, 44px));
    --ccb-kicker-size: var(--ccb-kicker-size-tablet, var(--ccb-kicker-size-desktop, 12px));
    --ccb-heading-size: var(--ccb-heading-size-tablet, var(--ccb-heading-size-desktop, 28px));
    --ccb-body-size: var(--ccb-body-size-tablet, var(--ccb-body-size-desktop, 16px));
    --ccb-tab-label-size: var(--ccb-tab-label-size-tablet, var(--ccb-tab-label-size-desktop, 15px));
    --ccb-list-gap: var(--ccb-list-gap-tablet, var(--ccb-list-gap-desktop, 10px));
}

.ccb-pillars-tabs[data-preview-device="mobile"]{
    --ccb-pt: var(--ccb-pt-mobile, var(--ccb-pt-tablet, var(--ccb-pt-desktop, 80px)));
    --ccb-pr: var(--ccb-pr-mobile, var(--ccb-pr-tablet, var(--ccb-pr-desktop, 24px)));
    --ccb-tabs-gap: var(--ccb-tabs-gap-mobile, var(--ccb-tabs-gap-tablet, var(--ccb-tabs-gap-desktop, 10px)));
    --ccb-content-gap: var(--ccb-content-gap-mobile, var(--ccb-content-gap-tablet, var(--ccb-content-gap-desktop, 44px)));
    --ccb-tabs-mt: var(--ccb-tabs-mt-mobile, var(--ccb-tabs-mt-tablet, var(--ccb-tabs-mt-desktop, 28px)));
    --ccb-panel-mt: var(--ccb-panel-mt-mobile, var(--ccb-panel-mt-tablet, var(--ccb-panel-mt-desktop, 28px)));

    --ccb-title-size: var(--ccb-title-size-mobile, var(--ccb-title-size-tablet, var(--ccb-title-size-desktop, 44px)));
    --ccb-kicker-size: var(--ccb-kicker-size-mobile, var(--ccb-kicker-size-tablet, var(--ccb-kicker-size-desktop, 12px)));
    --ccb-heading-size: var(--ccb-heading-size-mobile, var(--ccb-heading-size-tablet, var(--ccb-heading-size-desktop, 28px)));
    --ccb-body-size: var(--ccb-body-size-mobile, var(--ccb-body-size-tablet, var(--ccb-body-size-desktop, 16px)));
    --ccb-tab-label-size: var(--ccb-tab-label-size-mobile, var(--ccb-tab-label-size-tablet, var(--ccb-tab-label-size-desktop, 15px)));
    --ccb-list-gap: var(--ccb-list-gap-mobile, var(--ccb-list-gap-tablet, var(--ccb-list-gap-desktop, 10px)));
}

/* Frontend responsive (viewport driven) */
@media (max-width: 1024px){
    .ccb-pillars-tabs{
        --ccb-pt: var(--ccb-pt-tablet, var(--ccb-pt-desktop, 80px));
        --ccb-pr: var(--ccb-pr-tablet, var(--ccb-pr-desktop, 24px));
        --ccb-tabs-gap: var(--ccb-tabs-gap-tablet, var(--ccb-tabs-gap-desktop, 10px));
        --ccb-content-gap: var(--ccb-content-gap-tablet, var(--ccb-content-gap-desktop, 44px));
        --ccb-tabs-mt: var(--ccb-tabs-mt-tablet, var(--ccb-tabs-mt-desktop, 28px));
        --ccb-panel-mt: var(--ccb-panel-mt-tablet, var(--ccb-panel-mt-desktop, 28px));

        --ccb-title-size: var(--ccb-title-size-tablet, var(--ccb-title-size-desktop, 44px));
        --ccb-kicker-size: var(--ccb-kicker-size-tablet, var(--ccb-kicker-size-desktop, 12px));
        --ccb-heading-size: var(--ccb-heading-size-tablet, var(--ccb-heading-size-desktop, 28px));
        --ccb-body-size: var(--ccb-body-size-tablet, var(--ccb-body-size-desktop, 16px));
        --ccb-tab-label-size: var(--ccb-tab-label-size-tablet, var(--ccb-tab-label-size-desktop, 15px));
        --ccb-list-gap: var(--ccb-list-gap-tablet, var(--ccb-list-gap-desktop, 10px));
    }
}

@media (max-width: 768px){
    .ccb-pillars-tabs{
        --ccb-pt: var(--ccb-pt-mobile, var(--ccb-pt-tablet, var(--ccb-pt-desktop, 80px)));
        --ccb-pr: var(--ccb-pr-mobile, var(--ccb-pr-tablet, var(--ccb-pr-desktop, 24px)));
        --ccb-tabs-gap: var(--ccb-tabs-gap-mobile, var(--ccb-tabs-gap-tablet, var(--ccb-tabs-gap-desktop, 10px)));
        --ccb-content-gap: var(--ccb-content-gap-mobile, var(--ccb-content-gap-tablet, var(--ccb-content-gap-desktop, 44px)));
        --ccb-tabs-mt: var(--ccb-tabs-mt-mobile, var(--ccb-tabs-mt-tablet, var(--ccb-tabs-mt-desktop, 28px)));
        --ccb-panel-mt: var(--ccb-panel-mt-mobile, var(--ccb-panel-mt-tablet, var(--ccb-panel-mt-desktop, 28px)));

        --ccb-title-size: var(--ccb-title-size-mobile, var(--ccb-title-size-tablet, var(--ccb-title-size-desktop, 44px)));
        --ccb-kicker-size: var(--ccb-kicker-size-mobile, var(--ccb-kicker-size-tablet, var(--ccb-kicker-size-desktop, 12px)));
        --ccb-heading-size: var(--ccb-heading-size-mobile, var(--ccb-heading-size-tablet, var(--ccb-heading-size-desktop, 28px)));
        --ccb-body-size: var(--ccb-body-size-mobile, var(--ccb-body-size-tablet, var(--ccb-body-size-desktop, 16px)));
        --ccb-tab-label-size: var(--ccb-tab-label-size-mobile, var(--ccb-tab-label-size-tablet, var(--ccb-tab-label-size-desktop, 15px)));
        --ccb-list-gap: var(--ccb-list-gap-mobile, var(--ccb-list-gap-tablet, var(--ccb-list-gap-desktop, 10px)));
    }
}

.ccb-pillars-tabs__inner{
    max-width: var(--ccb-max-width, 1200px);
    margin: 0 auto;
    padding: 0 var(--ccb-pr, 24px);
}

.ccb-pillars-tabs__title{
    font-size: var(--ccb-title-size, 44px);
    line-height: 1.15;
    font-weight: var(--ccb-title-weight, 700);
    text-align: center;
    letter-spacing: -0.01em;
    margin: 0;
}

.ccb-pillars-tabs__titleAccent{
    color: var(--ccb-accent, #4F7FB8);
}

.ccb-pillars-tabs__tabs{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--ccb-tabs-gap, 10px);
    margin-top: var(--ccb-tabs-mt, 28px);
    padding-bottom: 12px;
    position: relative;
}

.ccb-pillars-tabs__tab{
    appearance: none;
    border: none;
    background: var(--ccb-tab-bg, transparent);
    padding: var(--ccb-tab-py, 8px) var(--ccb-tab-px, 10px);
    display: inline-flex;
    align-items: center;
    gap: var(--ccb-icon-label-gap, 10px);
    cursor: pointer;
    border-radius: var(--ccb-tab-radius, 999px);
    font-size: var(--ccb-tab-label-size, 15px);
    line-height: 1.2;
}

.ccb-pillars-tabs__tab:focus{
    outline: 2px solid var(--ccb-accent, #4F7FB8);
    outline-offset: 2px;
}

.ccb-pillars-tabs__iconBox{
    width: var(--ccb-icon-box-size, 42px);
    height: var(--ccb-icon-box-size, 42px);
    border-radius: var(--ccb-icon-box-radius, 12px);
    background: var(--ccb-tab-idle-bg, #EEF4FA);
    color: var(--ccb-icon-color, var(--ccb-text, #1F2430));
    display: grid;
    place-items: center;
    flex: 0 0 auto;
}

.ccb-pillars-tabs__iconBox svg{
    width: var(--ccb-icon-size, 20px);
    height: var(--ccb-icon-size, 20px);
    display: block;
    fill: currentColor;
}

.ccb-pillars-tabs__label{
    font-weight: var(--ccb-tab-label-weight, 600);
    color: var(--ccb-tab-label-color, var(--ccb-text, #1F2430));
}

.ccb-pillars-tabs__tab.is-active{
    background: var(--ccb-tab-bg-active, var(--ccb-tab-bg, transparent));
}

.ccb-pillars-tabs__tab.is-active .ccb-pillars-tabs__iconBox{
    background: var(--ccb-tab-active-bg, #4F7FB8);
    color: var(--ccb-icon-active-color, #fff);
}

.ccb-pillars-tabs__tab.is-active .ccb-pillars-tabs__label{
    color: var(--ccb-tab-label-active-color, var(--ccb-accent, #4F7FB8));
}

.ccb-pillars-tabs__underlineTrack{
    position: relative;
    margin-top: 6px;
    height: max(var(--ccb-underline-h, 2px), var(--ccb-divider-h, 1px));
}

.ccb-pillars-tabs__underlineTrack::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--ccb-divider-h, 1px);
    background: var(--ccb-muted, #E6EDF5);
}

.ccb-pillars-tabs__underline{
    position: absolute;
    bottom: 0;
    left: 0;
    height: var(--ccb-underline-h, 2px);
    width: 0;
    background: var(--ccb-accent, #4F7FB8);
    transform: translateX(0);
    transition: transform 220ms ease, width 220ms ease;
}

.ccb-pillars-tabs[data-underline="0"] .ccb-pillars-tabs__underlineTrack{
    display: none;
}

.ccb-pillars-tabs--reduced-motion .ccb-pillars-tabs__underline{
    transition: none;
}

.ccb-pillars-tabs__panel{
    margin-top: var(--ccb-panel-mt, 28px);
}

.ccb-pillars-tabs__content{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "media text";
    align-items: center;
    gap: var(--ccb-content-gap, 44px);
}

.ccb-pillars-tabs__media{ grid-area: media; margin: 0; }
.ccb-pillars-tabs__text{ grid-area: text; }

.ccb-pillars-tabs__media img,
.ccb-pillars-tabs__media iframe,
.ccb-pillars-tabs__mediaPlaceholder{
    width: 100%;
    display: block;
    border-radius: var(--ccb-media-radius, 10px);
}

.ccb-pillars-tabs__media iframe{
    border: 0;
    aspect-ratio: 16 / 9;
}

.ccb-pillars-tabs__mediaPlaceholder{
    aspect-ratio: 4 / 3;
    background: var(--ccb-muted, #E6EDF5);
}

.ccb-pillars-tabs__mediaPlaceholder--youtube{
    aspect-ratio: 16 / 9;
}

.ccb-pillars-tabs__kicker{
    color: var(--ccb-accent, #4F7FB8);
    font-size: var(--ccb-kicker-size, 12px);
    font-weight: var(--ccb-kicker-weight, 700);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 0 0 10px 0;
}

.ccb-pillars-tabs__heading{
    font-size: var(--ccb-heading-size, 28px);
    line-height: 1.2;
    font-weight: var(--ccb-heading-weight, 700);
    margin: 0 0 14px 0;
}

.ccb-pillars-tabs__list{
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--ccb-list-gap, 10px);
    font-size: var(--ccb-body-size, 16px);
    line-height: var(--ccb-body-lh, 1.55);
}

.ccb-pillars-tabs__list li{
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.ccb-pillars-tabs__check{
    width: var(--ccb-check-size, 18px);
    height: var(--ccb-check-size, 18px);
    border-radius: 999px;
    background: var(--ccb-check, #7FBE4A);
    flex: 0 0 auto;
    position: relative;
    margin-top: 2px;
    color: #fff;
}

.ccb-pillars-tabs__check::after{
    content: "";
    position: absolute;
    left: calc(var(--ccb-check-size, 18px) * 0.28);
    top: calc(var(--ccb-check-size, 18px) * 0.18);
    width: calc(var(--ccb-check-size, 18px) * 0.33);
    height: calc(var(--ccb-check-size, 18px) * 0.5);
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
}

@media (max-width: 768px){
    .ccb-pillars-tabs__tabs{
        padding-bottom: 10px;
    }

    .ccb-pillars-tabs__content{
        grid-template-columns: 1fr;
    }

    .ccb-pillars-tabs[data-stack-order="media-top"] .ccb-pillars-tabs__content{
        grid-template-areas: "media" "text";
    }

    .ccb-pillars-tabs[data-stack-order="text-top"] .ccb-pillars-tabs__content{
        grid-template-areas: "text" "media";
    }
}

/* Feature Comparison */

.ccb-feature-comparison {
    --ccb-fc-bg: var(--ccb-fc-bg-desktop, #1F5EA8);
    --ccb-fc-pt: var(--ccb-fc-pt-desktop, 72px);
    --ccb-fc-pb: var(--ccb-fc-pb-desktop, 72px);

    --ccb-fc-title-color: var(--ccb-fc-title-color-desktop, #ffffff);
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-desktop, 40px);

    --ccb-fc-max-width: var(--ccb-fc-max-width, 1280px);

    --ccb-fc-text: var(--ccb-fc-text, #111827);
    --ccb-fc-table-bg: var(--ccb-fc-table-bg, #ffffff);
    --ccb-fc-header-bg: var(--ccb-fc-header-bg, #f3f4f6);
    --ccb-fc-group-bg: var(--ccb-fc-group-bg, #f3f4f6);
    --ccb-fc-border: var(--ccb-fc-border, #e5e7eb);
    --ccb-fc-check: var(--ccb-fc-check, #111827);

    --ccb-fc-header-fs: var(--ccb-fc-header-fs-desktop, 14px);
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-desktop, 14px);
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-desktop, 15px);

    --ccb-fc-cell-py: var(--ccb-fc-cell-py-desktop, 14px);
    --ccb-fc-first-col-w: var(--ccb-fc-first-col-w-desktop, 280px);

    background: var(--ccb-fc-bg);
    padding-top: var(--ccb-fc-pt);
    padding-bottom: var(--ccb-fc-pb);
    width: 100%;
}

/* Full-bleed breakout: prevent later block rules from overriding `.cgb--fullwidth` */
.ccb-feature-comparison.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* Editor preview mode (sync with toolbar device) */
.ccb-feature-comparison[data-preview-device="tablet"] {
    --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
    --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
}

.ccb-feature-comparison[data-preview-device="mobile"] {
    --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
    --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
}

@media (max-width: 1024px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
        --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
    }
}

@media (max-width: 768px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
        --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
    }
}

.ccb-feature-comparison__container {
    max-width: var(--ccb-fc-max-width);
    margin: 0 auto;
    padding: 0 24px;
}

.ccb-feature-comparison__title {
    color: var(--ccb-fc-title-color);
    font-size: var(--ccb-fc-title-fs);
    font-weight: 700;
    text-align: center;
    margin: 0 0 28px;
}

.ccb-feature-comparison__table-wrap {
    width: 100%;
}

/* Mobile scroll behavior */
.ccb-feature-comparison--scroll .ccb-feature-comparison__table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.ccb-feature-comparison__table {
    width: 100%;
    background: var(--ccb-fc-table-bg);
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--ccb-fc-border);
}

.ccb-feature-comparison__th,
.ccb-feature-comparison__td,
.ccb-feature-comparison__row-label,
.ccb-feature-comparison__group-cell {
    padding: var(--ccb-fc-cell-py) 14px;
    color: var(--ccb-fc-text);
    border-right: 1px solid var(--ccb-fc-border);
    border-bottom: 1px solid var(--ccb-fc-border);
    vertical-align: middle;
}

.ccb-feature-comparison__th:last-child,
.ccb-feature-comparison__td:last-child {
    border-right: 0;
}

.ccb-feature-comparison__th {
    background: var(--ccb-fc-header-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-header-fs);
    text-align: center;
}

.ccb-feature-comparison__th--feature {
    text-align: center;
    width: var(--ccb-fc-first-col-w);
}

.ccb-feature-comparison__group-row .ccb-feature-comparison__group-cell {
    background: var(--ccb-fc-group-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-group-fs);
    text-align: center;
}

.ccb-feature-comparison__row-label {
    font-weight: 500;
    font-size: var(--ccb-fc-label-fs);
    text-align: center;
}

.ccb-feature-comparison__td {
    text-align: center;
}

.ccb-feature-comparison__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ccb-fc-check);
}

.ccb-feature-comparison__check-icon {
    width: 18px;
    height: 18px;
    fill: currentColor;
    display: block;
}

.ccb-feature-comparison__feature-link,
.ccb-feature-comparison__cell-link {
    color: #2563eb;
    text-decoration: underline;
}

/* Global per-device visibility helpers */
@media (min-width: 1025px) {
    .cgb-hide-desktop {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .cgb-hide-tablet {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .cgb-hide-mobile {
        display: none !important;
    }
}

/* Simple CTA block styles */

.ccb-simple-cta {
    --ccb-scta-bg-start: #0f172a;
    --ccb-scta-bg-end: #111827;
    --ccb-scta-bg-angle: 180deg;

    --ccb-scta-py: var(--ccb-scta-py-desktop, 96px);
    --ccb-scta-px: var(--ccb-scta-px-desktop, 24px);
    --ccb-scta-gap: var(--ccb-scta-gap-desktop, 40px);
    --ccb-scta-minh: var(--ccb-scta-minh-desktop, auto);
    --ccb-scta-v-align: var(--ccb-scta-v-align, flex-start);

    --ccb-scta-maxw: var(--ccb-scta-maxw, 1200px);
    --ccb-scta-card-pad: var(--ccb-scta-card-pad-desktop, 44px);
    --ccb-scta-card-gap: var(--ccb-scta-card-gap-desktop, 22px);
    --ccb-scta-text-maxw: var(--ccb-scta-text-maxw, 520px);

    --ccb-scta-text-size: var(--ccb-scta-text-size-desktop, 18px);
    --ccb-scta-text-line: var(--ccb-scta-text-line, 1.6);
    --ccb-scta-text-color: var(--ccb-scta-text-color, var(--cgb-text-main));

    --ccb-scta-title-size: var(--ccb-scta-title-size-desktop, 32px);
    --ccb-scta-title-weight: var(--ccb-scta-title-weight, 800);
    --ccb-scta-title-color: var(--ccb-scta-title-color, currentColor);
    --ccb-scta-title-mt: var(--ccb-scta-title-mt-desktop, 0px);
    --ccb-scta-title-mb: var(--ccb-scta-title-mb-desktop, 28px);

    --ccb-scta-inline-text-size: var(--ccb-scta-inline-text-size-desktop, var(--ccb-scta-text-size-desktop, 18px));

    --ccb-scta-card-bg: var(--ccb-scta-card-bg, var(--cgb-bg-card));
    --ccb-scta-card-border: var(--ccb-scta-card-border, transparent);
    --ccb-scta-card-border-w: var(--ccb-scta-card-border-w, 0px);
    --ccb-scta-card-radius: var(--ccb-scta-card-radius, var(--cgb-radius-card));
    --ccb-scta-card-shadow: var(--ccb-scta-card-shadow, var(--cgb-shadow-card));
    --ccb-scta-card-shadow-hover: var(--ccb-scta-card-shadow-hover, var(--cgb-shadow-hover));
    --ccb-scta-card-hover-lift: var(--ccb-scta-card-hover-lift, 0px);

    --ccb-scta-btn-font-size: var(--ccb-scta-btn-font-size-desktop, 14px);
    --ccb-scta-btn-px: var(--ccb-scta-btn-px-desktop, 22px);
    --ccb-scta-btn-py: var(--ccb-scta-btn-py-desktop, 14px);
    --ccb-scta-btn-radius: var(--ccb-scta-btn-radius, var(--cgb-radius-pill));
    --ccb-scta-btn-border-w: var(--ccb-scta-btn-border-w, 0px);

    --ccb-scta-btn-hover-lift: var(--ccb-scta-btn-hover-lift, -1px);
    --ccb-scta-btn-hover-shadow: var(--ccb-scta-btn-hover-shadow, 0px);
    --ccb-scta-btn-hover-opacity: var(--ccb-scta-btn-hover-opacity, 0.97);

    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: var(--ccb-scta-v-align);
    padding: var(--ccb-scta-py) var(--ccb-scta-px);
    min-height: var(--ccb-scta-minh);
    background: linear-gradient(var(--ccb-scta-bg-angle) , var(--ccb-scta-bg-start) 0%, var(--ccb-scta-bg-end) 100%);
    color: #ffffff;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

/* Force full viewport width even inside boxed themes
   (needs to override .ccb-simple-cta { width: 100% } defined below global .cgb--fullwidth) */
.ccb-simple-cta.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-simple-cta__container {
    width: 100%;
    max-width: var(--ccb-scta-maxw);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.ccb-simple-cta__title {
    margin: var(--ccb-scta-title-mt) 0 var(--ccb-scta-title-mb);
    font-size: var(--ccb-scta-title-size);
    font-weight: var(--ccb-scta-title-weight);
    color: var(--ccb-scta-title-color);
    line-height: 1.15;
    text-align: center;
}

.ccb-simple-cta__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.ccb-simple-cta__bg-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    opacity: var(--ccb-scta-bg-opacity, 1);
}

.ccb-simple-cta__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--ccb-scta-gap);
    align-items: stretch;
}

.ccb-simple-cta--one .ccb-simple-cta__grid {
    grid-template-columns: 1fr;
}

.ccb-simple-cta--inline .ccb-simple-cta__grid {
    grid-template-columns: 1fr;
}

.ccb-simple-cta__card {
    background: var(--ccb-scta-card-bg);
    border: var(--ccb-scta-card-border-w) solid var(--ccb-scta-card-border);
    border-radius: var(--ccb-scta-card-radius);
    box-shadow: var(--ccb-scta-card-shadow);
    transition: transform 150ms ease, box-shadow 150ms ease;
    padding: var(--ccb-scta-card-pad);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    text-align: center;
    gap: var(--ccb-scta-card-gap);
}

.ccb-simple-cta--inline .ccb-simple-cta__card {
    align-items: stretch;
    text-align: center;
}

.ccb-simple-cta__inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ccb-scta-card-gap);
}

.ccb-simple-cta--inline .ccb-simple-cta__text {
    max-width: none;
    flex: 1 1 auto;
}

.ccb-simple-cta--inline .ccb-simple-cta__buttonWrap {
    width: auto;
    flex: 0 0 auto;
    justify-content: flex-end;
}

@media (max-width: 768px) {
    .ccb-simple-cta__inline {
        flex-direction: column;
        align-items: flex-start;
    }

    .ccb-simple-cta--inline .ccb-simple-cta__buttonWrap {
        width: 100%;
        justify-content: flex-start;
    }
}

.ccb-simple-cta__card:hover {
    transform: translateY(var(--ccb-scta-card-hover-lift));
    box-shadow: var(--ccb-scta-card-shadow-hover);
}

.ccb-simple-cta__text {
    max-width: var(--ccb-scta-text-maxw);
}

.ccb-simple-cta__text p {
    margin: 0;
    color: var(--ccb-scta-text-color);
    font-size: var(--ccb-scta-text-size);
    line-height: var(--ccb-scta-text-line);
}

.ccb-simple-cta--inline .ccb-simple-cta__text p {
    font-size: var(--ccb-scta-inline-text-size, var(--ccb-scta-text-size));
    line-height: var(--ccb-scta-inline-text-line, var(--ccb-scta-text-line));
    color: var(--ccb-scta-inline-text-color, var(--ccb-scta-text-color));
}

/* Highlight format (block-scoped): soft background + readable text */
.ccb-simple-cta .cgb-highlight {
    background: var(--cgb-primary-soft);
    color: var(--cgb-text-main);
    padding: 0 0.18em;
    border-radius: 0.2em;
}

.ccb-simple-cta__buttonWrap {
    width: 100%;
    display: flex;
    justify-content: center;
}

.ccb-simple-cta__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--ccb-scta-btn-py) var(--ccb-scta-btn-px);
    border-radius: var(--ccb-scta-btn-radius);
    font-weight: 800;
    text-decoration: none;
    letter-spacing: 0.04em;
    font-size: var(--ccb-scta-btn-font-size);
    border-width: var(--ccb-scta-btn-border-w);
    border-style: solid;
    transition: transform 120ms ease, opacity 120ms ease, box-shadow 120ms ease, filter 120ms ease;
}

.ccb-simple-cta__button.is-left {
    background: var(--ccb-scta-btn-left-bg, #2563eb);
    color: var(--ccb-scta-btn-left-color, #ffffff);
    border-color: var(--ccb-scta-btn-left-border, transparent);
}

.ccb-simple-cta__button.is-right {
    background: var(--ccb-scta-btn-right-bg, #10b981);
    color: var(--ccb-scta-btn-right-color, #ffffff);
    border-color: var(--ccb-scta-btn-right-border, transparent);
}

.ccb-simple-cta__button:hover {
    transform: translateY(var(--ccb-scta-btn-hover-lift));
    opacity: var(--ccb-scta-btn-hover-opacity);
    box-shadow:
        0 var(--ccb-scta-btn-hover-shadow) calc(var(--ccb-scta-btn-hover-shadow) * 2) rgba(15, 23, 42, 0.20);
}

.ccb-simple-cta__button.is-left:hover {
    background: var(--ccb-scta-btn-left-bg-hover, var(--ccb-scta-btn-left-bg, #2563eb));
    color: var(--ccb-scta-btn-left-color-hover, var(--ccb-scta-btn-left-color, #ffffff));
    border-color: var(--ccb-scta-btn-left-border-hover, var(--ccb-scta-btn-left-border, transparent));
}

.ccb-simple-cta__button.is-right:hover {
    background: var(--ccb-scta-btn-right-bg-hover, var(--ccb-scta-btn-right-bg, #10b981));
    color: var(--ccb-scta-btn-right-color-hover, var(--ccb-scta-btn-right-color, #ffffff));
    border-color: var(--ccb-scta-btn-right-border-hover, var(--ccb-scta-btn-right-border, transparent));
}

@media (max-width: 1024px) {
    .ccb-simple-cta {
        --ccb-scta-py: var(--ccb-scta-py-tablet, var(--ccb-scta-py-desktop, 96px));
        --ccb-scta-px: var(--ccb-scta-px-tablet, var(--ccb-scta-px-desktop, 24px));
        --ccb-scta-gap: var(--ccb-scta-gap-tablet, var(--ccb-scta-gap-desktop, 40px));
        --ccb-scta-minh: var(--ccb-scta-minh-tablet, var(--ccb-scta-minh-desktop, auto));
        --ccb-scta-card-pad: var(--ccb-scta-card-pad-tablet, var(--ccb-scta-card-pad-desktop, 44px));
        --ccb-scta-card-gap: var(--ccb-scta-card-gap-tablet, var(--ccb-scta-card-gap-desktop, 22px));
        --ccb-scta-text-size: var(--ccb-scta-text-size-tablet, var(--ccb-scta-text-size-desktop, 18px));
        --ccb-scta-inline-text-size: var(--ccb-scta-inline-text-size-tablet, var(--ccb-scta-inline-text-size-desktop, var(--ccb-scta-text-size-tablet, var(--ccb-scta-text-size-desktop, 18px))));
        --ccb-scta-title-size: var(--ccb-scta-title-size-tablet, var(--ccb-scta-title-size-desktop, 32px));
        --ccb-scta-title-mt: var(--ccb-scta-title-mt-tablet, var(--ccb-scta-title-mt-desktop, 0px));
        --ccb-scta-title-mb: var(--ccb-scta-title-mb-tablet, var(--ccb-scta-title-mb-desktop, 28px));
        --ccb-scta-btn-font-size: var(--ccb-scta-btn-font-size-tablet, var(--ccb-scta-btn-font-size-desktop, 14px));
        --ccb-scta-btn-px: var(--ccb-scta-btn-px-tablet, var(--ccb-scta-btn-px-desktop, 22px));
        --ccb-scta-btn-py: var(--ccb-scta-btn-py-tablet, var(--ccb-scta-btn-py-desktop, 14px));
    }

    .ccb-simple-cta__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .ccb-simple-cta {
        --ccb-scta-py: var(--ccb-scta-py-mobile, var(--ccb-scta-py-tablet, var(--ccb-scta-py-desktop, 96px)));
        --ccb-scta-px: var(--ccb-scta-px-mobile, var(--ccb-scta-px-tablet, var(--ccb-scta-px-desktop, 24px)));
        --ccb-scta-gap: var(--ccb-scta-gap-mobile, var(--ccb-scta-gap-tablet, var(--ccb-scta-gap-desktop, 40px)));
        --ccb-scta-minh: var(--ccb-scta-minh-mobile, var(--ccb-scta-minh-tablet, var(--ccb-scta-minh-desktop, auto)));
        --ccb-scta-card-pad: var(--ccb-scta-card-pad-mobile, var(--ccb-scta-card-pad-tablet, var(--ccb-scta-card-pad-desktop, 44px)));
        --ccb-scta-card-gap: var(--ccb-scta-card-gap-mobile, var(--ccb-scta-card-gap-tablet, var(--ccb-scta-card-gap-desktop, 22px)));
        --ccb-scta-text-size: var(--ccb-scta-text-size-mobile, var(--ccb-scta-text-size-tablet, var(--ccb-scta-text-size-desktop, 18px)));
        --ccb-scta-inline-text-size: var(--ccb-scta-inline-text-size-mobile, var(--ccb-scta-inline-text-size-tablet, var(--ccb-scta-inline-text-size-desktop, var(--ccb-scta-text-size-mobile, var(--ccb-scta-text-size-tablet, var(--ccb-scta-text-size-desktop, 18px))))));
        --ccb-scta-title-size: var(--ccb-scta-title-size-mobile, var(--ccb-scta-title-size-tablet, var(--ccb-scta-title-size-desktop, 32px)));
        --ccb-scta-title-mt: var(--ccb-scta-title-mt-mobile, var(--ccb-scta-title-mt-tablet, var(--ccb-scta-title-mt-desktop, 0px)));
        --ccb-scta-title-mb: var(--ccb-scta-title-mb-mobile, var(--ccb-scta-title-mb-tablet, var(--ccb-scta-title-mb-desktop, 28px)));
        --ccb-scta-btn-font-size: var(--ccb-scta-btn-font-size-mobile, var(--ccb-scta-btn-font-size-tablet, var(--ccb-scta-btn-font-size-desktop, 14px)));
        --ccb-scta-btn-px: var(--ccb-scta-btn-px-mobile, var(--ccb-scta-btn-px-tablet, var(--ccb-scta-btn-px-desktop, 22px)));
        --ccb-scta-btn-py: var(--ccb-scta-btn-py-mobile, var(--ccb-scta-btn-py-tablet, var(--ccb-scta-btn-py-desktop, 14px)));
    }
}

/* Follow Us */
.ccb-follow-us {
    background: var(--ccb-fu-bg, transparent);
    display: block;
    width: 100%;
    box-sizing: border-box;
    --ccb-fu-gap: var(--ccb-fu-gap-desktop, 12px);
    --ccb-fu-cols: var(--ccb-fu-cols-desktop, 6);
    --ccb-fu-maxw: var(--ccb-fu-maxw-desktop, none);
    max-width: var(--ccb-fu-maxw, none);
}

@media (max-width: 1024px) {
    .ccb-follow-us {
        --ccb-fu-gap: var(--ccb-fu-gap-tablet, var(--ccb-fu-gap-desktop, 12px));
        --ccb-fu-cols: var(--ccb-fu-cols-tablet, var(--ccb-fu-cols-desktop, 6));
        --ccb-fu-maxw: var(--ccb-fu-maxw-tablet, var(--ccb-fu-maxw-desktop, none));
    }
}

@media (max-width: 768px) {
    .ccb-follow-us {
        --ccb-fu-gap: var(--ccb-fu-gap-mobile, var(--ccb-fu-gap-tablet, var(--ccb-fu-gap-desktop, 12px)));
        --ccb-fu-cols: var(--ccb-fu-cols-mobile, var(--ccb-fu-cols-tablet, var(--ccb-fu-cols-desktop, 6)));
        --ccb-fu-maxw: var(--ccb-fu-maxw-mobile, var(--ccb-fu-maxw-tablet, var(--ccb-fu-maxw-desktop, none)));
    }
}

.ccb-follow-us__title {
    margin: 0 0 10px 0;
    text-align: center;
    color: var(--ccb-fu-title-color, inherit);
}

.ccb-follow-us__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-fu-cols, 6), minmax(0, 1fr));
    gap: var(--ccb-fu-gap, 12px);
    align-items: center;
    justify-items: start;
}

.ccb-follow-us__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: var(--ccb-fu-icon-color, inherit);
    opacity: 0.9;
    transition: opacity 0.2s;
}

.ccb-follow-us__item:hover {
    opacity: 1;
}

.ccb-follow-us__icon {
    width: var(--ccb-fu-icon-size, 24px);
    height: var(--ccb-fu-icon-size, 24px);
    display: inline-flex;
    flex-shrink: 0;
}

.ccb-follow-us__icon svg {
    width: 100%;
    height: 100%;
    display: block;
    fill: currentColor;
}

/* ── Follow Us inside Pre-Footer (match novade.net production style) ── */
.cgb-pre-footer .ccb-follow-us {
    padding-top: 0;
}

.cgb-pre-footer .ccb-follow-us__title {
    font-family: Lato, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--ccb-fu-title-color, #fff);
    padding-top: 30px;
    padding-bottom: 5px;
    margin: 0;
    text-align: center;
}

.cgb-pre-footer .ccb-follow-us__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-fu-cols, 3), auto);
    gap: var(--ccb-fu-gap, 4px);
    justify-content: start;
}

@media (max-width: 768px) {
    .cgb-pre-footer .ccb-follow-us__grid {
        grid-template-columns: repeat(6, auto);
    }
}

.cgb-pre-footer .ccb-follow-us__item {
    color: var(--ccb-fu-icon-color, #fff);
    opacity: 0.85;
    transition: opacity 0.2s ease;
}

.cgb-pre-footer .ccb-follow-us__item:hover {
    opacity: 1;
}

.cgb-pre-footer .ccb-follow-us__icon {
    width: var(--ccb-fu-icon-size, 40px);
    height: var(--ccb-fu-icon-size, 40px);
    flex-shrink: 0;
}

.cgb-pre-footer .ccb-follow-us__icon svg {
    width: 100%;
    height: 100%;
}

/* === SPLIT SECTION: MEDIA ENTRY ANIMATION === */
.ccb-split-section {
    --ccb-split-media-anim-enabled: var(--ccb-split-media-anim-enabled-d, 0);
    --ccb-split-media-anim-distance: var(--ccb-split-media-anim-distance-d, 200px);
    --ccb-split-media-anim-duration: var(--ccb-split-media-anim-duration-d, 700ms);
    --ccb-split-media-anim-delay: var(--ccb-split-media-anim-delay-d, 0ms);
    --ccb-split-media-anim-easing: var(--ccb-split-media-anim-easing-d, ease-out);
}

.ccb-split-section__container {
    --ccb-split-media-anim-from-x: calc(var(--ccb-split-media-anim-distance) * -1);
}

.ccb-split-section__container.is-reverse {
    --ccb-split-media-anim-from-x: var(--ccb-split-media-anim-distance);
}

.ccb-split-section.ccb-media-anim-enabled .ccb-split-section__media {
    opacity: 0;
    transform: translateX(var(--ccb-split-media-anim-from-x));
    transition-property: opacity, transform;
    transition-duration: var(--ccb-split-media-anim-duration);
    transition-timing-function: var(--ccb-split-media-anim-easing);
    transition-delay: var(--ccb-split-media-anim-delay);
    will-change: opacity, transform;
}

.ccb-split-section.ccb-media-anim-enabled.is-inview .ccb-split-section__media {
    opacity: 1;
    transform: translateX(0);
}

@media (prefers-reduced-motion: reduce) {
    .ccb-split-section.ccb-media-anim-enabled .ccb-split-section__media {
        opacity: 1;
        transform: none;
        transition: none;
        will-change: auto;
    }
}

@media (max-width: 1024px) {
    .ccb-split-section {
        --ccb-split-media-anim-enabled: var(--ccb-split-media-anim-enabled-t, var(--ccb-split-media-anim-enabled-d, 0));
        --ccb-split-media-anim-distance: var(--ccb-split-media-anim-distance-t, var(--ccb-split-media-anim-distance-d, 200px));
        --ccb-split-media-anim-duration: var(--ccb-split-media-anim-duration-t, var(--ccb-split-media-anim-duration-d, 700ms));
        --ccb-split-media-anim-delay: var(--ccb-split-media-anim-delay-t, var(--ccb-split-media-anim-delay-d, 0ms));
        --ccb-split-media-anim-easing: var(--ccb-split-media-anim-easing-t, var(--ccb-split-media-anim-easing-d, ease-out));
    }
}

@media (max-width: 768px) {
    .ccb-split-section {
        --ccb-split-media-anim-enabled: var(--ccb-split-media-anim-enabled-m, var(--ccb-split-media-anim-enabled-t, var(--ccb-split-media-anim-enabled-d, 0)));
        --ccb-split-media-anim-distance: var(--ccb-split-media-anim-distance-m, var(--ccb-split-media-anim-distance-t, var(--ccb-split-media-anim-distance-d, 200px)));
        --ccb-split-media-anim-duration: var(--ccb-split-media-anim-duration-m, var(--ccb-split-media-anim-duration-t, var(--ccb-split-media-anim-duration-d, 700ms)));
        --ccb-split-media-anim-delay: var(--ccb-split-media-anim-delay-m, var(--ccb-split-media-anim-delay-t, var(--ccb-split-media-anim-delay-d, 0ms)));
        --ccb-split-media-anim-easing: var(--ccb-split-media-anim-easing-m, var(--ccb-split-media-anim-easing-t, var(--ccb-split-media-anim-easing-d, ease-out)));
    }
}

/* Posts Grid */

.ccb-posts-grid {
    position: relative;
    background-color: var(--ccb-pg-bg, transparent);
    background-image: var(--ccb-pg-bg-image, none);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    margin-top: var(--ccb-pg-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-mb-desktop, 0px);

    padding-top: var(--ccb-pg-pt-desktop, 0px);
    padding-bottom: var(--ccb-pg-pb-desktop, 0px);
}

.ccb-posts-grid::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--ccb-pg-overlay-color, transparent);
    opacity: var(--ccb-pg-overlay-opacity, 0);
    pointer-events: none;
}

.ccb-posts-grid > .cgb-inner {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: var(--cgb-inner-max, 1200px);
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}

.ccb-posts-grid__section-title {
    margin-left: 0;
    margin-right: 0;
    margin-top: var(--ccb-pg-sec-title-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-sec-title-mb-desktop, 24px);
    text-align: var(--ccb-pg-sec-title-align, left);
    color: var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-pg-sec-title-fs-desktop, 32px);
    line-height: var(--ccb-pg-sec-title-lh-desktop, 1.2);
    font-weight: var(--ccb-pg-sec-title-fw-desktop, 800);
    letter-spacing: var(--ccb-pg-sec-title-ls-desktop, 0em);
}

.ccb-posts-grid__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-pg-cols-desktop, 3), minmax(0, 1fr));
    gap: var(--ccb-pg-gap-desktop, 24px);
}

.ccb-posts-grid__card {
    background: var(--ccb-pg-card-bg, var(--cgb-bg-card, #ffffff));
    color: var(--ccb-pg-card-text, var(--cgb-text-main, #3c434a));
    border: var(--ccb-pg-card-border-w, 0px) var(--ccb-pg-card-border-style, solid) var(--ccb-pg-card-border-color, transparent);
    border-radius: var(--ccb-pg-card-radius, var(--cgb-radius-card, 8px));
    box-shadow: var(--ccb-pg-card-shadow, var(--cgb-shadow-card, none));
    overflow: hidden;
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.ccb-posts-grid__card:hover {
    box-shadow: var(
        --ccb-pg-card-shadow-hover,
        var(--cgb-shadow-hover, var(--ccb-pg-card-shadow, var(--cgb-shadow-card, none)))
    );
}

.ccb-posts-grid__image {
    display: block;
    line-height: 0;
    aspect-ratio: var(--ccb-pg-image-ar, auto);
    overflow: hidden;
}

.ccb-posts-grid__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.ccb-posts-grid__content {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ccb-posts-grid__meta {
    color: var(--ccb-pg-meta-color, var(--cgb-text-muted, #646970));
    font-size: 12px;
    line-height: 1.4;
}

.ccb-posts-grid__meta-sep {
    margin: 0 6px;
    opacity: 0.8;
}

.ccb-posts-grid__title {
    font-size: var(--ccb-pg-title-fs-desktop, 20px);
    line-height: 1.2;
    font-weight: var(--ccb-pg-title-fw-desktop, 700);
    color: var(--ccb-pg-title-color-desktop, inherit);
    margin-top: var(--ccb-pg-title-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-title-mb-desktop, 0px);
}

.ccb-posts-grid__title a {
    color: inherit;
    text-decoration: none;
}

.ccb-posts-grid__excerpt {
    font-size: var(--ccb-pg-excerpt-fs-desktop, 14px);
    line-height: 1.6;
    margin: 0;
}

.ccb-posts-grid__readmore {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    align-self: flex-start;
    text-decoration: none;
}

.ccb-posts-grid__readmore--link {
    color: var(--ccb-pg-link-color, var(--cgb-primary, #5e17eb));
}

.ccb-posts-grid__readmore--button {
    background: var(--ccb-pg-btn-bg, var(--cgb-primary, #5e17eb));
    color: var(--ccb-pg-btn-text, #ffffff);
    padding: 10px 14px;
    border-radius: var(--cgb-radius-pill, 999px);
}

/* Card types */
.ccb-posts-grid--card-minimal .ccb-posts-grid__image {
    display: none;
}

.ccb-posts-grid--card-minimal .ccb-posts-grid__excerpt {
    display: none;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__card {
    display: grid;
    grid-template-columns: 40% 1fr;
    align-items: stretch;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__image {
    height: 100%;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__image img {
    height: 100%;
    object-fit: cover;
}

.ccb-posts-grid__empty {
    padding: 16px;
}

/* Tablet */
@media (max-width: 1024px) {
    .ccb-posts-grid {
        margin-top: var(--ccb-pg-mt-tablet, var(--ccb-pg-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-mb-tablet, var(--ccb-pg-mb-desktop, 0px));

        padding-top: var(--ccb-pg-pt-tablet, var(--ccb-pg-pt-desktop, 0px));
        padding-bottom: var(--ccb-pg-pb-tablet, var(--ccb-pg-pb-desktop, 0px));
    }

    .ccb-posts-grid > .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px));
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
    }

    .ccb-posts-grid__grid {
        grid-template-columns: repeat(var(--ccb-pg-cols-tablet, var(--ccb-pg-cols-desktop, 3)), minmax(0, 1fr));
        gap: var(--ccb-pg-gap-tablet, var(--ccb-pg-gap-desktop, 24px));
    }

    .ccb-posts-grid__section-title {
        margin-top: var(--ccb-pg-sec-title-mt-tablet, var(--ccb-pg-sec-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-sec-title-mb-tablet, var(--ccb-pg-sec-title-mb-desktop, 24px));
        color: var(--ccb-pg-sec-title-color-tablet, var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a)));
        font-size: var(--ccb-pg-sec-title-fs-tablet, var(--ccb-pg-sec-title-fs-desktop, 32px));
        line-height: var(--ccb-pg-sec-title-lh-tablet, var(--ccb-pg-sec-title-lh-desktop, 1.2));
        font-weight: var(--ccb-pg-sec-title-fw-tablet, var(--ccb-pg-sec-title-fw-desktop, 800));
        letter-spacing: var(--ccb-pg-sec-title-ls-tablet, var(--ccb-pg-sec-title-ls-desktop, 0em));
    }

    .ccb-posts-grid__title {
        font-size: var(--ccb-pg-title-fs-tablet, var(--ccb-pg-title-fs-desktop, 20px));
        font-weight: var(--ccb-pg-title-fw-tablet, var(--ccb-pg-title-fw-desktop, 700));
        color: var(--ccb-pg-title-color-tablet, var(--ccb-pg-title-color-desktop, inherit));
        margin-top: var(--ccb-pg-title-mt-tablet, var(--ccb-pg-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-title-mb-tablet, var(--ccb-pg-title-mb-desktop, 0px));
    }

    .ccb-posts-grid__excerpt {
        font-size: var(--ccb-pg-excerpt-fs-tablet, var(--ccb-pg-excerpt-fs-desktop, 14px));
    }
}

/* Mobile */
@media (max-width: 768px) {
    .ccb-posts-grid {
        margin-top: var(--ccb-pg-mt-mobile, var(--ccb-pg-mt-tablet, var(--ccb-pg-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-mb-mobile, var(--ccb-pg-mb-tablet, var(--ccb-pg-mb-desktop, 0px)));

        padding-top: var(--ccb-pg-pt-mobile, var(--ccb-pg-pt-tablet, var(--ccb-pg-pt-desktop, 0px)));
        padding-bottom: var(--ccb-pg-pb-mobile, var(--ccb-pg-pb-tablet, var(--ccb-pg-pb-desktop, 0px)));
    }

    .ccb-posts-grid > .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px)));
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
    }

    .ccb-posts-grid__grid {
        grid-template-columns: repeat(var(--ccb-pg-cols-mobile, 1), minmax(0, 1fr));
        gap: var(--ccb-pg-gap-mobile, var(--ccb-pg-gap-tablet, var(--ccb-pg-gap-desktop, 24px)));
    }

    .ccb-posts-grid__section-title {
        margin-top: var(--ccb-pg-sec-title-mt-mobile, var(--ccb-pg-sec-title-mt-tablet, var(--ccb-pg-sec-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-sec-title-mb-mobile, var(--ccb-pg-sec-title-mb-tablet, var(--ccb-pg-sec-title-mb-desktop, 24px)));
        color: var(--ccb-pg-sec-title-color-mobile, var(--ccb-pg-sec-title-color-tablet, var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a))));
        font-size: var(--ccb-pg-sec-title-fs-mobile, var(--ccb-pg-sec-title-fs-tablet, var(--ccb-pg-sec-title-fs-desktop, 32px)));
        line-height: var(--ccb-pg-sec-title-lh-mobile, var(--ccb-pg-sec-title-lh-tablet, var(--ccb-pg-sec-title-lh-desktop, 1.2)));
        font-weight: var(--ccb-pg-sec-title-fw-mobile, var(--ccb-pg-sec-title-fw-tablet, var(--ccb-pg-sec-title-fw-desktop, 800)));
        letter-spacing: var(--ccb-pg-sec-title-ls-mobile, var(--ccb-pg-sec-title-ls-tablet, var(--ccb-pg-sec-title-ls-desktop, 0em)));
    }

    .ccb-posts-grid__title {
        font-size: var(--ccb-pg-title-fs-mobile, var(--ccb-pg-title-fs-tablet, var(--ccb-pg-title-fs-desktop, 20px)));
        font-weight: var(--ccb-pg-title-fw-mobile, var(--ccb-pg-title-fw-tablet, var(--ccb-pg-title-fw-desktop, 700)));
        color: var(--ccb-pg-title-color-mobile, var(--ccb-pg-title-color-tablet, var(--ccb-pg-title-color-desktop, inherit)));
        margin-top: var(--ccb-pg-title-mt-mobile, var(--ccb-pg-title-mt-tablet, var(--ccb-pg-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-title-mb-mobile, var(--ccb-pg-title-mb-tablet, var(--ccb-pg-title-mb-desktop, 0px)));
    }

    .ccb-posts-grid__excerpt {
        font-size: var(--ccb-pg-excerpt-fs-mobile, var(--ccb-pg-excerpt-fs-tablet, var(--ccb-pg-excerpt-fs-desktop, 14px)));
    }

    .ccb-posts-grid--card-horizontal .ccb-posts-grid__card {
        grid-template-columns: 1fr;
    }

    .ccb-posts-grid--card-horizontal .ccb-posts-grid__image img {
        height: auto;
    }
}

/* ==============================
   Video + Accordion (ccb/video-accordion)
   ============================== */
.ccb-video-accordion {
    background: var(--ccb-va-bg, transparent);
    width: 100%;

    padding-top: var(--ccb-va-pt-desktop, 64px);
    padding-bottom: var(--ccb-va-pb-desktop, 64px);
}

.ccb-video-accordion .cgb-inner {
    width: 100%;
    max-width: var(--cgb-inner-max, 1200px);
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}

.ccb-video-accordion__grid {
    display: grid;
    grid-template-columns: minmax(0, var(--ccb-va-media-w-desktop, 45%)) minmax(0, 1fr);
    gap: var(--ccb-va-gap-desktop, 48px);
    align-items: start;
    box-shadow: var(--ccb-va-card-shadow, none);
    border-radius: var(--ccb-va-card-radius, 0);
    background: var(--ccb-va-card-bg, transparent);
    padding: var(--ccb-va-card-pad, 0);
}

.ccb-video-accordion__media {
    min-width: 0;
}

.ccb-video-accordion__media--hidden {
    display: none;
}

.ccb-video-accordion__media-frame {
    position: relative;
    border-radius: 2px;
    overflow: hidden;
    background: var(--cgb-bg-card, #ffffff);
    aspect-ratio: 16 / 10;
}

.ccb-video-accordion__media-frame img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.ccb-video-accordion__media-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cgb-text-muted, #646970);
    font-size: 14px;
    background: var(--cgb-bg-app, #f9f9f9);
    border: 1px dashed var(--cgb-border-subtle, #e2e4e7);
}

.ccb-video-accordion__media-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.ccb-video-accordion__youtube-preview {
    display: block;
    cursor: pointer;
    outline: none;
}

.ccb-video-accordion__youtube-preview[data-has-custom-poster="1"] .ccb-video-accordion__play {
    display: none;
}

.ccb-video-accordion__youtube-preview.is-playing .ccb-video-accordion__media-frame {
    aspect-ratio: 16 / 9;
}

.ccb-video-accordion__youtube-preview.is-playing iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.ccb-video-accordion__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.ccb-video-accordion__play-icon {
    width: 72px;
    height: 72px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ccb-va-btn-bg, var(--cgb-primary, #5e17eb)) 70%, transparent);
    color: var(--ccb-va-btn-text, #ffffff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
}

.ccb-video-accordion__media-actions {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ccb-video-accordion__media-btn {
    display: flex;
    width: 100%;
    margin-bottom: var(--ccb-va-media-btn-mb, 0);
    align-items: center;
    justify-content: center;
    align-self: stretch;
    padding: 14px 16px;
    border-radius: 0;
    border-bottom: var(--ccb-va-media-btn-bw, 3px) solid var(--ccb-va-media-btn-border, var(--cgb-primary, #7ab51d));
    border-left: var(--ccb-va-media-btn-bw, 3px) solid var(--ccb-va-media-btn-border, var(--cgb-primary, #7ab51d));
    border-right: var(--ccb-va-media-btn-bw, 3px) solid var(--ccb-va-media-btn-border, var(--cgb-primary, #7ab51d));
    border-top: none;
    background: var(--ccb-va-media-btn-bg, #fff);
    color: var(--ccb-va-media-btn-text, var(--cgb-primary, #7ab51d));
    text-decoration: none;
    font-weight: 600;
    font-style: var(--ccb-va-media-btn-fs, italic);
    font-size: var(--ccb-va-media-btn-fz, 18px);
    transition: background .25s, color .25s;
}

.ccb-video-accordion__media-btn:hover {
    background: var(--ccb-va-media-btn-bg-hover, var(--ccb-va-media-btn-border, var(--cgb-primary, #7ab51d)));
    color: var(--ccb-va-media-btn-text-hover, #fff);
}

.ccb-video-accordion__media-desc {
    margin: 0;
    color: var(--ccb-va-desc-color, var(--cgb-text-muted, #646970));
    font-size: 14px;
    line-height: 1.6;
}

.ccb-video-accordion__content {
    min-width: 0;
}

.ccb-video-accordion__heading {
    margin: 0 0 18px 0;
    color: var(--ccb-va-heading, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-va-heading-fs-desktop, 44px);
    line-height: 1.1;
    font-weight: 800;
}

.ccb-video-accordion__accordion {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ccb-video-accordion__item {
    border-bottom: 1px solid var(--ccb-va-border, var(--cgb-border-subtle, #e2e4e7));
}

.ccb-video-accordion__summary {
    list-style: none;
    cursor: pointer;
    padding: 16px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;

    color: var(--ccb-va-item-title, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-va-item-title-fs-desktop, 20px);
    font-weight: 700;
}

.ccb-video-accordion__summary::-webkit-details-marker {
    display: none;
}

.ccb-video-accordion__summary::after {
    content: '+';
    margin-left: 16px;
    color: var(--ccb-va-accent, var(--cgb-primary, #5e17eb));
    font-size: 22px;
    line-height: 1;
    font-weight: 700;
}

.ccb-video-accordion__item[open] > .ccb-video-accordion__summary::after {
    content: '–';
}

.ccb-video-accordion__body {
    padding: 0;
    color: var(--ccb-va-item-body, var(--cgb-text-muted, #646970));
    font-size: 14px;
    line-height: 1.7;

    overflow: hidden;
    max-height: 0;
    transition: max-height 250ms ease, padding-bottom 250ms ease;
}

.ccb-video-accordion__item[open] > .ccb-video-accordion__body {
    padding-bottom: 14px;
}

/* Editor-only: keep accordion bodies visible while editing.
   The edit() markup does not use <details open>, so without this the bullets collapse. */
.editor-styles-wrapper .ccb-video-accordion__body,
.block-editor-block-list__layout .ccb-video-accordion__body {
    max-height: none;
    overflow: visible;
    padding-bottom: 14px;
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .ccb-video-accordion__body {
        transition: none;
    }
}

.ccb-video-accordion__bullets {
    margin: 0;
    padding-left: 18px;
}

.ccb-video-accordion__empty {
    margin: 0;
    opacity: 0.8;
}

.ccb-video-accordion__cta {
    margin-top: 18px;
}

.ccb-video-accordion__cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 2px;
    background: var(--ccb-va-btn-bg, var(--cgb-primary, #5e17eb));
    color: var(--ccb-va-btn-text, #ffffff);
    text-decoration: none;
    font-weight: 600;
}

.ccb-video-accordion__cta-btn:hover {
    background: var(--ccb-va-btn-bg-hover, var(--ccb-va-btn-bg, var(--cgb-primary, #5e17eb)));
    color: var(--ccb-va-btn-text-hover, var(--ccb-va-btn-text, #ffffff));
}

/* Device-based media visibility (frontend breakpoints) */
.ccb-video-accordion[data-media-desktop="0"] .ccb-video-accordion__media {
    display: none;
}

@media (max-width: 1024px) {
    .ccb-video-accordion {
        padding-top: var(--ccb-va-pt-tablet, var(--ccb-va-pt-desktop, 64px));
        padding-bottom: var(--ccb-va-pb-tablet, var(--ccb-va-pb-desktop, 64px));
    }

    .ccb-video-accordion .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px));
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
    }

    .ccb-video-accordion__grid {
        grid-template-columns: minmax(0, var(--ccb-va-media-w-tablet, var(--ccb-va-media-w-desktop, 45%))) minmax(0, 1fr);
        gap: var(--ccb-va-gap-tablet, var(--ccb-va-gap-desktop, 48px));
    }

    .ccb-video-accordion__heading {
        font-size: var(--ccb-va-heading-fs-tablet, var(--ccb-va-heading-fs-desktop, 44px));
    }

    .ccb-video-accordion__summary {
        font-size: var(--ccb-va-item-title-fs-tablet, var(--ccb-va-item-title-fs-desktop, 20px));
    }

    .ccb-video-accordion[data-media-tablet="0"] .ccb-video-accordion__media {
        display: none;
    }
}

@media (max-width: 768px) {
    .ccb-video-accordion {
        padding-top: var(--ccb-va-pt-mobile, var(--ccb-va-pt-tablet, var(--ccb-va-pt-desktop, 64px)));
        padding-bottom: var(--ccb-va-pb-mobile, var(--ccb-va-pb-tablet, var(--ccb-va-pb-desktop, 64px)));
    }

    .ccb-video-accordion .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px)));
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
    }

    .ccb-video-accordion__grid {
        grid-template-columns: 1fr;
        gap: var(--ccb-va-gap-mobile, var(--ccb-va-gap-tablet, var(--ccb-va-gap-desktop, 48px)));
    }

    .ccb-video-accordion__heading {
        font-size: var(--ccb-va-heading-fs-mobile, var(--ccb-va-heading-fs-tablet, var(--ccb-va-heading-fs-desktop, 44px)));
    }

    .ccb-video-accordion__summary {
        font-size: var(--ccb-va-item-title-fs-mobile, var(--ccb-va-item-title-fs-tablet, var(--ccb-va-item-title-fs-desktop, 20px)));
    }

    .ccb-video-accordion[data-media-mobile="0"] .ccb-video-accordion__media {
        display: none;
    }
}

/* Animated Carousel Grid */
.ccb-animated-carousel-grid {
    background-color: var(--ccb-acg-bg, transparent);
    margin-top: var(--ccb-acg-mt-desktop, 0px);
    margin-bottom: var(--ccb-acg-mb-desktop, 0px);

    padding-top: var(--ccb-acg-pt-desktop, 40px);
    padding-bottom: var(--ccb-acg-pb-desktop, 40px);
    padding-left: var(--ccb-acg-pl-desktop, 24px);
    padding-right: var(--ccb-acg-pr-desktop, 24px);

    width: 100%;

    --ccb-acg-subtitle-color: var(--ccb-acg-title-color, #0F172A);
    --ccb-acg-subtitle-fw: 600;
    --ccb-acg-text-align: var(--ccb-acg-text-align-desktop, left);
}

/* Force full viewport width even inside boxed themes */
.ccb-animated-carousel-grid.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

/* Fallback: make core alignment work even if the theme doesn't handle it */
.wp-block-ccb-animated-carousel-grid.alignfull,
.wp-block-ccb-animated-carousel-grid.alignwide {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

.ccb-animated-carousel-grid .cgb-inner {
    width: 100%;
    max-width: var(--cgb-inner-max, 1200px);
    margin: 0 auto;
    box-sizing: border-box;
}

.ccb-animated-carousel-grid .ccb-acg__heading {
    text-align: center;
    margin: 0 0 40px 0;
}

.ccb-animated-carousel-grid--testimonial {
    --ccb-acg-text-align: center;
    --ccb-acg-subtitle-color: var(--ccb-acg-quote-color, var(--cgb-text-main, #64748b));
    --ccb-acg-subtitle-fw: 400;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__card {
    aspect-ratio: auto;
    min-height: 320px;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__bg {
    display: none;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__content {
    justify-content: center;
    align-items: center;
    text-align: center;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__icon {
    width: var(--ccb-acg-testi-icon-size, 72px);
    height: var(--ccb-acg-testi-icon-size, 72px);
    margin: 6px auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__icon img {
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__icon-placeholder {
    width: 100%;
    height: 100%;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__title {
    margin-bottom: 16px;
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__subtitle {
    margin-bottom: 0;
    font-weight: var(--ccb-acg-testi-quote-fw, 400);
}

.ccb-animated-carousel-grid--testimonial .ccb-acg__cta {
    display: none;
}

/* Cards/track should be truly fullwidth in this block */
.ccb-animated-carousel-grid.cgb--fullwidth .cgb-inner {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* Astra safety-net: some templates hard-limit blocks to ~900px/920px */
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-animated-carousel-grid.alignwide,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-animated-carousel-grid.alignfull,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-animated-carousel-grid.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

.ccb-animated-carousel-grid .ccb-acg__viewport {
    overflow-x: hidden;
    overflow-y: visible;
    max-height: var(--ccb-acg-max-h, none);
    padding-top: 6px;
    padding-bottom: 6px;
}

.ccb-animated-carousel-grid.ccb-acg--constrained .ccb-acg__viewport {
    overflow-y: auto;
}

/* Fallback (no JS): grid */
.ccb-animated-carousel-grid .ccb-acg__track {
    display: grid;
    grid-template-columns: repeat(var(--ccb-acg-cols-desktop, 4), minmax(0, 1fr));
    gap: var(--ccb-acg-gap, 16px);
}

/* JS mode: continuous marquee */
.ccb-animated-carousel-grid.is-animated .ccb-acg__track {
    display: flex;
    align-items: stretch;
    will-change: transform;
}

.ccb-animated-carousel-grid .ccb-acg__item {
    margin: var(--ccb-acg-card-m-desktop, 0px);
}

.ccb-animated-carousel-grid .ccb-acg__card {
    display: flex;
    flex-direction: column;
    aspect-ratio: 1 / 1;
    width: 100%;

    background: var(--ccb-acg-card-bg, #ffffff);
    border: var(--ccb-acg-card-border-w, 0px) solid var(--ccb-acg-card-border-color, transparent);
    border-radius: var(--ccb-acg-card-radius, 12px);
    box-shadow: var(--ccb-acg-card-shadow, none);
    overflow: hidden;

    box-sizing: border-box;

    position: relative;
    padding: 0;

    transform: translateY(0);
    transition: transform 180ms ease;
}

.ccb-animated-carousel-grid .ccb-acg__card:hover,
.ccb-animated-carousel-grid .ccb-acg__card:focus-within {
    transform: translateY(-4px);
}

.ccb-animated-carousel-grid .ccb-acg__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.ccb-animated-carousel-grid .ccb-acg__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.35) 0%,
        rgba(0, 0, 0, 0.55) 100%
    );
}

.ccb-animated-carousel-grid .ccb-acg__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1);
    transition: transform 250ms ease;
}

.ccb-animated-carousel-grid .ccb-acg__card:hover .ccb-acg__bg img,
.ccb-animated-carousel-grid .ccb-acg__card:focus-within .ccb-acg__bg img {
    transform: scale(1.05);
}

.ccb-animated-carousel-grid .ccb-acg__content {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: var(--ccb-acg-card-p-desktop, 16px);
}

.ccb-animated-carousel-grid .ccb-acg__title {
    color: var(--ccb-acg-title-color, #0F172A);
    font-size: var(--ccb-acg-title-fs-desktop, 16px);
    line-height: var(--ccb-acg-title-lh-desktop, 1.2);
    letter-spacing: var(--ccb-acg-title-ls-desktop, 0px);
    margin-bottom: var(--ccb-acg-title-mb-desktop, 12px);

    font-weight: 700;
    text-align: var(--ccb-acg-text-align, left);
}

.ccb-animated-carousel-grid .ccb-acg__subtitle {
    color: var(--ccb-acg-subtitle-color, var(--ccb-acg-title-color, #0F172A));
    font-weight: var(--ccb-acg-subtitle-fw, 600);
    font-size: var(--ccb-acg-subtitle-fs-desktop, 14px);
    line-height: var(--ccb-acg-subtitle-lh-desktop, 1.35);
    letter-spacing: var(--ccb-acg-subtitle-ls-desktop, 0px);
    margin: 0 0 var(--ccb-acg-subtitle-mb-desktop, 12px) 0;
    text-align: var(--ccb-acg-text-align, left);
}

.ccb-animated-carousel-grid .ccb-acg__img-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--cgb-text-main, #64748b);
    background: var(--cgb-bg-app, #f1f5f9);
}

.ccb-animated-carousel-grid .ccb-acg__cta {
    margin-top: auto;
    padding-top: 12px;
}

.ccb-animated-carousel-grid .ccb-acg__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;

    gap: 8px;

    padding: 10px 12px;
    border-radius: var(--ccb-acg-btn-radius, 10px);
    text-decoration: none;

    background: var(--ccb-acg-btn-bg, #0F172A);
    color: var(--ccb-acg-btn-color, #ffffff);

    font-weight: 700;
    font-size: 14px;
    transition: opacity 150ms ease, transform 150ms ease, filter 150ms ease, background 150ms ease, color 150ms ease;
    cursor: pointer;
}

.ccb-animated-carousel-grid .ccb-acg__button:hover,
.ccb-animated-carousel-grid .ccb-acg__button:focus-visible {
    background: var(--ccb-acg-btn-bg-hover, var(--ccb-acg-btn-bg, #0F172A));
    color: var(--ccb-acg-btn-color-hover, var(--ccb-acg-btn-color, #ffffff));
    opacity: 0.92;
    transform: translateY(-1px);
    filter: var(--ccb-acg-btn-hover-filter, brightness(1.08));
}

.ccb-animated-carousel-grid .ccb-acg__button:active {
    opacity: 0.95;
    transform: translateY(0);
    filter: var(--ccb-acg-btn-active-filter, brightness(1.02));
}

.ccb-animated-carousel-grid .ccb-acg__btn-icon {
    width: var(--ccb-acg-btn-icon-size, 18px);
    height: var(--ccb-acg-btn-icon-size, 18px);
    flex: 0 0 auto;
    color: var(--ccb-acg-btn-icon-color, currentColor);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ccb-animated-carousel-grid .ccb-acg__btn-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
    display: block;
}

@media (max-width: 1024px) {
    .ccb-animated-carousel-grid {
        margin-top: var(--ccb-acg-mt-tablet, var(--ccb-acg-mt-desktop, 0px));
        margin-bottom: var(--ccb-acg-mb-tablet, var(--ccb-acg-mb-desktop, 0px));

        padding-top: var(--ccb-acg-pt-tablet, var(--ccb-acg-pt-desktop, 40px));
        padding-bottom: var(--ccb-acg-pb-tablet, var(--ccb-acg-pb-desktop, 40px));
        padding-left: var(--ccb-acg-pl-tablet, var(--ccb-acg-pl-desktop, 24px));
        padding-right: var(--ccb-acg-pr-tablet, var(--ccb-acg-pr-desktop, 24px));

        --ccb-acg-text-align: var(--ccb-acg-text-align-tablet, var(--ccb-acg-text-align-desktop, left));
    }

    .ccb-animated-carousel-grid .ccb-acg__track {
        grid-template-columns: repeat(var(--ccb-acg-cols-tablet, var(--ccb-acg-cols-desktop, 4)), minmax(0, 1fr));
    }

    .ccb-animated-carousel-grid .ccb-acg__item {
        margin: var(--ccb-acg-card-m-tablet, var(--ccb-acg-card-m-desktop, 0px));
    }

    .ccb-animated-carousel-grid .ccb-acg__content {
        padding: var(--ccb-acg-card-p-tablet, var(--ccb-acg-card-p-desktop, 16px));
    }

    .ccb-animated-carousel-grid .ccb-acg__subtitle {
        font-size: var(--ccb-acg-subtitle-fs-tablet, var(--ccb-acg-subtitle-fs-desktop, 14px));
        line-height: var(--ccb-acg-subtitle-lh-tablet, var(--ccb-acg-subtitle-lh-desktop, 1.35));
        letter-spacing: var(--ccb-acg-subtitle-ls-tablet, var(--ccb-acg-subtitle-ls-desktop, 0px));
        margin-bottom: var(--ccb-acg-subtitle-mb-tablet, var(--ccb-acg-subtitle-mb-desktop, 12px));
    }

    .ccb-animated-carousel-grid .ccb-acg__title {
        font-size: var(--ccb-acg-title-fs-tablet, var(--ccb-acg-title-fs-desktop, 16px));
        line-height: var(--ccb-acg-title-lh-tablet, var(--ccb-acg-title-lh-desktop, 1.2));
        letter-spacing: var(--ccb-acg-title-ls-tablet, var(--ccb-acg-title-ls-desktop, 0px));
        margin-bottom: var(--ccb-acg-title-mb-tablet, var(--ccb-acg-title-mb-desktop, 12px));
    }
}

@media (max-width: 768px) {
    .ccb-animated-carousel-grid {
        margin-top: var(--ccb-acg-mt-mobile, var(--ccb-acg-mt-tablet, var(--ccb-acg-mt-desktop, 0px)));
        margin-bottom: var(--ccb-acg-mb-mobile, var(--ccb-acg-mb-tablet, var(--ccb-acg-mb-desktop, 0px)));

        padding-top: var(--ccb-acg-pt-mobile, var(--ccb-acg-pt-tablet, var(--ccb-acg-pt-desktop, 40px)));
        padding-bottom: var(--ccb-acg-pb-mobile, var(--ccb-acg-pb-tablet, var(--ccb-acg-pb-desktop, 40px)));
        padding-left: var(--ccb-acg-pl-mobile, var(--ccb-acg-pl-tablet, var(--ccb-acg-pl-desktop, 24px)));
        padding-right: var(--ccb-acg-pr-mobile, var(--ccb-acg-pr-tablet, var(--ccb-acg-pr-desktop, 24px)));

        --ccb-acg-text-align: var(--ccb-acg-text-align-mobile, var(--ccb-acg-text-align-tablet, var(--ccb-acg-text-align-desktop, left)));
    }

    .ccb-animated-carousel-grid .ccb-acg__track {
        grid-template-columns: repeat(var(--ccb-acg-cols-mobile, var(--ccb-acg-cols-tablet, var(--ccb-acg-cols-desktop, 4))), minmax(0, 1fr));
    }

    .ccb-animated-carousel-grid .ccb-acg__item {
        margin: var(--ccb-acg-card-m-mobile, var(--ccb-acg-card-m-tablet, var(--ccb-acg-card-m-desktop, 0px)));
    }

    .ccb-animated-carousel-grid .ccb-acg__content {
        padding: var(--ccb-acg-card-p-mobile, var(--ccb-acg-card-p-tablet, var(--ccb-acg-card-p-desktop, 16px)));
    }

    .ccb-animated-carousel-grid .ccb-acg__title {
        font-size: var(--ccb-acg-title-fs-mobile, var(--ccb-acg-title-fs-tablet, var(--ccb-acg-title-fs-desktop, 16px)));
        line-height: var(--ccb-acg-title-lh-mobile, var(--ccb-acg-title-lh-tablet, var(--ccb-acg-title-lh-desktop, 1.2)));
        letter-spacing: var(--ccb-acg-title-ls-mobile, var(--ccb-acg-title-ls-tablet, var(--ccb-acg-title-ls-desktop, 0px)));
        margin-bottom: var(--ccb-acg-title-mb-mobile, var(--ccb-acg-title-mb-tablet, var(--ccb-acg-title-mb-desktop, 12px)));
    }

    .ccb-animated-carousel-grid .ccb-acg__subtitle {
        font-size: var(--ccb-acg-subtitle-fs-mobile, var(--ccb-acg-subtitle-fs-tablet, var(--ccb-acg-subtitle-fs-desktop, 14px)));
        line-height: var(--ccb-acg-subtitle-lh-mobile, var(--ccb-acg-subtitle-lh-tablet, var(--ccb-acg-subtitle-lh-desktop, 1.35)));
        letter-spacing: var(--ccb-acg-subtitle-ls-mobile, var(--ccb-acg-subtitle-ls-tablet, var(--ccb-acg-subtitle-ls-desktop, 0px)));
        margin-bottom: var(--ccb-acg-subtitle-mb-mobile, var(--ccb-acg-subtitle-mb-tablet, var(--ccb-acg-subtitle-mb-desktop, 12px)));
    }
}


/* Icon + Media Grid (ccb/icon-media-grid) */

.ccb-icon-media-grid {
    padding-top: var(--ccb-imgg-pt-desktop, 60px);
    padding-bottom: var(--ccb-imgg-pb-desktop, 60px);
    background-color: var(--ccb-imgg-bg-desktop, transparent);
}

.ccb-icon-media-grid__inner {
    max-width: var(--ccb-imgg-maxw-desktop, 1280px);
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}

.ccb-icon-media-grid__header {
    margin-bottom: var(--ccb-imgg-hmb-desktop, 40px);
    text-align: var(--ccb-imgg-ta-desktop, left);
}

.ccb-icon-media-grid__heading {
    font-size: var(--ccb-imgg-hfs-desktop, 36px);
    color: var(--ccb-imgg-hc-desktop, inherit);
    line-height: var(--ccb-imgg-hlh-desktop, 1.15);
    letter-spacing: var(--ccb-imgg-hls-desktop, 0px);
    margin: 0 0 var(--ccb-imgg-hmbt-desktop, 12px) 0;
}

.ccb-icon-media-grid__subtitle {
    font-size: var(--ccb-imgg-sfs-desktop, 18px);
    color: var(--ccb-imgg-sc-desktop, inherit);
    line-height: var(--ccb-imgg-slh-desktop, 1.5);
    letter-spacing: var(--ccb-imgg-sls-desktop, 0px);
    margin: 0;
}

.ccb-icon-media-grid__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--ccb-imgg-gap-desktop, 24px);
}

.ccb-icon-media-grid__col {
    display: grid;
    grid-template-rows: auto auto;
    gap: var(--ccb-imgg-cgap-desktop, 16px);
    overflow: hidden;
}

.ccb-icon-media-grid__media {
    overflow: hidden;
}

.ccb-icon-media-grid__top {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    column-gap: var(--ccb-imgg-igap-desktop, 12px);
}

.ccb-icon-media-grid__icon img {
    width: var(--ccb-imgg-isz-desktop, 24px);
    height: var(--ccb-imgg-isz-desktop, 24px);
    object-fit: contain;
    display: block;
}

.ccb-icon-media-grid__item-title {
    font-size: var(--ccb-imgg-itfs-desktop, 16px);
    color: var(--ccb-imgg-itc-desktop, inherit);
    line-height: var(--ccb-imgg-itlh-desktop, 1.2);
    letter-spacing: var(--ccb-imgg-itls-desktop, 0px);
    font-weight: var(--ccb-imgg-itfw, 600);
}

.ccb-icon-media-grid__item-subtitle {
    font-size: var(--ccb-imgg-isfs-desktop, 14px);
    color: var(--ccb-imgg-isc-desktop, inherit);
    line-height: var(--ccb-imgg-islh-desktop, 1.35);
    letter-spacing: var(--ccb-imgg-isls-desktop, 0px);
    opacity: var(--ccb-imgg-isop, 0.85);
}

.ccb-icon-media-grid__media img {
    width: var(--ccb-imgg-mmw-desktop, 100%);
    max-width: none;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: var(--ccb-imgg-mr-desktop, 0px);
    transform: translateX(var(--ccb-imgg-mox-desktop, 0px));
}

@media (max-width: 1024px) {
    .ccb-icon-media-grid__inner {
        max-width: var(--ccb-imgg-maxw-tablet, var(--ccb-imgg-maxw-desktop, 1280px));
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 768px) {
    .ccb-icon-media-grid__grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1024px) {
    .ccb-icon-media-grid {
        padding-top: var(--ccb-imgg-pt-tablet, var(--ccb-imgg-pt-desktop, 60px));
        padding-bottom: var(--ccb-imgg-pb-tablet, var(--ccb-imgg-pb-desktop, 60px));
        background-color: var(--ccb-imgg-bg-tablet, var(--ccb-imgg-bg-desktop, transparent));
    }

    .ccb-icon-media-grid__header {
        margin-bottom: var(--ccb-imgg-hmb-tablet, var(--ccb-imgg-hmb-desktop, 40px));
        text-align: var(--ccb-imgg-ta-tablet, var(--ccb-imgg-ta-desktop, left));
    }

    .ccb-icon-media-grid__heading {
        font-size: var(--ccb-imgg-hfs-tablet, var(--ccb-imgg-hfs-desktop, 36px));
        color: var(--ccb-imgg-hc-tablet, var(--ccb-imgg-hc-desktop, inherit));
        line-height: var(--ccb-imgg-hlh-tablet, var(--ccb-imgg-hlh-desktop, 1.15));
        letter-spacing: var(--ccb-imgg-hls-tablet, var(--ccb-imgg-hls-desktop, 0px));
        margin-bottom: var(--ccb-imgg-hmbt-tablet, var(--ccb-imgg-hmbt-desktop, 12px));
    }

    .ccb-icon-media-grid__subtitle {
        font-size: var(--ccb-imgg-sfs-tablet, var(--ccb-imgg-sfs-desktop, 18px));
        color: var(--ccb-imgg-sc-tablet, var(--ccb-imgg-sc-desktop, inherit));
        line-height: var(--ccb-imgg-slh-tablet, var(--ccb-imgg-slh-desktop, 1.5));
        letter-spacing: var(--ccb-imgg-sls-tablet, var(--ccb-imgg-sls-desktop, 0px));
    }

    .ccb-icon-media-grid__grid {
        gap: var(--ccb-imgg-gap-tablet, var(--ccb-imgg-gap-desktop, 24px));
    }

    .ccb-icon-media-grid__col {
        gap: var(--ccb-imgg-cgap-tablet, var(--ccb-imgg-cgap-desktop, 16px));
    }

    .ccb-icon-media-grid__top {
        column-gap: var(--ccb-imgg-igap-tablet, var(--ccb-imgg-igap-desktop, 12px));
    }

    .ccb-icon-media-grid__icon img {
        width: var(--ccb-imgg-isz-tablet, var(--ccb-imgg-isz-desktop, 24px));
        height: var(--ccb-imgg-isz-tablet, var(--ccb-imgg-isz-desktop, 24px));
    }

    .ccb-icon-media-grid__item-title {
        font-size: var(--ccb-imgg-itfs-tablet, var(--ccb-imgg-itfs-desktop, 16px));
        color: var(--ccb-imgg-itc-tablet, var(--ccb-imgg-itc-desktop, inherit));
        line-height: var(--ccb-imgg-itlh-tablet, var(--ccb-imgg-itlh-desktop, 1.2));
        letter-spacing: var(--ccb-imgg-itls-tablet, var(--ccb-imgg-itls-desktop, 0px));
    }

    .ccb-icon-media-grid__item-subtitle {
        font-size: var(--ccb-imgg-isfs-tablet, var(--ccb-imgg-isfs-desktop, 14px));
        color: var(--ccb-imgg-isc-tablet, var(--ccb-imgg-isc-desktop, inherit));
        line-height: var(--ccb-imgg-islh-tablet, var(--ccb-imgg-islh-desktop, 1.35));
        letter-spacing: var(--ccb-imgg-isls-tablet, var(--ccb-imgg-isls-desktop, 0px));
    }

    .ccb-icon-media-grid__media img {
        width: var(--ccb-imgg-mmw-tablet, var(--ccb-imgg-mmw-desktop, 100%));
        border-radius: var(--ccb-imgg-mr-tablet, var(--ccb-imgg-mr-desktop, 0px));
        transform: translateX(var(--ccb-imgg-mox-tablet, var(--ccb-imgg-mox-desktop, 0px)));
    }
}

@media (max-width: 640px) {
    .ccb-icon-media-grid__inner {
        max-width: var(--ccb-imgg-maxw-mobile, var(--ccb-imgg-maxw-tablet, var(--ccb-imgg-maxw-desktop, 1280px)));
    }

    .ccb-icon-media-grid {
        padding-top: var(--ccb-imgg-pt-mobile, var(--ccb-imgg-pt-tablet, var(--ccb-imgg-pt-desktop, 60px)));
        padding-bottom: var(--ccb-imgg-pb-mobile, var(--ccb-imgg-pb-tablet, var(--ccb-imgg-pb-desktop, 60px)));
        background-color: var(--ccb-imgg-bg-mobile, var(--ccb-imgg-bg-tablet, var(--ccb-imgg-bg-desktop, transparent)));
    }

    .ccb-icon-media-grid__header {
        margin-bottom: var(--ccb-imgg-hmb-mobile, var(--ccb-imgg-hmb-tablet, var(--ccb-imgg-hmb-desktop, 40px)));
        text-align: var(--ccb-imgg-ta-mobile, var(--ccb-imgg-ta-tablet, var(--ccb-imgg-ta-desktop, left)));
    }

    .ccb-icon-media-grid__heading {
        font-size: var(--ccb-imgg-hfs-mobile, var(--ccb-imgg-hfs-tablet, var(--ccb-imgg-hfs-desktop, 36px)));
        color: var(--ccb-imgg-hc-mobile, var(--ccb-imgg-hc-tablet, var(--ccb-imgg-hc-desktop, inherit)));
        line-height: var(--ccb-imgg-hlh-mobile, var(--ccb-imgg-hlh-tablet, var(--ccb-imgg-hlh-desktop, 1.15)));
        letter-spacing: var(--ccb-imgg-hls-mobile, var(--ccb-imgg-hls-tablet, var(--ccb-imgg-hls-desktop, 0px)));
        margin-bottom: var(--ccb-imgg-hmbt-mobile, var(--ccb-imgg-hmbt-tablet, var(--ccb-imgg-hmbt-desktop, 12px)));
    }

    .ccb-icon-media-grid__subtitle {
        font-size: var(--ccb-imgg-sfs-mobile, var(--ccb-imgg-sfs-tablet, var(--ccb-imgg-sfs-desktop, 18px)));
        color: var(--ccb-imgg-sc-mobile, var(--ccb-imgg-sc-tablet, var(--ccb-imgg-sc-desktop, inherit)));
        line-height: var(--ccb-imgg-slh-mobile, var(--ccb-imgg-slh-tablet, var(--ccb-imgg-slh-desktop, 1.5)));
        letter-spacing: var(--ccb-imgg-sls-mobile, var(--ccb-imgg-sls-tablet, var(--ccb-imgg-sls-desktop, 0px)));
    }

    .ccb-icon-media-grid__grid {
        gap: var(--ccb-imgg-gap-mobile, var(--ccb-imgg-gap-tablet, var(--ccb-imgg-gap-desktop, 24px)));
    }

    .ccb-icon-media-grid__col {
        gap: var(--ccb-imgg-cgap-mobile, var(--ccb-imgg-cgap-tablet, var(--ccb-imgg-cgap-desktop, 16px)));
    }

    .ccb-icon-media-grid__top {
        column-gap: var(--ccb-imgg-igap-mobile, var(--ccb-imgg-igap-tablet, var(--ccb-imgg-igap-desktop, 12px)));
    }

    .ccb-icon-media-grid__icon img {
        width: var(--ccb-imgg-isz-mobile, var(--ccb-imgg-isz-tablet, var(--ccb-imgg-isz-desktop, 24px)));
        height: var(--ccb-imgg-isz-mobile, var(--ccb-imgg-isz-tablet, var(--ccb-imgg-isz-desktop, 24px)));
    }

    .ccb-icon-media-grid__item-title {
        font-size: var(--ccb-imgg-itfs-mobile, var(--ccb-imgg-itfs-tablet, var(--ccb-imgg-itfs-desktop, 16px)));
        color: var(--ccb-imgg-itc-mobile, var(--ccb-imgg-itc-tablet, var(--ccb-imgg-itc-desktop, inherit)));
        line-height: var(--ccb-imgg-itlh-mobile, var(--ccb-imgg-itlh-tablet, var(--ccb-imgg-itlh-desktop, 1.2)));
        letter-spacing: var(--ccb-imgg-itls-mobile, var(--ccb-imgg-itls-tablet, var(--ccb-imgg-itls-desktop, 0px)));
    }

    .ccb-icon-media-grid__item-subtitle {
        font-size: var(--ccb-imgg-isfs-mobile, var(--ccb-imgg-isfs-tablet, var(--ccb-imgg-isfs-desktop, 14px)));
        color: var(--ccb-imgg-isc-mobile, var(--ccb-imgg-isc-tablet, var(--ccb-imgg-isc-desktop, inherit)));
        line-height: var(--ccb-imgg-islh-mobile, var(--ccb-imgg-islh-tablet, var(--ccb-imgg-islh-desktop, 1.35)));
        letter-spacing: var(--ccb-imgg-isls-mobile, var(--ccb-imgg-isls-tablet, var(--ccb-imgg-isls-desktop, 0px)));
    }

    .ccb-icon-media-grid__media img {
        width: var(--ccb-imgg-mmw-mobile, 100%);
        max-width: 100%;
        border-radius: var(--ccb-imgg-mr-mobile, var(--ccb-imgg-mr-tablet, var(--ccb-imgg-mr-desktop, 0px)));
        transform: translateX(var(--ccb-imgg-mox-mobile, 0px));
    }
}


/* Dashboard Showcase (ccb/dashboard-showcase) */

.ccb-dashboard-showcase {
    padding-top: var(--ccb-ds-pt-desktop, 60px);
    padding-bottom: var(--ccb-ds-pb-desktop, 60px);
    margin-top: var(--ccb-ds-mt-desktop, 0px);
    margin-bottom: var(--ccb-ds-mb-desktop, 0px);
    width: 100%;
}

.ccb-dashboard-showcase__inner {
    max-width: var(--ccb-ds-inner-maxw-desktop, 1280px);
    margin: 0 auto;
    padding-left: var(--ccb-ds-inner-px-desktop, 24px);
    padding-right: var(--ccb-ds-inner-px-desktop, 24px);
}

.ccb-dashboard-showcase__heading {
    text-align: var(--ccb-ds-heading-align, center);
    font-size: var(--ccb-ds-heading-fs-desktop, 36px);
    line-height: var(--ccb-ds-heading-lh-desktop, 1.15);
    letter-spacing: var(--ccb-ds-heading-ls-desktop, 0px);
    font-weight: var(--ccb-ds-heading-fw, 700);
    font-style: var(--ccb-ds-heading-style, normal);
    color: var(--ccb-ds-heading-color-desktop, inherit);
    margin: var(--ccb-ds-heading-mt-desktop, 0) 0 var(--ccb-ds-heading-mb-desktop, 32px) 0;
    padding-top: var(--ccb-ds-heading-pt-desktop, 0);
    padding-bottom: var(--ccb-ds-heading-pb-desktop, 0);
}

.ccb-dashboard-showcase__subtitle {
    text-align: var(--ccb-ds-sub-align, center);
    font-size: var(--ccb-ds-sub-fs-desktop, 18px);
    line-height: var(--ccb-ds-sub-lh-desktop, 1.5);
    letter-spacing: var(--ccb-ds-sub-ls-desktop, 0px);
    font-weight: var(--ccb-ds-sub-fw, 400);
    font-style: var(--ccb-ds-sub-style, normal);
    color: var(--ccb-ds-sub-color-desktop, inherit);
    margin: var(--ccb-ds-sub-mt-desktop, 0) 0 var(--ccb-ds-sub-mb-desktop, 16px) 0;
    padding-top: var(--ccb-ds-sub-pt-desktop, 0);
    padding-bottom: var(--ccb-ds-sub-pb-desktop, 0);
}

.ccb-dashboard-showcase__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--ccb-ds-gap-desktop, 24px);
}

.ccb-dashboard-showcase__card {
    position: relative;
    border-radius: var(--cgb-radius-card);
    overflow: hidden;
    box-shadow: var(--cgb-shadow-card);
    background: var(--cgb-bg-card, #ffffff);
}

.ccb-dashboard-showcase__card img {
    display: block;
    width: 100%;
    height: auto;
}

.ccb-dashboard-showcase__placeholder {
    width: 100%;
    min-height: 120px;
    border: 1px dashed var(--cgb-border-subtle, #e2e4e7);
    background: transparent;
    color: var(--cgb-text-muted, #646970);
    font-size: 14px;
}

/* Lightbox (CSS-only via :target) */
.ccb-dashboard-showcase__lightbox-anchor {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.ccb-dashboard-showcase__lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    opacity: 0;
    pointer-events: none;
}

.ccb-dashboard-showcase__lightbox:target {
    opacity: 1;
    pointer-events: auto;
}

.ccb-dashboard-showcase__lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: color-mix(in srgb, var(--cgb-text) 85%, transparent);
}

.ccb-dashboard-showcase__lightbox-content {
    position: relative;
    max-width: min(92vw, 1400px);
    max-height: 90vh;
}

.ccb-dashboard-showcase__lightbox-content img {
    display: block;
    max-width: 100%;
    max-height: 90vh;
    width: auto;
    height: auto;
    border-radius: var(--cgb-radius-card);
    box-shadow: var(--cgb-shadow-card);
    background: var(--cgb-bg);
}

.ccb-dashboard-showcase__lightbox-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    text-decoration: none;
    font-size: 26px;
    line-height: 1;
    background: color-mix(in srgb, var(--cgb-text) 80%, transparent);
    color: var(--cgb-bg);
}

.ccb-dashboard-showcase__lightbox-close:focus {
    outline: 2px solid var(--cgb-bg);
    outline-offset: 2px;
}

/* Editor preview override (follows device toggle even without viewport breakpoints) */
.ccb-dashboard-showcase[data-preview-device="tablet"] .ccb-dashboard-showcase__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ccb-dashboard-showcase[data-preview-device="mobile"] .ccb-dashboard-showcase__grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (max-width: 1024px) {
    .ccb-dashboard-showcase__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ccb-dashboard-showcase {
        padding-top: var(--ccb-ds-pt-tablet, var(--ccb-ds-pt-desktop, 60px));
        padding-bottom: var(--ccb-ds-pb-tablet, var(--ccb-ds-pb-desktop, 60px));
        margin-top: var(--ccb-ds-mt-tablet, var(--ccb-ds-mt-desktop, 0px));
        margin-bottom: var(--ccb-ds-mb-tablet, var(--ccb-ds-mb-desktop, 0px));
    }

    .ccb-dashboard-showcase__inner {
        max-width: var(--ccb-ds-inner-maxw-tablet, var(--ccb-ds-inner-maxw-desktop, 1280px));
        padding-left: var(--ccb-ds-inner-px-tablet, var(--ccb-ds-inner-px-desktop, 24px));
        padding-right: var(--ccb-ds-inner-px-tablet, var(--ccb-ds-inner-px-desktop, 24px));
    }

    .ccb-dashboard-showcase__heading {
        font-size: var(--ccb-ds-heading-fs-tablet, var(--ccb-ds-heading-fs-desktop, 36px));
        line-height: var(--ccb-ds-heading-lh-tablet, var(--ccb-ds-heading-lh-desktop, 1.15));
        letter-spacing: var(--ccb-ds-heading-ls-tablet, var(--ccb-ds-heading-ls-desktop, 0px));
        color: var(--ccb-ds-heading-color-tablet, var(--ccb-ds-heading-color-desktop, inherit));
        margin-top: var(--ccb-ds-heading-mt-tablet, var(--ccb-ds-heading-mt-desktop, 0));
        margin-bottom: var(--ccb-ds-heading-mb-tablet, var(--ccb-ds-heading-mb-desktop, 32px));
        padding-top: var(--ccb-ds-heading-pt-tablet, var(--ccb-ds-heading-pt-desktop, 0));
        padding-bottom: var(--ccb-ds-heading-pb-tablet, var(--ccb-ds-heading-pb-desktop, 0));
    }

    .ccb-dashboard-showcase__subtitle {
        font-size: var(--ccb-ds-sub-fs-tablet, var(--ccb-ds-sub-fs-desktop, 18px));
        line-height: var(--ccb-ds-sub-lh-tablet, var(--ccb-ds-sub-lh-desktop, 1.5));
        letter-spacing: var(--ccb-ds-sub-ls-tablet, var(--ccb-ds-sub-ls-desktop, 0px));
        color: var(--ccb-ds-sub-color-tablet, var(--ccb-ds-sub-color-desktop, inherit));
        margin-top: var(--ccb-ds-sub-mt-tablet, var(--ccb-ds-sub-mt-desktop, 0));
        margin-bottom: var(--ccb-ds-sub-mb-tablet, var(--ccb-ds-sub-mb-desktop, 16px));
        padding-top: var(--ccb-ds-sub-pt-tablet, var(--ccb-ds-sub-pt-desktop, 0));
        padding-bottom: var(--ccb-ds-sub-pb-tablet, var(--ccb-ds-sub-pb-desktop, 0));
    }

    .ccb-dashboard-showcase__grid {
        gap: var(--ccb-ds-gap-tablet, var(--ccb-ds-gap-desktop, 24px));
    }
}

@media (max-width: 640px) {
    .ccb-dashboard-showcase__grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .ccb-dashboard-showcase {
        padding-top: var(--ccb-ds-pt-mobile, var(--ccb-ds-pt-tablet, var(--ccb-ds-pt-desktop, 60px)));
        padding-bottom: var(--ccb-ds-pb-mobile, var(--ccb-ds-pb-tablet, var(--ccb-ds-pb-desktop, 60px)));
        margin-top: var(--ccb-ds-mt-mobile, var(--ccb-ds-mt-tablet, var(--ccb-ds-mt-desktop, 0px)));
        margin-bottom: var(--ccb-ds-mb-mobile, var(--ccb-ds-mb-tablet, var(--ccb-ds-mb-desktop, 0px)));
    }

    .ccb-dashboard-showcase__inner {
        max-width: var(--ccb-ds-inner-maxw-mobile, var(--ccb-ds-inner-maxw-tablet, var(--ccb-ds-inner-maxw-desktop, 1280px)));
        padding-left: var(--ccb-ds-inner-px-mobile, var(--ccb-ds-inner-px-tablet, var(--ccb-ds-inner-px-desktop, 24px)));
        padding-right: var(--ccb-ds-inner-px-mobile, var(--ccb-ds-inner-px-tablet, var(--ccb-ds-inner-px-desktop, 24px)));
    }

    .ccb-dashboard-showcase__heading {
        font-size: var(--ccb-ds-heading-fs-mobile, var(--ccb-ds-heading-fs-tablet, var(--ccb-ds-heading-fs-desktop, 36px)));
        line-height: var(--ccb-ds-heading-lh-mobile, var(--ccb-ds-heading-lh-tablet, var(--ccb-ds-heading-lh-desktop, 1.15)));
        letter-spacing: var(--ccb-ds-heading-ls-mobile, var(--ccb-ds-heading-ls-tablet, var(--ccb-ds-heading-ls-desktop, 0px)));
        color: var(--ccb-ds-heading-color-mobile, var(--ccb-ds-heading-color-tablet, var(--ccb-ds-heading-color-desktop, inherit)));
        margin-top: var(--ccb-ds-heading-mt-mobile, var(--ccb-ds-heading-mt-tablet, var(--ccb-ds-heading-mt-desktop, 0)));
        margin-bottom: var(--ccb-ds-heading-mb-mobile, var(--ccb-ds-heading-mb-tablet, var(--ccb-ds-heading-mb-desktop, 32px)));
        padding-top: var(--ccb-ds-heading-pt-mobile, var(--ccb-ds-heading-pt-tablet, var(--ccb-ds-heading-pt-desktop, 0)));
        padding-bottom: var(--ccb-ds-heading-pb-mobile, var(--ccb-ds-heading-pb-tablet, var(--ccb-ds-heading-pb-desktop, 0)));
    }

    .ccb-dashboard-showcase__subtitle {
        font-size: var(--ccb-ds-sub-fs-mobile, var(--ccb-ds-sub-fs-tablet, var(--ccb-ds-sub-fs-desktop, 18px)));
        line-height: var(--ccb-ds-sub-lh-mobile, var(--ccb-ds-sub-lh-tablet, var(--ccb-ds-sub-lh-desktop, 1.5)));
        letter-spacing: var(--ccb-ds-sub-ls-mobile, var(--ccb-ds-sub-ls-tablet, var(--ccb-ds-sub-ls-desktop, 0px)));
        color: var(--ccb-ds-sub-color-mobile, var(--ccb-ds-sub-color-tablet, var(--ccb-ds-sub-color-desktop, inherit)));
        margin-top: var(--ccb-ds-sub-mt-mobile, var(--ccb-ds-sub-mt-tablet, var(--ccb-ds-sub-mt-desktop, 0)));
        margin-bottom: var(--ccb-ds-sub-mb-mobile, var(--ccb-ds-sub-mb-tablet, var(--ccb-ds-sub-mb-desktop, 16px)));
        padding-top: var(--ccb-ds-sub-pt-mobile, var(--ccb-ds-sub-pt-tablet, var(--ccb-ds-sub-pt-desktop, 0)));
        padding-bottom: var(--ccb-ds-sub-pb-mobile, var(--ccb-ds-sub-pb-tablet, var(--ccb-ds-sub-pb-desktop, 0)));
    }

    .ccb-dashboard-showcase__grid {
        gap: var(--ccb-ds-gap-mobile, var(--ccb-ds-gap-tablet, var(--ccb-ds-gap-desktop, 24px)));
    }
}

/* Trades List (ccb/trades-list) */
.ccb-trades-list {
    --ccb-tl-cols: var(--ccb-tl-cols-desktop, 3);
    --ccb-tl-maxw: var(--ccb-tl-maxw-desktop, 1200px);
    --ccb-tl-col-gap: var(--ccb-tl-col-gap-desktop, 80px);
    --ccb-tl-col-row-gap: var(--ccb-tl-col-row-gap-desktop, 32px);
    --ccb-tl-item-gap: var(--ccb-tl-item-gap-desktop, 18px);
    --ccb-tl-item-row-gap: var(--ccb-tl-item-row-gap-desktop, 26px);
    --ccb-tl-icon-size: 24px;
    --ccb-tl-icon-color: currentColor;
    --ccb-tl-text-color: currentColor;
    --ccb-tl-title-color: currentColor;
    --ccb-tl-title-align: center;
}

.ccb-trades-list {
    max-width: var(--ccb-tl-maxw);
    margin-left: auto;
    margin-right: auto;
}

.ccb-trades-list__title {
    text-align: var(--ccb-tl-title-align);
    color: var(--ccb-tl-title-color);
    margin-bottom: 40px;
}

.ccb-trades-list__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-tl-cols), minmax(0, 1fr));
    gap: var(--ccb-tl-col-row-gap) var(--ccb-tl-col-gap);
}

.ccb-trades-list__col {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--ccb-tl-item-row-gap);
}

.ccb-trades-list__item {
    display: grid;
    grid-template-columns: var(--ccb-tl-icon-size) 1fr;
    column-gap: var(--ccb-tl-item-gap);
    align-items: center;
}

.ccb-trades-list__icon {
    width: var(--ccb-tl-icon-size);
    height: var(--ccb-tl-icon-size);
    color: var(--ccb-tl-icon-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ccb-trades-list__icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.ccb-trades-list__label {
    color: var(--ccb-tl-text-color);
}

@media (max-width: 991px) {
    .ccb-trades-list {
        --ccb-tl-cols: var(--ccb-tl-cols-tablet, var(--ccb-tl-cols-desktop, 3));
        --ccb-tl-maxw: var(--ccb-tl-maxw-tablet, var(--ccb-tl-maxw-desktop, 1200px));
        --ccb-tl-col-gap: var(--ccb-tl-col-gap-tablet, var(--ccb-tl-col-gap-desktop, 80px));
        --ccb-tl-col-row-gap: var(--ccb-tl-col-row-gap-tablet, var(--ccb-tl-col-row-gap-desktop, 32px));
        --ccb-tl-item-gap: var(--ccb-tl-item-gap-tablet, var(--ccb-tl-item-gap-desktop, 18px));
        --ccb-tl-item-row-gap: var(--ccb-tl-item-row-gap-tablet, var(--ccb-tl-item-row-gap-desktop, 26px));
    }
}

@media (max-width: 767px) {
    .ccb-trades-list {
        --ccb-tl-cols: var(--ccb-tl-cols-mobile, var(--ccb-tl-cols-tablet, var(--ccb-tl-cols-desktop, 3)));
        --ccb-tl-maxw: var(--ccb-tl-maxw-mobile, var(--ccb-tl-maxw-tablet, var(--ccb-tl-maxw-desktop, 1200px)));
        --ccb-tl-col-gap: var(--ccb-tl-col-gap-mobile, var(--ccb-tl-col-gap-tablet, var(--ccb-tl-col-gap-desktop, 80px)));
        --ccb-tl-col-row-gap: var(--ccb-tl-col-row-gap-mobile, var(--ccb-tl-col-row-gap-tablet, var(--ccb-tl-col-row-gap-desktop, 32px)));
        --ccb-tl-item-gap: var(--ccb-tl-item-gap-mobile, var(--ccb-tl-item-gap-tablet, var(--ccb-tl-item-gap-desktop, 18px)));
        --ccb-tl-item-row-gap: var(--ccb-tl-item-row-gap-mobile, var(--ccb-tl-item-row-gap-tablet, var(--ccb-tl-item-row-gap-desktop, 26px)));
    }

    .ccb-trades-list__title {
        margin-bottom: 28px;
    }
}

/* Field Controls Cards (ccb/field-controls-cards) */
.ccb-field-controls-cards {
    --ccb-fcc-cols: var(--ccb-fcc-cols-desktop, 4);
    --ccb-fcc-gap: var(--ccb-fcc-gap-desktop, 24px);
    --ccb-fcc-maxw: var(--ccb-fcc-maxw-desktop, 1200px);
    --ccb-fcc-bg: var(--ccb-fcc-bg-desktop, transparent);
    --ccb-fcc-pt: var(--ccb-fcc-pt-desktop, 0px);
    --ccb-fcc-pb: var(--ccb-fcc-pb-desktop, 0px);
    --ccb-fcc-px: var(--ccb-fcc-px-desktop, 0px);
    --ccb-fcc-mt: var(--ccb-fcc-mt-desktop, 0px);
    --ccb-fcc-mb: var(--ccb-fcc-mb-desktop, 0px);
    --ccb-fcc-heading-fs: var(--ccb-fcc-heading-fs-desktop, clamp(30px, 3vw, 44px));
    --ccb-fcc-heading-lh: var(--ccb-fcc-heading-lh-desktop, 1.12);
    --ccb-fcc-ctitle-fs: var(--ccb-fcc-ctitle-fs-desktop, 19px);
    --ccb-fcc-ctitle-lh: var(--ccb-fcc-ctitle-lh-desktop, 1.2);
    --ccb-fcc-bullet-fs: var(--ccb-fcc-bullet-fs-desktop, 16px);
    --ccb-fcc-bullet-lh: var(--ccb-fcc-bullet-lh-desktop, 1.45);
}

.ccb-field-controls-cards {
    width: 100%;
    background: var(--ccb-fcc-bg);
    padding-top: var(--ccb-fcc-pt);
    padding-bottom: var(--ccb-fcc-pb);
    padding-left: var(--ccb-fcc-px);
    padding-right: var(--ccb-fcc-px);
    margin-top: var(--ccb-fcc-mt);
    margin-bottom: var(--ccb-fcc-mb);
}

.ccb-fcc__inner {
    max-width: var(--ccb-fcc-maxw);
    margin-left: auto;
    margin-right: auto;
}

.ccb-fcc__heading {
    text-align: center;
    margin: 0 0 44px 0;
    font-size: var(--ccb-fcc-heading-fs);
    line-height: var(--ccb-fcc-heading-lh);
    color: var(--ccb-fcc-heading-color, var(--cgb-primary, inherit));
}

.ccb-fcc__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-fcc-cols), minmax(0, 1fr));
    gap: var(--ccb-fcc-gap);
}

.ccb-fcc__card {
    display: flex;
    flex-direction: column;
    border-radius: var(--cgb-radius-card);
    overflow: hidden;
    box-shadow: var(--cgb-shadow-card);
    background: var(--cgb-bg-card, #ffffff);
    border: 1px solid var(--cgb-border-subtle, #e2e4e7);
    min-height: 560px;
}

.ccb-fcc__card-head {
    background: var(--ccb-fcc-header-bg, #4f7eb8);
    color: #ffffff;
    padding: 22px 20px;
    text-align: center;
    order: 2;
}

.ccb-fcc__card-title {
    margin: 0;
    font-size: var(--ccb-fcc-ctitle-fs);
    line-height: var(--ccb-fcc-ctitle-lh);
    font-weight: 600;
    color: var(--ccb-fcc-ctitle-color, inherit);
}

.ccb-fcc__card-subtitle {
    margin-top: 6px;
    font-size: 16px;
    line-height: 1.2;
    font-style: italic;
    opacity: 0.95;
    color: var(--ccb-fcc-csub-color, inherit);
}

.ccb-fcc__card-body {
    padding: 22px 22px 10px 22px;
    flex: 1;
    order: 3;
}

.ccb-fcc__list {
    margin: 0;
    padding-left: 22px;
    color: var(--ccb-fcc-bullet-color, var(--cgb-text-muted, #646970));
    font-size: var(--ccb-fcc-bullet-fs);
    line-height: var(--ccb-fcc-bullet-lh);
}

.ccb-fcc__list li {
    margin: 0 0 14px 0;
}

.ccb-fcc__list li:last-child {
    margin-bottom: 0;
}

.ccb-fcc__list li::marker {
    font-size: 1.1em;
}

.ccb-fcc__card-media {
    padding: 16px 22px 22px 22px;
    display: grid;
    place-items: center;
    order: 4;
}

/* Image position: top (between header and bullets) */
.ccb-fcc--img-top .ccb-fcc__card-head  { order: 1; }
.ccb-fcc--img-top .ccb-fcc__card-media { order: 2; }
.ccb-fcc--img-top .ccb-fcc__card-body  { order: 3; }

/* Image position: middle (above header — image first) */
.ccb-fcc--img-middle .ccb-fcc__card-media { order: 1; }
.ccb-fcc--img-middle .ccb-fcc__card-head  { order: 2; }
.ccb-fcc--img-middle .ccb-fcc__card-body  { order: 3; }

.ccb-fcc__card-media img {
    display: block;
    width: min(260px, 86%);
    max-width: 100%;
    height: auto;
}

.ccb-fcc__placeholder {
    width: 100%;
    min-height: 120px;
    border: 1px dashed var(--cgb-border-subtle, #e2e4e7);
    color: var(--cgb-text-muted, #646970);
    display: grid;
    place-items: center;
    font-size: 13px;
}

.ccb-fcc__media-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 10px;
}

/* Editor preview override (follows device toggle even without viewport breakpoints) */
.ccb-field-controls-cards[data-preview-device="tablet"] {
    --ccb-fcc-cols: var(--ccb-fcc-cols-tablet, var(--ccb-fcc-cols-desktop, 4));
    --ccb-fcc-gap: var(--ccb-fcc-gap-tablet, var(--ccb-fcc-gap-desktop, 24px));
    --ccb-fcc-maxw: var(--ccb-fcc-maxw-tablet, var(--ccb-fcc-maxw-desktop, 1200px));

    --ccb-fcc-pt: var(--ccb-fcc-pt-tablet, var(--ccb-fcc-pt-desktop, 0px));
    --ccb-fcc-pb: var(--ccb-fcc-pb-tablet, var(--ccb-fcc-pb-desktop, 0px));
    --ccb-fcc-px: var(--ccb-fcc-px-tablet, var(--ccb-fcc-px-desktop, 0px));
    --ccb-fcc-mt: var(--ccb-fcc-mt-tablet, var(--ccb-fcc-mt-desktop, 0px));
    --ccb-fcc-mb: var(--ccb-fcc-mb-tablet, var(--ccb-fcc-mb-desktop, 0px));

    --ccb-fcc-heading-fs: var(--ccb-fcc-heading-fs-tablet, var(--ccb-fcc-heading-fs-desktop, clamp(30px, 3vw, 44px)));
    --ccb-fcc-heading-lh: var(--ccb-fcc-heading-lh-tablet, var(--ccb-fcc-heading-lh-desktop, 1.12));

    --ccb-fcc-ctitle-fs: var(--ccb-fcc-ctitle-fs-tablet, var(--ccb-fcc-ctitle-fs-desktop, 19px));
    --ccb-fcc-ctitle-lh: var(--ccb-fcc-ctitle-lh-tablet, var(--ccb-fcc-ctitle-lh-desktop, 1.2));

    --ccb-fcc-bullet-fs: var(--ccb-fcc-bullet-fs-tablet, var(--ccb-fcc-bullet-fs-desktop, 16px));
    --ccb-fcc-bullet-lh: var(--ccb-fcc-bullet-lh-tablet, var(--ccb-fcc-bullet-lh-desktop, 1.45));
}

.ccb-field-controls-cards[data-preview-device="mobile"] {
    --ccb-fcc-cols: var(--ccb-fcc-cols-mobile, var(--ccb-fcc-cols-tablet, var(--ccb-fcc-cols-desktop, 4)));
    --ccb-fcc-gap: var(--ccb-fcc-gap-mobile, var(--ccb-fcc-gap-tablet, var(--ccb-fcc-gap-desktop, 24px)));
    --ccb-fcc-maxw: var(--ccb-fcc-maxw-mobile, var(--ccb-fcc-maxw-tablet, var(--ccb-fcc-maxw-desktop, 1200px)));

    --ccb-fcc-pt: var(--ccb-fcc-pt-mobile, var(--ccb-fcc-pt-tablet, var(--ccb-fcc-pt-desktop, 0px)));
    --ccb-fcc-pb: var(--ccb-fcc-pb-mobile, var(--ccb-fcc-pb-tablet, var(--ccb-fcc-pb-desktop, 0px)));
    --ccb-fcc-px: var(--ccb-fcc-px-mobile, var(--ccb-fcc-px-tablet, var(--ccb-fcc-px-desktop, 0px)));
    --ccb-fcc-mt: var(--ccb-fcc-mt-mobile, var(--ccb-fcc-mt-tablet, var(--ccb-fcc-mt-desktop, 0px)));
    --ccb-fcc-mb: var(--ccb-fcc-mb-mobile, var(--ccb-fcc-mb-tablet, var(--ccb-fcc-mb-desktop, 0px)));

    --ccb-fcc-heading-fs: var(--ccb-fcc-heading-fs-mobile, var(--ccb-fcc-heading-fs-tablet, var(--ccb-fcc-heading-fs-desktop, clamp(30px, 3vw, 44px))));
    --ccb-fcc-heading-lh: var(--ccb-fcc-heading-lh-mobile, var(--ccb-fcc-heading-lh-tablet, var(--ccb-fcc-heading-lh-desktop, 1.12)));

    --ccb-fcc-ctitle-fs: var(--ccb-fcc-ctitle-fs-mobile, var(--ccb-fcc-ctitle-fs-tablet, var(--ccb-fcc-ctitle-fs-desktop, 19px)));
    --ccb-fcc-ctitle-lh: var(--ccb-fcc-ctitle-lh-mobile, var(--ccb-fcc-ctitle-lh-tablet, var(--ccb-fcc-ctitle-lh-desktop, 1.2)));

    --ccb-fcc-bullet-fs: var(--ccb-fcc-bullet-fs-mobile, var(--ccb-fcc-bullet-fs-tablet, var(--ccb-fcc-bullet-fs-desktop, 16px)));
    --ccb-fcc-bullet-lh: var(--ccb-fcc-bullet-lh-mobile, var(--ccb-fcc-bullet-lh-tablet, var(--ccb-fcc-bullet-lh-desktop, 1.45)));
}

@media (max-width: 991px) {
    .ccb-field-controls-cards {
        --ccb-fcc-cols: var(--ccb-fcc-cols-tablet, var(--ccb-fcc-cols-desktop, 4));
        --ccb-fcc-gap: var(--ccb-fcc-gap-tablet, var(--ccb-fcc-gap-desktop, 24px));
        --ccb-fcc-maxw: var(--ccb-fcc-maxw-tablet, var(--ccb-fcc-maxw-desktop, 1200px));

        --ccb-fcc-pt: var(--ccb-fcc-pt-tablet, var(--ccb-fcc-pt-desktop, 0px));
        --ccb-fcc-pb: var(--ccb-fcc-pb-tablet, var(--ccb-fcc-pb-desktop, 0px));
        --ccb-fcc-px: var(--ccb-fcc-px-tablet, var(--ccb-fcc-px-desktop, 0px));
        --ccb-fcc-mt: var(--ccb-fcc-mt-tablet, var(--ccb-fcc-mt-desktop, 0px));
        --ccb-fcc-mb: var(--ccb-fcc-mb-tablet, var(--ccb-fcc-mb-desktop, 0px));

        --ccb-fcc-heading-fs: var(--ccb-fcc-heading-fs-tablet, var(--ccb-fcc-heading-fs-desktop, clamp(30px, 3vw, 44px)));
        --ccb-fcc-heading-lh: var(--ccb-fcc-heading-lh-tablet, var(--ccb-fcc-heading-lh-desktop, 1.12));

        --ccb-fcc-ctitle-fs: var(--ccb-fcc-ctitle-fs-tablet, var(--ccb-fcc-ctitle-fs-desktop, 19px));
        --ccb-fcc-ctitle-lh: var(--ccb-fcc-ctitle-lh-tablet, var(--ccb-fcc-ctitle-lh-desktop, 1.2));

        --ccb-fcc-bullet-fs: var(--ccb-fcc-bullet-fs-tablet, var(--ccb-fcc-bullet-fs-desktop, 16px));
        --ccb-fcc-bullet-lh: var(--ccb-fcc-bullet-lh-tablet, var(--ccb-fcc-bullet-lh-desktop, 1.45));
    }

    .ccb-fcc__card {
        min-height: 520px;
    }
}

@media (max-width: 767px) {
    .ccb-field-controls-cards {
        --ccb-fcc-cols: var(--ccb-fcc-cols-mobile, var(--ccb-fcc-cols-tablet, var(--ccb-fcc-cols-desktop, 4)));
        --ccb-fcc-gap: var(--ccb-fcc-gap-mobile, var(--ccb-fcc-gap-tablet, var(--ccb-fcc-gap-desktop, 24px)));
        --ccb-fcc-maxw: var(--ccb-fcc-maxw-mobile, var(--ccb-fcc-maxw-tablet, var(--ccb-fcc-maxw-desktop, 1200px)));

        --ccb-fcc-pt: var(--ccb-fcc-pt-mobile, var(--ccb-fcc-pt-tablet, var(--ccb-fcc-pt-desktop, 0px)));
        --ccb-fcc-pb: var(--ccb-fcc-pb-mobile, var(--ccb-fcc-pb-tablet, var(--ccb-fcc-pb-desktop, 0px)));
        --ccb-fcc-px: var(--ccb-fcc-px-mobile, var(--ccb-fcc-px-tablet, var(--ccb-fcc-px-desktop, 0px)));
        --ccb-fcc-mt: var(--ccb-fcc-mt-mobile, var(--ccb-fcc-mt-tablet, var(--ccb-fcc-mt-desktop, 0px)));
        --ccb-fcc-mb: var(--ccb-fcc-mb-mobile, var(--ccb-fcc-mb-tablet, var(--ccb-fcc-mb-desktop, 0px)));

        --ccb-fcc-heading-fs: var(--ccb-fcc-heading-fs-mobile, var(--ccb-fcc-heading-fs-tablet, var(--ccb-fcc-heading-fs-desktop, clamp(30px, 3vw, 44px))));
        --ccb-fcc-heading-lh: var(--ccb-fcc-heading-lh-mobile, var(--ccb-fcc-heading-lh-tablet, var(--ccb-fcc-heading-lh-desktop, 1.12)));

        --ccb-fcc-ctitle-fs: var(--ccb-fcc-ctitle-fs-mobile, var(--ccb-fcc-ctitle-fs-tablet, var(--ccb-fcc-ctitle-fs-desktop, 19px)));
        --ccb-fcc-ctitle-lh: var(--ccb-fcc-ctitle-lh-mobile, var(--ccb-fcc-ctitle-lh-tablet, var(--ccb-fcc-ctitle-lh-desktop, 1.2)));

        --ccb-fcc-bullet-fs: var(--ccb-fcc-bullet-fs-mobile, var(--ccb-fcc-bullet-fs-tablet, var(--ccb-fcc-bullet-fs-desktop, 16px)));
        --ccb-fcc-bullet-lh: var(--ccb-fcc-bullet-lh-mobile, var(--ccb-fcc-bullet-lh-tablet, var(--ccb-fcc-bullet-lh-desktop, 1.45)));
    }

    .ccb-fcc__heading {
        margin-bottom: 30px;
    }

    .ccb-fcc__card {
        min-height: 0;
    }
}

.ccb-field-progress {
    --ccb-fp-pt: var(--ccb-fp-pt-desktop, 80px);
    --ccb-fp-pb: var(--ccb-fp-pb-desktop, 80px);
    --ccb-fp-gap: var(--ccb-fp-gap-desktop, 10px);
    --ccb-fp-col-gap: var(--ccb-fp-col-gap-desktop, 10px);
    --ccb-fp-row-gap: var(--ccb-fp-row-gap-desktop, 10px);
    --ccb-fp-title-mb: var(--ccb-fp-title-mb-desktop, 56px);
    --ccb-fp-item-gap: 10px;
    --ccb-fp-icon-size: 44px;
    --ccb-fp-icon-bg: var(--cgb-bg-app);
    --ccb-fp-divider: 2px;
    --ccb-fp-divider-color: var(--cgb-border-subtle);
    --ccb-fp-title-fs: var(--ccb-fp-title-fs-desktop, inherit);
    --ccb-fp-title-lh: var(--ccb-fp-title-lh-desktop, inherit);
    --ccb-fp-title-fw: var(--ccb-fp-title-fw-desktop, 700);
    --ccb-fp-title-ls: var(--ccb-fp-title-ls-desktop, 0);
    --ccb-fp-title-color: var(--ccb-fp-title-color-desktop, var(--cgb-primary));
    --ccb-fp-item-title-fs: var(--ccb-fp-item-title-fs-desktop, inherit);
    --ccb-fp-item-title-lh: var(--ccb-fp-item-title-lh-desktop, inherit);
    --ccb-fp-item-title-fw: var(--ccb-fp-item-title-fw-desktop, 700);
    --ccb-fp-item-title-ls: var(--ccb-fp-item-title-ls-desktop, 0);
    --ccb-fp-item-title-color: var(--ccb-fp-item-title-color-desktop, inherit);
    --ccb-fp-bullet-fs: var(--ccb-fp-bullet-fs-desktop, inherit);
    --ccb-fp-bullet-lh: var(--ccb-fp-bullet-lh-desktop, inherit);
    --ccb-fp-bullet-ls: var(--ccb-fp-bullet-ls-desktop, 0);
    --ccb-fp-bullet-color: var(--ccb-fp-bullet-color-desktop, var(--cgb-text-muted));
    --ccb-fp-phone-maxw: var(--ccb-fp-phone-maxw-desktop, 420px);
    --ccb-fp-media-colw: var(--ccb-fp-media-colw-desktop, 420px);
    --ccb-fp-media-justify: var(--ccb-fp-media-justify-desktop, flex-start);
    --ccb-fp-media-x: var(--ccb-fp-media-x-desktop, 0px);
    --ccb-fp-media-y: var(--ccb-fp-media-y-desktop, 0px);
}

.ccb-field-progress {
    width: 100%;
    background-color: var(--ccb-fp-bg, transparent);
    padding-top: var(--ccb-fp-pt);
    padding-bottom: var(--ccb-fp-pb);
}

/* Force full viewport width even if later rules override `.cgb--fullwidth`.
   (Pattern used across the codebase: see Feature Layout / Animated Carousel Grid.) */
.ccb-field-progress.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

/* Fallback: make core alignment work even if the theme doesn't handle it */
.wp-block-ccb-field-progress.alignfull,
.wp-block-ccb-field-progress.alignwide {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

/* Astra safety-net: some templates hard-limit blocks to ~900px/920px */
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-field-progress.alignwide,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-field-progress.alignfull,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-field-progress.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: hidden;
}

.ccb-field-progress .cgb-inner {
    max-width: var(--cgb-inner-max, 1200px);
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}

.ccb-fp__title {
    text-align: var(--ccb-fp-title-align, center);
    font-weight: var(--ccb-fp-title-fw);
    font-size: var(--ccb-fp-title-fs);
    line-height: var(--ccb-fp-title-lh);
    letter-spacing: calc(var(--ccb-fp-title-ls) * 1em);
    margin: 0 0 var(--ccb-fp-title-mb);
    color: var(--ccb-fp-title-color);
}

.ccb-fp__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--ccb-fp-media-colw, 420px));
    gap: var(--ccb-fp-gap);
    align-items: start;
}

.ccb-fp__content {
    min-width: 0;
}

.ccb-fp__group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--ccb-fp-col-gap);
    row-gap: var(--ccb-fp-row-gap);
}

.ccb-fp__divider {
    height: var(--ccb-fp-divider);
    background: var(--ccb-fp-divider-color);
    margin: var(--ccb-fp-divider-my, 44px) 0;
}

.ccb-fp__item {
    display: grid;
    grid-template-columns: var(--ccb-fp-icon-size) 1fr;
    column-gap: var(--ccb-fp-item-gap);
    align-items: start;
}

.ccb-fp__icon {
    width: var(--ccb-fp-icon-size);
    height: var(--ccb-fp-icon-size);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ccb-fp-icon-bg);
    overflow: hidden;
}

.ccb-fp__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.ccb-fp__item-title {
    margin: 0 0 8px;
    font-weight: var(--ccb-fp-item-title-fw);
    font-size: var(--ccb-fp-item-title-fs);
    line-height: var(--ccb-fp-item-title-lh);
    letter-spacing: calc(var(--ccb-fp-item-title-ls) * 1em);
    color: var(--ccb-fp-item-title-color);
}

.ccb-fp__bullets {
    margin: 0;
    padding-left: var(--ccb-fp-bullet-indent, 18px);
    font-size: var(--ccb-fp-bullet-fs);
    line-height: var(--ccb-fp-bullet-lh);
    letter-spacing: calc(var(--ccb-fp-bullet-ls) * 1em);
    color: var(--ccb-fp-bullet-color);
}

.ccb-fp__bullets li {
    margin: 0;
}

.ccb-fp__media {
    display: flex;
    justify-content: var(--ccb-fp-media-justify, flex-start);
    transform: translate(var(--ccb-fp-media-x, 0px), var(--ccb-fp-media-y, 0px));
}

.ccb-fp__phone {
    max-width: min(100%, var(--ccb-fp-phone-maxw, 420px));
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--ccb-fp-phone-radius, 0px);
}

.ccb-field-progress[data-phone-desktop="0"] .ccb-fp__media {
    display: none;
}

@media (max-width: 991px) {
    .ccb-field-progress {
        --ccb-fp-pt: var(--ccb-fp-pt-tablet, var(--ccb-fp-pt-desktop, 80px));
        --ccb-fp-pb: var(--ccb-fp-pb-tablet, var(--ccb-fp-pb-desktop, 80px));
        --ccb-fp-gap: var(--ccb-fp-gap-tablet, var(--ccb-fp-gap-desktop, 10px));
        --ccb-fp-col-gap: var(--ccb-fp-col-gap-tablet, var(--ccb-fp-col-gap-desktop, 10px));
        --ccb-fp-row-gap: var(--ccb-fp-row-gap-tablet, var(--ccb-fp-row-gap-desktop, 10px));
        --ccb-fp-title-mb: var(--ccb-fp-title-mb-tablet, var(--ccb-fp-title-mb-desktop, 56px));
        --ccb-fp-title-fs: var(--ccb-fp-title-fs-tablet, var(--ccb-fp-title-fs-desktop, inherit));
        --ccb-fp-title-lh: var(--ccb-fp-title-lh-tablet, var(--ccb-fp-title-lh-desktop, inherit));
        --ccb-fp-title-fw: var(--ccb-fp-title-fw-tablet, var(--ccb-fp-title-fw-desktop, 700));
        --ccb-fp-title-ls: var(--ccb-fp-title-ls-tablet, var(--ccb-fp-title-ls-desktop, 0));
        --ccb-fp-item-title-fs: var(--ccb-fp-item-title-fs-tablet, var(--ccb-fp-item-title-fs-desktop, inherit));
        --ccb-fp-item-title-lh: var(--ccb-fp-item-title-lh-tablet, var(--ccb-fp-item-title-lh-desktop, inherit));
        --ccb-fp-item-title-fw: var(--ccb-fp-item-title-fw-tablet, var(--ccb-fp-item-title-fw-desktop, 700));
        --ccb-fp-item-title-ls: var(--ccb-fp-item-title-ls-tablet, var(--ccb-fp-item-title-ls-desktop, 0));
        --ccb-fp-bullet-fs: var(--ccb-fp-bullet-fs-tablet, var(--ccb-fp-bullet-fs-desktop, inherit));
        --ccb-fp-bullet-lh: var(--ccb-fp-bullet-lh-tablet, var(--ccb-fp-bullet-lh-desktop, inherit));
        --ccb-fp-bullet-ls: var(--ccb-fp-bullet-ls-tablet, var(--ccb-fp-bullet-ls-desktop, 0));
        --ccb-fp-phone-maxw: var(--ccb-fp-phone-maxw-tablet, var(--ccb-fp-phone-maxw-desktop, 420px));
        --ccb-fp-media-colw: var(--ccb-fp-media-colw-tablet, var(--ccb-fp-media-colw-desktop, 420px));
        --ccb-fp-media-justify: var(--ccb-fp-media-justify-tablet, var(--ccb-fp-media-justify-desktop, flex-start));
        --ccb-fp-media-x: var(--ccb-fp-media-x-tablet, var(--ccb-fp-media-x-desktop, 0px));
        --ccb-fp-media-y: var(--ccb-fp-media-y-tablet, var(--ccb-fp-media-y-desktop, 0px));
    }

    .ccb-field-progress .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px));
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
    }

    .ccb-field-progress[data-phone-tablet="0"] .ccb-fp__media {
        display: none;
    }

    .ccb-fp__layout {
        grid-template-columns: 1fr;
    }

    .ccb-fp__media {
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .ccb-field-progress {
        --ccb-fp-pt: var(--ccb-fp-pt-mobile, var(--ccb-fp-pt-tablet, var(--ccb-fp-pt-desktop, 80px)));
        --ccb-fp-pb: var(--ccb-fp-pb-mobile, var(--ccb-fp-pb-tablet, var(--ccb-fp-pb-desktop, 80px)));
        --ccb-fp-gap: var(--ccb-fp-gap-mobile, var(--ccb-fp-gap-tablet, var(--ccb-fp-gap-desktop, 10px)));
        --ccb-fp-col-gap: var(--ccb-fp-col-gap-mobile, var(--ccb-fp-col-gap-tablet, var(--ccb-fp-col-gap-desktop, 10px)));
        --ccb-fp-row-gap: var(--ccb-fp-row-gap-mobile, var(--ccb-fp-row-gap-tablet, var(--ccb-fp-row-gap-desktop, 10px)));
        --ccb-fp-title-mb: var(--ccb-fp-title-mb-mobile, var(--ccb-fp-title-mb-tablet, var(--ccb-fp-title-mb-desktop, 56px)));
        --ccb-fp-title-fs: var(--ccb-fp-title-fs-mobile, var(--ccb-fp-title-fs-tablet, var(--ccb-fp-title-fs-desktop, inherit)));
        --ccb-fp-title-lh: var(--ccb-fp-title-lh-mobile, var(--ccb-fp-title-lh-tablet, var(--ccb-fp-title-lh-desktop, inherit)));
        --ccb-fp-title-fw: var(--ccb-fp-title-fw-mobile, var(--ccb-fp-title-fw-tablet, var(--ccb-fp-title-fw-desktop, 700)));
        --ccb-fp-title-ls: var(--ccb-fp-title-ls-mobile, var(--ccb-fp-title-ls-tablet, var(--ccb-fp-title-ls-desktop, 0)));
        --ccb-fp-item-title-fs: var(--ccb-fp-item-title-fs-mobile, var(--ccb-fp-item-title-fs-tablet, var(--ccb-fp-item-title-fs-desktop, inherit)));
        --ccb-fp-item-title-lh: var(--ccb-fp-item-title-lh-mobile, var(--ccb-fp-item-title-lh-tablet, var(--ccb-fp-item-title-lh-desktop, inherit)));
        --ccb-fp-item-title-fw: var(--ccb-fp-item-title-fw-mobile, var(--ccb-fp-item-title-fw-tablet, var(--ccb-fp-item-title-fw-desktop, 700)));
        --ccb-fp-item-title-ls: var(--ccb-fp-item-title-ls-mobile, var(--ccb-fp-item-title-ls-tablet, var(--ccb-fp-item-title-ls-desktop, 0)));
        --ccb-fp-bullet-fs: var(--ccb-fp-bullet-fs-mobile, var(--ccb-fp-bullet-fs-tablet, var(--ccb-fp-bullet-fs-desktop, inherit)));
        --ccb-fp-bullet-lh: var(--ccb-fp-bullet-lh-mobile, var(--ccb-fp-bullet-lh-tablet, var(--ccb-fp-bullet-lh-desktop, inherit)));
        --ccb-fp-bullet-ls: var(--ccb-fp-bullet-ls-mobile, var(--ccb-fp-bullet-ls-tablet, var(--ccb-fp-bullet-ls-desktop, 0)));
        --ccb-fp-phone-maxw: var(--ccb-fp-phone-maxw-mobile, var(--ccb-fp-phone-maxw-tablet, var(--ccb-fp-phone-maxw-desktop, 420px)));
        --ccb-fp-media-colw: var(--ccb-fp-media-colw-mobile, var(--ccb-fp-media-colw-tablet, var(--ccb-fp-media-colw-desktop, 420px)));
        --ccb-fp-media-justify: var(--ccb-fp-media-justify-mobile, var(--ccb-fp-media-justify-tablet, var(--ccb-fp-media-justify-desktop, flex-start)));
        --ccb-fp-media-x: var(--ccb-fp-media-x-mobile, var(--ccb-fp-media-x-tablet, var(--ccb-fp-media-x-desktop, 0px)));
        --ccb-fp-media-y: var(--ccb-fp-media-y-mobile, var(--ccb-fp-media-y-tablet, var(--ccb-fp-media-y-desktop, 0px)));
    }

    .ccb-field-progress .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px)));
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
    }

    .ccb-field-progress[data-phone-mobile="0"] .ccb-fp__media {
        display: none;
    }

    /* Stack group columns on mobile */
    .ccb-fp__group {
        grid-template-columns: 1fr;
    }
}
/* Feature Comparison */

.ccb-feature-comparison {
    --ccb-fc-bg: var(--ccb-fc-bg-desktop, #1F5EA8);
    --ccb-fc-pt: var(--ccb-fc-pt-desktop, 72px);
    --ccb-fc-pb: var(--ccb-fc-pb-desktop, 72px);

    --ccb-fc-title-color: var(--ccb-fc-title-color-desktop, #ffffff);
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-desktop, 40px);

    --ccb-fc-max-width: var(--ccb-fc-max-width, 1280px);

    --ccb-fc-text: var(--ccb-fc-text, #111827);
    --ccb-fc-table-bg: var(--ccb-fc-table-bg, #ffffff);
    --ccb-fc-header-bg: var(--ccb-fc-header-bg, #f3f4f6);
    --ccb-fc-group-bg: var(--ccb-fc-group-bg, #f3f4f6);
    --ccb-fc-border: var(--ccb-fc-border, #e5e7eb);
    --ccb-fc-check: var(--ccb-fc-check, #111827);

    --ccb-fc-header-fs: var(--ccb-fc-header-fs-desktop, 14px);
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-desktop, 14px);
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-desktop, 15px);

    --ccb-fc-cell-py: var(--ccb-fc-cell-py-desktop, 14px);
    --ccb-fc-first-col-w: var(--ccb-fc-first-col-w-desktop, 280px);

    background: var(--ccb-fc-bg);
    padding-top: var(--ccb-fc-pt);
    padding-bottom: var(--ccb-fc-pb);
    width: 100%;
}

/* Editor preview mode (sync with toolbar device) */
.ccb-feature-comparison[data-preview-device="tablet"] {
    --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
    --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
}

.ccb-feature-comparison[data-preview-device="mobile"] {
    --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
    --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
}

@media (max-width: 1024px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
        --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
    }
}

@media (max-width: 768px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
        --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
    }
}

.ccb-feature-comparison__container {
    max-width: var(--ccb-fc-max-width);
    margin: 0 auto;
    padding: 0 24px;
}

.ccb-feature-comparison__title {
    color: var(--ccb-fc-title-color);
    font-size: var(--ccb-fc-title-fs);
    font-weight: 700;
    text-align: center;
    margin: 0 0 28px;
}

.ccb-feature-comparison__table-wrap {
    width: 100%;
}

/* Mobile scroll behavior */
.ccb-feature-comparison--scroll .ccb-feature-comparison__table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.ccb-feature-comparison__table {
    width: 100%;
    background: var(--ccb-fc-table-bg);
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--ccb-fc-border);
}

.ccb-feature-comparison__th,
.ccb-feature-comparison__td,
.ccb-feature-comparison__row-label,
.ccb-feature-comparison__group-cell {
    padding: var(--ccb-fc-cell-py) 14px;
    color: var(--ccb-fc-text);
    border-right: 1px solid var(--ccb-fc-border);
    border-bottom: 1px solid var(--ccb-fc-border);
    vertical-align: middle;
}

.ccb-feature-comparison__th:last-child,
.ccb-feature-comparison__td:last-child {
    border-right: 0;
}

.ccb-feature-comparison__th {
    background: var(--ccb-fc-header-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-header-fs);
    text-align: center;
}

.ccb-feature-comparison__th--feature {
    text-align: center;
    width: var(--ccb-fc-first-col-w);
}

.ccb-feature-comparison__group-row .ccb-feature-comparison__group-cell {
    background: var(--ccb-fc-group-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-group-fs);
    text-align: center;
}

/* Feature Comparison */

.ccb-feature-comparison {
    --ccb-fc-bg: var(--ccb-fc-bg-desktop, #1F5EA8);
    --ccb-fc-pt: var(--ccb-fc-pt-desktop, 72px);
    --ccb-fc-pb: var(--ccb-fc-pb-desktop, 72px);

    --ccb-fc-title-color: var(--ccb-fc-title-color-desktop, #ffffff);
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-desktop, 40px);

    --ccb-fc-max-width: var(--ccb-fc-max-width, 1280px);

    --ccb-fc-text: var(--ccb-fc-text, #111827);
    --ccb-fc-table-bg: var(--ccb-fc-table-bg, #ffffff);
    --ccb-fc-header-bg: var(--ccb-fc-header-bg, #f3f4f6);
    --ccb-fc-group-bg: var(--ccb-fc-group-bg, #f3f4f6);
    --ccb-fc-border: var(--ccb-fc-border, #e5e7eb);
    --ccb-fc-check: var(--ccb-fc-check, #111827);

    --ccb-fc-header-fs: var(--ccb-fc-header-fs-desktop, 14px);
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-desktop, 14px);
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-desktop, 15px);

    --ccb-fc-cell-py: var(--ccb-fc-cell-py-desktop, 14px);
    --ccb-fc-first-col-w: var(--ccb-fc-first-col-w-desktop, 280px);

    background: var(--ccb-fc-bg);
    padding-top: var(--ccb-fc-pt);
    padding-bottom: var(--ccb-fc-pb);
    width: 100%;
}

/* Editor preview mode (sync with toolbar device) */
.ccb-feature-comparison[data-preview-device="tablet"] {
    --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
    --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
}

.ccb-feature-comparison[data-preview-device="mobile"] {
    --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
    --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
    --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
    --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
    --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
    --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
    --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
}

@media (max-width: 1024px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px));
        --ccb-fc-pb: var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px));
    }
}

@media (max-width: 768px) {
    .ccb-feature-comparison {
        --ccb-fc-pt: var(--ccb-fc-pt-mobile, var(--ccb-fc-pt-tablet, var(--ccb-fc-pt-desktop, 72px)));
        --ccb-fc-pb: var(--ccb-fc-pb-mobile, var(--ccb-fc-pb-tablet, var(--ccb-fc-pb-desktop, 72px)));
        --ccb-fc-title-fs: var(--ccb-fc-title-fs-mobile, var(--ccb-fc-title-fs-tablet, var(--ccb-fc-title-fs-desktop, 40px)));
        --ccb-fc-header-fs: var(--ccb-fc-header-fs-mobile, var(--ccb-fc-header-fs-tablet, var(--ccb-fc-header-fs-desktop, 14px)));
        --ccb-fc-group-fs: var(--ccb-fc-group-fs-mobile, var(--ccb-fc-group-fs-tablet, var(--ccb-fc-group-fs-desktop, 14px)));
        --ccb-fc-label-fs: var(--ccb-fc-label-fs-mobile, var(--ccb-fc-label-fs-tablet, var(--ccb-fc-label-fs-desktop, 15px)));
        --ccb-fc-cell-py: var(--ccb-fc-cell-py-mobile, var(--ccb-fc-cell-py-tablet, var(--ccb-fc-cell-py-desktop, 14px)));
    }
}

.ccb-feature-comparison__container {
    max-width: var(--ccb-fc-max-width);
    margin: 0 auto;
    padding: 0 24px;
}

.ccb-feature-comparison__title {
    color: var(--ccb-fc-title-color);
    font-size: var(--ccb-fc-title-fs);
    font-weight: 700;
    text-align: center;
    margin: 0 0 28px;
}

.ccb-feature-comparison__table-wrap {
    width: 100%;
}

/* Mobile scroll behavior */
.ccb-feature-comparison--scroll .ccb-feature-comparison__table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.ccb-feature-comparison__table {
    width: 100%;
    background: var(--ccb-fc-table-bg);
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--ccb-fc-border);
}

.ccb-feature-comparison__th,
.ccb-feature-comparison__td,
.ccb-feature-comparison__row-label,
.ccb-feature-comparison__group-cell {
    padding: var(--ccb-fc-cell-py) 14px;
    color: var(--ccb-fc-text);
    border-right: 1px solid var(--ccb-fc-border);
    border-bottom: 1px solid var(--ccb-fc-border);
    vertical-align: middle;
}

.ccb-feature-comparison__th:last-child,
.ccb-feature-comparison__td:last-child {
    border-right: 0;
}

.ccb-feature-comparison__th {
    background: var(--ccb-fc-header-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-header-fs);
    text-align: center;
}

.ccb-feature-comparison__th--feature {
    text-align: center;
    width: var(--ccb-fc-first-col-w);
}

.ccb-feature-comparison__group-row .ccb-feature-comparison__group-cell {
    background: var(--ccb-fc-group-bg);
    font-weight: 700;
    font-size: var(--ccb-fc-group-fs);
    text-align: center;
}

/* ── Collapsible group rows ── */
.ccb-fc-collapsible .ccb-feature-comparison__group-cell {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    position: relative;
    padding-right: 44px !important;
    transition: background 200ms ease;
}
.ccb-fc-collapsible .ccb-feature-comparison__group-cell:hover {
    background: color-mix(in srgb, var(--ccb-fc-group-bg) 85%, var(--ccb-fc-text));
}
.ccb-fc-collapsible .ccb-feature-comparison__group-cell::after {
    content: "\2212";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 24px;
    height: 24px;
    margin-top: -12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    color: var(--ccb-fc-text);
    opacity: 0.5;
    border: 1.5px solid currentColor;
    border-radius: 4px;
    transition: opacity 200ms ease;
}
.ccb-fc-collapsible .ccb-feature-comparison__group-cell:hover::after {
    opacity: 0.8;
}
.ccb-fc-collapsed .ccb-feature-comparison__group-cell::after {
    content: "+";
}

.ccb-feature-comparison__row-label {
    font-weight: 500;
    font-size: var(--ccb-fc-label-fs);
    text-align: center;
}

.ccb-feature-comparison__td {
    text-align: center;
}

.ccb-feature-comparison__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ccb-fc-check);
}

.ccb-feature-comparison__check-icon {
    width: 18px;
    height: 18px;
    fill: currentColor;
    display: block;
}

.ccb-feature-comparison__feature-link,
.ccb-feature-comparison__cell-link {
    color: #2563eb;
    text-decoration: underline;
}

/* ─── Mobile Stacked Cards ─── */
@media (max-width: 768px) {
    .ccb-feature-comparison--scroll .ccb-feature-comparison__table-wrap {
        overflow-x: visible;
    }

    .ccb-feature-comparison__table,
    .ccb-feature-comparison__table thead,
    .ccb-feature-comparison__table tbody,
    .ccb-feature-comparison__table tr,
    .ccb-feature-comparison__table th,
    .ccb-feature-comparison__table td {
        display: block;
        width: 100%;
    }

    /* Hide the header row — plan names appear as data-label on each cell */
    .ccb-feature-comparison__table thead {
        position: absolute;
        left: -9999px;
        clip: rect(0 0 0 0);
    }

    /* Group rows stay full-width — visually distinct section headers */
    .ccb-feature-comparison__group-row {
        margin-top: 20px;
    }
    .ccb-feature-comparison__group-row:first-child {
        margin-top: 0;
    }
    .ccb-feature-comparison__group-row .ccb-feature-comparison__group-cell {
        border-right: 0;
        background: var(--ccb-fc-group-bg, #f3f4f6);
        font-size: 17px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        padding: 16px 44px 16px 16px;
        border-bottom: 2px solid var(--ccb-fc-border, #e5e7eb);
    }

    /* Each feature row becomes a card — lighter, indented style */
    .ccb-feature-comparison__table tbody tr:not(.ccb-feature-comparison__group-row) {
        margin-bottom: 0;
        border: none;
        border-bottom: 1px solid var(--ccb-fc-border, #e5e7eb);
        border-radius: 0;
        overflow: hidden;
        background: var(--ccb-fc-table-bg);
    }

    /* Feature label cell */
    .ccb-feature-comparison__row-label {
        background: transparent;
        font-weight: 500;
        font-size: var(--ccb-fc-label-fs);
        border-right: 0;
        border-bottom: none;
        padding: 12px 14px 4px;
    }

    /* Value cells: plan name + status */
    .ccb-feature-comparison__td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-align: right;
        padding: 8px 14px;
        border-right: 0;
        border-bottom: none;
        border-left: 3px solid transparent;
    }

    /* Included cell: green accent */
    .ccb-feature-comparison__td:has(.ccb-feature-comparison__check) {
        border-left-color: #22c55e;
        background: rgba(34, 197, 94, 0.06);
    }

    /* Not-included cell: subtle gray */
    .ccb-feature-comparison__td:has(.ccb-feature-comparison__cell-empty) {
        border-left-color: #d1d5db;
        background: rgba(0, 0, 0, 0.02);
    }

    .ccb-feature-comparison__td::before {
        content: attr(data-label);
        font-weight: 600;
        font-size: var(--ccb-fc-header-fs);
        text-align: center;
        flex: 1 1 auto;
        padding-right: 12px;
        color: var(--ccb-fc-text);
    }

    /* Check icon: larger, green */
    .ccb-feature-comparison__td .ccb-feature-comparison__check {
        color: #22c55e;
    }
    .ccb-feature-comparison__td .ccb-feature-comparison__check-icon {
        width: 22px;
        height: 22px;
    }

    /* Empty cell: show a dash indicator */
    .ccb-feature-comparison__td .ccb-feature-comparison__cell-empty::after {
        content: "—";
        font-size: 18px;
        font-weight: 700;
        color: #d1d5db;
    }
}


/* ══════════════════════════════════════════════════════════════════════════════
   Pricing Cards — Improved Design (v2)
   - Centered layout for brand/plan/description/price/suffix
   - Subgrid 7-row for perfect cross-card alignment
   - Left-aligned feature list for scannability
   - Visual separators between sections
   - Tablet/mobile resets preserve existing behaviour
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Row placement inside __price subgrid ── */
.ccb-pricingCard__price > .ccb-pricingCard__priceMain  { grid-row: 1; }
.ccb-pricingCard__price > .ccb-pricingCard__priceSuffix { grid-row: 2; }
.ccb-pricingCard__price > .ccb-pricingCard__freeNote    { grid-row: 3; }

/* ── Center the top half of the card ── */
.ccb-pricingCard__content {
    text-align: center;
}
.ccb-pricingCard__brandTop {
    text-align: center;
}
.ccb-pricingCard__plan {
    text-align: center;
}
.ccb-pricingCard__description {
    text-align: center;
    align-self: end;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--ccb-pr-border-color, #e5e7eb);
}
.ccb-pricingCard__priceMain {
    text-align: center;
    padding-top: 20px;
}
.ccb-pricingCard__priceSuffix {
    text-align: center;
}

/* ── Feature list: left-aligned for readability ── */
.ccb-pricingCard__freeNote {
    text-align: center;
    text-align: center;
    padding-top: 16px;
    border-top: 1px solid var(--ccb-pr-border-color, #e5e7eb);
    margin-top: 8px;
    align-self: start;
}

/* ── CTA: anchor to bottom, full width ── */
.ccb-pricingCard__cta {
    align-self: end;
    padding-top: 20px;
}

/* ── Featured card: slightly lift with box-shadow ── */
.ccb-pricingCard.is-featured {
    box-shadow: 0 8px 30px rgba(40, 100, 172, 0.15);
}

/* ══════════════ Tablet reset (≤1024px) ══════════════ */
@media (max-width: 1024px) {
    .ccb-pricingCard__price {
        display: block;
        grid-row: auto;
    }
    .ccb-pricingCard__description {
        align-self: auto;
        padding-bottom: 0;
        border-bottom: none;
    }
    .ccb-pricingCard__priceMain {
        padding-top: 0;
    }
    .ccb-pricingCard__freeNote {
    text-align: center;
        border-top: none;
        padding-top: 0;
        margin-top: 6px;
    }
    .ccb-pricingCard__cta {
        padding-top: 0;
    }
}

/* ══════════════ Mobile reset (≤768px) ══════════════ */
@media (max-width: 768px) {
    .ccb-pricingCard__price {
        display: block;
        grid-row: auto;
    }
    .ccb-pricingCard__description {
        align-self: auto;
        text-align: center;
        padding-bottom: 0;
        border-bottom: none;
    }
    .ccb-pricingCard__priceMain {
        padding-top: 0;
    }
    .ccb-pricingCard__freeNote {
    text-align: center;
        text-align: center;
        border-top: none;
        padding-top: 0;
        margin-top: 0;
    }
    .ccb-pricingCard__cta {
        padding-top: 0;
    }
}

/* ══════════════ Editor preview resets ══════════════ */
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__price,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__price {
    display: block;
    grid-row: auto;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__description,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__description {
    align-self: auto;
    padding-bottom: 0;
    border-bottom: none;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__priceMain,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__priceMain {
    padding-top: 0;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__freeNote,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__freeNote {
    text-align: center;
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__cta,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__cta {
    padding-top: 0;
}

/* ── Pricing card hover ── */
.ccb-pricingCard {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.ccb-pricingCard:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 36px rgba(40, 100, 172, 0.18);
    border-color: var(--ccb-pr-accent-blue, #3b82f6);
}
.ccb-pricingCard.is-featured:hover {
    box-shadow: 0 16px 48px rgba(40, 100, 172, 0.25);
}




/* ── Pricing: description align-self + move border to price ── */
.ccb-pricingCard__description {
    align-self: start;
    padding-bottom: 0;
    border-bottom: none;
}
.ccb-pricingCard__price {
    border-top: 1px solid var(--ccb-pr-border-color, #e5e7eb);
    padding-top: 16px;
}

/* ── Pricing: green check icons (centered) ── */
.ccb-pricingCard__freeNote ul,
.ccb-pricingCard__freeNote ol {
    list-style: none !important;
    display: inline-block;
    text-align: left;
}
.ccb-pricingCard__freeNote li {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.4em;
    padding-left: 0;
    margin-bottom: 0.5em;
}

/* Pricing: keep Free card support text above feature list */
.ccb-pricingCard__freeNote p:empty {
    display: none;
    margin: 0;
}
.ccb-pricingCard__freeNote ul,
.ccb-pricingCard__freeNote ol {
    display: block !important;
    width: fit-content;
    max-width: 100%;
    margin: 10px auto 0 !important;
    text-align: left;
}
.ccb-pricingCard__freeNote li::before {
    content: "";
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    background: var(--ccb-pr-cta1-bg, #81BF48);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%273.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%274 12 10 18 20 6%27/%3E%3C/svg%3E") no-repeat center/contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%273.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%274 12 10 18 20 6%27/%3E%3C/svg%3E") no-repeat center/contain;
}

/* ── Tablet/mobile resets for border + icons ── */
@media (max-width: 1024px) {
    .ccb-pricingCard__price {
        border-top: none;
        padding-top: 0;
    }
}
@media (max-width: 768px) {
    .ccb-pricingCard__description {
        align-self: auto;
    }
    .ccb-pricingCard__price {
        border-top: none;
        padding-top: 0;
    }
}
.ccb-pricing[data-preview-device="tablet"] .ccb-pricingCard__price,
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__price {
    border-top: none;
    padding-top: 0;
}
.ccb-pricing[data-preview-device="mobile"] .ccb-pricingCard__description {
    align-self: auto;
}

/* ── Pricing mobile: green check icons inside features accordion ── */
.ccb-pricingCard__featuresBody ul,
.ccb-pricingCard__featuresBody ol {
    list-style: none !important;
    display: inline-block;
    text-align: left;
}
.ccb-pricingCard__featuresBody li {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.4em;
    padding-left: 0;
    margin-bottom: 0.5em;
}
.ccb-pricingCard__featuresBody li::before {
    content: "";
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    margin-top: 0.18em;
    background: var(--ccb-pr-cta1-bg, #81BF48);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%273.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%274 12 10 18 20 6%27/%3E%3C/svg%3E") no-repeat center/contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%273.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%274 12 10 18 20 6%27/%3E%3C/svg%3E") no-repeat center/contain;
}

/* Mobile fixes appended (2026-04-30) — kept here because per-block CSS is not enqueued for these blocks */
@media (max-width: 768px) {
    .ccb-mode-grid .ccb-carousel-item {
        height: 100px;
    }
    .cgb-pre-footer .ccb-follow-us__icon {
        width: 35px;
        height: 35px;
    }
}


/* === Rebuilt from universal-card-grid.css === */
/* =========================================
    Block: Universal Card Grid
    ========================================= */

.ccb-universal-grid {
    position: relative;
    --ccb-ug-cols-d: 3;
    --ccb-ug-cols-t: 2;
    --ccb-ug-cols-m: 1;
    --ccb-ug-gap: 24px;
    --ccb-ug-card-bg: #fff;
    --ccb-ug-text-color: #333;
    --ccb-ug-radius: 8px;
     /* NOTE: --ccb-ug-shadow is intentionally NOT a static value.
         It's derived from responsive vars so editor/front can react to controls. */

    --ccb-ug-sect-title: var(--ccb-ug-sect-title-desktop, 40px);
    --ccb-ug-sect-sub: var(--ccb-ug-sect-sub-desktop, 20px);
    --ccb-ug-card-title: var(--ccb-ug-card-title-desktop, 20px);
    --ccb-ug-card-desc: var(--ccb-ug-card-desc-desktop, 16px);
    --ccb-ug-img-pad: var(--ccb-ug-img-pad-desktop, 0px);
    --ccb-ug-img-scale: var(--ccb-ug-img-scale-desktop, 1);

    --ccb-ug-ar: var(--ccb-ug-ar-desktop);

    --ccb-ug-shadow-y: var(--ccb-ug-shadow-y-desktop, 10px);
    --ccb-ug-shadow-blur: var(--ccb-ug-shadow-blur-desktop, 15px);
    --ccb-ug-shadow-spread: var(--ccb-ug-shadow-spread-desktop, -3px);
    --ccb-ug-shadow-opacity: var(--ccb-ug-shadow-opacity-desktop, 0.1);
    --ccb-ug-shadow-computed: 0 var(--ccb-ug-shadow-y) var(--ccb-ug-shadow-blur) var(--ccb-ug-shadow-spread) rgba(0, 0, 0, var(--ccb-ug-shadow-opacity));

    --ccb-ug-shadow: var(--ccb-ug-shadow-computed);
    --ccb-ug-shadow-hover-computed: 0 calc(var(--ccb-ug-shadow-y) + 4px) calc(var(--ccb-ug-shadow-blur) + 6px) var(--ccb-ug-shadow-spread) rgba(0, 0, 0, var(--ccb-ug-shadow-opacity));
    --ccb-ug-shadow-hover: var(--ccb-ug-shadow-hover-computed);

    padding-top: var(--ccb-ug-pt-desktop, 60px);
    padding-bottom: var(--ccb-ug-pb-desktop, 60px);
    margin-top: var(--ccb-ug-mt-desktop, 0px);
    margin-bottom: var(--ccb-ug-mb-desktop, 0px);
    background-color: var(--ccb-ug-bg, transparent);
    background-image: var(--ccb-ug-bg-img, none);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    min-height: var(--ccb-ug-minh, auto);

    width: 100%;
    box-sizing: border-box;
}

.ccb-universal-grid.ccb-ug--parallax {
    background-attachment: fixed;
}

@media (max-width: 768px) {
    .ccb-universal-grid.ccb-ug--parallax {
        background-attachment: scroll;
    }
}

.ccb-universal-grid.ccb-ug--has-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: color-mix(
        in srgb,
        var(--ccb-ug-overlay-color, #000000) var(--ccb-ug-overlay-strength, 0%),
        transparent
    );
}

.ccb-universal-grid .cgb-inner {
    position: relative;
    z-index: 1;
}

.ccb-universal-grid.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.ccb-universal-grid .cgb-inner {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    padding-left: var(--ccb-ug-px-desktop, 20px);
    padding-right: var(--ccb-ug-px-desktop, 20px);
}

/* Grid Container */
.ccb-universal-grid__grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(var(--ccb-ug-cols-m), 1fr);
    gap: var(--ccb-ug-gap);
    margin-top: 30px;
}

.ccb-universal-grid__grid > * {
    height: 100%;
}

@media (min-width: 768px) {
    .ccb-universal-grid__grid {
        grid-template-columns: repeat(var(--ccb-ug-cols-t), 1fr);
    }
}

@media (min-width: 1024px) {
    .ccb-universal-grid__grid {
        grid-template-columns: repeat(var(--ccb-ug-cols-d), 1fr);
    }
}

/* Card */
.ccb-universal-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: var(--ccb-ug-card-bg);
    border-radius: var(--ccb-ug-radius);
    box-shadow: var(--ccb-ug-shadow, var(--ccb-ug-shadow-computed));
    overflow: hidden;
    height: 100%;
    /* Equal height */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ccb-universal-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ccb-ug-shadow-hover, var(--ccb-ug-shadow, var(--ccb-ug-shadow-computed)));
}

.ccb-universal-card--clickable {
    cursor: pointer;
}

.ccb-universal-card__stretched-link {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.ccb-universal-card__image-wrapper,
.ccb-universal-card__content,
.ccb-universal-card__footer {
    position: relative;
    z-index: 1;
}

.ccb-universal-card__button {
    position: relative;
    z-index: 3;
}

/* =========================================
   Title badge styles
   ========================================= */
.ccb-universal-card__title-badge {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    font-weight: var(--ccb-ug-badge-fw, 700);
    letter-spacing: var(--ccb-ug-badge-ls, 0px);
    text-transform: var(--ccb-ug-badge-tt, none);
    line-height: 1.2;
    padding: 6px 10px;
    box-sizing: border-box;
}

/* Inline chip (inside content) */
.ccb-title-badge--inline {
    align-self: flex-start;
    color: var(--ccb-ug-accent, #0073aa);
    border: 1px solid var(--ccb-ug-accent, #0073aa);
    background: transparent;
    border-radius: 999px;
    margin-bottom: 10px;
}

/* Overlay pill (over image) */
.ccb-title-badge--pill,
.ccb-title-badge--corner {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
}

.ccb-title-badge--top-right {
    left: auto;
    right: 12px;
}

.ccb-title-badge--pill {
    color: #fff;
    background: var(--ccb-ug-accent, #0073aa);
    border-radius: 999px;
}

/* Corner badge: more "tag" feel */
.ccb-title-badge--corner {
    color: #fff;
    background: var(--ccb-ug-accent, #0073aa);
    border-radius: 6px;
    text-transform: var(--ccb-ug-badge-tt, uppercase);
    letter-spacing: var(--ccb-ug-badge-ls, 0.04em);
    font-size: calc(var(--ccb-ug-card-title) * 0.75);
}

/* Card Image */
.ccb-universal-card__image-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
    /* Aspect Ratio handled inline or via CSS var */
    padding-top: var(--ccb-ug-ar);
}

.ccb-universal-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    box-sizing: border-box;
}

/* Card Content */
.ccb-universal-card__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-top: var(--ccb-ug-cc-pt-desktop, 24px);
    padding-right: var(--ccb-ug-cc-pr-desktop, 24px);
    padding-bottom: var(--ccb-ug-cc-pb-desktop, 24px);
    padding-left: var(--ccb-ug-cc-pl-desktop, 24px);
}

.ccb-universal-card__title {
    margin-top: var(--ccb-ug-ct-mt-desktop, 0px);
    margin-right: 0;
    margin-bottom: var(--ccb-ug-ct-mb-desktop, 12px);
    margin-left: 0;
    font-size: var(--ccb-ug-card-title);
    font-weight: var(--ccb-ug-ct-fw, 700);
    letter-spacing: var(--ccb-ug-ct-ls, 0px);
    text-transform: var(--ccb-ug-ct-tt, none);
    line-height: var(--ccb-ug-ct-lh-desktop, 1.25);
}

.ccb-universal-card__desc {
    margin-top: var(--ccb-ug-cd-mt-desktop, 0px);
    margin-right: 0;
    margin-bottom: var(--ccb-ug-cd-mb-desktop, 16px);
    margin-left: 0;
    font-size: var(--ccb-ug-card-desc);
    font-weight: var(--ccb-ug-cd-fw, 400);
    letter-spacing: var(--ccb-ug-cd-ls, 0px);
    text-transform: var(--ccb-ug-cd-tt, none);
    line-height: var(--ccb-ug-cd-lh-desktop, 1.6);
    flex-grow: 1;
    /* Pushes list/button down if desired */
}

/* List Styles */
.ccb-universal-card__list {
    margin-top: var(--ccb-ug-cl-mt-desktop, 0px);
    margin-right: 0;
    margin-bottom: var(--ccb-ug-cl-mb-desktop, 20px);
    margin-left: 0;
    font-size: var(--ccb-ug-cl-fs-desktop, inherit);
    font-weight: var(--ccb-ug-cl-fw, 400);
    letter-spacing: var(--ccb-ug-cl-ls, 0px);
    text-transform: var(--ccb-ug-cl-tt, none);
    padding: 0;
    list-style: none;
}

.ccb-universal-card__list li {
    position: relative;
    padding-left: var(--ccb-ug-cl-indent-desktop, 24px);
    margin-bottom: var(--ccb-ug-cl-gap-desktop, 8px);
    line-height: var(--ccb-ug-cl-lh-desktop, 1.5);
}

.ccb-universal-card__list li::before {
    content: "✓";
    /* Default Check */
    position: absolute;
    left: 0;
    top: 0;
    color: var(--ccb-ug-accent, #0073aa);
    font-weight: bold;
}

@media (max-width: 1024px) {
    .ccb-universal-grid {
        padding-top: var(--ccb-ug-pt-tablet, var(--ccb-ug-pt-desktop, 60px));
        padding-bottom: var(--ccb-ug-pb-tablet, var(--ccb-ug-pb-desktop, 60px));
        margin-top: var(--ccb-ug-mt-tablet, var(--ccb-ug-mt-desktop, 0px));
        margin-bottom: var(--ccb-ug-mb-tablet, var(--ccb-ug-mb-desktop, 0px));

        --ccb-ug-sect-title: var(--ccb-ug-sect-title-tablet, var(--ccb-ug-sect-title-desktop, 40px));
        --ccb-ug-sect-sub: var(--ccb-ug-sect-sub-tablet, var(--ccb-ug-sect-sub-desktop, 20px));
        --ccb-ug-card-title: var(--ccb-ug-card-title-tablet, var(--ccb-ug-card-title-desktop, 20px));
        --ccb-ug-card-desc: var(--ccb-ug-card-desc-tablet, var(--ccb-ug-card-desc-desktop, 16px));
        --ccb-ug-img-pad: var(--ccb-ug-img-pad-tablet, var(--ccb-ug-img-pad-desktop, 0px));
        --ccb-ug-img-scale: var(--ccb-ug-img-scale-tablet, var(--ccb-ug-img-scale-desktop, 1));

        --ccb-ug-ar: var(--ccb-ug-ar-tablet, var(--ccb-ug-ar-desktop));

        --ccb-ug-shadow-y: var(--ccb-ug-shadow-y-tablet, var(--ccb-ug-shadow-y-desktop, 10px));
        --ccb-ug-shadow-blur: var(--ccb-ug-shadow-blur-tablet, var(--ccb-ug-shadow-blur-desktop, 15px));
        --ccb-ug-shadow-spread: var(--ccb-ug-shadow-spread-tablet, var(--ccb-ug-shadow-spread-desktop, -3px));
        --ccb-ug-shadow-opacity: var(--ccb-ug-shadow-opacity-tablet, var(--ccb-ug-shadow-opacity-desktop, 0.1));
    }

    .ccb-universal-grid .cgb-inner {
        padding-left: var(--ccb-ug-px-tablet, var(--ccb-ug-px-desktop, 20px));
        padding-right: var(--ccb-ug-px-tablet, var(--ccb-ug-px-desktop, 20px));
    }

    .ccb-universal-card__content {
        padding-top: var(--ccb-ug-cc-pt-tablet, var(--ccb-ug-cc-pt-desktop, 24px));
        padding-right: var(--ccb-ug-cc-pr-tablet, var(--ccb-ug-cc-pr-desktop, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-tablet, var(--ccb-ug-cc-pb-desktop, 24px));
        padding-left: var(--ccb-ug-cc-pl-tablet, var(--ccb-ug-cc-pl-desktop, 24px));
    }

    .ccb-universal-card__title {
        line-height: var(--ccb-ug-ct-lh-tablet, var(--ccb-ug-ct-lh-desktop, 1.25));
        margin-top: var(--ccb-ug-ct-mt-tablet, var(--ccb-ug-ct-mt-desktop, 0px));
        margin-bottom: var(--ccb-ug-ct-mb-tablet, var(--ccb-ug-ct-mb-desktop, 12px));
    }

    .ccb-universal-card__desc {
        line-height: var(--ccb-ug-cd-lh-tablet, var(--ccb-ug-cd-lh-desktop, 1.6));
        margin-top: var(--ccb-ug-cd-mt-tablet, var(--ccb-ug-cd-mt-desktop, 0px));
        margin-bottom: var(--ccb-ug-cd-mb-tablet, var(--ccb-ug-cd-mb-desktop, 16px));
    }

    .ccb-universal-card__list {
        margin-top: var(--ccb-ug-cl-mt-tablet, var(--ccb-ug-cl-mt-desktop, 0px));
        margin-bottom: var(--ccb-ug-cl-mb-tablet, var(--ccb-ug-cl-mb-desktop, 20px));
        font-size: var(--ccb-ug-cl-fs-tablet, var(--ccb-ug-cl-fs-desktop, inherit));
    }

    .ccb-universal-card__list li {
        padding-left: var(--ccb-ug-cl-indent-tablet, var(--ccb-ug-cl-indent-desktop, 24px));
        margin-bottom: var(--ccb-ug-cl-gap-tablet, var(--ccb-ug-cl-gap-desktop, 8px));
        line-height: var(--ccb-ug-cl-lh-tablet, var(--ccb-ug-cl-lh-desktop, 1.5));
    }

    .ccb-ug--preset-card .ccb-universal-card__footer {
        padding-top: var(--ccb-ug-cc-pt-tablet, var(--ccb-ug-cc-pt-desktop, 24px));
        padding-right: var(--ccb-ug-cc-pr-tablet, var(--ccb-ug-cc-pr-desktop, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-tablet, var(--ccb-ug-cc-pb-desktop, 24px));
        padding-left: var(--ccb-ug-cc-pl-tablet, var(--ccb-ug-cc-pl-desktop, 24px));
    }

    .ccb-ug--preset-flat-list .ccb-universal-card__content {
        padding-top: var(--ccb-ug-cc-pt-tablet, var(--ccb-ug-cc-pt-desktop, 24px));
        padding-right: var(--ccb-ug-cc-pr-tablet, var(--ccb-ug-cc-pr-desktop, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-tablet, var(--ccb-ug-cc-pb-desktop, 24px));
        padding-left: var(--ccb-ug-cc-pl-tablet, var(--ccb-ug-cc-pl-desktop, 24px));
    }

    .ccb-ug--preset-flat-list .ccb-universal-card__list li + li {
        margin-top: var(--ccb-ug-cl-gap-tablet, var(--ccb-ug-cl-gap-desktop, 8px));
    }

    .ccb-universal-grid__section-title {
        margin-top: var(--ccb-ug-st-mt-tablet, var(--ccb-ug-st-mt-desktop, 0px));
        margin-bottom: var(--ccb-ug-st-mb-tablet, var(--ccb-ug-st-mb-desktop, 10px));
    }

    .ccb-universal-grid__section-subtitle {
        margin-top: var(--ccb-ug-ss-mt-tablet, var(--ccb-ug-ss-mt-desktop, 10px));
    }
}

@media (max-width: 768px) {
    .ccb-universal-grid {
        padding-top: var(--ccb-ug-pt-mobile, var(--ccb-ug-pt-tablet, 60px));
        padding-bottom: var(--ccb-ug-pb-mobile, var(--ccb-ug-pb-tablet, 60px));
        margin-top: var(--ccb-ug-mt-mobile, var(--ccb-ug-mt-tablet, 0px));
        margin-bottom: var(--ccb-ug-mb-mobile, var(--ccb-ug-mb-tablet, 0px));

        --ccb-ug-sect-title: var(--ccb-ug-sect-title-mobile, var(--ccb-ug-sect-title-tablet, var(--ccb-ug-sect-title-desktop, 40px)));
        --ccb-ug-sect-sub: var(--ccb-ug-sect-sub-mobile, var(--ccb-ug-sect-sub-tablet, var(--ccb-ug-sect-sub-desktop, 20px)));
        --ccb-ug-card-title: var(--ccb-ug-card-title-mobile, var(--ccb-ug-card-title-tablet, var(--ccb-ug-card-title-desktop, 20px)));
        --ccb-ug-card-desc: var(--ccb-ug-card-desc-mobile, var(--ccb-ug-card-desc-tablet, var(--ccb-ug-card-desc-desktop, 16px)));
        --ccb-ug-img-pad: var(--ccb-ug-img-pad-mobile, var(--ccb-ug-img-pad-tablet, var(--ccb-ug-img-pad-desktop, 0px)));
        --ccb-ug-img-scale: var(--ccb-ug-img-scale-mobile, var(--ccb-ug-img-scale-tablet, var(--ccb-ug-img-scale-desktop, 1)));

        --ccb-ug-ar: var(--ccb-ug-ar-mobile, var(--ccb-ug-ar-tablet, var(--ccb-ug-ar-desktop)));

        --ccb-ug-shadow-y: var(--ccb-ug-shadow-y-mobile, var(--ccb-ug-shadow-y-tablet, var(--ccb-ug-shadow-y-desktop, 10px)));
        --ccb-ug-shadow-blur: var(--ccb-ug-shadow-blur-mobile, var(--ccb-ug-shadow-blur-tablet, var(--ccb-ug-shadow-blur-desktop, 15px)));
        --ccb-ug-shadow-spread: var(--ccb-ug-shadow-spread-mobile, var(--ccb-ug-shadow-spread-tablet, var(--ccb-ug-shadow-spread-desktop, -3px)));
        --ccb-ug-shadow-opacity: var(--ccb-ug-shadow-opacity-mobile, var(--ccb-ug-shadow-opacity-tablet, var(--ccb-ug-shadow-opacity-desktop, 0.1)));
    }

    .ccb-universal-grid .cgb-inner {
        padding-left: var(--ccb-ug-px-mobile, var(--ccb-ug-px-tablet, 16px));
        padding-right: var(--ccb-ug-px-mobile, var(--ccb-ug-px-tablet, 16px));
    }

    .ccb-universal-grid__section-title {
        margin-top: var(--ccb-ug-st-mt-mobile, var(--ccb-ug-st-mt-tablet, var(--ccb-ug-st-mt-desktop, 0px)));
        margin-bottom: var(--ccb-ug-st-mb-mobile, var(--ccb-ug-st-mb-tablet, var(--ccb-ug-st-mb-desktop, 10px)));
    }

    .ccb-universal-grid__section-subtitle {
        margin-top: var(--ccb-ug-ss-mt-mobile, var(--ccb-ug-ss-mt-tablet, var(--ccb-ug-ss-mt-desktop, 10px)));
    }

    .ccb-universal-card__content {
        padding-top: var(--ccb-ug-cc-pt-mobile, var(--ccb-ug-cc-pt-tablet, 24px));
        padding-right: var(--ccb-ug-cc-pr-mobile, var(--ccb-ug-cc-pr-tablet, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-mobile, var(--ccb-ug-cc-pb-tablet, 24px));
        padding-left: var(--ccb-ug-cc-pl-mobile, var(--ccb-ug-cc-pl-tablet, 24px));
    }

    .ccb-universal-card__title {
        line-height: var(--ccb-ug-ct-lh-mobile, var(--ccb-ug-ct-lh-tablet, 1.25));
        margin-top: var(--ccb-ug-ct-mt-mobile, var(--ccb-ug-ct-mt-tablet, 0px));
        margin-bottom: var(--ccb-ug-ct-mb-mobile, var(--ccb-ug-ct-mb-tablet, 12px));
    }

    .ccb-universal-card__desc {
        line-height: var(--ccb-ug-cd-lh-mobile, var(--ccb-ug-cd-lh-tablet, 1.6));
        margin-top: var(--ccb-ug-cd-mt-mobile, var(--ccb-ug-cd-mt-tablet, 0px));
        margin-bottom: var(--ccb-ug-cd-mb-mobile, var(--ccb-ug-cd-mb-tablet, 16px));
    }

    .ccb-universal-card__list {
        margin-top: var(--ccb-ug-cl-mt-mobile, var(--ccb-ug-cl-mt-tablet, 0px));
        margin-bottom: var(--ccb-ug-cl-mb-mobile, var(--ccb-ug-cl-mb-tablet, 20px));
        font-size: var(--ccb-ug-cl-fs-mobile, var(--ccb-ug-cl-fs-tablet, var(--ccb-ug-cl-fs-desktop, inherit)));
    }

    .ccb-universal-card__list li {
        padding-left: var(--ccb-ug-cl-indent-mobile, var(--ccb-ug-cl-indent-tablet, 24px));
        margin-bottom: var(--ccb-ug-cl-gap-mobile, var(--ccb-ug-cl-gap-tablet, 8px));
        line-height: var(--ccb-ug-cl-lh-mobile, var(--ccb-ug-cl-lh-tablet, 1.5));
    }

    .ccb-ug--preset-card .ccb-universal-card__footer {
        padding-top: var(--ccb-ug-cc-pt-mobile, var(--ccb-ug-cc-pt-tablet, 24px));
        padding-right: var(--ccb-ug-cc-pr-mobile, var(--ccb-ug-cc-pr-tablet, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-mobile, var(--ccb-ug-cc-pb-tablet, 24px));
        padding-left: var(--ccb-ug-cc-pl-mobile, var(--ccb-ug-cc-pl-tablet, 24px));
    }

    .ccb-ug--preset-flat-list .ccb-universal-card__content {
        padding-top: var(--ccb-ug-cc-pt-mobile, var(--ccb-ug-cc-pt-tablet, 24px));
        padding-right: var(--ccb-ug-cc-pr-mobile, var(--ccb-ug-cc-pr-tablet, 24px));
        padding-bottom: var(--ccb-ug-cc-pb-mobile, var(--ccb-ug-cc-pb-tablet, 24px));
        padding-left: var(--ccb-ug-cc-pl-mobile, var(--ccb-ug-cc-pl-tablet, 24px));
    }

    .ccb-ug--preset-flat-list .ccb-universal-card__list li + li {
        margin-top: var(--ccb-ug-cl-gap-mobile, var(--ccb-ug-cl-gap-tablet, 8px));
    }
}

/* Button */
.ccb-universal-card__button {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 4px;
    text-align: center;
    font-size: var(--ccb-ug-btn-fs, inherit);
    font-weight: var(--ccb-ug-btn-fw, 600);
    line-height: var(--ccb-ug-btn-lh, 1.2);
    letter-spacing: var(--ccb-ug-btn-ls, 0px);
    text-transform: var(--ccb-ug-btn-tt, none);
    margin-top: auto;
    /* Push to bottom */
    transition: all 0.2s;
    cursor: pointer;
}

.ccb-universal-card__footer {
    margin-top: auto;
    padding: 0;
}

.ccb-btn-fill {
    background-color: var(--ccb-ug-accent, #0073aa);
    color: #fff;
    border: 1px solid var(--ccb-ug-accent, #0073aa);
}

a.ccb-universal-card__button.ccb-btn-fill:hover {
    background-color: var(--ccb-ug-btn-hover-bg, var(--ccb-ug-accent, #0073aa));
    border-color: var(--ccb-ug-btn-hover-bg, var(--ccb-ug-accent, #0073aa));
    filter: var(--ccb-ug-btn-hover-filter, brightness(0.92));
    color: var(--ccb-ug-btn-hover-text, #fff);
}

.ccb-btn-outline {
    background-color: transparent;
    color: var(--ccb-ug-accent, #0073aa);
    border: 2px solid var(--ccb-ug-accent, #0073aa);
}

a.ccb-universal-card__button.ccb-btn-outline:hover {
    background-color: var(--ccb-ug-btn-hover-bg, var(--ccb-ug-accent, #0073aa));
    border-color: var(--ccb-ug-btn-hover-bg, var(--ccb-ug-accent, #0073aa));
    color: var(--ccb-ug-btn-hover-text, #fff);
}

.ccb-btn-link {
    background: none;
    border: none;
    padding: 0;
    color: var(--ccb-ug-accent, #0073aa);
    text-align: left;
    text-decoration: underline;
}

a.ccb-universal-card__button.ccb-btn-link:hover {
    color: var(--ccb-ug-btn-hover-text, var(--ccb-ug-accent, #0073aa));
    text-decoration: underline;
}

/* --- New Customization Features (v109) --- */

/* Section Header */
.ccb-universal-grid__header {
    margin-bottom: 40px;
}

.ccb-universal-grid__section-title {
    font-size: var(--ccb-ug-sect-title, 2.5rem);
    font-weight: var(--ccb-ug-st-fw, 700);
    margin-top: var(--ccb-ug-st-mt-desktop, 0px);
    margin-right: 0;
    margin-bottom: var(--ccb-ug-st-mb-desktop, 10px);
    margin-left: 0;
    line-height: var(--ccb-ug-st-lh, 1.2);
    letter-spacing: var(--ccb-ug-st-ls, 0px);
    text-transform: var(--ccb-ug-st-tt, none);
}

.ccb-universal-grid__section-subtitle {
    font-size: var(--ccb-ug-sect-sub, 1.25rem);
    line-height: var(--ccb-ug-ss-lh, 1.6);
    margin-top: var(--ccb-ug-ss-mt-desktop, 10px);
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    opacity: 0.9;
    font-weight: var(--ccb-ug-ss-fw, 400);
    letter-spacing: var(--ccb-ug-ss-ls, 0px);
    text-transform: var(--ccb-ug-ss-tt, none);
}

/* Overlay Title Layout */
.ccb-universal-card__overlay-title {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    width: 100%;
    /* Ensure text shadow for readability */
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    font-size: var(--ccb-ug-card-title, 1.2rem);
    font-weight: var(--ccb-ug-ct-fw, 700);
    letter-spacing: var(--ccb-ug-ct-ls, 0px);
    text-transform: var(--ccb-ug-ct-tt, none);
    pointer-events: none;
}

/* Icon Header Layout */
.ccb-universal-card__icon-overlay {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 2;
    background-color: #fff;
    border-radius: 9999px;
    padding: 10px;
    /* Default, overridden by styles if needed */
}

/* If the icon is a custom upload, remove the circular badge behind it. */
.ccb-universal-card__icon-overlay.ccb-universal-card__icon-overlay--plain {
    background-color: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
}

/* Content Background Handling */
/* Ensure full height flex behavior matches bg color */
.ccb-universal-card__content {
    background-color: var(--ccb-ug-content-bg, transparent);
    /* If transparent, falls back to card-bg on parent */
}

/* Adjustments for Overlay Title (remove padding top from content if needed?) */
.ccb-card-layout-overlay-title .ccb-universal-card__content {
    justify-content: space-between;
}

.ccb-card-layout-overlay-title-top .ccb-universal-card__content {
    justify-content: space-between;
}

/* --- Typography & Buttons (v110) --- */
.ccb-btn-full {
    display: block;
    width: 100%;
    margin-top: auto;
}

/* Ensure container allows full width button expansion if needed */
.cgb-btns-full .ccb-universal-card__button {
    text-align: center;
}

/* === Preset: Card (default) === */
.ccb-ug--preset-card .ccb-universal-card {
    box-shadow: var(--ccb-ug-shadow, var(--ccb-ug-shadow-computed));
}

.ccb-ug--preset-card .ccb-universal-card:hover {
    transform: translateY(-4px);
}

.ccb-ug--preset-card .ccb-universal-card__footer {
    padding-top: var(--ccb-ug-cc-pt-desktop, 24px);
    padding-right: var(--ccb-ug-cc-pr-desktop, 24px);
    padding-bottom: var(--ccb-ug-cc-pb-desktop, 24px);
    padding-left: var(--ccb-ug-cc-pl-desktop, 24px);
}

/* === Preset: Flat list === */
.ccb-ug--preset-flat-list .ccb-universal-card {
    box-shadow: var(--ccb-ug-flat-shadow, none);
    border: 1px solid rgba(0, 0, 0, 0.08);
    transform: none;
}

.ccb-ug--preset-flat-list .ccb-universal-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--ccb-ug-flat-shadow-hover, var(--ccb-ug-flat-shadow, none));
}

.ccb-ug--preset-flat-list .ccb-universal-card__content {
    padding-top: var(--ccb-ug-cc-pt-desktop, 24px);
    padding-right: var(--ccb-ug-cc-pr-desktop, 24px);
    padding-bottom: var(--ccb-ug-cc-pb-desktop, 24px);
    padding-left: var(--ccb-ug-cc-pl-desktop, 24px);
    background-color: var(--ccb-ug-content-bg, transparent);
    gap: 12px;
}

.ccb-ug--preset-flat-list .ccb-universal-card__title {
    margin-bottom: var(--ccb-ug-ct-mb-desktop, 12px);
}

.ccb-ug--preset-flat-list .ccb-universal-card__list {
    margin-top: var(--ccb-ug-cl-mt-desktop, 0px);
    margin-right: 0;
    margin-bottom: var(--ccb-ug-cl-mb-desktop, 20px);
    margin-left: 0;
    padding: 0;
    list-style: none;
}

.ccb-ug--preset-flat-list .ccb-universal-card__list li {
    padding-left: var(--ccb-ug-cl-indent-desktop, 24px);
    margin-bottom: 0;
    line-height: var(--ccb-ug-cl-lh-desktop, 1.5);
}

.ccb-ug--preset-flat-list .ccb-universal-card__list li + li {
    margin-top: var(--ccb-ug-cl-gap-desktop, 8px);
}

.ccb-ug--preset-flat-list .ccb-universal-card__list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--ccb-ug-accent, #0073aa);
    font-weight: bold;
}

.ccb-ug--preset-flat-list .ccb-universal-card__footer {
    padding: 0;
    background: var(--ccb-ug-accent, #0073aa);
}

.ccb-ug--preset-flat-list .ccb-universal-card__button {
    display: block;
    width: 100%;
    background: transparent;
    color: #fff;
    border: none;
    border-radius: 0 0 var(--ccb-ug-radius) var(--ccb-ug-radius);
    padding: 14px 16px;
    text-align: center;
}

.ccb-ug--preset-flat-list .ccb-universal-card__button.ccb-btn-outline,
.ccb-ug--preset-flat-list .ccb-universal-card__button.ccb-btn-link {
    color: #fff;
    border: none;
}

/* === Hide Description (per device) === */
.ccb-universal-card__content.ccb-ug-hide-desc-desktop {
    display: none;
}

.ccb-card-layout-overlay-title.ccb-universal-card--hide-desc {
    border: 1px solid white;
}

@media (min-width: 769px) and (max-width: 1024px) {
    .ccb-universal-card__content.ccb-ug-hide-desc-tablet {
        display: none;
    }
}

@media (max-width: 768px) {
    .ccb-universal-card__content.ccb-ug-hide-desc-mobile {
        display: none;
    }
}

/* === Rebuilt from faq.css === */
/* ===========================
   FAQ BLOCK (ccb/faq)
=========================== */

.ccb-faq {
    padding-top: var(--ccb-faq-pt-desktop, 64px);
    padding-bottom: var(--ccb-faq-pb-desktop, 64px);
    box-sizing: border-box;
    background: var(--ccb-faq-bg, transparent);
    border: none;
    outline: none;
    box-shadow: none;
}

/* Full width helper (FAQ loads its own CSS, so it can't rely on bundle.css) */
.ccb-faq.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.wp-block-ccb-faq.ccb-faq {
    width: 100%;
    border: none;
    outline: none;
    box-shadow: none;
}

.wp-block-ccb-faq.ccb-faq.cgb--fullwidth {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.wp-block-ccb-faq.ccb-faq:focus,
.ccb-faq:focus {
    border: none;
    outline: none;
    box-shadow: none;
}

.ccb-faq .cgb-inner {
    width: 100%;
    max-width: var(--cgb-inner-max-desktop, var(--cgb-inner-max, 1100px));
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}

.editor-styles-wrapper .wp-block-ccb-faq.ccb-faq .cgb-inner {
    max-width: var(--cgb-inner-max-desktop, var(--cgb-inner-max, 1100px));
    margin-left: auto;
    margin-right: auto;
}

.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-faq.ccb-faq .cgb-inner {
    max-width: var(--cgb-inner-max-desktop, var(--cgb-inner-max, 1100px));
    margin-left: auto;
    margin-right: auto;
}

.ccb-faq__header {
    text-align: var(--ccb-faq-align, left);
    margin-bottom: var(--ccb-faq-title-mb-desktop, 20px);
}

.ccb-faq .ccb-faq__title {
    font-size: var(--ccb-faq-title-fs-desktop, 32px);
    line-height: 1.2;
    margin: 0 0 var(--ccb-faq-title-mb-desktop, 20px);
    color: var(--ccb-faq-title-color, #0f172a);
}

.ccb-faq__intro {
    margin: 0;
    color: var(--ccb-faq-intro-color, #334155);
    font-size: 16px;
    line-height: 1.6;
}

.ccb-faq__items {
    display: flex;
    flex-direction: column;
    gap: var(--ccb-faq-item-gap-desktop, 16px);
}

.ccb-faq__item {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    transition: background-color var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease), border-color var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease);
}

.ccb-faq__question {
    margin: 0;
}

.ccb-faq__question-btn {
    width: 100%;
    text-align: left;
    padding: var(--ccb-faq-item-py-desktop, 20px) var(--ccb-faq-item-px-desktop, 20px);
    border: none;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
}

.ccb-faq__question-btn:focus-visible {
    outline: 2px solid var(--ccb-faq-icon-color, #5e17eb);
    outline-offset: 2px;
    border-radius: calc(var(--ccb-faq-radius, 12px) - 2px);
}

.ccb-faq__question-text {
    font-family: var(--cgb-font-head, 'Lato', sans-serif);
    font-size: var(--ccb-faq-question-fs-desktop, 18px);
    line-height: var(--ccb-faq-question-lh, 1.4);
    letter-spacing: var(--ccb-faq-question-ls, 0);
    font-weight: var(--ccb-faq-question-fw, 600);
    color: var(--ccb-faq-question-color, #111827);
}

.ccb-faq__icon {
    position: relative;
    width: clamp(16px, var(--ccb-faq-icon-size-desktop, 18px), 32px);
    height: clamp(16px, var(--ccb-faq-icon-size-desktop, 18px), 32px);
    flex-shrink: 0;
    color: var(--ccb-faq-icon-color, #ffffff);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease);
}

.ccb-faq__icon-shape {
    display: block;
    position: relative;
}

.ccb-faq__icon-shape--chevron::before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease);
}

.ccb-faq__icon-shape--plus {
    position: relative;
    width: 14px;
    height: 14px;
}

.ccb-faq__icon-shape--plus::before,
.ccb-faq__icon-shape--plus::after {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    background: currentColor;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.ccb-faq__icon-shape--plus::after {
    width: 2px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

.ccb-faq__item.is-open .ccb-faq__icon {
    transform: rotate(180deg);
}

/*
    Open-state icon behavior:
    - Chevron: rotate the whole icon container (single transform).
        Avoid also rotating the inner chevron, otherwise transforms cancel out.
    - Plus: hide the vertical stroke to become a minus.
*/

.ccb-faq__item.is-open .ccb-faq__icon--plus .ccb-faq__icon-shape--plus::after {
        opacity: 0;
}

.ccb-faq__answer {
    padding: 0 var(--ccb-faq-item-px-desktop, 20px);
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease), opacity var(--ccb-faq-transition-duration, 220ms) var(--ccb-faq-transition-easing, ease);
}

.ccb-faq__item.is-open .ccb-faq__answer {
    max-height: 1200px;
    opacity: 1;
    padding-top: var(--ccb-faq-answer-py-desktop, 20px);
    padding-bottom: var(--ccb-faq-answer-py-desktop, 20px);
}

.ccb-faq__answer-text {
    font-family: var(--cgb-font-body, 'Open Sans', sans-serif);
    font-size: var(--ccb-faq-answer-fs-desktop, 15px);
    line-height: var(--ccb-faq-answer-lh, 1.7);
    letter-spacing: var(--ccb-faq-answer-ls, 0);
    font-weight: var(--ccb-faq-answer-fw, 400);
    color: var(--ccb-faq-answer-color, #4b5563);
}

.ccb-faq__answer-text p {
    margin: 0 0 0.85em 0;
}

.ccb-faq__answer-text p:last-child {
    margin-bottom: 0;
}

.ccb-faq__answer-text ul,
.ccb-faq__answer-text ol {
    /* Ensure indentation even when theme/editor resets list styles */
    margin: 0.6em 0 0.85em;
    padding-left: 1.25em;
    list-style-position: outside;
}

.ccb-faq__answer-text li {
    margin: 0.35em 0;
}

.ccb-faq__item-actions,
.ccb-faq__schema-row-actions,
.ccb-faq__list-row-actions {
    display: flex;
    gap: 8px;
    padding: 12px 20px 16px;
}

.ccb-faq__list-manager {
    display: grid;
    gap: 16px;
}

.ccb-faq__list-row {
    border: 1px solid var(--ccb-faq-border-color, #e5e7eb);
    border-radius: 10px;
    padding: 12px;
    background: #fafafa;
}

.ccb-faq__add {
    margin-top: 20px;
}

.ccb-faq__schema-preview {
    background: #0b1021;
    color: #e2e8f0;
    border-radius: 10px;
    padding: 12px;
    margin-top: 12px;
}

.ccb-faq__schema-preview pre {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
}

.ccb-faq__schema-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
    color: #cbd5e1;
}

.ccb-faq__schema-status {
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: #1f2937;
}

.ccb-faq__schema-status.is-ok {
    color: #bbf7d0;
}

.ccb-faq__schema-status.has-warning {
    color: #fcd34d;
}

.ccb-faq__schema-toolbar {
    display: flex;
    gap: 10px;
    margin: 8px 0;
}

/* CARD PRESET */
.ccb-faq--preset-card .ccb-faq__item {
    background: var(--ccb-faq-item-bg, #ffffff);
    border: var(--ccb-faq-border-width, 1px) solid var(--ccb-faq-border-color, #e5e7eb);
    border-radius: var(--ccb-faq-radius, 12px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.ccb-faq--preset-card .ccb-faq__item.is-open {
    background: var(--ccb-faq-open-bg, var(--ccb-faq-active-bg, #f3f4f6));
    border-color: var(--ccb-faq-border-color, #e5e7eb);
}

.ccb-faq--preset-card .ccb-faq__question-btn:hover {
    background: var(--ccb-faq-hover-bg, #f8fafc);
}

/* NOVADE PRESET */
.ccb-faq--preset-novade .ccb-faq__header {
    text-align: center;
}

.ccb-faq--preset-novade .ccb-faq__title {
    margin-left: auto;
    margin-right: auto;
}

.ccb-faq--preset-novade .ccb-faq__items {
    gap: 0;
}

.ccb-faq--preset-novade .ccb-faq__item {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

.ccb-faq--preset-novade .ccb-faq__question {
    border-bottom: 1px solid var(--ccb-faq-separator, rgba(255, 255, 255, 0.25));
}

.ccb-faq--preset-novade .ccb-faq__item:last-child .ccb-faq__question {
    border-bottom: none;
}

.ccb-faq--preset-novade .ccb-faq__question-btn {
    padding: var(--ccb-faq-item-py-desktop, 20px) var(--ccb-faq-item-px-desktop, 20px);
    color: var(--ccb-faq-question-color, #ffffff);
    background: transparent;
}

.ccb-faq--preset-novade .ccb-faq__question-btn:hover {
    background: var(--ccb-faq-hover-bg, transparent);
}

.ccb-faq--preset-novade .ccb-faq__icon {
    color: var(--ccb-faq-icon-color, #ffffff);
}

.ccb-faq--preset-novade .ccb-faq__item.is-open .ccb-faq__icon-shape--plus::after {
    opacity: 0;
}

.ccb-faq--preset-novade .ccb-faq__answer {
    padding-left: var(--ccb-faq-item-px-desktop, 20px);
    padding-right: var(--ccb-faq-item-px-desktop, 20px);
    padding-top: var(--ccb-faq-answer-py-desktop, 20px);
    padding-bottom: var(--ccb-faq-answer-py-desktop, 20px);
}

.ccb-faq--preset-novade .ccb-faq__answer-text {
    color: var(--ccb-faq-answer-color, rgba(255, 255, 255, 0.88));
}

@media (max-width: 1024px) {
    .ccb-faq {
        padding-top: var(--ccb-faq-pt-tablet, var(--ccb-faq-pt-desktop, 48px));
        padding-bottom: var(--ccb-faq-pb-tablet, var(--ccb-faq-pb-desktop, 48px));
    }

    .ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max-desktop, 1100px));
    }

    .editor-styles-wrapper .wp-block-ccb-faq.ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max-desktop, 1100px));
    }

    .ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-faq.ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max-desktop, 1100px));
    }

    .ccb-faq .cgb-inner {
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 20px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 20px));
    }

    .ccb-faq__items {
        gap: var(--ccb-faq-item-gap-tablet, var(--ccb-faq-item-gap-desktop, 14px));
    }

    .ccb-faq .ccb-faq__title {
        font-size: var(--ccb-faq-title-fs-tablet, var(--ccb-faq-title-fs-desktop, 32px));
        margin-bottom: var(--ccb-faq-title-mb-tablet, var(--ccb-faq-title-mb-desktop, 18px));
    }

    .ccb-faq__question-text {
        font-size: var(--ccb-faq-question-fs-tablet, var(--ccb-faq-question-fs-desktop, 17px));
    }

    .ccb-faq__question-btn {
        padding: var(--ccb-faq-item-py-tablet, var(--ccb-faq-item-py-desktop, 20px)) var(--ccb-faq-item-px-tablet, var(--ccb-faq-item-px-desktop, 20px));
    }

    .ccb-faq__answer-text {
        font-size: var(--ccb-faq-answer-fs-tablet, var(--ccb-faq-answer-fs-desktop, 14px));
    }

    .ccb-faq__answer {
        padding-left: var(--ccb-faq-item-px-tablet, var(--ccb-faq-item-px-desktop, 20px));
        padding-right: var(--ccb-faq-item-px-tablet, var(--ccb-faq-item-px-desktop, 20px));
    }

    .ccb-faq__item.is-open .ccb-faq__answer {
        padding-top: var(--ccb-faq-answer-py-tablet, var(--ccb-faq-answer-py-desktop, 20px));
        padding-bottom: var(--ccb-faq-answer-py-tablet, var(--ccb-faq-answer-py-desktop, 20px));
    }

    .ccb-faq__icon {
        width: clamp(16px, var(--ccb-faq-icon-size-tablet, var(--ccb-faq-icon-size-desktop, 18px)), 32px);
        height: clamp(16px, var(--ccb-faq-icon-size-tablet, var(--ccb-faq-icon-size-desktop, 18px)), 32px);
    }
}

@media (max-width: 768px) {
    .ccb-faq {
        padding-top: var(--ccb-faq-pt-mobile, var(--ccb-faq-pt-tablet, 40px));
        padding-bottom: var(--ccb-faq-pb-mobile, var(--ccb-faq-pb-tablet, 40px));
    }

    .ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, 1100px));
    }

    .editor-styles-wrapper .wp-block-ccb-faq.ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, 1100px));
    }

    .ast-page-builder-template .entry-content[data-ast-blocks-layout] > .wp-block-ccb-faq.ccb-faq .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, 1100px));
    }

    .ccb-faq .cgb-inner {
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, 16px));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, 16px));
    }

    .ccb-faq__items {
        gap: var(--ccb-faq-item-gap-mobile, var(--ccb-faq-item-gap-tablet, 12px));
    }

    .ccb-faq .ccb-faq__title {
        font-size: var(--ccb-faq-title-fs-mobile, var(--ccb-faq-title-fs-tablet, 30px));
        margin-bottom: var(--ccb-faq-title-mb-mobile, var(--ccb-faq-title-mb-tablet, 16px));
    }

    .ccb-faq__question-btn {
        padding: var(--ccb-faq-item-py-mobile, var(--ccb-faq-item-py-tablet, 16px)) var(--ccb-faq-item-px-mobile, var(--ccb-faq-item-px-tablet, 16px));
    }

    .ccb-faq__question-text {
        font-size: var(--ccb-faq-question-fs-mobile, var(--ccb-faq-question-fs-tablet, 16px));
    }

    .ccb-faq__answer {
        padding-left: var(--ccb-faq-item-px-mobile, var(--ccb-faq-item-px-tablet, 16px));
        padding-right: var(--ccb-faq-item-px-mobile, var(--ccb-faq-item-px-tablet, 16px));
    }

    .ccb-faq__item.is-open .ccb-faq__answer {
        padding-top: var(--ccb-faq-answer-py-mobile, var(--ccb-faq-answer-py-tablet, 20px));
        padding-bottom: var(--ccb-faq-answer-py-mobile, var(--ccb-faq-answer-py-tablet, 20px));
    }

    .ccb-faq__answer-text {
        font-size: var(--ccb-faq-answer-fs-mobile, var(--ccb-faq-answer-fs-tablet, 14px));
    }

    .ccb-faq__icon {
        width: clamp(16px, var(--ccb-faq-icon-size-mobile, var(--ccb-faq-icon-size-tablet, 18px)), 32px);
        height: clamp(16px, var(--ccb-faq-icon-size-mobile, var(--ccb-faq-icon-size-tablet, 18px)), 32px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ccb-faq__icon,
    .ccb-faq__icon-shape--chevron::before,
    .ccb-faq__answer {
        transition: none;
    }
}
/* CGB bundle additions: missing standalone block styles */

/* author.css */
/* -------------------------------------------------------------------------- */
/* Block: Author                                                              */
/* -------------------------------------------------------------------------- */

.ccb-author{
  margin-top:var(--ccb-author-mt, var(--ccb-author-mt-desktop, 30px));
  margin-bottom:var(--ccb-author-mb, var(--ccb-author-mb-desktop, 30px));
}

.ccb-author__inner{
  width:100%;
  max-width:var(--ccb-author-maxw, var(--ccb-author-maxw-desktop, 900px));
  margin-left:auto;
  margin-right:auto;
}

.ccb-author__card{
  display:flex;
  gap:var(--ccb-author-gap, var(--ccb-author-gap-desktop, 18px));
  align-items:flex-start;
  padding:var(--ccb-author-pad-y, var(--ccb-author-pad-y-desktop, 22px)) var(--ccb-author-pad-x, var(--ccb-author-pad-x-desktop, 22px));
  border-radius:calc(var(--ccb-author-r, 12) * 1px);
  border:calc(var(--ccb-author-bw, 1) * 1px) solid var(--ccb-author-bc, rgba(0,0,0,0.12));
  background:var(--ccb-author-bg, transparent);
  text-align:var(--ccb-author-ta, left);
}

.ccb-author--avatar-top .ccb-author__card{
  flex-direction:column;
  align-items:flex-start;
}

.ccb-author__avatar{
  flex:0 0 auto;
  width:var(--ccb-author-avatar, var(--ccb-author-avatar-desktop, 84px));
}

.ccb-author__avatar-img{
  width:var(--ccb-author-avatar, var(--ccb-author-avatar-desktop, 84px));
  height:var(--ccb-author-avatar, var(--ccb-author-avatar-desktop, 84px));
  object-fit:cover;
  border-radius:999px;
  display:block;
}

.ccb-author__content{
  flex:1 1 auto;
  min-width:0;
}

.ccb-author__heading{
  margin:0 0 10px;
  font-weight:700;
  font-size:var(--ccb-author-fs-heading, var(--ccb-author-fs-heading-desktop, 16px));
  color:var(--ccb-author-heading-c, inherit);
}

.ccb-author__name{
  margin:0;
  font-weight:800;
  font-size:var(--ccb-author-fs-name, var(--ccb-author-fs-name-desktop, 20px));
  line-height:1.2;
  color:var(--ccb-author-name-c, inherit);
}

.ccb-author__meta{
  margin:6px 0 0;
  font-weight:600;
  font-size:var(--ccb-author-fs-meta, var(--ccb-author-fs-meta-desktop, 14px));
  line-height:1.35;
  color:var(--ccb-author-meta-c, inherit);
  opacity:0.9;
}

.ccb-author__bio{
  font-style:italic;
  margin:12px 0 0;
  font-size:var(--ccb-author-fs-bio, var(--ccb-author-fs-bio-desktop, 15px));
  line-height:1.6;
  color:var(--ccb-author-bio-c, inherit);
}

.ccb-author__bio > :first-child{ margin-top:0; }
.ccb-author__bio > :last-child{ margin-bottom:0; }

.ccb-author__actions{
  margin-top:14px;
}

.ccb-author__link{
  color:var(--ccb-author-link-c, inherit);
  text-decoration:underline;
  font-weight:700;
  font-size:var(--ccb-author-fs-link, var(--ccb-author-fs-link-desktop, 14px));
}

.ccb-author__link:hover,
.ccb-author__link:focus{
  text-decoration:none;
}

/* Responsive vars */
@media (max-width: 900px){
  .ccb-author{
    margin-top:var(--ccb-author-mt, var(--ccb-author-mt-tablet, var(--ccb-author-mt-desktop, 30px)));
    margin-bottom:var(--ccb-author-mb, var(--ccb-author-mb-tablet, var(--ccb-author-mb-desktop, 30px)));
  }

  .ccb-author__inner{ max-width:var(--ccb-author-maxw, var(--ccb-author-maxw-tablet, var(--ccb-author-maxw-desktop, 900px))); }
  .ccb-author__card{
    gap:var(--ccb-author-gap, var(--ccb-author-gap-tablet, var(--ccb-author-gap-desktop, 18px)));
    padding:var(--ccb-author-pad-y, var(--ccb-author-pad-y-tablet, var(--ccb-author-pad-y-desktop, 22px))) var(--ccb-author-pad-x, var(--ccb-author-pad-x-tablet, var(--ccb-author-pad-x-desktop, 22px)));
  }
  .ccb-author__avatar,
  .ccb-author__avatar-img{
    width:var(--ccb-author-avatar, var(--ccb-author-avatar-tablet, var(--ccb-author-avatar-desktop, 84px)));
    height:var(--ccb-author-avatar, var(--ccb-author-avatar-tablet, var(--ccb-author-avatar-desktop, 84px)));
  }

  .ccb-author__heading{ font-size:var(--ccb-author-fs-heading, var(--ccb-author-fs-heading-tablet, var(--ccb-author-fs-heading-desktop, 16px))); }
  .ccb-author__name{ font-size:var(--ccb-author-fs-name, var(--ccb-author-fs-name-tablet, var(--ccb-author-fs-name-desktop, 20px))); }
  .ccb-author__meta{ font-size:var(--ccb-author-fs-meta, var(--ccb-author-fs-meta-tablet, var(--ccb-author-fs-meta-desktop, 14px))); }
  .ccb-author__bio{
  font-style:italic; font-size:var(--ccb-author-fs-bio, var(--ccb-author-fs-bio-tablet, var(--ccb-author-fs-bio-desktop, 15px))); }
  .ccb-author__link{ font-size:var(--ccb-author-fs-link, var(--ccb-author-fs-link-tablet, var(--ccb-author-fs-link-desktop, 14px))); }
}

@media (max-width: 600px){
  .ccb-author{
    margin-top:var(--ccb-author-mt, var(--ccb-author-mt-mobile, var(--ccb-author-mt-desktop, 30px)));
    margin-bottom:var(--ccb-author-mb, var(--ccb-author-mb-mobile, var(--ccb-author-mb-desktop, 30px)));
  }

  .ccb-author__inner{ max-width:var(--ccb-author-maxw, var(--ccb-author-maxw-mobile, var(--ccb-author-maxw-desktop, 900px))); }
  .ccb-author__card{
    gap:var(--ccb-author-gap, var(--ccb-author-gap-mobile, var(--ccb-author-gap-desktop, 18px)));
    padding:var(--ccb-author-pad-y, var(--ccb-author-pad-y-mobile, var(--ccb-author-pad-y-desktop, 22px))) var(--ccb-author-pad-x, var(--ccb-author-pad-x-mobile, var(--ccb-author-pad-x-desktop, 22px)));
  }
  .ccb-author__avatar,
  .ccb-author__avatar-img{
    width:var(--ccb-author-avatar, var(--ccb-author-avatar-mobile, var(--ccb-author-avatar-desktop, 84px)));
    height:var(--ccb-author-avatar, var(--ccb-author-avatar-mobile, var(--ccb-author-avatar-desktop, 84px)));
  }

  .ccb-author__heading{ font-size:var(--ccb-author-fs-heading, var(--ccb-author-fs-heading-mobile, var(--ccb-author-fs-heading-desktop, 16px))); }
  .ccb-author__name{ font-size:var(--ccb-author-fs-name, var(--ccb-author-fs-name-mobile, var(--ccb-author-fs-name-desktop, 20px))); }
  .ccb-author__meta{ font-size:var(--ccb-author-fs-meta, var(--ccb-author-fs-meta-mobile, var(--ccb-author-fs-meta-desktop, 14px))); }
  .ccb-author__bio{
  font-style:italic; font-size:var(--ccb-author-fs-bio, var(--ccb-author-fs-bio-mobile, var(--ccb-author-fs-bio-desktop, 15px))); }
  .ccb-author__link{ font-size:var(--ccb-author-fs-link, var(--ccb-author-fs-link-mobile, var(--ccb-author-fs-link-desktop, 14px))); }
}

/* featured-post.css */
/* ═══════════════════════════════════════════════════════════
   Block: ccb/featured-post
   Horizontal featured post card — enterprise layout.
   ═══════════════════════════════════════════════════════════ */

.ccb-featured-post {
    background: var(--ccb-fp-bg, #ffffff);
    padding-top: var(--ccb-fp-pt, 48px);
    padding-bottom: var(--ccb-fp-pb, 48px);
}

.ccb-featured-post .cgb-inner {
    max-width: var(--ccb-fp-max-w, 1200px);
    margin: 0 auto;
    padding: 0 24px;
}

/* ── Section header ── */
.ccb-featured-post__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 20px;
}

.ccb-featured-post__section-title {
    font-size: 28px;
    font-weight: 800;
    color: var(--ccb-fp-title-color, #0F172A);
    margin: 0;
    line-height: 1.2;
}

.ccb-featured-post__view-all {
    font-size: 14px;
    font-weight: 600;
    color: var(--ccb-fp-cta-color, #5182BB);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.ccb-featured-post__view-all:hover {
    text-decoration: underline;
}

/* ── Card ── */
.ccb-featured-post__card {
    display: grid;
    grid-template-columns: 55% 1fr;
    background: var(--ccb-fp-card-bg, #ffffff);
    border: 1px solid var(--cgb-border, #E6E6E6);
    border-radius: var(--ccb-fp-radius, 3px);
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ccb-featured-post__card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
}

/* ── Image ── */
.ccb-featured-post__image {
    display: block;
    overflow: hidden;
    position: relative;
}

.ccb-featured-post__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.ccb-featured-post__card:hover .ccb-featured-post__img {
    transform: scale(1.03);
}

/* ── Body ── */
.ccb-featured-post__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 36px 36px 36px 32px;
}

/* ── Badge ── */
.ccb-featured-post__badge {
    display: inline-block;
    align-self: flex-start;
    background: var(--ccb-fp-badge-bg, #81BF48);
    color: var(--ccb-fp-badge-color, #ffffff);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 4px 12px;
    border-radius: 3px;
    margin-bottom: 16px;
    text-transform: uppercase;
}

/* ── Title ── */
.ccb-featured-post__title {
    font-size: var(--ccb-fp-title-fs, 28px);
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 12px 0;
    color: var(--ccb-fp-title-color, #0F172A);
}

.ccb-featured-post__title a {
    color: inherit;
    text-decoration: none;
}

.ccb-featured-post__title a:hover {
    color: var(--ccb-fp-cta-color, #5182BB);
}

/* ── Meta ── */
.ccb-featured-post__meta {
    font-size: 13px;
    color: var(--ccb-fp-meta-color, #8D8D8D);
    margin-bottom: 16px;
}

/* ── Excerpt ── */
.ccb-featured-post__excerpt {
    font-size: var(--ccb-fp-excerpt-fs, 15px);
    line-height: 1.65;
    color: var(--ccb-fp-excerpt-color, #4a4a4a);
    margin: 0 0 24px 0;
}

/* ── CTA link ── */
.ccb-featured-post__cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 700;
    color: var(--cgb-novade-green, #81BF48);
    text-decoration: none;
    transition: gap 0.2s ease, color 0.2s ease;
}

.ccb-featured-post__cta:hover {
    color: var(--cgb-novade-green-dark, #6FA53B);
    gap: 10px;
}

.ccb-featured-post__cta svg {
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.ccb-featured-post__cta:hover svg {
    transform: translateX(2px);
}

/* ── Fullwidth ── */
.ccb-featured-post--fullwidth {
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

/* ═══════════════ Responsive ═══════════════ */

@media (max-width: 991px) {
    .ccb-featured-post__card {
        grid-template-columns: 50% 1fr;
    }

    .ccb-featured-post__body {
        padding: 28px 28px 28px 24px;
    }

    .ccb-featured-post__title {
        font-size: 22px;
    }
}

@media (max-width: 767px) {
    .ccb-featured-post__card {
        grid-template-columns: 1fr;
    }

    .ccb-featured-post__image {
        aspect-ratio: 16 / 9;
    }

    .ccb-featured-post__body {
        padding: 24px;
    }

    .ccb-featured-post__title {
        font-size: 20px;
    }

    .ccb-featured-post__excerpt {
        font-size: 14px;
    }

    .ccb-featured-post .cgb-inner {
        padding: 0 16px;
    }
}

/* post-slideshow.css */
/**
 * Block: ccb/post-slideshow — Frontend CSS
 * Full-viewport slideshow with glassmorphism card carousel.
 */

/* ═══════════════════════════════════════════════════════
   ROOT CONTAINER
   ═══════════════════════════════════════════════════════ */
.ccb-dslide {
	position: relative;
	display: grid;
	overflow: clip;
	min-height: var(--ccb-dslide-min-h-d, 600px);
	background: #5182bb;
	color: #fff;
}

/* ═══════════════════════════════════════════════════════
   SLIDE (stacked via grid)
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__slide {
	grid-area: 1 / 1;
	position: relative;
	display: flex;
	align-items: center;
	min-height: var(--ccb-dslide-min-h-d, 600px);
	opacity: 0;
	visibility: hidden;
	transition: opacity 1.4s cubic-bezier(.4, 0, .2, 1),
	            visibility 1.4s;
	z-index: 0;
}

.ccb-dslide__slide--active {
	opacity: 1;
	visibility: visible;
	z-index: 1;
}

.ccb-dslide__slide--active,
.ccb-dslide__slide--leaving {
	will-change: opacity;
}

/* ── Background image ── */
.ccb-dslide__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: 0;
	transform: scale(1);
	transition: transform 10s cubic-bezier(.25, 0, .15, 1);
}

.ccb-dslide__slide--active .ccb-dslide__bg {
	transform: scale(1.04);
	will-change: transform;
}

.ccb-dslide__bg--fallback {
	background: linear-gradient(135deg, #3a6a9e, #5182bb);
}

/* ── Overlay ── */
.ccb-dslide__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* ═══════════════════════════════════════════════════════
   LEFT CONTENT (per slide)
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__content {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding: 60px 60px 100px;
	max-width: 600px;
	width: 50%;

	transform: translateY(24px);
	opacity: 0;
	transition: transform .9s .4s cubic-bezier(.19, 1, .22, 1),
	            opacity .9s .4s cubic-bezier(.19, 1, .22, 1);
}

.ccb-dslide__slide--active .ccb-dslide__content {
	transform: translateY(0);
	opacity: 1;
}

/* ── Category badge ── */
.ccb-dslide__cat {
	display: inline-block;
	padding: 6px 18px;
	background: rgba(255, 255, 255, .15);
	color: #fff;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-radius: 20px;
	border: 1px solid rgba(255,255,255,.18);
}

/* ── Title ── */
.ccb-dslide__title {
	font-family: 'Lato', 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: var(--ccb-dslide-heading-fs-d, 36px);
	line-height: 1.1;
	margin: 0;
	color: #fff;
	text-shadow: 0 2px 16px rgba(0,0,0,.35);
}

/* ── Excerpt ── */
.ccb-dslide__excerpt {
	font-size: var(--ccb-dslide-excerpt-fs-d, 15px);
	line-height: 1.7;
	color: rgba(255,255,255,.85);
	margin: 0;
	max-width: 460px;
	text-shadow: 0 1px 4px rgba(0,0,0,.2);
}

/* ── CTA Button ── */
.ccb-dslide__cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 28px;
	font-size: var(--ccb-dslide-cta-fs-d, 14px);
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: 0px 12px 18px -6px rgba(0,0,0,0.3);
	transition: opacity .3s ease, transform .3s ease;
}

.ccb-dslide__cta:hover {
	opacity: .88;
	transform: translateY(-2px);
}

.ccb-dslide__cta svg {
	transition: transform .3s ease;
}

.ccb-dslide__cta:hover svg {
	transform: translateX(4px);
}

/* ═══════════════════════════════════════════════════════
   BOTTOM PROGRESS BAR
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__bar {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: rgba(255,255,255,.12);
	z-index: 10;
}

.ccb-dslide__bar-fill {
	height: 100%;
	width: 0%;
	background: var(--ccb-dslide-accent, #80bf4b);
}

/* ═══════════════════════════════════════════════════════
   CARD CAROUSEL (right side)
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__cards {
	grid-area: 1 / 1;
	position: relative;
	z-index: 3;
	align-self: center;
	justify-self: end;
	margin-right: 48px;
	pointer-events: auto;
	max-width: 55%;
	overflow: hidden;
}

.ccb-dslide__cards-track {
	display: flex;
	transition: transform 1.4s cubic-bezier(.4, 0, .2, 1);
	will-change: transform;
}

.ccb-dslide__card {
	flex: 0 0 220px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 12px;
	margin-right: 16px;
	background: var(--ccb-dslide-card-bg, rgba(255, 255, 255, .12));
	border: 1px solid rgba(255,255,255,.18);
	border-radius: 16px;
	cursor: pointer;
	color: #fff;
	text-align: left;
	font-family: inherit;
	contain: layout style;
	transition: background .35s ease,
	            border-color .35s ease,
	            transform .35s cubic-bezier(.19, 1, .22, 1),
	            box-shadow .35s ease,
	            opacity 1.4s ease-in-out;
}

.ccb-dslide__card--leaving {
	opacity: 0;
	pointer-events: none;
}

.ccb-dslide__card:hover {
	background: rgba(255, 255, 255, .2);
	border-color: rgba(255,255,255,.35);
	transform: translateY(-3px);
}

.ccb-dslide__card--active {
	background: rgba(255, 255, 255, .18);
	border-color: var(--ccb-dslide-accent, #80bf4b);
	box-shadow: 0 0 0 1px var(--ccb-dslide-accent, #80bf4b);
}

/* Card image */
.ccb-dslide__card-img-wrap {
	width: 100%;
	aspect-ratio: 16 / 10;
	border-radius: 10px;
	overflow: hidden;
}

.ccb-dslide__card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

.ccb-dslide__card:hover .ccb-dslide__card-img {
	transform: scale(1.06);
}

.ccb-dslide__card-placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(255,255,255,.1), rgba(255,255,255,.05));
}

/* Card text */
.ccb-dslide__card-cat {
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: rgba(255,255,255,.6);
	line-height: 1;
}

.ccb-dslide__card-name {
	font-family: 'Lato', 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: .9rem;
	font-weight: 700;
	line-height: 1.3;
	color: #fff;
}

/* ═══════════════════════════════════════════════════════
   BOTTOM NAVIGATION
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__nav {
	grid-area: 1 / 1;
	position: relative;
	z-index: 4;
	align-self: end;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 60px 40px;
	pointer-events: none;
}

.ccb-dslide__arrows {
	display: flex;
	gap: 12px;
	pointer-events: auto;
}

.ccb-dslide__arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	border: 1.5px solid rgba(255,255,255,.3);
	background: rgba(0,0,0,.35);
	color: #fff;
	cursor: pointer;
	transition: background .3s, border-color .3s, transform .3s;
}

.ccb-dslide__arrow:hover {
	background: rgba(255,255,255,.15);
	border-color: rgba(255,255,255,.6);
}

.ccb-dslide__arrow:active {
	transform: scale(.9);
}

/* ── Slide counter ── */
.ccb-dslide__slide-counter {
	pointer-events: auto;
}

.ccb-dslide__slide-current {
	font-size: 2.5rem;
	font-weight: 800;
	font-family: 'Lato', 'Open Sans', Helvetica, Arial, sans-serif;
	color: rgba(255,255,255,.25);
	letter-spacing: 2px;
	line-height: 1;
}

/* ═══════════════════════════════════════════════════════
   DOTS (mobile only)
   ═══════════════════════════════════════════════════════ */
.ccb-dslide__dots {
	display: none;
	justify-content: center;
	align-items: center;
	gap: 10px;
	position: absolute;
	bottom: 90px;
	left: 0;
	right: 0;
	z-index: 10;
	pointer-events: auto;
}

.ccb-dslide__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba(255,255,255,.35);
	border: none;
	padding: 0;
	position: relative;
	cursor: pointer;
	transition: background .4s ease, transform .4s ease, box-shadow .4s ease;
	-webkit-tap-highlight-color: transparent;
}

.ccb-dslide__dot::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 48px;
	height: 48px;
	transform: translate(-50%, -50%);
}

.ccb-dslide__dot--active {
	background: var(--ccb-dslide-accent, #80bf4b);
	transform: scale(1.35);
	box-shadow: 0 0 0 3px rgba(128, 191, 75, .3);
}

.ccb-dslide__dot:hover {
	background: rgba(255,255,255,.6);
}

.ccb-dslide__dot--active:hover {
	background: var(--ccb-dslide-accent, #80bf4b);
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤ 1024px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
	.ccb-dslide { min-height: var(--ccb-dslide-min-h-t, var(--ccb-dslide-min-h-d, 600px)); }
	.ccb-dslide__slide { min-height: var(--ccb-dslide-min-h-t, var(--ccb-dslide-min-h-d, 600px)); }

	.ccb-dslide__title { font-size: var(--ccb-dslide-heading-fs-t, var(--ccb-dslide-heading-fs-d)); }
	.ccb-dslide__excerpt { font-size: var(--ccb-dslide-excerpt-fs-t, var(--ccb-dslide-excerpt-fs-d)); }
	.ccb-dslide__cta { font-size: var(--ccb-dslide-cta-fs-t, var(--ccb-dslide-cta-fs-d)); }

	.ccb-dslide__content {
		padding: 50px 40px 80px;
		width: 55%;
		max-width: 500px;
	}

	.ccb-dslide__cards {
		margin-right: 30px;
		max-width: 50%;
	}

	.ccb-dslide__card { flex: 0 0 190px; }

	.ccb-dslide__nav { padding: 0 40px 30px; }

	.ccb-dslide__arrow { width: 42px; height: 42px; }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤ 768px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {
	.ccb-dslide {
		min-height: var(--ccb-dslide-min-h-m, 80svh);
	}
	.ccb-dslide__slide {
		min-height: var(--ccb-dslide-min-h-m, 80svh);
		align-items: center;
		justify-content: center;
	}

	.ccb-dslide__title { font-size: var(--ccb-dslide-heading-fs-m, clamp(1.4rem, 5vw, 2rem)); }
	.ccb-dslide__excerpt { font-size: var(--ccb-dslide-excerpt-fs-m, .9rem); }
	.ccb-dslide__cta { font-size: var(--ccb-dslide-cta-fs-m, .78rem); padding: 12px 22px; }

	.ccb-dslide__cards {
		display: none !important;
	}

	.ccb-dslide__dots {
		display: flex;
		bottom: 60px;
	}

	.ccb-dslide__content {
		width: 100%;
		max-width: 100%;
		padding: 60px 20px 100px;
		align-items: center;
		text-align: center;
		gap: 14px;
	}

	.ccb-dslide__title {
		text-align: center;
	}

	.ccb-dslide__excerpt {
		text-align: center;
		max-width: 340px;
	}

	.ccb-dslide__nav {
		padding: 0 16px 14px;
	}

	.ccb-dslide__arrows { gap: 8px; }
	.ccb-dslide__arrow { width: 38px; height: 38px; }
	.ccb-dslide__slide-current { font-size: 1.6rem; }
	.ccb-dslide__cat { font-size: .65rem; padding: 4px 14px; }
}

/* report-generation.css */
/* Report Generation (Aggregate data & automate report generation) */

.ccb-report-generation {
    --ccb-rg-container-max: var(--ccb-rg-container-max-desktop, 1200px);
    --ccb-rg-pt: var(--ccb-rg-pt-desktop, 60px);
    --ccb-rg-pb: var(--ccb-rg-pb-desktop, 60px);
    --ccb-rg-px: var(--ccb-rg-px-desktop, 24px);

    --ccb-rg-header-gap: var(--ccb-rg-header-gap-desktop, 10px);
    --ccb-rg-header-mb: var(--ccb-rg-header-mb-desktop, 40px);

    --ccb-rg-title-fs: var(--ccb-rg-title-fs-desktop, 40px);
    --ccb-rg-subtitle-fs: var(--ccb-rg-subtitle-fs-desktop, 18px);

    --ccb-rg-flow-gap: var(--ccb-rg-flow-gap-desktop, 28px);
    --ccb-rg-card-w: var(--ccb-rg-card-w-desktop, 360px);
    --ccb-rg-card-radius: var(--ccb-rg-card-radius-desktop, 6px);

    --ccb-rg-card-shadow-blur: var(--ccb-rg-card-shadow-blur-desktop, 24px);
    --ccb-rg-card-shadow-opacity: var(--ccb-rg-card-shadow-opacity-desktop, 0.18);

    --ccb-rg-card-pad-y: var(--ccb-rg-card-pad-y-desktop, 26px);
    --ccb-rg-card-pad-x: var(--ccb-rg-card-pad-x-desktop, 26px);

    --ccb-rg-card-head-fs: var(--ccb-rg-card-head-fs-desktop, 16px);

    --ccb-rg-list-fs: var(--ccb-rg-list-fs-desktop, 18px);
    --ccb-rg-list-gap: var(--ccb-rg-list-gap-desktop, 18px);
    --ccb-rg-list-icon: var(--ccb-rg-list-icon-desktop, 28px);

    --ccb-rg-mid-icon: var(--ccb-rg-mid-icon-desktop, 70px);
    --ccb-rg-mid-gap: var(--ccb-rg-mid-gap-desktop, 22px);
    --ccb-rg-mid-footer-fs: var(--ccb-rg-mid-footer-fs-desktop, 18px);

    --ccb-rg-right-icon: var(--ccb-rg-right-icon-desktop, 70px);
    --ccb-rg-right-row-gap: var(--ccb-rg-right-row-gap-desktop, 26px);
    --ccb-rg-right-label-fs: var(--ccb-rg-right-label-fs-desktop, 18px);

    --ccb-rg-arrow-size: var(--ccb-rg-arrow-size-desktop, 46px);

    /* Non-responsive style vars (can be overridden via inline style vars) */
    --ccb-rg-bg: var(--ccb-rg-bg-color, transparent);
    --ccb-rg-title-color: var(--ccb-rg-title-color, #3b82f6);
    --ccb-rg-subtitle-color: var(--ccb-rg-subtitle-color, #111827);

    --ccb-rg-card-bg: var(--ccb-rg-card-bg, #ffffff);
    --ccb-rg-card-border: var(--ccb-rg-card-border, rgba(17, 24, 39, 0.08));

    --ccb-rg-card-head-bg: var(--ccb-rg-card-head-bg, #4f7fb8);
    --ccb-rg-card-head-color: var(--ccb-rg-card-head-color, #ffffff);

    --ccb-rg-arrow-color: var(--ccb-rg-arrow-color, #5b8fcb);

    --ccb-rg-left-icon-color: var(--ccb-rg-left-icon-color, #7bc043);
    --ccb-rg-mid-icon-color: var(--ccb-rg-mid-icon-color, #7bc043);
    --ccb-rg-right-doc-color: var(--ccb-rg-right-doc-color, #7bc043);
    --ccb-rg-right-person-color: var(--ccb-rg-right-person-color, #5b8fcb);

    background: var(--ccb-rg-bg);
    padding: var(--ccb-rg-pt) var(--ccb-rg-px) var(--ccb-rg-pb);
}

.ccb-report-generation__inner {
    max-width: var(--ccb-rg-container-max);
    margin: 0 auto;
}

.ccb-report-generation__header {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: var(--ccb-rg-header-gap);
    margin-bottom: var(--ccb-rg-header-mb);
}

.ccb-report-generation__title {
    margin: 0;
    color: var(--ccb-rg-title-color);
    font-size: var(--ccb-rg-title-fs);
    font-weight: 700;
    line-height: 1.15;
}

.ccb-report-generation__subtitle {
    margin: 0;
    color: var(--ccb-rg-subtitle-color);
    font-size: var(--ccb-rg-subtitle-fs);
    font-weight: 400;
    line-height: 1.35;
}

.ccb-report-generation__flow {
    display: grid;
    grid-template-columns: minmax(0, var(--ccb-rg-card-w)) minmax(0, var(--ccb-rg-arrow-size)) minmax(0, var(--ccb-rg-card-w)) minmax(0, var(--ccb-rg-arrow-size)) minmax(0, var(--ccb-rg-card-w));
    gap: var(--ccb-rg-flow-gap);
    align-items: stretch;
    justify-content: center;
}

.ccb-report-generation__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ccb-rg-arrow-color);
}

.ccb-report-generation__arrow svg {
    width: var(--ccb-rg-arrow-size);
    height: var(--ccb-rg-arrow-size);
    display: block;
}

.ccb-report-generation__card {
    background: var(--ccb-rg-card-bg);
    border: 1px solid var(--ccb-rg-card-border);
    border-radius: var(--ccb-rg-card-radius);
    overflow: hidden;
    box-shadow: 0 12px var(--ccb-rg-card-shadow-blur) rgba(0, 0, 0, var(--ccb-rg-card-shadow-opacity));
}

.ccb-report-generation__card-head {
    background: var(--ccb-rg-card-head-bg);
    color: var(--ccb-rg-card-head-color);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 700;
    font-size: var(--ccb-rg-card-head-fs);
    padding: 18px 22px;
    text-align: center;
}

.ccb-report-generation__card-body {
    padding: var(--ccb-rg-card-pad-y) var(--ccb-rg-card-pad-x);
}

/* Left card list */
.ccb-report-generation__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--ccb-rg-list-gap);
}

.ccb-report-generation__list-item {
    display: grid;
    grid-template-columns: var(--ccb-rg-list-icon) 1fr;
    gap: 16px;
    align-items: center;
}

.ccb-report-generation__list-icon {
    width: var(--ccb-rg-list-icon);
    height: var(--ccb-rg-list-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ccb-rg-left-icon-color);
}

/* MediaUpload renders buttons in editor; reset only those */
button.ccb-report-generation__list-icon,
button.ccb-report-generation__mid-icon-button,
button.ccb-report-generation__row-icon {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    cursor: pointer;
    line-height: 0;
}

button.ccb-report-generation__list-icon:hover,
button.ccb-report-generation__mid-icon-button:hover,
button.ccb-report-generation__row-icon:hover {
    opacity: 0.9;
}

.ccb-report-generation__list-icon svg,
.ccb-report-generation__list-icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.ccb-report-generation__list-text {
    font-size: var(--ccb-rg-list-fs);
    font-weight: 700;
    color: var(--ccb-rg-body-text-color, #111827);
    line-height: 1.25;
}

/* Middle card */
.ccb-report-generation__mid-icons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ccb-rg-mid-gap);
    justify-items: center;
    align-items: center;
    margin-bottom: 22px;
}

.ccb-report-generation__mid-icon {
    width: var(--ccb-rg-mid-icon);
    height: var(--ccb-rg-mid-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ccb-rg-mid-icon-color);
}

.ccb-report-generation__mid-icon-button {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ccb-report-generation__mid-icon svg,
.ccb-report-generation__mid-icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.ccb-report-generation__mid-footer {
    text-align: center;
    font-size: var(--ccb-rg-mid-footer-fs);
    font-weight: 700;
    color: var(--ccb-rg-body-text-color, #111827);
    margin: 0;
}

/* Right card */
.ccb-report-generation__rows {
    display: flex;
    flex-direction: column;
    gap: var(--ccb-rg-right-row-gap);
}

.ccb-report-generation__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 14px;
}

.ccb-report-generation__row-icons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

.ccb-report-generation__row-icon {
    width: var(--ccb-rg-right-icon);
    height: var(--ccb-rg-right-icon);
    display: flex;
    align-items: center;
    justify-content: center;
}

.ccb-report-generation__row-icon svg,
.ccb-report-generation__row-icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.ccb-report-generation__row-icon--doc {
    color: var(--ccb-rg-right-doc-color);
}

.ccb-report-generation__row-icon--person {
    color: var(--ccb-rg-right-person-color);
}

.ccb-report-generation__row-label {
    text-align: center;
    font-size: var(--ccb-rg-right-label-fs);
    font-weight: 700;
    color: var(--ccb-rg-body-text-color, #111827);
    margin: 0;
}

/* Editor preview device switching */
.ccb-report-generation[data-preview-device="tablet"] {
    --ccb-rg-container-max: var(--ccb-rg-container-max-tablet, var(--ccb-rg-container-max-desktop, 1200px));
    --ccb-rg-pt: var(--ccb-rg-pt-tablet, var(--ccb-rg-pt-desktop, 60px));
    --ccb-rg-pb: var(--ccb-rg-pb-tablet, var(--ccb-rg-pb-desktop, 60px));
    --ccb-rg-px: var(--ccb-rg-px-tablet, var(--ccb-rg-px-desktop, 24px));

    --ccb-rg-header-gap: var(--ccb-rg-header-gap-tablet, var(--ccb-rg-header-gap-desktop, 10px));
    --ccb-rg-header-mb: var(--ccb-rg-header-mb-tablet, var(--ccb-rg-header-mb-desktop, 40px));

    --ccb-rg-title-fs: var(--ccb-rg-title-fs-tablet, var(--ccb-rg-title-fs-desktop, 40px));
    --ccb-rg-subtitle-fs: var(--ccb-rg-subtitle-fs-tablet, var(--ccb-rg-subtitle-fs-desktop, 18px));

    --ccb-rg-flow-gap: var(--ccb-rg-flow-gap-tablet, var(--ccb-rg-flow-gap-desktop, 28px));
    --ccb-rg-card-w: var(--ccb-rg-card-w-tablet, var(--ccb-rg-card-w-desktop, 360px));
    --ccb-rg-card-radius: var(--ccb-rg-card-radius-tablet, var(--ccb-rg-card-radius-desktop, 6px));

    --ccb-rg-card-shadow-blur: var(--ccb-rg-card-shadow-blur-tablet, var(--ccb-rg-card-shadow-blur-desktop, 24px));
    --ccb-rg-card-shadow-opacity: var(--ccb-rg-card-shadow-opacity-tablet, var(--ccb-rg-card-shadow-opacity-desktop, 0.18));

    --ccb-rg-card-pad-y: var(--ccb-rg-card-pad-y-tablet, var(--ccb-rg-card-pad-y-desktop, 26px));
    --ccb-rg-card-pad-x: var(--ccb-rg-card-pad-x-tablet, var(--ccb-rg-card-pad-x-desktop, 26px));

    --ccb-rg-card-head-fs: var(--ccb-rg-card-head-fs-tablet, var(--ccb-rg-card-head-fs-desktop, 16px));

    --ccb-rg-list-fs: var(--ccb-rg-list-fs-tablet, var(--ccb-rg-list-fs-desktop, 18px));
    --ccb-rg-list-gap: var(--ccb-rg-list-gap-tablet, var(--ccb-rg-list-gap-desktop, 18px));
    --ccb-rg-list-icon: var(--ccb-rg-list-icon-tablet, var(--ccb-rg-list-icon-desktop, 28px));

    --ccb-rg-mid-icon: var(--ccb-rg-mid-icon-tablet, var(--ccb-rg-mid-icon-desktop, 70px));
    --ccb-rg-mid-gap: var(--ccb-rg-mid-gap-tablet, var(--ccb-rg-mid-gap-desktop, 22px));
    --ccb-rg-mid-footer-fs: var(--ccb-rg-mid-footer-fs-tablet, var(--ccb-rg-mid-footer-fs-desktop, 18px));

    --ccb-rg-right-icon: var(--ccb-rg-right-icon-tablet, var(--ccb-rg-right-icon-desktop, 70px));
    --ccb-rg-right-row-gap: var(--ccb-rg-right-row-gap-tablet, var(--ccb-rg-right-row-gap-desktop, 26px));
    --ccb-rg-right-label-fs: var(--ccb-rg-right-label-fs-tablet, var(--ccb-rg-right-label-fs-desktop, 18px));

    --ccb-rg-arrow-size: var(--ccb-rg-arrow-size-tablet, var(--ccb-rg-arrow-size-desktop, 46px));
}

.ccb-report-generation[data-preview-device="mobile"] {
    --ccb-rg-container-max: var(--ccb-rg-container-max-mobile, var(--ccb-rg-container-max-tablet, var(--ccb-rg-container-max-desktop, 1200px)));
    --ccb-rg-pt: var(--ccb-rg-pt-mobile, var(--ccb-rg-pt-tablet, var(--ccb-rg-pt-desktop, 60px)));
    --ccb-rg-pb: var(--ccb-rg-pb-mobile, var(--ccb-rg-pb-tablet, var(--ccb-rg-pb-desktop, 60px)));
    --ccb-rg-px: var(--ccb-rg-px-mobile, var(--ccb-rg-px-tablet, var(--ccb-rg-px-desktop, 24px)));

    --ccb-rg-header-gap: var(--ccb-rg-header-gap-mobile, var(--ccb-rg-header-gap-tablet, var(--ccb-rg-header-gap-desktop, 10px)));
    --ccb-rg-header-mb: var(--ccb-rg-header-mb-mobile, var(--ccb-rg-header-mb-tablet, var(--ccb-rg-header-mb-desktop, 40px)));

    --ccb-rg-title-fs: var(--ccb-rg-title-fs-mobile, var(--ccb-rg-title-fs-tablet, var(--ccb-rg-title-fs-desktop, 40px)));
    --ccb-rg-subtitle-fs: var(--ccb-rg-subtitle-fs-mobile, var(--ccb-rg-subtitle-fs-tablet, var(--ccb-rg-subtitle-fs-desktop, 18px)));

    --ccb-rg-flow-gap: var(--ccb-rg-flow-gap-mobile, var(--ccb-rg-flow-gap-tablet, var(--ccb-rg-flow-gap-desktop, 28px)));
    --ccb-rg-card-w: var(--ccb-rg-card-w-mobile, var(--ccb-rg-card-w-tablet, var(--ccb-rg-card-w-desktop, 360px)));
    --ccb-rg-card-radius: var(--ccb-rg-card-radius-mobile, var(--ccb-rg-card-radius-tablet, var(--ccb-rg-card-radius-desktop, 6px)));

    --ccb-rg-card-shadow-blur: var(--ccb-rg-card-shadow-blur-mobile, var(--ccb-rg-card-shadow-blur-tablet, var(--ccb-rg-card-shadow-blur-desktop, 24px)));
    --ccb-rg-card-shadow-opacity: var(--ccb-rg-card-shadow-opacity-mobile, var(--ccb-rg-card-shadow-opacity-tablet, var(--ccb-rg-card-shadow-opacity-desktop, 0.18)));

    --ccb-rg-card-pad-y: var(--ccb-rg-card-pad-y-mobile, var(--ccb-rg-card-pad-y-tablet, var(--ccb-rg-card-pad-y-desktop, 26px)));
    --ccb-rg-card-pad-x: var(--ccb-rg-card-pad-x-mobile, var(--ccb-rg-card-pad-x-tablet, var(--ccb-rg-card-pad-x-desktop, 26px)));

    --ccb-rg-card-head-fs: var(--ccb-rg-card-head-fs-mobile, var(--ccb-rg-card-head-fs-tablet, var(--ccb-rg-card-head-fs-desktop, 16px)));

    --ccb-rg-list-fs: var(--ccb-rg-list-fs-mobile, var(--ccb-rg-list-fs-tablet, var(--ccb-rg-list-fs-desktop, 18px)));
    --ccb-rg-list-gap: var(--ccb-rg-list-gap-mobile, var(--ccb-rg-list-gap-tablet, var(--ccb-rg-list-gap-desktop, 18px)));
    --ccb-rg-list-icon: var(--ccb-rg-list-icon-mobile, var(--ccb-rg-list-icon-tablet, var(--ccb-rg-list-icon-desktop, 28px)));

    --ccb-rg-mid-icon: var(--ccb-rg-mid-icon-mobile, var(--ccb-rg-mid-icon-tablet, var(--ccb-rg-mid-icon-desktop, 70px)));
    --ccb-rg-mid-gap: var(--ccb-rg-mid-gap-mobile, var(--ccb-rg-mid-gap-tablet, var(--ccb-rg-mid-gap-desktop, 22px)));
    --ccb-rg-mid-footer-fs: var(--ccb-rg-mid-footer-fs-mobile, var(--ccb-rg-mid-footer-fs-tablet, var(--ccb-rg-mid-footer-fs-desktop, 18px)));

    --ccb-rg-right-icon: var(--ccb-rg-right-icon-mobile, var(--ccb-rg-right-icon-tablet, var(--ccb-rg-right-icon-desktop, 70px)));
    --ccb-rg-right-row-gap: var(--ccb-rg-right-row-gap-mobile, var(--ccb-rg-right-row-gap-tablet, var(--ccb-rg-right-row-gap-desktop, 26px)));
    --ccb-rg-right-label-fs: var(--ccb-rg-right-label-fs-mobile, var(--ccb-rg-right-label-fs-tablet, var(--ccb-rg-right-label-fs-desktop, 18px)));

    --ccb-rg-arrow-size: var(--ccb-rg-arrow-size-mobile, var(--ccb-rg-arrow-size-tablet, var(--ccb-rg-arrow-size-desktop, 46px)));
}

/* Frontend responsive */
@media (max-width: 1024px) {
    .ccb-report-generation:not([data-preview-device]) {
        --ccb-rg-container-max: var(--ccb-rg-container-max-tablet, var(--ccb-rg-container-max-desktop, 1200px));
        --ccb-rg-pt: var(--ccb-rg-pt-tablet, var(--ccb-rg-pt-desktop, 60px));
        --ccb-rg-pb: var(--ccb-rg-pb-tablet, var(--ccb-rg-pb-desktop, 60px));
        --ccb-rg-px: var(--ccb-rg-px-tablet, var(--ccb-rg-px-desktop, 24px));
        --ccb-rg-title-fs: var(--ccb-rg-title-fs-tablet, var(--ccb-rg-title-fs-desktop, 40px));
        --ccb-rg-subtitle-fs: var(--ccb-rg-subtitle-fs-tablet, var(--ccb-rg-subtitle-fs-desktop, 18px));
        --ccb-rg-flow-gap: var(--ccb-rg-flow-gap-tablet, var(--ccb-rg-flow-gap-desktop, 28px));
        --ccb-rg-card-w: var(--ccb-rg-card-w-tablet, var(--ccb-rg-card-w-desktop, 360px));
        --ccb-rg-arrow-size: var(--ccb-rg-arrow-size-tablet, var(--ccb-rg-arrow-size-desktop, 46px));
    }

    .ccb-report-generation__flow {
        grid-template-columns: minmax(0, 1fr);
        max-width: 700px;
        margin: 0 auto;
    }

    .ccb-report-generation__arrow {
        display: none;
    }
}

@media (max-width: 768px) {
    .ccb-report-generation:not([data-preview-device]) {
        --ccb-rg-container-max: var(--ccb-rg-container-max-mobile, var(--ccb-rg-container-max-tablet, var(--ccb-rg-container-max-desktop, 1200px)));
        --ccb-rg-pt: var(--ccb-rg-pt-mobile, var(--ccb-rg-pt-tablet, var(--ccb-rg-pt-desktop, 60px)));
        --ccb-rg-pb: var(--ccb-rg-pb-mobile, var(--ccb-rg-pb-tablet, var(--ccb-rg-pb-desktop, 60px)));
        --ccb-rg-px: var(--ccb-rg-px-mobile, var(--ccb-rg-px-tablet, var(--ccb-rg-px-desktop, 24px)));
        --ccb-rg-title-fs: var(--ccb-rg-title-fs-mobile, var(--ccb-rg-title-fs-tablet, var(--ccb-rg-title-fs-desktop, 40px)));
        --ccb-rg-subtitle-fs: var(--ccb-rg-subtitle-fs-mobile, var(--ccb-rg-subtitle-fs-tablet, var(--ccb-rg-subtitle-fs-desktop, 18px)));
        --ccb-rg-flow-gap: var(--ccb-rg-flow-gap-mobile, var(--ccb-rg-flow-gap-tablet, var(--ccb-rg-flow-gap-desktop, 28px)));
        --ccb-rg-card-w: var(--ccb-rg-card-w-mobile, var(--ccb-rg-card-w-tablet, var(--ccb-rg-card-w-desktop, 360px)));
    }
}

/* hero-section.css */
/* ═══════════════════════════════════════════════════
   ccb/hero-section — Styles (ported from trb/hero)
   ═══════════════════════════════════════════════════ */

/* ─── SPLIT LAYOUT ─── */
.ccb-hsec--split {
	display: grid;
	grid-template-columns: 1fr;
	width: 100%;
	overflow: hidden;
}
.ccb-hsec--split .ccb-hsec__split-inner {
	display: grid;
	grid-template-columns: 45% 55%;
	min-height: var(--ccb-hsec-min-h-d, 600px);
}
.ccb-hsec--split.ccb-hsec--img-right .ccb-hsec__split-inner {
	grid-template-columns: 55% 45%;
}
.ccb-hsec--split .ccb-hsec__split-media {
	overflow: hidden;
	position: relative;
}
.ccb-hsec--split.ccb-hsec--img-right .ccb-hsec__split-media {
	order: 2;
}
.ccb-hsec--split.ccb-hsec--img-right .ccb-hsec__split-content {
	order: 1;
}
.ccb-hsec--split .ccb-hsec__split-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.ccb-hsec--split .ccb-hsec__split-placeholder {
	width: 100%;
	height: 100%;
	min-height: 300px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #e5e5e5;
	color: #999;
}
.ccb-hsec--split .ccb-hsec__split-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 48px 56px;
	gap: var(--ccb-hsec-gap-d, 16px);
}

/* ─── OVERLAY LAYOUT ─── */
.ccb-hsec--overlay {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--ccb-hsec-min-h-d, 600px);
	padding: var(--ccb-hsec-py-d, 0) var(--ccb-hsec-px-d, 0);
}
.ccb-hsec__bg-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.ccb-hsec__overlay-bg {
	position: absolute;
	inset: 0;
	z-index: 1;
}
.ccb-hsec--overlay .ccb-hsec__inner {
	position: relative;
	z-index: 2;
	max-width: 1200px;
	width: 100%;
	padding: 0 24px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ccb-hsec--overlay .ccb-hsec__content {
	text-align: center;
	max-width: 700px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ccb-hsec-gap-d, 16px);
}

/* ─── COMMON ─── */
.ccb-hsec__heading {
	font-family: 'Lato', 'Open Sans', sans-serif;
	font-size: var(--ccb-hsec-heading-fs-d, 42px);
	line-height: 1.2;
	margin: 0;
}
.ccb-hsec__desc {
	font-family: 'Lato', 'Open Sans', sans-serif;
	font-size: var(--ccb-hsec-desc-fs-d, 16px);
	line-height: 1.7;
	margin: 0;
}
.ccb-hsec__divider {
	display: block;
	width: 50px;
	height: 3px;
	border-radius: 2px;
}
.ccb-hsec__cta-wrap {
	margin-top: 8px;
}
.ccb-hsec__cta {
	display: inline-block;
	padding: 14px 32px;
	font-family: 'Lato', 'Open Sans', sans-serif;
	font-size: var(--ccb-hsec-cta-fs-d, 14px);
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	transition: opacity .2s ease, transform .2s ease;
}
.ccb-hsec__cta:hover {
	opacity: .9;
	transform: translateY(-1px);
}

/* ─── SLIDESHOW LAYOUT ─── */
.ccb-hsec--slideshow {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-height: var(--ccb-hsec-min-h-d, 600px);
	display: grid;
}
.ccb-hsec-slide {
	grid-area: 1 / 1;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--ccb-hsec-min-h-d, 600px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .7s ease, visibility .7s ease;
	z-index: 0;
}
.ccb-hsec-slide--active {
	opacity: 1;
	visibility: visible;
	z-index: 1;
}
.ccb-hsec-slide__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.ccb-hsec-slide__bg--fallback {
	background: linear-gradient(135deg, #1a1a2e, #16213e);
}
.ccb-hsec-slide__content {
	position: relative;
	z-index: 2;
	text-align: center;
	max-width: 1200px;
	padding: 60px 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ccb-hsec-gap-d, 16px);
	color: #fff;
}
.ccb-hsec-slide__cat {
	display: inline-block;
	padding: 6px 16px;
	background: rgba(255, 255, 255, .15);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	border-radius: 20px;
}

/* ─── Arrows ─── */
.ccb-hsec-slideshow__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, .2);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .25s ease, transform .25s ease;
}
.ccb-hsec-slideshow__arrow:hover {
	background: rgba(255, 255, 255, .25);
	transform: translateY(-50%) scale(1.08);
}
.ccb-hsec-slideshow__arrow--prev {
	left: 24px;
}
.ccb-hsec-slideshow__arrow--next {
	right: 24px;
}

/* ─── Dots ─── */
.ccb-hsec-slideshow__dots {
	position: absolute;
	bottom: 28px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 5;
	display: flex;
	gap: 8px;
}
.ccb-hsec-slideshow__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	background: rgba(255, 255, 255, .35);
	transition: background .3s ease, transform .3s ease;
	padding: 0;
}
.ccb-hsec-slideshow__dot--active {
	background: #fff;
	transform: scale(1.2);
}
.ccb-hsec-slideshow__dot:hover {
	background: rgba(255, 255, 255, .7);
}

/* ─── Progress Bar ─── */
.ccb-hsec-slideshow__progress {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: rgba(255, 255, 255, .1);
	z-index: 5;
}
.ccb-hsec-slideshow__progress-bar {
	height: 100%;
	width: 0%;
	background: #5182bb;
	transition: none;
}

/* ─── RESPONSIVE: Tablet ─── */
@media (max-width: 1024px) {
	.ccb-hsec--split .ccb-hsec__split-inner {
		grid-template-columns: 1fr;
	}
	.ccb-hsec--split.ccb-hsec--img-right .ccb-hsec__split-inner {
		grid-template-columns: 1fr;
	}
	.ccb-hsec--split .ccb-hsec__split-media {
		order: -1 !important;
		max-height: 400px;
	}
	.ccb-hsec--split .ccb-hsec__split-content {
		order: 0 !important;
		padding: 32px 24px;
		gap: var(--ccb-hsec-gap-t, var(--ccb-hsec-gap-d, 14px));
	}
	.ccb-hsec__heading {
		font-size: var(--ccb-hsec-heading-fs-t, var(--ccb-hsec-heading-fs-d, 36px));
	}
	.ccb-hsec__desc {
		font-size: var(--ccb-hsec-desc-fs-t, var(--ccb-hsec-desc-fs-d, 15px));
	}
	.ccb-hsec__cta {
		font-size: var(--ccb-hsec-cta-fs-t, var(--ccb-hsec-cta-fs-d, 13px));
		padding: 12px 28px;
	}
	.ccb-hsec--overlay,
	.ccb-hsec-slide,
	.ccb-hsec--slideshow {
		min-height: var(--ccb-hsec-min-h-t, var(--ccb-hsec-min-h-d, 500px));
	}
	.ccb-hsec--overlay {
		padding: var(--ccb-hsec-py-t, var(--ccb-hsec-py-d, 0)) var(--ccb-hsec-px-t, var(--ccb-hsec-px-d, 0));
	}
	.ccb-hsec-slideshow__arrow {
		width: 40px;
		height: 40px;
	}
	.ccb-hsec-slideshow__arrow--prev { left: 12px; }
	.ccb-hsec-slideshow__arrow--next { right: 12px; }
}

/* ─── RESPONSIVE: Mobile ─── */
@media (max-width: 768px) {
	.ccb-hsec__heading {
		font-size: var(--ccb-hsec-heading-fs-m, var(--ccb-hsec-heading-fs-t, 28px));
	}
	.ccb-hsec__desc {
		font-size: var(--ccb-hsec-desc-fs-m, var(--ccb-hsec-desc-fs-t, 14px));
	}
	.ccb-hsec__cta {
		font-size: var(--ccb-hsec-cta-fs-m, var(--ccb-hsec-cta-fs-t, 12px));
		padding: 10px 24px;
	}
	.ccb-hsec--overlay,
	.ccb-hsec-slide,
	.ccb-hsec--slideshow {
		min-height: var(--ccb-hsec-min-h-m, var(--ccb-hsec-min-h-t, 400px));
	}
	.ccb-hsec--overlay {
		padding: var(--ccb-hsec-py-m, var(--ccb-hsec-py-t, 0)) var(--ccb-hsec-px-m, var(--ccb-hsec-px-t, 0));
	}
	.ccb-hsec--split .ccb-hsec__split-content {
		padding: 24px 16px;
		gap: var(--ccb-hsec-gap-m, var(--ccb-hsec-gap-t, 12px));
	}
	.ccb-hsec-slide__content {
		padding: 32px 20px;
		gap: var(--ccb-hsec-gap-m, var(--ccb-hsec-gap-t, 12px));
	}
	.ccb-hsec-slideshow__arrow {
		width: 36px;
		height: 36px;
	}
	.ccb-hsec-slideshow__arrow--prev { left: 8px; }
	.ccb-hsec-slideshow__arrow--next { right: 8px; }
	.ccb-hsec-slideshow__dots { bottom: 16px; }
	.ccb-hsec-slide__cat {
		font-size: 10px;
		padding: 4px 12px;
	}
}

/* ─── Visibility ─── */
@media (min-width: 1025px) { .cgb-hide-desktop { display: none !important; } }
@media (min-width: 769px) and (max-width: 1024px) { .cgb-hide-tablet { display: none !important; } }
@media (max-width: 768px) { .cgb-hide-mobile { display: none !important; } }

/* posts-grid.css */
/* Posts Grid */

.ccb-posts-grid {
    position: relative;
    background-color: var(--ccb-pg-bg, transparent);
    background-image: var(--ccb-pg-bg-image, none);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    margin-top: var(--ccb-pg-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-mb-desktop, 0px);

    padding-top: var(--ccb-pg-pt-desktop, 0px);
    padding-bottom: var(--ccb-pg-pb-desktop, 0px);
}

.ccb-posts-grid::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--ccb-pg-overlay-color, transparent);
    opacity: var(--ccb-pg-overlay-opacity, 0);
    pointer-events: none;
}

.ccb-posts-grid > .cgb-inner {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: var(--cgb-inner-max, 1200px);
    margin-left: auto;
    margin-right: auto;

    padding-left: var(--cgb-inner-pad-x-desktop, 24px);
    padding-right: var(--cgb-inner-pad-x-desktop, 24px);
}

.ccb-posts-grid__section-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: var(--ccb-pg-sec-title-mb-desktop, 24px);
}
.ccb-posts-grid__section-header .ccb-posts-grid__section-title {
    margin-bottom: 0;
}

.ccb-posts-grid__view-all {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.ccb-posts-grid__view-all:hover {
    text-decoration: underline;
}

.ccb-posts-grid__section-title {
    margin-left: 0;
    margin-right: 0;
    margin-top: var(--ccb-pg-sec-title-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-sec-title-mb-desktop, 24px);
    text-align: var(--ccb-pg-sec-title-align, left);
    color: var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a));
    font-size: var(--ccb-pg-sec-title-fs-desktop, 32px);
    line-height: var(--ccb-pg-sec-title-lh-desktop, 1.2);
    font-weight: var(--ccb-pg-sec-title-fw-desktop, 800);
    letter-spacing: var(--ccb-pg-sec-title-ls-desktop, 0em);
}

.ccb-posts-grid__grid {
    display: grid;
    grid-template-columns: repeat(var(--ccb-pg-cols-desktop, 3), minmax(0, 1fr));
    gap: var(--ccb-pg-gap-desktop, 24px);
}

.ccb-posts-grid__card {
    background: var(--ccb-pg-card-bg, var(--cgb-bg-card, #ffffff));
    color: var(--ccb-pg-card-text, var(--cgb-text-main, #3c434a));
    border: var(--ccb-pg-card-border-w, 0px) var(--ccb-pg-card-border-style, solid) var(--ccb-pg-card-border-color, transparent);
    border-radius: var(--ccb-pg-card-radius, var(--cgb-radius-card, 8px));
    box-shadow: var(--ccb-pg-card-shadow, var(--cgb-shadow-card, none));
    overflow: hidden;
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.ccb-posts-grid__card:hover {
    box-shadow: var(
        --ccb-pg-card-shadow-hover,
        var(--cgb-shadow-hover, var(--ccb-pg-card-shadow, var(--cgb-shadow-card, none)))
    );
}

.ccb-posts-grid__image {
    display: block;
    line-height: 0;
    aspect-ratio: var(--ccb-pg-image-ar, auto);
    overflow: hidden;
}

.ccb-posts-grid__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.ccb-posts-grid__content {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ccb-posts-grid__meta {
    color: var(--ccb-pg-meta-color, var(--cgb-text-muted, #646970));
    font-size: 12px;
    line-height: 1.4;
}

.ccb-posts-grid__meta-sep {
    margin: 0 6px;
    opacity: 0.8;
}

.ccb-posts-grid__title {
    font-size: var(--ccb-pg-title-fs-desktop, 20px);
    line-height: 1.2;
    font-weight: var(--ccb-pg-title-fw-desktop, 700);
    color: var(--ccb-pg-title-color-desktop, inherit);
    margin-top: var(--ccb-pg-title-mt-desktop, 0px);
    margin-bottom: var(--ccb-pg-title-mb-desktop, 0px);
}

.ccb-posts-grid__title a {
    color: inherit;
    text-decoration: none;
}

.ccb-posts-grid__excerpt {
    font-size: var(--ccb-pg-excerpt-fs-desktop, 14px);
    line-height: 1.6;
    margin: 0;
}

.ccb-posts-grid__readmore {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    align-self: flex-start;
    text-decoration: none;
}

.ccb-posts-grid__readmore--link {
    color: var(--ccb-pg-link-color, var(--cgb-primary, #5e17eb));
}

.ccb-posts-grid__readmore--button {
    background: var(--ccb-pg-btn-bg, var(--cgb-primary, #5e17eb));
    color: var(--ccb-pg-btn-text, #ffffff);
    padding: 10px 14px;
    border-radius: var(--cgb-radius-pill, 999px);
}

/* Card types */
.ccb-posts-grid--card-minimal .ccb-posts-grid__image {
    display: none;
}

.ccb-posts-grid--card-minimal .ccb-posts-grid__excerpt {
    display: none;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__card {
    display: grid;
    grid-template-columns: 40% 1fr;
    align-items: stretch;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__image {
    height: 100%;
}

.ccb-posts-grid--card-horizontal .ccb-posts-grid__image img {
    height: 100%;
    object-fit: cover;
}

.ccb-posts-grid__empty {
    padding: 16px;
}

/* Tablet */
@media (max-width: 1024px) {
    .ccb-posts-grid {
        margin-top: var(--ccb-pg-mt-tablet, var(--ccb-pg-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-mb-tablet, var(--ccb-pg-mb-desktop, 0px));

        padding-top: var(--ccb-pg-pt-tablet, var(--ccb-pg-pt-desktop, 0px));
        padding-bottom: var(--ccb-pg-pb-tablet, var(--ccb-pg-pb-desktop, 0px));
    }

    .ccb-posts-grid > .cgb-inner {
        max-width: var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px));
        padding-left: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
        padding-right: var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px));
    }

    .ccb-posts-grid__grid {
        grid-template-columns: repeat(var(--ccb-pg-cols-tablet, var(--ccb-pg-cols-desktop, 3)), minmax(0, 1fr));
        gap: var(--ccb-pg-gap-tablet, var(--ccb-pg-gap-desktop, 24px));
    }

    .ccb-posts-grid__section-title {
        margin-top: var(--ccb-pg-sec-title-mt-tablet, var(--ccb-pg-sec-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-sec-title-mb-tablet, var(--ccb-pg-sec-title-mb-desktop, 24px));
        color: var(--ccb-pg-sec-title-color-tablet, var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a)));
        font-size: var(--ccb-pg-sec-title-fs-tablet, var(--ccb-pg-sec-title-fs-desktop, 32px));
        line-height: var(--ccb-pg-sec-title-lh-tablet, var(--ccb-pg-sec-title-lh-desktop, 1.2));
        font-weight: var(--ccb-pg-sec-title-fw-tablet, var(--ccb-pg-sec-title-fw-desktop, 800));
        letter-spacing: var(--ccb-pg-sec-title-ls-tablet, var(--ccb-pg-sec-title-ls-desktop, 0em));
    }

    .ccb-posts-grid__title {
        font-size: var(--ccb-pg-title-fs-tablet, var(--ccb-pg-title-fs-desktop, 20px));
        font-weight: var(--ccb-pg-title-fw-tablet, var(--ccb-pg-title-fw-desktop, 700));
        color: var(--ccb-pg-title-color-tablet, var(--ccb-pg-title-color-desktop, inherit));
        margin-top: var(--ccb-pg-title-mt-tablet, var(--ccb-pg-title-mt-desktop, 0px));
        margin-bottom: var(--ccb-pg-title-mb-tablet, var(--ccb-pg-title-mb-desktop, 0px));
    }

    .ccb-posts-grid__excerpt {
        font-size: var(--ccb-pg-excerpt-fs-tablet, var(--ccb-pg-excerpt-fs-desktop, 14px));
    }
}

/* Mobile */
@media (max-width: 768px) {
    .ccb-posts-grid {
        margin-top: var(--ccb-pg-mt-mobile, var(--ccb-pg-mt-tablet, var(--ccb-pg-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-mb-mobile, var(--ccb-pg-mb-tablet, var(--ccb-pg-mb-desktop, 0px)));

        padding-top: var(--ccb-pg-pt-mobile, var(--ccb-pg-pt-tablet, var(--ccb-pg-pt-desktop, 0px)));
        padding-bottom: var(--ccb-pg-pb-mobile, var(--ccb-pg-pb-tablet, var(--ccb-pg-pb-desktop, 0px)));
    }

    .ccb-posts-grid > .cgb-inner {
        max-width: var(--cgb-inner-max-mobile, var(--cgb-inner-max-tablet, var(--cgb-inner-max, 1200px)));
        padding-left: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
        padding-right: var(--cgb-inner-pad-x-mobile, var(--cgb-inner-pad-x-tablet, var(--cgb-inner-pad-x-desktop, 24px)));
    }

    .ccb-posts-grid__section-title {
        margin-top: var(--ccb-pg-sec-title-mt-mobile, var(--ccb-pg-sec-title-mt-tablet, var(--ccb-pg-sec-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-sec-title-mb-mobile, var(--ccb-pg-sec-title-mb-tablet, var(--ccb-pg-sec-title-mb-desktop, 24px)));
    }

    .ccb-posts-grid__title {
        font-size: var(--ccb-pg-title-fs-mobile, var(--ccb-pg-title-fs-tablet, var(--ccb-pg-title-fs-desktop, 20px)));
        font-weight: var(--ccb-pg-title-fw-mobile, var(--ccb-pg-title-fw-tablet, var(--ccb-pg-title-fw-desktop, 700)));
        color: var(--ccb-pg-title-color-mobile, var(--ccb-pg-title-color-tablet, var(--ccb-pg-title-color-desktop, inherit)));
        margin-top: var(--ccb-pg-title-mt-mobile, var(--ccb-pg-title-mt-tablet, var(--ccb-pg-title-mt-desktop, 0px)));
        margin-bottom: var(--ccb-pg-title-mb-mobile, var(--ccb-pg-title-mb-tablet, var(--ccb-pg-title-mb-desktop, 0px)));
    }

    .ccb-posts-grid__grid {
        grid-template-columns: repeat(var(--ccb-pg-cols-mobile, 1), minmax(0, 1fr));
        gap: var(--ccb-pg-gap-mobile, var(--ccb-pg-gap-tablet, var(--ccb-pg-gap-desktop, 24px)));
    }

    .ccb-posts-grid__section-title {
        color: var(--ccb-pg-sec-title-color-mobile, var(--ccb-pg-sec-title-color-tablet, var(--ccb-pg-sec-title-color-desktop, var(--cgb-text-main, #3c434a))));
        font-size: var(--ccb-pg-sec-title-fs-mobile, var(--ccb-pg-sec-title-fs-tablet, var(--ccb-pg-sec-title-fs-desktop, 32px)));
        line-height: var(--ccb-pg-sec-title-lh-mobile, var(--ccb-pg-sec-title-lh-tablet, var(--ccb-pg-sec-title-lh-desktop, 1.2)));
        font-weight: var(--ccb-pg-sec-title-fw-mobile, var(--ccb-pg-sec-title-fw-tablet, var(--ccb-pg-sec-title-fw-desktop, 800)));
        letter-spacing: var(--ccb-pg-sec-title-ls-mobile, var(--ccb-pg-sec-title-ls-tablet, var(--ccb-pg-sec-title-ls-desktop, 0em)));
    }

    .ccb-posts-grid__title {
        font-size: var(--ccb-pg-title-fs-mobile, var(--ccb-pg-title-fs-tablet, var(--ccb-pg-title-fs-desktop, 20px)));
    }

    .ccb-posts-grid__excerpt {
        font-size: var(--ccb-pg-excerpt-fs-mobile, var(--ccb-pg-excerpt-fs-tablet, var(--ccb-pg-excerpt-fs-desktop, 14px)));
    }

    .ccb-posts-grid--card-horizontal .ccb-posts-grid__card {
        grid-template-columns: 1fr;
    }

    .ccb-posts-grid--card-horizontal .ccb-posts-grid__image img {
        height: auto;
    }
}

/* ── Pagination ── */

.ccb-posts-grid__pagination {
    margin: clamp(22px, 3vw, 34px) 0 0;
}

.ccb-posts-grid__pagination ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.ccb-posts-grid__pagination a,
.ccb-posts-grid__pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 12px;
    border: 1px solid var(--cgb-border, #e2e8f0);
    border-radius: var(--cgb-radius-sm, 6px);
    text-decoration: none;
    color: var(--cgb-text, #334155);
    background: var(--cgb-bg, #fff);
    font-size: 14px;
    transition: border-color 0.2s, color 0.2s;
}

.ccb-posts-grid__pagination a:hover {
    border-color: var(--cgb-primary, #5182bb);
    color: var(--cgb-primary, #5182bb);
}

.ccb-posts-grid__pagination .current {
    border-color: var(--cgb-primary, #5182bb);
    color: var(--cgb-primary, #5182bb);
    font-weight: 600;
}
/* End CGB bundle additions */