/* HVF Lead Capture — scoped under .hvf-wrap to avoid theme conflicts */

.hvf-wrap {
  --hvf-teal: #004B3F;
  --hvf-teal-dark: #003830;
  --hvf-teal-light: #E8F2EF;
  --hvf-teal-faint: #F4F9F7;
  --hvf-cream: #F7F3EC;
  --hvf-border: rgba(0, 75, 63, 0.15);
  --hvf-border-strong: rgba(0, 75, 63, 0.3);
  --hvf-text: #1a2e28;
  --hvf-text-muted: #6b7872;
  --hvf-required: #B5442E;
  --hvf-amber: #C89434;
  --hvf-amber-bg: #FBF4E4;

  font-family: "DM Sans", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  color: var(--hvf-text);
  line-height: 1.55;
  font-size: 15px;
  box-sizing: border-box;

  /* Centre the form and cap width per breakpoint */
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* 560px — tablet portrait: pull in slightly */
@media (min-width: 560px) {
  .hvf-wrap {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

/* 768px — tablet landscape: fixed comfortable width */
@media (min-width: 768px) {
  .hvf-wrap {
    max-width: 680px;
    padding-left: 0;
    padding-right: 0;
  }
}

/* 1024px — desktop: slightly wider but still contained */
@media (min-width: 1024px) {
  .hvf-wrap {
    max-width: 720px;
  }
}

/* 1280px+ — large desktop: cap at 760px, never stretches further */
@media (min-width: 1280px) {
  .hvf-wrap {
    max-width: 760px;
  }
}

.hvf-wrap *, .hvf-wrap *::before, .hvf-wrap *::after {
  box-sizing: inherit;
  -webkit-tap-highlight-color: transparent;
}

/* ── Progress bar ─────────────────────────────────────────────────────────── */

.hvf-progress {
  background: white;
  border-radius: 4px;
  padding: 1rem 1.25rem;
  border: 1px solid var(--hvf-border);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  overflow-x: auto;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.hvf-progress::-webkit-scrollbar { display: none; }

@media (min-width: 768px) {
  .hvf-progress { padding: 1.25rem 1.5rem; margin-bottom: 1.5rem; }
}

.hvf-step {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
@media (max-width: 560px) { .hvf-step { flex: 0 0 auto; } }

.hvf-step-circle {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--hvf-teal-light);
  color: var(--hvf-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 500;
  flex-shrink: 0;
}
.hvf-step.active .hvf-step-circle  { background: var(--hvf-teal); color: white; }
.hvf-step.complete .hvf-step-circle { background: var(--hvf-teal); color: white; }
.hvf-step.complete .hvf-step-circle::after { content: "✓"; font-size: 13px; }
.hvf-step.complete .hvf-step-circle span { display: none; }

.hvf-step-label {
  font-size: 12px;
  color: var(--hvf-text-muted);
  white-space: nowrap;
}
@media (max-width: 560px) {
  .hvf-step:not(.active) .hvf-step-label { display: none; }
  .hvf-step.active .hvf-step-label { font-size: 13px; }
}
.hvf-step.active .hvf-step-label  { color: var(--hvf-text); font-weight: 500; }
.hvf-step.complete .hvf-step-label { color: var(--hvf-text); }

.hvf-step-line {
  flex: 0.3;
  height: 1px;
  background: var(--hvf-border);
  margin: 0 4px;
  min-width: 16px;
}

/* ── Card ─────────────────────────────────────────────────────────────────── */

.hvf-card {
  background: white;
  border-radius: 4px;
  padding: 1.5rem 1.25rem;
  border: 1px solid var(--hvf-border);
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}
@media (min-width: 768px) { .hvf-card { padding: 2.5rem; } }

/* ── Step panels ─────────────────────────────────────────────────────────── */

.hvf-step-panel { display: none; }
.hvf-step-panel.active { display: block; }

.hvf-panel-title {
  font-size: 22px;
  font-weight: 400;
  margin: 0 0 0.5rem;
  color: var(--hvf-teal);
  letter-spacing: -0.3px;
}
@media (min-width: 768px) { .hvf-panel-title { font-size: 24px; } }

.hvf-panel-subtitle {
  font-size: 14px;
  color: var(--hvf-text-muted);
  margin: 0 0 1.5rem;
}
@media (min-width: 768px) { .hvf-panel-subtitle { font-size: 15px; margin-bottom: 2rem; } }

/* ── Field legend ────────────────────────────────────────────────────────── */

.hvf-field-legend {
  font-size: 12px;
  color: var(--hvf-text-muted);
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--hvf-border);
  line-height: 1.55;
}

/* ── Reassurance banner ──────────────────────────────────────────────────── */

.hvf-reassurance {
  background: var(--hvf-teal-faint);
  border-left: 3px solid var(--hvf-teal);
  padding: 12px 14px;
  border-radius: 0 4px 4px 0;
  font-size: 13px;
  color: var(--hvf-teal);
  margin-bottom: 1.5rem;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .hvf-reassurance { padding: 12px 16px; font-size: 14px; margin-bottom: 2rem; }
}

/* ── Fields ──────────────────────────────────────────────────────────────── */

.hvf-field { margin-bottom: 1.5rem; }
@media (min-width: 768px) { .hvf-field { margin-bottom: 1.75rem; } }
.hvf-field:last-child { margin-bottom: 0; }

.hvf-field-label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 10px;
  color: var(--hvf-text);
  line-height: 1.4;
}
@media (min-width: 768px) { .hvf-field-label { font-size: 15px; } }

/* Reset fieldset/legend to match label styling */
.hvf-wrap fieldset {
  border: none;
  margin: 0;
  padding: 0;
}
.hvf-wrap legend.hvf-field-label {
  display: block;
  width: 100%;
  margin-bottom: 10px;
}

.hvf-required { color: var(--hvf-required); margin-left: 2px; font-weight: 600; }
.hvf-optional  { color: var(--hvf-text-muted); font-weight: 400; font-size: 12px; margin-left: 6px; }
.hvf-req-dot   { color: var(--hvf-required); font-weight: 600; }

.hvf-field-hint {
  font-size: 12px;
  color: var(--hvf-text-muted);
  margin-top: 6px;
  line-height: 1.5;
}

.hvf-field-error {
  font-size: 12px;
  color: var(--hvf-required);
  margin-top: 5px;
  line-height: 1.4;
  min-height: 0;
}
.hvf-field-error:empty { display: none; }

.hvf-field-row { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 560px) { .hvf-field-row { grid-template-columns: 1fr 1fr; } }

/* ── Sliders ─────────────────────────────────────────────────────────────── */

.hvf-slider-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 8px;
}
.hvf-slider-value {
  font-size: 26px;
  font-weight: 300;
  color: var(--hvf-teal);
  letter-spacing: -0.5px;
}
@media (min-width: 768px) { .hvf-slider-value { font-size: 32px; } }

.hvf-slider-max {
  font-size: 12px;
  color: var(--hvf-text-muted);
  text-align: right;
}
@media (min-width: 768px) { .hvf-slider-max { font-size: 13px; } }

.hvf-wrap input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: var(--hvf-teal-light);
  border-radius: 999px;
  outline: none;
  cursor: pointer;
  display: block;
  margin: 10px 0;
}

/* Webkit track (Chrome, Safari, Edge) */
.hvf-wrap input[type="range"]::-webkit-slider-runnable-track {
  height: 6px;
  background: var(--hvf-teal-light);
  border-radius: 999px;
}

/* Firefox track */
.hvf-wrap input[type="range"]::-moz-range-track {
  height: 6px;
  background: var(--hvf-teal-light);
  border-radius: 999px;
  border: none;
}

.hvf-wrap input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--hvf-teal);
  cursor: pointer;
  border: 3px solid white;
  box-shadow: 0 0 0 1px var(--hvf-border-strong), 0 2px 6px rgba(0,0,0,0.1);
  margin-top: -10px;
}
.hvf-wrap input[type="range"]::-moz-range-thumb {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--hvf-teal);
  cursor: pointer;
  border: 3px solid white;
  box-shadow: 0 0 0 1px var(--hvf-border-strong), 0 2px 6px rgba(0,0,0,0.1);
}

