/* ============================================
   Aevum Labs — Roadmap page
   ============================================ */

.rm-hero{
  position: relative;
  padding: 90px 0 50px;
  border-bottom: 1px dashed var(--border);
}
.rm-hero-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 68px;
}
.rm-hero-inner .feature-badge{ margin-bottom: 22px; }
.rm-title{
  font-family: var(--sans);
  font-size: clamp(32px, 4.2vw, 50px);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 20px;
}
.rm-title .dim{ color: var(--fg-dim); font-weight: 600; }
.rm-title .bright{ color: var(--fg); }
.rm-desc{
  font-family: var(--mono);
  font-size: 14.5px;
  line-height: 1.75;
  color: var(--fg-dim);
  max-width: 66ch;
  margin: 0 0 36px;
}
.rm-stats{
  display: flex;
  gap: 36px;
  flex-wrap: wrap;
  padding-top: 28px;
  border-top: 1px dashed var(--border);
}
.rm-stat-value{
  display: block;
  font-family: var(--sans);
  font-size: 26px;
  font-weight: 700;
  color: var(--fg);
}
.rm-stat-label{
  display: block;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--fg-dimmer);
  margin-top: 4px;
}

/* ---- Phase tracker ---- */
.rm-phases{
  display: flex;
  gap: 10px;
  margin-top: 32px;
  flex-wrap: wrap;
}
.rm-phase-chip{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--border-strong);
  border-radius: 20px;
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--fg-dim);
}
.rm-phase-chip .dot{ width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.rm-phase-chip.is-done .dot{ background: #6fd88a; }
.rm-phase-chip.is-active{ border-color: rgba(232,163,85,0.4); color: var(--fg); }
.rm-phase-chip.is-active .dot{ background: #e8a355; }
.rm-phase-chip.is-future .dot{ background: var(--fg-dimmer); }
.rm-phase-chip.is-future{ color: var(--fg-dimmer); }

/* ---- Generic section shell ---- */
.rm-section{
  padding: 70px 0;
  border-bottom: 1px dashed var(--border);
}
.rm-section-inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 68px;
}
.rm-section-head{ margin-bottom: 36px; }
.rm-section-head h2{
  font-family: var(--sans);
  font-size: clamp(22px, 2.8vw, 28px);
  font-weight: 700;
  color: var(--fg);
  margin: 0 0 10px;
}
.rm-section-head p{
  font-family: var(--mono);
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--fg-dim);
  margin: 0;
  max-width: 68ch;
}
.rm-count{
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.05em;
  color: var(--fg-dimmer);
}

/* ---- Summary cards (Shipped / In Progress / Kanoodling) ---- */
.rm-summary-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.rm-summary-card{
  padding: 26px 26px 28px;
  border-left: 1px solid var(--border);
}
.rm-summary-card:first-child{ border-left: none; }
.rm-summary-kicker{
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  margin-bottom: 12px;
  display: block;
}
.rm-summary-card.is-shipped .rm-summary-kicker{ color: #6fd88a; }
.rm-summary-card.is-progress .rm-summary-kicker{ color: #e8a355; }
.rm-summary-card.is-idea .rm-summary-kicker{ color: var(--fg-dimmer); }
.rm-summary-card h3{
  font-family: var(--sans);
  font-size: 16.5px;
  font-weight: 700;
  color: var(--fg);
  margin: 0 0 10px;
}
.rm-summary-card p{
  font-family: var(--mono);
  font-size: 12.5px;
  line-height: 1.65;
  color: var(--fg-dim);
  margin: 0;
}

/* ---- Row list (used by Active/Next/Shipped/Queued/Parking Lot) ---- */
.rm-phase-block{ margin-bottom: 44px; }
.rm-phase-block:last-child{ margin-bottom: 0; }
.rm-phase-title{
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 4px;
}
.rm-phase-title h3{
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 700;
  color: var(--fg);
  margin: 0;
}
.rm-phase-time{
  font-family: var(--mono);
  font-size: 11px;
  color: var(--fg-dimmer);
}

.rm-row-list{
  display: flex;
  flex-direction: column;
  margin-top: 16px;
}
.rm-row{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 0;
  border-top: 1px solid var(--border);
}
.rm-row:last-child{ }
.rm-row-main{ flex: 1; min-width: 0; }
.rm-row-main h4{
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--fg);
  margin: 0 0 4px;
}
.rm-row-main p{
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.65;
  color: var(--fg-dim);
  margin: 0;
}
.rm-badge{
  flex-shrink: 0;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid transparent;
  white-space: nowrap;
  margin-top: 2px;
}
.rm-badge.is-shipped{ color: #6fd88a; background: rgba(64,168,96,0.1); border-color: rgba(111,216,138,0.3); }
.rm-badge.is-progress{ color: #e8a355; background: rgba(196,120,40,0.1); border-color: rgba(232,163,85,0.3); }
.rm-badge.is-next{ color: #6fa8dc; background: rgba(60,110,190,0.1); border-color: rgba(111,168,220,0.3); }
.rm-badge.is-planned{ color: var(--fg-dim); background: rgba(255,255,255,0.05); border-color: var(--border-strong); }
.rm-badge.is-parked{ color: var(--fg-dimmer); background: transparent; border-color: var(--border); }

/* ---- Dev note quote ---- */
.rm-note{
  margin: 28px 0;
  padding: 16px 20px;
  border-left: 2px solid var(--fg-dimmer);
  background: rgba(255,255,255,0.02);
  border-radius: 0 6px 6px 0;
}
.rm-note p{
  font-family: var(--mono);
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--fg-dim);
  margin: 0 0 6px;
  font-style: italic;
}
.rm-note span{
  font-family: var(--mono);
  font-size: 11px;
  color: var(--fg-dimmer);
}

/* ---- Parking lot section muted treatment ---- */
.rm-section.is-muted .rm-row-main h4{ color: var(--fg-dim); }
.rm-section.is-muted .rm-section-head h2{ color: var(--fg-dim); }

/* ---- Final CTA ---- */
.rm-cta{ padding: 90px 0 100px; text-align: center; }
.rm-cta h2{
  font-family: var(--sans);
  font-size: clamp(22px, 2.8vw, 30px);
  font-weight: 700;
  color: var(--fg);
  margin: 0 0 14px;
}
.rm-cta p{
  font-family: var(--mono);
  font-size: 13.5px;
  color: var(--fg-dim);
  max-width: 56ch;
  margin: 0 auto 28px;
}
.rm-cta-actions{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

@media (max-width: 940px){
  .rm-hero-inner, .rm-section-inner{ padding: 0 24px; }
  .rm-summary-grid{ grid-template-columns: 1fr; }
  .rm-summary-card{ border-left: none; border-top: 1px solid var(--border); }
  .rm-summary-card:first-child{ border-top: none; }
  .rm-row{ flex-direction: column; gap: 8px; }
}