/* =================================================================
   ClaimRestored Investor Relations — Design Tokens & Component Styles
   Navy (#1B2B4B) dominant, Amber (#E8A020) accent, Teal (#0D7377) highlight
   ================================================================= */

/* ─── DESIGN TOKENS ─── */
:root, [data-theme="light"] {
  /* Type Scale */
  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);
  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);
  --text-xl:   clamp(1.5rem,   1.2rem  + 1.25vw, 2.25rem);
  --text-2xl:  clamp(2rem,     1.2rem  + 2.5vw,  3.5rem);
  --text-3xl:  clamp(2.5rem,   1rem    + 4vw,    5rem);

  /* 4px Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Colors — Light Mode */
  --navy:       #1B2B4B;
  --navy-deep:  #0f1e3d;
  --navy-light: #253C7A;
  --amber:      #E8A020;
  --amber-light:#F5B845;
  --teal:       #0D7377;
  --teal-light: #12969B;

  --color-bg:             #ffffff;
  --color-surface:        #F8F9FC;
  --color-surface-2:      #F0F2F7;
  --color-surface-offset: #E8EBF2;
  --color-divider:        #D4D9E4;
  --color-border:         #C8CDD8;

  --color-text:           #1E293B;
  --color-text-muted:     #64748B;
  --color-text-faint:     #94A3B8;
  --color-text-inverse:   #F8FAFC;

  --color-accent:         #E8A020;
  --color-accent-hover:   #F5B845;
  --color-primary:        #0D7377;
  --color-primary-hover:  #12969B;

  /* Radius */
  --radius-sm:   0.375rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-2xl:  1.25rem;
  --radius-full: 9999px;

  /* Transitions */
  --transition-interactive: 180ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth:      400ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(27, 43, 75, 0.06);
  --shadow-md: 0 4px 12px rgba(27, 43, 75, 0.08);
  --shadow-lg: 0 12px 32px rgba(27, 43, 75, 0.12);
  --shadow-xl: 0 24px 48px rgba(27, 43, 75, 0.16);

  /* Content Widths */
  --content-narrow: 640px;
  --content-default: 960px;
  --content-wide: 1200px;

  /* Fonts */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'Plus Jakarta Sans', 'Helvetica Neue', sans-serif;
}

/* ─── DARK MODE ─── */
[data-theme="dark"] {
  --color-bg:             #0c1425;
  --color-surface:        #111d33;
  --color-surface-2:      #162340;
  --color-surface-offset: #1a2844;
  --color-divider:        #253a5c;
  --color-border:         #2f4670;

  --color-text:           #D8E0F0;
  --color-text-muted:     #8BAED6;
  --color-text-faint:     #4a6b92;
  --color-text-inverse:   #0c1425;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 24px 48px rgba(0, 0, 0, 0.6);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --color-bg:             #0c1425;
    --color-surface:        #111d33;
    --color-surface-2:      #162340;
    --color-surface-offset: #1a2844;
    --color-divider:        #253a5c;
    --color-border:         #2f4670;
    --color-text:           #D8E0F0;
    --color-text-muted:     #8BAED6;
    --color-text-faint:     #4a6b92;
    --color-text-inverse:   #0c1425;
  }
}


/* =================================================================
   NAVIGATION
   ================================================================= */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--space-8);
  height: 4.25rem;
  background: rgba(11, 20, 37, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

.nav--scrolled {
  box-shadow: 0 4px 24px rgba(0,0,0,0.3);
}

.nav__brand {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
}

.nav__logo-icon {
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
}

.nav__brand-text {
  display: flex;
  flex-direction: column;
}

.nav__brand-name {
  font-family: var(--font-body);
  font-size: 1.2rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.nav__brand-name span {
  color: var(--amber-light);
}

.nav__brand-tag {
  font-size: var(--text-xs);
  color: #6B8DBF;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
}

.nav__links {
  display: flex;
  align-items: center;
  gap: var(--space-6);
}

.nav__link {
  color: #CADCFC;
  text-decoration: none;
  font-size: var(--text-sm);
  font-weight: 500;
  transition: color var(--transition-interactive);
  position: relative;
}

.nav__link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--amber);
  transition: width var(--transition-interactive);
}

.nav__link:hover {
  color: #ffffff;
}

.nav__link:hover::after {
  width: 100%;
}

.nav__actions {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}

.nav__theme-toggle {
  color: #CADCFC;
  padding: var(--space-2);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color var(--transition-interactive), background var(--transition-interactive);
}

