#course-system .reading-step header p.reading-feature{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid #d8e2c6;border-radius:12px;background:#edf3df;color:#405b32;font-size:13px;font-weight:500;line-height:1.8;margin-top:12px}
.reading-feature-icon{flex:0 0 28px;width:28px;height:28px;padding:3px;background:#d7e5bc;color:#55733b;border-radius:7px}
.blueprint-course-page .interactive-blueprint .blueprint-hero-mini{display:block;width:76px;height:60px;object-fit:contain;margin:0 auto 8px;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-core-side button{position:relative;padding-right:80px;min-height:120px}
.blueprint-course-page .interactive-blueprint .ib-core-side .blueprint-hero-mini{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:68px;height:54px;margin:0}
.blueprint-course-page .interactive-blueprint .ib-support button{position:relative;padding-right:78px;min-height:98px}
.blueprint-course-page .interactive-blueprint .ib-support .blueprint-hero-mini{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:66px;height:52px;margin:0}
@media(max-width:700px){.blueprint-course-page .interactive-blueprint .blueprint-hero-mini{width:62px;height:49px;margin-bottom:6px}.blueprint-course-page .interactive-blueprint .ib-core-side button,.blueprint-course-page .interactive-blueprint .ib-support button{padding-right:16px;padding-top:14px}.blueprint-course-page .interactive-blueprint .ib-core-side .blueprint-hero-mini,.blueprint-course-page .interactive-blueprint .ib-support .blueprint-hero-mini{position:static;transform:none;width:58px;height:46px;margin:0 auto 8px}#course-system .reading-step header p.reading-feature{font-size:13px}}

/* Three life stages form full-bleed illustrated maps. */
.blueprint-course-page .interactive-blueprint .ib-cycles button{position:relative;isolation:isolate;overflow:hidden;min-height:270px;padding:146px 10px 20px;background:#ecefd4}
.blueprint-course-page .interactive-blueprint .ib-cycles .blueprint-hero-mini{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:cover;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-cycles button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 15%,rgba(246,246,221,.1) 34%,rgba(246,246,221,.94) 65%,#f6f6dd 100%);z-index:-1;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-cycles button :is(i,b,small){position:relative;color:#3f5735}
.blueprint-course-page .interactive-blueprint .ib-cycles i{margin-bottom:10px}
@media(max-width:700px){.blueprint-course-page .interactive-blueprint .ib-cycles button{min-height:245px;padding-top:135px}.blueprint-course-page .interactive-blueprint .ib-cycles .blueprint-hero-mini{object-position:center 35%}}

/* Full-bleed core identity scenes, with a quiet text zone. */
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/birthday.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/personality.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/desire.svg"]){isolation:isolate;overflow:hidden;min-height:156px;padding:22px 44% 20px 46px;background:#f3f4e5}
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/birthday.svg"])::after,.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/personality.svg"])::after,.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/desire.svg"])::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f7f7e8 2%,#f7f7e8ed 29%,#f7f7e888 48%,transparent 70%);z-index:-1;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-core-side :is(img[src*="/birthday.svg"],img[src*="/personality.svg"],img[src*="/desire.svg"]){position:absolute;inset:0;transform:none;width:100%;height:100%;object-fit:cover;object-position:64% center;margin:0;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/birthday.svg"]) small{line-height:1.7}
@media(min-width:1001px){.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/birthday.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/personality.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/desire.svg"]){padding-right:38%;padding-left:44px;min-height:170px}.blueprint-course-page .interactive-blueprint .ib-core-side :is(img[src*="/birthday.svg"],img[src*="/personality.svg"],img[src*="/desire.svg"]){object-position:60% center}}

/* Full-bleed direction and growth scenes, with a quiet text zone. */
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/destiny.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/expression.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/maturity.svg"]){isolation:isolate;overflow:hidden;min-height:156px;padding:22px 44% 20px 46px;background:#f3f4e5}
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/destiny.svg"])::after,.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/expression.svg"])::after,.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/maturity.svg"])::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f7f7e8 2%,#f7f7e8ed 29%,#f7f7e888 48%,transparent 70%);z-index:-1;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-core-side :is(img[src*="/destiny.svg"],img[src*="/expression.svg"],img[src*="/maturity.svg"]){position:absolute;inset:0;transform:none;width:100%;height:100%;object-fit:cover;object-position:64% center;margin:0;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/destiny.svg"]) small{line-height:1.7}
@media(min-width:1001px){.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/destiny.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/expression.svg"]),.blueprint-course-page .interactive-blueprint .ib-core-side button:has(img[src*="/maturity.svg"]){padding-right:38%;padding-left:44px;min-height:170px}.blueprint-course-page .interactive-blueprint .ib-core-side :is(img[src*="/destiny.svg"],img[src*="/expression.svg"],img[src*="/maturity.svg"]){object-position:60% center}}

/* Four peaks: full-bleed scenes with distinct life-stage actions. */
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button{position:relative;isolation:isolate;overflow:hidden;min-height:340px;padding:188px 12px 22px;background:#f4f5e7}
.blueprint-course-page .interactive-blueprint .ib-peaks .blueprint-hero-mini{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:cover;object-position:center top;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,#f7f7e222 39%,#f7f7e2ee 59%,#f7f7e2 80%);z-index:-1;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button :is(b,small,.stage-phase){position:relative;color:#405737}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four em{position:relative;color:#648c38}
@media(max-width:700px){.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button{min-height:300px;padding:155px 8px 18px}.blueprint-course-page .interactive-blueprint .ib-peaks .blueprint-hero-mini{object-position:center top}}

/* Match original challenge-card sizing without enlarging the grid. */
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button{min-height:0;padding:19px 14px}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button::before{content:"";display:block;height:60px;margin:0 auto 8px;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-peaks .blueprint-hero-mini{object-position:center 34%}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button::after{background:linear-gradient(180deg,transparent 0%,#f7f7e233 24%,#f7f7e2eb 43%,#f7f7e2 70%)}
@media(max-width:700px){.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button{min-height:0;padding:19px 14px}.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button::before{height:49px;margin-bottom:6px}}

/* Sunny yellow palette with translucent reading layer. */
.blueprint-course-page .interactive-blueprint .ib-peaks{background:linear-gradient(135deg,#fff5bd,#f7e99a)}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button{background:#ffed9c;border-color:#dbc879}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button::after{background:linear-gradient(180deg,transparent 8%,rgba(255,241,174,.08) 28%,rgba(255,242,177,.38) 48%,rgba(255,242,177,.60) 75%,rgba(255,242,177,.72) 100%)}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four button :is(b,small,.stage-phase,em){text-shadow:0 1px 3px #fff4c9,0 0 9px #fff4c9}
.blueprint-course-page .interactive-blueprint .ib-peaks .ib-four em{color:#4e702b}

/* Four challenges mirror peak-card geometry with luminous seafoam scenes. */
.blueprint-course-page .interactive-blueprint .ib-challenges{background:linear-gradient(135deg,#def7ed,#bcebe4)}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button{position:relative;isolation:isolate;overflow:hidden;min-height:0;padding:19px 14px;background:#c8eee6;border-color:#a3d4c8}
.blueprint-course-page .interactive-blueprint .ib-challenges .blueprint-hero-mini{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:cover;object-position:center 34%;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button::before{content:"";display:block;height:60px;margin:0 auto 8px;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 8%,rgba(210,247,237,.08) 28%,rgba(210,247,237,.38) 48%,rgba(210,247,237,.60) 75%,rgba(210,247,237,.72) 100%);z-index:-1;pointer-events:none}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button :is(b,small,.stage-phase,em){position:relative;color:#28564d;text-shadow:0 1px 3px #e5fff5,0 0 9px #e5fff5}
.blueprint-course-page .interactive-blueprint .ib-challenges header span{color:#49847a}
@media(max-width:700px){.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button::before{height:49px;margin-bottom:6px}}

/* Match cycles and challenges to the approved sunny peak palette. */
.blueprint-course-page .interactive-blueprint :is(.ib-cycles,.ib-challenges){background:linear-gradient(135deg,#fff5bd,#f7e99a)}
.blueprint-course-page .interactive-blueprint .ib-cycles button,.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button{background:#ffed9c;border-color:#dbc879}
.blueprint-course-page .interactive-blueprint .ib-cycles button::after{background:linear-gradient(180deg,transparent 15%,rgba(255,242,177,.10) 34%,rgba(255,242,177,.75) 65%,#fff2b1 100%)}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button::after{background:linear-gradient(180deg,transparent 8%,rgba(255,241,174,.08) 28%,rgba(255,242,177,.38) 48%,rgba(255,242,177,.60) 75%,rgba(255,242,177,.72) 100%)}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four button :is(b,small,.stage-phase,em){color:#405737;text-shadow:0 1px 3px #fff4c9,0 0 9px #fff4c9}
.blueprint-course-page .interactive-blueprint .ib-challenges .ib-four em{color:#4e702b}
.blueprint-course-page .interactive-blueprint .ib-challenges header span{color:#819176}

/* Unified core-number palette for the complete Section 02 blueprint. */
.blueprint-course-page .interactive-blueprint :is(.ib-peaks,.ib-cycles,.ib-challenges){background:linear-gradient(135deg,#f7f7e8,#e2e8cf);color:#405737}
.blueprint-course-page .interactive-blueprint :is(.ib-peaks .ib-four button,.ib-cycles button,.ib-challenges .ib-four button,.ib-support button){background:#f3f4e5;border-color:#dbe0d6}
.blueprint-course-page .interactive-blueprint :is(.ib-peaks .ib-four button,.ib-cycles button,.ib-challenges .ib-four button)::after{background:linear-gradient(180deg,transparent 8%,rgba(247,247,232,.08) 28%,rgba(247,247,232,.38) 48%,rgba(247,247,232,.75) 75%,#f7f7e8 100%)}
.blueprint-course-page .interactive-blueprint :is(.ib-peaks,.ib-cycles,.ib-challenges) button :is(i,b,small,.stage-phase,em){color:#405737;text-shadow:0 1px 3px #f7f7e8,0 0 9px #f7f7e8}
.blueprint-course-page .interactive-blueprint :is(.ib-peaks,.ib-cycles,.ib-challenges) header span{color:#819176}
.blueprint-course-page .interactive-blueprint .ib-support button{isolation:isolate;overflow:hidden;padding:22px 44% 20px 24px;min-height:120px;text-align:left}
.blueprint-course-page .interactive-blueprint .ib-support .blueprint-hero-mini{position:absolute;inset:0;transform:none;width:100%;height:100%;margin:0;object-fit:cover;object-position:64% center;z-index:-2}
.blueprint-course-page .interactive-blueprint .ib-support button::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f7f7e8 2%,#f7f7e8ed 29%,#f7f7e888 48%,transparent 70%);z-index:-1;pointer-events:none}
