/* ========================================================================
   HyveChain — Institutional Investor Briefing
   Design system: gold-on-graphite, restrained, cinematic, finance-grade.
   Mode: presentation slide-deck (one viewport per section)
   ======================================================================== */

/* ============================================================
   SLIDE MODE — applied at the top so subsequent rules can override
   ============================================================ */
html, body {
  height: 100%;
  overflow: hidden;
}
#main {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
.sec {
  position: absolute;
  inset: 0;
  width: 100vw;
  height: 100vh;
  padding: 88px 64px 112px;
  display: grid;
  place-items: center;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
  z-index: 1;
}
.sec.active {
  opacity: 1;
  pointer-events: auto;
  z-index: 2;
}
.sec.leaving {
  opacity: 0;
  z-index: 1;
}

/* ============================================================
   CONTENT VISIBILITY — hard-guaranteed visible, no animations
   Only .sec itself fades; content is always at opacity 1.
   ============================================================ */
.sec-inner {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
}
.sec.active .sec-inner,
.sec.active .sec-inner *,
.sec.active [data-reveal] {
  opacity: 1 !important;
  visibility: visible !important;
}
.sec.active [data-reveal] {
  transform: translateY(0) !important;
}

/* Active-slide glow accent — subtle gold edge (non-blocking) */
.sec.active::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none !important;
  border: 1px solid transparent;
  box-shadow:
    inset 0 0 0 1px rgba(255, 215, 0, 0.04),
    inset 0 0 80px rgba(255, 215, 0, 0.025);
  animation: slideEdgeBreath 6s ease-in-out infinite;
  z-index: 0;
}
@keyframes slideEdgeBreath {
  0%, 100% { box-shadow: inset 0 0 0 1px rgba(255, 215, 0, 0.03), inset 0 0 80px rgba(255, 215, 0, 0.02); }
  50% { box-shadow: inset 0 0 0 1px rgba(255, 215, 0, 0.08), inset 0 0 120px rgba(255, 215, 0, 0.04); }
}
.sec-inner {
  width: 100%;
  max-width: 1320px;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 215, 0, 0.3) transparent;
  padding-right: 4px;
  min-width: 0;
  min-height: 0;
}
.sec-inner::-webkit-scrollbar { width: 6px; }
.sec-inner::-webkit-scrollbar-track { background: transparent; }
.sec-inner::-webkit-scrollbar-thumb { background: rgba(255, 215, 0, 0.18); border-radius: 3px; }
.sec-inner::-webkit-scrollbar-thumb:hover { background: rgba(255, 215, 0, 0.32); }
.sec-inner::-webkit-scrollbar { width: 6px; }
.sec-inner::-webkit-scrollbar-track { background: transparent; }
.sec-inner::-webkit-scrollbar-thumb {
  background: rgba(255, 215, 0, 0.15);
  border-radius: 3px;
}
.sec-inner::-webkit-scrollbar-thumb:hover { background: rgba(255, 215, 0, 0.3); }

/* Compact spacing across the deck for one-viewport fit */
.sec-title {
  font-size: clamp(28px, 3.6vw, 48px) !important;
  margin-bottom: 18px !important;
  line-height: 1.06 !important;
}
.sec-lead {
  font-size: clamp(14px, 1.15vw, 17px) !important;
  margin-bottom: 28px !important;
  max-width: 880px;
}
.sec-head { margin-bottom: 8px !important; }

/* ============================================================
   SLIDE CONTROLS (bottom)
   ============================================================ */
.slide-controls {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background:
    linear-gradient(135deg, rgba(255, 215, 0, 0.05), rgba(10, 10, 18, 0.85)),
    rgba(10, 10, 18, 0.8);
  border: 1px solid rgba(255, 215, 0, 0.18);
  border-radius: 4px;
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  box-shadow:
    0 12px 40px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(255, 215, 0, 0.04),
    inset 0 1px 0 rgba(255, 215, 0, 0.08);
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.slide-controls::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.5), transparent);
}
.slide-controls.visible { opacity: 1; }

.slide-btn {
  width: 40px; height: 40px;
  background: linear-gradient(180deg, rgba(255, 215, 0, 0.08), rgba(255, 215, 0, 0.02));
  border: 1px solid rgba(255, 215, 0, 0.22);
  color: var(--gold);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
  display: flex; align-items: center; justify-content: center;
  position: relative;
  overflow: hidden;
}
.slide-btn::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at center, rgba(255, 215, 0, 0.4), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.slide-btn:hover:not(:disabled) {
  background: linear-gradient(180deg, var(--gold), var(--gold-2));
  color: #0a0a12;
  border-color: var(--gold);
  transform: translateY(-1px);
  box-shadow:
    0 6px 18px rgba(255, 215, 0, 0.35),
    0 0 24px rgba(255, 215, 0, 0.25);
}
.slide-btn:hover:not(:disabled)::after { opacity: 1; }
.slide-btn:active:not(:disabled) { transform: translateY(0); }
.slide-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.slide-btn-primary {
  width: 52px; height: 40px;
  background: linear-gradient(180deg, rgba(255, 215, 0, 0.14), rgba(255, 215, 0, 0.06));
  border-color: rgba(255, 215, 0, 0.35);
}

.slide-counter {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 14px;
  border-left: 1px solid rgba(255, 215, 0, 0.12);
  border-right: 1px solid rgba(255, 215, 0, 0.12);
  height: 40px;
  position: relative;
}
.slide-counter-cur {
  font-family: 'Orbitron', sans-serif;
  font-size: 19px;
  color: var(--gold);
  font-weight: 800;
  letter-spacing: 0.05em;
  text-shadow: 0 0 14px rgba(255, 215, 0, 0.5);
  min-width: 30px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.slide-counter-slash {
  color: rgba(255, 215, 0, 0.5);
  font-size: 14px;
  font-family: 'Orbitron', sans-serif;
}
.slide-counter-total {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--text-mute);
  font-variant-numeric: tabular-nums;
}

.slide-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.3em;
  color: var(--text);
  text-transform: uppercase;
  padding: 0 6px 0 10px;
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 0 8px rgba(255, 215, 0, 0.2);
}

/* Edge progress bar */
.slide-progress-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, rgba(255, 215, 0, 0.04), rgba(255, 215, 0, 0.1), rgba(255, 215, 0, 0.04));
  z-index: 999;
  opacity: 0;
  transition: opacity 0.6s ease;
  overflow: hidden;
}
.slide-progress-bar.visible { opacity: 1; }
.slide-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold-dark) 0%, var(--gold) 50%, var(--gold-2) 100%);
  box-shadow:
    0 0 8px var(--gold),
    0 0 16px rgba(255, 215, 0, 0.6),
    0 2px 12px rgba(255, 215, 0, 0.3);
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
}
.slide-progress-fill::after {
  content: '';
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 20px;
  background: linear-gradient(90deg, transparent, var(--gold));
  opacity: 0.8;
  filter: blur(4px);
}

/* Big edge nav arrows (desktop) */
.slide-edge-btn {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 998;
  width: 52px; height: 100px;
  background: linear-gradient(180deg, rgba(10, 10, 18, 0.4), rgba(10, 10, 18, 0.7));
  border: 1px solid rgba(255, 215, 0, 0.12);
  color: var(--gold);
  font-size: 16px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
  opacity: 0;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  overflow: hidden;
}
.slide-edge-btn::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at center, rgba(255, 215, 0, 0.18), transparent 70%);
  opacity: 0; transition: opacity 0.35s ease;
}
.slide-edge-btn.visible { opacity: 0.55; }
.slide-edge-btn:hover:not(:disabled) {
  opacity: 1;
  background: linear-gradient(180deg, rgba(255, 215, 0, 0.08), rgba(10, 10, 18, 0.7));
  border-color: var(--gold);
  box-shadow:
    0 0 30px rgba(255, 215, 0, 0.3),
    inset 0 0 20px rgba(255, 215, 0, 0.08);
}
.slide-edge-btn:hover::before { opacity: 1; }
.slide-edge-prev:hover { transform: translateY(-50%) translateX(-3px); }
.slide-edge-next:hover { transform: translateY(-50%) translateX(3px); }
.slide-edge-btn:disabled { opacity: 0; pointer-events: none; }
.slide-edge-prev { left: 20px; }
.slide-edge-next { right: 20px; }

/* Disable old long-scroll HUD elements — replaced by slide UI */
.hud-bl { display: none !important; }
.dots { display: none !important; }

/* ============================================================
   SLIDE MODE — compact sizing overrides for each section
   ============================================================ */
/* HERO — bigger title, but tighter spacing */
.sec-hero .hero-inner { padding: 0 !important; }
.sec-hero .hero-title { font-size: clamp(40px, 5.5vw, 80px); margin-bottom: 24px; }
.sec-hero .hero-sub { font-size: 17px; margin-bottom: 36px; max-width: 680px; }
.sec-hero .hero-pillars { padding: 16px 0; margin-bottom: 24px; gap: 28px; max-width: 700px; }
.sec-hero .hero-pillar-num { font-size: 24px; }
.sec-hero .hero-scroll { display: none; }

/* THESIS — tighter cards */
.thesis-grid { gap: 36px; }
.thesis-quote { padding: 28px 28px 28px 44px; }
.thesis-quote p { font-size: 17px; margin-bottom: 14px; }
.thesis-mark { font-size: 80px; top: -12px; }
.thesis-point { padding: 16px 18px; gap: 16px; }
.thesis-point-body h4 { font-size: 15px; }
.thesis-point-body p { font-size: 13px; }
.thesis-points { gap: 14px; }

/* PROBLEM — compact stats */
.problem-stats { margin: 16px 0 24px; }
.problem-stat { padding: 18px 20px; }
.problem-stat-num { font-size: 38px; margin-bottom: 8px; }
.problem-stat-num small { font-size: 18px; }
.problem-stat p { font-size: 12px; }
.problem-stat-tag { font-size: 8px; margin-bottom: 8px; }
.gap-panel { padding: 24px 24px; }
.gap-panel h3 { font-size: 20px; margin-bottom: 16px; }
.gap-list li { padding: 8px 0; font-size: 13px; gap: 12px; }
.problem-existing { margin: 28px 0 16px; }
.problem-existing h4 { font-size: 12px; margin-bottom: 12px; }
.problem-table th, .problem-table td { padding: 10px 14px; font-size: 12px; }
.gap-conclusion { margin-top: 20px; padding: 22px; }
.gap-conclusion p { font-size: 17px; }

/* HIVE STACK — compact 3-up */
.stack-grid { gap: 18px; margin-top: 10px; }
.stack-card { padding: 28px 22px; min-height: auto; }
.stack-card h3 { font-size: 26px; }
.stack-card-head { margin-top: 44px; margin-bottom: 14px; }
.stack-card-num { font-size: 12px; padding: 3px 8px; top: 18px; left: 22px; }
.stack-card-desc { font-size: 13px; margin-bottom: 18px; }
.stack-card-specs { gap: 10px; padding-top: 14px; }
.stack-card-specs b { font-size: 12px; }
.stack-card-specs span { font-size: 8px; }

/* L1 — tighter */
.l1-split { gap: 36px; }
.l1-stat-row { gap: 14px; margin-bottom: 20px; padding-bottom: 16px; }
.l1-stat b { font-size: 22px; }
.l1-stat b small { font-size: 12px; }
.l1-stat span { font-size: 8px; }
.l1-endpoints { margin: 14px 0; padding: 14px 18px; }
.l1-endpoints-grid { gap: 6px 22px; }
.l1-endpoints-grid > div { padding: 5px 0; }
.l1-endpoints-grid > div code { font-size: 11px; padding: 1px 6px; }
.l1-endpoints-grid > div span { font-size: 9px; }
.l1-endpoints-head { padding-bottom: 8px; margin-bottom: 8px; }
.l1-endpoints-head span { font-size: 9px; }
.l1-endpoints-head em { font-size: 9px; }
.l1-features { gap: 14px; }
.l1-feat { gap: 12px; }
.l1-feat i { width: 28px; height: 28px; font-size: 14px; }
.l1-feat h5 { font-size: 13px; }
.l1-feat span { font-size: 12px; }