.nav__theme-toggle:hover {
  color: #ffffff;
  background: rgba(255,255,255,0.08);
}

.nav__cta {
  background: var(--amber);
  color: #ffffff;
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-md);
  font-weight: 700;
  text-decoration: none;
  font-size: var(--text-sm);
  transition: background var(--transition-interactive), transform var(--transition-interactive);
  white-space: nowrap;
}

.nav__cta:hover {
  background: var(--amber-light);
  transform: translateY(-1px);
}

/* Mobile nav toggle */
.nav__mobile-toggle {
  display: none;
  color: #CADCFC;
  padding: var(--space-2);
}

@media (max-width: 1024px) {
  .nav__links { display: none; }
  .nav__mobile-toggle { display: flex; }
  .nav { padding: 0 var(--space-4); }
}

/* Mobile menu */
.mobile-menu {
  position: fixed;
  top: 4.25rem;
  left: 0;
  right: 0;
  background: rgba(11, 20, 37, 0.98);
  backdrop-filter: blur(12px);
  padding: var(--space-6);
  display: none;
  flex-direction: column;
  gap: var(--space-4);
  z-index: 99;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.mobile-menu.active {
  display: flex;
}

.mobile-menu a {
  color: #CADCFC;
  text-decoration: none;
  font-size: var(--text-base);
  font-weight: 500;
  padding: var(--space-3) 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: color var(--transition-interactive);
}

.mobile-menu a:hover {
  color: #ffffff;
}


/* =================================================================
   HERO SECTION
   ================================================================= */
.hero {
  padding: calc(4.25rem + var(--space-16)) var(--space-8) var(--space-16);
  background: linear-gradient(160deg, #080e1f 0%, #0f1e3d 30%, #1B2B4B 60%, #142240 100%);
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.hero__grid-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size: 60px 60px;
}

.hero__glow {
  position: absolute;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  filter: blur(120px);
  pointer-events: none;
  opacity: 0.15;
}

.hero__glow--amber {
  background: var(--amber);
  top: -200px;
  right: -100px;
}

.hero__glow--teal {
  background: var(--teal);
  bottom: -200px;
  left: -100px;
}

.hero__inner {
  max-width: var(--content-wide);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: var(--space-12);
  align-items: center;
  position: relative;
  z-index: 1;
  width: 100%;
}

.hero__label {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: var(--space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.hero__label::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--amber);
  animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.3); }
}

.hero__title {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 400;
  color: #ffffff;
  line-height: 1.15;
  margin-bottom: var(--space-6);
  letter-spacing: -0.01em;
}

.hero__title em {
  color: var(--amber-light);
  font-style: normal;
}

.hero__thesis {
  font-size: var(--text-sm);
  color: #CADCFC;
  line-height: 1.75;
  margin-bottom: var(--space-8);
  border-left: 3px solid var(--amber);
  padding-left: var(--space-5);
  max-width: 560px;
}

.hero__ctas {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.btn--primary {
  background: var(--amber);
  color: #ffffff;
  padding: var(--space-3) var(--space-6);
  border-radius: var(--radius-md);
  font-weight: 700;
  font-size: var(--text-sm);
  text-decoration: none;
  transition: all var(--transition-interactive);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.btn--primary:hover {
  background: var(--amber-light);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(232,160,32,0.25);
}

.btn--ghost {
  background: transparent;
  color: #CADCFC;
  padding: var(--space-3) var(--space-6);
  border-radius: var(--radius-md);
  font-weight: 600;
  font-size: var(--text-sm);
  text-decoration: none;
  border: 1.5px solid rgba(255,255,255,0.2);
  transition: all var(--transition-interactive);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.btn--ghost:hover {
  border-color: #ffffff;
  color: #ffffff;
  transform: translateY(-2px);
}

/* Hero metrics */
.hero__metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-4);
}

.hero__metric {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-xl);
  padding: var(--space-5);
  transition: background var(--transition-interactive), border-color var(--transition-interactive);
}

.hero__metric:hover {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.14);
}

.hero__metric-num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  color: var(--amber-light);
  line-height: 1.2;
}

.hero__metric-lbl {
  font-size: var(--text-xs);
  color: #8BAED6;
  margin-top: var(--space-1);
  line-height: 1.45;
}

.hero__metric-src {
  font-size: 0.7rem;
  color: #3d5470;
  margin-top: var(--space-1);
}


