.hpgb-wrap {
    --hpgb-accent: #5702d3;
    --hpgb-accent-soft: #f3ecff;
    --hpgb-action: #ff4500;
    --hpgb-text: #000;
    --hpgb-heading: #000;
    --hpgb-section-heading: #000;
    --hpgb-product-title-colour: #000;
    --hpgb-inner-heading: #000;
    --hpgb-card-bg: #fff;
    --hpgb-border: #dedede;
    --hpgb-badge-text: #fff;
    --hpgb-button-text: #fff;
    --hpgb-font-family: inherit;
    --hpgb-body-desktop: 22px;
    --hpgb-body-mobile: 18px;
    --hpgb-title-desktop: 22px;
    --hpgb-title-mobile: 18px;
    --hpgb-subheading-desktop: 22px;
    --hpgb-subheading-mobile: 18px;
    --hpgb-optional-desktop: 25px;
    --hpgb-optional-mobile: 21px;
    --hpgb-body-weight: 400;
    --hpgb-heading-weight: 800;
    --hpgb-card-radius: 14px;
    --hpgb-label-radius: 0;
    --hpgb-button-radius: 10px;
    --hpgb-gap: 20px;
    --hpgb-shadow: 0 8px 24px rgba(0, 0, 0, 0.055);

    width: 100%;
    margin: 2rem 0;
    color: var(--hpgb-text);
    font-family: var(--hpgb-font-family);
    font-size: var(--hpgb-body-desktop);
    font-weight: var(--hpgb-body-weight);
    line-height: 1.55;
}

.hpgb-wrap *,
.hpgb-wrap *::before,
.hpgb-wrap *::after {
    box-sizing: border-box;
}

.hpgb-wrap p,
.hpgb-wrap li,
.hpgb-wrap span,
.hpgb-wrap strong,
.hpgb-wrap a {
    font-family: inherit;
}

.hpgb-section-title {
    margin: 0 0 1rem;
    color: var(--hpgb-heading);
    font-size: var(--hpgb-optional-desktop);
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.25;
}

.hpgb-disclosure,
.hpgb-price-notice,
.hpgb-amazon-content-disclaimer {
    margin: 0 0 1rem;
    padding: 0.75rem 0.9rem;
    border-left: 4px solid var(--hpgb-accent);
    background: #fafafa;
    color: var(--hpgb-text);
    font-size: 0.82em;
    line-height: 1.5;
}

.hpgb-price-notice,
.hpgb-amazon-content-disclaimer {
    margin-top: 1rem;
    margin-bottom: 0;
}

.hpgb-price-notice {
    border-left-color: var(--hpgb-border);
}

.hpgb-amazon-associate-disclosure,
.hpgb-amazon-content-disclaimer {
    border-left-color: #ff9900;
}

.hpgb-grid,
.hpgb-comparison-grid,
.hpgb-card-list {
    display: grid;
    width: 100%;
    gap: var(--hpgb-gap);
}

.hpgb-card-list {
    grid-template-columns: minmax(0, 1fr);
}

.hpgb-columns-1,
.hpgb-comparison-columns-1 { grid-template-columns: minmax(0, 1fr); }
.hpgb-columns-2,
.hpgb-comparison-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hpgb-columns-3,
.hpgb-comparison-columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hpgb-columns-4,
.hpgb-comparison-columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hpgb-columns-5,
.hpgb-comparison-columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.hpgb-product-card,
.hpgb-comparison-card,
.hpgb-top-pick {
    position: relative;
    display: flex;
    overflow: hidden;
    min-width: 0;
    flex-direction: column;
    border: 1px solid var(--hpgb-border);
    border-radius: var(--hpgb-card-radius);
    background: var(--hpgb-card-bg);
    box-shadow: var(--hpgb-shadow);
}

.hpgb-layout-card,
.hpgb-layout-card .hpgb-card-list,
.hpgb-layout-card .hpgb-product-card-detailed {
    clear: both;
    float: none;
    width: 100%;
    max-width: none;
}

