/* INFORME · Chalecos de cartón: papel kraft, máquina de escribir, sello RESERVADO, esquema de capas balísticas */
.fmt--informe { --bg: #E7DCC5; --bg-2: #DDD0B4; --fg: #1F1B14; --mute: #6C614B; --acc: #B3121C; --acc-2: #3D5A3A; --line-x: rgba(31,27,20,.18);
  --f-display: 'Special Elite', 'Courier New', monospace; --f-body: 'Barlow', system-ui, sans-serif; --f-mono: 'Special Elite', 'Courier New', monospace; --f-label: 'Barlow', system-ui, sans-serif; }
.fmt--informe .ftext { font-size: clamp(16.5px, 1.2vw, 18.5px); line-height: 1.6; font-weight: 400; }
.fmt--informe .htitle, .fmt--informe .cap__title, .fmt--informe .fmod__head h2 { font-weight: 400; letter-spacing: 0; text-transform: uppercase; }
.fmt--informe .htitle em, .fmt--informe .cap__title em { font-style: normal; color: var(--acc); }
.hero--informe { padding: 90px 0 40px; background: var(--bg); }
.portada-doc { position: relative; background: #F3EBD8; border: 1px solid var(--line-x); padding: clamp(28px, 4vw, 56px); box-shadow: 0 30px 60px -40px rgba(31,27,20,.6); }
.portada-doc::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--line-x); pointer-events: none; }
.portada-doc .sello { position: absolute; right: clamp(24px, 6vw, 80px); top: clamp(24px, 5vw, 60px); font-size: 22px; padding: 10px 18px; z-index: 2; }
@media (max-width: 760px) { .portada-doc .sello { position: static; display: inline-block; font-size: 14px; margin-bottom: 20px; transform: rotate(-3deg); } .portada-doc__campos { grid-template-columns: 1fr; gap: 2px; } .portada-doc__campos span { margin-top: 8px; } }
.sello--rojo { color: var(--acc); border-color: var(--acc); }
.portada-doc__campos { display: grid; grid-template-columns: max-content 1fr; gap: 8px 22px; font-size: 13px; margin-bottom: 40px; max-width: 520px; }
.portada-doc__campos span { color: var(--mute); text-transform: uppercase; letter-spacing: .1em; font-size: 11px; }
.portada-doc__campos b { font-weight: 400; border-bottom: 1px dotted var(--fg); }
.hero--informe .htitle { font-size: clamp(44px, 7.5vw, 110px); line-height: .95; }
.hero--informe .hstats { margin-top: 36px; }
.hero--informe .hstats b { font-family: var(--f-mono); font-size: clamp(20px, 2.4vw, 32px); }
.fmt--informe .fnav a { font-family: var(--f-mono); text-transform: uppercase; font-size: 12px; }
.fmt--informe .fnav a b { background: var(--fg); color: var(--bg); padding: 2px 6px; }
.fmt--informe .cap__num { font-family: var(--f-mono); background: var(--fg); color: var(--bg); padding: 4px 8px; }
.fmt--informe .cap__title { font-size: clamp(30px, 4vw, 54px); }
.fmt--informe .estado, .fmt--informe .fper, .fmt--informe .hito { background: #F3EBD8; }
.contrato { font-family: var(--f-body); }
.contrato th { font-family: var(--f-mono); }
.contrato .barra { position: relative; min-width: 220px; }
.contrato .barra i { display: block; height: 12px; width: var(--w); background: var(--acc-2); transition: width 1.2s var(--ease-out); }
.contrato .barra span { display: block; font-size: 12.5px; margin-top: 4px; }
.contrato tfoot td { font-family: var(--f-mono); border-top: 2px solid var(--fg); font-size: 15px; }
.contrato tfoot tr:last-child td { color: var(--acc); }
.chaleco { display: grid; gap: 32px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .chaleco { grid-template-columns: 340px 1fr; } }
.chaleco__capas { position: relative; display: grid; grid-template-columns: repeat(20, 1fr); gap: 2px; height: 220px; padding: 24px 0 60px; align-items: stretch; }
.chaleco__capas i { display: block; background: #3D5A3A; opacity: .25; transform: scaleY(.2); transform-origin: bottom; transition: transform .6s var(--ease-out), opacity .6s; transition-delay: calc(var(--i) * 45ms); }
.chaleco.in .chaleco__capas i { transform: none; opacity: 1; }
.chaleco__capas i:nth-child(-n+2) { background: var(--acc-2); }
.chaleco__bala { position: absolute; left: -40px; top: 50%; width: 30px; height: 10px; background: var(--acc); border-radius: 0 5px 5px 0; opacity: 0; }
.chaleco.in .chaleco__bala { animation: bala 1.2s var(--ease-out) 1s forwards; }
@keyframes bala { from { opacity: 1; left: -40px; } to { opacity: 1; left: 2%; } }
.chaleco__leyenda { position: absolute; left: 0; bottom: 20px; font-family: var(--f-mono); font-size: 12px; color: var(--mute); }
.chaleco__res { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.tiro { padding: 16px; border: 1px solid var(--line-x); background: #F3EBD8; }
.tiro b { display: block; font-family: var(--f-mono); font-size: 22px; color: var(--acc); }
.tiro span { display: block; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin: 4px 0 8px; }
.tiro p { margin: 0; font-size: 14px; line-height: 1.5; }
.tiro--obj { grid-column: 1 / -1; border-left: 4px solid var(--acc); }
.fmt--informe .fcita p { font-family: var(--f-mono); font-style: normal; font-size: clamp(18px, 1.8vw, 24px); line-height: 1.45; }
.fmt--informe .fdato b { font-family: var(--f-mono); }
.fmt--informe .cierre { background: #F3EBD8; } .fmt--informe .cierre__sello { color: var(--acc); border-color: var(--acc); font-size: 14px; }
.fmt--informe .cierre__lineas li, .fmt--informe .cierre__lineas b { font-family: var(--f-mono); }


/* ================================================================ EXPEDIENTE RESERVADO
   El motivo del formato recorre toda la página: la franja de clasificación separa capítulos y
   módulos, el margen perforado de archivador corre por el cuerpo y el sello RESERVADO reaparece
   como marca de agua en el estado, el cierre, los hitos y los créditos. */
.fmt--informe {
  --sello-res: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='128' viewBox='0 0 300 128'%3E%3Cg fill='none' stroke='%23B3121C'%3E%3Crect x='7' y='7' width='286' height='114' stroke-width='5'/%3E%3Crect x='17' y='17' width='266' height='94' stroke-width='2'/%3E%3C/g%3E%3Ctext x='150' y='66' fill='%23B3121C' font-family='Courier New,Courier,monospace' font-size='36' font-weight='bold' letter-spacing='5' text-anchor='middle'%3ERESERVADO%3C/text%3E%3Ctext x='150' y='94' fill='%23B3121C' font-family='Courier New,Courier,monospace' font-size='12' letter-spacing='2.6' text-anchor='middle'%3EMINISTERIO DE DEFENSA %C2%B7 2024-GUA-001%3C/text%3E%3C/svg%3E");
  --sello-res-tinta: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='128' viewBox='0 0 300 128'%3E%3Cg fill='none' stroke='%231F1B14'%3E%3Crect x='7' y='7' width='286' height='114' stroke-width='5'/%3E%3Crect x='17' y='17' width='266' height='94' stroke-width='2'/%3E%3C/g%3E%3Ctext x='150' y='66' fill='%231F1B14' font-family='Courier New,Courier,monospace' font-size='36' font-weight='bold' letter-spacing='5' text-anchor='middle'%3ERESERVADO%3C/text%3E%3Ctext x='150' y='94' fill='%231F1B14' font-family='Courier New,Courier,monospace' font-size='12' letter-spacing='2.6' text-anchor='middle'%3EMINISTERIO DE DEFENSA %C2%B7 2024-GUA-001%3C/text%3E%3C/svg%3E");
  --papel-2: #F3EBD8;
  --franja: repeating-linear-gradient(45deg, var(--acc) 0 9px, transparent 9px 19px);
  --franja-tinta: repeating-linear-gradient(45deg, var(--fg) 0 9px, transparent 9px 19px);
}

/* Barra superior y navegación: franja de clasificación en el canto */
.fmt--informe .topbar { border-bottom: 0; box-shadow: 0 1px 0 var(--line-x); }
.fmt--informe .topbar::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 6px; background-image: var(--franja); opacity: .55; pointer-events: none; }
.fmt--informe .progress { bottom: -9px; }
.fmt--informe .fnav { border-bottom: 0; }
.fmt--informe .fnav::after { content: ""; display: block; height: 7px; background-image: var(--franja); opacity: .5; }
.fmt--informe .fnav a.is-active b, .fmt--informe .fnav a:hover b { background: var(--acc); }

/* Portada: carátula de documento con membrete, ficha del denunciado y acuse de la Fiscalía */
.hero--informe { padding: 90px 0 48px; }
.portada-doc__cab { display: grid; gap: 4px; padding-bottom: 14px; margin-bottom: 26px; border-bottom: 3px double var(--fg); max-width: calc(100% - 190px); }
.portada-doc__cab b { font-family: var(--f-mono); font-weight: 400; font-size: 15px; letter-spacing: .12em; text-transform: uppercase; line-height: 1.2; }
.portada-doc__cab span { font-family: var(--f-label); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--mute); }
.portada-doc__grid { display: grid; gap: 32px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 1000px) { .portada-doc__grid { grid-template-columns: minmax(0, 1.55fr) minmax(240px, .45fr); gap: clamp(30px, 4vw, 60px); } .portada-doc__grid .ficha-den { margin-top: 30px; } }
.portada-doc__col { min-width: 0; }
.hero--informe .hkicker { margin-bottom: 18px; }
.hero--informe .hdeck { max-width: 62ch; }
.hero--informe .hby { border-top-color: var(--line-x); }

/* Ficha del denunciado: la foto grapada a la carátula */
.ficha-den { position: relative; background: var(--papel-2); border: 1px solid var(--line-x); padding: 16px 16px 18px; box-shadow: 3px 4px 0 rgba(31,27,20,.1); }
.ficha-den::after { content: ""; position: absolute; left: 50%; top: -9px; width: 54px; height: 16px; margin-left: -27px; border: 2px solid rgba(31,27,20,.45); border-bottom: 0; border-radius: 9px 9px 0 0; }
.ficha-den__rot { display: block; font-family: var(--f-label); font-weight: 700; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--acc); margin-bottom: 12px; }
.ficha-den__foto { width: 100%; aspect-ratio: 4 / 5; overflow: hidden; margin-bottom: 12px; border: 1px solid var(--line-x); background: var(--bg-2); }
.ficha-den__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; filter: grayscale(1) contrast(1.25) brightness(1.02); mix-blend-mode: multiply; }
.ficha-den b { display: block; font-family: var(--f-mono); font-weight: 400; font-size: clamp(19px, 1.7vw, 23px); line-height: 1.1; text-transform: uppercase; }
.ficha-den__cargo { display: block; font-family: var(--f-label); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin: 6px 0 10px; }
.ficha-den p { margin: 0; font-family: var(--f-label); font-size: 13px; line-height: 1.5; }
.ficha-den__cred { display: block; font-family: var(--f-label); font-size: 10px; line-height: 1.4; color: var(--mute); margin-top: 10px; }

/* Acuse: la línea que dice qué pasó tras publicar */
.acuse { position: relative; margin: 0 0 26px; padding: 16px 18px 16px 20px; background: var(--papel-2); border-left: 6px solid var(--acc);
  font-family: var(--f-label); font-size: 15.5px; line-height: 1.5; max-width: 62ch; }
.acuse span { display: block; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--acc); margin-bottom: 5px; }

