/* Selected artwork; styles are scoped to the hero. */
.hero .hero-art.process-composition{--art-connection:#829c87;--art-page-line:#b7c9b8;--art-research-paper:#e1e9db;--art-outline-branch:#99ad99;--art-outline-rule:#c5d2c1;--art-spine:#688877;--art-page-edge:#e4ebdd;--art-edge-rule:#99ae9a;--art-cover-rule:#a5bfac;--art-cover-line:#9ab39f;--art-chapter-mark:#bed1bc;--art-plan-rule:#c5d3c1;--art-plan-cell:#e9eee3;--art-slide-back:#aabfac;--art-slide-line:#809c86;--art-slide-block:#527a61;--art-slide-block-soft:#9ab69d;display:block;position:relative;width:100%;aspect-ratio:1;min-height:0;max-width:none;margin:0;padding:0;overflow:visible;background:none;container-type:inline-size;isolation:isolate}
.hero .hero-art.process-composition::before{display:none}
.hero .process-composition .composition-inner{position:absolute;inset:0;font-family:var(--sans);color:var(--ink)}
.hero .process-composition .composition-inner span{display:block}
.hero .process-composition .connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hero .process-composition .connections path{fill:none;stroke:var(--art-connection);stroke-width:1.5}
.hero .process-composition .connections .flow-line{stroke-width:1.35;vector-effect:non-scaling-stroke}
.hero .process-composition .process-verb{position:absolute;font-size:max(13px,3.2cqw);font-weight:500;line-height:1.35;white-space:nowrap;color:var(--accent)}
.hero .process-composition .verb-research{left:3%;top:41%}
.hero .process-composition .verb-produce{left:56%;top:21%}
.hero .process-composition .object-title{font-family:var(--display);font-weight:600;line-height:1.2;white-space:nowrap}
.hero .process-composition .page-lines{display:flex;flex-direction:column;gap:1.2cqw}
.hero .process-composition .page-lines i{display:block;height:1px;background:var(--art-page-line);width:100%}
.hero .process-composition .page-lines i:nth-child(2){width:82%}
.hero .process-composition .page-lines i:last-child{width:66%}
.hero .process-composition .research-page{position:absolute;left:23%;top:9%;width:20%;height:26%;padding:3cqw 2.6cqw;background:var(--art-research-paper);transform:rotate(9deg)}
.hero .process-composition .research-page>span{font-size:max(11px,2.4cqw);margin-bottom:2.6cqw;color:var(--ink-soft)}
.hero .process-composition .outline-sheet{position:absolute;left:4%;top:5%;width:24%;height:27%;padding:3.5cqw 2.7cqw;background:var(--white);transform:rotate(-7deg);box-shadow:0 15px 24px -17px rgba(var(--ink-rgb), .2705882353)}
.hero .process-composition .outline-sheet .object-title{font-size:max(12px,3.3cqw)}
.hero .process-composition .outline-structure{margin-top:3cqw}
.hero .process-composition .outline-structure i{display:block;height:3.6cqw;border-left:1px solid var(--art-outline-branch);border-bottom:1px solid var(--art-outline-rule);margin-bottom:1.2cqw}
.hero .process-composition .outline-structure i:nth-child(2){margin-left:2cqw;width:72%}
.hero .process-composition .textbook{position:absolute;left:31%;top:37%;width:29%;height:39%;padding:5.5cqw 4.6cqw;background:var(--accent);color:var(--white);transform:rotate(-5deg);border-radius:1px 5px 5px 1px;box-shadow:0 20px 35px -22px rgba(var(--ink-rgb), .4)}
.hero .process-composition .textbook:before{position:absolute;content:"";left:1.4cqw;top:0;bottom:0;width:1px;background:var(--art-spine)}
.hero .process-composition .textbook:after{position:absolute;content:"";left:.7cqw;right:0;bottom:-.8cqw;height:.8cqw;background:var(--art-page-edge);border-bottom:1px solid var(--art-edge-rule);border-radius:0 0 3px 1px;z-index:-1}
.hero .process-composition .textbook .object-title{font-size:6cqw}
.hero .process-composition .cover-divider{height:1px;background:var(--art-cover-rule);margin:4cqw 0 2cqw}
.hero .process-composition .textbook .page-lines i{background:var(--art-cover-line)}
.hero .process-composition .chapter-mark{position:absolute;left:4.6cqw;bottom:5cqw;display:flex;gap:.8cqw}
.hero .process-composition .chapter-mark i{height:1px;width:3cqw;background:var(--art-chapter-mark)}
.hero .process-composition .lesson-plan{position:absolute;left:70%;top:39%;width:20%;height:26%;padding:3cqw 2.4cqw;background:var(--white);transform:rotate(7deg);box-shadow:0 13px 22px -17px rgba(var(--ink-rgb), .2705882353)}
.hero .process-composition .lesson-plan .object-title{font-size:max(13px,3.4cqw)}
.hero .process-composition .plan-table{margin-top:2.8cqw}
.hero .process-composition .plan-table i{display:block;height:4.4cqw;border-top:1px solid var(--art-plan-rule);background:linear-gradient(90deg,var(--art-plan-cell) 30%,transparent 30%)}
.hero .process-composition .slide-stack{position:absolute;left:60%;top:66%;width:36%;height:21%;transform:rotate(-3deg)}
.hero .process-composition .slide-stack:before{content:"";position:absolute;inset:-1cqw 1.4cqw 1cqw -.8cqw;background:var(--art-slide-back);transform:rotate(4deg)}
.hero .process-composition .slide-sheet{position:absolute;inset:0;background:var(--accent-light);padding:3cqw 3.2cqw;box-shadow:0 14px 24px -18px rgba(var(--ink-rgb), .2705882353)}
.hero .process-composition .slide-sheet .object-title{font-size:max(13px,3.8cqw)}
.hero .process-composition .slide-content{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3cqw;margin-top:2.2cqw}
.hero .process-composition .slide-sheet .page-lines i{background:var(--art-slide-line)}
.hero .process-composition .slide-layout{display:flex;align-items:flex-end;gap:1cqw;height:5.5cqw}
.hero .process-composition .slide-layout i{display:block;width:50%;height:100%;background:var(--art-slide-block)}
.hero .process-composition .slide-layout i:last-child{height:70%;background:var(--art-slide-block-soft)}
.hero .process-composition .narrated-material{position:absolute;left:61%;top:90%;width:36%;height:8%;display:flex;align-items:center;padding:1.6cqw 2cqw;gap:1.2cqw;background:var(--white);transform:rotate(2deg);box-shadow:0 10px 20px -16px rgba(var(--ink-rgb), .2705882353)}
.hero .process-composition .narrated-material .object-title{font-size:max(11px,2.5cqw);flex-shrink:0}
.hero .process-composition .narrated-material svg{flex:1;min-width:0;height:auto;width:12cqw;fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round}


@media(max-width:980px){
 .hero .hero-art.process-composition{max-width:600px;justify-self:center;margin-bottom:20px}
}
@media(max-width:480px){
 .hero .process-composition .process-verb{font-size:13px}
 .hero .hero-art.process-composition{margin-bottom:24px}
 .hero .process-composition .verb-research{left:2%}
 .hero .process-composition .verb-produce{left:54%;top:19%}
}