/* ===== DUPIN INTELLIGENCE — cadena del ataque (in-chain-) =====
   Una lámina con filete en degradé y la grilla de puntos del sitio; cada paso es un anillo con un ícono de línea.
   Lo confirmado lleva anillo y conector azules; lo afirmado o sin verificar, anillo punteado, trama y conector cortado. */
.in-chain{position:relative;isolation:isolate;display:grid;gap:26px;margin:6px 0 2px;padding:26px clamp(18px,3vw,30px) 22px;
  background:radial-gradient(70% 120% at 100% 0%,rgba(47,107,255,.16),transparent 62%),linear-gradient(160deg,var(--glass),transparent 70%);
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.in-chain::before{content:"";position:absolute;inset:0;padding:1px;pointer-events:none;
  background:linear-gradient(120deg,var(--blue-hi),var(--hair-lo) 45%,var(--hair-lo));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.in-chain::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.6;
  background-image:radial-gradient(circle at center,var(--dot) 1px,transparent 1.4px);background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent)}

.in-chain-h{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 24px;margin:0}
.in-chain-k{grid-column:1;margin:0;display:flex;align-items:center;gap:12px;font:500 9.5px/1 var(--f-mono);letter-spacing:.24em;color:var(--eyebrow)}
.in-chain-k::before{content:"";width:30px;height:1px;background:linear-gradient(90deg,var(--blue),transparent)}
.in-chain-t{grid-column:1;margin:0;font:600 clamp(20px,2vw,26px)/1.1 var(--f-display);letter-spacing:-.02em;color:var(--white)}
.in-chain-t em{font-style:normal;background:linear-gradient(100deg,#a9c8ff 0%,#5a8dff 42%,#2a5cf0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.in-chain-leg{grid-column:2;grid-row:1/3;align-self:end;display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none;
  font:500 8.5px/1.4 var(--f-mono);letter-spacing:.16em;color:var(--mute);text-transform:uppercase}
.in-chain-leg li{display:inline-flex;align-items:center;gap:8px}
.in-chain-leg li::before{content:"";width:18px;height:0;border-top:1px solid var(--blue-hi)}
.in-chain-leg li.is-claim::before{border-top:1px dashed var(--mute)}

/* los pasos: en fila, con conectores entre anillos */
.in-chain-l{--ic:58px;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));margin:0;padding:0;list-style:none}
.in-chain-s{position:relative;display:grid;justify-items:center;align-content:start;gap:12px;padding:0 6px;text-align:center;min-width:0}
.in-chain-n{font:500 9px/1 var(--f-mono);letter-spacing:.14em;color:var(--mute)}
.in-chain-ic{position:relative;z-index:1;display:grid;place-items:center;width:var(--ic);height:var(--ic);border-radius:50%;color:var(--ice);
  background:radial-gradient(circle at 34% 28%,rgba(127,169,255,.32),rgba(47,107,255,.1) 58%,rgba(var(--veil),.9) 100%);
  box-shadow:inset 0 0 0 1px var(--blue-hi),0 0 0 5px rgba(47,107,255,.07),0 10px 26px -12px rgba(47,107,255,.85)}
.in-chain-svg{width:26px;height:26px;display:block}
.in-chain-logo{width:calc(var(--ic) * 1.45);height:calc(var(--ic) - 22px);object-fit:contain;display:block}
/* con logo, el anillo se vuelve píldora: los logos suelen ser apaisados */
.in-chain-ic:has(.in-chain-logo){width:calc(var(--ic) * 1.75);border-radius:calc(var(--ic) / 2)}
.in-chain-ic:has(.in-chain-logo){background:var(--white);box-shadow:inset 0 0 0 1px var(--blue-hi),0 0 0 5px rgba(47,107,255,.1),0 10px 26px -12px rgba(47,107,255,.85)}
.in-chain-tx{display:grid;gap:4px;min-width:0}
.in-chain-e{font:500 14px/1.25 var(--f-body);color:var(--white);overflow-wrap:anywhere}
.in-chain-d{font:400 12.5px/1.4 var(--f-body);color:var(--lede);overflow-wrap:anywhere}

/* lo afirmado o sin verificar: anillo punteado y trama, como la etiqueta de RECLAMO */
.in-chain-s.is-claim .in-chain-ic{color:var(--lede);box-shadow:none;outline:1px dashed var(--line-2);outline-offset:-1px;
  background:repeating-linear-gradient(135deg,transparent 0 5px,var(--hair-lo) 5px 6px),rgba(var(--veil),.75)}
.in-chain-s.is-claim .in-chain-e{color:var(--ice)}
.in-chain-s.is-claim .in-chain-ic:has(.in-chain-logo){background:var(--white)}   /* el logo siempre sobre claro */

/* conectores: del borde de un anillo al siguiente, con punta */
.in-chain-s:not(:last-child)::after{content:"";position:absolute;top:calc(9px + 12px + var(--ic) / 2);left:calc(50% + var(--ic) / 2 + 6px);
  right:calc(-50% + var(--ic) / 2 + 10px);height:1px;background:linear-gradient(90deg,var(--blue-hi),var(--blue))}
.in-chain-s:not(:last-child)::before{content:"";position:absolute;top:calc(9px + 12px + var(--ic) / 2 - 3px);right:calc(-50% + var(--ic) / 2 + 9px);
  width:6px;height:6px;border-top:1px solid var(--blue);border-right:1px solid var(--blue);transform:rotate(45deg)}
.in-chain-s:has(+ .is-claim)::after,.in-chain-s.is-claim:not(:last-child)::after{background:repeating-linear-gradient(90deg,var(--mute) 0 4px,transparent 4px 8px)}
.in-chain-s:has(+ .is-claim)::before,.in-chain-s.is-claim:not(:last-child)::before{border-color:var(--mute)}

.in-chain-f{margin:0;padding-top:14px;font:500 9px/1.6 var(--f-mono);letter-spacing:.12em;color:var(--mute);
  background:linear-gradient(90deg,var(--hair-lo),transparent 80%) top/100% 1px no-repeat}

/* celular: la cadena baja en vertical */
@media (max-width:759px){
  .in-chain-h{grid-template-columns:minmax(0,1fr)}
  .in-chain-leg{grid-column:1;grid-row:auto}
  .in-chain-l{--ic:50px;--col:calc(var(--ic) * 1.75);grid-template-columns:minmax(0,1fr);gap:0}
  .in-chain-s{grid-template-columns:var(--col) minmax(0,1fr);justify-items:start;align-items:center;column-gap:16px;row-gap:0;
    padding:0 0 22px;text-align:left}
  .in-chain-ic{justify-self:center}
  .in-chain-n{position:absolute;left:calc(var(--col) + 16px);top:-2px}
  .in-chain-tx{padding-top:12px}
  .in-chain-s:not(:last-child)::after{top:calc(var(--ic) + 4px);bottom:4px;left:calc(var(--col) / 2);right:auto;width:1px;height:auto;
    background:linear-gradient(180deg,var(--blue-hi),var(--blue))}
  .in-chain-s:not(:last-child)::before{top:auto;bottom:4px;right:auto;left:calc(var(--col) / 2 - 3px);transform:rotate(135deg)}
  .in-chain-s:has(+ .is-claim)::after,.in-chain-s.is-claim:not(:last-child)::after{background:repeating-linear-gradient(180deg,var(--mute) 0 4px,transparent 4px 8px)}
}