/* ecosystem.css — the Helixstreet ecosystem bar, shared by helixstreet.com / .io / .ai / .foundation / .xyz.
   Self-contained (no dependency on site tokens). Single source: helixstreet.io repo root;
   each site folder carries an identical copy because each site is its own container.
   Markup: <div class="hx-eco" role="navigation" aria-label="Helixstreet ecosystem"> … (see any index.html).
   Default mode: fixed strip above a fixed nav (nav#nav or header#site-header), hides when the nav gets
   its scrolled/solid class. Add .hx-eco--static for sites with a sticky header (the bar then scrolls away). */

:root { --hx-eco-h: 30px; }

.hx-eco {
    position: fixed; top: 0; left: 0; right: 0; height: var(--hx-eco-h); z-index: 150;
    display: flex; align-items: center;
    background: #000; border-bottom: 1px solid rgba(139, 92, 246, 0.35);
    font: 400 0.72rem/1 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    color: #94A3B8; -webkit-font-smoothing: antialiased;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.hx-eco--static { position: static; }
body:has(> .hx-eco:not(.hx-eco--static)) { padding-top: var(--hx-eco-h); }

.hx-eco__inner {
    width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 1.25rem;
    display: flex; align-items: center; gap: 1.1rem; white-space: nowrap;
    overflow-x: auto; scrollbar-width: none;
}
.hx-eco__inner::-webkit-scrollbar { display: none; }
.hx-eco__label { flex-shrink: 0; text-transform: uppercase; letter-spacing: 0.14em; font-size: 0.6rem; color: rgba(255,255,255,0.35); }
.hx-eco__links { display: flex; align-items: baseline; gap: 1.1rem; }
.hx-eco a { color: #94A3B8; text-decoration: none; transition: color 0.25s; }
.hx-eco a:hover { color: #F1F5F9; }
.hx-eco a b { font-weight: 600; color: #F1F5F9; }
.hx-eco a small { font-size: 0.62rem; color: rgba(255,255,255,0.4); margin-left: 0.3em; }
.hx-eco a[aria-current] { color: #F1F5F9; }
.hx-eco a[aria-current] b {
    background: linear-gradient(135deg, #8B5CF6, #06D6A0);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.hx-eco__cta { margin-left: auto; flex-shrink: 0; color: #06D6A0 !important; font-weight: 500; }
.hx-eco a:focus-visible { outline: 2px solid #06D6A0; outline-offset: 2px; }

/* fixed-nav sites: push the nav below the bar, then slide the bar away once the page is scrolled */
nav#nav, header#site-header { top: var(--hx-eco-h); }
nav#nav.scrolled, header#site-header.solid { top: 0; }
nav#nav.scrolled ~ .hx-eco, header#site-header.solid ~ .hx-eco { transform: translateY(-100%); }

@media (max-width: 680px) {
    .hx-eco__label, .hx-eco a small { display: none; }
    .hx-eco__inner { padding: 0 1rem; gap: 0.9rem; }
    .hx-eco__links { gap: 0.9rem; }
}
@media (prefers-reduced-motion: reduce) { .hx-eco { transition: none; } }