/* Get Started: pick an industry, tell us about the team, say where to send the demo.
   The demo request on the left fills in as the visitor answers. */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root { --white: #fff; --bg: #fafafa; --text: #0f172a; --text-2: #475569; --text-3: #94a3b8; --border: #e2e8f0; --accent: #6366f1; --accent-text: #4f46e5; }
body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #edf2f7; color: var(--text); -webkit-font-smoothing: antialiased; }
.gs { --gs-ink: #0f1418; --gs-muted: #56616c; --gs-line: #dde3ea; --gs-sky: #edf2f7; --gs-stage: #121a22; --gs-indigo: #6366f1; --gs-tile: #e9eef4; --gs-error: #b42318;
  position: relative; min-height: 100vh; padding: 176px 0 104px; background: var(--gs-sky); color: var(--gs-ink); }
.gs::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(rgba(15, 20, 24, .07) 1px, transparent 1px) 0 0 / 32px 32px; }
.gs [hidden] { display: none !important; }
.gs-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.gs a:focus-visible, .gs button:focus-visible { outline: 2px solid #b9c7ff; outline-offset: 3px; border-radius: 8px; }
.gs-wrap { position: relative; display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 64px; align-items: start; max-width: 1240px; margin: 0 auto; padding: 0 40px; }

/* ============ LEFT ============ */
.gs-side { position: sticky; top: 112px; }
.gs-side h1 { font-size: clamp(34px, 3.4vw, 46px); font-weight: 800; letter-spacing: -.035em; line-height: 1.05; }

/* The request prints out of a till, like the receipts on the Venues page: a line per answer,
   fed out of the slot as it is given, and the total once the request is complete. */
.gs-till { position: relative; max-width: 420px; margin-top: 28px; padding-top: 12px; }
.gs-till-slot { position: absolute; z-index: 2; top: 0; left: -18px; right: -18px; height: 30px; border-radius: 15px; background: linear-gradient(#2c3038, #1c1f25); box-shadow: 0 14px 30px rgba(15, 20, 24, .35), inset 0 1px 0 rgba(255, 255, 255, .08); }
.gs-till-slot::after { content: ""; position: absolute; left: 16px; right: 16px; top: 13px; height: 5px; border-radius: 3px; background: #060708; }
.gs-till { user-select: none; -webkit-user-select: none; cursor: grab; touch-action: pan-y; }
.gs-till.is-held { cursor: grabbing; }
.gs-receipt-clip { position: relative; overflow: hidden; margin: 0 -12px; padding: 0 16px 30px; perspective: 900px; filter: drop-shadow(0 22px 26px rgba(15, 20, 24, .22)); }
.gs-receipt-hold, .gs-receipt-swing { transform-origin: 50% 0; }
/* What stays in the slot after the receipt is torn off. */
.gs-till-stub { display: none; position: absolute; z-index: 1; top: 26px; left: 4px; right: 4px; height: 15px; background: #fbfaf7; -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; }
.gs-till.is-torn .gs-till-stub { display: block; }
.gs-till.is-torn .gs-receipt-clip { overflow: visible; }
.gs-till.is-torn .gs-receipt { -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%, conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; -webkit-mask-composite: source-in; mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%, conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; mask-composite: intersect; }
.gs-receipt { padding: 30px 24px 30px; background: #fbfaf7; color: #1d2228; -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 14px 100%; }
.gs-receipt-head { display: flex; flex-direction: column; align-items: center; gap: 9px; padding-bottom: 16px; border-bottom: 1px dashed #cfd3d8; text-align: center; }
.gs-receipt-head img { width: auto; height: 20px; }
.gs-receipt-head b { font-size: 16px; font-weight: 750; letter-spacing: -.01em; }
.gs-receipt-head span { margin-top: -5px; font-size: 12.5px; font-weight: 500; color: #6b7280; }
.gs-receipt-empty { padding: 18px 0 6px; font-size: 13px; font-style: italic; color: #8a929c; text-align: center; }
.gs-receipt:has(li.is-filled) .gs-receipt-empty { display: none; }
.gs-receipt ol { list-style: none; }
.gs-receipt li { display: none; align-items: baseline; gap: 14px; padding: 10px 0; overflow: hidden; }
.gs-receipt li.is-filled { display: flex; }
.gs-receipt li:first-child.is-filled, .gs-receipt li.is-filled:first-of-type { padding-top: 14px; }
.gs-receipt li span { flex: none; }
.gs-receipt li b { display: block; font-size: 13.5px; font-weight: 600; color: #4b5563; }
.gs-receipt li small { display: block; margin-top: 3px; font-size: 12px; font-style: italic; color: #7a828c; }
.gs-receipt li small:empty { display: none; }
.gs-receipt li em { flex: 1; min-width: 0; font-style: normal; font-size: 14.5px; font-weight: 700; line-height: 1.35; text-align: right; overflow-wrap: anywhere; }
.gs-receipt-total { display: none; justify-content: space-between; align-items: baseline; margin-top: 6px; padding-top: 14px; border-top: 2px solid #1d2228; font-size: 15px; font-weight: 700; overflow: hidden; }
.gs-till.is-ready .gs-receipt-total { display: flex; }
.gs-receipt-total b { font-size: 24px; font-weight: 850; letter-spacing: -.02em; }
.gs-receipt-foot { margin-top: 14px; font-size: 12.5px; color: #7a828c; text-align: center; font-variant-numeric: tabular-nums; }
/* A new line prints from left to right, a few dots at a time. */
.gs-receipt .is-new { animation: gs-ink .5s steps(10, end); }
.gs-receipt-total.is-new b { animation: gs-total .5s .45s both; }
@keyframes gs-ink { from { clip-path: inset(0 100% 0 0); } }
@keyframes gs-total { from { opacity: 0; transform: scale(.7); } }

.gs-promises { display: grid; gap: 9px; margin-top: 24px; list-style: none; }
.gs-promises li { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: #3b4652; }
.gs-promises svg { flex: none; width: 18px; height: 18px; padding: 2px; border-radius: 50%; background: rgba(99, 102, 241, .12); fill: none; stroke: #4f46e5; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* ============ FORM ============ */
.gs-card { min-width: 0; padding: 22px 32px 28px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 1px rgba(15, 20, 24, .06), 0 30px 60px -36px rgba(15, 20, 24, .35); scroll-margin-top: 110px; }
.gs-progress { display: flex; align-items: center; gap: 4px; margin: 0 -6px 26px; padding-bottom: 16px; border-bottom: 1px solid var(--gs-line); list-style: none; }
.gs-progress li:not(.gs-time) + li:not(.gs-time)::before { content: ""; display: inline-block; vertical-align: middle; width: 18px; height: 1px; margin-right: 4px; background: var(--gs-line); }
.gs-progress button { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 4px 10px 4px 6px; border: 0; border-radius: 999px; background: none; color: var(--gs-muted); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; vertical-align: middle; }
.gs-progress button:hover { color: var(--gs-ink); }
.gs-progress i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid var(--gs-line); font-size: 11.5px; font-style: normal; font-weight: 700; transition: background-color .2s, color .2s, border-color .2s; }
.gs-progress [aria-current] { color: var(--gs-ink); }
.gs-progress [aria-current] i { border-color: var(--gs-ink); background: var(--gs-ink); color: #fff; }
.gs-progress .is-done i { border-color: transparent; background: #e0e7ff; color: #4f46e5; }
.gs-time { margin-left: auto; font-size: 12.5px; color: var(--gs-muted); white-space: nowrap; }
#gsForm { display: flex; flex-direction: column; }
.gs-step { min-inline-size: 0; border: 0; }
.gs-step-title { width: 100%; padding: 0; }
.gs-step-title h2 { font-size: 24px; font-weight: 750; letter-spacing: -.025em; line-height: 1.2; }
.gs-step-title h2:focus { outline: none; }
.gs-step-sub { margin: 6px 0 22px; font-size: 14.5px; line-height: 1.5; color: var(--gs-muted); }

/* Industry tiles: the same small drawings as the Industries page, grey until picked or pointed at. */
.gs-group-head { display: flex; align-items: baseline; gap: 7px; margin: 0 0 10px; font-size: 13px; }
.gs-group-head b { font-weight: 700; }
.gs-group-head span { color: var(--gs-muted); }
.gs-tiles { display: grid; gap: 10px; margin-bottom: 20px; }
.gs-tiles.is-office { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gs-tiles.is-venues { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 4px; }
.gs-tile { position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 14px 6px 12px; border: 1px solid var(--gs-line); border-radius: 14px; background: #fff; cursor: pointer; transition: border-color .2s, box-shadow .2s, transform .2s, background-color .2s; }
.gs-tile input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.gs-tile-thumb { display: grid; place-items: center; width: 60px; height: 46px; border-radius: 10px; background: var(--gs-tile); }
.gs-o { display: block; width: 46px; height: 34px; overflow: visible; filter: drop-shadow(0 1px 1.5px rgba(15, 20, 24, .16)); transition: filter .25s, transform .25s cubic-bezier(.2, .7, .2, 1); }
.gs-o text { font-family: Inter, -apple-system, sans-serif; }
.gs-tile-name { font-size: 13.5px; font-weight: 600; line-height: 1.25; text-align: center; }
.gs-tile:hover { border-color: #c3cad3; transform: translateY(-1px); }
.gs-tile:hover .gs-o { transform: scale(1.06); }
.gs-tile:has(input:focus-visible) { outline: 2px solid #b9c7ff; outline-offset: 2px; }
.gs-tile:has(input:checked) { border-color: var(--gs-indigo); background: #f7f7ff; box-shadow: inset 0 0 0 1px var(--gs-indigo); }
.gs-tile:has(input:checked)::after { content: ""; position: absolute; top: 8px; right: 8px; width: 18px; height: 18px; border-radius: 50%; background: var(--gs-indigo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px no-repeat; animation: gs-pop .3s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes gs-pop { from { transform: scale(.3); opacity: 0; } }
@media (hover: hover) {
  .gs-tile .gs-o { filter: grayscale(1) contrast(.92) drop-shadow(0 1px 1.5px rgba(15, 20, 24, .16)); }
  .gs-tile:hover .gs-o, .gs-tile:has(input:checked) .gs-o { filter: drop-shadow(0 1px 1.5px rgba(15, 20, 24, .16)); }
}
.gs-tile.is-other .gs-tile-thumb { background: none; border: 1px dashed #c3cad3; }
.gs-tile.is-other svg { width: 18px; height: 18px; fill: none; stroke: var(--gs-muted); stroke-width: 1.8; stroke-linecap: round; }
.gs-tile.is-other .gs-tile-name { color: var(--gs-muted); }
/* Picking Another industry opens one question under the tiles. */
.gs-other { margin: -6px 0 22px; animation: gs-open .3s ease-out; }
@keyframes gs-open { from { opacity: 0; transform: translateY(-4px); } }

/* Fields */
.gs-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.gs-field { min-width: 0; margin-bottom: 18px; border: 0; }
.gs-field > label, .gs-field > legend { display: block; margin-bottom: 8px; padding: 0; font-size: 13.5px; font-weight: 600; line-height: 1.4; }
.gs-optional { margin-left: 6px; font-size: 12.5px; font-weight: 400; color: var(--gs-muted); }
.gs-field input, .gs-field select, .gs-field textarea { width: 100%; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid var(--gs-line); border-radius: 11px; background: #fbfcfd; color: var(--gs-ink); font: inherit; font-size: 15px; transition: border-color .15s, box-shadow .15s, background-color .15s; }
.gs-field textarea { min-height: 76px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.gs-field select { appearance: none; padding-right: 40px; background: #fbfcfd url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5 6 7.5l3-3' fill='none' stroke='%2356616c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 14px center / 12px no-repeat; }
.gs-field input::placeholder, .gs-field textarea::placeholder { color: #8a95a1; opacity: 1; }
.gs-field input:hover, .gs-field select:hover, .gs-field textarea:hover { border-color: #c3cad3; }
.gs-field input:focus, .gs-field select:focus, .gs-field textarea:focus { outline: none; border-color: var(--gs-indigo); background-color: #fff; box-shadow: 0 0 0 4px rgba(99, 102, 241, .14); }
.gs-field.is-invalid input, .gs-field.is-invalid select { border-color: var(--gs-error); }
.gs-field-error { margin-top: 6px; font-size: 12.5px; font-weight: 500; color: var(--gs-error); }
.gs-step > .gs-field-error { margin: 8px 0 0; }

/* Choice chips: one size, any number of tasks. */
.gs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gs-chip { position: relative; cursor: pointer; }
.gs-chip input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.gs-chip span { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 15px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; font-size: 14px; font-weight: 500; transition: border-color .15s, background-color .15s, color .15s; }
.gs-chip:hover span { border-color: #c3cad3; }
.gs-chip input:focus-visible + span { outline: 2px solid #b9c7ff; outline-offset: 2px; }
.gs-chip input[type="radio"]:checked + span { border-color: var(--gs-ink); background: var(--gs-ink); color: #fff; }
.gs-chip input[type="checkbox"]:checked + span { border-color: var(--gs-indigo); background: #eef0ff; color: #3730a3; }
.gs-chip input[type="checkbox"]:checked + span::before { content: ""; width: 14px; height: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.2l3 3 6-6.4' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.gs-field.is-invalid .gs-chip span { border-color: #f2b8b0; }

.gs-verification { min-height: 65px; margin: 4px 0 10px; }
.gs-privacy { font-size: 12.5px; line-height: 1.5; color: var(--gs-muted); }
.gs-privacy a { color: inherit; text-underline-offset: 3px; }
.gs-honeypot { position: absolute; left: -9999px; top: -9999px; }
.gs-form-error { margin-top: 14px; padding: 10px 12px; border-radius: 10px; background: #fdeeea; color: #7a2416; font-size: 13.5px; line-height: 1.45; }
.gs-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--gs-line); }
.gs-back { margin-right: auto; min-height: 44px; padding: 0 4px; border: 0; background: none; color: var(--gs-muted); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.gs-back:hover { color: var(--gs-ink); }
.gs-next { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px; border: 0; border-radius: 12px; background: var(--gs-ink); color: #fff; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; transition: background-color .2s; }
.gs-next:hover:not(:disabled) { background: #26303a; }
.gs button:disabled { cursor: wait; opacity: .6; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1100px) {
  .gs-wrap { gap: 40px; }
}
/* One column: the headline, then the form, then the demo request under it. */
@media (max-width: 980px) {
  .gs { padding: 140px 0 72px; }
  .gs-wrap { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .gs-side { display: contents; }
  .gs-side h1 { order: 0; }
  .gs-card { order: 1; }
  .gs-till, .gs-promises { order: 2; }
  .gs-till { margin: 0 auto; width: calc(100% - 36px); }
  .gs-promises { margin-top: -6px; }
}
@media (max-width: 719px) {
  .gs { padding: 122px 0 56px; }
  .gs-wrap { padding: 0 16px; }
  .gs-card { padding: 16px 16px 20px; border-radius: 20px; }
  .gs-progress { margin: 0 -4px 20px; padding-bottom: 12px; }
  .gs-progress button { padding-right: 6px; font-size: 13px; }
  .gs-progress button:not([aria-current]) { font-size: 0; gap: 0; }
  .gs-progress button:not([aria-current]) i { font-size: 11.5px; }
  .gs-time { display: none; }
  .gs-step-title h2 { font-size: 21px; }
  /* On a phone the tiles lie flat, two to a row. */
  .gs-tiles.is-office, .gs-tiles.is-venues { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gs-tile { flex-direction: row; gap: 10px; padding: 8px 10px 8px 8px; }
  .gs-tile-thumb { width: 46px; height: 38px; flex: none; }
  .gs-o { width: 36px; height: 28px; }
  .gs-tile-name { text-align: left; font-size: 13.5px; }
  .gs-tile:has(input:checked)::after { top: 50%; right: 8px; margin-top: -9px; }
  .gs-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .gs-next { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .gs-receipt .is-new, .gs-receipt-total.is-new b, .gs-tile:has(input:checked)::after, .gs-other { animation: none; }
  .gs-tile, .gs-o { transition: none; }
}