/* DiFlavour · Tu Fórmula a Medida — design system (crema / tinta / oro) */
:root{
  --crema:#f4efe6; --crema-2:#ece4d6; --tinta:#1c1a17; --tinta-2:#2b2823;
  --oro:#b8860b; --oro-claro:#d4af37; --linea:#d9cfbc; --suave:#857a66;
  --rojo:#c0392b; --ambar:#d68910; --verde:#2e8b57; --azul:#2c6e8f;
  --sombra:0 2px 8px rgba(28,26,23,.08); --sombra-2:0 8px 30px rgba(28,26,23,.18);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--crema);color:var(--tinta);line-height:1.55;padding:0 0 80px}
.wrap{max-width:680px;margin:0 auto;padding:0 18px}
.wrap.ancho{max-width:1180px}

/* Header */
header.top{background:var(--tinta);color:var(--crema);padding:26px 0 22px;border-bottom:3px solid var(--oro);margin-bottom:8px}
header.top .eyebrow{color:var(--oro-claro);letter-spacing:.22em;font-size:11px;font-weight:700;text-transform:uppercase}
header.top h1{font-size:26px;font-weight:800;margin:6px 0 4px;letter-spacing:-.01em}
header.top p{color:#cabfa8;font-size:14px}

/* Progreso */
.progreso{position:sticky;top:0;z-index:20;background:var(--crema);border-bottom:1px solid var(--linea);padding:12px 0}
.progreso .barra{height:7px;background:var(--crema-2);border-radius:99px;overflow:hidden}
.progreso .relleno{height:100%;background:linear-gradient(90deg,var(--oro),var(--oro-claro));width:0;transition:width .35s}
.progreso .txt{font-size:12px;color:var(--suave);margin-top:7px;font-weight:600;text-transform:uppercase;letter-spacing:.08em}

/* Pasos / tarjetas */
.paso{background:#fff;border:1px solid var(--linea);border-radius:14px;padding:24px 22px;box-shadow:var(--sombra);margin-top:18px}
.paso h2{font-size:20px;font-weight:800;margin-bottom:4px}
.paso .intro{font-size:14.5px;color:var(--suave);margin-bottom:18px}

/* Campos */
.campo{margin-bottom:18px}
.campo > label{display:block;font-size:14.5px;font-weight:700;margin-bottom:6px}
.campo .ayuda{font-size:13px;color:var(--suave);margin:-2px 0 8px;line-height:1.45}
.campo .req{color:var(--oro);font-weight:800}
input[type=text],input[type=email],input[type=tel],input[type=number],textarea,select{
  width:100%;font-size:16px;font-family:inherit;color:var(--tinta);background:var(--crema);
  border:1.5px solid var(--linea);border-radius:10px;padding:12px 13px;transition:.14s}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--oro);background:#fff;box-shadow:0 0 0 3px rgba(184,134,11,.12)}
textarea{min-height:92px;resize:vertical}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23857a66' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:34px}

/* Opciones tipo chip (multi/single) */
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.opciones .opt{border:1.5px solid var(--linea);background:var(--crema);border-radius:10px;padding:10px 14px;font-size:14px;font-weight:600;cursor:pointer;transition:.12s;user-select:none}
.opciones .opt:hover{border-color:var(--oro-claro)}
.opciones .opt.sel{background:var(--tinta);color:var(--crema);border-color:var(--tinta)}
.opciones.compact .opt{padding:8px 12px;font-size:13px}

/* Foto */
.foto{border:1.5px dashed var(--linea);border-radius:12px;padding:18px;text-align:center;cursor:pointer;background:var(--crema);transition:.14s}
.foto:hover{border-color:var(--oro);background:#fff}
.foto .icono{font-size:30px}
.foto .label{font-size:14px;font-weight:700;margin-top:4px}
.foto .sub{font-size:12.5px;color:var(--suave);margin-top:2px}
.foto input{display:none}
.foto-preview{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.foto-preview .th{position:relative;width:84px;height:84px;border-radius:10px;overflow:hidden;border:1px solid var(--linea)}
.foto-preview .th img{width:100%;height:100%;object-fit:cover}
.foto-preview .th button{position:absolute;top:3px;right:3px;width:20px;height:20px;border:none;border-radius:50%;background:rgba(28,26,23,.8);color:#fff;cursor:pointer;font-size:12px;line-height:1}

/* Pizzas repetible */
.pizza-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:var(--crema);border:1px solid var(--linea);border-radius:10px;padding:12px;margin-top:8px}
.pizza-row .tit{grid-column:1/-1;font-weight:700;font-size:14px}

/* Panel autocalc */
.calc{background:var(--tinta-2);color:var(--crema);border-left:4px solid var(--oro);border-radius:12px;padding:14px 16px;margin-top:6px}
.calc .l{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:#cabfa8}
.calc .v{font-size:26px;font-weight:800;color:var(--oro-claro)}
.calc table{width:100%;border-collapse:collapse;margin-top:8px;font-size:13.5px}
.calc td{padding:3px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.calc td:last-child{text-align:right;font-weight:700;color:var(--oro-claro)}

/* Navegación */
.nav{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.btn{border:none;border-radius:11px;padding:13px 22px;font-size:15px;font-weight:800;cursor:pointer;transition:.14s;display:inline-flex;gap:8px;align-items:center;justify-content:center}
.btn-oro{background:var(--oro);color:#fff} .btn-oro:hover{background:#9c7209}
.btn-oro:disabled{opacity:.55;cursor:wait}
.btn-ghost{background:transparent;color:var(--suave);border:1.5px solid var(--linea)}
.btn-ghost:hover{border-color:var(--suave)}
.btn-full{width:100%}

.error{color:var(--rojo);font-size:13px;margin-top:6px;font-weight:600}
.aviso{background:#fff6e9;border:1px solid #efd9a8;border-left:5px solid var(--ambar);border-radius:10px;padding:12px 16px;font-size:13.5px;margin-top:14px}

/* Vista "Tu Fórmula" / éxito */
.exito{text-align:center;padding:30px 10px}
.exito .check{width:74px;height:74px;border-radius:50%;background:var(--verde);color:#fff;font-size:40px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.exito h2{font-size:24px;font-weight:800}
.exito p{color:var(--suave);max-width:480px;margin:8px auto 0}
.resumen dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--suave);font-weight:700;margin-top:14px}
.resumen dd{font-size:15px;margin-top:2px}
.link-box{background:var(--crema);border:1.5px dashed var(--oro);border-radius:10px;padding:12px;display:flex;gap:8px;align-items:center;margin-top:16px}
.link-box input{font-size:13px;border:none;background:transparent}

/* Admin */
.adm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.adm-card{background:#fff;border:1px solid var(--linea);border-radius:12px;padding:16px 18px;box-shadow:var(--sombra);cursor:pointer;transition:.14s}
.adm-card:hover{box-shadow:var(--sombra-2);transform:translateY(-2px)}
.adm-card h3{font-size:16px;font-weight:800}
.adm-card .meta{font-size:12.5px;color:var(--suave);margin-top:3px}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:6px;text-transform:uppercase;letter-spacing:.05em}
.badge.recibida{background:#eaf3f7;color:var(--azul)}
.badge.en_estudio{background:#fff6e9;color:var(--ambar)}
.badge.cotizada{background:#e9f5ee;color:var(--verde)}
table.tabla{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
table.tabla th,table.tabla td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--linea)}
table.tabla th{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--suave)}
table.tabla td:last-child,table.tabla th:last-child{text-align:right;font-weight:700}
.precio-arg{background:var(--crema);border-left:4px solid var(--oro);border-radius:8px;padding:11px 14px;margin-top:9px;font-size:14px}
.precio-arg .pal{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--oro);display:block;margin-bottom:3px}
.seccion-tit{font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--suave);margin:26px 0 10px;padding-bottom:7px;border-bottom:1px solid var(--linea)}

@media(max-width:560px){
  header.top h1{font-size:22px}
  .paso{padding:20px 16px}
  .nav .btn{padding:13px 16px}
}