.investigation-demo { max-width:1240px; margin:0 auto; padding:64px 24px; }
.investigation-demo [hidden] { display:none !important; }
.investigation-demo p { color:var(--ink-2); line-height:1.65; }
.investigation-demo h1 { font:600 clamp(32px,4vw,48px)/1.12 var(--sans); letter-spacing:-.03em; max-width:23ch; margin:16px 0; }
.demo-intro > p { max-width:82ch; }
.demo-disclosure { font-size:14px; padding:16px 20px; border:1px solid var(--line); border-radius:var(--r-md); background:var(--bg-1); margin:24px 0 32px; }
.demo-shell { border:1px solid var(--line); border-radius:var(--r-lg); background:var(--bg-1); overflow:hidden; }
.demo-casebar { display:flex; align-items:center; flex-wrap:wrap; gap:20px; padding:20px 28px; border-bottom:1px solid var(--line); }
.demo-casebar > div:first-child { margin-right:auto; }
.demo-casebar strong, .demo-label { display:block; }
.demo-label { font:500 11px/1.5 var(--mono); text-transform:uppercase; letter-spacing:.09em; color:var(--ink-3); margin:0 0 8px; }
.demo-casebar label { font-size:13px; margin-right:8px; }
.demo-casebar select { max-width:100%; font:inherit; color:var(--ink); background:var(--bg-1); border:1px solid var(--line-2); padding:10px; border-radius:var(--r-sm); }
.demo-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:12px; gap:8px; border-bottom:1px solid var(--line); }
.demo-steps button { display:flex; align-items:center; justify-content:center; gap:10px; border:1px solid transparent; border-radius:var(--r-sm); background:transparent; color:var(--ink-2); padding:14px 10px; font:500 15px/1.3 var(--sans); cursor:pointer; }
.demo-steps button[aria-current="step"] { background:var(--ink); color:var(--bg-1); }
.demo-steps button:hover { border-color:var(--line-3); }
.demo-steps button span { opacity:.7; font:12px/1 var(--mono); }
.demo-content { padding:32px; }
.demo-content section + section { margin-top:36px; }
.demo-shell.is-interactive .demo-content section { margin-top:0; }
.demo-section-head { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:16px; margin-bottom:14px; }
.demo-section-head h2 { font-size:24px; letter-spacing:-.02em; line-height:1.25; margin:0; }
.demo-chip { display:inline-block; border:1px solid var(--line-2); border-radius:999px; padding:7px 12px; font-size:12px; color:var(--ink-2); }
.demo-comparison { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:24px 0; }
.demo-page-example { min-width:0; margin:0; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; }
.demo-page-example figcaption { padding:12px 16px; font-size:12px; color:var(--ink-2); border-bottom:1px solid var(--line); }
.demo-page-example code { display:block; color:var(--ink); margin-top:4px; overflow-wrap:anywhere; }
.demo-mock-page { padding:28px; background:var(--surface); color:var(--ink); }
.demo-wordmark { font-size:15px; font-weight:700; }
.demo-mock-page h3 { font-size:20px; margin:18px 0; }
.demo-mock-field { background:var(--bg-1); border:1px solid var(--line-2); border-radius:6px; padding:10px; margin:10px 0; color:var(--ink-3); font-size:12px; }
.demo-mock-submit { display:block; text-align:center; border:1px solid var(--ink); padding:10px; border-radius:6px; font-size:13px; font-weight:600; }
.demo-mock-page small { display:block; font-size:11px; color:var(--ink-3); margin-top:18px; }
.demo-parked { min-height:295px; }
.demo-facts { display:grid; grid-template-columns:1fr 1fr; gap:24px; padding-top:12px; }
.demo-facts > div { min-width:0; }
.demo-facts dt { font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px; }
.demo-facts dd { font-size:14px; margin:0; color:var(--ink-2); line-height:1.65; overflow-wrap:anywhere; }
.demo-choice { display:flex; gap:12px; padding:20px; margin:12px 0; border:1px solid var(--line); border-radius:var(--r-md); cursor:pointer; }
.demo-choice:has(input:checked) { border-color:var(--ink); background:var(--surface); }
.demo-choice input { flex-shrink:0; margin-top:5px; }
.demo-choice strong, .demo-choice span span { display:block; font-size:15px; line-height:1.6; }
.demo-choice span span { color:var(--ink-2); font-size:14px; }
.demo-decision-options .btn { margin-top:12px; }
.demo-message { font-size:14px; margin-top:16px; }
.demo-response-record { border:1px solid var(--line); border-radius:var(--r-md); padding:24px; margin:24px 0; }
.demo-response-record h3 { font-size:20px; margin:0 0 12px; }
.demo-note { font-size:14px; }
.demo-timeline { padding-left:24px; }
.demo-timeline li { padding:12px 0; }
.demo-timeline p { margin:6px 0; }
.demo-footer { padding:20px 32px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.demo-footer span { color:var(--ink-3); font-size:13px; }
.investigation-demo button:disabled { opacity:.45; cursor:default; }
.investigation-demo :is(a,button,select,input):focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.demo-next-actions { display:grid; grid-template-columns:1fr auto; gap:40px; padding:40px 0 0; margin-top:24px; }
.demo-next-actions h2 { font-size:28px; margin:12px 0; }
.demo-actions { display:flex; flex-direction:column; align-items:stretch; gap:12px; justify-content:center; }
.investigation-demo .btn { white-space:normal; text-align:center; }
@media(max-width:720px) { .investigation-demo { padding:36px 16px; } .demo-casebar,.demo-content,.demo-footer { padding:20px; } .demo-comparison,.demo-facts,.demo-next-actions { grid-template-columns:1fr; } .demo-steps { grid-template-columns:1fr 1fr; } .demo-casebar label { display:block; margin-bottom:8px; } .demo-footer { flex-wrap:wrap; } .demo-footer span { order:-1; width:100%; } .demo-response-record { padding:18px; } }