/* Scoped to the quote form; the supplied site's other styles remain intact. */
#f {
  max-width: 640px;
  padding: 1.25rem;
  gap: 1rem;
  border: 1px solid rgba(242, 247, 236, .22);
  border-radius: .85rem;
  background: rgba(255, 255, 255, .035);
  scroll-margin-top: 6rem;
}

#f [hidden] { display: none !important; }
#f .quote-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }
#f .quote-progress span { height: 5px; border-radius: 99px; background: rgba(242, 247, 236, .23); }
#f .quote-progress span.on { background: var(--lime); }
#f .quote-caption { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
#f .quote-caption h3 { color: var(--lime); font-size: 1rem; }
#f .quote-caption span { font-size: .82rem; color: #DCE8D3; white-space: nowrap; }
#f .quote-step { min-width: 0; border: 0; margin: 0; padding: 0; }
#f .quote-step:not([hidden]) { animation: quote-step-in .24s ease-out both; }
#f .quote-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
#f label { display: grid; gap: .35rem; min-width: 0; align-content: start; font-weight: 600; font-size: .95rem; }
#f [data-quote-step="0"] label:first-child, #f #sqw, #f .quote-wide { grid-column: 1 / -1; }
#f small { font-weight: 400; font-size: .82rem; color: #DCE8D3; }
#f .quote-actions { display: flex; gap: .65rem; }
#f .quote-actions .btn { flex: 1; padding-inline: .75rem; }
#f .quote-actions .btn.o { flex: 0 1 40%; }
#f .quote-hint { margin: 0; font-size: .84rem; }
#f .quote-review { margin-top: 1rem; padding: .9rem; border: 1px solid rgba(242, 247, 236, .2); border-radius: .5rem; background: rgba(255, 255, 255, .04); }
#f .quote-review h4 { font: 600 1rem var(--d); color: var(--lime); margin: 0 0 .7rem; }
#f .quote-review dl { margin: 0; display: grid; gap: .6rem; }
#f .quote-review dt { font-size: .8rem; font-weight: 600; color: var(--lime); }
#f .quote-review dd { margin: .1rem 0 0; font-size: .9rem; overflow-wrap: anywhere; white-space: pre-wrap; }
#f .quote-review p { margin: .9rem 0 0; font-size: .82rem; }
#f .quote-sr { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@keyframes quote-step-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@media (max-width: 480px) {
  #f { padding: 1rem; }
  #f .quote-fields { grid-template-columns: 1fr; }
  #f .quote-caption { align-items: start; }
  #f .quote-caption h3 { line-height: 1.4; }
}
@media (prefers-reduced-motion: reduce) {
  #f .quote-step:not([hidden]) { animation: none; }
}