/* Complete generated grounds and uninterrupted reading surfaces. */
:root{--chapter-art:url('assets/section-desktop.png');--paper:#fffdfa;--rule:#dbcabb}
body{font-kerning:normal}
.label:before{display:none}
.label{font-size:14px;letter-spacing:.04em;color:var(--ink);margin-bottom:12px}
.cap{font-size:14px!important;line-height:1.85!important;color:#5e493b!important;text-align:left}
.hero{background:var(--paper)}
.hero-grid{gap:36px;align-items:start}
.hero-art{margin-top:12px;padding:0;background:none;border:0}
.hero-art:before{display:none}
.hero-visual{padding:16px;background-image:var(--chapter-art);background-size:100% 100%;background-repeat:no-repeat}
.hero-visual>.illustration{border:0;border-radius:2px}
.hero-art .cap{padding:0;margin-top:12px;background:var(--paper)}
.hero .cond-part.leaving{background:var(--paper)}
/* Comparison uses an open rail aligned with the illustrations. */
.comparison-opening{position:relative;padding:22px 36px 26px;margin-bottom:28px;border-left:4px solid #bc6c3e;background:#fbf1e6;isolation:isolate}
.comparison-opening:after{content:"";position:absolute;inset:0 0 0 auto;width:32%;background-image:var(--chapter-art);background-size:100% 100%;z-index:-1}
.comparison-opening h2{margin:0;font-size:36px;max-width:900px}
.comparison-opening .label{margin-bottom:8px}
.comparison-group{padding:0 0 22px;border-bottom:1px solid var(--rule)}
.comparison-group>.cap{border-top:0;margin-top:20px;padding:0;max-width:none}
.comparison-group>.ba-note{margin-top:10px}
.ba-card>.illustration{margin-bottom:16px}
.ba-tag{margin-bottom:12px}
/* Classroom has one complete header and a flush reading column. */
.cls .wrap{padding-top:0;border:0}
.class-opening{padding:36px 38px 40px;background-image:var(--chapter-art);background-size:100% 100%;background-repeat:no-repeat}
.class-opening h2{margin-bottom:20px}
.cls .class-opening>.big{max-width:920px;margin:0;padding:0;background:none;border:0;font-size:21px;line-height:1.9}
.cls .class-opening>.big:after{display:none}
.class-reading{margin:0 0 0 38px;padding:0;background:var(--paper);border:0}
.cls .class-reading>.spec{margin:0;padding:0;border:0}
.cls .class-reading>.spec>li{padding:28px 0 30px 146px}
.cls .class-reading>.spec>li>b{left:0;top:28px;width:126px;font-size:19px}
.cls .class-reading .spec-copy{max-width:790px}
.cls .class-reading .conclusion{margin-bottom:20px}
.cls .days{margin-top:8px;background:#f9f0e5;border:0;border-bottom:1px solid #d7c9b8}
.cls .pl{padding-inline:0}
/* Equipment has a contained image and an independently framed heading. */
.pc>.shape{position:relative;padding-top:0;border:0}
.pc>.shape:before{display:none}
.pc .shape>svg.illustration{display:block;grid-column:1;grid-row:1;align-self:start;margin:0;padding:16px;max-width:470px;background-image:var(--chapter-art);background-size:100% 100%;border:0;border-radius:0}
.pc .shape>.cap{grid-column:1;grid-row:2;margin:12px 0 0;padding:0;max-width:470px}
.equipment-opening{grid-column:2;grid-row:1/span 2;align-self:start;padding:24px 28px 28px;border-top:3px solid #bf7d52;border-bottom:1px solid var(--rule);background:#faf0e4}
.equipment-opening h2{margin-bottom:20px}
.equipment-opening>.big{margin:0}
.pc .shape>div>.spec{margin-top:32px;border-top:1px solid var(--rule)}
.pc .shape>div>.spec>li{grid-template-columns:172px minmax(0,1fr);padding:28px 0!important;gap:28px;border:0}
.pc .shape>div>.spec>li+li{border-top:1px solid #e1d4c5}
.pc .shape>div>.spec>li:nth-child(2){margin:0;padding:28px 24px!important;background:#fcf3e9;border:0}
.pc .shape>div>.spec>li>b{margin:0;font-size:19px}
.pc .shape>div>p:not(.big):not(.src){margin-inline:0;padding:12px 0 12px 24px;max-width:100%;background:transparent;border-top:0}
.pc .spec-copy>.reading-group+.reading-group{margin-top:20px}
/* Experience uses a sideways opening and a shared preparation surface. */
.experience>.wrap{padding-top:20px}
.trial-opening{display:grid;grid-template-columns:180px minmax(0,1fr);align-items:start;gap:24px;padding:28px 0;border-top:3px solid #bc6c3e;border-bottom:1px solid var(--rule);margin-bottom:28px}
.trial-opening .label{margin:10px 0 0;padding-left:16px;border-left:2px solid #d7ae90}
.trial-opening h2{margin:0;font-size:38px}
.steps{gap:40px;padding:28px 32px 30px;margin-top:0;background:#f8eee2;border:0}
.step{grid-template-rows:minmax(40px,auto) auto;border:0;padding-top:0;column-gap:14px}
.step h3{min-height:0;align-self:start;padding-top:2px}
.step>p{margin-top:12px;color:var(--ink)}
.step>.no{background:var(--paper)}
.wrap>p.big.mid{margin-top:32px;margin-bottom:24px;border:0;padding:0;background:none;font-size:20px}
.scenes{gap:30px;padding:0;background:none}
.scenes:before,.scene:before{display:none}
.scene{padding:0;border:0;background:none}
.scene>.illustration{border-radius:2px;margin-bottom:20px;border-bottom:3px solid #e6c6a8}
.scene .body{grid-template-rows:minmax(40px,auto) auto;padding:0}
.scene .body>p{margin-top:10px}
.scene .no{background:#f2e2ce}
.scenes-group{padding:20px 22px 22px;border-inline:1px solid #dfd0c0;border-bottom:1px solid #dfd0c0;background:var(--paper)}
.scenes-group>.cap{margin:22px 0 0;border-top:1px solid var(--rule);padding-top:14px}
.parent-note{padding-top:24px}
.parent-note>p.big{padding:26px 30px;background:#f5e9da;border:0;width:100%}
.parent-note>p:not(.big){max-width:none;padding-inline:30px}
.parent-note>p.source-note{padding-bottom:16px;border-color:var(--rule)}
/* Ledger uses aligned rules, with emphasis reserved for decisions. */
.pricing{background:#f3ede5;padding-block:44px 56px}
.terms{background:var(--paper);border:1px solid #d6c0ac;padding:0 32px 16px}
.terms-opening{margin:0;padding:30px 0;border-top:3px solid #bb7950;border-bottom:1px solid var(--rule);background:none}
.terms-opening h2{font-size:40px;margin-bottom:16px}
.terms-opening .sum{margin:0;max-width:none;background:none;color:var(--ink)}
.terms dl{border-top:0}
.trow{grid-template-columns:150px minmax(0,1fr);column-gap:28px;margin:0;padding:28px 0;border-top:0;border-bottom:1px solid #dfd2c3}
.trow dt{font-size:19px;padding-top:1px}
.trow dd{max-width:none;margin:0}
.trow .answer-summary,.answer-summary>.answer{font-size:20px;font-weight:700;line-height:1.85}
.answer-summary .price-line{font-size:18px}
.answer-summary .price-value,.answer-summary .yen{font-size:25px;white-space:nowrap}
.answer-summary .plan-detail{font-size:16px;font-weight:400}
.trow.key,.trow.decision-row.key{margin:0;padding:28px 0;background:none;border:0;border-bottom:1px solid #dfd2c3}
.trow.key dt,.trow.key dd{margin:0}
.trow.key .answer-summary{background:#f9ecdc;padding:18px 24px;margin-bottom:24px}
.trow.decision-row.key .answer-summary{background:#f1e9dd}
.trow.decision-row:not(.key){padding:28px 0 32px;border-bottom:1px solid #b6a18a}
.trow.decision-row:not(.key) dt{border-left:3px solid #b18c6b;padding-left:14px}
.trow.decision-row:not(.key) .answer-summary{padding-bottom:12px;border-bottom:1px solid #cdb8a2;color:#783e20;max-width:max-content}
.trow:nth-child(7){padding:30px 0 36px;border-bottom:3px double #c8b6a1}
.trow:nth-child(7) dt{border-left:3px solid #c5ae96;padding-left:14px}
.trow:nth-child(7) .answer-summary{padding:16px 20px;border-left:1px solid #d0bca7;background:#fbf4ec}
.trow:nth-child(n+8){padding:28px 0}
.trow:nth-child(n+8) dt{font-size:18px}
.trow dd small.details{margin-top:20px;font-size:16px;line-height:1.95;color:var(--ink)}
.trow dd small .reading-group+.reading-group{margin-top:20px}
.trow.key .details{margin-top:0}
.trow:last-child{border-bottom:0}
.terms .answer-summary .price-line+.plan-detail{margin-top:18px}
.terms .answer-summary .plan-detail+.plan-detail{margin-top:10px}
.pricing .final .cond{background:var(--paper);padding:24px 28px;margin-top:28px}
.pricing .final .cond .leaving{background:#f8f3ed}
@media(min-width:860px){
 .hero h1{font-size:56px}
 .class-opening h2{font-size:38px}
 .pc>.shape{grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);column-gap:36px}
 .equipment-opening h2{font-size:32px}
}
@media(max-width:859px){
 :root{--chapter-art:url('assets/section-mobile.png')}
 .hero-grid{gap:0;padding-top:12px}
 .hero .eyebrow{margin-bottom:4px}
 .hero h1{margin:8px 0 12px}
 .hero-art{margin:0 0 12px;padding:0;width:100%;max-width:400px}
 .hero-visual{padding:8px 10px;background-size:100% 100%}
 .hero-visual>.illustration{max-height:190px;width:auto;max-width:100%;margin:auto;border-radius:2px}
 .hero-art .cap{margin-top:6px;line-height:1.7!important}
 .hero .lead{font-size:16px;line-height:1.8}
 .hero .cta{margin-top:14px}
 .hero .cond{margin-top:22px}
 .comparison-opening{padding:22px 20px 24px;margin-bottom:20px}
 .comparison-opening:after{width:30%}
 .comparison-opening h2{font-size:28px}
 .comparison-group{padding-bottom:20px}
 .comparison-group>.cap{margin-top:18px}
 .class-opening{padding:28px 24px 30px}
 .class-opening h2{font-size:29px;margin-bottom:20px}
 .cls .class-opening>.big{font-size:20px;line-height:1.85}
 .class-reading{margin:0;padding:0;border:0}
 .cls .class-reading>.spec>li{padding:24px 0 28px}
 .cls .class-reading>.spec>li>b{width:auto;font-size:20px;margin-bottom:16px}
 .cls .class-reading .conclusion{font-size:16px;margin-bottom:18px}
 .cls .days{margin-top:4px}
 .pc>.shape{padding-top:0}
 .equipment-opening{order:0;padding:24px 20px;margin-bottom:20px}
 .equipment-opening h2{font-size:28px;margin-bottom:20px}
 .pc .shape>svg.illustration{order:1;padding:12px;max-width:430px;width:100%;margin-inline:auto}
 .pc .shape>.cap{margin:12px 0 24px;padding:0}
 .pc .shape>div>.spec{margin-top:8px}
 .pc .shape>div>.spec>li,.pc .shape>div>.spec>li:nth-child(2){padding:26px 16px!important;margin:0}
 .pc .shape>div>.spec>li>b{font-size:20px;margin-bottom:14px}
 .pc .shape>div>p:not(.big):not(.src){padding-left:18px}
 .experience>.wrap{padding-top:20px}
 .trial-opening{display:block;padding:22px 0 24px;margin-bottom:24px}
 .trial-opening .label{margin:0 0 14px;padding-left:14px}
 .trial-opening h2{font-size:29px;margin:0}
 .steps{gap:28px;padding:24px 20px 28px;margin-top:0}
 .step{grid-template-rows:auto auto;column-gap:14px}
 .step>p{margin-top:12px}
 .wrap>p.big.mid{margin-top:30px;font-size:19px;line-height:1.9}
 .scenes{padding:0;gap:32px}
 .scenes-group{padding:16px 16px 20px}
 .scene .body{grid-template-rows:auto auto}
 .scene .body>p{margin-top:12px}
 .scene>.illustration{margin-bottom:18px}
 .scene h3{font-size:20px}
 .scenes-group>.cap{margin:22px 0 0;padding-top:14px}
 .parent-note{padding-top:8px}
 .parent-note>p.big{padding:24px 20px;font-size:20px}
 .parent-note>p:not(.big){padding-inline:0}
 .pricing{padding-block:36px 44px}
 .terms{margin-inline:0;padding:0 18px 8px}
 .terms-opening{margin:0;padding:26px 0}
 .terms-opening h2{font-size:30px}
 .terms-opening .sum{line-height:1.95}
 .trow,.trow.key,.trow.decision-row.key,.trow.decision-row:not(.key),.trow:nth-child(7),.trow:nth-child(n+8){padding:26px 0;grid-template-columns:1fr;gap:14px;margin:0}
 .trow dt{font-size:20px}
 .trow dd small.details{margin-top:20px}
 .trow.key .answer-summary{padding:18px 14px;margin-bottom:20px}
 .answer-summary .price-value,.answer-summary .yen{font-size:24px}
 .trow.key .details{margin-top:0}
 .trow:nth-child(7){padding-bottom:34px}
 .trow:nth-child(7) .answer-summary{padding-inline:14px}
 .trow:nth-child(n+8) dt{font-size:19px}
 .pricing .final .cond{padding:24px 16px}
}
@media(max-width:359px){
 .hero-visual>.illustration{max-height:164px}
 .comparison-opening{padding-inline:16px}
 .comparison-opening h2{font-size:26px}
 .class-opening{padding-inline:18px}
 .class-opening h2{font-size:26px}
 .equipment-opening{padding-inline:16px}
 .equipment-opening h2{font-size:25px}
 .steps{padding-inline:16px}
 .scenes-group{padding-inline:12px}
 .terms{padding-inline:14px}
 .terms-opening h2{font-size:28px}
 .trow.key .answer-summary{padding-inline:10px}
 .answer-summary .price-value,.answer-summary .yen{font-size:23px}
}

@media(min-width:860px){
 .pc .shape>div>.spec{grid-row:3}
 .pc .shape>div>.spec>li,.pc .shape>div>.spec>li:nth-child(2){padding:28px 24px!important}
}

.comparison-group{padding:20px 24px 22px;background:#fbf8f3;border-inline:1px solid #e2d6c9}
@media(max-width:859px){.comparison-group{padding:16px 16px 20px}}
@media(max-width:359px){.comparison-group{padding-inline:12px}}

@media(max-width:859px){
 .pc .shape>div>.equipment-opening{display:contents}
 .equipment-opening>.label{order:0;align-self:stretch;display:flex;margin:0;padding:22px 20px 6px;background:#faf0e4;border-top:3px solid #bf7d52}
 .equipment-opening>h2{order:0;margin:0 0 20px;padding:12px 20px 24px;background:#faf0e4;border-bottom:1px solid var(--rule)}
 .equipment-opening>.big{order:2;margin:0 0 22px;padding:0;background:none;border:0}
}
@media(max-width:359px){
 .equipment-opening>.label{padding-inline:16px}
 .equipment-opening>h2{padding-inline:16px}
}