/* =====================================================================
   Ficha de memoria (mapa/caso) — versión 2
   Cabecera de memorial, índice fijo, línea del caso y relato plegable.
   ===================================================================== */

/* Cabecera: retrato y nombre juntos sobre la noche */
.ficha2-cabecera {
  background:
    radial-gradient(50rem 26rem at 85% 0%, rgba(116, 68, 180, .35), transparent 70%),
    radial-gradient(30rem 20rem at 0% 100%, rgba(242, 165, 65, .12), transparent 70%),
    var(--mr-noche);
  color: #f4f1f8; padding-block: clamp(1.5rem, 4vw, 2.5rem) clamp(2.5rem, 6vw, 4rem);
}
.ficha2-cabecera .migas { color: #b9b0c8; margin-bottom: clamp(1.25rem, 3vw, 2.25rem); }
.ficha2-cabecera .migas a { color: #cfc6dd; }
.ficha2-rejilla { display: grid; gap: 1.5rem 3rem; align-items: center; }
@media (min-width: 768px) { .ficha2-rejilla { grid-template-columns: clamp(13rem, 22vw, 17rem) 1fr; } }
.ficha2-retrato {
  aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; position: relative;
  background: linear-gradient(160deg, #3a2566, #1d1538);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 30px 60px -20px rgba(0, 0, 0, .6);
}
.ficha2-retrato img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ficha2-retrato .sin-foto { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; font-family: var(--mr-serif); font-size: 3.2rem; color: rgba(255, 255, 255, .55); }
.ficha2-retrato .sin-foto i { font-size: 1.6rem; color: var(--mr-cempa); filter: drop-shadow(0 0 12px rgba(242, 165, 65, .7)); }
.ficha2-antetitulo { display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 .6rem; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #ffd59a; }
.ficha2-antetitulo::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--mr-cempa); box-shadow: 0 0 0 4px rgba(242, 165, 65, .2); }
.ficha2-antetitulo.buscando { color: #ffb4a8; }
.ficha2-antetitulo.buscando::before { background: #ff7a66; animation: ficha2-latido 1.6s ease-in-out infinite; }
@keyframes ficha2-latido { 50% { box-shadow: 0 0 0 8px rgba(255, 122, 102, 0); } }
.ficha2-cabecera h1 { color: #fff; font-size: clamp(2.2rem, 5vw, 3.8rem); margin: 0; overflow-wrap: anywhere; }
.ficha2-vida { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: .9rem 0 0; color: #cfc6dd; font-size: 1.05rem; }
.ficha2-pronombres { font-size: .82rem; font-weight: 600; padding: .15rem .6rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .2); color: #e4ddef; }
.ficha2-sintesis { margin: 1.25rem 0 0; max-width: 60ch; font-family: var(--mr-serif); font-size: clamp(1.05rem, 1.6vw, 1.22rem); line-height: 1.6; color: #ece6f7; padding-left: 1rem; border-left: 2px solid var(--mr-cempa); }
.ficha2-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: 1.75rem; }
.ficha2-acciones .btn-vela { border-radius: 999px; font-weight: 650; }
.ficha2-icono { display: inline-flex; align-items: center; gap: .45rem; height: 2.9rem; padding: 0 1rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22); color: #fff; text-decoration: none; font-weight: 600; font-size: .92rem; transition: border-color .2s, color .2s; }
.ficha2-icono:hover { border-color: #ffd59a; color: #ffd59a; }
@media (max-width: 767.98px) {
  .ficha2-rejilla { grid-template-columns: 6.5rem 1fr; grid-template-rows: 1fr auto; gap: .35rem 1.1rem; align-items: end; }
  .ficha2-retrato { grid-column: 1; grid-row: 1 / span 2; border-radius: 16px; align-self: stretch; }
  .ficha2-retrato .sin-foto { font-size: 1.8rem; gap: .3rem; } .ficha2-retrato .sin-foto i { font-size: 1.1rem; }
  .ficha2-titular { display: contents; }
  .ficha2-antetitulo { grid-column: 2; grid-row: 1; align-self: end; margin: 0; font-size: .7rem; }
  .ficha2-cabecera h1 { grid-column: 2; grid-row: 2; font-size: clamp(1.6rem, 7vw, 2.1rem); }
  .ficha2-vida, .ficha2-sintesis, .ficha2-acciones { grid-column: 1 / -1; }
  .ficha2-vida { margin-top: 1rem; }
  .ficha2-sintesis { margin-top: 1rem; }
  .ficha2-acciones { margin-top: 1.25rem; flex-wrap: nowrap; }
  .ficha2-acciones .btn-vela { flex: 1; justify-content: center; white-space: nowrap; padding-inline: .9rem; }
  .ficha2-icono { width: 2.9rem; padding: 0; justify-content: center; flex: none; }
  .ficha2-icono span:not(.visually-hidden) { display: none; }
}

/* Contador de días para personas desaparecidas */
.ficha2-contador { display: inline-flex; align-items: center; gap: .9rem; margin: 1.25rem 0 0; padding: .7rem 1.2rem .7rem .8rem; border-radius: 18px; background: rgba(255, 122, 102, .12); border: 1px solid rgba(255, 122, 102, .35); }
.ficha2-contador-num { font-family: var(--mr-serif); font-size: clamp(2.2rem, 4vw, 2.9rem); font-weight: 600; line-height: 1; color: #ffb4a8; font-variant-numeric: tabular-nums; }
.ficha2-contador-txt { font-weight: 650; color: #fff; line-height: 1.25; }
.ficha2-contador-txt small { display: block; font-weight: 450; font-size: .85rem; color: #cfc6dd; }
@media (max-width: 767.98px) { .ficha2-contador { grid-column: 1 / -1; margin-top: 1rem; } }

/* Índice fijo debajo de la cabecera del sitio */
.ficha2-indice { position: sticky; top: var(--alto-cabecera, 72px); z-index: 20; background: rgba(255, 255, 255, .94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--mr-linea); }
.ficha2-indice .contenedor { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; padding-block: .45rem; }
.ficha2-indice a { flex: none; padding: .45rem .9rem; border-radius: 999px; color: var(--mr-piedra); font-weight: 600; font-size: .92rem; text-decoration: none; white-space: nowrap; }
.ficha2-indice a:hover { color: var(--mr-morado); background: var(--mr-morado-claro); }
.ficha-bloque, #comentarios { scroll-margin-top: calc(var(--alto-cabecera, 72px) + 4rem); }

/* Línea del caso */
.ficha2-linea { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 1rem; position: relative; }
.ficha2-linea li { position: relative; display: flex; flex-direction: column; gap: .6rem; }
.ficha2-linea li::before { content: ""; position: absolute; top: 1.2rem; left: 2.4rem; right: -1rem; height: 2px; background: linear-gradient(90deg, var(--mr-linea-2), var(--mr-linea)); }
.ficha2-linea li:last-child::before { display: none; }
.ficha2-linea-punto { position: relative; z-index: 1; width: 2.4rem; height: 2.4rem; border-radius: 50%; display: grid; place-items: center; background: var(--mr-morado-claro); color: var(--mr-morado); box-shadow: 0 0 0 4px var(--mr-papel); }
.ficha2-linea li:last-child .ficha2-linea-punto { background: var(--mr-noche); color: #ffd59a; }
.ficha2-linea strong { display: block; font-size: .95rem; }
.ficha2-linea time { display: block; color: var(--mr-piedra); font-size: .92rem; }
@media (max-width: 575.98px) {
  .ficha2-linea { grid-template-columns: 1fr; gap: 1.1rem; }
  .ficha2-linea li { flex-direction: row; align-items: center; gap: .9rem; }
  .ficha2-linea li::before { top: 2.4rem; bottom: -1.1rem; left: 1.2rem; right: auto; width: 2px; height: auto; }
}

/* Relato de los hechos: aviso cuidadoso y lectura plegada */
.ficha2-aviso { display: flex; gap: .75rem; align-items: flex-start; padding: .9rem 1.1rem; margin-bottom: 1.25rem; border-radius: 14px; background: var(--mr-morado-claro); color: var(--mr-tinta); font-size: .95rem; }
.ficha2-aviso i { color: var(--mr-morado); margin-top: .2rem; }
.ficha2-plegado { max-height: 17rem; overflow: hidden; position: relative; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
.ficha2-desplegar { margin-top: .5rem; border-radius: 999px; font-weight: 650; display: inline-flex; align-items: center; gap: .5rem; }

@media print { .ficha2-indice, .ficha2-acciones, .ficha2-desplegar { display: none !important; } .ficha2-plegado { max-height: none; mask-image: none; -webkit-mask-image: none; } .ficha2-cabecera { background: #fff !important; color: #000 !important; } .ficha2-cabecera h1 { color: #000 !important; } }