/* Cuerpo: margen perforado de archivador */
.fmt--informe .fbody { position: relative; }
.fmt--informe .fmain { position: relative; }
@media (min-width: 1100px) {
  .fmt--informe .fmain::before { content: ""; position: absolute; left: -42px; top: 6px; bottom: 6px; width: 20px; pointer-events: none;
    background-image: radial-gradient(circle at 10px 130px, transparent 7px, var(--line-x) 7px, var(--line-x) 8.2px, transparent 8.2px); background-size: 20px 260px; background-repeat: repeat-y; }
  .fmt--informe .fmain::after { content: ""; position: absolute; left: -22px; top: 0; bottom: 0; width: 1px; background: repeating-linear-gradient(180deg, var(--line-x) 0 6px, transparent 6px 12px); pointer-events: none; }
}

/* Estado del caso: sello mecanografiado, sin cajón (el sitio no encajona el estado) */
.fmt--informe .estado { position: relative; padding-left: 20px !important; }
.fmt--informe .estado::before { content: "Ministerio de Defensa · Expediente reservado"; display: block; width: auto; height: auto; margin: 0 0 14px; padding-bottom: 8px;
  background: none; border-bottom: 3px double var(--fg); font-family: var(--f-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--fg); }
.fmt--informe .estado::after { content: ""; position: absolute; right: 0; bottom: -14px; width: 168px; height: 72px; background: var(--sello-res) center / contain no-repeat; opacity: .16; transform: rotate(-7deg); pointer-events: none; }
.fmt--informe .estado b, .fmt--informe .estado .kicker, .fmt--informe .estado p { position: relative; z-index: 1; }

