/* A worked business case, in Dirijor's established paper / Plex visual system. */
.dirijor-demo [hidden], .dirijor-demo[hidden] { display: none !important; }
.industry-picker { scroll-margin-top: 100px; padding: 28px 0 24px 28px; border-left: 1px solid var(--hair-strong); }
.industry-picker h2 { font-size: 29px; line-height: 1.16; letter-spacing: -.025em; max-width: 19ch; }
.picker-demo-prompt { display: block; margin-top: 14px; font-size: 15px; font-weight: 500; line-height: 1.5; letter-spacing: 0; color: var(--violet-text); }
.industry-choices { display: grid; margin-top: 24px; }
.industry-choice { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 54px; padding: 12px 10px; border: 0; border-bottom: 1px solid var(--hair); background: transparent; color: var(--ink); font: inherit; font-size: 15px; text-align: left; cursor: pointer; }
.industry-choice .ico { width: 20px; height: 20px; flex-shrink: 0; color: var(--violet-text); }
.industry-choice .ico:last-child { margin-left: auto; width: 16px; }
.industry-choice:hover, .industry-choice[aria-pressed="true"] { color: var(--violet-text); background: var(--violet-soft); }
.industry-picker :focus-visible, .dirijor-demo :focus-visible { outline: 2px solid var(--violet); outline-offset: 4px; }
.dirijor-demo { scroll-margin-top: 88px; padding-top: 28px; }
.workflow-heading { margin-bottom: 28px; }
.workflow-heading h2 { font-size: clamp(28px, 3.5vw, 42px); letter-spacing: -.025em; line-height: 1.13; max-width: 28ch; text-wrap: balance; }
.workflow-heading p { margin-top: 14px; color: var(--muted); max-width: 68ch; font-size: 16px; line-height: 1.6; }
.dirijor-window {
  --ink: #17160f; --muted: #5b584b; --hair: #dcd7c6; --hair-strong: #c3bdab;
  --surface: #fbfaf6; --surface-2: #f7f5ee; --bg-tint: #f1eee5;
  --violet: #5b2bc4; --violet-text: #43209a; --violet-soft: #ece5fb;
  --amber-text: #805000; --amber-soft: #f4ebd8; --green-text: #1c6b3f; --green-soft: #e4efe7;
  --mono: 'Dirijor Mono', monospace;
  border: 1px solid var(--hair-strong); border-radius: 4px;
  background: var(--surface); color: var(--ink); font-family: 'Dirijor Plex', var(--font);
  line-height: 1.55; overflow: clip; font-size: 15px;
}
html[data-theme="dark"] .dirijor-window {
  --ink: #f0ece3; --muted: #bcb7aa; --hair: #423e37; --hair-strong: #615b51;
  --surface: #24221f; --surface-2: #2b2824; --bg-tint: #302d29;
  --violet: #b9a0ff; --violet-text: #c8b4ff; --violet-soft: #3c3152;
  --amber-text: #f0c575; --amber-soft: #443923; --green-text: #9ad6b1; --green-soft: #2b3c30;
}
.dirijor-window ::selection { background: var(--violet-soft); color: var(--ink); }
.dirijor-window button, .dirijor-window select, .dirijor-window textarea { font: inherit; }
.dirijor-window button { cursor: pointer; }
.dirijor-window button:disabled { cursor: not-allowed; }
.dirijor-window h3, .dirijor-window h4, .dirijor-window h5 { color: var(--ink); }
.dirijor-window h4 { font-size: 17px; line-height: 1.4; font-weight: 600; }
.dirijor-window h5 { font-size: 14px; font-weight: 600; margin: 24px 0 8px; }
.dirijor-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 26px; background: var(--bg-tint); border-bottom: 1px solid var(--hair-strong); }
.dirijor-brand { display: flex; align-items: center; gap: 10px; }
.dirijor-brand strong { font: 600 23px 'Dirijor Serif', Georgia, serif; letter-spacing: -.025em; }
.dirijor-brand > span { font-size: 13px; color: var(--muted); padding-left: 16px; border-left: 1px solid var(--hair-strong); margin-left: 6px; }
.case-context { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 18px 26px; border-bottom: 1px solid var(--hair); }
.case-context > div { min-width: 0; }
.case-context label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.case-context select { max-width: 100%; min-height: 44px; padding: 8px 34px 8px 10px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--surface); color: var(--ink); }
.case-context > p { font-size: 14px; color: var(--muted); text-align: right; }
.case-steps { list-style: none; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 0; margin: 0; border-bottom: 1px solid var(--hair); scroll-margin-top: 82px; }
.case-steps li { min-width: 0; }
.case-steps button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 76px; padding: 16px; border: 0; border-bottom: 2px solid transparent; background: transparent; text-align: left; color: var(--muted); font-size: 13px; line-height: 1.35; }
.case-steps button[aria-current="step"] { color: var(--violet-text); background: var(--violet-soft); border-bottom-color: var(--violet); font-weight: 600; }
.case-steps button:hover:not(:disabled) { background: var(--violet-soft); }
.case-steps button:disabled { color: var(--muted); }
.case-step-number { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid var(--hair-strong); border-radius: 50%; flex: none; font-variant-numeric: tabular-nums; }
[aria-current="step"] .case-step-number { background: var(--violet); border-color: var(--violet); color: var(--surface); }
.case-step-short { display: none; }
.case-panel { padding: 30px; }
.case-panel-heading { margin-bottom: 28px; }
.case-panel-heading h3 { font-size: clamp(23px,2.3vw,29px); line-height: 1.22; font-weight: 500; letter-spacing: -.02em; text-wrap: balance; }
.case-panel-heading p { color: var(--muted); margin-top: 10px; max-width: 72ch; font-size: 15px; }
.case-incoming { display: grid; grid-template-columns: 1.15fr 1fr; gap: 36px; }
.case-message dl { margin: 0; }
.case-message dl > div { display: grid; grid-template-columns: 64px 1fr; gap: 12px; padding-bottom: 10px; }
.case-message dt { color: var(--muted); font-size: 13px; }
.case-message dd { margin: 0; font-size: 14px; font-weight: 500; }
.case-message-body { margin: 20px 0 26px; max-width: 65ch; }
.case-documents { margin-top: 12px; border-top: 1px solid var(--hair); }
.case-document { display: flex; width: 100%; align-items: center; gap: 12px; padding: 12px 10px; border: 0; border-bottom: 1px solid var(--hair); color: var(--ink); text-align: left; background: transparent; }
.case-document > .ico { flex: none; width: 20px; height: 20px; color: var(--muted); }
.case-document > .ico:last-child { margin-left: auto; width: 16px; }
.case-document strong { display: block; font-size: 14px; font-weight: 500; }
.case-document small { display: block; font: 11px/1.7 var(--mono); color: var(--muted); }
.case-document[aria-pressed="true"], .case-document:hover { background: var(--violet-soft); color: var(--violet-text); }
.case-document-preview { background: var(--surface-2); border: 1px solid var(--hair); padding: 24px; align-self: start; }
.case-source { padding: 16px 0; border-top: 1px solid var(--hair); }
.case-source-heading { display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: space-between; align-items: baseline; }
.case-source-heading strong { font-size: 14px; font-weight: 600; }
.case-source-heading > span { font: 11px/1.6 var(--mono); color: var(--muted); }
.case-source p { font-size: 14px; line-height: 1.65; margin-top: 10px; max-width: 70ch; }
.case-document-preview .case-source { margin-top: 14px; padding-top: 20px; }
.case-document-preview .case-source p { font: 19px/1.65 'Dirijor Serif',Georgia,serif; margin-top: 26px; }
.case-check-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 32px; }
.case-check-list { border-top: 1px solid var(--hair); }
.case-check { display: flex; align-items: flex-start; gap: 12px; width: 100%; padding: 18px 12px; border: 0; border-bottom: 1px solid var(--hair); background: transparent; color: var(--ink); text-align: left; }
.case-check > span:nth-child(2) { flex: 1; }
.case-check strong, .case-check span > span, .case-check small { display: block; }
.case-check strong { font-size: 15px; font-weight: 600; }
.case-check span > span { font-size: 14px; margin-top: 8px; }
.case-check small { font-size: 12px; color: var(--muted); margin-top: 8px; }
.case-check.has-finding small { color: var(--amber-text); }
.case-check > .ico { width: 16px; height: 16px; margin-top: 4px; flex: none; }
.case-check-number { color: var(--muted); font-size: 12px; padding-top: 3px; font-variant-numeric: tabular-nums; }
.case-check[aria-pressed="true"], .case-check:hover { background: var(--violet-soft); }
.case-check[aria-pressed="true"] { outline: 1px solid var(--violet); outline-offset: -1px; }
.case-check-detail { padding-left: 28px; border-left: 1px solid var(--hair); }
.case-status { display: inline-block; background: var(--bg-tint); color: var(--muted); padding: 5px 9px; font-size: 12px; line-height: 1.5; }
.case-status.attention { background: var(--amber-soft); color: var(--amber-text); }
.case-status.approved { background: var(--green-soft); color: var(--green-text); }
.case-check-detail h4, .case-review-evidence h4 { font-size: 22px; line-height: 1.3; margin-top: 16px; font-weight: 500; }
.case-check-detail > p, .case-review-evidence > p { color: var(--muted); margin-top: 12px; font-size: 14px; }
.case-coordination { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--hair); }
.dirijor-window summary { cursor: pointer; min-height: 44px; padding: 10px 0; color: var(--violet-text); font-size: 14px; text-underline-offset: 3px; }
.dirijor-window summary:hover { text-decoration: underline; }
.case-coordination h4 { margin: 14px 0 8px; }
.case-coordination p { max-width: 75ch; color: var(--muted); font-size: 14px; }
.case-review-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 32px; }
.case-review-evidence { min-width: 0; }
.case-source-link { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; background: transparent; color: var(--violet-text); border: 0; border-bottom: 1px solid var(--hair); text-align: left; font-size: 14px !important; }
.case-source-link .ico { width: 16px; height: 16px; flex: none; }
.case-source-link .ico:last-child { margin-left: auto; }
.case-source-link:hover span { text-decoration: underline; text-underline-offset: 3px; }
.case-review-source { margin-top: 16px; }
.case-missing { margin-top: 24px; }
.case-missing p { font-size: 14px; color: var(--muted); }
.case-compose { padding-left: 28px; border-left: 1px solid var(--hair); min-width: 0; }
.case-owner { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; font-size: 14px; }
.case-owner .ico { color: var(--amber-text); width: 22px; height: 22px; flex: none; }
.case-recipient { display: flex; flex-wrap: wrap; gap: 8px 14px; padding-bottom: 14px; margin-bottom: 18px; border-bottom: 1px solid var(--hair); font-size: 14px; }
.case-recipient > span { color: var(--muted); }
.case-recipient strong { font-weight: 500; }
.case-compose label { display: block; margin-bottom: 10px; font-size: 14px; font-weight: 600; }
.case-compose textarea { width: 100%; min-height: 290px; resize: vertical; padding: 16px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--surface); color: var(--ink); line-height: 1.65; font-size: 14px; caret-color: var(--violet); scrollbar-color: var(--hair-strong) var(--surface); }
.case-decisions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.case-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 10px 16px; border: 1px solid var(--hair-strong); border-radius: 4px; background: transparent; color: var(--ink); font-size: 14px !important; font-weight: 500 !important; text-align: center; line-height: 1.4 !important; }
.case-button:hover:not(:disabled) { background: var(--bg-tint); }
.case-button:disabled { color: var(--muted); border-color: var(--hair); }
.case-primary { background: var(--violet); color: var(--surface); border-color: var(--violet); }
.case-primary:hover:not(:disabled) { background: var(--violet-text); }
.case-button .ico { width: 17px; height: 17px; flex: none; }
.case-error { color: var(--red-text); margin-top: 12px; font-size: 14px; }
.case-navigation { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 30px; border-top: 1px solid var(--hair); }
.case-navigation > span { color: var(--muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.case-navigation > div { display: flex; flex-wrap: wrap; gap: 10px; }
.case-result-heading h3 { margin-top: 16px; }
.case-result-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 36px; }
.case-receipt ul { list-style: none; margin: 16px 0 22px; padding: 0; }
.case-receipt li { display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--hair); font-size: 14px; }
.case-receipt .ico { width: 18px; height: 18px; flex: none; margin-top: 2px; color: var(--violet-text); }
.case-receipt > p { color: var(--muted); font-size: 14px; }
.case-final-draft { padding: 22px; border: 1px solid var(--hair); }
.case-final-draft h4 { margin-bottom: 18px; }
.case-final-draft > p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; }
.dirijor-demo .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
  .case-steps button { padding: 14px 10px; font-size: 12px; gap: 7px; }
  .case-incoming, .case-check-layout, .case-review-layout, .case-result-layout { gap: 24px; }
  .case-panel { padding: 24px; }
  .case-compose, .case-check-detail { padding-left: 20px; }
}
@media (max-width: 700px) {
  .industry-picker { border-left: 0; border-top: 1px solid var(--hair-strong); padding: 26px 0 0; }
  .industry-picker h2 { max-width: 24ch; font-size: 27px; }
  .dirijor-demo { padding-top: 12px; }
  .dirijor-toolbar { padding: 16px; flex-wrap: wrap; gap: 8px; }
  .dirijor-brand > span { font-size: 12px; padding-left: 10px; margin-left: 0; }
  .case-context { padding: 16px; flex-direction: column; align-items: stretch; gap: 12px; }
  .case-context select { width: 100%; }
  .case-context > p { text-align: left; font-size: 12px; }
  .case-step-full { display: none; }
  .case-step-short { display: inline; }
  .case-steps button { flex-direction: column; justify-content: flex-start; text-align: center; height: 100%; padding: 12px 4px; gap: 8px; font-size: 12px; }
  .case-panel { padding: 24px 18px; }
  .case-panel-heading { margin-bottom: 22px; }
  .case-panel-heading p { font-size: 14px; }
  .case-incoming, .case-check-layout, .case-review-layout, .case-result-layout { grid-template-columns: 1fr; gap: 28px; }
  .case-message dl > div { grid-template-columns: 48px 1fr; }
  .case-document-preview { padding: 20px; }
  .case-document-preview .case-source p { font-size: 18px; }
  .case-check-detail, .case-compose { padding: 0; border-left: 0; }
  .case-check-detail h4, .case-review-evidence h4 { font-size: 21px; }
  .case-navigation { padding: 18px; flex-direction: column; align-items: stretch; gap: 12px; }
  .case-navigation > div { display: grid; grid-template-columns: 1fr; }
  .case-navigation .case-primary { order: -1; }
  .case-decisions { flex-direction: column; }
  .case-compose textarea { min-height: 340px; }
}
@media (prefers-reduced-motion: no-preference) {
  .case-button, .case-document, .case-check { transition: background-color .18s ease-out; }
}