/* Real workflow illustrations. Text and service meaning stay available in HTML. */
.detail-hero{gap:5%;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);padding-top:24px;padding-bottom:44px}
.service-preview{min-width:0;margin:0;background:none;border:0;box-shadow:none}
.workflow-art-link{display:block;position:relative;border-radius:18px;overflow:hidden;background:#f6faff;aspect-ratio:1.12;outline-offset:5px}
.service-illustration{display:block;width:100%;height:100%;object-fit:cover}
.art-expand{position:absolute;right:16px;bottom:15px;display:flex;align-items:center;gap:8px;min-height:40px;padding:9px 12px;background:#ffffffed;border:1px solid #d2deed;border-radius:6px;color:#29486d;font-size:13px;box-shadow:0 3px 12px #21395708;transition:background .15s,border-color .15s}
.art-expand svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.workflow-art-link:hover .art-expand,.workflow-art-link:focus-visible .art-expand{background:#fff;border-color:#7292b8}
.visual-preview figcaption{padding:17px 6px 0}
.visual-preview figcaption strong{display:block;font:400 21px/1.3 var(--display);letter-spacing:-.025em;color:#223c5e}
.visual-preview figcaption p{font-size:15px;line-height:1.5;color:#526b89;margin-top:7px;max-width:620px}
.visual-preview figcaption small{display:block;font-size:12px;line-height:1.4;color:#60758e;margin-top:9px}
/* A lighter example reader replaces the second set of diagram cards. */
.detail-workflow{background:#edf3fb}
.workflow-walkthrough{border:0;border-radius:0;background:transparent;overflow:visible}
.workflow-switcher{background:none;border-bottom:1px solid #c4d3e7;padding:0;gap:24px}
.workflow-switcher button{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:15px 0;color:#566e8d}
.workflow-switcher button[aria-pressed=true]{background:none;border:0;border-bottom:2px solid #e46d4a;box-shadow:none;color:#203e65}
.workflow-panel{padding:30px 0 28px;min-height:195px;max-width:900px}
.workflow-controls{border-top:1px solid #d1deef;padding:10px 0}
.workflow-next{padding-right:0}
.workflow-panel.has-workspace:not([hidden]){display:grid;grid-template-columns:1fr 1fr;gap:42px;max-width:none;align-items:start}
.sample-workspace{min-width:0;background:#fff;border:1px solid #cbd9e9;border-radius:10px;box-shadow:0 7px 24px #29476408;overflow:hidden}
.sample-record{padding:24px}
.sample-record-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-bottom:19px;border-bottom:1px solid #dce5f0}
.sample-record h4{font:500 19px/1.3 var(--display);color:#233f63;letter-spacing:-.02em}
.sample-record-heading>span{font-size:12px;line-height:1.4;color:#785529;background:#fcf3e5;padding:5px 8px;border-radius:4px}
.sample-record dl{margin:0}
.sample-record dl>div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:16px;padding:14px 0;border-bottom:1px solid #e4eaf2;font-size:16px;line-height:1.45}
.sample-record dt{color:#61758f}
.sample-record dd{margin:0;color:#243e60;overflow-wrap:anywhere}
.sample-record .sample-note{font-size:14px;line-height:1.5;color:#5b718b;margin-top:18px}
.workflow-panel .sample-disclosure{font-size:12px;line-height:1.4;color:#61738a;padding:12px 24px;background:#f7f9fc;border-top:1px solid #e0e8f2}
.sample-comparison{border-collapse:collapse;width:100%;table-layout:fixed;font-size:16px;line-height:1.4;color:#294362}
.sample-comparison caption{text-align:left;font-size:13px;line-height:1.5;color:#647992;padding:15px 0}
.sample-comparison th,.sample-comparison td{text-align:left;border-bottom:1px solid #e0e8f2;padding:12px 6px;vertical-align:top;overflow-wrap:break-word}
.sample-comparison th{font-weight:500}
.sample-comparison thead{background:#f4f7fc}
.sample-comparison .sample-warning{color:#9c462b;background:#fff4ee}
.sample-source{margin-top:16px;border-bottom:1px solid #e0e8f2}
.sample-source summary{cursor:pointer;min-height:44px;font-size:15px;line-height:1.5;color:#315c8d;padding:10px 0}
.sample-source p{font-size:15px;line-height:1.5;color:#526b89;padding-bottom:14px}
@media(max-width:1000px){.workflow-panel.has-workspace:not([hidden]){gap:25px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.sample-record{padding:20px}}
@media(max-width:760px){.workflow-panel.has-workspace:not([hidden]){grid-template-columns:minmax(0,1fr);gap:25px}.has-workspace .sample-workspace{grid-row:1}.sample-record{padding:20px}.sample-record dl>div{gap:12px}.sample-comparison{font-size:15px}.sample-comparison th,.sample-comparison td{padding:12px 5px}.workflow-panel .sample-disclosure{padding-inline:20px}}
.visual-viewer-open{overflow:hidden}
.service-visual-dialog{padding:22px;border:1px solid #d6e1ef;border-radius:16px;background:#f8fbff;color:#1f3858;width:min(1100px,calc(100vw - 36px));max-width:none;max-height:calc(100svh - 36px);overflow:hidden;box-shadow:0 25px 100px #0c1c3a40;margin:auto}
.service-visual-dialog[open]{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:14px}
.service-visual-dialog::backdrop{background:#10213dcc;backdrop-filter:blur(5px)}
.visual-dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:28px}
.visual-dialog-heading>div{min-width:0}
.visual-dialog-heading p{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#627997;margin-bottom:7px}
.visual-dialog-heading h2{font:400 25px/1.25 var(--display);letter-spacing:-.035em;max-width:790px}
.visual-dialog-heading form{flex-shrink:0}
.visual-close{display:flex;align-items:center;gap:13px;min-height:44px;padding:9px 13px;background:#fff;border:1px solid #c9d8e9;border-radius:5px;color:#25456d;font-size:14px;cursor:pointer}
.visual-close>span{font-size:23px;line-height:1}
.visual-dialog-toolbar{display:flex;gap:22px;align-items:center;border-top:1px solid #d7e2ef;padding-top:8px}
.visual-dialog-toolbar button,.visual-dialog-toolbar a{min-height:40px;display:inline-flex;align-items:center;gap:9px;font-size:14px;color:#315b88;background:none;border:0;padding:7px 0;cursor:pointer}
.visual-dialog-toolbar button{font-weight:600}
.visual-dialog-canvas{min-height:0;max-height:64svh;overflow:auto;overscroll-behavior:contain;background:#f6faff;border:1px solid #d9e5f3;border-radius:9px;scrollbar-width:thin}
.visual-dialog-canvas img{display:block;width:100%;height:auto;max-height:64svh;object-fit:contain;margin:auto}
.visual-dialog-canvas.is-zoomed img{width:1254px;height:1254px;max-height:none;max-width:none;margin:0}
.visual-dialog-caption{font-size:14px;line-height:1.45;color:#536d8c;max-width:940px}
@media(min-width:1600px){.service-preview{max-width:700px;justify-self:end;width:100%}}
@media(max-width:1100px){.detail-hero{gap:4%}.visual-preview figcaption strong{font-size:20px}.visual-preview figcaption p{font-size:14px}.art-expand{right:12px;bottom:12px}}
@media(max-width:760px){
 .detail-hero{grid-template-columns:minmax(0,1fr);padding:28px 20px 36px;gap:30px}
 .service-preview{width:calc(100% + 40px);max-width:none;margin-inline:-20px}
 .workflow-art-link{border-radius:0;aspect-ratio:1;overflow:hidden}
 .art-expand{right:20px;bottom:15px;font-size:13px;min-height:42px}
 .visual-preview figcaption{padding:18px 20px 0}
 .visual-preview figcaption strong{font-size:22px;max-width:570px}
 .visual-preview figcaption p{font-size:16px;max-width:600px}
 .visual-preview figcaption small{font-size:12px}
 .workflow-switcher{gap:13px}
 .workflow-switcher button{padding:14px 4px;font-size:14px}
 .workflow-panel{padding:26px 0;min-height:260px}
 .workflow-panel h3{font-size:28px}
 .service-visual-dialog{padding:15px;width:calc(100vw - 20px);max-height:calc(100svh - 20px);border-radius:11px}
 .service-visual-dialog[open]{gap:10px}
 .visual-dialog-heading{gap:13px}
 .visual-dialog-heading h2{font-size:20px}
 .visual-dialog-heading p{font-size:10px}
 .visual-close{font-size:12px;gap:7px;padding:8px;min-height:42px}
 .visual-dialog-canvas,.visual-dialog-canvas img{max-height:57svh}
 .visual-dialog-caption{font-size:13px}
}
@media(max-height:500px){.service-visual-dialog{padding:12px}.visual-dialog-heading p{display:none}.visual-dialog-heading h2{font-size:19px}.visual-dialog-caption{display:none}.visual-dialog-canvas,.visual-dialog-canvas img{max-height:calc(100svh - 160px)}.service-visual-dialog[open]{gap:8px}}
@media(prefers-reduced-motion:reduce){.art-expand{transition:none}}
