/* Resource hub navigation: shared templates and legacy copies use one global token. */
html body .elementor .e-con:has(> .guides_main_div),
html body .elementor .e-con:has(> .e-con-inner > .guides_main_div) {
    --cie-resource-hub-block-padding: var(--cie-section-padding-block-compact, clamp(36px, 3.125vw, 60px));
    --padding-top: var(--cie-resource-hub-block-padding) !important;
    --padding-bottom: var(--cie-resource-hub-block-padding) !important;
    padding-top: var(--cie-resource-hub-block-padding) !important;
    padding-bottom: var(--cie-resource-hub-block-padding) !important;
    padding-block: var(--cie-resource-hub-block-padding) !important;
}

html body .elementor .e-con:has(> .e-con-inner > .guides_main_div) > .e-con-inner {
    --padding-top: 0px !important;
    --padding-bottom: 0px !important;
    padding-block: 0 !important;
}

/* Avoid a second Astra bottom gutter after this final shared section. */
html body:has(.elementor.elementor-3463 .elementor-element.elementor-element-852da06) #content > .ast-container {
    padding-bottom: 0 !important;
}

/* Flex can reduce a tile's width below its desktop size. Let its painted
 * circle follow that actual width instead of retaining the fixed height. */
html body .elementor .guides_main_div .explore_icon .elementor-icon-box-wrapper {
    box-sizing: border-box;
    aspect-ratio: 1 / 1;
    height: auto !important;
}

/* News and Blogs listings share the fluid page gutter and desktop grid rail. */
body.page-id-607 .elementor-element.elementor-element-58e39e8,
body.page-id-1230 .elementor-element.elementor-element-58e39e8,
body.page-id-1230 .elementor-element.elementor-element-38868b2 {
    --padding-left: var(--cie-section-padding-inline) !important;
    --padding-right: var(--cie-section-padding-inline) !important;
    padding-inline: var(--cie-section-padding-inline) !important;
}

body.page-id-607 .elementor-element.elementor-element-58e39e8 .news_loop_grid,
body.page-id-1230 .elementor-element.elementor-element-58e39e8 .blog_video_loop_grid,
body.page-id-1230 .elementor-element.elementor-element-38868b2 .news_loop_grid {
    width: 100%;
    max-width: calc(1650px - var(--cie-section-padding-inline) - var(--cie-section-padding-inline));
    margin-inline: auto;
}

/* Keep the Resource Hub shop button label black on hover. */
html body.page-id-1307 .elementor-element.elementor-element-697e798 .elementor-button:hover {
    color: #000;
}

/* Use the global compact section spacing on the Resource Hub page. */
html body.page-id-1307 .elementor-1307 .elementor-element.elementor-element-4f652fa {
    --padding-top: var(--cie-section-padding-block-compact, clamp(36px, 3.125vw, 60px)) !important;
    --padding-bottom: var(--cie-section-padding-block-compact, clamp(36px, 3.125vw, 60px)) !important;
    padding-block: var(--cie-section-padding-block-compact, clamp(36px, 3.125vw, 60px)) !important;
}

html body.page-id-1307 .elementor-1307 .elementor-element.elementor-element-4f652fa > .e-con-inner {
    padding-block: 0 !important;
}

/* Switch card colours together and use the original icon, avoiding the
 * replacement SVG's dark stroke during hover. Keep keyboard outlines intact. */
html body.page-id-1307 .elementor-1307 .reshubpage {
    --background-transition: 0s !important;
}

html body.page-id-1307 .elementor-1307 .reshubpage .elementor-widget-image::after {
    display: none !important;
}

html body.page-id-1307 .elementor-1307 .elementor-element.reshubpage .elementor-widget-image img {
    opacity: 1 !important;
    transition: none !important;
}

html body.page-id-1307 .elementor-1307 .reshubpage h4 {
    transition: none !important;
}

html body.page-id-1307 .elementor-1307 .elementor-element.reshubpage:is(:hover, :focus-visible, :focus-within) .elementor-widget-image img {
    -webkit-filter: brightness(0) invert(1) !important;
    filter: brightness(0) invert(1) !important;
}

html body.page-id-1307 .elementor-1307 .reshubpage:is(:focus-visible, :focus-within) {
    background-color: #61737e !important;
}

html body.page-id-1307 .elementor-1307 .reshubpage:is(:focus-visible, :focus-within) h4 {
    color: #fff !important;
}