.hpgb-badge {
    position: absolute;
    z-index: 2;
    top: 0.8rem;
    left: 0.8rem;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.38rem 0.72rem;
    border-radius: var(--hpgb-label-radius);
    background: var(--hpgb-action);
    color: var(--hpgb-badge-text);
    font-size: 0.82em;
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.2;
}

.hpgb-product-image,
.hpgb-comparison-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 210px;
    padding: 1rem;
    border-bottom: 1px solid var(--hpgb-border);
    background: var(--hpgb-card-bg);
}

.hpgb-product-image img,
.hpgb-comparison-image img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 250px;
    margin: 0 auto;
    object-fit: contain;
}

.hpgb-product-image-link {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

.hpgb-product-image-link:focus-visible {
    outline: 3px solid var(--hpgb-accent);
    outline-offset: 3px;
}

.hpgb-product-body,
.hpgb-comparison-body {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    padding: 1rem;
}

.hpgb-product-title {
    margin: 0 0 0.7rem;
    color: var(--hpgb-heading);
    font-size: var(--hpgb-title-desktop);
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.3;
}

.hpgb-field-block {
    margin-top: 0.9rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--hpgb-border);
}

.hpgb-product-title + .hpgb-field-block {
    margin-top: 0.2rem;
}

.hpgb-field-block p {
    margin: 0;
    color: var(--hpgb-text);
}

.hpgb-field-heading {
    margin: 0 0 0.45rem;
    color: var(--hpgb-heading);
    font-size: var(--hpgb-subheading-desktop);
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.3;
}

.hpgb-field-verdict {
    padding: 0.9rem;
    border: 1px solid var(--hpgb-border);
    border-radius: calc(var(--hpgb-card-radius) * 0.7);
    background: var(--hpgb-accent-soft);
}

.hpgb-list {
    margin: 0.35rem 0 0;
}

.hpgb-list li {
    margin: 0 0 0.45rem;
    padding-left: 0.15rem;
}

.hpgb-list-features {
    padding-left: 1.35rem;
    list-style: disc outside;
}

.hpgb-list-pros,
.hpgb-list-cons {
    padding-left: 1.65rem;
    list-style: decimal outside;
}

.hpgb-list-features li::marker,
.hpgb-list-pros li::marker {
    color: var(--hpgb-accent);
    font-weight: var(--hpgb-heading-weight);
}

.hpgb-list-cons li::marker {
    color: #6d6d6d;
    font-weight: var(--hpgb-heading-weight);
}

.hpgb-button-wrap {
    margin-top: auto;
    padding-top: 1rem;
}

.hpgb-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 0.76rem 1rem;
    border: 2px solid var(--hpgb-action);
    border-radius: var(--hpgb-button-radius);
    background: var(--hpgb-action);
    color: var(--hpgb-button-text);
    font-family: inherit;
    font-size: inherit;
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

.hpgb-button:hover,
.hpgb-button:focus {
    color: var(--hpgb-button-text);
    opacity: 0.92;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(255, 69, 0, 0.22);
    text-decoration: none;
}

.hpgb-button:focus-visible {
    outline: 3px solid var(--hpgb-heading);
    outline-offset: 3px;
}

.hpgb-button-compact {
    min-height: 42px;
    padding: 0.6rem 0.75rem;
}

.hpgb-paid-link {
    display: block;
    margin-top: 0.4rem;
    color: var(--hpgb-text);
    font-size: 0.78em;
    font-weight: 700;
    text-align: center;
}

.hpgb-product-card-detailed {
    display: block;
    width: 100%;
    padding: 1.15rem;
}

.hpgb-detailed-grid,
.hpgb-top-pick-grid {
    display: grid;
    grid-template-columns: minmax(210px, 30%) minmax(0, 1fr);
    gap: var(--hpgb-gap);
    align-items: start;
}

.hpgb-detailed-grid.hpgb-no-image,
.hpgb-top-pick-grid.hpgb-no-image {
    grid-template-columns: minmax(0, 1fr);
}

.hpgb-product-card-detailed .hpgb-product-image,
.hpgb-top-pick .hpgb-product-image {
    min-height: 250px;
    border: 0;
}

.hpgb-top-pick {
    border-width: 2px;
    border-color: var(--hpgb-action);
}