.hvf-slider-bounds {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  font-size: 11px;
  color: var(--hvf-text-muted);
}

/* ── Chips ───────────────────────────────────────────────────────────────── */

.hvf-chips {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}
@media (max-width: 420px) { .hvf-chips { grid-template-columns: 1fr 1fr; } }

.hvf-chip {
  padding: 14px 12px;
  background: white;
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
  font-size: 13px;
  cursor: pointer;
  text-align: center;
  font-family: inherit;
  color: var(--hvf-text);
  transition: all 0.15s;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 768px) { .hvf-chip { font-size: 14px; padding: 13px 14px; } }
.hvf-chip:hover, .hvf-chip:active, .hvf-chip:focus-visible {
  border-color: var(--hvf-teal);
  background: var(--hvf-teal-faint);
  outline: none;
}
.hvf-chip.selected {
  background: var(--hvf-teal);
  border-color: var(--hvf-teal);
  color: white;
  font-weight: 500;
}

.hvf-chips-small { display: flex; flex-wrap: wrap; gap: 8px; }

.hvf-chip-small {
  min-width: 48px;
  padding: 12px 16px;
  background: white;
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
  color: var(--hvf-text);
  transition: all 0.15s;
  min-height: 44px;
}
.hvf-chip-small:hover, .hvf-chip-small:active, .hvf-chip-small:focus-visible {
  border-color: var(--hvf-teal);
  background: var(--hvf-teal-faint);
  outline: none;
}
.hvf-chip-small.selected {
  background: var(--hvf-teal);
  border-color: var(--hvf-teal);
  color: white;
  font-weight: 500;
}

