/* Theme-owned responsive recipe for the semantic workflow matrix. */
.mydev-workflow-comparison {
  inline-size: 100%;
  max-inline-size: 1180px;
  margin-inline: auto;
  overflow: hidden;
  border: 1px solid var(--mydev-color-border, #d6deea);
  border-radius: 24px;
  background: var(--mydev-color-surface, #fff);
  box-shadow: 0 20px 60px rgb(19 27 46 / 4%);
  color: var(--mydev-color-text, #131b2e);
}
.mydev-workflow-comparison__heading,
.mydev-workflow-comparison__row {
  display: grid;
  grid-template-columns: .55fr 1fr 1fr;
}
.mydev-workflow-comparison__heading-cell {
  padding: 24px;
  background: var(--mydev-color-surface-muted, #eef1f6);
  font-family: var(--mydev-font-heading, Questrial), sans-serif;
  font-size: clamp(1.2rem, 2vw, 1.75rem);
  line-height: 1.1;
  letter-spacing: -.03em;
  text-align: center;
}
.mydev-workflow-comparison__heading-cell:first-child {
  font-family: var(--mydev-font-body, Poppins), sans-serif;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: normal;
}
.mydev-workflow-comparison__connected-heading {
  background: var(--mydev-color-secondary, #131b2e);
  color: var(--mydev-color-on-secondary, #fff);
}
.mydev-workflow-comparison__cell {
  min-width: 0;
  padding: 24px;
  border-top: 1px solid var(--mydev-color-border, #d6deea);
  text-align: center;
}
.mydev-workflow-comparison__category {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mydev-color-surface-muted, #eef1f6);
  color: var(--mydev-color-muted, #657086);
  font-size: .875rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.mydev-workflow-comparison__manual h4,
.mydev-workflow-comparison__connected h4 { margin: 10px 0 7px; font-size: 1.125rem; line-height: 1.35; font-weight: 500; }
.mydev-workflow-comparison__manual h4 { color: var(--mydev-color-muted, #657086); }
.mydev-workflow-comparison__connected { border-inline-start: 1px solid color-mix(in srgb, var(--mydev-color-accent, #ff6224) 14%, transparent); background: #fffaf6; }
.mydev-workflow-comparison__cell p { max-width: 45ch; margin: 0 auto; color: var(--mydev-color-muted, #657086); font-size: 1rem; line-height: 1.65; }
.mydev-workflow-comparison__check { margin-inline-end: 10px; color: #197653; font-style: normal; }
@media (max-width: 767px) {
  .mydev-workflow-comparison { inline-size: calc(100% - 32px); }
  .mydev-workflow-comparison__heading { grid-template-columns: 1fr 1fr; }
  .mydev-workflow-comparison__category-heading { display: none; }
  .mydev-workflow-comparison__row { grid-template-columns: 1fr 1fr; border-top: 5px solid var(--mydev-color-surface-muted, #edf0f5); }
  .mydev-workflow-comparison__category { grid-column: 1 / -1; min-block-size: auto; }
  .mydev-workflow-comparison__heading-cell,
  .mydev-workflow-comparison__cell { padding: 18px 14px; }
  .mydev-workflow-comparison__manual h4,
  .mydev-workflow-comparison__connected h4 { font-size: 1rem; }
  .mydev-workflow-comparison__cell p { font-size: .9375rem; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .mydev-workflow-comparison { inline-size: calc(100% - 48px); }
}
@media (prefers-reduced-motion: reduce) { .mydev-workflow-comparison * { transition: none !important; } }
