:root { color-scheme: light; --demo-ink:#163342; --demo-accent:#116c65; --demo-muted:#526a74; }
.demo-home { margin:0; background:#f4f7f7; color:var(--demo-ink); font:16px/1.6 'Segoe UI',system-ui,sans-serif; }
.demo-home a { color:var(--demo-accent); }
.demo-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem max(2rem,calc((100vw - 1180px)/2)); background:white; border-bottom:1px solid #dce5e6; }
.demo-brand { display:flex; gap:.8rem; align-items:center; font-weight:750; font-size:1.3rem; text-decoration:none; color:var(--demo-ink)!important; }
.demo-brand span { font-size:1.05rem; font-weight:650; }
.demo-badge { display:inline-block; font-size:.8rem; background:#e2f0ec; color:#225f52; padding:.35rem .7rem; border-radius:2rem; }
.demo-main { max-width:1180px; margin:0 auto; padding:3.7rem 2rem 2rem; display:grid; grid-template-columns:1.15fr 1fr; gap:3rem; }
.demo-eyebrow,.demo-label { font-size:.75rem; letter-spacing:.13em; font-weight:700; color:var(--demo-accent); }
.demo-hero h1 { font-size:clamp(2.2rem,4vw,3.6rem); line-height:1.18; letter-spacing:-.04em; margin:.8rem 0 1.4rem; }
.demo-lead { color:var(--demo-muted); font-size:1.05rem; max-width:36rem; }
.demo-primary { display:inline-flex; gap:2rem; padding:.9rem 1.3rem; border-radius:.5rem; background:var(--demo-accent); color:white!important; text-decoration:none; font-weight:650; margin:1rem 0 0; }
.demo-hint { font-size:.8rem; color:var(--demo-muted); }
.demo-scenario { padding:2rem; background:#fff; border:1px solid #dce5e6; border-radius:1rem; box-shadow:0 10px 30px #16334208; }
.demo-scenario h2 { font-size:1.5rem; line-height:1.35; margin:.8rem 0; }
.demo-scenario > p { color:var(--demo-muted); }
.demo-steps { list-style:none; margin:1.5rem 0 0; padding:0; }
.demo-steps li { border-left:3px solid #b4d7ce; padding:.4rem 0 .4rem 1rem; margin:1rem 0; }
.demo-steps strong,.demo-steps span { display:block; }
.demo-steps span { color:var(--demo-muted); font-size:.85rem; }
.demo-role-section,.demo-bottom,.demo-main footer { grid-column:1/-1; }
.demo-role-section h2 { font-size:1.4rem; margin-top:0; }
.demo-role-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.demo-role { display:block; text-decoration:none; padding:1.5rem; background:white; border:1px solid #dce5e6; border-radius:.7rem; color:var(--demo-ink)!important; transition:box-shadow .15s,border-color .15s; }
.demo-role:hover { border-color:var(--demo-accent); box-shadow:0 8px 25px #1633420c; }
.demo-role h3 { margin:.8rem 0 .4rem; font-size:1.2rem; }
.demo-role p { color:var(--demo-muted); font-size:.9rem; }
.demo-role strong { color:var(--demo-accent); font-size:.85rem; }
.demo-number { color:var(--demo-accent); font-size:.8rem; font-weight:700; background:#e7f1ed; border-radius:.4rem; padding:.25rem .5rem; }
.demo-bottom { display:grid; grid-template-columns:1fr 1fr; gap:3rem; border-top:1px solid #dce5e6; padding-top:1.5rem; }
.demo-bottom h2 { font-size:1.05rem; }.demo-bottom p,.demo-bottom small,.demo-main footer { color:var(--demo-muted); font-size:.9rem; }
.demo-main footer { border-top:1px solid #dce5e6; padding-top:1.5rem; font-size:.8rem; }
.demo-home a:focus-visible,.demo-nav a:focus-visible { outline:3px solid #e4aa36; outline-offset:4px; }
body.demo-portal main { max-width:1100px; margin-top:1rem; }
.demo-nav { position:sticky; top:0; z-index:5; display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; padding:.8rem 1rem; background:#163342; color:white; box-shadow:0 2px 8px #0002; font:14px/1.4 'Segoe UI',sans-serif; }
.demo-nav a { color:white; text-decoration:none; padding:.4rem .65rem; border-radius:.3rem; }
.demo-nav a[aria-current=page] { background:#2a706b; }.demo-nav span { margin-left:auto; font-size:.8rem; color:#d0e5df; }
body[data-demo-pane=collection] #workspace > section:not(#intake-summary),
body[data-demo-pane=comparison] #workspace > section:not(#financial-analytics),
body[data-demo-pane=review] #workspace > section:not(#review-file),
body[data-demo-pane=comparison] #requests,body[data-demo-pane=review] #requests,
body[data-demo-pane=comparison] #readiness,body[data-demo-pane=review] #readiness { display:none; }
body.demo-portal #login-form { display:none; }
@media(max-width:760px) {
  .demo-main { padding:2rem 1rem; grid-template-columns:1fr; gap:2rem; }
  .demo-top { padding:1rem; align-items:flex-start; }.demo-badge { max-width:10rem; }
  .demo-role-grid,.demo-bottom { grid-template-columns:1fr; }.demo-scenario { padding:1.5rem; }
  .demo-nav span { width:100%; margin-left:0; }
}