.hpgb-top-pick-label {
    padding: 0.62rem 1rem;
    border-radius: var(--hpgb-label-radius) var(--hpgb-label-radius) 0 0;
    background: var(--hpgb-action);
    color: var(--hpgb-badge-text);
    font-weight: var(--hpgb-heading-weight);
    line-height: 1.25;
}

.hpgb-top-pick-grid {
    padding: 1.15rem;
}

.hpgb-comparison-card .hpgb-product-image,
.hpgb-comparison-card .hpgb-comparison-image {
    min-height: 190px;
}

.hpgb-comparison-card .hpgb-comparison-image img {
    max-height: 180px;
}

.hpgb-empty {
    padding: 1rem;
    border: 1px dashed var(--hpgb-border);
    background: #fafafa;
}

.hpgb-wrap .screen-reader-text {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

@media (max-width: 1200px) {
    .hpgb-columns-5,
    .hpgb-comparison-columns-5 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .hpgb-columns-4,
    .hpgb-comparison-columns-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .hpgb-columns-3,
    .hpgb-columns-4,
    .hpgb-columns-5,
    .hpgb-comparison-columns-3,
    .hpgb-comparison-columns-4,
    .hpgb-comparison-columns-5 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hpgb-detailed-grid,
    .hpgb-top-pick-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 767px) {
    .hpgb-wrap {
        font-size: var(--hpgb-body-mobile);
    }

    .hpgb-section-title {
        font-size: var(--hpgb-optional-mobile);
    }

    .hpgb-product-title {
        font-size: var(--hpgb-title-mobile);
    }

    .hpgb-field-heading {
        font-size: var(--hpgb-subheading-mobile);
    }
}

@media (max-width: 650px) {
    .hpgb-grid,
    .hpgb-comparison-grid,
    .hpgb-columns-2,
    .hpgb-columns-3,
    .hpgb-columns-4,
    .hpgb-columns-5,
    .hpgb-comparison-columns-2,
    .hpgb-comparison-columns-3,
    .hpgb-comparison-columns-4,
    .hpgb-comparison-columns-5 {
        grid-template-columns: minmax(0, 1fr);
    }

    .hpgb-product-card-detailed,
    .hpgb-top-pick-grid {
        padding: 1rem;
    }
}


/* Sponsored service links */
.hpgb-services-wrap {
    --hpgb-service-font: inherit;
    --hpgb-service-text: #000;
    --hpgb-service-heading: #000;
    --hpgb-service-action: #ff4500;
    --hpgb-service-action-text: #fff;
    --hpgb-service-divider: #d9d9d9;
    --hpgb-service-bg: #fff;
    --hpgb-service-body-desktop: 20px;
    --hpgb-service-body-mobile: 18px;
    --hpgb-service-title-desktop: 24px;
    --hpgb-service-title-mobile: 20px;
    --hpgb-service-section-desktop: 25px;
    --hpgb-service-section-mobile: 21px;
    --hpgb-service-body-weight: 400;
    --hpgb-service-heading-weight: 800;
    --hpgb-service-image-width: 150px;
    --hpgb-service-image-width-mobile: 95px;
    --hpgb-service-image-radius: 8px;
    --hpgb-service-button-radius: 8px;
    --hpgb-service-gap: 22px;
    --hpgb-service-padding: 22px;
    --hpgb-service-divider-size: 1px;
    width: 100%;
    margin: 2rem 0;
    background: var(--hpgb-service-bg);
    color: var(--hpgb-service-text);
    font-family: var(--hpgb-service-font);
    font-size: var(--hpgb-service-body-desktop);
    font-weight: var(--hpgb-service-body-weight);
    line-height: 1.55;
}
.hpgb-services-wrap *, .hpgb-services-wrap *::before, .hpgb-services-wrap *::after { box-sizing: border-box; }
.hpgb-services-section-title {
    margin: 0 0 1rem;
    color: var(--hpgb-service-heading);
    font-family: inherit;
    font-size: var(--hpgb-service-section-desktop);
    font-weight: var(--hpgb-service-heading-weight);
    line-height: 1.25;
}
.hpgb-service-disclosure {
    margin: 0 0 .75rem;
    padding: .75rem .9rem;
    border-left: 4px solid var(--hpgb-service-action);
    background: #fafafa;
    color: var(--hpgb-service-text);
    font-size: .82em;
    line-height: 1.5;
}
.hpgb-service-list { width: 100%; }
.hpgb-service-item {
    display: grid;
    grid-template-columns: var(--hpgb-service-image-width) minmax(0, 1fr);
    gap: var(--hpgb-service-gap);
    width: 100%;
    align-items: start;
    padding: var(--hpgb-service-padding) 0;
    border-bottom: var(--hpgb-service-divider-size) solid var(--hpgb-service-divider);
}
.hpgb-service-item:first-child { padding-top: calc(var(--hpgb-service-padding) * .55); }
.hpgb-service-item.hpgb-service-no-image { grid-template-columns: minmax(0, 1fr); }
.hpgb-service-image {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
}
.hpgb-service-image img {
    display: block;
    width: 100%;
    max-width: var(--hpgb-service-image-width);
    height: auto;
    aspect-ratio: 4 / 3;
    border-radius: var(--hpgb-service-image-radius);
    object-fit: contain;
    background: #fff;
}
.hpgb-service-image-link { display: block; width: 100%; }
.hpgb-service-content { min-width: 0; }
.hpgb-service-title {
    margin: 0 0 .55rem;
    color: var(--hpgb-service-heading);
    font-family: inherit;
    font-size: var(--hpgb-service-title-desktop);
    font-weight: var(--hpgb-service-heading-weight);
    line-height: 1.25;
}
.hpgb-service-title a { color: inherit; text-decoration: none; }
.hpgb-service-title a:hover, .hpgb-service-title a:focus { text-decoration: underline; }
.hpgb-service-description { margin: 0; color: var(--hpgb-service-text); }
.hpgb-service-cta-wrap { margin: .9rem 0 0; }
.hpgb-service-cta {
    color: var(--hpgb-service-action);
    font-family: inherit;
    font-weight: var(--hpgb-service-heading-weight);
    text-decoration: underline;
}
.hpgb-service-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: .65rem 1rem;
    border: 2px solid var(--hpgb-service-action);
    border-radius: var(--hpgb-service-button-radius);
    background: var(--hpgb-service-action);
    color: var(--hpgb-service-action-text);
    text-decoration: none;
}
.hpgb-service-cta-button:hover, .hpgb-service-cta-button:focus { color: var(--hpgb-service-action-text); opacity: .92; text-decoration: none; }
.hpgb-services-wrap .screen-reader-text {
    position: absolute; overflow: hidden; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
    clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap;
}
@media (max-width: 767px) {
    .hpgb-services-wrap { font-size: var(--hpgb-service-body-mobile); }
    .hpgb-services-section-title { font-size: var(--hpgb-service-section-mobile); }
    .hpgb-service-title { font-size: var(--hpgb-service-title-mobile); }
    .hpgb-service-item { grid-template-columns: var(--hpgb-service-image-width-mobile) minmax(0, 1fr); }
    .hpgb-service-image img { max-width: var(--hpgb-service-image-width-mobile); }
}
@media (max-width: 520px) {
    .hpgb-service-item { grid-template-columns: minmax(0, 1fr); }
    .hpgb-service-image { justify-content: flex-start; }
    .hpgb-service-image img { max-width: min(100%, var(--hpgb-service-image-width)); }
}