/* Error state on chip groups */
.hvf-chip-group--error .hvf-chip,
.hvf-chip-group--error .hvf-chip-small {
  border-color: var(--hvf-required);
}

/* ── Text inputs ─────────────────────────────────────────────────────────── */

.hvf-wrap input[type="text"],
.hvf-wrap input[type="number"],
.hvf-wrap input[type="email"],
.hvf-wrap input[type="tel"],
.hvf-wrap input[type="date"],
.hvf-wrap select {
  width: 100%;
  padding: 14px;
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
  font-size: 16px;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
  background: white;
  color: var(--hvf-text);
  -webkit-appearance: none;
  appearance: none;
  min-height: 48px;
}
.hvf-wrap input:focus,
.hvf-wrap select:focus {
  border-color: var(--hvf-teal);
  box-shadow: 0 0 0 3px rgba(0, 75, 63, 0.08);
}
.hvf-wrap input::placeholder { color: #a8b5ae; }

.hvf-wrap input.hvf-input--error,
.hvf-wrap select.hvf-input--error {
  border-color: var(--hvf-required);
}

.hvf-wrap select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%236b7872' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}

/* ── Input prefix (£ symbol) ─────────────────────────────────────────────── */

.hvf-input-prefix { position: relative; }
.hvf-prefix-symbol {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 15px;
  color: var(--hvf-text-muted);
  pointer-events: none;
  user-select: none;
  z-index: 1;
}
/* Use !important to guarantee padding-left wins over the base input shorthand */
.hvf-wrap .hvf-input-prefix input { padding-left: 36px !important; }

/* ── Conditional block ───────────────────────────────────────────────────── */

.hvf-conditional {
  background: var(--hvf-teal-faint);
  border: 1px dashed var(--hvf-border-strong);
  border-radius: 4px;
  padding: 1.25rem 1rem;
  margin-top: 14px;
}
@media (min-width: 768px) { .hvf-conditional { padding: 1.25rem; } }

.hvf-conditional-label {
  font-size: 11px;
  color: var(--hvf-teal);
  font-weight: 600;
  margin-bottom: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* ── Expenses ────────────────────────────────────────────────────────────── */

.hvf-expense-rows {
  background: var(--hvf-teal-faint);
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
  padding: 4px;
}
.hvf-expense-row {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--hvf-border);
  gap: 8px;
}
@media (min-width: 560px) {
  .hvf-expense-row { grid-template-columns: 1fr 160px; gap: 12px; }
}
.hvf-expense-row:last-child { border-bottom: none; }
.hvf-expense-row label { font-size: 14px; color: var(--hvf-text); font-weight: 500; }
.hvf-expense-hint {
  display: block;
  font-size: 11px;
  color: var(--hvf-text-muted);
  margin-top: 2px;
  font-weight: 400;
}
.hvf-expense-row .hvf-input-prefix input {
  min-height: 44px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 15px;
}
.hvf-expense-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  background: var(--hvf-teal);
  color: white;
  border-radius: 0 0 4px 4px;
  font-size: 14px;
  margin-top: -1px;
}
.hvf-total-val {
  font-size: 20px;
  font-weight: 400;
  letter-spacing: -0.3px;
}

