/* ============================================================================
   Sistema visual de Victorix, en un archivo. Se enlaza desde las tres páginas.
   Sin fuentes externas a propósito: cargan al instante, no dependen de un CDN
   y no dejan rastro de terceros en una página que habla justamente de datos.
   ============================================================================ */
:root {
  --tinta:      #111214;
  --tinta-2:    #5c6068;
  --tinta-3:    #8b9099;
  --papel:      #ffffff;
  --papel-2:    #f7f7f8;
  --borde:      #e6e7ea;
  --marca:      #e11d1f;
  --marca-suave:#fdecec;
  --ancho:      44rem;
}
@media (prefers-color-scheme: dark) {
  :root {
    --tinta: #f2f3f5; --tinta-2: #9ea3ab; --tinta-3: #6e737b;
    --papel: #121316; --papel-2: #1a1c20; --borde: #292b30;
    --marca: #f0494b; --marca-suave: #2d1516;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--papel); color: var(--tinta);
  font-family: "Inter Tight", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 16px; line-height: 1.65; letter-spacing: -0.006em;
  -webkit-font-smoothing: antialiased;
}
.envoltura { max-width: var(--ancho); margin: 0 auto; padding: 3rem 1.5rem 6rem; }
@media (min-width: 40rem) { .envoltura { padding: 5rem 2rem 8rem; } }

/* ── marca ─────────────────────────────────────────────────────────────── */
.marca { display: inline-flex; align-items: baseline; gap: .18em; text-decoration: none;
         font-weight: 800; font-size: 1.15rem; letter-spacing: -0.03em; color: var(--tinta); }
.marca i { font-style: normal; color: var(--marca); }
.marca span { color: var(--tinta-3); font-weight: 500; margin-left: .1em; }

/* ── cabecera del documento ────────────────────────────────────────────── */
h1 { font-size: clamp(1.75rem, 5vw, 2.4rem); line-height: 1.15; letter-spacing: -0.025em;
     font-weight: 700; margin: 3rem 0 .75rem; }
.bajada { color: var(--tinta-2); font-size: 1.02rem; margin: 0 0 .5rem; max-width: 34rem; }
.vigencia { color: var(--tinta-3); font-size: .85rem; margin: 0; }

h2 { font-size: 1.16rem; font-weight: 650; letter-spacing: -0.015em;
     margin: 3rem 0 .85rem; padding-top: 1.75rem; border-top: 1px solid var(--borde); }
h3 { font-size: .98rem; font-weight: 650; margin: 1.75rem 0 .5rem; }
p, li { color: var(--tinta-2); }
p { margin: 0 0 1rem; }
strong { color: var(--tinta); font-weight: 600; }
a { color: var(--marca); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--marca) 35%, transparent); }
a:hover { border-bottom-color: var(--marca); }
ul, ol { margin: 0 0 1rem; padding-left: 1.15rem; }
li { margin-bottom: .45rem; }
li::marker { color: var(--tinta-3); }

/* ── piezas ────────────────────────────────────────────────────────────── */
.nota { background: var(--papel-2); border: 1px solid var(--borde); border-radius: .7rem;
        padding: 1.1rem 1.25rem; margin: 1.5rem 0; }
.nota p:last-child { margin-bottom: 0; }
.nota-marca { background: var(--marca-suave); border-color: color-mix(in srgb, var(--marca) 22%, transparent); }

table { width: 100%; border-collapse: collapse; margin: 1.25rem 0; font-size: .93rem; }
th { text-align: left; font-weight: 600; color: var(--tinta); padding: .6rem .75rem .6rem 0;
     border-bottom: 1px solid var(--borde); vertical-align: bottom; }
td { padding: .7rem .75rem .7rem 0; border-bottom: 1px solid var(--borde);
     color: var(--tinta-2); vertical-align: top; }
tr td:first-child { color: var(--tinta); font-weight: 500; padding-right: 1.25rem; }
.tabla-envoltura { overflow-x: auto; }

.correo { font-weight: 600; }
.pie { margin-top: 4.5rem; padding-top: 1.75rem; border-top: 1px solid var(--borde);
       font-size: .85rem; color: var(--tinta-3); }
.pie a { color: var(--tinta-2); border-bottom-color: var(--borde); }
.pie nav { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-bottom: 1rem; }

/* Índice del documento */
.indice { margin: 2rem 0 0; padding: 0; list-style: none; }
.indice li { margin-bottom: .3rem; }
.indice a { color: var(--tinta-2); border-bottom: none; }
.indice a:hover { color: var(--marca); }
