/* Request-a-demo page: the account page's two-column layout with a form card. */
.demo-expectations { margin: 22px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; max-width: 44ch; color: var(--slate); font-size: 15px; line-height: 1.55; }
.demo-expectations li { position: relative; padding-left: 22px; }
.demo-expectations li::before { content: ""; position: absolute; left: 0; top: .5em; width: 10px; height: 10px; border-radius: 50%; background: var(--navy); }
.demo-expectations a, .demo-done a { color: var(--navy); font-weight: 600; }
.auth-card .optional { font-weight: 400; color: var(--slate); }
.auth-card textarea { width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid #9ba7b9; border-radius: 7px; color: var(--ink); background: #fff; font: inherit; font-size: 16px; line-height: 1.5; resize: vertical; }
.auth-card textarea:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
.demo-trap { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.demo-done { margin-top: 8px; }
.demo-done h3 { margin: 10px 0 12px; font-size: 26px; color: var(--navy); }
.demo-done p { color: var(--slate); line-height: 1.6; }
#demo-description, .demo-done > p:not(.kicker) { font-weight: 350; }
.auth-header .hero-button { margin-left: auto; }
@media (max-width: 700px) { .demo-expectations { max-width: none; } }