/* Editorial project pages: one story, with working examples and optional evidence. */
.story-page .masthead .hero{max-width:850px;padding:30px 0 36px}
.story-page .masthead h1{max-width:800px;font-size:clamp(30px,4.2vw,44px);line-height:1.18;font-weight:500}
.story-page .masthead .sub{max-width:730px;font-size:17px;line-height:1.65}
.case-jump{display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:22px}
.case-jump a{color:#dcecfb;font-size:14px;text-underline-offset:5px}
.case-jump a:hover{color:#70e4cc}
.case-breadcrumb{display:flex;flex-wrap:wrap;gap:18px;align-items:center;padding:22px 0 4px;font-size:13px;color:var(--muted)}
.case-breadcrumb a,.case-copy a,.case-links a{color:var(--accent);text-underline-offset:4px}
.case-article{padding-top:8px}
.case-copy{max-width:760px;padding:22px 0 6px}
.case-copy h2{font-size:23px;line-height:1.3;font-weight:500;margin:0 0 12px;color:var(--ink)}
.case-copy p{font-size:16px;line-height:1.8;font-weight:300;color:var(--ink2);margin:0 0 14px}
.case-demo{padding:20px 0 14px;scroll-margin-top:24px}
.case-demo>.case-copy{padding-top:0}
.case-demo>.panel,.case-demo>.demo-app{margin-top:8px}
.case-demo .panel h3,.case-detail-body .panel h3{font-size:17px;line-height:1.4;font-weight:500}
.case-demo .note-small,.case-comparison .note-small{font-size:13px;line-height:1.65}
.case-comparison{max-width:1000px;margin:20px 0 6px}
.case-comparison .tbl{font-size:14px}
.case-comparison .tbl th{white-space:normal;min-width:135px}
.case-comparison .tbl th:first-child{min-width:190px}
.case-details{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin:24px 0 0;padding:18px 0}
.case-details+.case-details{border-top:0;margin-top:0}
.case-details>summary{font-size:16px;font-weight:500;line-height:1.5;color:var(--ink);cursor:pointer;min-height:28px}
.case-details>summary:hover{color:var(--accent)}
.case-details[open]>summary{margin-bottom:18px}
.case-detail-body{min-width:0}
.case-detail-body .panel{margin-bottom:14px}
.case-detail-body .note-small{font-size:13px;line-height:1.65}
.story-page .model-evidence{max-width:760px;padding:16px 20px;margin:20px 0;border:0;border-left:3px solid #08765f;border-radius:0;background:#eaf3f1}
.story-page .model-evidence-claim{font-size:17px;line-height:1.5;font-weight:500;margin:6px 0}
.story-page .model-evidence-detail,.story-page .model-evidence-caveat{font-size:13px;line-height:1.6;margin:6px 0}
.story-page .model-evidence-label,.story-page .model-evidence-link{font-size:12px}
.story-page .case-demo .tile .v{font-size:20px;font-weight:500}
.story-page .hero-num .big,.story-page .hero-num .mid{font-size:24px;font-weight:500}
.story-page .implementation-details{margin-top:20px}
.story-page .case-details .implementation-details{margin-top:0}
.story-page .rec-grid{margin-top:16px}
.story-page .case-demo .case-details{margin:14px 0}
.case-links{display:flex;flex-wrap:wrap;gap:14px 28px;margin-top:36px;padding:24px 0 8px;border-top:1px solid var(--hair);font-size:14px}
.case-status{font-size:16px;line-height:1.7;color:var(--ink);margin:8px 0 18px}
.story-page .le-card .m{font-size:22px;font-weight:500}
.story-page .le-card .s{font-size:13px;line-height:1.6}
.story-page .le-card .pill{font-size:12px}
.story-page .le-spark svg [stroke="#EAF0F8"]{stroke:#526a82}
.story-page .le-spark svg [fill="#EAF0F8"]{fill:#18334f}
.story-page summary:focus-visible,.case-jump a:focus-visible,.case-links a:focus-visible{outline:3px solid #3987e5;outline-offset:5px}
.story-page [id]{scroll-margin-top:24px}
@media(max-width:640px){
 .story-page .masthead .hero{padding:24px 0 28px}
 .story-page .masthead .sub{font-size:16px}
 .case-copy{padding-top:20px}
 .case-copy h2{font-size:21px}
 .case-copy p{font-size:15px;line-height:1.75}
 .case-demo{padding-top:16px}
 .story-page .case-demo .panel{padding:16px 12px}
 .story-page .model-evidence{padding:14px 16px}
 .case-comparison .tbl{font-size:13px}
 .case-links{gap:14px 22px}
}

.story-page .le-card .pill{display:inline-block;margin:8px 0 12px}
.le-card-details{margin-top:14px;border-top:1px solid var(--hair);padding-top:12px}
.le-card-details>summary{font-size:13px;cursor:pointer;color:var(--accent)}
.le-card-details[open]>summary{margin-bottom:12px}