/* SHADOW */
.shadow-precompile-banner { padding: 22px 26px; margin-bottom: 28px; }
.spb-content > p { font-size: 15px; }
.spb-codes { gap: 10px; }
.spb-codes > div { padding: 10px 12px; gap: 4px; }
.spb-codes code { font-size: 12px; }
.spb-codes b { font-size: 12px; }
.spb-codes small { font-size: 10px; }
.shadow-grid { gap: 28px; margin-bottom: 28px; }
.shadow-claim-lead { font-size: 18px; }
.shadow-claim-stats { gap: 14px; padding-top: 16px; }
.shadow-claim-stats b { font-size: 26px; }
.shadow-flow { padding: 20px 22px; }
.shadow-flow h4 { font-size: 16px; margin-bottom: 14px; }
.flow-step { padding: 10px 0; gap: 14px; }
.flow-step b { font-size: 13px; }
.flow-step p { font-size: 12px; }
.shadow-compare { padding: 18px 22px; }
.shadow-compare h4 { font-size: 14px; margin-bottom: 14px; }
.cmp-table th, .cmp-table td { padding: 8px 12px; font-size: 12px; }

/* BUSINESS */
.biz-split { gap: 32px; }
.biz-window-body { min-height: 380px; }
.biz-kpis { gap: 8px; margin-bottom: 16px; }
.biz-kpi { padding: 10px 12px; }
.biz-kpi span { font-size: 8px; }
.biz-kpi b { font-size: 14px; }
.biz-kpi small { font-size: 10px; }
.biz-row { padding: 8px 14px; font-size: 12px; }
.biz-row-head { font-size: 9px; }
.biz-precompile-banner { padding: 22px 26px; margin-top: 24px; }
.bpb-head h4 { font-size: 18px; }
.bpb-head p { font-size: 13px; }
.bpb-codes > div { padding: 8px 12px; }
.bpb-codes code { font-size: 11px; }
.bpb-codes b { font-size: 12px; }
.biz-pitch { gap: 14px; }
.biz-pitch-stat { gap: 12px; }
.biz-pitch-stat b { font-size: 40px; }
.biz-pitch-stat b small { font-size: 18px; }
.biz-pitch-stat span { font-size: 9px; }
.biz-pitch-list { padding-top: 14px; gap: 8px; }
.biz-pitch-list li { font-size: 12px; gap: 10px; }
.biz-revenue { padding: 16px 20px; }
.biz-revenue h5 { font-size: 11px; margin-bottom: 10px; }
.biz-rev-row { padding: 5px 0; font-size: 12px; }

/* MOAT — 4-column compact */
.moat-grid { gap: 14px; }
.moat-card { padding: 20px 18px; min-height: auto; }
.moat-icon { width: 36px; height: 36px; font-size: 16px; margin-bottom: 10px; }
.moat-card h4 { font-size: 14px; margin-bottom: 6px; }
.moat-card p { font-size: 12px; line-height: 1.5; }

/* ATLAS — make grid scrollable within the slide, compact rows */
.sec-atlas .sec-inner { display: flex; flex-direction: column; }
.atlas-callout { margin: 12px 0 18px; padding: 20px 24px; }
.atlas-callout-body > p { font-size: 14px; margin-bottom: 14px; }
.atlas-callout-kicker { font-size: 10px; margin-bottom: 8px; }
.atlas-trio-item { padding: 12px 14px; gap: 4px; }
.atlas-trio-hex { font-size: 11px; }
.atlas-trio-item b { font-size: 13px; }
.atlas-trio-item small { font-size: 10px; }
.atlas-trio-arrow { font-size: 18px; }
.atlas-controls { margin-bottom: 14px; }
.atlas-chip { font-size: 9px; padding: 6px 10px; letter-spacing: 0.15em; }
.atlas-chip em { font-size: 8px; padding: 1px 4px; }
.atlas-search { padding: 4px 12px; }
.atlas-search input { font-size: 12px; padding: 4px 0; }
.atlas-search i { font-size: 10px; }
.atlas-count { font-size: 9px; padding-left: 10px; }
.atlas-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  max-height: none;
  overflow-y: visible;
}
.atlas-row {
  grid-template-columns: 56px 50px 1fr;
  padding: 9px 12px;
  gap: 10px;
}
.atlas-hex { font-size: 11px; }
.atlas-cat { font-size: 8px; padding: 2px 5px; }
.atlas-info b { font-size: 12px; margin-bottom: 0; }
.atlas-info small { font-size: 10px; line-height: 1.3; }
.atlas-footnote { margin-top: 14px; font-size: 10px; }

/* AUDIT */
.audit-hero { padding: 28px 32px; gap: 36px; margin-bottom: 24px; }
.audit-hero-shield { width: 140px; }
.audit-shield-svg { width: 140px; height: 154px; }
.audit-hero-body { gap: 14px; }
.audit-hero-body h3 { font-size: 22px; }
.audit-hero-body p { font-size: 14px; }
.audit-meta { gap: 12px; padding: 14px 0; }
.audit-meta b { font-size: 12px; }
.audit-meta span { font-size: 8px; }
.btn { padding: 9px 16px; font-size: 11px; }
.audit-layers h4 { font-size: 12px; margin-bottom: 12px; }
.audit-layers-grid { gap: 10px; }
.audit-layers-grid > div { padding: 14px 16px; }
.audit-layers-grid b { font-size: 13px; }
.audit-layers-grid span { font-size: 11px; }

/* ECO */
.eco-grid { gap: 12px; }
.eco-tile { padding: 20px 18px; }
.eco-tile-icon { width: 36px; height: 36px; font-size: 14px; margin-bottom: 12px; }
.eco-tile h5 { font-size: 14px; }
.eco-tile span { font-size: 11px; }
.eco-state { font-size: 8px; top: 14px; right: 14px; }

/* TOKEN */
.token-grid { gap: 32px; margin-bottom: 28px; }
.token-chart-wrap { max-width: 340px; margin: 0 auto; }
.token-center-val { font-size: 22px; }
.token-row { padding: 10px 14px; gap: 14px; }
.token-row b { font-size: 12px; }
.token-row small { font-size: 11px; }
.token-row em { font-size: 14px; }
.token-utility { padding-top: 18px; gap: 8px; }
.token-util { padding: 12px 14px; gap: 4px; }
.token-util i { font-size: 14px; }
.token-util b { font-size: 11px; }
.token-util span { font-size: 9px; }

/* MARKET */
.market-grid { gap: 16px; margin-bottom: 28px; }
.market-card { padding: 28px 24px; }
.market-num { font-size: 52px; margin-bottom: 12px; }
.market-num small { font-size: 22px; }
.market-card h5 { font-size: 15px; margin-bottom: 8px; }
.market-card p { font-size: 12px; }
.market-tier { font-size: 9px; }
.market-context h4 { font-size: 12px; margin-bottom: 14px; }
.ctx-row { padding: 11px 0; gap: 14px; }
.ctx-row i { width: 28px; height: 28px; font-size: 14px; }
.ctx-row b { font-size: 13px; }
.ctx-row span { font-size: 12px; }

/* ROADMAP — make horizontal-leaning */
.roadmap { padding: 18px 0; gap: 14px; }
.rm-phase { grid-template-columns: 32px 1fr; gap: 18px; }
.rm-marker { width: 32px; height: 32px; font-size: 12px; }
.roadmap-track { left: 15px; }
.rm-body { padding: 14px 18px; }
.rm-body h4 { font-size: 15px; margin-bottom: 8px; }
.rm-body ul { gap: 4px 18px; }
.rm-body ul li { font-size: 11px; padding-left: 12px; }
.rm-phase-tag { font-size: 9px; }

/* TRACTION */
.trac-grid { gap: 14px; }
.trac-card { padding: 24px 22px; }
.trac-card b { font-size: 44px; }
.trac-card b small { font-size: 20px; }
.trac-card span { font-size: 14px; }
.trac-card small { font-size: 11px; }

/* WHY WE WIN */
.why-block { margin-bottom: 24px; }
.why-head { margin-bottom: 14px; padding-bottom: 10px; }
.why-head-tag { font-size: 9px; padding: 3px 10px; margin-bottom: 8px; }
.why-head h3 { font-size: 22px; }
.why-grid { gap: 14px; }
.why-card { padding: 20px 20px; }
.why-num { font-size: 9px; margin-bottom: 8px; }
.why-card h4 { font-size: 16px; margin-bottom: 10px; }
.why-card > p { font-size: 12px; margin-bottom: 12px; }
.why-list { gap: 5px; padding-top: 10px; }
.why-list li { font-size: 10px; }
.why-grants-grid { gap: 10px; }
.why-grant { padding: 14px 16px; gap: 8px; }
.why-grant-head i { width: 28px; height: 28px; font-size: 14px; }
.why-grant-head b { font-size: 12px; }
.why-grant-head span { font-size: 10px; }
.why-grant p { font-size: 11px; }
.why-grant-band { font-size: 10px; padding: 3px 8px; }
.why-exit { margin-top: 16px; padding: 18px 22px; }
.why-exit-tag { font-size: 9px; margin-bottom: 12px; padding-bottom: 8px; }
.why-exit-grid { gap: 18px; }
.why-exit-grid b { font-size: 13px; }
.why-exit-grid span { font-size: 11px; }

/* ASK */
.ask-grid { gap: 28px; margin-bottom: 24px; }
.ask-term { padding: 14px 18px; }
.ask-term span { font-size: 10px; }
.ask-term b { font-size: 13px; }
.ask-allocation { padding: 22px 26px; }
.ask-allocation h5 { font-size: 11px; margin-bottom: 14px; }
.alloc-row { padding: 8px 0; gap: 14px; }
.alloc-row span { font-size: 12px; }
.alloc-row b { font-size: 13px; }
.ask-bottom { padding: 16px 22px; }
.ask-bottom p { font-size: 12px; }

/* CONTACT */
.contact-grid { gap: 14px; margin-bottom: 28px; }
.contact-card { padding: 22px 20px; min-height: auto; gap: 8px; }
.contact-card-val { font-size: 14px; }
.contact-card-lbl { font-size: 9px; }
.contact-socials a { width: 36px; height: 36px; font-size: 13px; }
.pitch-footer { padding-top: 18px; }
.pitch-footer-row { font-size: 9px; }



