/* Request and confirmation states are scoped to the demo page. */
#demo-request [hidden], #demo-request-intro[hidden] { display: none !important; }
.demo-request.is-confirmed { margin-top: 0; padding: clamp(24px, 4vw, 40px); border-color: #b9dce2; }
.demo-confirmation-received { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; color: #166534; font-weight: 600; }
.demo-confirmation-received svg { flex: 0 0 28px; width: 28px; height: 28px; }
#demo-confirmation h2 { margin-bottom: 16px; }
#demo-confirmation h2:focus { outline: none; }
.demo-confirmation-description { margin: 0 0 24px; }
.demo-confirmation-followup { margin: 20px 0 0; font-size: 14px; color: #475569; }
.demo-confirmation-preview { margin: 0 0 20px; padding: 10px 14px; border: 1px dashed #94a3b8; border-radius: 6px; font-size: 13px; color: #475569; }
.demo-request-status { margin: 20px 0 0; padding: 12px 16px; border-left: 3px solid #b91c1c; background: #fff; color: #991b1b; }
#demo-request a:focus-visible, #demo-request button:focus-visible { outline: 3px solid #0e7490; outline-offset: 4px; }
#demo-request-form[aria-busy="true"] button { cursor: wait; }