.article-diagram-figure{container-type:inline-size}.article-diagram{--diagram-ink:#28231f;--diagram-muted:#675e54;--diagram-rule:#bba991;--diagram-card:#fff;--diagram-paper:#f3f0eb;background:var(--diagram-paper);color:var(--diagram-ink);text-align:left;overflow-wrap:normal;word-break:normal;-webkit-hyphens:none;hyphens:none;padding:clamp(20px,4vw,40px)}.article-diagram-dark{--diagram-ink:#faf8f4;--diagram-muted:#ded6ca;--diagram-rule:#a08b70;--diagram-card:#37312a;--diagram-paper:#28231f}.article-diagram-figure .article-diagram .diagram-heading{text-align:left;margin:0 0 28px}.article-diagram-figure .article-diagram .diagram-heading h3{letter-spacing:0;color:var(--diagram-ink);text-align:left;text-wrap:pretty;margin:0 0 12px;padding:0;font:400 clamp(24px,2.4vw,30px)/1.2 Georgia,serif}.article-diagram-figure .article-diagram .diagram-heading h3:before,.article-diagram-figure .article-diagram h4:before{display:none}.article-diagram-figure .article-diagram .diagram-heading p,.article-diagram-figure .article-diagram .diagram-note,.article-diagram-figure .article-diagram .diagram-card p,.article-diagram-figure .article-diagram .diagram-steps p,.article-diagram-figure .article-diagram .diagram-service-path p,.article-diagram-figure .article-diagram dd{color:var(--diagram-muted);letter-spacing:0;text-align:left;text-wrap:pretty;margin:0;font:400 16px/1.55 Arial,sans-serif}.article-diagram-figure .article-diagram .diagram-note{border-top:1px solid var(--diagram-rule);margin:28px 0 0;padding-top:20px;font-size:14px}.diagram-cards{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:16px;display:grid}.diagram-card{background:var(--diagram-card);border:1px solid var(--diagram-rule);min-width:0;padding:24px 20px}.article-diagram-figure .article-diagram .diagram-index{color:var(--diagram-muted);letter-spacing:.1em;margin:0 0 20px;font:14px/1 Arial,sans-serif;display:block}.article-diagram-figure .article-diagram h4{color:var(--diagram-ink);letter-spacing:0;text-align:left;text-wrap:pretty;overflow-wrap:normal;word-break:normal;-webkit-hyphens:none;hyphens:none;margin:0 0 12px;font:600 18px/1.3 Arial,sans-serif}.article-diagram-figure .article-diagram .diagram-card .diagram-card-subtitle{color:var(--diagram-muted);margin:0 0 18px;font-size:15px}.article-diagram-figure .article-diagram .diagram-card ul{margin:0;padding:0 0 0 18px;list-style:outside}.article-diagram-figure .article-diagram .diagram-card li{color:var(--diagram-ink);text-align:left;letter-spacing:0;margin:0 0 8px;padding:0;font:400 16px/1.55 Arial,sans-serif}.article-diagram-figure .article-diagram .diagram-card li:last-child{margin-bottom:0}.article-diagram-figure .article-diagram .diagram-card li:before{display:none}.article-diagram-figure .article-diagram .diagram-steps{gap:16px;margin:0;padding:0;list-style:none;display:grid}.article-diagram-figure .article-diagram .diagram-steps>li{background:var(--diagram-card);border:1px solid var(--diagram-rule);grid-template-columns:34px minmax(0,1fr);align-items:start;gap:18px;margin:0;padding:22px;display:grid;position:relative}.article-diagram-figure .article-diagram .diagram-steps>li:not(:last-child):after{content:"";border-left:1px solid var(--diagram-rule);height:18px;position:absolute;top:100%;left:38px}.article-diagram-figure .article-diagram .diagram-steps>li:before{display:none}.article-diagram-figure .article-diagram .diagram-step-number{aspect-ratio:1;border:1px solid var(--diagram-rule);color:var(--diagram-ink);place-items:center;font:16px/1 Arial,sans-serif;display:grid}.article-diagram-figure .article-diagram .diagram-steps h4{margin-bottom:6px}.article-diagram-figure .article-diagram .diagram-client-path{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:0;padding:0;list-style:none;display:grid}.article-diagram-figure .article-diagram .diagram-client-path>li{background:var(--diagram-card);border:1px solid var(--diagram-rule);text-align:center;color:var(--diagram-ink);margin:0;padding:24px 12px;font:600 18px/1.3 Arial,sans-serif;position:relative}.article-diagram-figure .article-diagram .diagram-client-path>li:before{display:none}.article-diagram-figure .article-diagram .diagram-client-path>li:not(:last-child):after{content:"→";width:34px;color:var(--diagram-rule);text-align:center;font:24px/1 Arial,sans-serif;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.diagram-service-path{text-align:center;width:calc(33.3333% - 21.3333px);margin-left:auto}.diagram-service-arrow{height:48px;color:var(--diagram-rule);font:32px/48px Arial,sans-serif;display:block}.diagram-service-path>div{border:1px dashed var(--diagram-rule);background:var(--diagram-card);padding:20px 12px;font:600 18px/1.3 Arial,sans-serif}.article-diagram-figure .article-diagram .diagram-service-path p{text-align:center;margin-top:12px;font-size:14px;line-height:1.5}.diagram-elevation{color:#28231f;border:1px solid var(--diagram-rule);background:#faf9f6;margin-bottom:24px;padding:12px 0}.diagram-elevation svg{width:100%;height:auto;display:block}.diagram-elevation-key{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0;display:grid}.diagram-elevation-key dt{align-items:center;gap:10px;margin:0 0 8px;font:600 16px/1.4 Arial,sans-serif;display:flex}.diagram-elevation-key dt span{color:#fff;background:#28231f;flex:none;place-items:center;width:28px;height:28px;font:14px/1 Arial,sans-serif;display:grid}.article-diagram-figure .article-diagram .diagram-elevation-key dd{margin:0}@container (width<=680px){.diagram-cards{grid-template-columns:1fr}.diagram-card{padding:22px}.article-diagram-figure .article-diagram .diagram-index{margin-bottom:12px}.diagram-elevation-key{grid-template-columns:1fr}}@container (width<=460px){.article-diagram-figure .article-diagram .diagram-client-path{grid-template-columns:1fr;gap:32px}.article-diagram-figure .article-diagram .diagram-client-path>li:not(:last-child):after{content:"↓";width:auto;height:34px;line-height:34px;top:100%;left:50%;transform:translate(-50%)}.diagram-service-path{width:100%}.article-diagram-figure .article-diagram .diagram-steps>li{grid-template-columns:30px minmax(0,1fr);gap:14px;padding:18px}.article-diagram-figure .article-diagram .diagram-steps>li:not(:last-child):after{left:32px}}@media (max-width:680px){.diagram-cards,.diagram-elevation-key{grid-template-columns:1fr}}