/* =================================================================
   SECTIONS — Shared
   ================================================================= */
.section {
  padding: clamp(var(--space-12), 8vw, var(--space-24)) var(--space-8);
}

.section--light {
  background: var(--color-bg);
}

.section--alt {
  background: var(--color-surface);
}

[data-theme="dark"] .section--alt {
  background: var(--color-surface);
}

.section--dark {
  background: linear-gradient(160deg, #0f1e3d 0%, var(--navy) 55%, #0d2040 100%);
}

.section__inner {
  max-width: var(--content-wide);
  margin: 0 auto;
}

.section__tag {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--amber);
  margin-bottom: var(--space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.section__tag::before {
  content: '';
  width: 24px;
  height: 2px;
  background: var(--amber);
}

.section__title {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  color: var(--color-text);
  margin-bottom: var(--space-3);
  line-height: 1.2;
}

.section__title--light {
  color: #ffffff;
}

.section__sub {
  color: var(--color-text-muted);
  font-size: var(--text-sm);
  max-width: 700px;
  margin-bottom: var(--space-10);
  line-height: 1.7;
}

.section__sub--light {
  color: #CADCFC;
}


/* =================================================================
   DIVIDER
   ================================================================= */
.divider-amber {
  height: 4px;
  background: linear-gradient(90deg, var(--amber), var(--teal));
}


/* =================================================================
   CATALYST / THESIS CARDS
   ================================================================= */
.catalysts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
}

.catalyst {
  background: var(--color-bg);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  box-shadow: var(--shadow-md);
  border-top: 4px solid;
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

.catalyst:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.catalyst--amber { border-color: var(--amber); }
.catalyst--teal { border-color: var(--teal); }
.catalyst--red { border-color: #C0392B; }

.catalyst__badge {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 700;
  margin-bottom: var(--space-4);
}

.badge--amber { background: rgba(232,160,32,0.1); color: var(--amber); }
.badge--teal  { background: rgba(13,115,119,0.1); color: var(--teal); }
.badge--red   { background: rgba(192,57,43,0.08); color: #C0392B; }

.catalyst h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-text);
  margin-bottom: var(--space-3);
  font-weight: 400;
}

.catalyst p {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
}

.catalyst__stat {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-divider);
}

.catalyst__stat-num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  line-height: 1.2;
}

.stat--amber { color: var(--amber); }
.stat--teal  { color: var(--teal); }
.stat--red   { color: #C0392B; }

.catalyst__stat-lbl {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-1);
}


/* =================================================================
   PLATFORM ARCHITECTURE
   ================================================================= */
.platform-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.platform-card {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

.platform-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-xl);
}

.platform-header {
  padding: var(--space-6) var(--space-6) var(--space-4);
}

.p-consumer .platform-header   { background: var(--navy); }
.p-indie .platform-header      { background: var(--teal); }
.p-enterprise .platform-header { background: #1a4040; }

.platform-header__tag {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: var(--space-2);
}

.platform-header h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 400;
  color: #ffffff;
  margin-bottom: var(--space-1);
}

.platform-header__sub {
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.7);
}

.platform-body {
  background: var(--color-bg);
  padding: var(--space-6);
  border: 1px solid var(--color-divider);
  border-top: none;
}

[data-theme="dark"] .platform-body {
  background: var(--color-surface);
}

.platform-body__audience {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-3);
}

.platform-features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}

.platform-features li {
  font-size: var(--text-sm);
  color: var(--color-text);
  display: flex;
  gap: var(--space-2);
  line-height: 1.5;
}

.platform-features li::before {
  content: '\2192';
  color: var(--teal);
  font-weight: 700;
  flex-shrink: 0;
}

.platform-pricing {
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--color-text);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-divider);
}

.platform-pricing span {
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--color-text-muted);
}

.platform-note {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-2);
  font-style: italic;
  line-height: 1.55;
}


/* =================================================================
   COMPETITIVE LANDSCAPE — Quadrant
   ================================================================= */
.competitive-section {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-12);
  align-items: start;
  margin-top: var(--space-8);
}

.quadrant {
  position: relative;
  aspect-ratio: 1;
  max-width: 500px;
  background: var(--color-surface);
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-divider);
  overflow: hidden;
}

[data-theme="dark"] .quadrant {
  background: var(--color-surface-2);
}

.quadrant__axis-x,
.quadrant__axis-y {
  position: absolute;
  background: var(--color-divider);
}