/* Capítulos: franja de clasificación entre folios, número de folio mecanografiado */
.fmt--informe .cap { position: relative; }
.fmt--informe .cap + .cap { border-top: 0; padding-top: 74px; }
.fmt--informe .cap + .cap::before { content: ""; position: absolute; left: 0; right: 0; top: 26px; height: 14px; background-image: var(--franja); opacity: .55; }
.fmt--informe .cap__head { position: relative; padding-bottom: 22px; margin-bottom: 26px; border-bottom: 1px dotted var(--line-x); }
.fmt--informe .cap__num { letter-spacing: .12em; font-size: 11.5px; }
.fmt--informe .cap:first-child .ftext > p:first-of-type::first-letter { color: var(--acc); }

/* Citas: renglón mecanografiado sobre papel */
.fmt--informe .fcita { border-left: 0; padding: 22px 0 20px 24px; position: relative; }
.fmt--informe .fcita::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; border-left: 1px solid var(--acc); border-right: 1px solid var(--acc); }
.fmt--informe .fcita cite { color: var(--acc); }

/* Cronología, personas y respuestas: marcas de sello */
.fmt--informe .ftl li::before { border-radius: 0; width: 9px; height: 9px; left: -5px; background: var(--acc); }
.fmt--informe .ftl__f { font-family: var(--f-mono); }
.fmt--informe .fper { border: 0; border-top: 2px solid var(--fg); padding: 16px 0 0; }
.fmt--informe .fper .badge { border-style: dotted; }
.fmt--informe .fresp li { border-left-width: 5px; }
.fmt--informe .fcifras > div { border-top-color: var(--acc); }
.fmt--informe .preguntas li::before { font-family: var(--f-mono); }

