/* ============================================
   FIND YOUR FIT: business type selector
   ============================================ */
.type-grid {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.type-btn {
  text-align: left;
  background: var(--surface);
  border: 1.5px solid var(--line);
  border-radius: var(--radius-m);
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.type-btn:hover { border-color: var(--ocean); transform: translateY(-3px); box-shadow: 0 16px 30px -22px rgba(16,21,28,0.25); }
.type-btn.is-active { background: var(--ocean); border-color: var(--ocean); }
.type-btn-name { font-family: var(--font-display); font-size: 18px; font-weight: 500; color: var(--text); }
.type-btn.is-active .type-btn-name { color: #F4F6F5; }
.type-btn-hint { font-family: var(--font-mono); font-size: 12px; color: var(--text-soft); letter-spacing: 0.01em; }
.type-btn.is-active .type-btn-hint { color: rgba(244, 246, 245, 0.75); }

.type-result { margin-top: 28px; overflow: hidden; }
.type-result[hidden] { display: none; }
.type-result-card {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-m);
  padding: 34px 36px;
}
.type-result-eyebrow {
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--brass-deep);
  margin-bottom: 10px;
}
.type-result-plan { font-size: 26px; font-weight: 500; color: var(--text); margin-bottom: 12px; }
.type-result-blurb { font-size: 15px; color: var(--text-soft); max-width: 62ch; margin-bottom: 20px; }
.type-result-features { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-bottom: 26px; }
.type-result-features li { font-size: 14px; color: var(--text); padding-left: 20px; position: relative; }
.type-result-features li::before { content: "\2022"; position: absolute; left: 2px; color: var(--ocean); font-weight: 700; }

@media (max-width: 860px) {
  .type-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .type-grid { grid-template-columns: 1fr; }
  .type-result-card { padding: 26px 24px; }
}

/* Highlight a pricing card matched from the type selector */
.plan-match-badge {
  position: absolute;
  top: -13px;
  left: 32px;
  background: var(--ocean);
  color: #F4F6F5;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 6px 14px;
  border-radius: 999px;
  box-shadow: 0 8px 16px -8px rgba(27,110,140,0.5);
}
.plan-card.is-matched {
  border-color: var(--ocean);
  box-shadow: 0 0 0 2px var(--ocean), 0 30px 50px -30px rgba(27,110,140,0.28);
}