.quadrant__axis-x {
  left: 15%;
  right: 5%;
  top: 50%;
  height: 1px;
}

.quadrant__axis-y {
  top: 5%;
  bottom: 15%;
  left: 50%;
  width: 1px;
}

.quadrant__label {
  position: absolute;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-text-faint);
}

.quadrant__label--top { top: 6%; left: 50%; transform: translateX(-50%); }
.quadrant__label--bottom { bottom: 6%; left: 50%; transform: translateX(-50%); }
.quadrant__label--left { left: 4%; top: 50%; transform: translateY(-50%) rotate(-90deg); }
.quadrant__label--right { right: 4%; top: 50%; transform: translateY(-50%) rotate(90deg); }

.quadrant__dot {
  position: absolute;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.quadrant__dot--cr {
  width: 56px;
  height: 56px;
  background: var(--amber);
  top: 16%;
  right: 16%;
  box-shadow: 0 0 0 6px rgba(232,160,32,0.2), 0 0 40px rgba(232,160,32,0.3);
  z-index: 2;
}

.quadrant__dot--cr span {
  font-size: 0.6rem;
  font-weight: 800;
  color: #ffffff;
  text-align: center;
  line-height: 1.1;
}

.quadrant__dot--small {
  width: 28px;
  height: 28px;
  background: rgba(100, 116, 139, 0.3);
  border: 1px solid rgba(100, 116, 139, 0.4);
}

.quadrant__dot--small span {
  font-size: 0.45rem;
  font-weight: 700;
  color: var(--color-text-muted);
  text-align: center;
  line-height: 1;
}

.competitive-details {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.competitive-insight {
  background: var(--color-bg);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  border-left: 3px solid var(--amber);
  box-shadow: var(--shadow-sm);
}

[data-theme="dark"] .competitive-insight {
  background: var(--color-surface);
}

.competitive-insight h4 {
  font-family: var(--font-display);
  font-size: var(--text-base);
  color: var(--color-text);
  margin-bottom: var(--space-2);
}

.competitive-insight p {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.65;
}


/* =================================================================
   UNIT ECONOMICS
   ================================================================= */
.econ-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-8);
}

.econ-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-xl);
  padding: var(--space-6) var(--space-5);
  text-align: center;
  transition: background var(--transition-interactive), border-color var(--transition-interactive);
}

.econ-card:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.16);
}

.econ-card__num {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--amber-light);
  line-height: 1.2;
}

.econ-card__lbl {
  font-size: var(--text-sm);
  color: #ffffff;
  font-weight: 700;
  margin-top: var(--space-2);
}

.econ-card__sub {
  font-size: var(--text-xs);
  color: #8BAED6;
  margin-top: var(--space-2);
  line-height: 1.55;
}


/* =================================================================
   REVENUE TABLE
   ================================================================= */
.rev-table-wrap {
  margin-top: var(--space-10);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}

.rev-table {
  width: 100%;
  border-collapse: collapse;
}

.rev-table th {
  background: var(--navy);
  color: #ffffff;
  font-size: var(--text-xs);
  font-weight: 700;
  padding: var(--space-3) var(--space-4);
  text-align: left;
  white-space: nowrap;
}

.rev-table td {
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: #D8E0F0;
}

.rev-table tr:nth-child(even) td {
  background: rgba(255,255,255,0.02);
}

.rev-table tr.total-row td {
  background: rgba(232,160,32,0.12);
  color: #ffffff;
  font-weight: 800;
  font-size: var(--text-sm);
}

.rev-highlight {
  color: var(--amber-light);
  font-weight: 700;
}

.rev-table__note {
  margin-top: var(--space-3);
  font-size: var(--text-xs);
  color: #8BAED6;
  font-style: italic;
}


/* =================================================================
   TECHNOLOGY
   ================================================================= */
.tech-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.tech-card {
  background: var(--color-bg);
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  border: 1px solid var(--color-divider);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

[data-theme="dark"] .tech-card {
  background: var(--color-surface);
}

.tech-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.tech-card__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-4);
  font-size: 1.4rem;
}

.tech-card__icon--navy { background: rgba(27,43,75,0.08); }
.tech-card__icon--teal { background: rgba(13,115,119,0.08); }
.tech-card__icon--amber { background: rgba(232,160,32,0.08); }

