/* ApexQuant — theme.css v5.10.85
   Single source of design tokens + nav/footer styles.
   --gold unified to #d4af37 (matches dashboard LIVE badge + demo poster).
   Link this before any page-specific styles. Do not define :root or nav/footer CSS per-page. */

:root {
  --bg:#ffffff;
  --white:#f7f7f5;
  --ink:#111110;
  --ink2:#1e1e1c;
  --muted:#5a5a58;
  --border:#e4e4e0;
  --green:#1a9e6e;
  --green-bg:#eef8f4;
  --red:#d94f3d;
  --blue:#2563eb;
  --amber:#b45309;
  --gold:#d4af37;        /* canonical — ends drift between #d4a017 / #f0c060 / #c49a1a */
  --gold-bg:#fffbf0;
  --shadow-lg:0 2px 8px rgba(0,0,0,.08),0 12px 40px rgba(0,0,0,.12);
  --gold-l:rgba(212,175,55,.08);
  --nav-live:#1a9e6e;     /* the LIVE colour of the nav link and of the live page's pill; the bar is light in both schemes, so one value is safe */
}

/* ── Fonts: the ONE definition. The Google Fonts link is the same three lines in every page head (before this file). Pages use these variables and never name a font. ── */
:root {
  --font-text:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;   /* text and headings, every page */
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;   /* numbers and code */
  --font-display:var(--font-text);   /* big headlines: same face as the text */
  --font-dashboard:'Segoe UI',system-ui,-apple-system,sans-serif;   /* only for the showcase pictures of the bot dashboard, which uses this face */
}
body{font-family:var(--font-text)}
code,pre,kbd,samp{font-family:var(--font-mono)}
button,input,select,textarea{font-family:inherit}

/* ── Nav ─────────────────────────────────────────────────────────────────── */
nav{height:56px;position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 2rem;gap:1rem}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.logo-mark{width:30px;height:30px;background:#111110;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-mark svg{width:16px;height:16px}
.logo-name{font-weight:700;font-size:.95rem;color:var(--ink)}
.nav-links{display:flex;gap:1rem;align-items:center;flex-wrap:nowrap}
.nav-links a{font-size:.82rem;color:var(--muted);font-weight:500;text-decoration:none;padding:.35rem .55rem;border-radius:6px;white-space:nowrap;transition:color .15s,background .15s}
.nav-links a:hover{color:var(--ink);background:var(--white)}
.nav-links a.nav-demo{color:var(--gold);font-weight:700}
.nav-links a.nav-demo::before{content:"● ";color:var(--gold);font-size:.7em}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:.4rem;margin-left:auto;color:var(--ink);width:44px;height:44px;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0}
.nav-toggle:hover{background:rgba(0,0,0,.05)}
.nav-toggle svg{display:block;width:22px;height:22px}
.nav-toggle .icon-close{display:none}
.nav-toggle[aria-expanded="true"] .icon-open{display:none}
.nav-toggle[aria-expanded="true"] .icon-close{display:block}
.nav-links a.nav-current,.fl-f a.nav-current{color:var(--ink,#111110);font-weight:600}
/* WWW 5.10.85: "Live" in the bar, same pattern as Demo (bold + dot) in green. The dot pulses gently; off for people who ask for less motion. */
.nav-links a.nav-live{color:var(--nav-live);font-weight:700}
.nav-links a.nav-live::before{content:"● ";color:var(--nav-live);font-size:.7em;animation:navLivePulse 2.4s ease-in-out infinite}
@keyframes navLivePulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.nav-links a.nav-live::before{animation:none}}
/* WWW 5.10.71: seven main links in the bar, the rest under "More" (a dropdown on a wide window; on a phone the menu button lists every link and there is no dropdown). */
.nav-more{position:relative}
.nav-more-btn{font:inherit;font-size:.82rem;font-weight:500;color:var(--muted);background:none;border:0;cursor:pointer;padding:.35rem .55rem;border-radius:6px;white-space:nowrap;transition:color .15s,background .15s}
.nav-more-btn:hover,.nav-more.is-open .nav-more-btn{color:var(--ink);background:var(--white)}
.nav-more-btn.nav-more-current{color:var(--ink);font-weight:700}
.nav-caret{font-size:.7em;margin-left:.15rem}
.nav-more-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:190px;background:var(--bg);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.12);padding:.35rem;z-index:101;flex-direction:column;gap:.1rem}
.nav-more.is-open .nav-more-menu{display:flex}
.nav-more-menu a{display:block;padding:.5rem .7rem}
/* The seven main links and "More" fit on one row from about 860px up (checked at 880, 1024, 1280, 1366 and 1440); below that the menu button takes over and lists every link (one breakpoint for phone and tablet). */
@media(max-width:860px){
  .nav-toggle{display:inline-flex}
  nav{flex-wrap:wrap;height:auto;min-height:56px;padding:.5rem .9rem;align-items:center}
  .nav-links{display:none;flex-direction:column;align-items:stretch;width:100%;order:3;
    gap:0;margin-top:.4rem;border-top:1px solid var(--border);
    background:var(--bg);box-shadow:0 4px 12px rgba(0,0,0,.08);border-radius:0 0 10px 10px}
  .nav-links.is-open{display:flex;max-height:calc(100vh - 72px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .nav-links a{padding:.85rem 1.1rem;border-bottom:1px solid var(--border);
    color:var(--ink);text-decoration:none;font-weight:500;font-size:.95rem;display:block}
  .nav-links a:last-child{border-bottom:none}
  .nav-links a:active,.nav-links a:hover{background:var(--white)}
  .nav-links a.hide-mobile{display:block}
  .nav-more{display:contents}
  .nav-more-btn{display:none}
  .nav-more-menu{display:block;position:static;min-width:0;border:0;box-shadow:none;background:none;padding:0;border-radius:0}
  .nav-more-menu a{padding:.85rem 1.1rem}
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
footer{background:var(--white);border-top:1px solid var(--border);padding:2rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.6rem}
.fc-f{flex-basis:100%;text-align:center;font-size:.72rem;color:var(--muted);margin-bottom:.3rem}
.fl-f{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.fl-f a{color:var(--muted);font-size:.78rem;text-decoration:none;transition:color .15s}
.fl-f a:hover{color:var(--ink)}

/* WWW 5.10.68: the "now supports USDC" notice (partials/usdc-banner.html), shown at the top of Home, Pricing, Guide and FAQ. Colours come from the tokens above. */
.aq-notice{background:var(--green-bg);border-bottom:1px solid var(--green);color:var(--ink);text-align:center;font-size:.85rem;line-height:1.5;padding:.55rem 16px}
.aq-notice strong{font-weight:700}
.aq-notice a{color:var(--ink);font-weight:600;text-decoration:underline;white-space:nowrap}
.aq-notice a:hover{color:var(--green)}
