/* The classroom board uses live, selectable text and a Higgsfield chalk portrait. */
.hero.classroom-board{--chalk:#f2f0e7;display:block;position:relative;isolation:isolate;margin:32px 0 30px;padding:0;border:7px solid #655b4d;border-radius:8px;background:#1a1e1c;color:var(--chalk);box-shadow:inset 0 0 0 2px #151715,inset 0 0 60px #0003,0 7px 0 -3px #857766,0 15px 25px #25291b12;overflow:visible}
.classroom-board::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.42' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' opacity='.35' d='M0 0h240v240H0z'/%3E%3C/svg%3E")}
.classroom-board .board-topline{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 38px;padding:20px 0 15px;border-bottom:1px solid #eeeee629;color:#dedfd4}
.classroom-board .board-topline span:first-child{font-size:10px;font-weight:500;letter-spacing:2.3px}
.classroom-board .board-topic{font:500 25px 'Caveat','Segoe Print',cursive;transform:rotate(2deg);white-space:nowrap}
.classroom-board .board-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:12px;padding:28px 38px 34px}
.classroom-board .board-copy{position:relative;z-index:2;padding:0 0 8px 8px}
.hero.classroom-board h1{font-family:'Caveat','Segoe Print',cursive;font-size:clamp(78px,9vw,112px);font-weight:600;letter-spacing:1px;line-height:.87;margin:0 0 29px;transform:rotate(-2deg);text-shadow:.7px .3px 0 #fffee588,-.5px .7px 1px #fffee555}
.classroom-board h1 span{font-size:.78em;display:block;line-height:1.05;position:relative;width:max-content;margin:1px 0 0 40px}
.classroom-board h1 span::after{content:'';position:absolute;left:-16px;right:-20px;bottom:-6px;height:4px;border-top:2px solid #f2f0e7b0;border-bottom:1px solid #f2f0e780;border-radius:50%;transform:rotate(-3deg)}
.hero.classroom-board .board-message{font:500 clamp(29px,3.2vw,40px)/1.12 'Caveat','Segoe Print',cursive;color:var(--chalk);max-width:none;margin:0 0 13px;transform:rotate(-1deg)}
.hero.classroom-board .board-intro{font-size:13px;line-height:1.7;color:#d1d4ca;max-width:320px;margin:0}
.hero.classroom-board .actions{gap:12px;margin:24px 0 19px}
.classroom-board .board-primary{background:#eeeee4;color:#252b26;border:1px solid #eeeee4;border-radius:5px 8px 6px 4px;font-size:13px;padding:13px 18px;box-shadow:0 2px 0 #ffffff30;transition:transform .2s,background .2s}
.classroom-board .board-primary:hover{transform:translateY(-2px);background:#fff}
.classroom-board .board-secondary{background:transparent;color:var(--chalk);border:1px solid #e9eddd80;border-radius:8px 4px 7px 5px;font-size:13px;padding:13px 17px;transition:background .2s}
.classroom-board .board-secondary:hover{background:#ffffff0e}
.classroom-board :is(a,button):focus-visible{outline:3px solid #fff;outline-offset:5px}
.classroom-board .board-schedule{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.3px;color:#c3c9bd;flex-wrap:wrap}
.classroom-board .board-schedule i{width:4px;height:4px;border-radius:50%;background:#d3d8c9}
.classroom-board .board-portrait{margin:0;align-self:stretch;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:0}
.classroom-board .board-portrait img{display:block;width:100%;height:auto;max-height:444px;object-fit:contain;mix-blend-mode:lighten;filter:contrast(1.16);mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent),linear-gradient(to bottom,transparent 0%,#000 7%,#000 87%,transparent 100%);mask-composite:intersect}
.classroom-board .board-portrait figcaption{font:500 clamp(22px,2.5vw,28px)/1.15 'Caveat','Segoe Print',cursive;text-align:center;transform:rotate(-2deg);margin:-15px -10px 0;position:relative;color:#ebece2}
.classroom-board .board-portrait figcaption span{font:400 10px 'DM Sans',Arial,sans-serif;letter-spacing:1.5px;display:block;margin:10px 0 0;color:#c0c8ba}
.classroom-board .board-tray{height:11px;background:#726859;border-top:1px solid #a6998470;box-shadow:0 4px 4px #0002;position:absolute;bottom:-10px;left:-12px;right:-12px;border-radius:2px}
.classroom-board .chalk-stick{position:absolute;bottom:10px;right:112px;background:#e9e7dc;width:42px;height:7px;border-radius:2px 3px 1px 2px;box-shadow:0 1px 2px #0006;transform:rotate(-3deg)}
.classroom-board .chalk-stick.second{right:163px;width:27px;height:6px;transform:rotate(4deg);background:#d8d8ce}
.classroom-board .board-eraser{position:absolute;right:29px;bottom:10px;width:56px;height:16px;background:#a89575;border-bottom:6px solid #454841;border-radius:3px 3px 1px 1px;transform:rotate(-3deg);box-shadow:0 2px 2px #0004}
@media(min-width:1100px){.classroom-board .board-main{padding-left:57px;padding-right:45px;gap:24px}.classroom-board .board-copy{padding-left:12px}}
@media(max-width:850px){.classroom-board .board-topline{margin:0 23px}.classroom-board .board-main{padding:28px 22px 34px;gap:4px;grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}.hero.classroom-board h1{font-size:83px}.classroom-board .board-copy{padding-left:0}.hero.classroom-board .board-message{font-size:33px}.classroom-board .board-portrait figcaption{font-size:23px}.hero.classroom-board .actions{gap:9px}.classroom-board .board-primary,.classroom-board .board-secondary{font-size:12px;padding:12px 14px}.classroom-board .board-portrait img{max-height:390px}.classroom-board .board-schedule{font-size:9px;gap:7px}}
@media(max-width:650px){.hero.classroom-board{margin-top:23px;border-width:5px}.classroom-board .board-topline{margin:0 19px;padding:15px 0 12px;gap:10px}.classroom-board .board-topline span:first-child{font-size:8px;letter-spacing:1.2px}.classroom-board .board-topic{font-size:21px}.classroom-board .board-main{grid-template-columns:1fr;padding:28px 24px 25px;gap:22px}.classroom-board .board-copy{text-align:center}.hero.classroom-board h1{font-size:97px;width:max-content;margin:0 auto 27px}.classroom-board h1 span{margin-left:29px}.hero.classroom-board .board-message{font-size:35px}.hero.classroom-board .board-intro{margin:auto;font-size:12px;max-width:240px}.hero.classroom-board .actions{justify-content:center;margin:21px 0 16px;gap:9px}.classroom-board .board-schedule{justify-content:center;line-height:1.8;font-size:9px}.classroom-board .board-portrait{width:min(100%,300px);margin:0 auto}.classroom-board .board-portrait img{max-height:325px}.classroom-board .board-portrait figcaption{font-size:26px;margin-top:-9px}.classroom-board .board-portrait figcaption span{font-size:9px;margin-top:8px}.classroom-board .board-tray{left:-9px;right:-9px}.classroom-board .chalk-stick{right:96px}.classroom-board .chalk-stick.second{right:147px}.classroom-board .board-eraser{right:19px}}

/* White chalk signature in the middle of the classroom board. */
.classroom-board .board-brand-chalk{position:absolute;z-index:3;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-6deg);width:190px;text-align:center;color:#edece1;pointer-events:none;font-family:'Caveat','Segoe Print',cursive;filter:contrast(1.05);text-shadow:1px 0 #fff5,-.8px .4px #fff4,0 0 1px #fff7;opacity:.92}
.board-brand-chalk span{display:block;font-size:44px;line-height:.8;font-weight:500}.board-brand-chalk strong{font-size:58px;line-height:1.04;font-weight:600;display:block;letter-spacing:.4px}.board-brand-chalk i{display:block;width:128px;height:6px;border-top:2px solid #f1f0e3ba;border-bottom:1px solid #f1f0e344;border-radius:50%;margin:9px auto 0;transform:rotate(-3deg)}
@media(min-width:1000px){.classroom-board .board-brand-chalk{left:49%;top:47%}}
@media(min-width:651px) and (max-width:999px){.classroom-board .board-brand-chalk{left:51%;top:40%;width:140px;transform:translate(-50%,-50%) rotate(-6deg)}.board-brand-chalk span{font-size:30px}.board-brand-chalk strong{font-size:42px}.board-brand-chalk i{width:100px}}
@media(max-width:650px){.classroom-board .board-brand-chalk{position:relative;left:auto;top:auto;width:max-content;margin:22px auto 0;transform:rotate(-4deg)}.board-brand-chalk span{font-size:25px;display:inline;margin-right:6px}.board-brand-chalk strong{font-size:39px;display:inline}.board-brand-chalk i{width:150px;margin-top:3px}.classroom-board .board-main{padding-top:22px}}