/* Website Chat (/website-chat/): Taskriz on a business's own website — a hero with the chat, numbered steps, two cards. */
.wc-hero { display: grid; grid-template-columns: 1fr auto; gap: 32px; align-items: center; margin: 0 0 16px; }
.wc-lede { font-size: 19px; line-height: 1.5; color: #3a3a3c; margin: 8px 0 20px; }
.wc-ctas { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.wc-button { display: inline-block; padding: 11px 20px; border-radius: 980px; background: #007aff; color: #fff; font-weight: 600; text-decoration: none; }
.wc-button:hover { background: #0066d6; }
.wc-link { font-weight: 600; }
.wc-shot { width: 260px; height: auto; border-radius: 28px; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 18px 50px rgba(0, 0, 0, .16); }
.wc-steps { padding-left: 22px; }
.wc-steps > li { margin: 0 0 20px; }
.wc-steps > li > h3 { margin: 0 0 6px; }
.wc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin: 12px 0 0; }
.wc-card { padding: 16px 18px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .06); }
.wc-card h4 { margin: 0 0 6px; font-size: 17px; }
.wc-card p { margin: 0; }
.wc-faq dt { font-weight: 600; margin: 16px 0 4px; }
.wc-faq dd { margin: 0; }
@media (max-width: 720px) {
  .wc-hero { grid-template-columns: 1fr; }
  .wc-shot { width: 220px; justify-self: center; }
}
@media (prefers-color-scheme: dark) {
  .wc-lede { color: #d1d1d6; }
  .wc-card { background: #1c1c1e; box-shadow: 0 0 0 .5px rgba(255, 255, 255, .14); }
}