/* OWNER: Lane C (form and widgets). Linked by layouts/base.njk after hero.css,
   on every page. Two parts:
   1. The widget bridge: what the template's unchanged chat and Sienna files
      expect from the template's other stylesheets (clue.css and Bootstrap
      Icons), which this site does not load.
   2. The request form and its result pages. */

/* ═══ 1. Widget bridge ════════════════════════════════════════════════════ */

/* Chat colors: clue-ai.css reads --primary-color and --primary-color-dark,
   which tokens.css sets (Lane A). Nothing here. */

/* Chat icons. clue-ai.js draws <i class="bi bi-..."> icons from the Bootstrap
   Icons font, which this site does not load. Each icon the widget uses is the
   Bootstrap Icons 1.11.3 SVG (MIT, The Bootstrap Authors), drawn as a mask in
   the text color at the size of the surrounding text, as the font did. */
:is(#clue-ai-bubble, #clue-ai-panel) .bi {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: var(--bi-mask) center / contain no-repeat;
  mask: var(--bi-mask) center / contain no-repeat;
}
:is(#clue-ai-bubble, #clue-ai-panel) .bi-chat-dots-fill { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8c0 3.866-3.582 7-8 7a9 9 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7M5 8a1 1 0 1 0-2 0 1 1 0 0 0 2 0m4 0a1 1 0 1 0-2 0 1 1 0 0 0 2 0m3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-robot { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5M3 8.062C3 6.76 4.235 5.765 5.53 5.886a26.6 26.6 0 0 0 4.94 0C11.765 5.765 13 6.76 13 8.062v1.157a.93.93 0 0 1-.765.935c-.845.147-2.34.346-4.235.346s-3.39-.2-4.235-.346A.93.93 0 0 1 3 9.219zm4.542-.827a.25.25 0 0 0-.217.068l-.92.9a25 25 0 0 1-1.871-.183.25.25 0 0 0-.068.495c.55.076 1.232.149 2.02.193a.25.25 0 0 0 .189-.071l.754-.736.847 1.71a.25.25 0 0 0 .404.062l.932-.97a25 25 0 0 0 1.922-.188.25.25 0 0 0-.068-.495c-.538.074-1.207.145-1.98.189a.25.25 0 0 0-.166.076l-.754.785-.842-1.7a.25.25 0 0 0-.182-.135'/%3E%3Cpath d='M8.5 1.866a1 1 0 1 0-1 0V3h-2A4.5 4.5 0 0 0 1 7.5V8a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1v1a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-1a1 1 0 0 0 1-1V9a1 1 0 0 0-1-1v-.5A4.5 4.5 0 0 0 10.5 3h-2zM14 7.5V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V7.5A3.5 3.5 0 0 1 5.5 4h5A3.5 3.5 0 0 1 14 7.5'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-x-lg { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-send-fill { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M15.964.686a.5.5 0 0 0-.65-.65L.767 5.855H.766l-.452.18a.5.5 0 0 0-.082.887l.41.26.001.002 4.995 3.178 3.178 4.995.002.002.26.41a.5.5 0 0 0 .886-.083zm-1.833 1.89L6.637 10.07l-.215-.338a.5.5 0 0 0-.154-.154l-.338-.215 7.494-7.494 1.178-.471z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-arrow-right-circle { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8m15 0A8 8 0 1 1 0 8a8 8 0 0 1 16 0M4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-calendar-event { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M11 6.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5z'/%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-telephone-fill { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.885.511a1.745 1.745 0 0 1 2.61.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.68.68 0 0 0 .178.643l2.457 2.457a.68.68 0 0 0 .644.178l2.189-.547a1.75 1.75 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.6 18.6 0 0 1-7.01-4.42 18.6 18.6 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-chat-text-fill { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M16 8c0 3.866-3.582 7-8 7a9 9 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7M4.5 5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1zm0 2.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1zm0 2.5a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1z'/%3E%3C/svg%3E"); }
:is(#clue-ai-bubble, #clue-ai-panel) .bi-geo-alt-fill { --bi-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E%3C/svg%3E"); }

/* Sienna's launcher at three quarters of its size, as the template's clue.css
   sets it ("Make Sienna ADA button smaller"). Its colors are in sienna.css. */
.asw-menu-btn {
  transform: scale(0.75);
}

/* ═══ 2. Request form and result pages ════════════════════════════════════ */

.cd-form-page {
  /* The error color: 6.6:1 on white. Local to the form, not a site token. */
  --form-error: var(--cd-error);
  padding-block: var(--cd-section-y);
  background: linear-gradient(to bottom, var(--cd-surface-tint), var(--cd-surface) 28rem);
}

.cd-form-layout {
  display: grid;
  gap: var(--cd-space-6);
  align-items: start;
}

@media (min-width: 60em) {
  .cd-form-layout {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--cd-space-8);
  }
  .cd-form-lead {
    padding-top: var(--cd-space-6);
  }
}

.cd-form-title {
  font-size: var(--cd-text-h2);
}

.cd-form-intro {
  max-width: 32rem;
  color: var(--cd-ink-2);
  font-size: var(--cd-text-lg);
  line-height: var(--cd-leading-snug);
  text-wrap: pretty;
}

.cd-form {
  display: grid;
  gap: var(--cd-space-5);
  padding: var(--cd-space-6);
  background: var(--cd-card-bg);
  border: var(--cd-hairline);
  border-radius: var(--cd-radius-card);
  box-shadow: var(--cd-shadow-card);
}

.cd-form-note {
  margin: 0;
  color: var(--cd-muted);
  font-size: var(--cd-text-sm);
}

.cd-field {
  display: grid;
  gap: var(--cd-space-2);
}

.cd-label {
  font-weight: var(--cd-weight-semibold);
  line-height: var(--cd-leading-snug);
}

.cd-req {
  color: var(--cd-teal);
}

.cd-hint {
  margin: 0;
  color: var(--cd-muted);
  font-size: var(--cd-text-sm);
  line-height: var(--cd-leading-snug);
}

.cd-input {
  width: 100%;
  min-height: 2.75rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid var(--cd-line-strong);
  border-radius: var(--cd-radius-control);
  background: var(--cd-surface);
  color: var(--cd-ink);
  font: inherit;
  font-size: var(--cd-text-base);
  line-height: var(--cd-leading-snug);
  transition: border-color var(--cd-duration-fast) var(--cd-ease-out);
}

.cd-input:hover {
  border-color: var(--cd-ink-2);
}

.cd-input:focus-visible {
  border-color: var(--cd-teal);
}

.cd-textarea {
  min-height: 9rem;
  resize: vertical;
  line-height: var(--cd-leading-body);
}

.cd-input[aria-invalid="true"] {
  border-color: var(--form-error);
  box-shadow: inset 0 0 0 1px var(--form-error);
}

.cd-field-error {
  margin: 0;
  color: var(--form-error);
  font-size: var(--cd-text-sm);
  font-weight: var(--cd-weight-semibold);
  line-height: var(--cd-leading-snug);
}

.cd-field-error[hidden],
.cd-form-hp {
  display: none;
}

.cd-form-submit {
  justify-self: start;
  min-width: 12rem;
}

.cd-form-submit:disabled {
  cursor: progress;
  opacity: 0.75;
}

/* Phones: a tighter card and a full-width button. */
@media (max-width: 47.5em) {
  .cd-form {
    padding: var(--cd-space-5) var(--cd-space-4);
  }
  .cd-form-submit {
    justify-self: stretch;
  }
}

/* Result pages: /thanks/ and /fail/. */
.cd-result {
  padding-block: var(--cd-space-9);
}

.cd-result-inner {
  max-width: calc(var(--cd-measure) + 2 * var(--cd-gutter));
  text-align: center;
}

/* The result message sits in the same card as the form (Lane A, design pass
   item 5: radius, hairline, shadow). */
.cd-result-inner {
  padding-block: var(--cd-space-7);
  background: var(--cd-card-bg);
  border: var(--cd-hairline);
  border-radius: var(--cd-radius-card);
  box-shadow: var(--cd-shadow-card);
}
@media (max-width: 47.5em) {
  .cd-result-inner { width: auto; margin-inline: var(--cd-gutter); }
}

.cd-result .cd-form-intro {
  margin-inline: auto;
}

.cd-result-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--cd-space-3);
  margin: var(--cd-space-6) 0 0;
}