/* prospeccion.css — Prospección Conectada.
   Se carga DESPUÉS de /socios/partner.css y /servicios/landing.css, y solo añade lo que aquellas
   no cubren. Casi todo lo de esta página ya existe en landing.css: las secciones, el kicker, las
   tarjetas, la línea temporal (.dgm-time/.tstep, el quinto con .mine), la tabla de inversión, la
   comparación (.vs) y la tabla comparativa (.ptable.cmp), el panel de números (.stats), el
   acordeón, el formulario entero con su calendario y los reveals. El volcado monoespaciado de la
   ficha de CRM (.ficha) también vive en landing.css, compartido con oficina desde la tercera
   landing. Aquí queda solo lo que es propio de esta landing y de ninguna otra:

     · las dos superficies del héroe (fila de hoja de cálculo → ficha de oportunidad),
     · el embudo 24 → 16 → 10 y el panel de números,
     · los descartes: lo que NO llega, que es la mitad del argumento.

   Misma paleta: las variables las declara landing.css (--bronze, --surface, --stone…) y aquí no se
   redefine ninguna. */

/* ---------- héroe · la ficha de oportunidad ----------
   Debajo de la hoja de cálculo va el MISMO negocio como lead del CRM. Reutiliza .mk-panel, así que
   aquí solo está lo de dentro. */
.lead-head{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:14px; align-items:center}
.lead-ini{width:38px; height:38px; border-radius:50%; flex:none; display:flex; align-items:center;
  justify-content:center; border:1px solid var(--bronze-line); background:rgba(8,8,10,.62);
  font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:13px; letter-spacing:.06em;
  color:var(--bronze)}
.lead-name{margin:0; font-family:'Space Grotesk',sans-serif; font-weight:400;
  font-size:clamp(14px,1.3vw,17px); line-height:1.25; color:var(--ink)}
.lead-loc{margin:5px 0 0; font-family:'Inter',sans-serif; font-weight:300; font-size:11px;
  letter-spacing:.14em; color:var(--gray)}
/* La puntuación es el dato que esta página vende: va en bronce y con su propia caja, igual que
   .mk-key marca el dato que viaja en los mockups de la otra landing. */
.lead-score{flex:none; padding:5px 11px; border-radius:999px; border:1px solid var(--bronze-line);
  background:var(--bronze-soft); font-family:'Space Grotesk',sans-serif; font-weight:400;
  font-size:13px; color:var(--bronze); white-space:nowrap}
.lead-facts{list-style:none; margin:16px 0 0; padding:14px 0 0; border-top:1px solid var(--line-2)}
.lead-facts li{position:relative; padding-left:16px; font-family:'Inter',sans-serif; font-weight:300;
  font-size:14px; line-height:1.75; color:var(--stone)}
.lead-facts li::before{content:'·'; position:absolute; left:3px; color:var(--bronze)}
.lead-open{margin:16px 0 0; padding:13px 16px; border-left:2px solid var(--bronze);
  background:var(--bronze-soft); font-family:'Inter',sans-serif; font-weight:300; font-size:14px;
  line-height:1.6; color:var(--ink)}
/* La cuarta fila de la hoja de cálculo se corta a media celda: es lo que hace que se lea como un
   dato viejo e incompleto sin escribir «incompleto» en ningún sitio. */
.fade-out{opacity:.35}

/* ---------- 01 · la mañana que se va buscando ----------
   Quince pestañas abiertas y una cargando. Son barras, no capturas: pesan 0 KB y no envejecen. */
.tabs{display:flex; flex-wrap:wrap; gap:5px}
.tabs span{width:26px; height:7px; border-radius:2px; background:rgba(248,247,244,.14)}
/* la que carga es la única viva; con prefers-reduced-motion se queda quieta y en bronce */
.tabs .load{width:44px; background:linear-gradient(90deg,var(--bronze-line) 0 34%,rgba(176,141,87,.95) 46%,var(--bronze-line) 58% 100%);
  background-size:200% 100%; animation:flow 2.4s linear infinite}
.tally{margin:14px 0 0; font-family:'Space Grotesk',sans-serif; font-weight:400;
  font-size:clamp(15px,1.4vw,19px); line-height:1.3; color:var(--ink)}
.mk-cut-text{color:var(--gray)}
.call-dots{margin:0; font-family:'Space Grotesk',sans-serif; font-size:26px; line-height:1;
  letter-spacing:.2em; color:var(--gray)}
.call-line{margin:14px 0 0; font-family:'Inter',sans-serif; font-weight:300; font-size:15px;
  line-height:1.6; color:var(--gray); font-style:italic}

/* ---------- el embudo 24 → 16 → 10 ---------- */
.funnel{display:flex; align-items:center; justify-content:flex-start; gap:clamp(12px,2vw,24px);
  flex-wrap:wrap}
.fn-step{display:flex; align-items:baseline; gap:10px; padding:14px 20px; border-radius:8px;
  border:1px solid var(--surface-line); background:var(--surface-sheen),var(--surface);
  box-shadow:var(--surface-shadow),var(--surface-inset);
  font-family:'Inter',sans-serif; font-weight:300; font-size:14px; color:var(--gray); white-space:nowrap}
.fn-step b{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:clamp(24px,2.6vw,34px);
  line-height:1; color:var(--ink)}
.fn-step.win{border-color:var(--bronze-line);
  background:linear-gradient(var(--bronze-soft),var(--bronze-soft)),var(--surface-sheen),var(--surface)}
.fn-step.win b{color:var(--bronze)}
.fn-step.win{color:var(--stone)}
.fn-arrow{flex:none; width:clamp(20px,2.4vw,34px); height:1px; background:var(--bronze-line);
  position:relative}
.fn-arrow::after{content:''; position:absolute; right:0; top:-3px; width:6px; height:6px;
  border-right:1px solid var(--bronze); border-top:1px solid var(--bronze); transform:rotate(45deg)}
@media (max-width:600px){
  .funnel{flex-direction:column; align-items:stretch}
  .fn-step{justify-content:space-between}
  .fn-arrow{width:1px; height:18px; margin-left:22px}
  .fn-arrow::after{right:-3px; top:auto; bottom:0; transform:rotate(135deg)}
}

/* ---------- 06 · los descartes ----------
   Lo que NO llega, que es la mitad del argumento. Van como fichas tachadas para que se lean como
   lo que son, cosas que el sistema quitó de en medio. */
.drops{list-style:none; display:flex; flex-wrap:wrap; gap:9px; margin:14px 0 0; padding:0}
.drops li{border:1px dashed var(--line-2); border-radius:999px; padding:6px 14px;
  font-family:'Inter',sans-serif; font-weight:300; font-size:12px; letter-spacing:.04em;
  color:var(--gray)}

/* ---------- responsive ---------- */
@media (max-width:480px){
  .lead-head{grid-template-columns:auto minmax(0,1fr); row-gap:12px}
  .lead-score{grid-column:2; justify-self:start}
}