/* ═══════════════════════════════════════════════════════════════
   PAPIROS — cotizadores y tienda
   ═══════════════════════════════════════════════════════════════ */

.cotizador{background:#fff;border:1px solid var(--linea);border-radius:6px;
  box-shadow:var(--sombra);overflow:hidden}
.cotizador .cab{background:var(--azul);color:#fff;padding:22px 28px}
.cotizador .cab h3{font-size:20px;font-weight:600;margin:0 0 4px}
.cotizador .cab p{margin:0;font-size:14px;color:#9AA4B5}
.cotizador .cuerpo{padding:28px}

.campo{margin-bottom:20px}
.campo label{display:block;font:600 13px var(--sans);color:var(--tinta);margin-bottom:8px}
.campo label .op{color:var(--tinta-media);font-weight:400}
.campo input,.campo select,.campo textarea{
  width:100%;padding:12px 14px;border:1px solid var(--linea);border-radius:var(--radio);
  font:400 15px var(--sans);background:#fff;color:var(--tinta);transition:border-color .16s}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--oro);box-shadow:0 0 0 3px rgba(216,164,59,.15)}
.campo-doble{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.campo .pista{font-size:12.5px;color:var(--tinta-media);margin-top:6px}

/* chips de opción (color portada, marcación) */
.chips-op{display:flex;flex-wrap:wrap;gap:8px}
.chip-op{padding:9px 15px;border:1px solid var(--linea);border-radius:99px;background:#fff;
  font:500 13.5px var(--sans);color:var(--tinta-media);cursor:pointer;transition:all .15s;user-select:none}
.chip-op:hover{border-color:var(--oro)}
.chip-op.sel{background:var(--azul);border-color:var(--azul);color:#fff}

/* switch — robusto: el riel es un span de tamaño fijo, la bolita va dentro */
.switch{display:inline-flex;align-items:center;gap:12px;cursor:pointer;user-select:none;font-size:15px}
.switch input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0}
.switch .via{display:inline-block;width:42px;height:24px;min-width:42px;background:var(--linea);
  border-radius:12px;position:relative;transition:background .2s;flex:none;vertical-align:middle}
.switch .bolita{position:absolute;top:2px;left:2px;width:20px;height:20px;background:#fff;
  border-radius:50%;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.switch input:checked + .via{background:var(--oro)}
.switch input:checked + .via .bolita{transform:translateX(18px)}
.switch.deshab{opacity:.45;cursor:not-allowed}
.switch.deshab input:checked + .via{background:var(--linea)}

/* resultado */
.resultado{background:var(--papel);border-top:1px solid var(--linea);padding:24px 28px}
.res-detalle{list-style:none;margin:0 0 18px;padding:0}
.res-detalle li{display:flex;justify-content:space-between;gap:16px;padding:7px 0;font-size:14px;color:var(--tinta-media);border-bottom:1px dashed var(--linea)}
.res-detalle li:last-child{border-bottom:0}
.res-detalle li b{color:var(--tinta)}
.res-total{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 4px;border-top:2px solid var(--azul)}
.res-total .lab{font-size:14px;color:var(--tinta-media)}
.res-total .val{font-size:28px;font-weight:700;color:var(--azul)}
.res-iva{font-size:12.5px;color:var(--tinta-media);text-align:right;margin:-2px 0 16px}
.res-acciones{display:flex;flex-wrap:wrap;gap:12px}
.res-vacio{color:var(--tinta-media);font-size:14.5px;text-align:center;padding:10px 0}
.res-error{background:#FDF2E9;color:var(--alerta);border:1px solid #F5C89B;border-radius:var(--radio);padding:12px 14px;font-size:14px;margin-bottom:16px}
.res-aviso{background:#EAF4EF;color:var(--exito);border:1px solid #A9D9C0;border-radius:var(--radio);padding:12px 14px;font-size:14px;margin-bottom:16px}

/* zona de carga */
.dropzona{border:2px dashed var(--linea);border-radius:var(--radio);padding:26px 20px;text-align:center;
  cursor:pointer;transition:border-color .16s,background .16s;background:#fff}
.dropzona:hover,.dropzona.arrastre{border-color:var(--oro);background:#FEFBF4}
.dropzona .ico{width:36px;height:36px;color:var(--oro);margin:0 auto 10px}
.dropzona b{display:block;color:var(--tinta);font-size:15px;margin-bottom:3px}
.dropzona small{color:var(--tinta-media);font-size:13px}
.dropzona.cargado{border-style:solid;border-color:var(--exito);background:#F3FAF6}
.archivo-nom{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--exito);font-weight:600;font-size:14.5px}

/* layout de página de servicio con cotizador */
.serv-hero{background:var(--azul);color:var(--plata);padding:60px 0}
.serv-hero h1{font-size:clamp(30px,4vw,44px);font-weight:700;color:#fff;margin:0 0 12px}
.serv-hero p{font-size:17.5px;color:#B9C2D0;max-width:60ch;margin:0}
.serv-hero .miga{font-size:13px;color:#8D97A8;margin:0 0 16px}
.serv-hero .miga a{color:#8D97A8}.serv-hero .miga a:hover{color:var(--oro-claro)}
.serv-grid{display:grid;grid-template-columns:1fr 420px;gap:44px;align-items:start}
.serv-cont h2{font-size:26px;font-weight:600;margin:0 0 16px;color:var(--tinta)}
.serv-cont p{color:var(--tinta-media);margin:0 0 18px}

/* pestañas de sub-servicios (impresión) */
.pestanas{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--linea);margin-bottom:28px}
.pestanas button{background:none;border:0;border-bottom:2px solid transparent;padding:11px 16px;
  font:600 14.5px var(--sans);color:var(--tinta-media);cursor:pointer;transition:color .15s,border-color .15s}
.pestanas button:hover{color:var(--azul)}
.pestanas button.activa{color:var(--azul);border-bottom-color:var(--oro)}
.panel-serv{display:none}.panel-serv.activo{display:block}

@media (max-width:920px){
  .serv-grid{grid-template-columns:1fr;gap:32px}
}
@media (max-width:560px){
  .campo-doble{grid-template-columns:1fr}
}