/* Módulos: cada uno abre con la franja */
.fmt--informe .fmod__head { position: relative; padding-top: 30px; }
.fmt--informe .fmod__head::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; background-image: var(--franja); opacity: .5; }
.fmt--informe .fmod__head .kicker { font-family: var(--f-mono); }

/* Cierre y qué pasó después */
.fmt--informe .cierre { position: relative; border: 1px solid var(--line-x); }
.fmt--informe .cierre::after { content: ""; position: absolute; right: 14px; bottom: 14px; width: 210px; height: 90px; background: var(--sello-res) center / contain no-repeat; opacity: .13; transform: rotate(-7deg); pointer-events: none; }
.fmt--informe .cierre__lineas li { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); position: relative; z-index: 1; }
.fmt--informe .despues { position: relative; overflow: hidden; border-top: 0; padding-top: 92px; }
.fmt--informe .despues::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 16px; background-image: var(--franja); opacity: .55; }
.fmt--informe .despues::after { content: ""; position: absolute; right: 26px; top: 40px; width: 300px; height: 128px; background: var(--sello-res-tinta) center / contain no-repeat; opacity: .07; transform: rotate(-6deg); pointer-events: none; }
.fmt--informe .despues .wrap { position: relative; z-index: 1; }
.fmt--informe .despues .fmod__head::before { display: none; }
.fmt--informe .despues .fmod__head { padding-top: 0; }
.fmt--informe .hito { border-top: 0; padding-top: 22px; position: relative; }
.fmt--informe .hito::before { content: ""; position: absolute; left: 0; right: 0; top: 0; width: auto; height: 8px; background: none; background-image: var(--franja); opacity: .6; }
.fmt--informe .creditos { position: relative; overflow: hidden; }
.fmt--informe .creditos::after { content: ""; position: absolute; left: 6%; bottom: 24px; width: 300px; height: 128px; background: var(--sello-res-tinta) center / contain no-repeat; opacity: .07; transform: rotate(-4deg); pointer-events: none; }
.fmt--informe .creditos .wrap { position: relative; z-index: 1; }
.fmt--informe .footer { position: relative; }
.fmt--informe .footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px; background-image: var(--franja); opacity: .5; }