/*
 * Layout Designer precedence (v1.9.1)
 *
 * Some WordPress themes target article headings and links with selectors that
 * are more specific than the plugin's base component rules. These declarations
 * are deliberately scoped to HPGB wrappers and only protect settings selected
 * in Layout Designer. They do not alter headings or links elsewhere on HUBS.
 */
.hpgb-wrap.hpgb-wrap .hpgb-section-title,
.hpgb-wrap.hpgb-wrap .hpgb-product-title,
.hpgb-wrap.hpgb-wrap .hpgb-field-heading {
    color: var(--hpgb-heading) !important;
    font-family: var(--hpgb-font-family) !important;
}

.hpgb-wrap.hpgb-wrap,
.hpgb-wrap.hpgb-wrap p,
.hpgb-wrap.hpgb-wrap li,
.hpgb-wrap.hpgb-wrap .hpgb-paid-link,
.hpgb-wrap.hpgb-wrap .hpgb-disclosure,
.hpgb-wrap.hpgb-wrap .hpgb-price-notice,
.hpgb-wrap.hpgb-wrap .hpgb-amazon-content-disclaimer {
    color: var(--hpgb-text);
    font-family: var(--hpgb-font-family);
}

.hpgb-wrap.hpgb-wrap a.hpgb-button:link,
.hpgb-wrap.hpgb-wrap a.hpgb-button:visited,
.hpgb-wrap.hpgb-wrap a.hpgb-button:hover,
.hpgb-wrap.hpgb-wrap a.hpgb-button:focus,
.hpgb-wrap.hpgb-wrap a.hpgb-button:active {
    border-color: var(--hpgb-action) !important;
    background-color: var(--hpgb-action) !important;
    color: var(--hpgb-button-text) !important;
    font-family: var(--hpgb-font-family) !important;
    text-decoration: none !important;
}

