/* ============================================================ AdPlayX — Agentic Exchange design system Applies the type system and accent treatment from the original redesign on top of the existing Tailwind CDN utility layer. Loaded after Tailwind, so plain element selectors here win without needing !important. ============================================================ */ :root{ --font-display: 'Space Grotesk', 'Inter', sans-serif; --font-mono: 'JetBrains Mono', monospace; --accent-violet: #6c47ff; --accent-indigo: #4f46e5; --accent-cyan: #0ea5b7; --accent-gradient: linear-gradient(100deg, var(--accent-violet) 0%, var(--accent-indigo) 55%, var(--accent-cyan) 100%); } /* Headings use the display face; body text stays on Inter (already set on ) */ h1, h2, h3, .font-display { font-family: var(--font-display); letter-spacing: -0.01em; } /* Small mono "eyebrow" label — sits above section headings */ .eyebrow{ font-family: var(--font-mono); font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-indigo); display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; } .eyebrow::before{ content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent-cyan); box-shadow: 0 0 0 3px rgba(14, 165, 183, 0.15); flex-shrink: 0; } .eyebrow.centered{ justify-content: center; } /* Gradient text treatment for key phrases */ .grad-text{ background: var(--accent-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; } /* Monospace utility for data-like labels, tags, stat captions */ .font-mono-label{ font-family: var(--font-mono); letter-spacing: 0.03em; } /* Nav links get a subtle mono, tracked-out treatment for a more technical feel */ nav .font-medium, #mobile-menu a { font-family: var(--font-mono); font-size: 13.5px; letter-spacing: 0.02em; } /* CTA buttons: display face, slightly tracked out */ a.rounded-full, button.rounded-full { font-family: var(--font-display); letter-spacing: 0.01em; } /* Large stat numbers get the display face for a bit more presence */ .text-indigo-600.font-bold, .text-2xl.font-bold { font-family: var(--font-display); } /* Subtle upgrade to card shadows used across the site (kept close to the existing shadow-lg so it doesn't clash, just slightly softer/deeper) */ .shadow-lg{ box-shadow: 0 12px 32px rgba(17, 24, 39, 0.08), 0 2px 6px rgba(17, 24, 39, 0.04); }