[data-theme="dark"] .tech-card__icon--navy { background: rgba(27,43,75,0.3); }
[data-theme="dark"] .tech-card__icon--teal { background: rgba(13,115,119,0.3); }
[data-theme="dark"] .tech-card__icon--amber { background: rgba(232,160,32,0.2); }

.tech-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-text);
  margin-bottom: var(--space-2);
  font-weight: 400;
}

.tech-card p {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.65;
}

.tech-card__metric {
  margin-top: var(--space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: rgba(13,115,119,0.08);
  border-radius: var(--radius-full);
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--teal);
}

[data-theme="dark"] .tech-card__metric {
  background: rgba(13,115,119,0.2);
}


/* =================================================================
   MOAT SECTION
   ================================================================= */
.moat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.moat-card {
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  transition: transform var(--transition-smooth);
}

.moat-card:hover {
  transform: translateY(-3px);
}

.moat-card--navy {
  background: var(--navy);
  box-shadow: var(--shadow-lg);
}

.moat-card--teal {
  background: var(--teal);
  box-shadow: var(--shadow-lg);
}

.moat-card--amber-outline {
  background: rgba(232,160,32,0.06);
  border: 2px solid var(--amber);
}

[data-theme="dark"] .moat-card--amber-outline {
  background: rgba(232,160,32,0.08);
}

.moat-card--light {
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
}

.moat-card__icon {
  font-size: 1.8rem;
  margin-bottom: var(--space-4);
}

.moat-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  margin-bottom: var(--space-2);
  font-weight: 400;
}

.moat-card--navy h3,
.moat-card--teal h3 { color: #ffffff; }

.moat-card--amber-outline h3,
.moat-card--light h3 { color: var(--color-text); }

.moat-card p {
  font-size: var(--text-sm);
  line-height: 1.65;
}

.moat-card--navy p { color: #CADCFC; }
.moat-card--teal p { color: rgba(255,255,255,0.85); }
.moat-card--amber-outline p,
.moat-card--light p { color: var(--color-text-muted); }


/* =================================================================
   GTM PHASES
   ================================================================= */
.phase-track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.phase-card {
  background: var(--color-bg);
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

[data-theme="dark"] .phase-card {
  background: var(--color-surface);
}

.phase-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

.phase-badge {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 700;
  margin-bottom: var(--space-4);
}

.pb--teal  { background: rgba(13,115,119,0.1); color: var(--teal); }
.pb--amber { background: rgba(232,160,32,0.1); color: var(--amber); }
.pb--navy  { background: rgba(27,43,75,0.08); color: var(--navy); }

[data-theme="dark"] .pb--navy { background: rgba(139,174,214,0.1); color: #8BAED6; }

.phase-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-text);
  margin-bottom: var(--space-1);
  font-weight: 400;
}

.phase-card__timing {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  margin-bottom: var(--space-4);
}

.phase-card ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.phase-card li {
  font-size: var(--text-sm);
  color: var(--color-text);
  display: flex;
  gap: var(--space-2);
  line-height: 1.5;
}

.phase-card li::before {
  content: '\00B7';
  color: var(--amber);
  font-weight: 700;
  font-size: 1.5em;
  line-height: 1;
  flex-shrink: 0;
}


/* =================================================================
   EXIT ARCHITECTURE
   ================================================================= */
.exit-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
  margin-top: var(--space-8);
}

.exit-card {
  background: var(--color-bg);
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

[data-theme="dark"] .exit-card {
  background: var(--color-surface);
}

.exit-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

.exit-card__label {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--space-3);
}

.el--a { color: var(--teal); }
.el--b { color: var(--amber); }
.el--c { color: var(--navy); }
.el--d { color: #C0392B; }
.el--e { color: #7B3FA0; }
.el--f { color: var(--color-text-muted); }

[data-theme="dark"] .el--c { color: #8BAED6; }

.exit-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-base);
  color: var(--color-text);
  margin-bottom: var(--space-2);
  font-weight: 400;
}

.exit-card p {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.6;
  margin-bottom: var(--space-3);
}

.exit-card__value {
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--amber);
}

.exit-card__priority {
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: 700;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  margin-top: var(--space-2);
}

.ep--high { background: rgba(232,160,32,0.12); color: var(--amber); }
.ep--mid  { background: rgba(13,115,119,0.1); color: var(--teal); }


/* Exit valuation table */
.exit-val-wrap {
  margin-top: var(--space-8);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}

.exit-val-table {
  width: 100%;
  border-collapse: collapse;
}

.exit-val-table th {
  background: var(--navy);
  color: #ffffff;
  font-size: var(--text-xs);
  font-weight: 700;
  padding: var(--space-3) var(--space-4);
  text-align: left;
}

.exit-val-table td {
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  border-bottom: 1px solid var(--color-divider);
  color: var(--color-text);
}

.exit-val-table tr:nth-child(even) td {
  background: var(--color-surface);
}


/* =================================================================
   THE ASK
   ================================================================= */
.ask-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-12);
  align-items: start;
}

