/* Lesson 07 only: cards and diagrams; shared website CSS remains unchanged. */
.bb-materials .bb-around-hero h1{font-size:clamp(2.3rem,4.6vw,4.7rem)}
.bb-materials .bb-around-jump{grid-template-columns:repeat(6,minmax(0,1fr))}
.bb-materials .bb-welcome a{color:#7b2d73;font-weight:bold}
.bb-materials .bb-lesson p,.bb-materials .bb-lesson li{overflow-wrap:break-word}
.bb-material-samples,.bb-material-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}
.bb-material-sample{min-width:0;padding:20px 12px 18px;background:radial-gradient(ellipse at 48% 20%,#784181,#35163f);border:3px ridge #d9a862;border-radius:17px;text-align:center;color:#fff0d4;box-shadow:inset 0 0 0 3px #f8d9aa22}
.bb-material-ball{display:block;width:112px;height:112px;margin:2px auto 14px;border-radius:50%;border:2px solid #fff3d6;box-shadow:0 15px 24px #1007199e,inset -18px -21px 25px #240f3f77}
.bb-material-sample.stone .bb-material-ball{background:radial-gradient(circle at 27% 20%,#d8d0c8,#b4a79e 44%,#706570 90%)}
.bb-material-sample.amethyst .bb-material-ball{background:radial-gradient(circle at 28% 18%,#faf1ff 0,#e0a2f7 11%,#8c35c2 43%,#41145d 77%,#24052a 100%)}
.bb-material-sample.gold .bb-material-ball{background:radial-gradient(circle at 25% 19%,#fffcef,#ffdd76 13%,#efb642 29%,#ad5c08 48%,#f0c256 60%,#5a2a05 90%)}
.bb-material-sample h3{font:700 1.35rem Georgia,serif;color:#ffe1a7;margin:0 0 7px}
.bb-material-sample p{font:1rem/1.5 Georgia,serif;margin:0}
.bb-material-illustration,.bb-cottage-sketch{background:radial-gradient(ellipse at 50% 30%,#664072,#311938);color:#fff0d4;border:3px ridge #e3af68;border-radius:19px;padding:16px 18px;margin:23px auto;text-align:center}
.bb-material-illustration svg,.bb-cottage-sketch svg{display:block;width:100%;max-width:740px;height:auto;margin:auto}
.bb-color-demo svg{max-width:650px}
.bb-material-illustration p,.bb-cottage-sketch p{font:italic .95rem Georgia,serif;margin:9px 0 1px}
.bb-material-settings article{background:linear-gradient(145deg,#fff5e4,#e9d1ad);border:2px solid #dcb06d;border-radius:15px;padding:17px 18px;box-shadow:0 6px 16px #3c21331b}
.bb-material-settings h3{color:#692762;font:700 1.3rem Georgia,serif;margin:0 0 10px}
.bb-material-settings p{font:1rem/1.45 Georgia,serif;margin:6px 0}
.bb-material-faq{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){.bb-materials .bb-around-jump{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.bb-material-samples,.bb-material-settings{grid-template-columns:1fr}.bb-material-sample{display:grid;grid-template-columns:115px 1fr;grid-template-rows:auto auto;gap:4px 15px;align-items:center;text-align:left}.bb-material-ball{grid-row:1/3;width:98px;height:98px;margin:auto}.bb-material-sample h3{align-self:end}.bb-material-sample p{align-self:start}.bb-material-faq{grid-template-columns:1fr}.bb-materials .bb-around-jump{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:450px){.bb-materials .bb-around-jump{grid-template-columns:1fr}.bb-material-sample{grid-template-columns:85px minmax(0,1fr);gap:4px 10px;padding:13px}.bb-material-ball{width:75px;height:75px}.bb-material-sample h3{font-size:1.18rem}.bb-material-sample p{font-size:.88rem}.bb-materials .bb-around-hero h1{font-size:clamp(2rem,8vw,3.4rem)}.bb-material-illustration,.bb-cottage-sketch{padding:8px}}