/* One quiet navy surface ties the visitor photos and lesson previews together. */
.family-guide.course-showcase{background:#192839;border:1px solid #2d4057;border-radius:28px;padding:clamp(20px,2.4vw,32px);box-shadow:0 18px 45px #18283a12;color:#f4f7fc;box-sizing:border-box}
.course-showcase .guide-intro{min-height:0;margin:0 0 20px}
.course-showcase .guide-intro h2{color:#f4f7fc;line-height:1.15;margin:10px 0}
.course-showcase .guide-intro p{color:#bfcee1;line-height:1.5}
.course-showcase .eyebrow{color:#a9c8fc}
.course-showcase .showcase-stage{background:#f3f6fc;border-radius:18px}
.course-showcase .showcase-stage:has(.learning-photo){background:transparent}
.course-showcase .guide-count{color:#bfcee1;font-size:11px;letter-spacing:.04em}
.course-showcase .guide-caption{padding:14px 0 0;margin:0 0 14px}
.course-showcase .guide-controls button{background:#263a50;border:1px solid #405670;color:#f6f9ff;box-shadow:none;border-radius:12px}
.course-showcase .guide-controls button:hover{background:#344c68;border-color:#7d9cc3}
.course-showcase .guide-controls button:focus-visible{outline:3px solid #bad5ff;outline-offset:3px}
.discovery-studio{background:#192839!important;border:1px solid #2d4057!important;border-radius:28px!important;box-shadow:0 18px 45px #18283a12!important;padding:clamp(20px,2.3vw,32px);color:#f4f7fc}
.discovery-studio .studio-heading,.discovery-studio .studio-topic-title{color:#d6e4f7}
.discovery-studio .studio-picture{background:#f3f6fc;border-radius:18px}
.discovery-studio .studio-picture:has(.learning-photo){background:transparent}
.scroll-story{background:#192839;color:#f4f7fc;border:1px solid #2d4057}
.scroll-story .eyebrow{color:#a9c8fc}
.scroll-story .story-copy h2{color:#f4f7fc}
.scroll-story .story-instruction,.scroll-story .story-steps span{color:#bdcde0}
.scroll-story .story-steps .active{color:#fff}
.scroll-story .story-steps b{border-color:#536b86}
.scroll-story .story-steps .active b{background:#b7d1f5;color:#192839;border-color:#b7d1f5}
.scroll-story .story-drawing{background:#f3f6fc;border-radius:20px}
.scroll-story .story-drawing:has(.learning-photo){background:transparent}
.scroll-story .story-concept:has(svg){background:#f3f6fc;border-radius:16px}
.scroll-story .story-progress{background:#354a63}
.scroll-story .story-progress i{background:#a9c8fc}
@media(max-width:760px){.family-guide.course-showcase,.discovery-studio{padding:18px;border-radius:22px!important}.course-showcase .guide-intro h2{font-size:23px}.course-showcase .guide-intro p{font-size:13px}.scroll-story,.scroll-story .story-stage{border-radius:24px}}