/* ---------- Botones del hero ---------- */
.hero__botones{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:26px;position:relative;z-index:1}
.btn--linea{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.85);padding:10px 22px;font-size:14px;text-transform:uppercase;letter-spacing:.5px}
.btn--linea:hover{background:#fff;color:#000;filter:none}
.btn--hero{padding:10px 26px;font-size:14px;text-transform:uppercase;letter-spacing:.5px;border:2px solid var(--amarillo)}
.btn--gris{background:#eceef1;color:#1a1a1a}
@media (max-width:520px){
  .hero__botones{flex-direction:column;align-items:stretch;max-width:280px;margin-inline:auto}
  .hero__botones .btn{justify-content:center}
}

/* ---------- Cotizador ---------- */
.cotizar{padding-block:70px 20px}
.cot{max-width:1040px;margin-inline:auto;background:#fff;border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.14);overflow:hidden;border:1px solid #e6e6e6}
.cot__head{background:#000 url(../img/bg-circuito-oscuro.webp) center/cover;color:#fff;padding:36px clamp(20px,5vw,52px) 0;text-align:center}
.cot__kicker{color:var(--amarillo);font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase}
.cot__head h2{font-size:clamp(24px,3vw,34px);font-weight:700;margin:4px 0 8px}
.cot__head>p{color:#d9d9d9;font-size:14px;max-width:560px;margin-inline:auto}
.cot__pasos{list-style:none;padding:0;margin:26px auto 0;display:flex;justify-content:space-between;max-width:620px}
.cot__pasos li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;color:#9a9a9a;font-weight:500;flex:1}
.cot__pasos span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;border:2px solid #555;font-weight:700;font-size:13px;transition:.25s}
.cot__pasos li.activo{color:#fff}
.cot__pasos li.activo span{background:var(--amarillo);border-color:var(--amarillo);color:#000}
.cot__pasos li.hecho span{background:#fff;border-color:#fff;color:#000}
.cot__barra{height:4px;background:#2a2a2a;margin:22px calc(-1 * clamp(20px,5vw,52px)) 0}
.cot__barra span{display:block;height:100%;width:25%;background:var(--amarillo);transition:width .35s}

.cot__form{padding:34px clamp(18px,5vw,52px) 30px}
.cot__paso{border:0;margin:0;padding:0;min-width:0}
.js .cot__paso{display:none}
.js .cot__paso.activo{display:block;animation:aparece .35s}
@keyframes aparece{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.cot legend{font-family:var(--f-body);font-weight:700;font-size:19px;color:#111;margin-bottom:16px;padding:0;display:block;width:100%}
.cot legend small{display:block;font-weight:400;font-size:13px;color:#777;margin-top:2px}
.cot legend.sub{font-size:15px;margin:26px 0 10px}
.cot b{color:var(--rojo);font-weight:700}

.opciones{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.op{position:relative;display:flex;flex-direction:column;gap:4px;border:2px solid #e2e2e2;border-radius:10px;padding:16px 14px 14px;cursor:pointer;transition:.2s;background:#fff}
.op:hover{border-color:#bdbdbd;transform:translateY(-2px)}
.op input{position:absolute;opacity:0;pointer-events:none}
.op__ico{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--azul);color:#fff;margin-bottom:6px}
.op__ico svg{width:22px;height:22px;fill:currentColor}
.op--verde .op__ico{background:var(--verde)}
.op--amarillo .op__ico{background:var(--amarillo);color:#000}
.op strong{font-size:14px;line-height:1.3;color:#111;padding-right:22px}
.op em{font-style:normal;font-size:12px;color:#777;line-height:1.4}
.op::after{content:"";position:absolute;top:12px;right:12px;width:20px;height:20px;border-radius:50%;border:2px solid #cfcfcf;transition:.2s}
.op.marcado{border-color:var(--amarillo);background:#fffbea;box-shadow:0 6px 16px rgba(255,199,0,.25)}
.op.marcado::after{background:var(--amarillo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat;border-color:var(--amarillo)}
.op.foco,.chips label.foco span{outline:3px solid #0a66c2;outline-offset:2px}

.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chips label{position:relative;cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;border:1.5px solid #d6d6d6;border-radius:40px;padding:7px 14px;font-size:13px;color:#333;transition:.15s;background:#fff}
.chips label:hover span{border-color:#999}
.chips input:checked+span{background:#111;border-color:#111;color:#fff}
.chips--radio input:checked+span{background:var(--amarillo);border-color:var(--amarillo);color:#000;font-weight:600}
.chips input:focus-visible+span{outline:3px solid #0a66c2;outline-offset:2px}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px 16px;margin-bottom:14px}
.campo{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#333}
.campo input,.campo select,.campo textarea{font:inherit;font-weight:400;font-size:15px;color:#111;background:#fafafa;border:1.5px solid #d9d9d9;border-radius:8px;padding:10px 12px;width:100%;transition:.15s}
.campo textarea{resize:vertical;min-height:110px}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--amarillo);background:#fff;box-shadow:0 0 0 3px rgba(255,199,0,.25)}
.campo.invalido input,.campo.invalido select{border-color:var(--rojo);background:#fff5f5}

.bloque{border:1px solid #ececec;border-left:4px solid var(--azul);border-radius:8px;padding:16px 18px 18px;margin:18px 0;background:#fcfcfc}
.bloque[data-servicio="seguridad"]{border-left-color:var(--verde)}
.bloque[data-servicio="electricidad"]{border-left-color:var(--amarillo)}
.bloque h3{font-size:15px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.bloque .grid{margin-bottom:0}
.punto{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--azul)}
.punto--verde{background:var(--verde)}
.punto--amarillo{background:var(--amarillo)}

.adjuntos{margin-top:22px}
.adjuntos__zona{position:relative;display:flex;align-items:center;gap:14px;border:2px dashed #cfcfcf;border-radius:10px;padding:18px;cursor:pointer;font-size:13px;color:#555;transition:.2s}
.adjuntos__zona:hover,.adjuntos__zona.encima{border-color:var(--amarillo);background:#fffbea}
.adjuntos__zona input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.adjuntos__zona svg{width:34px;height:34px;flex:none;fill:#888}
.adjuntos__zona strong{color:#111}
.adjuntos__lista{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:6px}
.adjuntos__lista:empty{display:none}
.adjuntos__lista li{display:flex;justify-content:space-between;gap:10px;font-size:13px;background:#f3f3f3;border-radius:6px;padding:7px 10px;word-break:break-all}
.adjuntos__lista button{border:0;background:none;color:var(--rojo);cursor:pointer;font-size:13px;flex:none}

.resumen{background:#f7f7f7;border-radius:10px;padding:16px 18px;margin:22px 0 16px;font-size:13px}
.resumen:empty{display:none}
.resumen h4{margin:0 0 8px;font-size:14px}
.resumen dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0}
.resumen dt{color:#777}
.resumen dd{margin:0;color:#111;font-weight:500}
.acepto{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#444;cursor:pointer}
.acepto input{margin-top:2px;width:18px;height:18px;accent-color:#111;flex:none}

.cot__error{color:var(--rojo);font-size:13px;font-weight:500;margin-top:8px}
.cot__nav{display:flex;align-items:center;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid #eee}
.cot__nav [data-accion="siguiente"],.cot__nav [data-accion="enviar"]{margin-left:auto;padding:12px 26px;font-size:14px}
.cot__estado{font-size:13px;color:#555;flex:1;text-align:center}
.cot__estado.error{color:var(--rojo)}
.btn[disabled]{opacity:.6;cursor:wait;transform:none}
.no-js .cot__nav [data-accion="siguiente"],.no-js .cot__nav [data-accion="atras"]{display:none}

.cot__ok{padding:50px clamp(20px,5vw,52px) 56px;text-align:center}
.cot__ok-ico{width:72px;height:72px;border-radius:50%;background:var(--verde);display:grid;place-items:center;margin:0 auto 16px}
.cot__ok-ico svg{width:40px;height:40px;fill:#fff}
.cot__ok h3{font-size:26px;margin-bottom:10px}
.cot__ok p{max-width:520px;margin:0 auto 22px;color:#444}
.cot__ref{color:#000;background:#fffbea;padding:2px 8px;border-radius:4px;white-space:nowrap}
.cot__ok-botones{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.contacto__card .btn--alt{margin-top:4px;padding:12px 26px;font-size:15px}

@media (max-width:600px){
  .cot__pasos li{font-size:10.5px}
  .cot__pasos span{width:28px;height:28px}
  .opciones{grid-template-columns:1fr 1fr}
  .op{padding:12px 10px}
  .op em{display:none}
  .op strong{font-size:13px}
  .grid{grid-template-columns:1fr}
  .cot__nav{flex-wrap:wrap}
  .cot__estado{order:3;flex-basis:100%}
  .resumen dl{grid-template-columns:1fr}
  .resumen dd{margin-bottom:6px}
}
