/* A selectable HTML product walkthrough. No video or remote animation assets. */
.finder-demo { --demo-accent:#2563eb; --demo-wash:#edf3ff; --demo-ink:#172741; --demo-sub:#5a6d87; --demo-line:#dce5f1; --demo-paper:#fff; max-width:590px; margin-inline:auto; color:var(--demo-ink); font-family:"DM Sans",sans-serif; }
.finder-demo *, .finder-demo *::before, .finder-demo *::after { box-sizing:border-box; }
.finder-demo [hidden] { display:none!important; }
.finder-demo__intro { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 2px 12px; font-size:10px; font-weight:800; letter-spacing:.1em; color:var(--home-text-soft); }
.finder-demo__sample { border:1px solid var(--home-ghost-border); padding:5px 9px; border-radius:20px; letter-spacing:0; font-weight:500; white-space:nowrap; }
.finder-demo__window { border:1px solid var(--demo-line); border-radius:16px; background:var(--demo-paper); overflow:hidden; box-shadow:0 25px 70px -28px #153b7055; }
.finder-demo__browser { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; background:var(--demo-wash); border-bottom:1px solid var(--demo-line); color:var(--demo-sub); font-size:10px; }
.finder-demo__browser > span:first-child { letter-spacing:3px; color:#8a9db9; }
.finder-demo__browser > span:nth-child(2) { flex:1; padding:5px 8px; text-align:center; border:1px solid var(--demo-line); background:var(--demo-paper); border-radius:5px; }
.finder-demo__bar { display:flex; align-items:center; justify-content:space-between; padding:12px 22px; border-bottom:1px solid var(--demo-line); font-size:10px; color:var(--demo-sub); font-variant-numeric:tabular-nums; }
.finder-demo__brand { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:800; color:var(--demo-ink); }
.finder-demo__brand b { display:grid; place-items:center; width:23px; height:23px; background:var(--demo-accent); color:var(--demo-paper); border-radius:6px; font-size:15px; }
.finder-demo__scenes { position:relative; background:radial-gradient(ellipse at 100% 0,var(--demo-wash),transparent 70%); }
.finder-demo__scene { position:relative; min-height:340px; padding:22px 24px 68px; }
.finder-demo__eyebrow { margin:0 0 7px; color:var(--demo-sub); font-size:9px; letter-spacing:.12em; font-weight:700; }
.finder-demo h2 { margin:0 0 18px; font:700 22px/1.2 "Outfit",sans-serif; letter-spacing:-.02em; color:var(--demo-ink); }
.fd-field { position:relative; padding:10px 12px; border:1px solid var(--demo-line); border-radius:8px; background:var(--demo-paper); min-height:59px; }
.fd-field > span { display:block; font-size:10px; margin-bottom:5px; color:var(--demo-sub); }
.fd-field strong { font-size:12px; font-weight:600; padding-right:16px; }
.fd-field > i { position:absolute; right:12px; top:26px; font-style:normal; color:var(--demo-accent); }
.fd-placeholder { display:none; color:var(--demo-sub); }
.fd-dropdown { display:none; position:absolute; z-index:3; left:24px; right:24px; top:155px; padding:5px; border:1px solid var(--demo-accent); border-radius:8px; background:var(--demo-paper); box-shadow:0 14px 25px #0002; font-size:11px; }
.fd-dropdown > div { padding:9px; border-radius:5px; }
.fd-dropdown > div:nth-child(2) { color:var(--demo-accent); background:var(--demo-wash); }
.fd-dropdown b { float:right; }
.fd-label { margin:16px 0 8px; font-size:11px; color:var(--demo-sub); }
.fd-options { display:flex; flex-wrap:wrap; gap:7px; }
.fd-options > span { padding:8px; font-size:11px; border:1px solid var(--demo-accent); color:var(--demo-accent); background:var(--demo-wash); border-radius:7px; transition:background .2s,border-color .2s; }
.fd-options i, .fd-result > i { display:inline-grid; place-items:center; width:15px; height:15px; margin-right:4px; background:var(--demo-accent); border:1px solid var(--demo-accent); color:var(--demo-paper); border-radius:3px; font-style:normal; font-size:10px; }
.fd-bottom { position:absolute; bottom:20px; left:24px; right:24px; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.fd-bottom > span:first-child { font-size:10px; color:var(--demo-sub); }
.fd-action { display:inline-block; padding:10px 12px; border-radius:7px; background:var(--demo-accent); color:var(--demo-paper); font-size:11px; font-weight:700; white-space:nowrap; }
.fd-filter { margin:-8px 0 14px; color:var(--demo-sub); font-size:10px; }
.fd-filter > span { color:var(--demo-accent); margin:0 3px; }
.fd-result { display:flex; gap:10px; align-items:center; border:1px solid var(--demo-line); border-radius:9px; padding:10px; margin-top:8px; background:var(--demo-paper); transition:opacity .3s,transform .3s,border-color .3s,background .3s; }
.fd-result > div { flex:1; min-width:0; }
.fd-result strong { font-size:12px; }
.fd-result small { display:block; margin-top:3px; font-size:10px; color:var(--demo-sub); }
.fd-result > i { margin:0; flex-shrink:0; }
.fd-logo { display:grid; place-items:center; width:34px; height:34px; flex-shrink:0; border-radius:8px; background:#e1eaff; color:#1d4ed8; font-size:15px; }
.fd-logo--b { color:#15745c; background:#e3f4ef; }
.fd-loading { display:none; position:absolute; inset:145px 24px auto; text-align:center; color:var(--demo-sub); font-size:12px; padding:25px 0; }
.fd-loading span { display:block; font-size:25px; letter-spacing:8px; color:var(--demo-accent); animation:fd-load .7s alternate infinite; }
.fd-table { width:100%; border-collapse:collapse; font-size:11px; line-height:1.4; }
.fd-table th, .fd-table td { text-align:left; padding:10px 6px; border-bottom:1px solid var(--demo-line); transition:background .3s; }
.fd-table th { font-weight:600; }
.fd-table thead { font-size:10px; color:var(--demo-sub); }
.fd-table td { color:var(--demo-accent); }
.fd-table .fd-unknown { color:var(--demo-sub); }
.fd-note { color:var(--demo-sub); font-size:10px; margin:10px 0 0; }
.fd-profile-head { display:flex; align-items:center; gap:10px; }
.fd-profile-head h2 { font-size:20px; margin:0 0 3px; }
.fd-profile-head div > span { font-size:10px; color:var(--demo-sub); }
.fd-tabs { display:flex; gap:18px; font-size:11px; margin-top:15px; border-bottom:1px solid var(--demo-line); }
.fd-tabs span { padding:9px 0; color:var(--demo-sub); border-bottom:2px solid transparent; }
.fd-tabs span:last-child { color:var(--demo-accent); border-color:var(--demo-accent); }
.fd-overview, .fd-integration { padding-top:15px; font-size:12px; line-height:1.6; }
.fd-overview { display:none; }
.fd-overview p, .fd-integration p { font-size:11px; color:var(--demo-sub); margin:7px 0; }
.fd-integration > span { color:var(--demo-accent); font-size:10px; }
.finder-demo__cursor { position:absolute; z-index:5; top:85%; left:85%; width:26px; height:32px; pointer-events:none; opacity:0; transition:left .48s cubic-bezier(.4,0,.2,1),top .48s cubic-bezier(.4,0,.2,1); }
.finder-demo__cursor svg { width:100%; height:100%; fill:#172741; stroke:#fff; stroke-width:1.8px; filter:drop-shadow(0 2px 3px #0005); }
.finder-demo__cursor > span { display:none; position:absolute; top:-12px; left:-12px; width:32px; height:32px; border:2px solid var(--demo-accent); border-radius:50%; background:#60a5fa33; }
.finder-demo__cursor[data-click="true"] > span { display:block; animation:fd-click .6s ease-out both; }
.finder-demo__cursor[data-click="true"] svg { animation:fd-press .3s ease; }
.finder-demo[data-enhanced][data-running="true"] .finder-demo__cursor { opacity:1; }
.finder-demo[data-running="false"] * { animation-play-state:paused!important; }
.finder-demo__controls { border-top:1px solid var(--demo-line); }
.fd-progress { height:3px; background:var(--demo-wash); }
.fd-progress > span { display:block; height:100%; width:0; background:var(--demo-accent); transition:width .6s linear; }
.finder-demo__steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:0 12px; }
.finder-demo__steps button { border:0; background:none; color:var(--demo-sub); min-height:42px; font:600 10px "DM Sans",sans-serif; padding:8px 3px; cursor:pointer; }
.finder-demo__steps button[aria-pressed="true"] { color:var(--demo-accent); background:var(--demo-wash); }
.fd-playback { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:3px 15px 9px; }
.fd-playback > span { color:var(--demo-sub); font-size:10px; line-height:1.4; }
.finder-demo__toggle { border:0; background:var(--demo-wash); color:var(--demo-accent); border-radius:5px; font:600 11px "DM Sans",sans-serif; min-height:32px; padding:6px 10px; white-space:nowrap; cursor:pointer; }
.finder-demo button:focus-visible, .finder-demo a:focus-visible { outline:3px solid var(--demo-accent); outline-offset:-3px; border-radius:5px; }
.finder-demo__footer { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 2px 0; }
.finder-demo__footer p { margin:0; color:var(--home-muted); font-size:10px; line-height:1.5; }
.finder-demo__footer a { color:var(--home-blue); font-size:11px; font-weight:700; line-height:1.5; text-decoration:none; }
.finder-demo__footer a:hover { text-decoration:underline; }
.finder-demo__sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* Each beat is applied only after the simulated pointer reaches its target. */
.finder-demo__scene:is([data-beat="-1"],[data-beat="0"]) .fd-placeholder { display:inline; }
.finder-demo__scene:is([data-beat="-1"],[data-beat="0"]) .fd-selected { display:none; }
.finder-demo__scene[data-beat="0"] .fd-dropdown { display:block; }
.finder-demo__scene:is([data-beat="-1"],[data-beat="0"],[data-beat="1"]) .fd-options > span,
.finder-demo__scene[data-beat="2"] .fd-options > span:last-child { background:var(--demo-paper); border-color:var(--demo-line); color:var(--demo-sub); }
.finder-demo__scene:is([data-beat="-1"],[data-beat="0"],[data-beat="1"]) .fd-options i,
.finder-demo__scene[data-beat="2"] .fd-options > span:last-child i { background:transparent; color:transparent; border-color:var(--demo-sub); }
.fd-results[data-beat="-1"] .fd-loading { display:block; }
.fd-results[data-beat="-1"] .fd-result { opacity:0; transform:translateY(10px); }
.fd-results:is([data-beat="-1"],[data-beat="0"]) .fd-result > i,
.fd-results[data-beat="1"] .fd-result:nth-of-type(4) > i { background:transparent; color:transparent; border-color:var(--demo-sub); }
.fd-results:is([data-beat="-1"],[data-beat="0"],[data-beat="1"]) .fd-selection { visibility:hidden; }
.fd-results:is([data-beat="1"],[data-beat="2"],[data-beat="3"],[data-beat="4"]) .fd-result[data-cursor="result-a"],
.fd-results:is([data-beat="2"],[data-beat="3"],[data-beat="4"]) .fd-result[data-cursor="result-b"] { background:var(--demo-wash); border-color:var(--demo-accent); }
.fd-comparison[data-beat="1"] [data-cursor="row-stock"],
.fd-comparison[data-beat="2"] [data-cursor="row-erp"],
.fd-comparison[data-beat="3"] [data-cursor="row-cloud"] { background:var(--demo-wash); }
.fd-profile[data-beat="-1"] .fd-overview { display:block; }
.fd-profile[data-beat="-1"] .fd-integration { display:none; }
.fd-profile[data-beat="-1"] .fd-tabs span:first-child { color:var(--demo-accent); border-color:var(--demo-accent); }
.fd-profile[data-beat="-1"] .fd-tabs span:last-child { color:var(--demo-sub); border-color:transparent; }
.fd-profile[data-beat="2"] .fd-integration p { background:var(--demo-wash); }
.finder-demo__scene[data-beat="4"] .fd-action { box-shadow:0 0 0 4px var(--demo-wash); }
@keyframes fd-click { from { opacity:1; transform:scale(.3); } to { opacity:0; transform:scale(1.65); } }
@keyframes fd-press { 50% { transform:scale(.83); } }
@keyframes fd-load { to { opacity:.25; } }
@media (prefers-color-scheme:dark) {
  .finder-demo { --demo-accent:#8abbff; --demo-wash:#1b3150; --demo-ink:#e7effc; --demo-sub:#a5b6d0; --demo-line:#2a3b56; --demo-paper:#111e32; }
  .finder-demo__brand b,.fd-action { color:#112039; }
}
@media (max-width:599px) {
  .finder-demo__scene { padding:18px 15px 85px; min-height:350px; }
  .finder-demo h2 { font-size:20px; }
  .fd-dropdown { left:15px; right:15px; top:148px; }
  .fd-bottom { left:15px; right:15px; bottom:16px; align-items:flex-end; }
  .fd-bottom > span:first-child { max-width:110px; }
  .fd-table th,.fd-table td { padding:10px 3px; font-size:10px; }
  .fd-result { gap:7px; padding:9px 7px; }
  .fd-result small { font-size:9px; }
  .finder-demo__browser { padding:8px; gap:5px; font-size:8px; }
  .finder-demo__browser > span:first-child { letter-spacing:0; }
  .finder-demo__bar { padding:10px 15px; }
  .finder-demo__footer { flex-direction:column; align-items:flex-start; gap:5px; }
  .finder-demo__intro { font-size:9px; letter-spacing:.03em; }
  .finder-demo__steps { padding:0 5px; }
}
@media (prefers-reduced-motion:reduce) {
  .finder-demo *, .finder-demo *::before,.finder-demo *::after { animation:none!important; transition:none!important; }
  .finder-demo__cursor { display:none; }
}

/* Align the walkthrough hero with the same content rail as the sections below. */
.home-hero-layout { max-width: var(--home-max); }
.home-hero .home-title { text-shadow: none; }
.finder-demo__scenes { overflow: hidden; }
@media (min-width: 960px) {
  .home-hero-layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 2rem; }
  .home-hero-visual { justify-self: stretch; }
}

/* Subdued, muted warehouse footage below the primary introduction. */
.home-warehouse-film { position:relative; width:100%; aspect-ratio:3.6; min-height:125px; margin:22px 0 0; border:1px solid var(--home-ghost-border); border-radius:12px; overflow:hidden; background:#132337; isolation:isolate; }
.home-warehouse-film video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 43%; filter:saturate(.6) brightness(.78); }
.home-warehouse-film::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(7,17,31,.78),rgba(7,17,31,.35) 95%); pointer-events:none; z-index:1; }
.home-warehouse-film figcaption { position:absolute; inset:auto 14px 14px; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; color:#fff; }
.home-warehouse-film figcaption > span { font-size:8px; line-height:1.8; letter-spacing:.07em; }
.home-warehouse-film strong { font-size:14px; font-weight:700; letter-spacing:0; }
.home-warehouse-film button { flex-shrink:0; min-height:36px; border:1px solid #ffffff33; border-radius:7px; padding:7px 10px; color:#fff; background:rgba(13,28,48,.6); cursor:pointer; font:600 10px "DM Sans",sans-serif; }
.home-warehouse-film button[hidden] { display:none; }
.home-warehouse-film button:hover { background:#1d4ed8; }
.home-warehouse-film button:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.home-warehouse-film__status { position:absolute; top:8px; left:12px; right:12px; color:#fff; font-size:10px; z-index:2; }
.home-warehouse-film__status:not(:empty) { padding:5px 8px; background:#102039e6; border-radius:5px; }
@media (max-width:599px) {
  .home-warehouse-film { min-height:130px; }
  .home-warehouse-film figcaption { inset:auto 10px 10px; gap:7px; }
  .home-warehouse-film strong { font-size:12px; }
  .home-warehouse-film figcaption > span { font-size:7px; }
  .home-warehouse-film button { padding-inline:8px; }
}

/* A walkthrough step must not move the following content when it changes. */
.finder-demo__scenes{display:grid}
.finder-demo__scene{grid-area:1/1;min-width:0}
.finder-demo .finder-demo__scene[hidden]{display:block!important;visibility:hidden;pointer-events:none}