.hpgb-wrap.hpgb-wrap a.hpgb-product-image-link:link,
.hpgb-wrap.hpgb-wrap a.hpgb-product-image-link:visited,
.hpgb-wrap.hpgb-wrap a.hpgb-product-image-link:hover,
.hpgb-wrap.hpgb-wrap a.hpgb-product-image-link:focus,
.hpgb-wrap.hpgb-wrap a.hpgb-product-image-link:active {
    border: 0;
    color: inherit;
    text-decoration: none;
}

.hpgb-wrap.hpgb-wrap .hpgb-badge,
.hpgb-wrap.hpgb-wrap .hpgb-top-pick-label {
    color: var(--hpgb-badge-text) !important;
    font-family: var(--hpgb-font-family) !important;
}

.hpgb-services-wrap.hpgb-services-wrap .hpgb-services-section-title,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title {
    color: var(--hpgb-service-heading) !important;
    font-family: var(--hpgb-service-font) !important;
}

.hpgb-services-wrap.hpgb-services-wrap,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-description,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-disclosure {
    color: var(--hpgb-service-text);
    font-family: var(--hpgb-service-font);
}

.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title > a:link,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title > a:visited,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title > a:hover,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title > a:focus,
.hpgb-services-wrap.hpgb-services-wrap .hpgb-service-title > a:active {
    color: var(--hpgb-service-heading) !important;
    font-family: var(--hpgb-service-font) !important;
}

.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-text:link,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-text:visited,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-text:hover,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-text:focus,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-text:active {
    color: var(--hpgb-service-action) !important;
    font-family: var(--hpgb-service-font) !important;
}

.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-button:link,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-button:visited,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-button:hover,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-button:focus,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-cta-button:active {
    border-color: var(--hpgb-service-action) !important;
    background-color: var(--hpgb-service-action) !important;
    color: var(--hpgb-service-action-text) !important;
    font-family: var(--hpgb-service-font) !important;
    text-decoration: none !important;
}

.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-image-link:link,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-image-link:visited,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-image-link:hover,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-image-link:focus,
.hpgb-services-wrap.hpgb-services-wrap a.hpgb-service-image-link:active {
    border: 0;
    color: inherit;
    text-decoration: none;
}


/* Layout Designer typography and compact detailed-card layout (v1.9.2). */
.hpgb-wrap.hpgb-wrap .hpgb-section-title {
    color: var(--hpgb-section-heading) !important;
}

.hpgb-wrap.hpgb-wrap .hpgb-product-title {
    color: var(--hpgb-product-title-colour) !important;
}

.hpgb-wrap.hpgb-wrap .hpgb-field-heading {
    color: var(--hpgb-inner-heading) !important;
}

/*
 * This opt-in class is generated by the Layout Designer's typography
 * protection setting. The priority is narrowly scoped to plugin components;
 * it never changes normal HUBS article headings or copy.
 */
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap {
    font-size: var(--hpgb-body-desktop) !important;
}

