/* ============================================================
   forms.css — contact, quote, 404 pages only. Shared components
   in site.css, all values from tokens.css.
   ============================================================ */

/* quote page: nav highlights the Request a Quote button instead of a link */
.nav__quote[aria-current="page"] { background: color-mix(in srgb, var(--paper) 16%, transparent); }

/* ---------- contact ---------- */
.ct-block { display: grid; gap: var(--space-2); justify-items: start; margin-top: var(--space-3); }
.ct-tel {
  font-family: var(--font-display);
  font-size: clamp(2rem, 8vw, 3.6rem);
  line-height: 1.1;
  text-decoration: none;
  border-bottom: 5px solid var(--sun);
  padding-bottom: .08em;
  transition: color .18s ease;
}
.ct-tel:hover { color: var(--sun-deep); }
.ct-mail { font-weight: 600; font-size: 1.125rem; }
.ct-hours { color: var(--ink-dim); }
.ct-hours small { display: block; font-size: var(--small); }
.ct-towns { list-style: none; margin-top: var(--space-2); columns: 2; column-gap: var(--space-3); max-width: 760px; }
.ct-towns li { padding-block: .3rem; break-inside: avoid; }
.ct-area-wny { margin-top: var(--space-2); color: var(--ink-dim); }
.ct-form { max-width: 640px; margin-top: var(--space-3); }
@media (min-width: 800px) { .ct-towns { columns: 4; } }

/* ---------- quote ---------- */
.qt-lede { max-width: 56ch; font-size: 1.125rem; font-weight: 500; }
.qt-trust { list-style: none; display: grid; gap: var(--space-1); margin-block: var(--space-3); }
.qt-trust li { display: flex; align-items: baseline; gap: .6ch; font-weight: 600; }
.qt-trust li::before { content: "✓"; color: var(--sun-deep); font-weight: 700; }
.qt-form { max-width: 820px; }
.qt-note { color: var(--ink-dim); font-size: var(--small); max-width: 52ch; margin-bottom: var(--space-2); }
@media (min-width: 800px) {
  .qt-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--space-3); }
  .qt-grid .field--full { grid-column: 1 / -1; }
  .qt-trust { grid-template-columns: repeat(3, auto); justify-content: start; gap: var(--space-4); }
}

/* ---------- 404 ---------- */
.nf { padding-block: var(--space-5); }
.nf h1 { max-width: 14ch; }
.nf p { max-width: 46ch; }
.nf__btns { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }