.glass { background: rgba(8,13,24,.88); backdrop-filter: blur(15px); }
.site-header { position: fixed; inset: 0 0 auto; z-index: 50; border-bottom: 1px solid var(--line); }
.header-inner { height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.header-nav { display: flex; gap: 27px; color: var(--muted); font-size: 13px; }
.ticker-shell { position: fixed; top: 62px; z-index: 45; width: 100%; height: 40px; display: flex; align-items: center; overflow: hidden; background: #0a111e; border-bottom: 1px solid var(--line); }
.ticker-label { padding: 0 18px; color: var(--amber); font-size: 11px; font-weight: 850; white-space: nowrap; }.ticker-viewport { overflow: hidden; flex: 1; }
.ticker-track { display: flex; width: max-content; animation: ticker 38s linear infinite; }.ticker-track:hover { animation-play-state: paused; }
.ticker-set { display: flex; gap: 28px; padding: 0 28px; white-space: nowrap; font-size: 12px; }.ticker-item { display: flex; gap: 7px; }
@keyframes ticker { to { transform: translateX(-50%); } }
.hero { padding: 155px 0 76px; min-height: 760px; display: flex; align-items: center; background: radial-gradient(circle at 78% 12%, rgba(53,208,230,.08), transparent 28%); }
.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; gap: 54px; align-items: center; }.eyebrow { color: var(--cyan); font-size: 12px; font-weight: 800; }
.hero h1 { font-size: clamp(42px, 5vw, 68px); line-height: 1.04; letter-spacing: -.05em; margin: 20px 0; }.hero h1 span { color: var(--cyan); }.hero-copy { font-size: 16px; }.hero-actions, .trust-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }.trust-row { color: var(--muted); font-size: 11px; gap: 18px; }
.chart-card { padding: 18px; box-shadow: var(--shadow); }.chart-head { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 12px; }.chart-title { display: flex; align-items: center; gap: 9px; }.chart-title h3 { margin: 0; font-size: 13px; }.market-value { display: block; margin: 8px 0 4px; font-size: 27px; }.canvas-wrap { height: 245px; overflow: hidden; border-radius: 12px; background: #0b1423; }
.hero-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }.info-card { padding: 15px; min-height: 105px; }.info-card small, .info-card span { display: block; color: var(--muted); font-size: 10px; }.info-card strong { display: block; margin: 8px 0; font-size: 16px; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }.feature-card { padding: 22px; background: rgba(17,27,46,.72); border: 1px solid var(--line); border-radius: 15px; }.feature-card b { color: var(--cyan); }.feature-card p { font-size: 12px; }
.flow { display: flex; align-items: center; justify-content: center; gap: 10px; }.flow div { padding: 16px 18px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; font-size: 12px; font-weight: 800; }.flow span { color: #52627a; }
.preview-grid { display: grid; grid-template-columns: 1.4fr .6fr; gap: 16px; }.surface-card { padding: 24px; }.metric-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }.metric-row span { padding: 12px; background: #0d1727; border-radius: 10px; }
footer { padding: 35px 0; color: var(--muted); font-size: 11px; border-top: 1px solid var(--line); }