/* Formulario simplificado: Paso 1 en la web y Paso 2 por contacto telefónico. */
.quote-form--single-step {
  width: 100%;
  max-width: 720px;
  margin-inline: auto;
}
.quote-form--single-step .form-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 0.9rem;
}
.quote-form--single-step .form-actions--single {
  display: block;
}
.quote-form--single-step .form-actions--single .button {
  width: 100%;
}
.js .quote-form--single-step .form-field[data-floating-field] {
  position: relative;
  display: grid;
  gap: 0.35rem;
  padding-top: 0;
}
.js .quote-form--single-step .form-field[data-floating-field] > .form-label {
  position: absolute;
  top: 25px;
  left: 46px;
  z-index: 2;
  max-width: calc(100% - 60px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  color: #607083;
  background: transparent;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  transform: translateY(-50%);
  transition: top 160ms ease, color 160ms ease, background-color 160ms ease, font-size 160ms ease, padding 160ms ease;
}
.js .quote-form--single-step .form-field[data-floating-field] > .form-control {
  min-height: 52px;
  padding: 0.86rem 0.9rem 0.72rem 2.8rem;
}
.js .quote-form--single-step .form-field[data-floating-field] > .form-control::placeholder {
  color: transparent;
  opacity: 0;
  transition: color 160ms ease, opacity 160ms ease;
}
.js .quote-form--single-step .form-field[data-floating-field]:focus-within > .form-label,
.js .quote-form--single-step .form-field[data-floating-field].has-value > .form-label {
  top: 0;
  padding-inline: 0.38rem;
  color: #104a9a;
  background: #fff;
  font-size: 0.7rem;
}
.js .quote-form--single-step .form-field[data-floating-field]:focus-within > .form-control::placeholder {
  color: #8a94a3;
  opacity: 1;
}
.js .quote-form--single-step .form-field[data-floating-field].has-error > .form-label {
  color: var(--error-700, #b42318);
}

/* El campo combinado reemplaza los antiguos campos de edad y cargas. */
#age-dependents.form-control {
  --field-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238b95a7' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21a4 4 0 0 0-8 0'/%3E%3Ccircle cx='12' cy='11' r='3'/%3E%3Cpath d='M22 21a4 4 0 0 0-4-4'/%3E%3Ccircle cx='18' cy='11' r='3'/%3E%3C/svg%3E");
}

.quote-form--single-step .form-progress {
  margin-bottom: 1rem;
}
.quote-form--single-step .form-privacy-note {
  margin-top: 0.85rem;
}
@media (max-width: 680px) {
  .js .quote-form--single-step .form-field[data-floating-field] > .form-label {
    top: 25px;
    left: 43px;
    max-width: calc(100% - 56px);
    font-size: 0.84rem;
  }
  .js .quote-form--single-step .form-field[data-floating-field] > .form-control {
    padding-left: 2.65rem;
  }
  .js .quote-form--single-step .form-field[data-floating-field]:focus-within > .form-label,
  .js .quote-form--single-step .form-field[data-floating-field].has-value > .form-label {
    top: 0;
    font-size: 0.69rem;
  }
}

/* La hoja visual global fuerza dos columnas desde 681 px; esta versión debe permanecer en una sola fila por campo. */
.quote-section .quote-form--single-step .form-grid,
.quote-section .quote-layout--compact .quote-form--single-step .form-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}
.quote-section .quote-form--single-step .form-field,
.quote-section .quote-form--single-step .form-field--full {
  grid-column: 1 / -1 !important;
}