/* PDFlyHQ — blog/tool-cta.css
   The "Try [Tool] now" conversion card. Shared by every post (individual
   <link>, not bundled — see typography.css note). Every post has exactly
   one — see doc/V2/Blog Structure- Sample Blog Page.md. Scoped under
   .tool-cta. */

.tool-cta {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-top: var(--space-10);
  padding: var(--space-5);
  background: color-mix(in srgb, var(--color-primary-500) 6%, var(--color-surface-alt));
  border: 1px solid color-mix(in srgb, var(--color-primary-500) 18%, var(--color-border));
  border-radius: var(--radius-lg);
}

.tool-cta__icon {
  flex: none;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-surface);
  border-radius: var(--radius-md);
  color: var(--color-primary-600);
}
.tool-cta__icon svg { width: 22px; height: 22px; }

.tool-cta__body { flex: 1; min-width: 0; }
.tool-cta__body strong { display: block; font-size: var(--text-md); color: var(--color-text); }
.tool-cta__body p { margin-top: 2px; font-size: var(--text-sm); color: var(--color-text-secondary); }

@media (max-width: 480px) {
  .tool-cta { flex-direction: column; align-items: flex-start; }
  .tool-cta .btn { align-self: stretch; text-align: center; }
}