/* ============================================================
   partner-page.css — Specific styles for the Partner Program
   ============================================================ */

:root {
  --comp-line: rgba(255,255,255,.08);
  --comp-line2: rgba(255,255,255,.05);
  --comp-text: #eef5ff;
  --comp-muted: #9db0c4;
  --comp-orange: #ff6600;
  --comp-blue: #58b7ff;
  --comp-shadow: 0 28px 80px rgba(0,0,0,.42);
}

/* ── Badges & Utility ─────────────────────────────────────── */
.badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; border: 1px solid var(--comp-line); background: rgba(255,255,255,.03); color: #d8e4f0; margin-bottom: 10px; }
.badge.orange { background: rgba(255,102,0,.10); border-color: rgba(255,102,0,.26); color: #ffd8bf; }
.badge.blue { background: rgba(88,183,255,.10); border-color: rgba(88,183,255,.24); color: #d4efff; }
.badge.green { background: rgba(99,214,165,.10); border-color: rgba(99,214,165,.24); color: #d8ffee; }
.badge.purple { background: rgba(169,140,255,.10); border-color: rgba(169,140,255,.24); color: #e2d8ff; }

/* ── Partner Tier Comparison Cards ────────────────────────── */
.revenue-card {
  border-radius: 24px; padding: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border: 1px solid var(--comp-line); box-shadow: var(--comp-shadow);
  height: 100%;
}
.revenue-card .price-badge {
  display: block; font-size: 38px; font-weight: 900;
  letter-spacing: -.04em; line-height: 1; margin: 10px 0 4px;
}
.revenue-card .price-badge.orange { color: var(--comp-orange); }
.revenue-card .price-badge.blue   { color: var(--comp-blue); }
.revenue-card .sub-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: .1em;
  font-weight: 800; color: var(--comp-muted); margin: 16px 0 4px; display: block;
}
.revenue-card ul { margin: 6px 0 0 16px; padding: 0; }
.revenue-card li { margin: 5px 0; color: var(--comp-muted); font-size: 14px; }

/* ── Pull Quote ───────────────────────────────────────────── */
.pp-hero-quote {
  border-left: 3px solid var(--comp-orange);
  padding: 18px 22px;
  border-radius: 0 18px 18px 0;
  background: rgba(255,102,0,.06);
  position: relative; overflow: hidden;
  margin-top: 24px;
}
.pp-hero-quote p {
  font-size: 18px !important;
  line-height: 1.45 !important;
  letter-spacing: -.02em;
  margin: 0 0 6px !important;
  color: var(--comp-text);
}
.pp-hero-quote small { color: var(--comp-muted); font-size: 12px; }

/* ── Timeline ─────────────────────────────────────────────── */
.timeline { display: grid; gap: 14px; margin-top: 32px; }
.timeline-card { 
  border-radius: 20px; padding: 16px 18px; display: grid; grid-template-columns: 120px 1fr; gap: 16px; 
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)); 
  border: 1px solid var(--comp-line2); 
}
.phase { font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; color: #ffd8bf; }

@media (max-width:760px) {
  .revenue-card { padding: 20px 18px; }
  .timeline-card { grid-template-columns: 1fr; }
}