.ask-box {
  background: linear-gradient(160deg, #0f1e3d 0%, var(--navy) 100%);
  border-radius: var(--radius-2xl);
  padding: var(--space-8);
  box-shadow: var(--shadow-xl);
}

.ask-box__label {
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--amber);
  font-weight: 700;
  margin-bottom: var(--space-3);
}

.ask-box__amount {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  color: var(--amber-light);
  line-height: 1;
  margin-bottom: var(--space-2);
}

.ask-box__round {
  font-size: var(--text-sm);
  color: #CADCFC;
  margin-bottom: var(--space-6);
}

.ask-terms {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-bottom: var(--space-8);
}

.term-pill {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-full);
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-xs);
  color: #CADCFC;
}

.use-of-funds {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.fund-row__label {
  font-size: var(--text-xs);
  color: #CADCFC;
  margin-bottom: var(--space-1);
  display: flex;
  justify-content: space-between;
}

.fund-row__label strong {
  color: var(--amber-light);
}

.fund-bar {
  height: 8px;
  border-radius: var(--radius-full);
}

.fb--40 { width: 40%; background: var(--teal); }
.fb--30 { width: 30%; background: var(--amber); }
.fb--25 { width: 25%; background: var(--amber); }
.fb--20 { width: 20%; background: #8BAED6; }
.fb--15 { width: 15%; background: #64748B; }
.fb--10 { width: 10%; background: #64748B; }

/* Milestones */
.milestones__title {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: var(--color-text);
  margin-bottom: var(--space-6);
  font-weight: 400;
}

.milestone {
  display: flex;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--color-divider);
}

.milestone:last-child {
  border-bottom: none;
}

.milestone__badge {
  background: var(--navy);
  color: #ffffff;
  font-size: var(--text-xs);
  font-weight: 700;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-md);
  white-space: nowrap;
  align-self: flex-start;
}

.milestone__text h4 {
  font-size: var(--text-sm);
  color: var(--color-text);
  font-weight: 700;
  margin-bottom: var(--space-1);
}

.milestone__text p {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  line-height: 1.55;
}

.milestone--highlight .milestone__badge {
  background: var(--amber);
}

.milestone--highlight .milestone__text h4 {
  color: var(--amber);
}


/* =================================================================
   TEAM
   ================================================================= */
.team-card {
  display: flex;
  gap: var(--space-8);
  align-items: flex-start;
  background: var(--color-bg);
  border-radius: var(--radius-2xl);
  padding: var(--space-8);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--color-divider);
  margin-top: var(--space-8);
}

[data-theme="dark"] .team-card {
  background: var(--color-surface);
}

.team-card__info h3 {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--color-text);
  margin-bottom: var(--space-1);
  font-weight: 400;
}

.team-card__role {
  font-size: var(--text-sm);
  color: var(--amber);
  font-weight: 700;
  margin-bottom: var(--space-4);
}

.team-card__bio {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: 1.7;
  margin-bottom: var(--space-5);
}

.team-pillars {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.team-pillar {
  background: var(--color-surface);
  border: 1px solid var(--color-divider);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-4);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--color-text);
}

[data-theme="dark"] .team-pillar {
  background: var(--color-surface-2);
}


/* =================================================================
   CONTACT CTA
   ================================================================= */
.contact-section {
  padding: clamp(var(--space-12), 8vw, var(--space-24)) var(--space-8);
  background: linear-gradient(160deg, #080e1f 0%, var(--navy) 55%, #0d2040 100%);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.contact-section__inner {
  position: relative;
  z-index: 1;
  max-width: var(--content-default);
  margin: 0 auto;
}

.contact-section h2 {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: #ffffff;
  margin-bottom: var(--space-3);
  font-weight: 400;
}

.contact-section > p,
.contact-section__inner > p {
  color: #CADCFC;
  font-size: var(--text-sm);
  margin-bottom: var(--space-8);
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.7;
}

.contact-card {
  display: inline-block;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-2xl);
  padding: var(--space-8) var(--space-10);
  max-width: 520px;
}