.hpgb-wrap.hpgb-protect-typography.hpgb-wrap p,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap li,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-button,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-badge,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-top-pick-label,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-paid-link,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-disclosure,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-price-notice,
.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-amazon-content-disclaimer {
    font-family: var(--hpgb-font-family) !important;
    font-size: var(--hpgb-body-desktop) !important;
}

.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-section-title {
    font-family: var(--hpgb-font-family) !important;
    font-size: var(--hpgb-optional-desktop) !important;
}

.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-product-title {
    font-family: var(--hpgb-font-family) !important;
    font-size: var(--hpgb-title-desktop) !important;
}

.hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-field-heading {
    font-family: var(--hpgb-font-family) !important;
    font-size: var(--hpgb-subheading-desktop) !important;
}

.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap {
    font-size: var(--hpgb-service-body-desktop) !important;
}

.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-description,
.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-disclosure,
.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-cta {
    font-family: var(--hpgb-service-font) !important;
    font-size: var(--hpgb-service-body-desktop) !important;
}

.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-services-section-title {
    font-family: var(--hpgb-service-font) !important;
    font-size: var(--hpgb-service-section-desktop) !important;
}

.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-title,
.hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-title > a {
    font-family: var(--hpgb-service-font) !important;
    font-size: var(--hpgb-service-title-desktop) !important;
}

@media (max-width: 767px) {
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap p,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap li,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-button,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-badge,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-top-pick-label,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-paid-link,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-disclosure,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-price-notice,
    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-amazon-content-disclaimer {
        font-size: var(--hpgb-body-mobile) !important;
    }

    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-section-title {
        font-size: var(--hpgb-optional-mobile) !important;
    }

    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-product-title {
        font-size: var(--hpgb-title-mobile) !important;
    }

    .hpgb-wrap.hpgb-protect-typography.hpgb-wrap .hpgb-field-heading {
        font-size: var(--hpgb-subheading-mobile) !important;
    }

    .hpgb-detailed-hero,
    .hpgb-detailed-info-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hpgb-detail-cell-full {
        grid-column: auto;
    }

    .hpgb-detailed-image.hpgb-product-image {
        max-width: 360px;
        margin: 0 auto;
    }

    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap,
    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-description,
    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-disclosure,
    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-cta {
        font-size: var(--hpgb-service-body-mobile) !important;
    }

    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-services-section-title {
        font-size: var(--hpgb-service-section-mobile) !important;
    }

    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-title,
    .hpgb-services-wrap.hpgb-protect-typography.hpgb-services-wrap .hpgb-service-title > a {
        font-size: var(--hpgb-service-title-mobile) !important;
    }
}

/* Fixed Detailed Card composition (v1.9.4).
 * This layout is intentionally not configurable: 28/72 top row, 50/50 middle
 * row, then a full-width verdict and CTA. Typography and colours still come
 * from Layout Designer variables. Flexbox is used for broad theme compatibility.
 */
.hpgb-wrap .hpgb-product-card-detailed {
    display: block;
    width: 100%;
    max-width: none;
    padding: 1.15rem;
}

.hpgb-wrap .hpgb-product-card-detailed > .hpgb-badge {
    position: static;
    margin: 0 0 0.75rem;
}

.hpgb-wrap .hpgb-detailed-product-name {
    display: block;
    width: 100%;
    margin: 0 0 0.9rem;
}

.hpgb-wrap .hpgb-detailed-top {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    width: 100%;
    gap: var(--hpgb-gap);
}

.hpgb-wrap .hpgb-detailed-top > .hpgb-detailed-image {
    flex: 0 0 28%;
    width: 28%;
    max-width: 28%;
    min-width: 0;
}

.hpgb-wrap .hpgb-detailed-top > .hpgb-detailed-top-copy {
    flex: 1 1 72%;
    width: 72%;
    max-width: 72%;
    min-width: 0;
}

.hpgb-wrap .hpgb-detailed-top.hpgb-no-image > .hpgb-detailed-top-copy {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%;
}

.hpgb-wrap .hpgb-detailed-image.hpgb-product-image {
    min-height: 0;
    padding: 0.65rem;
    border: 1px solid var(--hpgb-border);
    border-radius: calc(var(--hpgb-card-radius) * 0.7);
}

