/* Dealer Comand homepage: the black theme + the ambient particle field. Linked AFTER site.css. The homepage is always dark now.
   No inline styles (CSP); the few runtime styles (glow position) are set through the CSSOM by js/ambient.js. */

:root, :root:root {
  color-scheme: dark;
  --bg: #000000; --surface: #1c1c20; --surface-2: #26262b; --border: #323238;
  --text: #f5f5f7; --muted: #adadb5; --primary: #ffffff; --primary-hover: #e4e4e8; --on-primary: #000000;
  --link: #4aa8ff; --accent: #ff453a; --shadow: none;
}
body { background: #000; color: var(--text); }
:focus-visible { outline: 3px solid #ffffff; outline-offset: 3px; }
.btn:focus-visible { outline-color: #4aa8ff; }

.hero { background: transparent; color: #f5f5f7; border-bottom: 1px solid #1c1c20; }
.hero .tagline { color: #f5f5f7; }
.lead { color: #a0a0a8; }
.card { background-color: rgba(28, 28, 32, 0.94); border-color: #323238; transition: border-color .25s, box-shadow .25s; }
.card-feature { background-color: rgba(38, 38, 43, 0.96); color: #f5f5f7; border-color: #3a3a40; }
.card-feature p { color: #b4b4bb; opacity: 1; }
.card-feature .ico, .card .ico { color: #fff; }
.steps li { border-top-color: #3a3a40; }
.footer { background: transparent; border-top: 1px solid #1c1c20; }
.skip { background: #fff; color: #000; }

/* the particle logo replaces the still one (js/home.js) */
.wordmark.is-animated > img, .wordmark.is-animated > picture { display: none; }

/* ---------- ambient particle field (js/ambient.js) ---------- */
.ambient-canvas { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; display: block; }
.ambient-glow { border-color: #3a3a40 !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 26px rgba(255, 255, 255, 0.07) !important;
  background-image: radial-gradient(260px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.045), transparent 70%) !important; }
@media (prefers-reduced-motion: reduce) { .ambient-glow { box-shadow: none !important; background-image: none !important; } .card { transition: none; } }
@media print { .ambient-canvas { display: none; } }