.contact-card__name {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: #ffffff;
  margin-bottom: var(--space-1);
}

.contact-card__role {
  font-size: var(--text-sm);
  color: var(--amber-light);
  margin-bottom: var(--space-6);
}

.contact-card__email {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: var(--amber);
  color: #ffffff;
  padding: var(--space-3) var(--space-8);
  border-radius: var(--radius-md);
  font-weight: 700;
  text-decoration: none;
  font-size: var(--text-sm);
  transition: all var(--transition-interactive);
}

.contact-card__email:hover {
  background: var(--amber-light);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(232,160,32,0.3);
}

.contact-card__fine {
  margin-top: var(--space-4);
  font-size: var(--text-xs);
  color: #3d5470;
  line-height: 1.55;
}


/* =================================================================
   FOOTER
   ================================================================= */
.footer {
  background: #060c1a;
  padding: var(--space-8) var(--space-8) var(--space-6);
}

.footer__inner {
  max-width: var(--content-wide);
  margin: 0 auto;
}

.footer__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--space-6);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.footer__brand-name {
  font-family: var(--font-body);
  font-size: 1.1rem;
  font-weight: 800;
  color: #ffffff;
}

.footer__brand-name span {
  color: var(--amber-light);
}

.footer__brand-entity {
  font-size: var(--text-xs);
  color: #4a5e7a;
  margin-top: var(--space-1);
}

.footer__links {
  display: flex;
  gap: var(--space-6);
}

.footer__links a {
  color: #6B8DBF;
  text-decoration: none;
  font-size: var(--text-xs);
  transition: color var(--transition-interactive);
}

.footer__links a:hover {
  color: #ffffff;
}

.footer__bottom {
  padding-top: var(--space-6);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.footer__disclaimer {
  color: #3d5470;
  font-size: var(--text-xs);
  max-width: 800px;
  line-height: 1.6;
}

.footer__attribution {
  color: #4a5e7a;
  font-size: var(--text-xs);
}

.footer__attribution a {
  color: #6B8DBF;
  text-decoration: none;
  transition: color var(--transition-interactive);
}

.footer__attribution a:hover {
  color: #ffffff;
}


/* =================================================================
   TAM / SAM / SOM
   ================================================================= */
.tam-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
}

.tam-card {
  border-radius: var(--radius-xl);
  padding: var(--space-6);
  text-align: center;
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

.tam-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

.tam-card--tam {
  background: var(--navy);
  box-shadow: var(--shadow-lg);
}

.tam-card--sam {
  background: var(--teal);
  box-shadow: var(--shadow-lg);
}

.tam-card--som {
  background: rgba(232,160,32,0.08);
  border: 2px solid var(--amber);
}

[data-theme="dark"] .tam-card--som {
  background: rgba(232,160,32,0.1);
}

.tam-card__label {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: var(--space-2);
}

.tam-card--tam .tam-card__label,
.tam-card--sam .tam-card__label {
  color: rgba(255,255,255,0.6);
}

.tam-card--som .tam-card__label {
  color: var(--amber);
}

.tam-card__value {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: var(--space-2);
}

.tam-card--tam .tam-card__value,
.tam-card--sam .tam-card__value {
  color: #ffffff;
}

.tam-card--som .tam-card__value {
  color: var(--amber);
}

.tam-card__desc {
  font-size: var(--text-xs);
  line-height: 1.55;
}

.tam-card--tam .tam-card__desc { color: #CADCFC; }
.tam-card--sam .tam-card__desc { color: rgba(255,255,255,0.8); }
.tam-card--som .tam-card__desc { color: var(--color-text-muted); }


/* =================================================================
   DEVELOPMENT ROADMAP
   ================================================================= */
.roadmap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.roadmap-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-2xl);
  padding: var(--space-6);
  transition: transform var(--transition-smooth), border-color var(--transition-interactive), box-shadow var(--transition-smooth);
}

.roadmap-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,255,255,0.2);
  box-shadow: 0 12px 32px rgba(0,0,0,0.3);
}

.roadmap-card--g1 { border-top: 4px solid var(--teal); }
.roadmap-card--g2 { border-top: 4px solid var(--amber); }
.roadmap-card--g3 { border-top: 4px solid #8BAED6; }

.roadmap-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-4);
}

.roadmap-badge {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 700;
}