:root {
  --bg-0: #06060a;
  --bg-1: #0a0a12;
  --bg-2: #0f0f1a;
  --bg-3: #14141f;
  --bg-elev: #1a1a26;
  --line: rgba(255, 215, 0, 0.12);
  --line-soft: rgba(255, 255, 255, 0.06);
  --line-strong: rgba(255, 215, 0, 0.32);
  --text: #e8e8f0;
  --text-mute: #a0a0b8;
  --text-dim: #6e6e85;
  --gold: #FFD700;
  --gold-2: #FFB400;
  --gold-dark: #8B6914;
  --cyan: #00D4FF;
  --purple: #A855F7;
  --green: #10B981;
  --red: #FF6B6B;
  --pink: #F472B6;
  --glow: 0 0 28px rgba(255, 215, 0, 0.35), 0 0 60px rgba(255, 215, 0, 0.18);
  --glow-soft: 0 0 14px rgba(255, 215, 0, 0.25);
  --shadow-card: 0 24px 60px -20px rgba(0, 0, 0, 0.6), 0 8px 24px -12px rgba(0, 0, 0, 0.4);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Rajdhani', -apple-system, sans-serif;
  background: var(--bg-0);
  color: var(--text);
  overflow-x: hidden;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  cursor: default;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

/* ===== Global type ===== */
h1, h2, h3, h4, h5 { font-family: 'Orbitron', sans-serif; font-weight: 700; letter-spacing: -0.01em; }
.gold { color: var(--gold); }
.gradient-text {
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #FFD700 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 200%;
  animation: gradShift 6s ease infinite;
}
@keyframes gradShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* Global page background — subtle gold grid + radial vignettes */
body::before {
  content: '';
  position: fixed; inset: 0;
  background:
    radial-gradient(ellipse at top, rgba(255, 215, 0, 0.06), transparent 50%),
    radial-gradient(ellipse at bottom, rgba(168, 85, 247, 0.04), transparent 50%),
    linear-gradient(180deg, var(--bg-0) 0%, var(--bg-1) 100%);
  z-index: -2;
  pointer-events: none;
}
body::after {
  content: '';
  position: fixed; inset: 0;
  background-image:
    linear-gradient(rgba(255, 215, 0, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 215, 0, 0.025) 1px, transparent 1px);
  background-size: 80px 80px;
  z-index: -1;
  pointer-events: none;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
}

/* ============================================================
   LOADER — decrypt sequence
   ============================================================ */
.loader {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse at center, #0a0a12 0%, #000 100%);
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255, 215, 0, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 215, 0, 0.06) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  animation: gridPan 30s linear infinite;
}
@keyframes gridPan {
  0% { background-position: 0 0; }
  100% { background-position: 40px 40px; }
}
.loader-content {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 32px;
  text-align: center;
}
.loader-hex { width: 140px; height: 140px; position: relative; filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.5)); }
.hex-svg { width: 100%; height: 100%; animation: hexRot 18s linear infinite; }
.hex-svg polygon:nth-child(2) { animation: hexRot 12s linear infinite reverse; transform-origin: center; }
.hex-svg polygon:nth-child(3) { animation: hexRot 9s linear infinite; transform-origin: center; }
@keyframes hexRot { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.loader-text { display: flex; flex-direction: column; align-items: center; gap: 14px; min-width: 360px; }
.loader-label {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.4em;
  color: var(--gold); text-transform: uppercase;
}
.loader-stream {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  color: var(--text-dim); height: 16px; overflow: hidden;
  width: 360px; text-align: center;
}
.loader-bar { width: 360px; height: 2px; background: rgba(255, 215, 0, 0.1); position: relative; overflow: hidden; }
.loader-bar-fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  width: 0%;
  box-shadow: 0 0 12px var(--gold);
  transition: width 0.1s linear;
}
.loader-pct { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--gold); }

.loader-meta {
  display: flex; gap: 14px; align-items: center;
  font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
}
.loader-meta .dot { color: var(--gold); }

/* ============================================================
   HUD — fixed overlay during scroll
   ============================================================ */
.hud {
  position: fixed; inset: 0; z-index: 100;
  pointer-events: none;
  opacity: 0; transition: opacity 0.6s ease;
}
.hud.visible { opacity: 1; }
.hud > * { position: absolute; pointer-events: auto; }

.hud-tl { top: 24px; left: 24px; }
.hud-brand { display: flex; align-items: center; gap: 14px; }
.hud-logo {
  font-family: 'Orbitron', sans-serif; font-weight: 800; font-size: 18px;
  letter-spacing: 0.1em; color: var(--text);
}
.hud-logo .gold { color: var(--gold); text-shadow: 0 0 12px rgba(255, 215, 0, 0.5); }
.hud-badge {
  font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.3em;
  padding: 4px 10px; border: 1px solid var(--line-strong);
  color: var(--gold); background: rgba(255, 215, 0, 0.06);
  text-transform: uppercase;
}

.hud-tr {
  top: 24px; right: 24px;
  display: flex; gap: 18px;
}
.hud-stat { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.hud-stat-lbl {
  font-family: 'JetBrains Mono', monospace; font-size: 8px; letter-spacing: 0.3em;
  color: var(--text-dim); text-transform: uppercase;
}
.hud-stat-val {
  font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 600;
  color: var(--gold);
}

.hud-bl {
  bottom: 24px; left: 24px;
  display: flex; flex-direction: column; gap: 8px;
}
.hud-progress { display: flex; align-items: center; gap: 14px; min-width: 280px; }
.hud-progress-track {
  flex: 1; height: 2px; background: rgba(255, 215, 0, 0.1);
  position: relative; overflow: hidden;
}
.hud-progress-fill {
  position: absolute; left: 0; top: 0; bottom: 0;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold));
  width: 6%; box-shadow: 0 0 8px var(--gold);
  transition: width 0.3s ease;
}
.hud-progress-label {
  font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-mute); white-space: nowrap;
}

.hud-br { bottom: 24px; right: 24px; }
.hud-class {
  font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.3em;
  color: var(--text-dim); text-transform: uppercase;
}

/* ============================================================
   Dots navigator
   ============================================================ */
.dots {
  position: fixed; right: 24px; top: 50%; transform: translateY(-50%);
  z-index: 99;
  display: flex; flex-direction: column; gap: 10px;
  opacity: 0; transition: opacity 0.6s ease;
}
.dots.visible { opacity: 1; }
.dot-btn {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255, 215, 0, 0.2);
  border: none; padding: 0;
  position: relative; transition: all 0.3s ease;
}
.dot-btn::before {
  content: attr(data-label);
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.25em;
  color: var(--gold); white-space: nowrap;
  opacity: 0; transition: opacity 0.3s ease;
  pointer-events: none;
}
.dot-btn:hover::before, .dot-btn.active::before { opacity: 1; }
.dot-btn:hover, .dot-btn.active {
  background: var(--gold); transform: scale(1.4);
  box-shadow: 0 0 12px var(--gold);
}

/* ============================================================
   Section base — kept compatible with slide-mode overrides at top
   ============================================================ */
.sec-head {
  display: flex; align-items: baseline; gap: 18px;
  margin-bottom: 12px;
}
.sec-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; color: var(--gold);
  letter-spacing: 0.3em;
}
.sec-kicker {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; color: var(--text-dim);
  letter-spacing: 0.3em; text-transform: uppercase;
}
.sec-title {
  font-size: clamp(36px, 4.5vw, 64px);
  line-height: 1.05;
  margin-bottom: 32px;
  max-width: 980px;
}
.sec-lead {
  font-size: 19px;
  color: var(--text-mute);
  max-width: 800px;
  margin-bottom: 56px;
  line-height: 1.6;
}

.scene-canvas {
  position: absolute; inset: 0; z-index: 0;
}
.scene-bg { opacity: 0.5; }
.vignette {
  position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(6,6,10,0.6) 70%, rgba(6,6,10,0.95) 100%);
  pointer-events: none;
}
.scanlines {
  position: absolute; inset: 0; z-index: 1;
  background: repeating-linear-gradient(
    180deg,
    transparent 0,
    transparent 3px,
    rgba(255, 255, 255, 0.012) 3px,
    rgba(255, 255, 255, 0.012) 4px
  );
  pointer-events: none;
  mix-blend-mode: overlay;
}

/* ============================================================
   01 — HERO
   ============================================================ */
.sec-hero {
  min-height: 100vh;
  padding: 0;
  align-items: center;
}
.hero-inner {
  text-align: left;
  padding: 120px 80px;
  max-width: 1400px;
}
.hero-tag {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 16px;
  border: 1px solid var(--line-strong);
  background: rgba(255, 215, 0, 0.06);
  margin-bottom: 36px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
}
.hero-tag-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px var(--gold);
  animation: pulse 2s ease infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.3); }
}
.hero-title {
  font-size: clamp(48px, 7vw, 96px);
  line-height: 1.02;
  margin-bottom: 36px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hero-title-line { display: block; }
.hero-sub {
  font-size: 22px;
  color: var(--text-mute);
  max-width: 720px;
  line-height: 1.55;
  margin-bottom: 64px;
}
.hero-pillars {
  display: flex; gap: 40px;
  padding: 24px 0;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 56px;
  max-width: 720px;
}
.hero-pillar {
  display: flex; flex-direction: column; gap: 6px;
}
.hero-pillar-num {
  font-family: 'Orbitron', sans-serif;
  font-size: 28px; font-weight: 800;
  color: var(--gold);
  text-shadow: 0 0 14px rgba(255, 215, 0, 0.4);
}
.hero-pillar-lbl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.2em;
  color: var(--text-dim);
}
.hero-scroll {
  display: flex; align-items: center; gap: 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--text-mute);
  text-transform: uppercase;
}
.hero-scroll-line {
  width: 120px; height: 1px;
  background: linear-gradient(90deg, var(--gold), transparent);
  position: relative;
}
.hero-scroll-line::after {
  content: '';
  position: absolute; right: 0; top: -2px;
  width: 6px; height: 5px;
  background: var(--gold);
  animation: scrollDot 2s ease infinite;
}
@keyframes scrollDot {
  0%, 100% { transform: translateX(0); opacity: 1; }
  50% { transform: translateX(-30px); opacity: 0.3; }
}

/* ============================================================
   02 — THESIS
   ============================================================ */
.thesis-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: start;
}
.thesis-quote {
  position: relative;
  padding: 40px 40px 40px 60px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.04), transparent);
  border-left: 2px solid var(--gold);
}
.thesis-quote p {
  font-size: 22px;
  line-height: 1.5;
  color: var(--text);
  margin-bottom: 24px;
  font-weight: 400;
}
.thesis-quote p:last-child { margin-bottom: 0; }
.thesis-mark {
  position: absolute;
  top: -20px; left: 20px;
  font-family: 'Orbitron', sans-serif;
  font-size: 120px;
  color: var(--gold);
  line-height: 1;
  opacity: 0.4;
}
.thesis-points { display: flex; flex-direction: column; gap: 24px; }
.thesis-point {
  display: flex; gap: 24px;
  padding: 24px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  backdrop-filter: blur(20px);
  transition: all 0.4s ease;
}
.thesis-point:hover {
  border-color: var(--line-strong);
  background: rgba(20, 20, 31, 0.9);
  transform: translateX(6px);
}
.thesis-point-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px; color: var(--gold);
  flex-shrink: 0; letter-spacing: 0.1em;
}
.thesis-point-body h4 {
  font-size: 17px;
  margin-bottom: 8px;
  color: var(--text);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.thesis-point-body p {
  color: var(--text-mute);
  font-size: 15px;
  line-height: 1.55;
}

/* ============================================================
   03 — MARKET GAP
   ============================================================ */
.gap-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 48px;
  align-items: stretch;
}
.gap-panel {
  position: relative;
  padding: 48px 40px;
  background: linear-gradient(180deg, rgba(20, 20, 31, 0.8), rgba(10, 10, 18, 0.4));
  border: 1px solid var(--line-soft);
  overflow: hidden;
}
.gap-panel-glow {
  position: absolute; inset: 0;
  background: radial-gradient(circle at center, rgba(255, 215, 0, 0.08), transparent 70%);
  opacity: 0; transition: opacity 0.6s ease;
}
.gap-panel:hover .gap-panel-glow { opacity: 1; }
.gap-panel-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.3em;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 20px;
  display: inline-block;
}
.gap-panel h3 {
  font-size: 32px;
  margin-bottom: 32px;
  color: var(--text);
}
.gap-list { list-style: none; display: flex; flex-direction: column; gap: 16px; }
.gap-list li {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-soft);
  color: var(--text-mute);
  font-size: 15px;
}
.gap-list li:last-child { border-bottom: none; }
.gap-list i {
  color: var(--gold);
  font-size: 16px;
  width: 20px;
  flex-shrink: 0;
}
.gap-divider {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 16px;
}
.gap-divider-line {
  width: 1px;
  flex: 1;
  background: linear-gradient(180deg, transparent, var(--gold), transparent);
  opacity: 0.4;
}
.gap-divider-vs {
  font-family: 'Orbitron', sans-serif;
  font-size: 32px;
  color: var(--gold);
  text-shadow: 0 0 16px var(--gold);
}
.gap-conclusion {
  margin-top: 60px;
  padding: 40px;
  text-align: center;
  border: 1px solid var(--line-strong);
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.06), rgba(168, 85, 247, 0.03));
  position: relative;
}
.gap-conclusion-line {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 80px; height: 2px;
  background: var(--gold);
  box-shadow: 0 0 12px var(--gold);
}
.gap-conclusion p {
  font-size: 22px;
  color: var(--text);
  line-height: 1.5;
  max-width: 800px;
  margin: 0 auto;
}

