/* 📖 sections/for-whom.css — Seção: Para quem é o Hubit (qualificação de leads)
   ⚠️  Alterar? Seção antes da implantação para qualificar o prospect */

.for-whom {
  padding: var(--section-py-sm) 0;
  background: var(--color-bg-base);
}

.for-whom__intro {
  font-size: var(--text-xl);
  font-weight: var(--font-semibold);
  color: var(--color-text-primary);
  max-width: 720px;
  margin: 0 auto var(--space-10);
  text-align: center;
  line-height: var(--leading-relaxed);
}

@media (min-width: 768px) {
  .for-whom__intro { font-size: var(--text-2xl); }
}

.for-whom__intro mark {
  background: none;
  color: var(--color-accent);
}

/* ─── Grid de perfis ─── */

.for-whom__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-3);
}

.for-whom__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background: var(--color-bg-raised);
  border-radius: var(--radius-lg);
  border: var(--border-muted);
  transition: border-color 0.2s, transform 0.2s;
}

.for-whom__item:hover {
  border-color: rgba(125,169,212,0.25);
  transform: translateY(-1px);
}

.for-whom__check {
  color: var(--color-success);
  font-size: var(--text-base);
  flex-shrink: 0;
  margin-top: 2px;
}

.for-whom__text {
  font-size: var(--text-sm);
  color: var(--color-text-secondary);
  line-height: var(--leading-relaxed);
}

/* ─── Nota de exclusão (não para quem é) ─── */

.for-whom__not {
  margin-top: var(--space-8);
  padding: var(--space-5) var(--space-6);
  background: rgba(255,255,255,0.02);
  border-radius: var(--radius-xl);
  border: var(--border-muted);
  text-align: center;
}

.for-whom__not-text {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  line-height: var(--leading-relaxed);
}

.for-whom__not-text strong {
  color: var(--color-text-secondary);
}

/* ─── CTA embaixo ─── */

.for-whom__cta {
  margin-top: var(--space-10);
  text-align: center;
}