/* ==========================================================================
   Stage 1 (quote-based) components. Theme tokens only; no JavaScript.
   ========================================================================== */

.dv-s1-steps { display: grid; gap: 14px; margin: 24px 0 0; padding: 0; list-style: none; grid-template-columns: 1fr; counter-reset: none; }
@media (min-width: 640px) { .dv-s1-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .dv-s1-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.dv-s1-steps__item { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 20px; border: 1px solid var(--dv-line, #e4e4e4); border-radius: 16px; background: #fff; }
.dv-s1-steps__n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--dv-accent, #E30613); color: #fff; font-weight: 700; font-size: .9rem; }
.dv-s1-steps__t { font-weight: 700; font-size: 1.05rem; color: #161616; }
.dv-s1-steps__d { color: #3a3a3a; line-height: 1.55; font-size: .95rem; }

.dv-s1-specs { display: grid; gap: 0; margin: 0; border: 1px solid var(--dv-line, #e4e4e4); border-radius: 14px; overflow: hidden; background: #fff; }
.dv-s1-specs > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px; padding: 12px 16px; border-top: 1px solid var(--dv-line, #e4e4e4); }
.dv-s1-specs > div:first-child { border-top: 0; }
.dv-s1-specs dt { font-weight: 600; color: #161616; }
.dv-s1-specs dd { margin: 0; color: #3a3a3a; }
@media (max-width: 480px) { .dv-s1-specs > div { grid-template-columns: 1fr; gap: 2px; } }

/* Quote request and contact pages. */
.dv-s1-form-wrap { max-width: 900px; }
.dv-s1-aside { margin: 0 0 22px; padding: 16px 18px; border-left: 4px solid var(--dv-accent, #E30613); border-radius: 10px; background: #FFF6F6; color: #2b2b2b; line-height: 1.55; }
.dv-s1-aside p { margin: 0; }
.dv-s1-aside p + p { margin-top: 6px; }
.dv-s1-contact { display: grid; gap: 12px; margin: 0 0 28px; padding: 0; list-style: none; grid-template-columns: 1fr; }
@media (min-width: 640px) { .dv-s1-contact { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dv-s1-contact li { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border: 1px solid var(--dv-line, #e4e4e4); border-radius: 14px; background: #fff; min-width: 0; }
.dv-s1-contact__k { font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dv-accent, #E30613); }
.dv-s1-contact a { font-weight: 700; font-size: 1.1rem; color: #161616; overflow-wrap: anywhere; }
.dv-s1-contact a:hover { color: var(--dv-accent, #E30613); }

/* Help Centre topic grid. */
.dv-s1-help { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; grid-template-columns: 1fr; }
@media (min-width: 640px) { .dv-s1-help { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .dv-s1-help { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.dv-s1-help > li { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 22px; border: 1px solid var(--dv-line, #e4e4e4); border-radius: 16px; background: #fff; }
.dv-s1-help h3 { margin: 0; font-size: 1.15rem; line-height: 1.25; }
.dv-s1-help p { margin: 0; color: #3a3a3a; line-height: 1.55; }
.dv-s1-help ul { margin: 2px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.dv-s1-help ul a { font-weight: 600; color: #161616; text-decoration: underline; text-underline-offset: 3px; }
.dv-s1-help ul a:hover { color: var(--dv-accent, #E30613); }
.dv-s1-help > li.is-lead { border-left: 5px solid var(--dv-accent, #E30613); background: linear-gradient(135deg, #FFF4F4, #FFF); }

/* Buttons wrap on phones rather than overflow. */
@media (max-width: 640px) {
  .dv-s1-cta .dv-btn.dv-btn { width: 100%; justify-content: center; white-space: normal; text-align: center; }
}

/* Privacy acknowledgment on the quote forms. */
.dva-ack, .dve-ack { margin: 0 0 14px; }
.dv-ack { display: flex; align-items: flex-start; gap: 10px; font-size: .92rem; line-height: 1.5; color: #2b2b2b; cursor: pointer; }
.dv-ack input[type="checkbox"] { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--dv-accent, #E30613); }
.dv-ack a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.dv-ack input[aria-invalid="true"] { outline: 2px solid var(--dv-accent, #E30613); outline-offset: 2px; }
.dv-ack input:focus-visible { outline: 3px solid rgba(227,6,19,.35); outline-offset: 2px; }
.dv-forms-pending { max-width: 760px; }