/* ============================================================
   04 — HIVE STACK
   ============================================================ */
.stack-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 24px;
}
.stack-card {
  position: relative;
  padding: 40px 32px;
  background: linear-gradient(180deg, rgba(20, 20, 31, 0.85), rgba(10, 10, 18, 0.6));
  border: 1px solid var(--line-soft);
  overflow: hidden;
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.4s ease;
  transform-style: preserve-3d;
  cursor: pointer;
  min-height: 480px;
}
.stack-card:hover {
  border-color: var(--line-strong);
}
.stack-card-bg {
  position: absolute; inset: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 215, 0, 0.1), transparent 60%);
  opacity: 0; transition: opacity 0.4s ease;
  pointer-events: none;
}
.stack-card:hover .stack-card-bg { opacity: 1; }
.stack-card-featured {
  background: linear-gradient(180deg, rgba(40, 30, 10, 0.6), rgba(10, 10, 18, 0.8));
  border-color: var(--line-strong);
}
.stack-card-featured::before {
  content: 'PRIMARY DIFFERENTIATOR';
  position: absolute;
  top: 12px; right: 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; letter-spacing: 0.25em;
  color: var(--gold);
  padding: 4px 8px;
  border: 1px solid var(--gold);
  background: rgba(255, 215, 0, 0.08);
}
.stack-card-num {
  position: absolute;
  top: 24px; left: 32px;
  font-family: 'Orbitron', sans-serif;
  font-size: 14px; font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.2em;
  border: 1px solid var(--gold);
  padding: 4px 10px;
}
.stack-card-head { margin-top: 80px; margin-bottom: 20px; }
.stack-card-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.3em;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 12px;
  display: block;
}
.stack-card h3 {
  font-size: 36px;
  color: var(--text);
  margin: 0;
}
.stack-card-featured h3 { color: var(--gold); text-shadow: 0 0 18px rgba(255, 215, 0, 0.3); }
.stack-card-desc {
  color: var(--text-mute);
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 32px;
}
.stack-card-specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding-top: 24px;
  border-top: 1px solid var(--line-soft);
}
.stack-card-specs > div {
  display: flex; flex-direction: column; gap: 4px;
}
.stack-card-specs span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.25em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.stack-card-specs b {
  font-family: 'Orbitron', sans-serif;
  font-size: 14px;
  color: var(--gold);
  font-weight: 600;
}
.stack-card-corner {
  position: absolute;
  bottom: 0; right: 0;
  width: 60px; height: 60px;
  background:
    linear-gradient(135deg, transparent 50%, rgba(255, 215, 0, 0.15) 50%);
  border-top: 1px solid var(--line-strong);
  border-left: 1px solid var(--line-strong);
}

/* ============================================================
   05 — L1
   ============================================================ */
.l1-split {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 60px;
  align-items: start;
}
.l1-visual {
  position: relative;
  aspect-ratio: 1;
  border: 1px solid var(--line-soft);
  background: radial-gradient(circle at center, rgba(20, 20, 31, 0.8), rgba(6, 6, 10, 0.9));
  overflow: hidden;
}
.l1-canvas { width: 100%; height: 100%; display: block; }
.l1-visual-hud {
  position: absolute;
  top: 20px; left: 20px;
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px;
  background: rgba(6, 6, 10, 0.8);
  border: 1px solid var(--line-strong);
  backdrop-filter: blur(10px);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
}
.l1-hud-row {
  display: flex; justify-content: space-between; gap: 24px;
  min-width: 200px;
}
.l1-hud-row span { color: var(--text-dim); letter-spacing: 0.2em; font-size: 9px; }
.l1-hud-row b { color: var(--gold); font-weight: 600; }
.l1-hud-row b.live { color: var(--green); }

.l1-stat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 48px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--line-soft);
}
.l1-stat { display: flex; flex-direction: column; gap: 6px; }
.l1-stat b {
  font-family: 'Orbitron', sans-serif;
  font-size: 32px; font-weight: 700;
  color: var(--gold);
  line-height: 1;
}
.l1-stat b small { font-size: 16px; color: var(--text-mute); margin-left: 2px; font-weight: 400; }
.l1-stat span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.l1-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.l1-feat {
  display: flex; gap: 16px;
  align-items: flex-start;
}
.l1-feat i {
  font-size: 18px;
  color: var(--gold);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.08);
  border: 1px solid var(--line-strong);
  flex-shrink: 0;
}
.l1-feat h5 {
  font-size: 14px;
  color: var(--text);
  margin-bottom: 4px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.l1-feat span {
  font-size: 13px;
  color: var(--text-mute);
  line-height: 1.5;
}

/* ============================================================
   06 — SHADOWPOOL
   ============================================================ */
.sec-shadow {
  background: linear-gradient(180deg, var(--bg-0) 0%, #0a0612 50%, var(--bg-0) 100%);
}
.shadow-overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse at top, rgba(168, 85, 247, 0.12), transparent 60%),
    radial-gradient(ellipse at bottom, rgba(255, 215, 0, 0.06), transparent 60%);
  pointer-events: none;
}
.shadow-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-bottom: 80px;
}
.shadow-claim {
  display: flex; flex-direction: column; gap: 40px;
  justify-content: center;
}
.shadow-claim-lead {
  font-size: 24px;
  line-height: 1.45;
  color: var(--text);
  font-weight: 400;
}
.shadow-claim-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  padding-top: 32px;
  border-top: 1px solid var(--line-soft);
}
.shadow-claim-stats > div { display: flex; flex-direction: column; gap: 6px; }
.shadow-claim-stats b {
  font-family: 'Orbitron', sans-serif;
  font-size: 36px; font-weight: 800;
  color: var(--gold);
  line-height: 1;
}
.shadow-claim-stats span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.shadow-flow {
  padding: 32px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  backdrop-filter: blur(20px);
}
.shadow-flow h4 {
  font-size: 20px;
  color: var(--gold);
  margin-bottom: 24px;
  font-family: 'Orbitron', sans-serif;
}
.flow-step {
  display: flex; gap: 20px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line-soft);
}
.flow-step:last-child { border-bottom: none; }
.flow-num {
  flex-shrink: 0;
  width: 32px; height: 32px;
  background: rgba(255, 215, 0, 0.1);
  border: 1px solid var(--gold);
  color: var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
}
.flow-step b {
  display: block;
  font-size: 15px;
  color: var(--text);
  margin-bottom: 4px;
  font-family: 'Orbitron', sans-serif;
  letter-spacing: 0.05em;
}
.flow-step p {
  font-size: 13px;
  color: var(--text-mute);
  line-height: 1.55;
}
.shadow-compare {
  padding: 32px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  backdrop-filter: blur(20px);
}
.shadow-compare h4 {
  font-size: 20px;
  color: var(--gold);
  margin-bottom: 20px;
  font-family: 'Orbitron', sans-serif;
}
.cmp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.cmp-table th, .cmp-table td {
  padding: 14px 16px;
  text-align: left;
  border-bottom: 1px solid var(--line-soft);
}
.cmp-table th {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
  font-weight: 500;
}
.cmp-table th.th-us {
  color: var(--gold);
}
.cmp-table td:first-child { color: var(--text-mute); }
.cmp-table td.ok { color: var(--gold); font-weight: 600; }
.cmp-table td.partial { color: var(--text-mute); }
.cmp-table td.no { color: var(--red); opacity: 0.6; }
.cmp-table tr:hover { background: rgba(255, 215, 0, 0.02); }

/* ============================================================
   07 — BUSINESS
   ============================================================ */
.biz-split {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 48px;
  align-items: start;
}
.biz-workspace {
  position: relative;
  perspective: 1500px;
}
.biz-window {
  background: var(--bg-2);
  border: 1px solid var(--line-strong);
  overflow: hidden;
  box-shadow: var(--shadow-card), 0 0 60px rgba(255, 215, 0, 0.08);
  transform: rotateY(-3deg) rotateX(2deg);
  transform-style: preserve-3d;
  transition: transform 0.6s ease;
}
.biz-workspace:hover .biz-window { transform: rotateY(0deg) rotateX(0deg); }
.biz-window-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 16px;
  background: var(--bg-elev);
  border-bottom: 1px solid var(--line-soft);
}
.biz-dot { width: 10px; height: 10px; border-radius: 50%; }
.biz-dot.red { background: #ff5f57; }
.biz-dot.yellow { background: #febc2e; }
.biz-dot.green { background: #28c840; }
.biz-window-title {
  flex: 1;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--text-mute);
}
.biz-window-live {
  display: flex; align-items: center; gap: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: var(--green);
}
.live-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 8px var(--green);
  animation: pulse 1.6s infinite;
}
.biz-window-body {
  display: grid;
  grid-template-columns: 200px 1fr;
  min-height: 460px;
}
.biz-nav {
  display: flex; flex-direction: column;
  padding: 16px 0;
  background: var(--bg-1);
  border-right: 1px solid var(--line-soft);
}
.biz-nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 20px;
  font-size: 13px;
  color: var(--text-mute);
  cursor: pointer;
  border-left: 2px solid transparent;
}
.biz-nav-item i { font-size: 12px; width: 16px; }
.biz-nav-item.active {
  color: var(--gold);
  background: rgba(255, 215, 0, 0.05);
  border-left-color: var(--gold);
}
.biz-main { padding: 24px; }
.biz-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
.biz-kpi {
  padding: 14px;
  background: var(--bg-1);
  border: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: 4px;
}
.biz-kpi span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.15em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.biz-kpi b {
  font-family: 'Orbitron', sans-serif;
  font-size: 18px;
  color: var(--text);
  font-weight: 600;
}
.biz-kpi small { font-size: 11px; color: var(--text-mute); }
.biz-kpi-gold { border-color: var(--line-strong); background: rgba(255, 215, 0, 0.04); }
.biz-kpi-gold b { color: var(--gold); }
.biz-kpi-gold small { color: var(--green); }

.biz-table {
  border: 1px solid var(--line-soft);
}
.biz-row {
  display: grid;
  grid-template-columns: 1fr 1.5fr 1fr 1fr;
  padding: 12px 16px;
  font-size: 13px;
  border-bottom: 1px solid var(--line-soft);
  align-items: center;
}
.biz-row:last-child { border-bottom: none; }
.biz-row-head {
  background: var(--bg-1);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.15em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.biz-row span:nth-child(3) { color: var(--gold); font-family: 'JetBrains Mono', monospace; }
.badge {
  display: inline-block;
  padding: 3px 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  width: fit-content;
}
.badge-blue { background: rgba(0, 212, 255, 0.1); color: var(--cyan); border: 1px solid rgba(0, 212, 255, 0.4); }
.badge-amber { background: rgba(255, 180, 0, 0.1); color: var(--gold-2); border: 1px solid rgba(255, 180, 0, 0.4); }
.badge-green { background: rgba(16, 185, 129, 0.1); color: var(--green); border: 1px solid rgba(16, 185, 129, 0.4); }
.badge-gold { background: rgba(255, 215, 0, 0.1); color: var(--gold); border: 1px solid var(--line-strong); }

.biz-pitch {
  display: flex; flex-direction: column; gap: 24px;
}
.biz-pitch-stat {
  display: flex; align-items: baseline; gap: 16px;
}
.biz-pitch-stat b {
  font-family: 'Orbitron', sans-serif;
  font-size: 56px;
  font-weight: 800;
  color: var(--gold);
  line-height: 1;
  text-shadow: 0 0 24px rgba(255, 215, 0, 0.3);
}
.biz-pitch-stat b small { font-size: 24px; color: var(--text-mute); }
.biz-pitch-stat span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.25em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.biz-pitch-list {
  list-style: none;
  display: flex; flex-direction: column; gap: 12px;
  padding-top: 24px;
  border-top: 1px solid var(--line-soft);
}
.biz-pitch-list li {
  display: flex; align-items: center; gap: 12px;
  font-size: 14px;
  color: var(--text-mute);
}
.biz-pitch-list i { color: var(--gold); font-size: 12px; }
.biz-revenue {
  padding: 24px;
  background: rgba(255, 215, 0, 0.03);
  border: 1px solid var(--line-strong);
}
.biz-revenue h5 {
  font-size: 13px;
  color: var(--gold);
  margin-bottom: 16px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.biz-rev-row {
  display: flex; justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--line-soft);
  font-size: 13px;
}
.biz-rev-row:last-child { border-bottom: none; }
.biz-rev-row span { color: var(--text-mute); }
.biz-rev-row b { color: var(--gold); font-family: 'JetBrains Mono', monospace; font-weight: 600; }

/* ============================================================
   08 — MOAT
   ============================================================ */
.moat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.moat-card {
  position: relative;
  padding: 28px 24px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
  min-height: 220px;
}
.moat-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-4px);
  background: rgba(20, 20, 31, 0.9);
}
.moat-glow {
  position: absolute;
  top: -40px; right: -40px;
  width: 120px; height: 120px;
  background: radial-gradient(circle, rgba(255, 215, 0, 0.2), transparent 70%);
  opacity: 0; transition: opacity 0.4s ease;
  border-radius: 50%;
}
.moat-card:hover .moat-glow { opacity: 1; }
.moat-icon {
  width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  color: var(--gold);
  font-size: 20px;
  margin-bottom: 16px;
}
.moat-card h4 {
  font-size: 16px;
  color: var(--text);
  margin-bottom: 10px;
  font-family: 'Orbitron', sans-serif;
}
.moat-card p {
  font-size: 13px;
  color: var(--text-mute);
  line-height: 1.55;
}