/* ── Secure note ─────────────────────────────────────────────────────────── */

.hvf-secure-note {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--hvf-amber-bg);
  border: 1px solid rgba(200, 148, 52, 0.3);
  padding: 14px 16px;
  border-radius: 4px;
  margin-bottom: 1.5rem;
  font-size: 13px;
  color: #6b5520;
  line-height: 1.5;
}
@media (min-width: 768px) { .hvf-secure-note { margin-bottom: 2rem; } }
.hvf-secure-note svg {
  width: 18px; height: 18px;
  flex-shrink: 0;
  margin-top: 1px;
  color: var(--hvf-amber);
}

/* ── Summary preview ─────────────────────────────────────────────────────── */

.hvf-summary-preview {
  background: var(--hvf-teal);
  color: white;
  border-radius: 4px;
  padding: 1.25rem;
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) { .hvf-summary-preview { padding: 1.25rem 1.5rem; margin-bottom: 2rem; } }

.hvf-summary-preview-title {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 10px;
  opacity: 0.8;
}
.hvf-summary-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 14px;
  gap: 12px;
}
.hvf-summary-row span:first-child { opacity: 0.85; }
.hvf-summary-row span:last-child { font-weight: 500; text-align: right; }

/* ── Consent ─────────────────────────────────────────────────────────────── */

.hvf-consent {
  margin-top: 1.5rem;
  padding: 1.25rem;
  background: var(--hvf-teal-faint);
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
}
.hvf-consent-item {
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
  font-size: 13px;
  color: var(--hvf-text);
  line-height: 1.55;
}
.hvf-consent-item:last-child { margin-bottom: 0; }
.hvf-consent-item input[type="checkbox"] {
  margin-top: 3px;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  accent-color: var(--hvf-teal);
  cursor: pointer;
}
.hvf-consent-item a { color: var(--hvf-teal); }

.hvf-consent-subheading {
  font-size: 11px;
  color: var(--hvf-text-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 10px;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--hvf-border);
}
.hvf-consent-group-title {
  font-size: 11px;
  color: var(--hvf-teal);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */

.hvf-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--hvf-border);
  gap: 10px;
}
@media (min-width: 768px) { .hvf-actions { margin-top: 2.5rem; padding-top: 1.5rem; } }
.hvf-actions--end { justify-content: flex-end; }

.hvf-btn {
  padding: 14px 20px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.15s;
  letter-spacing: 0.3px;
  min-height: 48px;
  flex: 1;
  position: relative;
}
@media (min-width: 560px) { .hvf-btn { padding: 14px 32px; flex: 0 1 auto; gap: 10px; } }

.hvf-btn--primary { background: var(--hvf-teal); color: white; }
.hvf-btn--primary:hover, .hvf-btn--primary:active { background: var(--hvf-teal-dark); }
.hvf-btn--primary:disabled { opacity: 0.65; cursor: not-allowed; }

.hvf-btn--secondary {
  background: white;
  color: var(--hvf-text);
  border: 1px solid var(--hvf-border-strong);
}
.hvf-btn--secondary:hover, .hvf-btn--secondary:active { background: var(--hvf-cream); }

/* ── Postcode / address ──────────────────────────────────────────────────── */

.hvf-postcode-row { display: flex; gap: 8px; flex-wrap: wrap; }
.hvf-postcode-row input { flex: 1; min-width: 0; }
@media (max-width: 420px) { .hvf-postcode-row { flex-direction: column; } }

