/* One readable transformation, one connected system. */
.case-explainer{padding-block:65px 35px}
.case-explainer-heading{margin-bottom:43px}
.case-explainer-heading .section-label{margin-bottom:19px}
.case-explainer-heading h2{font-size:clamp(34px,3.5vw,46px);font-weight:400;line-height:1.15;letter-spacing:-.04em;margin:0;max-width:30ch}
.case-explainer-grid{display:grid;grid-template-columns:.86fr 1.25fr;gap:clamp(35px,4.5vw,65px);align-items:center}
.change-map-labels{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-bottom:17px;border-bottom:1px solid var(--line);color:var(--muted);font-size:13px}
.change-map ul{list-style:none;padding:0;margin:0}
.change-map li{display:grid;grid-template-columns:1fr 28px 1fr;gap:12px;align-items:center;min-height:100px;padding:22px 0;border-bottom:1px solid var(--line)}
.change-before{display:flex;align-items:center;gap:13px;color:var(--muted);font-size:18px;line-height:1.4}
.change-before .line-icon{width:23px;height:23px;flex-shrink:0;opacity:.8}
.change-arrow{color:var(--accent-ink);font-size:25px;font-weight:300;text-align:center}
.change-map strong{font-size:20px;font-weight:400;line-height:1.4;color:var(--fg)}
.case-system{margin:0;padding:25px 25px 0;border:1px solid var(--viz-line);background:var(--viz-bg);border-radius:5px;min-width:0;transform:translateZ(0);position:relative;overflow:hidden;box-shadow:0 16px 40px rgba(10,25,40,.035)}
.case-system::before{content:"";position:absolute;top:0;left:25px;height:2px;width:50px;background:var(--ember)}
.case-system figcaption{font-size:16px;color:var(--fg-2);line-height:1.4;display:flex;align-items:center;gap:10px}
.case-system figcaption>.line-icon{color:var(--accent-ink);width:20px;height:20px;flex-shrink:0}
.offline-state{margin-left:auto;font-size:11px;font-weight:400;border:1px solid var(--accent-rule);border-radius:20px;padding:5px 9px;color:var(--accent-ink);white-space:nowrap}
.private-system{border:1px dashed var(--viz-line);border-radius:3px;margin-top:23px;padding:0 18px}
.brief-flow{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:35px 0 31px;gap:22px}
.brief-flow.three-stages{grid-template-columns:repeat(3,minmax(0,1fr));margin-block:28px 25px;gap:26px}
.brief-flow li{position:relative;min-width:0;text-align:center}
.brief-flow li:not(:last-child)::after{content:"";position:absolute;left:calc(50% + 30px);right:calc(-50% + 8px);height:1px;top:26px;background:var(--accent-rule)}
.brief-flow li:not(:last-child)::before{content:"";position:absolute;right:calc(-50% + 7px);top:23px;width:6px;height:6px;transform:rotate(-45deg);border-right:1px solid var(--accent-ink);border-bottom:1px solid var(--accent-ink)}
.brief-node-icon{display:grid;place-items:center;width:53px;height:53px;margin:0 auto 16px;border-radius:10px;background:var(--diagram-bg);border:1px solid var(--viz-line);color:var(--accent-ink)}
.brief-node-icon>.line-icon{width:28px;height:28px}
.brief-node-icon.is-brand{background:#fff;border-color:rgba(20,40,60,.07)}
.brief-node-icon img{width:32px;height:32px;object-fit:contain;filter:none!important}
.brief-flow li b{font-size:17px;line-height:1.3;display:block;font-weight:400;color:var(--fg)}
.brief-flow li div>span{display:block;font-size:13px;line-height:1.45;color:var(--muted);margin-top:7px}
.three-stages li b{font-size:18px}
.platform-foundation{border-top:1px solid var(--viz-line);display:flex;align-items:center;justify-content:space-between;gap:17px;padding-block:20px}
.platform-foundation>div{display:flex;align-items:center;gap:9px}
.platform-foundation .tech-logo{font-size:15px;gap:8px}
.platform-foundation .tech-symbol{width:29px;height:29px;padding:4px;border-radius:3px}
.platform-foundation .foundation-caption{font-size:12px;color:var(--muted);border-left:1px solid var(--viz-line);padding-left:9px}
.platform-foundation>div:last-child{font-size:13px;color:var(--fg-2)}
.platform-foundation>div:last-child>.line-icon{width:20px;height:20px;color:var(--muted)}
.monitoring-rail,.brief-system-base{border-top:1px solid var(--viz-line);margin-top:24px;padding:20px 0;display:flex;align-items:center;justify-content:space-between;gap:15px}
.monitoring-rail{border-top:0;margin-top:0;position:relative}
.monitoring-rail::before{content:"";position:absolute;left:50%;top:0;height:15px;border-left:1px dashed var(--accent-rule)}
.offline-system{padding-bottom:24px}.offline-system .monitoring-rail{border-top:1px solid var(--viz-line);padding-block:18px}.offline-system .monitoring-rail::before{display:none}
.monitoring-rail .tech-logo{font-size:15px;gap:8px}
.monitoring-rail .tech-symbol{width:28px;height:28px;padding:4px;border-radius:3px}
.monitoring-rail>span:last-child{color:var(--muted);font-size:13px;line-height:1.4}
.monitoring-rail i{font-style:normal;padding-inline:5px}
.brief-system-base{justify-content:start;color:var(--muted);font-size:14px;line-height:1.5}
.brief-system-base>.line-icon{width:20px;height:20px;flex-shrink:0;color:var(--accent-ink)}
.case-engineering{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:38px;scroll-margin-top:170px}
.case-engineering summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;color:var(--fg-2);font-size:17px}
.case-engineering summary::-webkit-details-marker{display:none}
.case-engineering summary>span:first-child{display:flex;align-items:center;gap:12px}
.case-engineering summary .line-icon{width:20px;height:20px;color:var(--muted)}
.detail-affordance{font-size:24px;color:var(--accent-ink);font-weight:300;transition:transform .2s}
.case-engineering[open] .detail-affordance{transform:rotate(45deg)}
.case-engineering-body{display:grid;grid-template-columns:1fr 1fr;gap:30px 65px;padding:10px 0 30px}
.case-engineering-body h3{font-size:21px;font-weight:400;margin:0 0 18px;color:var(--fg)}
.case-engineering-body ul{padding-left:19px;margin:0;display:grid;gap:12px;color:var(--fg-2);font-size:18px;line-height:1.6}
.case-engineering-body li::marker{color:var(--accent-ink)}
.engineering-stack{grid-column:1/-1;border-top:1px solid var(--line);padding-top:26px}
.engineering-stack .project-stack{margin-top:22px}
@media(max-width:1150px){.case-explainer-grid{grid-template-columns:.9fr 1.2fr;gap:32px}.case-system{padding-inline:20px}.change-map li{gap:8px;grid-template-columns:1fr 20px 1fr}.change-before{font-size:17px;gap:9px}.change-before .line-icon{width:20px;height:20px}.change-map strong{font-size:18px}.private-system{padding-inline:12px}.platform-foundation .foundation-caption{display:none}.brief-flow{gap:14px}.brief-flow li b{font-size:16px}.brief-flow li div>span{font-size:12px}.offline-system figcaption{flex-wrap:wrap}.offline-state{font-size:10px}}
@media(max-width:950px){.case-explainer-grid{grid-template-columns:1fr;gap:32px}.change-map-labels{gap:52px}.change-map li{min-height:80px;grid-template-columns:1fr 28px 1fr;gap:16px}.change-before{font-size:19px}.change-map strong{font-size:21px}.case-system{padding-inline:28px}.private-system{padding-inline:22px}.platform-foundation .foundation-caption{display:block}.brief-flow li b{font-size:19px}.brief-flow li div>span{font-size:14px}.offline-state{font-size:12px}.case-explainer-heading{margin-bottom:32px}.case-explainer-heading h2{font-size:40px}}
@media(max-width:600px){.case-explainer{padding-block:40px 20px}.case-explainer-heading .section-label{font-size:12px}.case-explainer-heading h2{font-size:35px;line-height:1.18}.change-map-labels{font-size:12px;gap:38px;padding-bottom:13px}.change-map li{min-height:87px;padding-block:17px;gap:9px;grid-template-columns:1fr 20px 1fr}.change-before{font-size:16px;gap:9px}.change-before .line-icon{width:19px;height:19px}.change-map strong{font-size:18px}.change-arrow{font-size:21px}.case-system{padding:22px 21px 0;margin-inline:-3px}.case-system figcaption{font-size:15px;gap:8px}.offline-state{font-size:10px;padding:4px 7px;margin-left:28px}.private-system{padding-inline:18px;margin-top:18px}.brief-flow,.brief-flow.three-stages{grid-template-columns:1fr;gap:0;margin-block:24px}.brief-flow li{display:flex;align-items:center;gap:17px;text-align:left;padding-bottom:28px;min-height:77px}.brief-flow li:last-child{padding-bottom:0;min-height:49px}.brief-node-icon{margin:0;width:48px;height:48px;flex-shrink:0;border-radius:8px}.brief-node-icon>.line-icon{width:25px;height:25px}.brief-node-icon img{width:29px;height:29px}.brief-flow li b,.three-stages li b{font-size:21px}.brief-flow li div>span{font-size:14px;margin-top:5px}.brief-flow li:not(:last-child)::after{left:23px;right:auto;width:1px;top:53px;height:21px}.brief-flow li:not(:last-child)::before{left:20px;right:auto;top:67px;transform:rotate(45deg);width:6px;height:6px}.platform-foundation{padding-block:16px;gap:13px;flex-wrap:wrap}.platform-foundation .foundation-caption{display:none}.platform-foundation>div:last-child{font-size:13px}.platform-foundation .tech-logo{font-size:15px}.monitoring-rail{gap:10px;flex-wrap:wrap;padding-block:20px}.monitoring-rail .tech-logo{font-size:15px}.monitoring-rail>span:last-child{font-size:12px}.monitoring-rail i{padding-inline:2px}.brief-system-base{font-size:14px;margin-top:15px;padding-block:18px}.case-engineering{margin-top:28px;scroll-margin-top:146px}.case-engineering summary{font-size:16px;padding-block:21px}.case-engineering-body{grid-template-columns:1fr;gap:27px;padding-bottom:26px}.case-engineering-body h3{font-size:21px}.case-engineering-body ul{font-size:17px;line-height:1.65}.engineering-stack{grid-column:auto}.engineering-stack .project-stack{gap:12px 0}}
@media(prefers-reduced-motion:reduce){.detail-affordance{transition:none}}
