.devis-wrap { max-width: 680px; margin: 0 auto; padding: 60px 24px; }
.devis-progress {
  display: flex; gap: 6px; margin-bottom: 40px;
}
.devis-progress__step {
  flex: 1; height: 4px; border-radius: 2px;
  background: var(--color-border); transition: background 0.3s;
}
.devis-progress__step--done { background: var(--color-accent); }
.devis-progress__step--active { background: var(--color-accent); opacity: 0.5; }

.devis-step { display: none; animation: fadeIn 0.25s ease; }
.devis-step--active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.devis-question { font-size: 1.375rem; font-weight: 700; margin-bottom: 8px; }
.devis-hint { font-size: 0.875rem; color: var(--color-text-light); margin-bottom: 28px; }

.devis-options { display: flex; flex-direction: column; gap: 12px; }
.devis-option {
  display: flex; align-items: center; gap: 14px;
  border: 1.5px solid var(--color-border); border-radius: var(--radius-lg);
  padding: 16px 20px; cursor: pointer; transition: border-color 0.2s, background 0.2s;
}
.devis-option:hover { border-color: var(--color-accent); background: rgba(76,175,121,0.04); }
.devis-option input[type="radio"], .devis-option input[type="checkbox"] { accent-color: var(--color-accent); width: 18px; height: 18px; flex-shrink: 0; }
.devis-option--selected { border-color: var(--color-accent); background: rgba(76,175,121,0.06); }
.devis-option__label { font-size: var(--font-size-base); font-weight: 500; }

.devis-nav { display: flex; justify-content: space-between; margin-top: 36px; gap: 12px; }
.btn--devis-back {
  border: 1.5px solid var(--color-border); color: var(--color-text-light);
  padding: 12px 24px; border-radius: var(--radius); font-size: var(--font-size-base);
  font-weight: 500; transition: border-color 0.2s;
}
.btn--devis-back:hover { border-color: var(--color-text-light); }
.btn--devis-next {
  background: var(--color-accent); color: white;
  padding: 12px 28px; border-radius: var(--radius); font-size: var(--font-size-base);
  font-weight: 600; transition: background 0.2s; margin-left: auto;
}
.btn--devis-next:hover { background: var(--color-accent-hover); }
.btn--devis-next:disabled { background: var(--color-border); cursor: not-allowed; }