/* ============================================================
   09 — AUDIT
   ============================================================ */
.audit-hero {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 60px;
  align-items: center;
  padding: 48px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.05), rgba(20, 20, 31, 0.6));
  border: 1px solid var(--line-strong);
  margin-bottom: 48px;
  position: relative;
  overflow: hidden;
}
.audit-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  box-shadow: 0 0 12px var(--gold);
}
.audit-hero-shield { display: flex; justify-content: center; }
.audit-shield-svg { width: 200px; height: 220px; animation: shieldFloat 5s ease-in-out infinite; }
@keyframes shieldFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-8px) scale(1.03); }
}
.audit-hero-body { display: flex; flex-direction: column; gap: 20px; }
.audit-hero-tag {
  display: inline-flex; align-items: center; gap: 10px;
  width: fit-content;
  padding: 6px 14px;
  background: rgba(255, 215, 0, 0.08);
  border: 1px solid var(--gold);
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.25em;
  color: var(--gold);
  text-transform: uppercase;
}
.audit-pulse {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px var(--gold);
  animation: pulse 2s infinite;
}
.audit-hero-body h3 {
  font-size: 28px;
  color: var(--text);
  line-height: 1.2;
}
.audit-hero-body p {
  font-size: 15px;
  color: var(--text-mute);
  line-height: 1.6;
}
.audit-meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  padding: 20px 0;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}
.audit-meta > div { display: flex; flex-direction: column; gap: 4px; }
.audit-meta span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.audit-meta b {
  font-size: 14px;
  color: var(--text);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.audit-actions {
  display: flex; gap: 12px;
  flex-wrap: wrap;
}
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px;
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  transition: all 0.3s ease;
  border: 1px solid transparent;
  cursor: pointer;
}
.btn-gold {
  background: var(--gold);
  color: #0a0a12;
  box-shadow: 0 0 24px rgba(255, 215, 0, 0.3);
}
.btn-gold:hover { background: var(--gold-2); transform: translateY(-2px); box-shadow: 0 0 32px rgba(255, 215, 0, 0.5); }
.btn-outline {
  background: transparent;
  color: var(--gold);
  border-color: var(--line-strong);
}
.btn-outline:hover { background: rgba(255, 215, 0, 0.06); border-color: var(--gold); }

.audit-layers h4 {
  font-size: 16px;
  color: var(--gold);
  margin-bottom: 20px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.audit-layers-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.audit-layers-grid > div {
  padding: 20px;
  background: rgba(20, 20, 31, 0.4);
  border: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: 6px;
  transition: border-color 0.3s ease;
}
.audit-layers-grid > div:hover { border-color: var(--line-strong); }
.audit-layers-grid b {
  font-size: 14px;
  color: var(--text);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.audit-layers-grid span {
  font-size: 12px;
  color: var(--text-mute);
}

/* ============================================================
   10 — ECOSYSTEM
   ============================================================ */
.eco-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.eco-tile {
  position: relative;
  padding: 28px 24px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  transition: all 0.4s ease;
  overflow: hidden;
  cursor: pointer;
  transform-style: preserve-3d;
}
.eco-tile:hover {
  border-color: var(--line-strong);
  background: rgba(255, 215, 0, 0.04);
}
.eco-tile-icon {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  color: var(--gold);
  font-size: 18px;
  margin-bottom: 16px;
  transition: all 0.4s ease;
}
.eco-tile:hover .eco-tile-icon {
  background: var(--gold);
  color: #0a0a12;
  box-shadow: 0 0 16px rgba(255, 215, 0, 0.5);
}
.eco-tile h5 {
  font-size: 16px;
  color: var(--text);
  margin-bottom: 6px;
  font-family: 'Orbitron', sans-serif;
}
.eco-tile span {
  font-size: 12px;
  color: var(--text-mute);
  display: block;
}
.eco-state {
  position: absolute;
  top: 16px; right: 16px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.2em;
  padding: 3px 8px;
  font-style: normal;
}
.state-live { background: rgba(16, 185, 129, 0.1); color: var(--green); border: 1px solid rgba(16, 185, 129, 0.4); }
.state-soon { background: rgba(168, 85, 247, 0.1); color: var(--purple); border: 1px solid rgba(168, 85, 247, 0.4); }

/* ============================================================
   11 — TOKENOMICS
   ============================================================ */
.token-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 60px;
  align-items: center;
  margin-bottom: 60px;
}
.token-chart-wrap {
  position: relative;
  aspect-ratio: 1;
  max-width: 420px;
}
.token-chart {
  width: 100%; height: 100%;
  transform: rotate(-90deg);
  filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.2));
}
.token-center {
  position: absolute;
  inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  pointer-events: none;
}
.token-center-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.25em;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.token-center-val {
  font-family: 'Orbitron', sans-serif;
  font-size: 28px;
  color: var(--gold);
  font-weight: 800;
  line-height: 1;
}
.token-center-foot {
  margin-top: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--green);
  letter-spacing: 0.15em;
}

.token-legend { display: flex; flex-direction: column; gap: 14px; }
.token-row {
  display: grid;
  grid-template-columns: 6px 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(20, 20, 31, 0.4);
  border: 1px solid var(--line-soft);
  transition: all 0.3s ease;
}
.token-row:hover { border-color: var(--c); background: rgba(20, 20, 31, 0.7); }
.token-bar { width: 6px; align-self: stretch; background: var(--c); }
.token-row b {
  display: block;
  font-size: 14px;
  color: var(--text);
  margin-bottom: 4px;
  font-family: 'Orbitron', sans-serif;
}
.token-row small {
  font-size: 12px;
  color: var(--text-mute);
  line-height: 1.5;
}
.token-row em {
  font-family: 'Orbitron', sans-serif;
  font-size: 18px;
  font-style: normal;
  color: var(--c);
  font-weight: 700;
}

.token-utility {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  padding-top: 40px;
  border-top: 1px solid var(--line-soft);
}
.token-util {
  display: flex; flex-direction: column; gap: 8px;
  padding: 18px 16px;
  background: rgba(20, 20, 31, 0.4);
  border: 1px solid var(--line-soft);
  text-align: left;
  transition: all 0.3s ease;
}
.token-util:hover { border-color: var(--line-strong); }
.token-util i {
  font-size: 18px;
  color: var(--gold);
  margin-bottom: 4px;
}
.token-util b {
  font-size: 13px;
  color: var(--text);
  font-family: 'Orbitron', sans-serif;
}
.token-util span {
  font-size: 11px;
  color: var(--text-mute);
}

/* ============================================================
   12 — MARKET
   ============================================================ */
.market-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 60px;
}
.market-card {
  padding: 40px 32px;
  background: linear-gradient(180deg, rgba(20, 20, 31, 0.6), rgba(10, 10, 18, 0.4));
  border: 1px solid var(--line-soft);
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
}
.market-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-4px);
}
.market-card-mid {
  background: linear-gradient(180deg, rgba(40, 30, 10, 0.4), rgba(10, 10, 18, 0.6));
  border-color: var(--line-strong);
}
.market-tier {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 16px;
  display: inline-block;
  padding: 3px 10px;
  border: 1px solid var(--line-strong);
}
.market-num {
  display: block;
  font-family: 'Orbitron', sans-serif;
  font-size: 72px;
  font-weight: 800;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 20px;
  text-shadow: 0 0 24px rgba(255, 215, 0, 0.3);
}
.market-num small { font-size: 32px; color: var(--text-mute); margin-left: 4px; font-weight: 600; }
.market-card h5 {
  font-size: 18px;
  color: var(--text);
  margin-bottom: 12px;
  font-family: 'Orbitron', sans-serif;
}
.market-card p {
  font-size: 13px;
  color: var(--text-mute);
  line-height: 1.55;
}

.market-context h4 {
  font-size: 16px;
  color: var(--gold);
  margin-bottom: 24px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.ctx-row {
  display: flex; gap: 20px;
  align-items: flex-start;
  padding: 18px 0;
  border-bottom: 1px solid var(--line-soft);
}
.ctx-row i {
  font-size: 18px;
  color: var(--gold);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  flex-shrink: 0;
}
.ctx-row b {
  display: block;
  font-size: 15px;
  color: var(--text);
  margin-bottom: 4px;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.ctx-row span {
  font-size: 13px;
  color: var(--text-mute);
}

/* ============================================================
   13 — ROADMAP
   ============================================================ */
.roadmap {
  position: relative;
  padding: 40px 0;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.roadmap-track {
  position: absolute;
  left: 18px; top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold) 60%, var(--text-dim) 60%, var(--text-dim) 100%);
  opacity: 0.4;
}
.rm-phase {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 32px;
  align-items: flex-start;
  position: relative;
}
.rm-marker {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--bg-1);
  border: 2px solid var(--text-dim);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
  color: var(--text-dim);
  position: relative;
  z-index: 1;
}
.rm-done .rm-marker {
  border-color: var(--gold);
  background: var(--gold);
  color: #0a0a12;
  box-shadow: 0 0 16px rgba(255, 215, 0, 0.4);
}
.rm-active .rm-marker {
  border-color: var(--gold);
  background: rgba(255, 215, 0, 0.1);
  color: var(--gold);
  box-shadow: 0 0 16px rgba(255, 215, 0, 0.4);
}
.rm-active .rm-marker i { animation: rotateSlow 3s linear infinite; }
@keyframes rotateSlow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.rm-body {
  padding: 24px 28px;
  background: rgba(20, 20, 31, 0.4);
  border: 1px solid var(--line-soft);
  transition: all 0.3s ease;
}
.rm-active .rm-body, .rm-done .rm-body { border-color: var(--line-strong); }
.rm-phase-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.25em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 8px;
  display: block;
}
.rm-phase:not(.rm-done):not(.rm-active) .rm-phase-tag { color: var(--text-dim); }
.rm-body h4 {
  font-size: 20px;
  color: var(--text);
  margin-bottom: 16px;
  font-family: 'Orbitron', sans-serif;
}
.rm-body ul {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 24px;
}
.rm-body ul li {
  font-size: 13px;
  color: var(--text-mute);
  padding-left: 16px;
  position: relative;
}
.rm-body ul li::before {
  content: ''; position: absolute;
  left: 0; top: 8px;
  width: 5px; height: 5px;
  background: var(--gold);
  opacity: 0.6;
}
.rm-done .rm-body ul li { color: var(--text); }

/* ============================================================
   14 — TRACTION
   ============================================================ */