.hpgb-wrap .hpgb-detailed-image.hpgb-product-image img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 230px;
    margin: 0 auto;
    object-fit: contain;
}

.hpgb-wrap .hpgb-detailed-divider {
    display: block;
    clear: both;
    width: 100%;
    margin: 1rem 0;
    border: 0;
    border-top: 1px solid var(--hpgb-border);
}

.hpgb-wrap .hpgb-detailed-middle {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    width: 100%;
    gap: var(--hpgb-gap);
}

.hpgb-wrap .hpgb-detailed-middle > .hpgb-detailed-column {
    flex: 1 1 50%;
    width: calc(50% - (var(--hpgb-gap) / 2));
    max-width: calc(50% - (var(--hpgb-gap) / 2));
    min-width: 0;
}

.hpgb-wrap .hpgb-detailed-top-copy > .hpgb-field-block:first-child,
.hpgb-wrap .hpgb-detailed-column > .hpgb-field-block:first-child,
.hpgb-wrap .hpgb-detailed-bottom > .hpgb-field-block:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.hpgb-wrap .hpgb-detailed-bottom {
    display: block;
    clear: both;
    width: 100%;
    margin-top: 1rem;
}

.hpgb-wrap .hpgb-detailed-bottom .hpgb-field-verdict,
.hpgb-wrap .hpgb-detailed-bottom .hpgb-button-wrap,
.hpgb-wrap .hpgb-detailed-bottom .hpgb-button {
    display: block;
    width: 100%;
    max-width: none;
}

.hpgb-wrap .hpgb-detailed-bottom .hpgb-button-wrap {
    margin-top: 1rem;
    padding-top: 0;
}

@media (max-width: 767px) {
    .hpgb-wrap .hpgb-detailed-top,
    .hpgb-wrap .hpgb-detailed-middle {
        flex-direction: column;
    }

    .hpgb-wrap .hpgb-detailed-top > .hpgb-detailed-image,
    .hpgb-wrap .hpgb-detailed-top > .hpgb-detailed-top-copy,
    .hpgb-wrap .hpgb-detailed-middle > .hpgb-detailed-column {
        flex-basis: auto;
        width: 100%;
        max-width: 100%;
    }

    .hpgb-wrap .hpgb-detailed-image.hpgb-product-image {
        max-width: 360px;
        margin: 0 auto;
    }
}

/* Continuous paired information rows for Detailed Cards (v1.9.5).
 * Each row owns one uninterrupted full-width divider, avoiding broken lines
 * from the individual field blocks in the two columns.
 */
.hpgb-wrap .hpgb-detailed-pairs {
    display: block;
    width: 100%;
}

.hpgb-wrap .hpgb-detailed-pair-row {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    width: 100%;
    gap: var(--hpgb-gap);
    padding: 0.95rem 0;
    border-bottom: 1px solid var(--hpgb-border);
}

.hpgb-wrap .hpgb-detailed-pair-cell {
    flex: 1 1 50%;
    width: calc(50% - (var(--hpgb-gap) / 2));
    max-width: calc(50% - (var(--hpgb-gap) / 2));
    min-width: 0;
}

.hpgb-wrap .hpgb-detailed-pair-single > .hpgb-detailed-pair-cell {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%;
}

.hpgb-wrap .hpgb-detailed-pair-cell > .hpgb-field-block,
.hpgb-wrap .hpgb-detailed-pair-cell > .hpgb-button-wrap {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.hpgb-wrap .hpgb-detailed-pairs + .hpgb-detailed-bottom {
    margin-top: 1rem;
}

@media (max-width: 767px) {
    .hpgb-wrap .hpgb-detailed-pair-row {
        flex-direction: column;
    }

    .hpgb-wrap .hpgb-detailed-pair-cell {
        flex-basis: auto;
        width: 100%;
        max-width: 100%;
    }

    .hpgb-wrap .hpgb-detailed-pair-cell + .hpgb-detailed-pair-cell {
        margin-top: 0.9rem;
        padding-top: 0.9rem;
        border-top: 1px solid var(--hpgb-border);
    }
}