/* Shared page introductions. Existing titles, counts and actions remain the source of truth. */
body.site-body.wisdom-shell .site-container .page-head:has(h1),
body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1),
body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1),
body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1),
body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-width: 0;
    min-height: 210px;
    padding: clamp(24px, 2.8vw, 38px) clamp(22px, 3.2vw, 44px);
    border: 1px solid #d8ecfa;
    border-radius: 18px;
    background-color: #e7f5ff;
    background-image: linear-gradient(90deg, #eaf7ff 0%, #eaf7ff 54%, rgba(234,247,255,.95) 60%, rgba(225,242,255,.44) 78%, rgba(225,242,255,.03) 100%), url('../images/materials-hero.webp');
    background-position: center, right center;
    background-repeat: no-repeat;
    background-size: 100% 100%, auto 100%;
    box-shadow: 0 6px 22px rgba(26, 92, 157, .045);
}

body.site-body.wisdom-shell .site-container .page-head:has(h1) > *,
body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) > *,
body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1) > *,
body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) > *,
body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) > * {position:relative;z-index:1;min-width:0}

body.site-body.wisdom-shell .site-container .page-head:has(h1) h1,
body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) h1,
body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1) h1,
body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) h1,
body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) h1 {
    color:#0b1b40;
    font-size:clamp(1.9rem,3.4vw,2.8rem);
    line-height:1.12;
    letter-spacing:-.035em;
    font-weight:800;
    overflow-wrap:anywhere;
}

body.site-body.wisdom-shell .site-container .page-head:has(h1) p,
body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) p,
body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1) p,
body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) p,
body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) p:not(.catalog-overline) {
    max-width:65ch;
    color:#526d8d;
    line-height:1.55;
}

/* Existing right-hand statistic or utility cards stay on top of the artwork. */
body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) .card {
    background:rgba(255,255,255,.94);
    border-color:rgba(207,228,244,.9);
}

/* Some older headings put title, paragraph and action directly in a flex row.
   Stack those siblings so descriptions never run over the illustration. */
body.site-body.wisdom-shell .site-container .page-head:has(> h1) {display:block}
body.site-body.wisdom-shell .site-container .page-head:has(> h1) > h1 {margin:0 0 10px}
body.site-body.wisdom-shell .site-container .page-head:has(> h1) > p {margin:0 0 16px}

/* The illustration replaces the redundant decorative icon and background rings. */
body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1) > .lr-head-icon {display:none}
body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1)::after,
body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1)::after {content:none}

/* The demonstration materials view has no separate art element of its own. */
body.site-body.wisdom-shell .materials-hero:not(:has(.materials-hero-art)) {
    background-image:linear-gradient(90deg,#eaf7ff 0%,#eaf7ff 54%,rgba(234,247,255,.95) 60%,rgba(225,242,255,.44) 78%,rgba(225,242,255,.03) 100%),url('../images/materials-hero.webp');
    background-position:center,right center;
    background-repeat:no-repeat;
    background-size:100% 100%,auto 100%;
}
body.site-body.wisdom-shell .materials-hero:not(:has(.materials-hero-art)) .materials-hero-content {max-width: min(72%,790px)}

@media (min-width: 851px) {
    /* Legacy hero rows contain a live balance/count card in the right column.
       Keep it below the heading at left, leaving the teacher illustration clear. */
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) > .row {max-width:72%}
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) > .row > :is(.col-lg-8,.col-lg-4) {width:100%}
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) > .row > .col-lg-4 > .card {max-width:400px}
    body.site-body.wisdom-shell .site-container .page-head:has(h1) h1,
    body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) h1,
    body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) h1 {max-width:72%}
    body.site-body.wisdom-shell .site-container .page-head:has(h1) p,
    body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) p,
    body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) p:not(.catalog-overline) {max-width:min(65ch,72%)}
}
@media (max-width: 850px) {
    body.site-body.wisdom-shell .materials-hero:not(:has(.materials-hero-art)) {
        background-image:linear-gradient(90deg,#eaf7ff 0%,rgba(234,247,255,.98) 45%,rgba(234,247,255,.80) 72%,rgba(234,247,255,.42) 100%),url('../images/materials-hero.webp');
        background-size:100% 100%,auto 100%;
    }
    body.site-body.wisdom-shell .materials-hero:not(:has(.materials-hero-art)) .materials-hero-content {max-width:100%}
    body.site-body.wisdom-shell .site-container .page-head:has(h1),
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1),
    body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1),
    body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1),
    body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) {
        min-height:170px;
        padding:24px 22px;
        background-image:linear-gradient(90deg,#eaf7ff 0%,rgba(234,247,255,.98) 45%,rgba(234,247,255,.80) 72%,rgba(234,247,255,.42) 100%),url('../images/materials-hero.webp');
        background-size:100% 100%,auto 100%;
    }
}
@media (max-width: 575px) {
    body.site-body.wisdom-shell .site-container .page-head:has(h1),
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1),
    body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1),
    body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1),
    body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) {
        min-height:150px;
        padding:22px 18px;
        background-image:linear-gradient(90deg,#eaf7ff 0%,rgba(234,247,255,.98) 52%,rgba(234,247,255,.82) 80%,rgba(234,247,255,.64) 100%),url('../images/materials-hero.webp');
    }
    body.site-body.wisdom-shell .site-container .page-head:has(h1) h1,
    body.site-body.wisdom-shell .site-container > .page-hero:not(.home-hero):not(.auth-aside):not(.resource-hero):has(h1) h1,
    body.site-body.wisdom-shell .site-container > .lr-page-head:has(h1) h1,
    body.site-body.wisdom-shell .site-container > .teacher-context-title:has(h1) h1,
    body.site-body.wisdom-shell .catalog-shell > .catalog-heading:has(h1) h1 {font-size:1.75rem;line-height:1.15}
}

/* Product detail keeps its real price, author, actions and statistics readable. */
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(24px,2.8vw,38px) clamp(22px,3.2vw,44px)!important;
    border:1px solid #d8ecfa;
    border-radius:18px!important;
    background-color:#eaf7ff;
    background-image:linear-gradient(90deg,#eaf7ff 0%,#eaf7ff 55%,rgba(234,247,255,.95) 62%,rgba(225,242,255,.35) 80%,rgba(225,242,255,.03) 100%),url('../images/materials-hero.webp');
    background-position:center,right center;
    background-repeat:no-repeat;
    background-size:100% 100%,auto 100%;
    box-shadow:0 6px 22px rgba(26,92,157,.045);
}
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) > * {position:relative;z-index:1;min-width:0}
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) h1 {color:#0b1b40;font-weight:800;letter-spacing:-.035em;overflow-wrap:anywhere}
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) .lead {color:#526d8d;line-height:1.55}
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) .resource-hero-strip {background:rgba(255,255,255,.94);border-color:#d9eaf7;flex-wrap:wrap}
body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) .resource-hero-stats {min-width:0}
@media (min-width:851px) {
    body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) > :not(.catalog-overline) {max-width:68%}
}
@media (max-width:850px) {
    body.site-body.wisdom-shell .catalog-shell > .resource-hero:has(h1) {
        background-image:linear-gradient(90deg,#eaf7ff 0%,rgba(234,247,255,.98) 52%,rgba(234,247,255,.85) 80%,rgba(234,247,255,.65) 100%),url('../images/materials-hero.webp');
        background-position:center,right top;
        background-size:100% 100%,auto 230px;
    }
}