.trac-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.trac-card {
  padding: 36px 28px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  text-align: left;
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
}
.trac-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-4px);
}
.trac-card::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, transparent, var(--gold), transparent);
}
.trac-card b {
  display: block;
  font-family: 'Orbitron', sans-serif;
  font-size: 56px;
  font-weight: 800;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 12px;
  text-shadow: 0 0 18px rgba(255, 215, 0, 0.25);
}
.trac-card b small { font-size: 24px; color: var(--text-mute); margin-left: 2px; }
.trac-card span {
  display: block;
  font-size: 16px;
  color: var(--text);
  margin-bottom: 4px;
  font-family: 'Orbitron', sans-serif;
}
.trac-card small {
  font-size: 12px;
  color: var(--text-mute);
}

/* ============================================================
   15 — ASK
   ============================================================ */
.ask-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}
.ask-terms { display: flex; flex-direction: column; gap: 16px; }
.ask-term {
  display: flex; justify-content: space-between; gap: 24px;
  padding: 20px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  transition: border-color 0.3s ease;
}
.ask-term:hover { border-color: var(--line-strong); }
.ask-term span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
  flex-shrink: 0;
}
.ask-term b {
  font-size: 14px;
  color: var(--gold);
  text-align: right;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}
.ask-allocation {
  padding: 32px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.04), rgba(20, 20, 31, 0.6));
  border: 1px solid var(--line-strong);
}
.ask-allocation h5 {
  font-size: 13px;
  color: var(--gold);
  margin-bottom: 24px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.25em;
  text-transform: uppercase;
}
.alloc-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 50px;
  gap: 18px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-soft);
}
.alloc-row:last-child { border-bottom: none; }
.alloc-row span {
  font-size: 13px;
  color: var(--text);
}
.alloc-row b {
  font-family: 'Orbitron', sans-serif;
  font-size: 14px;
  color: var(--gold);
  text-align: right;
}
.alloc-bar {
  height: 6px;
  background: rgba(255, 215, 0, 0.08);
  position: relative;
  overflow: hidden;
}
.alloc-bar > div {
  height: 100%;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold));
  box-shadow: 0 0 8px var(--gold);
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 1.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.alloc-bar.animated > div { transform: scaleX(1); }
.ask-bottom {
  padding: 28px;
  text-align: center;
  border: 1px dashed var(--line-strong);
  background: rgba(255, 215, 0, 0.02);
}
.ask-bottom p {
  font-size: 13px;
  color: var(--text-mute);
  font-style: italic;
  letter-spacing: 0.02em;
}

/* ============================================================
   16 — CONTACT
   ============================================================ */
.contact-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 80px;
}
.contact-card {
  padding: 32px 24px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: 10px;
  transition: all 0.3s ease;
  min-height: 180px;
}
.contact-card:hover { border-color: var(--line-strong); }
.contact-card-lbl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.25em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.contact-card-val {
  font-size: 16px;
  color: var(--gold);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  line-height: 1.5;
}
.contact-socials { display: flex; gap: 12px; margin-top: auto; }
.contact-socials a {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  color: var(--gold);
  transition: all 0.3s ease;
}
.contact-socials a:hover {
  background: var(--gold);
  color: #0a0a12;
}

.pitch-footer {
  padding-top: 40px;
  border-top: 1px solid var(--line-soft);
}
.pitch-footer-row {
  display: flex; justify-content: space-between;
  gap: 24px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
}

/* ============================================================
   Logo wired in HUD + Loader
   ============================================================ */
.hud-logo-img {
  width: 28px; height: 28px;
  filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.45));
}
.loader-logo-img {
  position: absolute;
  width: 64px; height: 64px;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 0 24px rgba(255, 215, 0, 0.6));
  animation: loaderLogoPulse 2.2s ease-in-out infinite;
  z-index: 2;
}
@keyframes loaderLogoPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); filter: drop-shadow(0 0 24px rgba(255,215,0,0.5)); }
  50% { transform: translate(-50%, -50%) scale(1.06); filter: drop-shadow(0 0 32px rgba(255,215,0,0.85)); }
}

/* ============================================================
   L1 ENDPOINTS BLOCK
   ============================================================ */
.l1-endpoints {
  margin: 32px 0 40px;
  padding: 24px;
  background: linear-gradient(180deg, rgba(20, 20, 31, 0.5), rgba(10, 10, 18, 0.3));
  border: 1px solid var(--line-soft);
  border-left: 2px solid var(--gold);
}
.l1-endpoints-head {
  display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 14px;
}
.l1-endpoints-head span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
}
.l1-endpoints-head em {
  font-style: normal;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.15em;
  color: var(--green);
}
.l1-endpoints-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 28px;
}
.l1-endpoints-grid > div {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed var(--line-soft);
  gap: 16px;
}
.l1-endpoints-grid > div:last-child,
.l1-endpoints-grid > div:nth-last-child(2):not(:last-child) { border-bottom: none; }
.l1-endpoints-grid > div span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.15em;
  color: var(--text-dim);
  text-transform: uppercase;
  flex-shrink: 0;
}
.l1-endpoints-grid > div code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--gold);
  background: rgba(255, 215, 0, 0.05);
  padding: 2px 8px;
  border: 1px solid rgba(255, 215, 0, 0.15);
}

/* ============================================================
   SHADOWPOOL PRECOMPILE BANNER
   ============================================================ */
.shadow-precompile-banner {
  position: relative;
  margin-bottom: 56px;
  padding: 32px 36px;
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.04), rgba(20, 20, 31, 0.6));
  border: 1px solid var(--line-strong);
  overflow: hidden;
}
.spb-line {
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--gold) 30%, var(--purple) 70%, transparent 100%);
  box-shadow: 0 0 14px rgba(255, 215, 0, 0.5);
}
.spb-content { display: flex; flex-direction: column; gap: 18px; }
.spb-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  width: fit-content;
  padding: 4px 12px;
  border: 1px solid var(--gold);
  background: rgba(255, 215, 0, 0.06);
}
.spb-content > p {
  font-size: 18px;
  line-height: 1.55;
  color: var(--text);
  max-width: 900px;
}
.spb-codes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 4px;
}
.spb-codes > div {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px 16px;
  background: rgba(10, 10, 18, 0.6);
  border: 1px solid var(--line-soft);
  transition: all 0.3s ease;
}
.spb-codes > div:hover {
  border-color: var(--gold);
  background: rgba(255, 215, 0, 0.04);
  transform: translateY(-2px);
}
.spb-codes code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.05em;
}
.spb-codes b {
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  color: var(--text);
  font-weight: 600;
}
.spb-codes small {
  font-size: 11px;
  color: var(--text-mute);
}

/* ============================================================
   HYVE BUSINESS PRECOMPILE BANNER
   ============================================================ */
.biz-precompile-banner {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 40px;
  align-items: start;
  margin-top: 48px;
  padding: 32px 36px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.04), rgba(20, 20, 31, 0.6));
  border: 1px solid var(--line-strong);
  position: relative;
  overflow: hidden;
}
.biz-precompile-banner::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  box-shadow: 0 0 12px var(--gold);
}
.bpb-head { display: flex; flex-direction: column; gap: 14px; }
.bpb-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  width: fit-content;
  padding: 4px 12px;
  border: 1px solid var(--gold);
  background: rgba(255, 215, 0, 0.06);
}
.bpb-head h4 {
  font-size: 22px;
  color: var(--text);
  font-family: 'Orbitron', sans-serif;
  line-height: 1.25;
}
.bpb-head p {
  font-size: 14px;
  color: var(--text-mute);
  line-height: 1.6;
}
.bpb-codes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.bpb-codes > div {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 14px;
  background: rgba(10, 10, 18, 0.5);
  border: 1px solid var(--line-soft);
  transition: all 0.3s ease;
}
.bpb-codes > div:hover {
  border-color: var(--gold);
  background: rgba(255, 215, 0, 0.04);
}
.bpb-codes code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--gold);
  font-weight: 600;
}
.bpb-codes b {
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px;
  color: var(--text);
  font-weight: 600;
}

/* ============================================================
   PRECOMPILE ATLAS — security-tool console aesthetic
   ============================================================ */
.sec-atlas {
  position: relative;
  background:
    radial-gradient(ellipse at top right, rgba(168, 85, 247, 0.06), transparent 50%),
    radial-gradient(ellipse at bottom left, rgba(255, 215, 0, 0.04), transparent 50%);
}
.atlas-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255, 215, 0, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 215, 0, 0.04) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
  pointer-events: none;
  z-index: 0;
}

/* === Selective disclosure callout === */
.atlas-callout {
  position: relative;
  margin: 24px 0 48px;
  padding: 32px 36px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.06), rgba(168, 85, 247, 0.04));
  border: 1px solid var(--line-strong);
  overflow: hidden;
}
.atlas-callout-line {
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), var(--purple), var(--gold), transparent);
  box-shadow: 0 0 14px var(--gold);
}
.atlas-callout-kicker {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  display: block;
  margin-bottom: 12px;
}
.atlas-callout-body > p {
  font-size: 17px;
  color: var(--text);
  line-height: 1.5;
  margin-bottom: 24px;
  max-width: 900px;
}
.atlas-callout-trio {
  display: grid;
  grid-template-columns: 1fr 30px 1fr 30px 1fr;
  gap: 14px;
  align-items: stretch;
}
.atlas-trio-item {
  padding: 18px;
  background: rgba(10, 10, 18, 0.6);
  border: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: 6px;
  transition: all 0.3s ease;
}
.atlas-trio-item:hover {
  border-color: var(--gold);
  background: rgba(255, 215, 0, 0.04);
  transform: translateY(-2px);
}
.atlas-trio-hex {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing: 0.1em;
  color: var(--gold);
  font-weight: 600;
}
.atlas-trio-item b {
  font-family: 'Orbitron', sans-serif;
  font-size: 14px;
  color: var(--text);
}
.atlas-trio-item small {
  font-size: 11px;
  color: var(--text-mute);
  line-height: 1.45;
}
.atlas-trio-arrow {
  display: flex; align-items: center; justify-content: center;
  font-family: 'Orbitron', sans-serif;
  font-size: 24px;
  color: var(--gold);
  font-weight: 700;
  text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
}

/* === Filter rail === */
.atlas-controls {
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.atlas-filters {
  display: flex; gap: 6px;
  flex-wrap: wrap;
}
.atlas-chip {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  padding: 8px 14px;
  background: rgba(20, 20, 31, 0.5);
  border: 1px solid var(--line-soft);
  color: var(--text-mute);
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex; align-items: center; gap: 8px;
  text-transform: uppercase;
}
.atlas-chip em {
  font-style: normal;
  font-size: 9px;
  padding: 2px 6px;
  background: rgba(255, 215, 0, 0.08);
  color: var(--gold);
  letter-spacing: 0.05em;
}
.atlas-chip:hover {
  border-color: var(--line-strong);
  color: var(--text);
}
.atlas-chip.active {
  background: rgba(255, 215, 0, 0.1);
  border-color: var(--gold);
  color: var(--gold);
}
.atlas-search {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 14px;
  background: rgba(10, 10, 18, 0.6);
  border: 1px solid var(--line-soft);
  min-width: 320px;
  flex: 1; max-width: 480px;
}
.atlas-search i {
  color: var(--gold);
  font-size: 12px;
}
.atlas-search input {
  flex: 1;
  background: transparent;
  border: none;
  color: var(--text);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  outline: none;
  padding: 6px 0;
  letter-spacing: 0.02em;
}
.atlas-search input::placeholder {
  color: var(--text-dim);
}
.atlas-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: var(--gold);
  letter-spacing: 0.15em;
  padding-left: 12px;
  border-left: 1px solid var(--line-soft);
}

/* === Atlas grid (terminal rows) === */
.atlas-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  position: relative;
  z-index: 1;
}
.atlas-row {
  display: grid;
  grid-template-columns: 80px 60px 1fr;
  gap: 16px;
  align-items: center;
  padding: 14px 18px;
  background: rgba(10, 10, 18, 0.4);
  border: 1px solid var(--line-soft);
  transition: all 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
  overflow: hidden;
}
.atlas-row::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 2px;
  background: transparent;
  transition: background 0.3s ease;
}
.atlas-row:hover {
  border-color: var(--gold);
  background: rgba(255, 215, 0, 0.04);
  transform: translateX(2px);
}
.atlas-row:hover::before { background: var(--gold); box-shadow: 0 0 8px var(--gold); }
.atlas-row.hidden { display: none; }

