.systems-story{background:var(--surface-blue);color:#fff;margin-top:0;position:relative}.system-story-stage{padding:65px 0}.systems-story-heading{text-align:center;margin-bottom:40px}.systems-story-heading .kicker{color:#aec8d9;font-size:12px;letter-spacing:.18em}.systems-story-heading h2{font-weight:400;font-size:clamp(29px,3.8vw,49px);margin:12px 0}.systems-story-heading>p:last-child{font-size:16px;color:#bdcfdd;margin:12px 0 0}
.system-chapter{display:grid;grid-template-columns:1fr 1.15fr;gap:6%;align-items:center;padding:48px 0;border-top:1px solid #ffffff25}.system-chapter-number{font-size:12px;letter-spacing:.12em;color:#e6cc97;margin:0 0 20px}.system-story-copy h3{font-size:clamp(29px,3.6vw,46px);font-weight:400;line-height:1.45;margin:0 0 24px;letter-spacing:-.025em}.system-recommendation{font:400 22px Prompt,sans-serif;color:#e5cf9d;margin:0 0 8px}.system-story-tag{font-size:16px;color:#bdcfdd;margin:0}
.system-flow-diagram svg{width:100%;display:block;overflow:visible}.system-nodes rect{fill:#153b57;stroke:#aac5d466;stroke-width:1}.system-nodes text{font:16px 'Noto Sans Thai',sans-serif;fill:#edf4f7;text-anchor:middle}.system-path-base{stroke:#a0bac94d;stroke-width:1.2}.system-flow{stroke:#e6cc97;stroke-width:1.7;stroke-linecap:round}.system-caution{font-size:14px;line-height:1.9;color:#c6d7e2;margin:20px auto 0;max-width:450px;text-align:center;padding-top:18px;border-top:1px solid #ffffff20}.system-flow-caption{text-align:center;font-size:12px;color:#9fb8cb;margin:18px 0 0}
.systems-story.scroll-enhanced{height:340svh}.systems-story.scroll-enhanced .system-story-stage{padding-top:35px;padding-bottom:90px;min-height:0}.system-story-chapters{position:relative}.scroll-enhanced .system-story-chapters{height:350px}.scroll-enhanced .system-chapter{border:0;padding:15px 0}.system-story-nav{justify-content:center}.system-story-nav button{text-align:center;min-width:145px}.systems-story.in-view.scroll-enhanced .is-current .system-flow{stroke-dasharray:5 13;animation:energy-travel 2.4s linear infinite}.systems-story.scroll-enhanced .system-flow{opacity:.85}
@keyframes energy-travel{to{stroke-dashoffset:-72}}
.systems-depth{padding-top:42px;padding-bottom:55px}.systems-depth>.kicker{font-size:11px;color:#718c9f;letter-spacing:.16em}.systems-depth>h3{font-size:25px;font-weight:400;color:#153e60;margin:10px 0 24px}.systems-depth summary{font-size:17px;min-height:65px;color:#153e60}.system-depth-copy{padding:0 0 20px;max-width:850px}.system-depth-copy p{font-size:16px;color:#61788a;line-height:1.9;margin:0 0 17px}.system-depth-copy b{display:block;color:#173b55;font-weight:500}.system-depth-copy .system-note{font-size:15px!important}
@media(max-width:720px){.system-story-stage{padding:45px 0}.systems-story-heading{margin-bottom:22px}.systems-story-heading h2{font-size:28px}.systems-story-heading .kicker{font-size:10px}.systems-story-heading>p:last-child{font-size:14px;margin-top:8px}.system-chapter{grid-template-columns:1fr;gap:20px;padding:35px 0}.system-chapter-number{font-size:11px;margin-bottom:12px}.system-story-copy h3{font-size:29px;margin-bottom:14px}.system-recommendation{font-size:20px;margin-bottom:5px}.system-story-tag{font-size:14px}.system-flow-diagram svg{max-height:210px}.system-caution{font-size:13px;margin-top:8px;padding-top:12px;line-height:1.8}.scroll-enhanced .system-story-chapters{height:430px}.scroll-enhanced .system-chapter{gap:15px}.system-story-nav button{min-width:0}.system-story-nav button span{font-size:13px;margin-left:6px}.system-flow-caption{font-size:11px;line-height:1.6;margin-top:12px}.systems-story.scroll-enhanced .system-story-stage{padding-top:22px;padding-bottom:85px}.systems-depth summary{font-size:15px}.system-depth-copy p{font-size:15px}.systems-depth{padding-top:30px;padding-bottom:40px}}
@media(max-width:720px) and (max-height:750px){.scroll-enhanced .systems-story-heading>p:last-child{display:none}.scroll-enhanced .systems-story-heading{margin-bottom:15px}.scroll-enhanced .systems-story-heading h2{font-size:25px}.scroll-enhanced .system-story-chapters{height:390px}.scroll-enhanced .system-story-copy h3{font-size:26px;margin-bottom:10px}.scroll-enhanced .system-flow-diagram svg{max-height:170px}.scroll-enhanced .system-chapter{gap:10px}.scroll-enhanced .system-caution{margin-top:2px;padding-top:8px}}
@media(prefers-reduced-motion:reduce){.system-flow{animation:none!important}}

/* Reserve the complete chapter, including its caption, before navigation. */
.systems-story.scroll-enhanced .system-story-chapters{display:grid;height:auto;min-height:0;position:relative}
.systems-story.scroll-enhanced .system-chapter[data-story-chapter]{position:relative;inset:auto;grid-area:1/1;align-self:center;min-width:0}
.systems-story.scroll-enhanced .system-story-nav{position:relative;clear:both;margin-top:28px}
@media(min-width:721px){
 .systems-story.scroll-enhanced .system-chapter svg{max-height:240px}
 .systems-story.scroll-enhanced .system-chapter{padding:12px 0}
}
@media(max-width:720px){
 .systems-story.scroll-enhanced .system-story-nav{margin-top:16px}
 .systems-story.scroll-enhanced .system-chapter{padding:8px 0}
}
