.pro-wrap {
  max-width: 520px;
  margin: 0 auto;
  padding: 32px 16px 48px;
}

.pro-card {
  background: #fffcf8;
  border: 1px solid rgba(233, 69, 96, 0.12);
  border-radius: 20px;
  padding: 28px 24px;
  box-shadow: 0 8px 32px rgba(45, 42, 38, 0.06);
}

.pro-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #e94560;
  background: rgba(233, 69, 96, 0.08);
  padding: 6px 12px;
  border-radius: 999px;
  margin-bottom: 12px;
}

.pro-badge--active {
  color: #15803d;
  background: rgba(21, 128, 61, 0.1);
}

.pro-benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
}

.pro-benefits li {
  padding: 8px 0;
  border-bottom: 1px solid rgba(45, 42, 38, 0.06);
  font-size: 0.95rem;
}

.pro-actions .btn-primary {
  background: #e94560;
  border-color: #e94560;
}

.pro-actions .btn-primary:hover {
  background: #d63a54;
  border-color: #d63a54;
}

.section-card--locked {
  opacity: 0.72;
  border-style: dashed;
}

.section-card--locked .section-action {
  color: #e94560;
  font-weight: 700;
}

.course-lesson--locked {
  opacity: 0.88;
}

.course-lesson--locked .lesson-lock-badge {
  margin-left: auto;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #e94560;
  background: rgba(233, 69, 96, 0.1);
  padding: 4px 10px;
  border-radius: 999px;
  flex-shrink: 0;
}

.skill-card--locked {
  opacity: 0.75;
  cursor: pointer;
}

.navbar-pro-pill {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  text-decoration: none;
}

.navbar-pro-pill--free {
  color: #e94560;
  background: rgba(233, 69, 96, 0.1);
  border: 1px solid rgba(233, 69, 96, 0.2);
}

.navbar-pro-pill--active {
  color: #15803d;
  background: rgba(21, 128, 61, 0.1);
  border: 1px solid rgba(21, 128, 61, 0.2);
}