/* shop.i3x.dev -- near-black ground, green as the action, navy on hover.
   Taken from www.i3x.dev by the role each colour plays there. */
:root {
  --c-bg: #17171d;
  --c-bg-elevated: #20202a;
  --c-ink: #eeeeee;
  --c-ink-muted: #9b9ca6;   /* lightened from the parent site's #494A52 for contrast on dark */
  --c-accent: #00a009;
  --c-accent-hover: #00367f;
  --c-accent-ink: #ffffff;
  --c-line: #2f2f3a;
  --c-danger: #e14d43;

  --f-sans: Lato, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --f-display: 'Work Sans', Lato, -apple-system, sans-serif;

  --r-sm: 4px; --r-md: 8px; --r-lg: 14px; --r-pill: 999px;
}

/* Green rule under the masthead, as on i3x.dev. */
.masthead { border-bottom: 2px solid var(--c-accent); }
.product-card { transition: border-color .15s ease, transform .15s ease; }
.product-card:hover { border-color: var(--c-accent); transform: translateY(-2px); }