/* ================================================================ ESQUEMA DEL NEGOCIO
   Quién compra, a quién, con qué certificación, por cuánto y qué pasó en la prueba de tiro. */
.esq { display: grid; gap: clamp(26px, 3vw, 38px); }
.esq__rot { display: block; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--acc); }
.esq__cadena { list-style: none; margin: 0; padding: 0; display: grid; gap: 40px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .esq__cadena { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 46px); } }
.esq__nodo { position: relative; padding: 18px 0 0; border-top: 3px solid var(--fg); min-width: 0; }
.esq__nodo::after { content: "→"; position: absolute; right: -30px; top: 34px; font-family: var(--f-mono); font-size: 24px; color: var(--acc); opacity: 0; transition: opacity .5s var(--ease-out); transition-delay: calc(var(--i, 0) * .2s); }
.esq.in .esq__nodo::after { opacity: 1; }
.esq__nodo:last-child::after { display: none; }
@media (max-width: 899px) { .esq__nodo::after { right: auto; left: 0; top: auto; bottom: -22px; content: "↓"; } }
.esq__n { display: block; font-family: var(--f-mono); font-size: 12px; letter-spacing: .16em; color: var(--acc); margin-bottom: 6px; }
.esq__nodo b { display: block; font-family: var(--f-mono); font-weight: 400; font-size: clamp(20px, 2vw, 27px); line-height: 1.08; text-transform: uppercase; margin-bottom: 6px; overflow-wrap: anywhere; }
.esq__sub { display: block; font-family: var(--f-label); font-weight: 700; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--acc); margin-bottom: 10px; }
.esq__nodo p { margin: 0 0 12px; font-family: var(--f-label); font-size: 14px; line-height: 1.5; }
.esq__pin { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; border-top: 1px dotted var(--line-x); padding-top: 10px; }
.esq__pin li { position: relative; padding-left: 16px; font-family: var(--f-label); font-size: 12.5px; line-height: 1.45; color: var(--mute); }
.esq__pin li::before { content: "▸"; position: absolute; left: 0; top: 0; color: var(--acc); font-size: 11px; }