.hvf-btn-search {
  padding: 14px 20px;
  background: var(--hvf-teal);
  color: white;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  min-height: 48px;
  transition: background 0.15s;
}
.hvf-btn-search:hover, .hvf-btn-search:active { background: var(--hvf-teal-dark); }
.hvf-btn-search:disabled { opacity: 0.65; cursor: not-allowed; }

.hvf-postcode-error {
  font-size: 12px;
  color: var(--hvf-required);
  margin-top: 6px;
}
.hvf-postcode-error:empty { display: none; }

.hvf-address-select-wrap { margin-top: 10px; }

.hvf-address-result {
  margin-top: 12px;
  padding: 14px 16px;
  background: var(--hvf-teal-faint);
  border-radius: 4px;
  font-size: 13px;
  border: 1px solid var(--hvf-border);
}

.hvf-manual-address {
  margin-top: 12px;
  padding: 12px;
  background: var(--hvf-teal-faint);
  border: 1px dashed var(--hvf-border-strong);
  border-radius: 4px;
}

.hvf-edit-manually {
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  color: var(--hvf-teal);
  cursor: pointer;
  text-decoration: underline;
  background: none;
  border: none;
  padding: 0;
  font-family: inherit;
}

/* ── Industry searchable dropdown ────────────────────────────────────────── */

.hvf-searchable { position: relative; }

.hvf-searchable-list {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 240px;
  overflow-y: auto;
  background: white;
  border: 1px solid var(--hvf-border);
  border-radius: 4px;
  margin-top: 4px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  z-index: 100;
  -webkit-overflow-scrolling: touch;
}
.hvf-searchable-list[hidden] { display: none; }

.hvf-searchable-item {
  padding: 12px 14px;
  font-size: 14px;
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
}
.hvf-searchable-item:hover,
.hvf-searchable-item.focused { background: var(--hvf-teal-faint); }
.hvf-searchable-item[aria-selected="true"] {
  background: var(--hvf-teal);
  color: white;
}

/* ── Section divider ─────────────────────────────────────────────────────── */

.hvf-section-divider {
  font-size: 11px;
  color: var(--hvf-teal);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding-top: 1.25rem;
  margin-top: 0.5rem;
  margin-bottom: 1.25rem;
  border-top: 1px solid var(--hvf-border);
}
.hvf-section-divider:first-child {
  padding-top: 0; margin-top: 0; border-top: none;
}

/* ── Submit spinner ──────────────────────────────────────────────────────── */

/* Ensure [hidden] always wins over any display rule inside the form */
.hvf-wrap [hidden] { display: none !important; }

.hvf-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: white;
  border-radius: 50%;
  animation: hvf-spin 0.7s linear infinite;
  display: inline-block;
}
@keyframes hvf-spin { to { transform: rotate(360deg); } }

/* ── Submit error ────────────────────────────────────────────────────────── */

.hvf-submit-error {
  margin-top: 1rem;
  padding: 12px 14px;
  background: #FEF2F2;
  border: 1px solid #FECACA;
  border-radius: 4px;
  font-size: 13px;
  color: #B5442E;
  line-height: 1.5;
}

/* ── Success panel ───────────────────────────────────────────────────────── */

.hvf-success-panel { text-align: center; padding: 1.5rem 0.5rem; }
@media (min-width: 768px) { .hvf-success-panel { padding: 2rem 1rem; } }

.hvf-success-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--hvf-teal-light);
  color: var(--hvf-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
}
@media (min-width: 768px) { .hvf-success-icon { width: 72px; height: 72px; } }

.hvf-success-title {
  font-size: 24px;
  font-weight: 400;
  color: var(--hvf-teal);
  margin: 0 0 0.75rem;
  letter-spacing: -0.3px;
}
@media (min-width: 768px) { .hvf-success-title { font-size: 28px; } }

.hvf-success-subtitle {
  font-size: 14px;
  color: var(--hvf-text-muted);
  margin: 0 auto 2rem;
  max-width: 440px;
  line-height: 1.6;
}
@media (min-width: 768px) { .hvf-success-subtitle { font-size: 15px; } }