.atlas-row-hero {
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.06), rgba(10, 10, 18, 0.5));
  border-color: rgba(255, 215, 0, 0.25);
}
.atlas-row-hero::before { background: var(--gold); opacity: 0.5; }

.atlas-hex {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  color: var(--gold);
  letter-spacing: 0.05em;
  font-weight: 600;
}
.atlas-cat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.15em;
  padding: 3px 6px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-dim);
  text-align: center;
  font-weight: 600;
}
.atlas-cat[data-c="priv"]   { color: #C084FC; background: rgba(168, 85, 247, 0.08); }
.atlas-cat[data-c="ent"]    { color: #FFD700; background: rgba(255, 215, 0, 0.08); }
.atlas-cat[data-c="infra"]  { color: #00D4FF; background: rgba(0, 212, 255, 0.08); }
.atlas-cat[data-c="cosmos"] { color: #FB923C; background: rgba(251, 146, 60, 0.08); }
.atlas-cat[data-c="dev"]    { color: #10B981; background: rgba(16, 185, 129, 0.08); }
.atlas-cat[data-c="crypto"] { color: #F472B6; background: rgba(244, 114, 182, 0.08); }
.atlas-info b {
  display: block;
  font-family: 'Rajdhani', sans-serif;
  font-size: 14px;
  color: var(--text);
  font-weight: 600;
  margin-bottom: 2px;
}
.atlas-info small {
  font-size: 12px;
  color: var(--text-mute);
  line-height: 1.4;
}
.atlas-footnote {
  margin-top: 32px;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 0.15em;
}
.atlas-footnote a {
  color: var(--gold);
  border-bottom: 1px dashed var(--gold);
  padding-bottom: 1px;
}
.atlas-footnote a:hover { color: var(--gold-2); }

.atlas-empty {
  grid-column: 1 / -1;
  padding: 40px;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: var(--text-dim);
  border: 1px dashed var(--line-soft);
}

/* ============================================================
   HERO PILLARS — 4-up
   ============================================================ */
.hero-pillars { gap: 32px; }

/* ============================================================
   HERO SCRIM — keep 3D visual from bleeding through text
   ============================================================ */
.sec-hero .hero-inner {
  position: relative;
  z-index: 5;
}
.sec-hero .hero-inner::before {
  content: '';
  position: absolute;
  inset: -120px -80px;
  background:
    linear-gradient(105deg,
      rgba(6, 6, 10, 0.96) 0%,
      rgba(6, 6, 10, 0.88) 35%,
      rgba(6, 6, 10, 0.55) 60%,
      rgba(6, 6, 10, 0.15) 85%,
      transparent 100%);
  z-index: -1;
  pointer-events: none;
}
.sec-hero .hero-inner > * { position: relative; z-index: 1; }

/* ============================================================
   TEAM SLIDE
   ============================================================ */
.sec-team .sec-inner {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 24px;
}
.team-card {
  display: flex;
  flex-direction: column;
  padding: 22px 20px;
  background: linear-gradient(180deg, rgba(20, 20, 31, 0.7), rgba(10, 10, 18, 0.4));
  border: 1px solid var(--line-soft);
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}
.team-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-4px);
  background: linear-gradient(180deg, rgba(40, 30, 10, 0.5), rgba(10, 10, 18, 0.6));
}
.team-card-lead {
  background: linear-gradient(180deg, rgba(40, 30, 10, 0.45), rgba(10, 10, 18, 0.5));
  border-color: var(--line-strong);
}
.team-card-lead::before {
  content: 'FOUNDER';
  position: absolute;
  top: 12px; right: 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; letter-spacing: 0.25em;
  color: var(--gold);
  padding: 3px 7px;
  border: 1px solid var(--gold);
  background: rgba(255, 215, 0, 0.08);
}
.team-avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.18), rgba(255, 180, 0, 0.06));
  border: 1px solid var(--line-strong);
  margin-bottom: 16px;
  position: relative;
}
.team-avatar::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), transparent 50%);
  opacity: 0.2;
  z-index: -1;
}
.team-avatar span {
  font-family: 'Orbitron', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: var(--gold);
  text-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
  letter-spacing: 0.02em;
}
.team-card-lead .team-avatar {
  width: 64px; height: 64px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.25), rgba(255, 180, 0, 0.1));
}
.team-card-lead .team-avatar span { font-size: 24px; }
.team-body { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.team-handle {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.05em;
  color: var(--gold);
}
.team-name {
  font-family: 'Orbitron', sans-serif;
  font-size: 18px;
  color: var(--text);
  font-weight: 700;
  margin: 2px 0;
}
.team-role {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.15em;
  color: var(--text-mute);
  text-transform: uppercase;
  margin-bottom: 12px;
}
.team-bio {
  font-size: 12.5px;
  color: var(--text-mute);
  line-height: 1.5;
  margin-top: auto;
}
.team-foot {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}
.team-foot > div { display: flex; flex-direction: column; gap: 4px; }
.team-foot span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.25em;
  color: var(--text-dim);
  text-transform: uppercase;
}
.team-foot b {
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  color: var(--gold);
  font-weight: 600;
}
@media (max-width: 1100px) {
  .team-grid { grid-template-columns: 1fr 1fr; }
  .team-foot { grid-template-columns: 1fr 1fr; gap: 12px; }
}
@media (max-width: 640px) {
  .team-grid { grid-template-columns: 1fr; }
  .team-foot { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   PROBLEM SECTION — hard stats, comparison table
   ============================================================ */
.problem-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 32px 0 56px;
}
.problem-stat {
  padding: 24px 22px;
  background: linear-gradient(180deg, rgba(255, 80, 80, 0.04), rgba(20, 20, 31, 0.5));
  border: 1px solid rgba(255, 107, 107, 0.2);
  border-left: 2px solid var(--red);
  position: relative;
  overflow: hidden;
}
.problem-stat-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.3em;
  color: var(--red);
  text-transform: uppercase;
  margin-bottom: 12px;
  display: block;
}
.problem-stat-num {
  display: block;
  font-family: 'Orbitron', sans-serif;
  font-size: 52px;
  font-weight: 800;
  color: var(--red);
  line-height: 1;
  margin-bottom: 14px;
  text-shadow: 0 0 18px rgba(255, 107, 107, 0.25);
}
.problem-stat-num small {
  font-size: 22px;
  color: var(--text-mute);
  margin-left: 2px;
  font-weight: 600;
}
.problem-stat p {
  font-size: 13px;
  color: var(--text-mute);
  line-height: 1.5;
}

.problem-existing {
  margin: 56px 0;
}
.problem-existing h4 {
  font-size: 16px;
  color: var(--gold);
  margin-bottom: 20px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.problem-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  background: rgba(20, 20, 31, 0.4);
  border: 1px solid var(--line-soft);
}
.problem-table th, .problem-table td {
  padding: 14px 18px;
  text-align: left;
  border-bottom: 1px solid var(--line-soft);
}
.problem-table thead th {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em;
  color: var(--text-dim);
  text-transform: uppercase;
  background: rgba(10, 10, 18, 0.6);
}
.problem-table tbody td:first-child {
  color: var(--text);
  font-weight: 600;
}
.problem-table td.ok { color: var(--gold); }
.problem-table td.partial { color: var(--text-mute); }
.problem-table td.no { color: var(--red); opacity: 0.8; }
.problem-table .us-row {
  background: linear-gradient(90deg, rgba(255, 215, 0, 0.06), rgba(255, 215, 0, 0.02));
  border-top: 2px solid var(--gold);
  padding: 18px 20px;
}
.problem-table .us-pin {
  display: inline-block;
  font-family: 'Orbitron', sans-serif;
  font-size: 11px; letter-spacing: 0.22em;
  font-weight: 800;
  background: linear-gradient(180deg, #FFD700, #FFB400) !important;
  color: #0a0a12 !important;
  text-shadow: none !important;
  padding: 5px 12px;
  margin-right: 14px;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(255, 215, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.problem-table .us-row span:last-of-type {
  font-family: 'Rajdhani', sans-serif;
  font-size: 15px;
  color: var(--text);
  font-weight: 500;
}

/* ============================================================
   WHY WE WIN — investor + grant case
   ============================================================ */
.why-block { margin-bottom: 56px; }
.why-block:last-child { margin-bottom: 0; }
.why-head { margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--line-soft); }
.why-head-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid var(--line-strong);
  background: rgba(255, 215, 0, 0.04);
  margin-bottom: 14px;
}
.why-head h3 {
  font-size: 28px;
  color: var(--text);
  font-family: 'Orbitron', sans-serif;
  line-height: 1.25;
}
.why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.why-card {
  padding: 28px 24px;
  background: rgba(20, 20, 31, 0.6);
  border: 1px solid var(--line-soft);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.why-card:hover { border-color: var(--line-strong); transform: translateY(-4px); }
.why-card-featured {
  background: linear-gradient(180deg, rgba(40, 30, 10, 0.5), rgba(10, 10, 18, 0.6));
  border-color: var(--line-strong);
}
.why-card-featured::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, transparent, var(--gold), transparent);
  box-shadow: 0 0 12px var(--gold);
}
.why-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  margin-bottom: 12px;
}
.why-card h4 {
  font-size: 20px;
  color: var(--text);
  margin-bottom: 14px;
  font-family: 'Orbitron', sans-serif;
  line-height: 1.25;
}
.why-card > p {
  font-size: 14px;
  color: var(--text-mute);
  line-height: 1.6;
  margin-bottom: 18px;
}
.why-list {
  list-style: none;
  display: flex; flex-direction: column; gap: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--line-soft);
}
.why-list li {
  font-size: 12px;
  color: var(--text);
  padding-left: 14px;
  position: relative;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.02em;
}
.why-list li::before {
  content: '›';
  position: absolute; left: 0;
  color: var(--gold);
}

.why-grants-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.why-grant {
  padding: 22px 22px 20px;
  background: rgba(20, 20, 31, 0.55);
  border: 1px solid var(--line-soft);
  display: flex; flex-direction: column; gap: 12px;
  transition: all 0.3s ease;
}
.why-grant:hover { border-color: var(--gold); background: rgba(255, 215, 0, 0.03); }
.why-grant-head {
  display: flex; gap: 14px;
  align-items: flex-start;
}
.why-grant-head i {
  font-size: 18px;
  color: var(--gold);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  flex-shrink: 0;
}
.why-grant-head b {
  display: block;
  font-size: 14px;
  color: var(--text);
  font-family: 'Orbitron', sans-serif;
  margin-bottom: 2px;
}
.why-grant-head span {
  font-size: 11px;
  color: var(--text-mute);
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.05em;
}
.why-grant p {
  font-size: 12.5px;
  color: var(--text-mute);
  line-height: 1.5;
  flex: 1;
}
.why-grant-band {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.15em;
  color: var(--gold);
  font-style: normal;
  padding: 6px 10px;
  background: rgba(255, 215, 0, 0.06);
  border: 1px solid var(--line-strong);
  width: fit-content;
}

.why-exit {
  margin-top: 40px;
  padding: 28px 32px;
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.04), rgba(20, 20, 31, 0.6));
  border: 1px solid var(--line-strong);
}
.why-exit-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.3em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}
.why-exit-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.why-exit-grid > div { display: flex; flex-direction: column; gap: 6px; }
.why-exit-grid b {
  font-size: 15px;
  color: var(--text);
  font-family: 'Orbitron', sans-serif;
}
.why-exit-grid span {
  font-size: 12.5px;
  color: var(--text-mute);
  line-height: 1.5;
}

/* ============================================================
   Reveal animations (used by JS)
   ============================================================ */
/* data-reveal is no longer used for hiding; kept as no-op for legacy markup */
[data-reveal] { opacity: 1; transform: none; }
[data-reveal].visible { opacity: 1; transform: none; }

/* ============================================================
   Responsive — tablet
   ============================================================ */