.esq__plata { background: var(--papel-2); border: 1px solid var(--line-x); padding: clamp(20px, 2.6vw, 30px); }
.esq__plata header { display: grid; gap: 4px; padding-bottom: 18px; border-bottom: 1px solid var(--line-x); margin-bottom: 18px; }
.esq__plata header b { font-family: var(--f-mono); font-weight: 400; font-size: clamp(34px, 5vw, 62px); line-height: 1; color: var(--acc); letter-spacing: -.01em; }
.esq__plata header small { font-family: var(--f-label); font-size: 13px; line-height: 1.45; color: var(--mute); max-width: 60ch; }
.esq__ant { position: relative; min-height: 32px; border: 1px solid var(--fg); margin-bottom: 20px; display: flex; align-items: center; }
.esq__ant i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--acc) 32%, transparent) 0 7px, transparent 7px 14px); transition: width 1.1s var(--ease-out) .2s; }
.esq.in .esq__ant i { width: var(--w); }
.esq__ant span { position: relative; z-index: 1; padding: 7px 12px; font-family: var(--f-label); font-size: 12.5px; line-height: 1.35; letter-spacing: .04em; }
.esq__ant span b { font-family: var(--f-mono); font-weight: 400; }
.esq__leg { margin: 0 0 12px; font-family: var(--f-label); font-size: 11.5px; letter-spacing: .04em; color: var(--mute); }
.esq__items { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.esq__items li { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(60px, 1.5fr) minmax(0, max-content); gap: 12px; align-items: center; font-family: var(--f-label); font-size: 13px; }
.esq__items span { min-width: 0; overflow-wrap: anywhere; }
.esq__items i { display: block; height: 10px; width: 0; background: var(--acc-2); transition: width 1s var(--ease-out); transition-delay: .3s; }
.esq.in .esq__items i { width: var(--w); }
.esq__items b { font-family: var(--f-mono); font-weight: 400; font-size: 14px; text-align: right; white-space: nowrap; }
.esq__tot { margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--line-x); font-family: var(--f-label); font-size: 13.5px; }
.esq__tot b { font-family: var(--f-mono); font-weight: 400; font-size: 17px; }
@media (max-width: 560px) { .esq__items li { grid-template-columns: minmax(0, 1fr) minmax(0, max-content); row-gap: 5px; } .esq__items b { grid-row: 1; grid-column: 2; } .esq__items i { grid-row: 2; grid-column: 1 / -1; } }

.esq__tiro { border-top: 3px solid var(--acc); padding-top: 20px; }
.esq__tiro > .esq__rot { margin-bottom: 16px; }
.esq__tiro-grid { display: grid; gap: 20px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 860px) { .esq__tiro-grid { grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 40px); } }
.esq__caso { padding: 18px 20px; background: var(--papel-2); border-left: 5px solid var(--fg); }
.esq__caso--b { border-left-color: var(--acc); }
.esq__caso time { display: block; font-family: var(--f-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--acc); margin-bottom: 6px; }
.esq__caso h4 { margin: 0 0 8px; font-family: var(--f-mono); font-weight: 400; font-size: 19px; line-height: 1.12; text-transform: uppercase; }
.esq__caso p { margin: 0 0 12px; font-family: var(--f-label); font-size: 13.5px; line-height: 1.5; }
.esq__caso small { display: block; font-family: var(--f-label); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.esq__capas { position: relative; display: grid; grid-template-columns: repeat(20, 1fr); gap: 2px; height: 74px; margin: 6px 0 10px; }
.esq__capas i { display: block; background: var(--acc-2); opacity: .28; transform: scaleY(.25); transform-origin: bottom; transition: transform .5s var(--ease-out), opacity .5s; transition-delay: calc(var(--i) * 35ms); }
.esq.in .esq__capas i { transform: none; opacity: 1; }
.esq__capas i:nth-child(-n+2) { opacity: 1; background: var(--acc); }
.esq__proy { position: absolute; left: -17px; top: 46%; width: 22px; height: 8px; background: var(--acc); border-radius: 0 4px 4px 0; opacity: 1; }
.esq.in .esq__proy { animation: proy 1s var(--ease-out) .9s forwards; }
@keyframes proy { from { opacity: 1; left: -17px; } to { opacity: 1; left: 2%; } }
.esq__balas { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); margin-top: 12px; }
.esq__bala { border-top: 2px solid var(--fg); padding-top: 8px; }
.esq__bala b { display: block; font-family: var(--f-mono); font-weight: 400; font-size: 19px; color: var(--acc); }
.esq__bala span { display: block; font-family: var(--f-label); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin: 2px 0 5px; }
.esq__bala p { margin: 0; font-family: var(--f-label); font-size: 12.5px; line-height: 1.45; }
.esq__obj { position: relative; margin: 20px 0 0; padding: 16px 18px; background: var(--papel-2); border-left: 5px solid var(--acc); font-family: var(--f-label); font-size: 13.5px; line-height: 1.55; }
.esq__obj span { display: block; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--acc); margin-bottom: 6px; }

@media (prefers-reduced-motion: reduce) {
  .esq__nodo::after, .esq__proy { opacity: 1 !important; animation: none !important; }
  .esq__ant i { width: var(--w) !important; } .esq__items i { width: var(--w) !important; }
  .esq__capas i { transform: none !important; opacity: 1 !important; }
}