/* Opt-in editorial case pattern; other cases retain their existing presentation. */
.case-shell[data-layout=editorial]{color:var(--case-ink,#002b42);background:var(--case-surface,var(--hover-color,#B4E4FF))}
.case-shell[data-layout=editorial] .case-toolbar{height:86px;padding:0 4.6%;position:relative;z-index:4}
.case-shell[data-layout=editorial] .case-breadcrumb{font-size:clamp(28px,3.2vw,48px);font-weight:800;letter-spacing:-.055em;color:#fff;order:2;margin-left:auto;margin-right:20px}
.case-shell[data-layout=editorial] .close{order:3;background:#ffffff50;color:#002b42}
.case-shell[data-layout=editorial] .case-scroll{height:calc(100% - 86px);scroll-behavior:smooth}
.case-shell[data-layout=editorial] .case-layout{grid-template-columns:54% 46%;padding:0 4.6%}
.case-shell[data-layout=editorial] .case-text{padding-right:9%;position:relative;z-index:2}
.case-shell[data-layout=editorial] .chapter{min-height:88svh;padding:80px 0 100px;justify-content:center;gap:0}
.case-shell[data-layout=editorial] .case-overview{min-height:calc(100svh - 240px);padding:35px 0 85px;justify-content:flex-start}
.case-shell[data-layout=editorial] .chapter h2{font-size:clamp(42px,5.2vw,80px);line-height:1.08;letter-spacing:-.035em;margin:0 0 35px}
.case-shell[data-layout=editorial] .chapter p{font-size:clamp(17px,1.4vw,22px);line-height:1.5;max-width:540px}
.case-contribution{margin-top:30px}
.case-contribution h3{font-size:14px;font-weight:500;margin:0 0 10px;letter-spacing:.02em}
.case-shell[data-layout=editorial] .facts{margin-top:30px;gap:8px}
.case-shell[data-layout=editorial] .facts span{background:#002b4233;color:#002b42;border-radius:10px;font-size:13px;padding:10px 13px}
.case-shell[data-layout=editorial] .visual-stage{height:calc(100svh - 142px);overflow:hidden;margin-right:-11%;isolation:isolate}
.case-shell[data-layout=editorial] .visual-stage .visual-scene{inset:0;opacity:1;transform:none;transition:none;will-change:transform;padding:6% 9% 6% 1%;align-items:center}
.case-shell[data-layout=editorial] .visual-stage .visual-scene[data-visual-type=image]{padding:0;align-items:flex-end}
.editorial-image{position:absolute;width:145%;max-width:none;height:auto;left:-20%;top:-8%;clip-path:inset(31% 0 0);flex-shrink:0}
.case-shell[data-layout=editorial] .chapter-nav{display:none}
.course-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%;transform:rotate(-3deg)}
.course-tile{aspect-ratio:.85;border-radius:24px;position:relative;overflow:hidden;background:#d4ecdf;padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.course-tile>span:first-child{font-size:13px}.course-tile strong{font-size:clamp(22px,2vw,34px);font-weight:400;position:relative;z-index:1}.course-1{background:#f9d9d4}.course-2{background:#f8e7b5}.course-3{background:#d9d4ec}
.course-orbit{width:145px;height:145px;border:28px solid #002b421c;border-radius:50%;position:absolute;right:-45px;top:30%}
.product-flow{width:100%;display:flex;gap:14px;align-items:center;transform:rotate(3deg)}
.product-screen{flex:1;min-width:0;aspect-ratio:.5;border:5px solid #002b42;border-radius:28px;background:#f8f7f0;padding:18px 12px;display:flex;flex-direction:column;box-shadow:0 18px 24px #002b4210}
.product-screen:nth-child(2){transform:translateY(45px);background:#e2eee6}.product-screen:nth-child(3){transform:translateY(-25px);background:#f8e5dc}
.screen-brand{font-size:23px;font-weight:800;letter-spacing:-.04em}.screen-step{font-size:10px;margin-top:24px}.product-screen strong{font-size:clamp(14px,1.25vw,20px);font-weight:400;margin-top:16px}.screen-lines{height:70px;margin-top:20px;background:repeating-linear-gradient(transparent 0 12px,#002b4220 12px 15px,transparent 15px 20px)}.screen-cta{margin-top:auto;font-size:10px;border-top:1px solid #002b4233;padding-top:12px;display:flex;justify-content:space-between}
.course-system,.case-statement{width:100%;padding:45px;border-radius:28px;background:#002b42;color:#b4e4ff;display:flex;flex-direction:column;gap:30px}.course-system strong,.case-statement strong{font-size:clamp(30px,3vw,48px);font-weight:400;line-height:1.12}.system-label,.case-statement>span{font-size:14px}.system-parts{display:flex;flex-wrap:wrap;gap:8px}.system-parts span{border:1px solid #b4e4ff55;border-radius:30px;padding:10px 14px;font-size:13px}.system-rhythm{display:flex;gap:12px;align-items:flex-end;height:120px}.system-rhythm i{flex:1;border-radius:16px;background:#b4e4ff;height:80%}.system-rhythm i:nth-child(2){height:100%;background:#f9d9d4}.system-rhythm i:nth-child(3){height:60%;background:#f8e7b5}.system-rhythm i:nth-child(4){height:90%;background:#d9d4ec}
.case-statement{min-height:55%;justify-content:center;background:#d4ecdf;color:#002b42}
@media(max-width:1000px) and (min-width:651px){.case-shell[data-layout=editorial] .case-layout{grid-template-columns:55% 45%}.case-shell[data-layout=editorial] .chapter h2{font-size:48px}.course-tile{padding:16px}.product-flow{gap:7px}.product-screen{border-width:3px;padding:13px 7px;border-radius:20px}.course-system,.case-statement{padding:27px}}
@media(max-width:650px){.case-shell[data-layout=editorial] .case-toolbar{height:64px;padding:0 24px}.case-shell[data-layout=editorial] .case-breadcrumb{font-size:32px}.case-shell[data-layout=editorial] .case-scroll{height:calc(100% - 64px)}.case-shell[data-layout=editorial] .case-layout{display:block;padding:0 24px}.case-shell[data-layout=editorial] .case-text{padding:0}.case-shell[data-layout=editorial] .chapter{min-height:0;padding:45px 0 50px}.case-shell[data-layout=editorial] .case-overview{padding-top:20px}.case-shell[data-layout=editorial] .chapter h2{font-size:43px;margin-bottom:24px}.case-shell[data-layout=editorial] .chapter p{font-size:17px}.case-shell[data-layout=editorial] .visual-column{display:none}.case-shell[data-layout=editorial] .mobile-visual{height:390px;border-radius:0;overflow:hidden;margin:30px -24px -50px}.case-shell[data-layout=editorial] .mobile-visual .visual-scene{padding:20px 24px;opacity:1;transform:none;transition:none}.case-shell[data-layout=editorial] .mobile-visual [data-visual-type=image]{padding:0}.editorial-image{width:140%;height:auto;top:-25%;left:-20%}.course-grid{max-width:310px;gap:12px;transform:none}.course-tile{padding:18px;border-radius:18px}.product-flow{max-width:340px;gap:9px;transform:none}.product-screen{padding:14px 9px;border-width:3px;border-radius:20px}.course-system,.case-statement{padding:30px;max-width:340px}.course-system strong,.case-statement strong{font-size:34px}}
@media(prefers-reduced-motion:reduce){.case-shell[data-layout=editorial] .visual-scene{will-change:auto}}
/* Full-bleed imagery belongs to the case canvas, not the scrolling text box. */
.case-shell[data-layout=editorial]>.visual-column{position:absolute;right:0;top:86px;bottom:0;width:46%;z-index:1;pointer-events:none}
.case-shell[data-layout=editorial] .visual-stage{position:relative;top:auto;height:100%;margin:0;overflow:visible}
.case-shell[data-layout=editorial] .case-scroll{position:relative;z-index:2}
.case-shell[data-layout=editorial] .case-breadcrumb{order:0;margin-left:0;margin-right:auto}
.case-shell[data-layout=editorial] .editorial-image{width:118%;left:-5%;top:24%;height:auto;clip-path:none}
.case-shell[data-layout=editorial] .facts{margin:0 0 30px}
.case-shell[data-layout=editorial] .facts span{color:#fff;background:#002b4299;display:inline-flex;align-items:center;justify-content:center;min-height:40px}
.case-shell[data-layout=editorial] .facts .tool-pill{width:42px;padding:9px}
.tool-pill svg{height:24px;width:24px;display:block}.tool-pill[aria-label=Figma] svg{width:16px}
@media(max-width:650px){.case-shell[data-layout=editorial]>.visual-column{display:none}.case-shell[data-layout=editorial] .editorial-image{width:120%;top:5%;left:-10%}.case-shell[data-layout=editorial] .facts{gap:7px;margin-bottom:24px}.case-shell[data-layout=editorial] .facts span{font-size:12px;padding:9px 11px}}
/* Quiet metadata: the landing badge's geometry, with white case lettering. */
.case-shell[data-layout=editorial] .facts{gap:var(--metadata-gap,8px);align-items:center}
.case-shell[data-layout=editorial] .facts>.case-pill{height:34px;min-height:34px;padding:0 12px;border-radius:var(--metadata-radius,9px);background:rgb(0 0 0 / 50%);color:#fff;font-size:13px;line-height:1.2;font-weight:400;white-space:nowrap}
.case-shell[data-layout=editorial] .facts>.tool-group{gap:14px;padding:0 12px}
.case-shell[data-layout=editorial] .facts .tool-mark{padding:0;min-height:0;height:22px;width:20px;background:none;border-radius:0;color:inherit}
.tool-mark svg{display:block;width:20px;height:20px}.tool-mark[aria-label=Figma] svg{width:16px;height:22px}
@media(max-width:650px){.case-shell[data-layout=editorial] .facts>.case-pill{font-size:12px;height:32px;min-height:32px;padding-inline:10px}.case-shell[data-layout=editorial] .facts>.tool-group{gap:12px}}

/* A single narrative can accompany several visual beats. */
.case-shell[data-layout=editorial] .chapter-sequence{display:grid;grid-template-columns:1fr;position:relative}
.case-shell[data-layout=editorial] .sequence-copy{grid-area:1/1;align-self:start;position:sticky;top:18svh;margin-top:18svh;z-index:2;padding-bottom:60px}
.case-shell[data-layout=editorial] .sequence-beats{grid-area:1/1;min-width:0}
.case-shell[data-layout=editorial] .sequence-copy h2{font-size:clamp(42px,5.2vw,80px);font-weight:400;line-height:1.08;letter-spacing:-.035em;margin:0 0 35px}
.case-shell[data-layout=editorial] .sequence-copy p{font-size:clamp(17px,1.4vw,22px);line-height:1.5;max-width:540px;margin:0}
.case-shell[data-layout=editorial] .visual-beat{padding:0;min-height:105svh}
.case-shell[data-layout=editorial] .visual-stage .visual-scene[data-sequence-visual]{align-items:flex-start;padding-top:0;padding-bottom:0}
@media(max-width:1000px) and (min-width:651px){.case-shell[data-layout=editorial] .sequence-copy h2{font-size:48px}}
@media(max-width:650px){.case-shell[data-layout=editorial] .chapter-sequence{display:block}.case-shell[data-layout=editorial] .sequence-copy{position:static;margin:0;padding:45px 0 12px}.case-shell[data-layout=editorial] .sequence-copy h2{font-size:43px;margin-bottom:24px}.case-shell[data-layout=editorial] .sequence-copy p{font-size:17px}.case-shell[data-layout=editorial] .visual-beat{min-height:0!important;padding:24px 0 50px}.case-shell[data-layout=editorial] .visual-beat .mobile-visual{margin-top:0}.case-shell[data-layout=editorial] .visual-beat:last-child{padding-bottom:70px}}