:root{
.card h3{font:700 18px Inter;margin:0 0 2px;color:var(--ink)}
.card small{color:var(--muted)}
.card .cta{padding:12px 16px}
.card .btn{width:100%}


.btn{border:0;border-radius:999px;padding:12px 18px;font:600 14px Inter;cursor:pointer;transition:.2s all}
.btn.primary{background:var(--brand);color:#fff}
.btn.ghost{background:#fff;border:1px solid #CBD5E1;color:var(--ink)}
.btn:disabled{opacity:.5;pointer-events:none}


/* Modal */
.cfg-modal{position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;padding:20px;z-index:1020}
.cfg-modal[aria-hidden="false"]{display:flex}
.cfg-dialog{background:#fff;width:min(980px,100%);max-height:92vh;border-radius:20px;box-shadow:0 20px 60px rgba(2,6,23,.25);display:flex;flex-direction:column;overflow:hidden}
.cfg-close{position:absolute;right:18px;top:12px;background:transparent;border:0;font-size:28px;line-height:1;cursor:pointer}


.cfg-header{display:flex;gap:18px;padding:14px 18px;border-bottom:1px solid #EEF2F7;background:linear-gradient(180deg,#fff, #fafafa)}
.cfg-header__car{display:flex;gap:12px;align-items:center}
.cfg-header__car img{width:84px;height:auto}
.cfg-progress{flex:1}
.cfg-progress__bar{height:8px;background:#EEF2F7;border-radius:999px;overflow:hidden;margin:8px 0}
.cfg-progress__bar span{display:block;height:100%;width:0;background:var(--ok);transition:width .25s}
.cfg-steps{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font:600 12px/1 Inter}
.cfg-steps .on{color:var(--ink)}


.cfg-content{padding:18px}
.option-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.option-card{border:1px solid #E5E7EB;border-radius:14px;padding:14px;cursor:pointer;background:#fff}
.option-card.active{outline:3px solid var(--ok)}
.option-card h4{margin:0 0 4px;font:700 16px Inter}
.option-card small{color:var(--muted)}


.cfg-footer{display:flex;gap:10px;justify-content:flex-end;padding:14px 18px;border-top:1px solid #EEF2F7}


/* Form lead */
.lead-form{display:grid;gap:12px;max-width:560px}
.input{display:flex;flex-direction:column;gap:6px}
.input label{font:600 13px Inter;color:var(--muted)}
.input input, .input select{border:1px solid #CBD5E1;border-radius:10px;padding:12px 12px;font:500 14px Inter}
.helper{font:12px Inter;color:var(--muted)}
.summary{background:#F9FAFB;border:1px dashed #E5E7EB;border-radius:14px;padding:12px}
.summary ul{margin:0;padding-left:18px}
.summary strong{color:var(--ink)}


/* Pills de filtros (combustible, trans, puertas) */
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.pill{border:1px dashed #CBD5E1;border-radius:12px;padding:8px 10px;background:#fff;font:600 12px Inter;color:#0f172a77}
.pill.on{border-style:solid;color:#0F172A}
/* layout básico del modal */
.cfg-modal[aria-hidden="true"] { display:none; }
.cfg-modal {
  position: fixed; inset: 0; background: rgba(0,0,0,.5);
  display: grid; place-items: center; z-index: 9999;
}
.cfg-dialog {
  width: min(1000px, 92vw);
  max-height: 90vh;
  background: #fff; border-radius: 18px; overflow: hidden;
  display: grid; grid-template-rows: auto auto auto 1fr auto;
}
.cfg-head { display:flex; justify-content:space-between; align-items:center; padding:16px 20px; }
.cfg-head .car { display:flex; gap:12px; align-items:center; }
#cfgCarThumb { width: 140px; height: auto; object-fit: contain; }
.cfg-progress { height: 6px; background: #eef2f7; margin: 0 20px; border-radius: 999px; overflow:hidden; }
.cfg-progress .bar { height:100%; background:#0b6; }
.cfg-steps { padding:10px 20px; color:#64748b; font-size:12px; display:flex; gap:8px; flex-wrap:wrap; }
.cfg-steps span.on { color:#0b6; font-weight:600; }
.cfg-content { padding: 18px 20px; overflow:auto; }
.option-list { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:12px; }
.option-card { border:1px solid #e5e7eb; border-radius:12px; padding:14px; cursor:pointer; text-align:center; }
.option-card.active { border-color:#0b6; box-shadow:0 0 0 2px #0b6 inset; }
.cfg-foot { display:flex; gap:10px; justify-content:flex-end; padding:12px 20px; border-top:1px solid #eef2f7; }
.btn { padding:10px 14px; border-radius:10px; border:1px solid #cbd5e1; background:#fff; cursor:pointer; }
.btn.primary { background:#0b6; color:#fff; border-color:#0b6; }
.cfg-close { background:transparent; border:0; font-size:20px; cursor:pointer; }
/* ===== CONFIGURADOR (Wizard) ===== */
.cfg-modal[aria-hidden="true"]{ display:none; }
.cfg-modal{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  display:grid; place-items:center; z-index:9999;
}
.cfg-dialog{
  width:min(1000px,92vw); max-height:90vh; overflow:hidden;
  background:#fff; border-radius:18px; box-shadow:0 20px 60px rgba(0,0,0,.25);
  display:grid; grid-template-rows:auto auto auto 1fr auto;
}

/* Header compacto */
.cfg-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px 8px 18px;}
.cfg-head .car{display:flex;gap:12px;align-items:center;}
/* ✅ imagen chica, no invasiva */
#cfgCarThumb{width:220px; max-width:38vw; height:auto; object-fit:contain; border-radius:12px;}

/* Títulos */
#cfgCarTitle{margin:0;font-size:18px;}
#cfgCarSubtitle{color:#64748b}

/* Progreso + migas */
.cfg-progress{height:6px;background:#eef2f7;margin:0 18px;border-radius:999px;overflow:hidden}
.cfg-progress .bar{height:100%;background:#16a34a;width:0%}
.cfg-steps{padding:8px 18px 0 18px;display:flex;gap:10px;flex-wrap:wrap;color:#64748b;font-size:12px}
.cfg-steps span.on{color:#16a34a;font-weight:700}

/* Contenido del paso */
.cfg-content{padding:16px 18px;overflow:auto}
.step-title{margin:0 0 10px;font-size:18px}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.pill{padding:4px 8px;border-radius:999px;border:1px solid #e5e7eb;font-size:12px;color:#475569;background:#f8fafc}
.pill.on{border-color:#16a34a;color:#065f46;background:#ecfdf5}

.option-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.option-card{border:1px solid #e5e7eb;border-radius:12px;padding:12px;text-align:center;cursor:pointer;transition:.15s}
.option-card:hover{transform:translateY(-1px)}
.option-card.active{border-color:#16a34a;box-shadow:0 0 0 2px #16a34a inset}

/* Footer */
.cfg-foot{display:flex;gap:10px;justify-content:flex-end;padding:12px 18px;border-top:1px solid #f1f5f9;background:#fff}
.btn{padding:10px 14px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;cursor:pointer}
.btn.primary{background:#16a34a;color:#fff;border-color:#16a34a}
.cfg-close{background:transparent;border:0;font-size:18px;cursor:pointer;color:#475569}/* ===== CONFIGURADOR (Wizard) ===== */
.cfg-modal[aria-hidden="true"]{ display:none; }
.cfg-modal{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  display:grid; place-items:center; z-index:9999;
}
.cfg-dialog{
  width:min(1000px,92vw); max-height:90vh; overflow:hidden;
  background:#fff; border-radius:18px; box-shadow:0 20px 60px rgba(0,0,0,.25);
  display:grid; grid-template-rows:auto auto auto 1fr auto;
}

/* Header compacto */
.cfg-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px 8px 18px;}
.cfg-head .car{display:flex;gap:12px;align-items:center;}
/* imagen chica, no invasiva */
#cfgCarThumb{width:220px; max-width:38vw; height:auto; object-fit:contain; border-radius:12px;}

#cfgCarTitle{margin:0;font-size:18px;}
#cfgCarSubtitle{color:#64748b}

/* Progreso + migas */
.cfg-progress{height:6px;background:#eef2f7;margin:0 18px;border-radius:999px;overflow:hidden}
.cfg-progress .bar{height:100%;background:#16a34a;width:0%}
.cfg-steps{padding:8px 18px 0 18px;display:flex;gap:10px;flex-wrap:wrap;color:#64748b;font-size:12px}
.cfg-steps span.on{color:#16a34a;font-weight:700}

/* Contenido del paso */
.cfg-content{padding:16px 18px;overflow:auto}
.step-title{margin:0 0 10px;font-size:18px}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.pill{padding:4px 8px;border-radius:999px;border:1px solid #e5e7eb;font-size:12px;color:#475569;background:#f8fafc}
.pill.on{border-color:#16a34a;color:#065f46;background:#ecfdf5}

.option-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.option-card{border:1px solid #e5e7eb;border-radius:12px;padding:12px;text-align:center;cursor:pointer;transition:.15s}
.option-card:hover{transform:translateY(-1px)}
.option-card.active{border-color:#16a34a;box-shadow:0 0 0 2px #16a34a inset}

/* Footer */
.cfg-foot{display:flex;gap:10px;justify-content:flex-end;padding:12px 18px;border-top:1px solid #f1f5f9;background:#fff}
.btn{padding:10px 14px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;cursor:pointer}
.btn.primary{background:#16a34a;color:#fff;border-color:#16a34a}
.cfg-close{background:transparent;border:0;font-size:18px;cursor:pointer;color:#475569}

/* Inputs del formulario final */
.lead-form .input{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.lead-form input{border:1px solid #d1d5db;border-radius:10px;padding:10px 12px;font-size:14px}
.lead-form .helper{color:#64748b;font-size:12px;margin-top:8px}

