/* Four vertical cards with task-specific figures, system marks, and progress. */
.c-cases .sec__head.is-row { align-items:end; }
.c-cases .sec__head.is-row > .sec__head { max-width:980px; }
.c-cases-pause { flex-shrink:0; }
.c-cases-grid { gap:20px; }
.c-cases .uc:hover { transform:none; }
.c-case-heading { padding:16px 20px 10px; }
.c-case-heading h3 { margin:0 0 5px; font-size:24px; line-height:1.2; }
.c-cases .c-case-audience { margin:0; color:var(--ink-2); font-size:12px; line-height:1.4; }
.c-case-workflows { display:flex; flex-wrap:wrap; gap:3px 14px; margin:0; padding:0 20px 10px; list-style:none; border-bottom:1px solid var(--line-soft); }
.c-case-workflows li { display:contents; }
.c-case-task { display:block; border:0; border-bottom:2px solid transparent; border-radius:0; padding:7px 0; background:none; color:var(--ink-2); font:400 12px/1.3 var(--font-body); cursor:pointer; }
.c-case-task[aria-selected="true"] { border-bottom-color:var(--accent-ink); color:var(--accent-ink); }
.c-case-task:hover { color:var(--accent-ink); }
.c-case-task:focus-visible,.c-case-contact:focus-visible,.c-case-panel:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
.c-case-panel { min-width:0; }
.c-cases .uc__art { height:235px; }
/* Layout zoom paints text and vector marks at their displayed size. */
.c-cases .uc__art > div { transform:none!important; translate:-50% 0; scale:none; zoom:.9; isolation:isolate; }
.c-case-canvas { position:absolute; left:50%; top:0; width:360px; height:280px; }
/* Every connector sits beneath the source, evidence, and result boxes. */
.c-cases .uc__art > div > * { z-index:1; }
.c-cases .uc__art > div > .wire-path { position:absolute; z-index:0; pointer-events:none; }
.c-cases .uc__art .mini-chip { background:var(--surface-2); }
.c-cases .uc__art [class^="c-mini-"] { background:var(--sheet-bg); }
.c-cases .c-case-result { left:50%!important; translate:-50% 0; }
.c-system-marks { display:inline-flex; align-items:center; gap:5px; margin-right:7px; vertical-align:middle; }
.mini-pill .c-system-marks { margin-right:0; }
.c-system-marks > span { font:9px var(--font-machine); color:var(--ink-3); }
.c-cases .c-system-marks img { display:block; width:18px; height:18px; object-fit:contain; flex-shrink:0; }
.c-cases .c-system-marks img[data-system="rightsline"] { width:68px; }
.c-cases .c-system-marks img[data-system="ariba"] { width:34px; }
html[data-theme="dark"] .c-system-marks img[data-system="rightsline"] { filter:brightness(2); }
html[data-theme="dark"] .c-system-marks img[data-system="drchrono"] { filter:brightness(0) invert(1); }
.c-case-example { position:relative; height:1px; }
.c-case-example > [data-example-name],.c-case-example > [data-example-count] { display:none; }
.c-case-clock { position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,var(--glow-orange),var(--glow-hot)); box-shadow:0 0 5px rgb(255 92 0 / .4); transform-origin:left; }
.c-cases .c-case-note { margin:0; padding:12px 20px 0; color:var(--ink-2); font-size:12px; line-height:1.6; }
.c-case-progress { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0; padding:8px 20px 0; list-style:none; }
.c-case-stage.run-step { grid-template-columns:minmax(0,1fr); min-height:32px; margin:0; padding:1px 0 1px 13px; border-radius:0; font:400 11px/1.5 var(--font-body); }
.c-case-stage.run-step + .run-step { margin:0; }
.c-case-stage.run-step[data-state="pending"] { opacity:1; color:var(--ink-2); }
.c-case-stage.run-step[data-state="active"] { background:none; }
.c-case-stage .tube { left:1px; top:2px; bottom:2px; width:5px; }
.c-cases .is-playing .c-case-stage { animation:c-case-phase 1s linear both; animation-delay:calc(.15s + var(--step)*1.1s); }
@keyframes c-case-phase { from { opacity:.65; } to { opacity:1; } }
.c-cases .uc__text { padding:12px 20px 14px; }
.c-cases .uc__more { margin:12px 0 0; align-self:start; font-size:12px; }
.c-case-contact { padding-inline:0; border:0; background:none; cursor:pointer; text-align:left; }
.c-cases-end { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:24px; }
.c-cases-end p { margin:0; color:var(--ink-3); font-size:12px; }
.c-case-workbook { display:none; }
.c-case-workbook rect { fill:var(--surface-2); stroke:var(--line-soft); }
.c-case-workbook path { fill:none; stroke:var(--line-soft); }
.c-case-workbook text { font:11px var(--font-machine); fill:var(--ink-2); }
.c-case-workbook .c-case-formulas text { fill:var(--accent-ink); font-size:16px; }
[data-mode="model"] .c-case-house { display:none; }
[data-mode="model"] .c-case-workbook { display:block; }
.c-cases [data-mode="classification"] .contract-grid i.ok { background:rgb(109 163 235 / .3); box-shadow:none; }
.c-cases [data-mode="classification"] .contract-grid i.imp { background:rgb(255 184 102 / .35); box-shadow:none; }
.c-mini-catalog,.c-mini-portal,.c-mini-receipt,.c-mini-checklist,.c-mini-invoice,.c-mini-contract { position:absolute; left:20px; top:58px; width:156px; padding:11px; border:1px solid var(--line-soft); border-radius:7px; background:var(--card-bg); box-shadow:0 5px 12px -8px rgb(0 0 0 / .4); color:var(--ink-2); font:10.5px/1.5 var(--font-machine); }
.c-mini-receipt { width:152px; border-radius:2px; border-bottom:3px double var(--line-soft); }
.c-mini-catalog > span,.c-mini-portal > span,.c-mini-receipt > span,.c-mini-checklist > span,.c-mini-invoice > span,.c-mini-contract > span { display:block; margin-bottom:9px; font-size:9px; color:var(--ink-3); }
.c-mini-catalog i,.c-mini-portal i,.c-mini-receipt i,.c-mini-checklist i,.c-mini-invoice i { display:flex; justify-content:space-between; gap:6px; padding:5px 0; border-top:1px solid var(--line-soft); font-style:normal; }
.c-mini-catalog b,.c-mini-portal b,.c-mini-receipt b,.c-mini-checklist b,.c-mini-invoice b { font-weight:400; color:var(--accent-ink); }
.c-mini-receipt > strong,.c-mini-invoice > strong { display:block; margin-bottom:5px; color:var(--accent-ink); font-size:13px; font-weight:500; }
.c-mini-contract q { font:12px/1.6 var(--font-display); color:var(--ink-1); }
.c-mini-contract mark { color:var(--accent-ink); background:rgb(255 120 40 / .1); }
/* The same 8-second sequence drives the figure and its caption progress. */
.c-cases .wire-path path { stroke-dasharray:100; stroke-dashoffset:0; transition:none; }
.c-cases .is-playing .c-case-clock { animation:c-case-cycle 8s linear both; }
.c-cases .is-playing .mini-sheet,.c-cases .is-playing [class^="c-mini-"],.c-cases .is-playing [data-example-field="source"] { animation:c-case-input 8s ease both; }
.c-cases .is-playing .wire-path path { animation:c-case-wire 8s ease-out both; }
.c-cases .is-playing .wire-path path:nth-child(2) { animation-name:c-case-wire-second; }
.c-cases .is-playing .wire-path path:last-child { animation-name:c-case-wire-out; }
.c-cases .is-playing [data-example-field^="detail"] { animation:c-case-evidence 8s ease both; }
.c-cases .is-playing [data-example-field="detail2"] { animation-name:c-case-evidence-second; }
.c-cases .is-playing .c-case-result { animation:c-case-result 8s ease both; }
.c-cases .is-playing .contract-grid i { animation:c-case-cell 5s ease both; animation-delay:var(--cell-delay,0ms); }
.c-cases .is-playing .c-case-workbook .c-case-formulas text { animation:c-case-evidence 8s ease both; }
.c-cases.is-paused .is-playing *, .c-cases.is-paused .is-playing *::before { animation-play-state:paused!important; }
@keyframes c-case-cycle { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@keyframes c-case-input { 0% { opacity:.25; } 9%,100% { opacity:1; } }
@keyframes c-case-wire { 0%,7% { stroke-dashoffset:100; } 20%,100% { stroke-dashoffset:0; } }
@keyframes c-case-wire-second { 0%,12% { stroke-dashoffset:100; } 25%,100% { stroke-dashoffset:0; } }
@keyframes c-case-wire-out { 0%,26% { stroke-dashoffset:100; } 37%,100% { stroke-dashoffset:0; } }
@keyframes c-case-evidence { 0%,18% { filter:brightness(.92) saturate(.25); } 24%,100% { filter:none; } }
@keyframes c-case-evidence-second { 0%,23% { filter:brightness(.92) saturate(.25); } 29%,100% { filter:none; } }
@keyframes c-case-result { 0%,38% { opacity:0; transform:translateY(4px); } 44%,100% { opacity:1; transform:none; } }
@keyframes c-case-cell { 0% { opacity:.15; transform:scale(.85); } 30%,100% { opacity:1; transform:none; } }
@media(max-width:680px) {
  .c-cases .sec__head.is-row { align-items:start; }
  .c-case-heading { padding:16px 18px 10px; }
  .c-case-heading h3 { font-size:21px; }
  .c-case-workflows { padding-inline:18px; gap:2px 12px; }
  .c-case-task { font-size:11px; }
  .c-cases .c-case-note { padding-inline:18px; }
  .c-case-progress { padding-inline:18px; gap:10px; }
  .c-cases .uc__text { padding:14px 18px 16px; }
}
@media(max-width:420px) { .c-cases .uc__art > div { zoom:.88; } }
@media(max-width:360px) { .c-cases .uc__art > div { zoom:.78; } .c-cases .uc__art { height:225px; } }
@media(prefers-reduced-motion:reduce) {
  .c-cases *, .c-cases *::before { animation:none!important; transition:none!important; }
  .c-cases-pause,.c-case-clock { display:none; }
}
