/* =============================================================================
   RecuperoLegal — hoja de estilos
   -----------------------------------------------------------------------------
   Negro como base, azul al mando y dorado como acento. Se aparta a propósito
   del dorado protagonista de Hernández: aquí manda el azul y la tipografía es
   geométrica, no serif.

   El hero no lleva vídeo: una fotografía con un acercamiento muy lento da la
   misma sensación de movimiento sin el peso ni los problemas de reproducción
   en móvil. Se desactiva para quien pide menos movimiento en su sistema.
   ============================================================================= */

:root{
  --negro:  #0A0C10;
  --negro2: #12161D;
  --azul:   #1E5BFF;
  --azul2:  #5B8BFF;
  --oro:    #D4A853;
  --linea:  rgba(255,255,255,.1);
  --txt:    rgba(255,255,255,.72);
  --sans:   'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --geo:    'Space Grotesk', system-ui, sans-serif;
}
*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin: 0; background: var(--negro); color: #fff;
  font-family: var(--sans); font-size: 16.5px; line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img{ max-width: 100%; height: auto; display: block; }
a{ color: var(--azul2); }
h1,h2,h3{ font-family: var(--geo); font-weight: 700; line-height: 1.15; margin: 0; letter-spacing: -.02em; }
.cont{ width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 20px; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.saltar{ position:absolute; left:-999px; background:var(--azul); color:#fff; padding:.7rem 1rem; z-index:100; }
.saltar:focus{ left:0; }
[hidden]{ display: none !important; }

/* ---- Cabecera ---- */
.cab{ border-bottom: 1px solid var(--linea); position: sticky; top: 0;
      background: rgba(10,12,16,.92); backdrop-filter: blur(8px); z-index: 40; }
.cab .fila{ display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 96px; padding-top: 10px; padding-bottom: 10px; }
.marca{ display: inline-block; text-decoration: none; }
.nom{ display: block; font-family: 'Great Vibes', cursive; font-size: 32px; line-height: 1.24;
       color: #fff; letter-spacing: 0; }
/* La R y la L más grandes, pero SIN line-height:0: si no cuentan para la altura
   de la línea, se salen de la cabecera. Con 1.28em y la línea holgada, caben. */
.nom i{ font-style: normal; color: var(--oro); font-size: 1.28em; line-height: inherit; }
.marca{ align-items: center; }
/* La bajada empieza y acaba donde la tinta del nombre, no donde su caja de
   texto: la letra manuscrita se sale de la caja, y por eso antes quedaba
   descuadrada. Los valores se midieron sobre los píxeles pintados y van en
   unidades relativas, así la simetría aguanta a cualquier tamaño. */
.bajo{ display: block; font-size: 10.4px; line-height: 1; text-transform: uppercase;
       color: var(--oro); white-space: nowrap; margin-top: 9px;
       letter-spacing: .52px; margin-right: -.52px; }
.nav{ display: flex; align-items: center; gap: 1.3rem; }
.nav a{ color: rgba(255,255,255,.78); text-decoration: none; font-size: .93rem; }
.nav a:hover, .nav a.activo{ color: #fff; }
.nav a.activo{ box-shadow: inset 0 -2px 0 var(--oro); padding-bottom: 3px; }
.idi{ display: flex; gap: 4px; font-size: 12px; margin-left: .4rem; }
.idi a{ color: rgba(255,255,255,.5); text-decoration: none; padding: 4px 8px; border-radius: 3px; }
.idi a.on{ background: var(--oro); color: var(--negro); font-weight: 600; }
.hamb{ display: none; background: none; border: 1px solid var(--linea); border-radius: 3px; padding: .45rem .6rem; cursor: pointer; }
.hamb span{ display: block; width: 22px; height: 2px; background: var(--oro); margin: 4px 0; }

/* ---- Hero con foto en movimiento ---- */
.hero{ position: relative; padding: 62px 0 54px; overflow: hidden; }
.hero-foto{
  position: absolute; inset: -4%;
  background: url('../img/header-bg.webp') center/cover no-repeat;
  opacity: .3;
  animation: acercar 26s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes acercar{
  from{ transform: scale(1)   translate3d(0,0,0); }
  to  { transform: scale(1.12) translate3d(-1.5%,-1%,0); }
}
.hero-velo{
  position: absolute; inset: 0;
  background: radial-gradient(820px 400px at 78% 14%, rgba(30,91,255,.32), transparent 62%),
              radial-gradient(560px 300px at 8% 92%, rgba(212,168,83,.12), transparent 60%),
              linear-gradient(90deg, rgba(10,12,16,.94) 34%, rgba(10,12,16,.6) 100%);
}
.hero .cont{ position: relative; }
.ante{ font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--oro); margin: 0 0 16px; }
.hero h1{ font-size: clamp(30px, 5.2vw, 52px); max-width: 17ch; margin-bottom: 16px; }
.hero h1 em{ font-style: normal; color: var(--azul2); }
.lead{ max-width: 58ch; color: var(--txt); font-size: 17px; margin: 0; }
.btns{ margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }
.b1,.b2{ display: inline-flex; align-items: center; justify-content: center; min-height: 50px;
         padding: 14px 26px; font-weight: 600; text-decoration: none; border-radius: 3px; }
.b1{ background: var(--azul); color: #fff; }
.b1:hover{ background: #164AD6; }
.b2{ border: 1px solid rgba(212,168,83,.5); color: var(--oro); }
.b2:hover{ background: rgba(212,168,83,.1); }
.nota{ margin-top: 22px; border-left: 2px solid var(--oro); padding-left: 14px;
       color: rgba(255,255,255,.58); font-size: 14px; max-width: 58ch; }

/* ---- Franja de datos ---- */
.franja{ display: grid; grid-template-columns: repeat(auto-fit, minmax(190px,1fr));
         gap: 1px; background: var(--linea); border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.dato{ background: var(--negro); padding: 20px; }
.dato b{ display: block; font: 700 25px/1 var(--geo); color: var(--oro); }
.dato span{ font-size: 13px; color: rgba(255,255,255,.5); }

/* ---- Secciones ---- */
.sec{ padding: 50px 0; }
.sec.alt{ background: var(--negro2); }
.sec h2{ font-size: clamp(22px, 3.4vw, 30px); }
.regla{ width: 46px; height: 2px; background: var(--oro); margin: 13px 0 22px; }
.entrad{ color: var(--txt); max-width: 64ch; margin: 0 0 24px; }
.tarj{ display: grid; grid-template-columns: repeat(auto-fit, minmax(255px,1fr)); gap: 14px; }
.t{ background: var(--negro); border: 1px solid var(--linea); border-top: 2px solid var(--azul); padding: 20px; }
.t h3{ font-size: 17px; margin-bottom: 7px; }
.t p{ margin: 0; color: rgba(255,255,255,.6); font-size: 14.5px; }
.dos{ display: grid; grid-template-columns: 1.05fr .95fr; gap: 2.4rem; align-items: center; }
.dos img{ border: 1px solid var(--linea); }

/* ---- Aviso que lleva al listado ---- */
.llamada{ background: var(--negro2); border: 1px solid var(--linea); border-left: 3px solid var(--oro);
          padding: 26px; display: flex; gap: 22px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.llamada p{ margin: 0; color: var(--txt); max-width: 62ch; }
.llamada h3{ font-size: 20px; margin-bottom: 6px; }

/* ---- Pie ---- */
.pie{ background: #06080B; border-top: 1px solid var(--linea); padding: 34px 0 26px; color: rgba(255,255,255,.5); font-size: 14px; }
.pie a{ color: rgba(255,255,255,.62); text-decoration: none; display: block; padding: .18rem 0; }
.pie a:hover{ color: #fff; }
.pie-rej{ display: grid; gap: 1.8rem; grid-template-columns: 1.5fr 1fr 1fr; }
.pie h4{ color: #fff; font-size: 15px; margin: 0 0 .6rem; font-family: var(--geo); }
.pie-legal{ border-top: 1px solid var(--linea); margin-top: 1.8rem; padding-top: 1.1rem; font-size: 13px; color: rgba(255,255,255,.4); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  .hero-foto{ animation: none; }
}
@media (max-width: 900px){
  .dos{ grid-template-columns: 1fr; }
  .pie-rej{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px){
  .nav{ display: none; position: absolute; top: 72px; left: 0; right: 0; background: var(--negro);
        flex-direction: column; align-items: stretch; gap: 0; padding: .5rem 20px 1rem; border-bottom: 1px solid var(--linea); }
  .nav.abierto{ display: flex; }
  .nav a{ padding: .75rem 0; border-bottom: 1px solid var(--linea); }
  .idi{ margin: .6rem 0 0; }
  .hamb{ display: block; }
  .cab{ position: relative; }
  .pie-rej{ grid-template-columns: 1fr; }
}

/* ---- Formulario ---- */
.form-caja{ background: var(--negro); border: 1px solid var(--linea); padding: 26px; }
.campos{ display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.campo{ display: flex; flex-direction: column; gap: .35rem; }
.campo-ancho{ grid-column: 1 / -1; }
.campo label{ font-size: .85rem; font-weight: 600; color: #fff; }
.campo input, .campo select, .campo textarea{
  font-family: inherit; font-size: 16px; min-height: 48px; padding: .6rem .8rem;
  border: 1px solid var(--linea); border-radius: 3px; background: var(--negro2); color: #fff; width: 100%;
}
.campo textarea{ min-height: 130px; line-height: 1.6; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus{
  outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(30,91,255,.2);
}
.consentimiento{ display: flex; gap: .6rem; align-items: flex-start; font-size: .92rem; color: var(--txt); font-weight: 400; }
.consentimiento input{ width: 18px; height: 18px; min-height: 0; margin-top: .25rem; accent-color: var(--azul); }
.trampa{ position: absolute; left: -9999px; opacity: 0; }
@media (max-width: 720px){ .campos{ grid-template-columns: 1fr; } }

/* ---- Formulario: validación, envío y confirmación ---- */
.form-nota{ margin: 0 0 1.1rem; font-size: .88rem; color: var(--txt); }
.campo select{ appearance: none; -webkit-appearance: none; padding-right: 2.4rem; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23D4A853' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .9rem center; background-size: 12px 8px; }
.campo select:invalid{ color: rgba(255,255,255,.5); }
.campo select option{ color: #fff; background: var(--negro2); }
.campo input::placeholder, .campo textarea::placeholder{ color: rgba(255,255,255,.38); }
.campo.con-error input, .campo.con-error select, .campo.con-error textarea{
  border-color: #F87171; box-shadow: 0 0 0 3px rgba(248,113,113,.16); }
.campo.con-error .consentimiento{ color: #FECACA; }
.campo-error{ margin: .1rem 0 0; font-size: .82rem; line-height: 1.4; color: #FCA5A5; }
.form-enviar{ margin: 1.3rem 0 0; }
.form-enviar .b1{ border: 0; cursor: pointer; font: inherit; font-weight: 600; min-width: 220px; }
.form-enviar .b1:disabled{ opacity: .65; cursor: progress; }
.form-estado{ margin: .9rem 0 0; font-size: .92rem; }
.form-estado:empty{ display: none; }
.form-estado.es-error{ color: #FCA5A5; border-left: 2px solid #F87171; padding-left: 12px; }

.form-caja.enviada{ display: flex; align-items: center; justify-content: center; min-height: 360px; }
.form-exito{ text-align: center; max-width: 480px; padding: 12px 6px; outline: none; }
.form-exito .regla{ margin-left: auto; margin-right: auto; }
.form-exito .entrad{ margin: 0 auto 22px; }
.form-exito h2{ font-size: clamp(22px, 3.4vw, 28px); }
.exito-icono{ display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px;
  margin-bottom: 18px; border-radius: 50%; color: #34D399; border: 1px solid rgba(52,211,153,.45);
  background: rgba(52,211,153,.1); box-shadow: 0 12px 32px rgba(16,185,129,.12);
  animation: rl-exito .42s cubic-bezier(.34,1.56,.64,1) both; }
.exito-icono path{ stroke-dasharray: 24; stroke-dashoffset: 24; animation: rl-trazo .38s .2s ease-out forwards; }
@keyframes rl-exito{ from{ opacity: 0; transform: scale(.6); } to{ opacity: 1; transform: scale(1); } }
@keyframes rl-trazo{ to{ stroke-dashoffset: 0; } }

/* ---- Página de gracias: resumen del caso ---- */
.resumen{ margin: 1.8rem auto 0; text-align: left; background: var(--negro2); border: 1px solid var(--linea);
  border-top: 2px solid var(--oro); padding: 20px 22px; }
.resumen h2{ font-size: 18px; margin-bottom: 12px; }
.resumen dl{ margin: 0; }
.resumen dl div{ display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 12px;
  padding: 9px 0; border-top: 1px solid var(--linea); font-size: 14.5px; }
.resumen dt{ color: rgba(255,255,255,.55); }
.resumen dd{ margin: 0; color: #fff; overflow-wrap: anywhere; }
@media (max-width: 560px){ .resumen dl div{ grid-template-columns: 1fr; gap: 2px; } }

/* ---- Verificación por SMS (solo si está activada en api/config.php) ---- */
.sms-dialogo{ border: 1px solid var(--linea); border-top: 2px solid var(--azul); background: var(--negro2);
  color: #fff; padding: 0; width: min(440px, calc(100% - 32px)); }
.sms-dialogo::backdrop{ background: rgba(0,0,0,.7); }
.sms-caja{ padding: 24px; }
.sms-caja h2{ font-size: 22px; margin-bottom: 10px; }
.sms-estado{ font-size: .9rem; color: var(--oro); }
.sms-botones{ display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin: 1rem 0 0; }
.sms-botones button{ font: inherit; cursor: pointer; background: none; }
.sms-botones .b1{ background: var(--azul); border: 0; }

/* ---- Aviso de cookies ---- */
#rlCookies{ position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147483000; background: var(--negro2);
  max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); overflow-y: auto; overscroll-behavior: contain;
  border-top: 2px solid var(--oro); color: var(--txt); font-size: 14px; line-height: 1.55;
  padding: 18px max(20px, env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
  box-shadow: 0 -14px 44px rgba(0,0,0,.5); }
#rlCookies .rl-caja{ max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; align-items: center; }
#rlCookies .rl-copy{ min-width: 0; }
#rlCookies .rl-titulo{ display: block; margin: 0 0 4px; color: #fff; font-family: var(--geo); font-size: 16px; }
#rlCookies p{ margin: 0; }
#rlCookies a{ color: var(--azul2); text-underline-offset: 2px; }
#rlCookies a:focus-visible, #rlCookies button:focus-visible{ outline: 3px solid var(--azul2); outline-offset: 2px; }
#rlCookies .rl-btns{ display: flex; gap: 10px; align-items: center; }
#rlCookies button{ font: inherit; font-size: 14px; font-weight: 600; min-width: 116px; min-height: 48px; padding: 10px 20px;
  border-radius: 3px; border: 1px solid rgba(212,168,83,.5); background: transparent; color: var(--oro); cursor: pointer;
  transition: background .2s ease; }
#rlCookies button:hover{ background: rgba(212,168,83,.1); }
#rlCookies .rl-si{ background: var(--azul); border-color: var(--azul); color: #fff; }
#rlCookies .rl-si:hover{ background: #164AD6; }
@media (max-width: 640px){
  #rlCookies{ left: 8px; right: 8px; bottom: 8px; border: 1px solid var(--linea); border-top: 2px solid var(--oro);
    padding: 14px 14px calc(14px + env(safe-area-inset-bottom)); font-size: 12.5px; line-height: 1.45; }
  #rlCookies .rl-caja{ display: block; }
  #rlCookies .rl-titulo{ font-size: 14.5px; }
  #rlCookies .rl-btns{ position: sticky; bottom: calc(-14px - env(safe-area-inset-bottom)); display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 12px -14px calc(-14px - env(safe-area-inset-bottom));
    padding: 10px 14px calc(14px + env(safe-area-inset-bottom)); background: var(--negro2); border-top: 1px solid var(--linea); }
  #rlCookies button{ width: 100%; min-width: 0; }
}
@media (max-width: 340px){ #rlCookies .rl-btns{ grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce){
  .exito-icono, .exito-icono path{ animation: none; stroke-dashoffset: 0; }
  #rlCookies button{ transition: none; }
}

/* ---- Buscador: una consola, no fichas de filtro -------------------------- */
.consola{ background: linear-gradient(180deg, #151A22 0%, var(--negro2) 100%);
          border: 1px solid var(--linea); border-top: 2px solid var(--azul); padding: 20px; margin-bottom: 22px; }
.consola-fila{ display: grid; grid-template-columns: 1.6fr 1fr auto; gap: 12px; align-items: end; }
.campo-busca{ position: relative; }
.campo-busca label, .campo-sel label{ display: block; font-size: 11px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--oro); margin-bottom: 7px; }
.campo-busca input{ width: 100%; min-height: 52px; padding: 12px 14px 12px 44px; font: inherit; font-size: 16px;
  background: var(--negro); border: 1px solid var(--linea); border-radius: 3px; color: #fff; }
.campo-busca svg{ position: absolute; left: 14px; bottom: 16px; width: 20px; height: 20px; color: rgba(255,255,255,.4); }
.campo-sel select{ width: 100%; min-height: 52px; padding: 12px 14px; font: inherit; font-size: 15px;
  background: var(--negro); border: 1px solid var(--linea); border-radius: 3px; color: #fff; }
.campo-busca input:focus, .campo-sel select:focus{ outline: none; border-color: var(--azul);
  box-shadow: 0 0 0 3px rgba(30,91,255,.22); }
.limpiar{ min-height: 52px; padding: 0 18px; background: transparent; border: 1px solid var(--linea);
  color: rgba(255,255,255,.7); font: inherit; border-radius: 3px; cursor: pointer; }
.limpiar:hover{ border-color: var(--oro); color: var(--oro); }
.conteo{ color: rgba(255,255,255,.55); font-size: 14px; margin: 0 0 16px;
  border-left: 2px solid var(--oro); padding-left: 12px; }

/* ---- Panel: crece desde la ficha pulsada --------------------------------- */
.fondo{ position: fixed; inset: 0; background: rgba(3,5,8,.8); display: flex;
        align-items: center; justify-content: center; padding: 18px; z-index: 80;
        opacity: 0; transition: opacity .22s ease; }
.fondo.abierto{ opacity: 1; }
.panel{ background: var(--negro2); border: 1px solid rgba(212,168,83,.4); max-width: 640px; width: 100%;
        max-height: 86vh; overflow: auto; padding: 26px;
        transform: translate(var(--dx,0), var(--dy,0)) scale(.72); opacity: 0;
        transition: transform .3s cubic-bezier(.2,.8,.3,1), opacity .24s ease; }
.fondo.abierto .panel{ transform: translate(0,0) scale(1); opacity: 1; }
.panel .et{ font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--oro); margin: 0 0 6px; }
.panel h3{ font-size: 23px; margin-bottom: 4px; }
.panel .dom{ color: rgba(255,255,255,.5); font-size: 13.5px; margin: 0 0 18px; word-break: break-all; }
.aviso{ background: rgba(212,168,83,.1); border-left: 3px solid var(--oro); padding: 13px 15px;
        font-size: 14.5px; color: rgba(255,255,255,.8); margin-bottom: 18px; }
.reg-fila{ display: flex; justify-content: space-between; gap: 12px; border: 1px solid var(--linea);
           padding: 12px 14px; margin-bottom: 8px; font-size: 14px; flex-wrap: wrap; }
.reg-fila span:last-child{ color: var(--oro); font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; }
.pie-panel{ display: flex; gap: 12px; justify-content: flex-end; align-items: center; margin-top: 20px;
            padding-top: 16px; border-top: 1px solid var(--linea); flex-wrap: wrap; }
.cerrar{ margin-right: auto; background: none; border: 0; color: rgba(255,255,255,.55);
         font: inherit; cursor: pointer; text-decoration: underline; min-height: 44px; }

/* ---- Cambio de página ---------------------------------------------------- */
.cortina{ display: none; }
.con-js .cortina{ display: block; position: fixed; inset: 0; z-index: 9000;
  background: linear-gradient(120deg, var(--negro) 0%, #0D1730 60%, var(--negro) 100%);
  transform: scaleY(1); transform-origin: top; pointer-events: none;
  transition: transform .34s cubic-bezier(.76,0,.24,1); }
body.entrando .cortina{ transform: scaleY(0); transform-origin: top; }
body.saliendo .cortina{ transform: scaleY(1); transform-origin: bottom; }
main{ transition: opacity .24s ease, transform .24s ease; }
body.saliendo main{ opacity: 0; transform: translateY(-12px); }

@media (prefers-reduced-motion: reduce){
  .cortina{ display: none !important; }
  main{ transition: none; opacity: 1 !important; transform: none !important; }
  .panel{ transition: none; transform: none !important; opacity: 1 !important; }
  .ficha{ transition: none; }
}
@media (max-width: 820px){
  .consola-fila{ grid-template-columns: 1fr; }
}

/* ---- Registro de entidades ----------------------------------------------
   En rejilla de tarjetas esto se parecía demasiado a otras webs del sector.
   Un registro en filas, numerado, se lee como lo que es: un listado oficial. */
.rej{ display: block; border: 1px solid var(--linea); border-top: 2px solid var(--azul); background: #0D1016; }
.ficha{ display: grid; grid-template-columns: 46px 1fr auto auto; gap: 16px; align-items: center;
        width: 100%; padding: 15px 18px; border: 0; border-bottom: 1px solid rgba(255,255,255,.07);
        background: transparent; color: #fff; font: inherit; text-align: left; cursor: pointer;
        position: relative; transition: background .14s ease; }
.ficha:last-child{ border-bottom: 0; }
.ficha:hover{ background: #141A24; }
.ficha::before{ content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0;
                background: var(--oro); transition: width .14s ease; }
.ficha:hover::before, .ficha:focus-visible::before{ width: 3px; }
.ficha .num{ font: 500 12px var(--geo); color: rgba(255,255,255,.3); }
.ficha b{ display: block; font-size: 15.5px; font-weight: 600; }
.ficha .dom{ display: block; font-size: 12.5px; color: rgba(255,255,255,.42); margin-top: 2px; word-break: break-all; }
.ficha .reg.propio{ color: var(--azul2); border-color: rgba(91,139,255,.4); }
.ficha .reg{ font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--oro);
             border: 1px solid rgba(212,168,83,.35); border-radius: 999px; padding: 4px 11px; white-space: nowrap; }
.ficha .fec{ font: 500 12.5px var(--geo); color: rgba(255,255,255,.4); min-width: 76px; text-align: right; }
.vacio{ color: rgba(255,255,255,.5); padding: 24px 0; }
#mas{ height: 1px; }
@media (max-width: 760px){
  .ficha{ grid-template-columns: 34px 1fr; gap: 10px; padding: 14px 14px; }
  .ficha .reg{ grid-column: 2; justify-self: start; margin-top: 6px; }
  .ficha .fec{ grid-column: 2; text-align: left; min-width: 0; margin-top: 2px; }
}

.marca-pie{ display: inline-block; }
.marca-pie .nom{ font-size: 34px; }