/* Website Requests (/website-requests/): 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); }
  .wc-optional { color: #98989d; }
}

/* "(optional)" beside a set-up step's title */
.wc-optional { font-weight: 400; color: #6e6e73; font-size: .85em; }
/* More than a contact form (2026-11-04): the label above the headline, and a contact form's note beside the complete request */
.wc-kicker { margin: 0 0 4px; font-size: 15px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #d97757; }
.wc-versus { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; margin: 16px 0 12px; }
.wc-versus-side { margin: 0; }
.wc-versus-side figcaption { margin: 10px 0 0; font-size: 15px; line-height: 1.4; color: #3a3a3c; }
.wc-form { display: grid; grid-template-columns: max-content 1fr; margin: 0; padding: 4px 16px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .06); font-size: 15px; }
.wc-form dt, .wc-form dd { margin: 0; padding: 10px 0; border-top: .5px solid rgba(60, 60, 67, .18); }
.wc-form dt { padding-right: 16px; color: #6e6e73; }
.wc-form dd { font-weight: 600; }
.wc-form dt:first-of-type, .wc-form dt:first-of-type + dd { border-top: 0; }
.wc-tag { margin: 12px 0 0; padding: 0 0 0 4px; list-style: none; font-size: 15px; color: #6e6e73; }
.wc-tag li { margin: 0; padding: 3px 0 3px 18px; position: relative; }
.wc-tag li::before { content: '↻'; position: absolute; left: 0; color: #ff9500; }
.wc-desktop-break { display: inline; }
@media (max-width: 699px) { .wc-versus { grid-template-columns: minmax(0, 1fr); } .wc-desktop-break { display: none; } }
@media (prefers-color-scheme: dark) {
  .wc-form { background: #1c1c1e; box-shadow: 0 0 0 .5px rgba(255, 255, 255, .1); }
  .wc-form dt, .wc-form dd { border-top-color: rgba(255, 255, 255, .14); }
  .wc-form dt, .wc-tag { color: #a1a1a6; }
  .wc-versus-side figcaption { color: #d1d1d6; }
  .wc-kicker { color: #e8957a; }
}