@media (max-width: 1100px) {
  .sec { padding: 80px 32px; }
  .hero-inner { padding: 80px 32px; }
  .thesis-grid, .gap-grid, .l1-split, .shadow-grid, .biz-split, .ask-grid, .token-grid { grid-template-columns: 1fr; gap: 40px; }
  .stack-grid, .market-grid { grid-template-columns: 1fr; }
  .moat-grid, .eco-grid, .audit-layers-grid { grid-template-columns: 1fr 1fr; }
  .audit-hero { grid-template-columns: 1fr; text-align: center; }
  .audit-hero-shield { display: none; }
  .hud-tr { display: none; }
  .gap-divider { display: none; }
  .biz-window { transform: none; }
  .biz-window-body { grid-template-columns: 1fr; }
  .biz-nav { flex-direction: row; overflow-x: auto; padding: 8px; }
  .biz-kpis { grid-template-columns: 1fr 1fr; }
  .biz-row { grid-template-columns: 1fr 1fr; gap: 8px; }
  .token-utility { grid-template-columns: 1fr 1fr 1fr; }
  .trac-grid, .contact-grid { grid-template-columns: 1fr 1fr; }
  .l1-features { grid-template-columns: 1fr; }
  .l1-stat-row { grid-template-columns: 1fr 1fr 1fr 1fr; }
  .rm-body ul { grid-template-columns: 1fr 1fr; }
  .dots { display: none; }
  .atlas-grid { grid-template-columns: 1fr; }
  .spb-codes { grid-template-columns: 1fr 1fr; }
  .biz-precompile-banner { grid-template-columns: 1fr; gap: 24px; }
  .atlas-callout-trio { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .atlas-callout-trio .atlas-trio-arrow { display: none; }
  .problem-stats { grid-template-columns: 1fr 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .why-grants-grid { grid-template-columns: 1fr 1fr; }
  .why-exit-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   Responsive — slide-mode tablet
   ============================================================ */
@media (max-width: 1100px) {
  .sec { padding: 70px 28px 100px; }
  .slide-edge-btn { width: 44px; height: 60px; font-size: 14px; }
  .slide-edge-prev { left: 12px; }
  .slide-edge-next { right: 12px; }
  .slide-controls { bottom: 14px; padding: 6px 10px; gap: 8px; }
  .slide-btn { width: 36px; height: 36px; font-size: 12px; }
  .slide-btn-primary { width: 44px; height: 36px; }
  .slide-counter { padding: 0 8px; height: 36px; }
  .slide-counter-cur { font-size: 14px; }
  .slide-label { max-width: 110px; font-size: 9px; }
  .atlas-grid { grid-template-columns: 1fr 1fr; }
}

/* ============================================================
   Responsive — mobile (≤ 640px)
   ============================================================ */
@media (max-width: 640px) {
  .sec { padding: 60px 14px 90px; }
  .slide-edge-btn { display: none; }
  .slide-controls {
    bottom: 12px;
    padding: 5px 8px;
    gap: 4px;
    border-radius: 6px;
    width: calc(100vw - 24px);
    max-width: 380px;
    justify-content: center;
  }
  .slide-btn { width: 34px; height: 34px; font-size: 11px; }
  .slide-btn-primary { width: 40px; height: 34px; }
  .slide-counter { padding: 0 6px; height: 34px; }
  .slide-counter-cur { font-size: 13px; min-width: 22px; }
  .slide-counter-total { font-size: 10px; }
  .slide-label { display: none; }
  .slide-progress-bar { height: 3px; }

  .hero-inner { padding: 60px 18px; }
  .sec-title { font-size: 30px; margin-bottom: 24px; }
  .sec-lead { font-size: 15px; margin-bottom: 32px; }
  .hero-title { font-size: 44px; }
  .hero-sub { font-size: 16px; margin-bottom: 36px; }
  .hero-pillars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
    flex-direction: unset;
  }
  .hero-pillar-num { font-size: 22px; }
  .hero-pillar-lbl { font-size: 9px; letter-spacing: 0.15em; }

  /* HUD: simplified for mobile */
  .hud-tl { top: 12px; left: 12px; }
  .hud-bl { bottom: 12px; left: 12px; }
  .hud-br { display: none; }
  .hud-brand { gap: 8px; }
  .hud-logo { font-size: 13px; }
  .hud-logo-img { width: 22px; height: 22px; }
  .hud-badge { font-size: 7px; padding: 2px 6px; letter-spacing: 0.15em; }
  .hud-progress { min-width: 0; gap: 8px; }
  .hud-progress-track { min-width: 100px; }
  .hud-progress-label { font-size: 8px; letter-spacing: 0.12em; }

  .moat-grid, .eco-grid, .audit-layers-grid, .trac-grid, .contact-grid, .token-utility, .biz-kpis {
    grid-template-columns: 1fr;
  }

  /* Loader: smaller on mobile */
  .loader-hex { width: 100px; height: 100px; }
  .loader-logo-img { width: 48px; height: 48px; }
  .loader-text { min-width: 0; width: 90vw; }
  .loader-bar, .loader-stream { width: 100%; max-width: 320px; }
  .loader-meta { flex-wrap: wrap; justify-content: center; font-size: 8px; }

  /* Thesis */
  .thesis-quote { padding: 28px 24px 28px 36px; }
  .thesis-quote p { font-size: 17px; }
  .thesis-mark { font-size: 80px; }
  .thesis-point { padding: 18px; gap: 14px; }

  /* Gap */
  .gap-panel { padding: 28px 22px; }
  .gap-panel h3 { font-size: 22px; }
  .gap-conclusion { padding: 28px 22px; }
  .gap-conclusion p { font-size: 17px; }

  /* Stack cards */
  .stack-card { min-height: auto; padding: 28px 22px; }
  .stack-card h3 { font-size: 28px; }
  .stack-card-head { margin-top: 56px; }
  .stack-card-specs { grid-template-columns: 1fr 1fr; gap: 12px; }

  /* L1 */
  .l1-stat-row { grid-template-columns: 1fr 1fr; gap: 16px; }
  .l1-stat b { font-size: 24px; }
  .l1-visual-hud { padding: 10px 12px; }
  .l1-hud-row { min-width: 0; font-size: 10px; }
  .l1-endpoints { padding: 18px; }
  .l1-endpoints-grid { grid-template-columns: 1fr; gap: 6px; }
  .l1-endpoints-grid > div { flex-direction: column; align-items: flex-start; gap: 4px; }
  .l1-endpoints-grid > div code { font-size: 11px; word-break: break-all; }

  /* Shadow */
  .shadow-precompile-banner { padding: 22px 20px; }
  .spb-content > p { font-size: 15px; }
  .spb-codes { grid-template-columns: 1fr; }

  /* Business */
  .biz-precompile-banner { padding: 22px 20px; }
  .biz-window-bar { flex-wrap: wrap; }
  .biz-window-title { font-size: 9px; flex: 0 0 100%; order: 3; margin-top: 4px; }
  .biz-row { grid-template-columns: 1fr; gap: 4px; padding: 10px 12px; }
  .biz-row-head { display: none; }
  .biz-row span:nth-child(1) { font-weight: 600; color: var(--gold); }
  .bpb-codes { grid-template-columns: 1fr; }
  .biz-pitch-stat b { font-size: 40px; }
  .biz-pitch-stat b small { font-size: 16px; }

  /* Moat */
  .moat-card { min-height: auto; padding: 22px 20px; }

  /* Audit */
  .audit-hero { padding: 28px 22px; }
  .audit-hero-body h3 { font-size: 22px; }
  .audit-meta { grid-template-columns: 1fr 1fr; }
  .audit-layers-grid > div { padding: 16px; }

  /* Atlas (mobile = critical) — compact, scrollable, large touch targets */
  .sec-atlas .sec-inner { gap: 0; }
  .atlas-callout { padding: 14px 16px; margin: 8px 0 12px; }
  .atlas-callout-kicker { font-size: 9px; margin-bottom: 6px; }
  .atlas-callout-body > p { font-size: 12.5px; margin-bottom: 10px; line-height: 1.45; }
  .atlas-callout-trio { grid-template-columns: 1fr; gap: 6px; }
  .atlas-callout-trio .atlas-trio-arrow { display: none; }
  .atlas-trio-item { padding: 10px 12px; gap: 2px; }
  .atlas-trio-hex { font-size: 10px; }
  .atlas-trio-item b { font-size: 12px; }
  .atlas-trio-item small { font-size: 10px; }

  .atlas-controls {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    position: sticky;
    top: 0;
    z-index: 5;
    background: rgba(6, 6, 10, 0.92);
    padding: 8px 0;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
  .atlas-filters {
    gap: 4px;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }
  .atlas-chip {
    flex-shrink: 0;
    min-height: 36px;
    font-size: 10px;
    padding: 8px 12px;
    letter-spacing: 0.12em;
    display: inline-flex;
    align-items: center;
  }
  .atlas-search { min-width: 0; max-width: 100%; min-height: 38px; }
  .atlas-search input { font-size: 13px; }

  .atlas-row {
    grid-template-columns: 60px 1fr;
    gap: 10px;
    padding: 9px 12px;
    min-height: 48px;
    align-items: center;
  }
  .atlas-row .atlas-cat { display: none; }
  .atlas-hex { font-size: 11px; }
  .atlas-info b { font-size: 13px; line-height: 1.2; }
  .atlas-info small { font-size: 10.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .atlas-footnote { display: none; }

  /* Tokenomics */
  .token-row { grid-template-columns: 6px 1fr; gap: 12px; padding: 12px; }
  .token-row em { display: none; }
  .token-chart-wrap { max-width: 280px; margin: 0 auto; }
  .token-center-val { font-size: 22px; }

  /* Market */
  .market-card { padding: 28px 22px; }
  .market-num { font-size: 48px; }
  .market-num small { font-size: 20px; }
  .ctx-row { padding: 14px 0; gap: 14px; }

  /* Roadmap */
  .rm-phase { grid-template-columns: 30px 1fr; gap: 16px; }
  .rm-marker { width: 30px; height: 30px; font-size: 11px; }
  .rm-body { padding: 18px 20px; }
  .rm-body h4 { font-size: 17px; }
  .rm-body ul { grid-template-columns: 1fr; }
  .roadmap-track { left: 14px; }

  /* Traction */
  .trac-card { padding: 26px 22px; }
  .trac-card b { font-size: 40px; }
  .trac-card b small { font-size: 18px; }

  /* Ask */
  .ask-allocation { padding: 22px; }
  .alloc-row { grid-template-columns: 1fr auto; gap: 8px; }
  .alloc-row .alloc-bar { grid-column: 1 / -1; }

  /* Contact */
  .contact-card { padding: 22px; min-height: auto; }
  .pitch-footer-row { flex-direction: column; gap: 8px; font-size: 9px; }

  /* Problem / Why */
  .problem-stats { grid-template-columns: 1fr; gap: 12px; }
  .problem-stat-num { font-size: 40px; }
  .problem-stat-num small { font-size: 18px; }
  .problem-table { font-size: 12px; }
  .problem-table th, .problem-table td { padding: 10px 12px; }
  .why-head h3 { font-size: 22px; }
  .why-card { padding: 22px 20px; }
  .why-grants-grid { grid-template-columns: 1fr; }
  .why-exit { padding: 22px 20px; }
}

/* ============================================================
   Responsive — small mobile (≤ 380px)
   ============================================================ */
@media (max-width: 380px) {
  .hero-title { font-size: 36px; }
  .hero-pillars { grid-template-columns: 1fr; }
  .atlas-row { grid-template-columns: 60px 1fr; }
  .atlas-row .atlas-cat { display: none; }
}

/* ============================================================
   Reduced motion: respect user preference
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .scene-canvas { opacity: 0.2; }
}

/* ============================================================
   Touch / coarse pointer: disable hover tilts
   ============================================================ */
@media (hover: none) {
  [data-tilt] { transform: none !important; }
  .stack-card:hover, .eco-tile:hover, .moat-card:hover {
    transform: none;
  }
}