.rb--teal  { background: rgba(13,115,119,0.2); color: var(--teal-light); }
.rb--amber { background: rgba(232,160,32,0.2); color: var(--amber-light); }
.rb--navy  { background: rgba(139,174,214,0.15); color: #8BAED6; }

.roadmap-card__timing {
  font-size: var(--text-xs);
  color: #8BAED6;
  font-weight: 600;
}

.roadmap-card h3 {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  color: #ffffff;
  margin-bottom: var(--space-4);
  font-weight: 400;
}

.roadmap-features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}

.roadmap-features li {
  font-size: var(--text-sm);
  color: #CADCFC;
  display: flex;
  gap: var(--space-2);
  line-height: 1.5;
}

.roadmap-features li::before {
  content: '\2192';
  color: var(--amber);
  font-weight: 700;
  flex-shrink: 0;
}

.roadmap-meta {
  display: flex;
  gap: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid rgba(255,255,255,0.08);
}

.roadmap-meta__item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.roadmap-meta__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #4a6b92;
}

.roadmap-meta__value {
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--amber-light);
}

.roadmap-callout {
  margin-top: var(--space-8);
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: rgba(232,160,32,0.08);
  border: 1px solid rgba(232,160,32,0.2);
  border-radius: var(--radius-xl);
  padding: var(--space-5) var(--space-6);
}

.roadmap-callout__icon {
  flex-shrink: 0;
}

.roadmap-callout strong {
  color: var(--amber-light);
  font-size: var(--text-sm);
  display: block;
  margin-bottom: var(--space-1);
}

.roadmap-callout span {
  color: #8BAED6;
  font-size: var(--text-xs);
}


/* =================================================================
   SCROLL REVEAL ANIMATIONS
   ================================================================= */
/* Reveal animations — subtle, applied via JS IntersectionObserver */
.reveal {
  opacity: 1;
  transform: translateY(0);
}

.reveal--animate {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal--animate.reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered children */
.stagger > * {
  opacity: 1;
  transform: translateY(0);
}

.stagger--animate > * {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.stagger--animate.stagger--visible > *:nth-child(1) { transition-delay: 0ms; }
.stagger--animate.stagger--visible > *:nth-child(2) { transition-delay: 60ms; }
.stagger--animate.stagger--visible > *:nth-child(3) { transition-delay: 120ms; }
.stagger--animate.stagger--visible > *:nth-child(4) { transition-delay: 180ms; }
.stagger--animate.stagger--visible > *:nth-child(5) { transition-delay: 240ms; }
.stagger--animate.stagger--visible > *:nth-child(6) { transition-delay: 300ms; }

.stagger--animate.stagger--visible > * {
  opacity: 1;
  transform: translateY(0);
}


/* =================================================================
   COUNTER ANIMATION
   ================================================================= */
[data-count] {
  font-variant-numeric: tabular-nums lining-nums;
}


/* =================================================================
   RESPONSIVE
   ================================================================= */
@media (max-width: 1024px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .hero__metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  .catalysts {
    grid-template-columns: 1fr;
  }

  .platform-grid {
    grid-template-columns: 1fr;
  }

  .econ-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .competitive-section {
    grid-template-columns: 1fr;
  }

  .quadrant {
    max-width: 100%;
    margin: 0 auto;
  }

  .tech-grid {
    grid-template-columns: 1fr;
  }

  .moat-grid {
    grid-template-columns: 1fr;
  }

  .phase-track {
    grid-template-columns: 1fr;
  }

  .exit-grid {
    grid-template-columns: 1fr 1fr;
  }

  .ask-grid {
    grid-template-columns: 1fr;
  }

  .team-card {
    flex-direction: column;
  }

  .tam-grid {
    grid-template-columns: 1fr;
  }

  .roadmap-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .hero {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }

  .section {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }

  .hero__metrics {
    grid-template-columns: 1fr;
  }

  .econ-grid {
    grid-template-columns: 1fr;
  }

  .exit-grid {
    grid-template-columns: 1fr;
  }

  .ask-box {
    padding: var(--space-6);
  }

  .contact-card {
    padding: var(--space-6);
  }

  .roadmap-callout {
    flex-direction: column;
    text-align: center;
  }

  .rev-table-wrap {
    overflow-x: auto;
  }

  .rev-table {
    min-width: 600px;
  }

  .exit-val-wrap {
    overflow-x: auto;
  }

  .exit-val-table {
    min-width: 500px;
  }

  .footer__top, .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}