/* JR Help Page Layout Fix v1.0.0
   Scope: Help page only. The page's existing inner Help Centre card/content is
   deliberately untouched. */

body.jr-help-page-layout .entry-hero,
body.jr-help-page-layout .entry-hero-container,
body.jr-help-page-layout .entry-hero-container-inner,
body.jr-help-page-layout .page-hero-section,
body.jr-help-page-layout .hero-section,
body.jr-help-page-layout .entry-content-wrap > .entry-header {
    display: none !important;
}

/* Strip any page/article layer behind the intended cream shell. */
body.jr-help-page-layout .content-bg,
body.jr-help-page-layout article.page,
body.jr-help-page-layout .site-main > article {
    background: transparent !important;
    box-shadow: none !important;
}

body.jr-help-page-layout #primary.content-area,
body.jr-help-page-layout .content-container.site-container {
    box-sizing: border-box !important;
    min-width: 0 !important;
}

/* Desktop: pull the outer shell in so the space around the existing Help card
   is visually even rather than having very large side gutters. */
body.jr-help-page-layout #main.site-main {
    box-sizing: border-box !important;
    width: calc(100% - 48px) !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
}

body.jr-help-page-layout #main.site-main > .content-wrap,
body.jr-help-page-layout #main.site-main .content-wrap > article,
body.jr-help-page-layout article.single-entry,
body.jr-help-page-layout .entry-content-wrap {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* This is the visible outer cream container. Keep the same premium JR shell,
   but use balanced internal spacing around the existing Help page content. */
body.jr-help-page-layout .entry-content-wrap {
    margin: 48px auto 72px !important;
    padding: 56px !important;
    background:
        linear-gradient(rgba(255,253,249,.968), rgba(255,253,249,.968)),
        repeating-linear-gradient(
            0deg,
            rgba(112,83,56,.018) 0,
            rgba(112,83,56,.018) 1px,
            transparent 1px,
            transparent 4px
        ) !important;
    border: 1px solid rgba(221,208,190,.76) !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 48px rgba(55,39,24,.10) !important;
}

/* Do not allow Gutenberg/Kadence wrappers to add a second outer offset. */
body.jr-help-page-layout .entry-content.single-content {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

@media (max-width: 1024px) {
    body.jr-help-page-layout #main.site-main {
        width: calc(100% - 36px) !important;
        max-width: 900px !important;
    }

    body.jr-help-page-layout .entry-content-wrap {
        margin-top: 32px !important;
        margin-bottom: 54px !important;
        padding: 34px !important;
    }
}

@media (max-width: 767px) {
    body.jr-help-page-layout #main.site-main {
        width: calc(100% - 30px) !important;
        max-width: none !important;
    }

    body.jr-help-page-layout .entry-content-wrap {
        margin-top: 24px !important;
        margin-bottom: 38px !important;
        padding: 20px 18px !important;
        border-radius: 20px !important;
    }
}
