/* ===== Vision Deportiva — Sistema de diseño base ===== */

@font-face { font-family: 'Novecento Slab Wide'; src: url('/assets/fonts/novecento-slab-wide-ultrabold.otf') format('opentype'); font-weight: 800; font-display: swap; }
@font-face { font-family: 'Novecento Slab Wide'; src: url('/assets/fonts/novecento-slab-wide-bold.otf') format('opentype'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Novecento Slab Wide'; src: url('/assets/fonts/novecento-slab-wide-demibold.otf') format('opentype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Novecento Slab Wide'; src: url('/assets/fonts/novecento-slab-wide-book.otf') format('opentype'); font-weight: 400; font-display: swap; }

@font-face { font-family: 'Novecento Slab'; src: url('/assets/fonts/novecento-slab-book.otf') format('opentype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Novecento Slab'; src: url('/assets/fonts/novecento-slab-normal.otf') format('opentype'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Novecento Slab'; src: url('/assets/fonts/novecento-slab-demibold.otf') format('opentype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Novecento Slab'; src: url('/assets/fonts/novecento-slab-bold.otf') format('opentype'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Novecento Slab'; src: url('/assets/fonts/novecento-slab-ultrabold.otf') format('opentype'); font-weight: 900; font-display: swap; }

@font-face { font-family: 'Novecento Slab Condensed'; src: url('/assets/fonts/novecento-slab-condensed-book.otf') format('opentype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Novecento Slab Condensed'; src: url('/assets/fonts/novecento-slab-condensed-demibold.otf') format('opentype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Novecento Slab Condensed'; src: url('/assets/fonts/novecento-slab-condensed-bold.otf') format('opentype'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Novecento Slab Condensed'; src: url('/assets/fonts/novecento-slab-condensed-ultrabold.otf') format('opentype'); font-weight: 900; font-display: swap; }

@font-face { font-family: 'Novecento Slab Narrow'; src: url('/assets/fonts/novecento-slab-narrow-book.otf') format('opentype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Novecento Slab Narrow'; src: url('/assets/fonts/novecento-slab-narrow-medium.otf') format('opentype'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Novecento Slab Narrow'; src: url('/assets/fonts/novecento-slab-narrow-demibold.otf') format('opentype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Novecento Slab Narrow'; src: url('/assets/fonts/novecento-slab-narrow-bold.otf') format('opentype'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Novecento Slab Narrow'; src: url('/assets/fonts/novecento-slab-narrow-ultrabold.otf') format('opentype'); font-weight: 900; font-display: swap; }

:root {
    --vd-navy: #1B2A5E;
    --vd-navy-light: #2C3E7A;
    --vd-red: #E4232C;
    --vd-gray: #A7A9AC;
    --vd-gray-light: #F2F3F5;
    --vd-white: #FFFFFF;
    --vd-ink: #14171F;

    --font-display: 'Novecento Slab Wide', sans-serif;
    --font-body: 'Novecento Slab', sans-serif;
    --font-condensed: 'Novecento Slab Condensed', sans-serif;
    --font-narrow: 'Novecento Slab Narrow', sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: var(--font-body);
    font-weight: 400;
    color: var(--vd-ink);
    background: var(--vd-gray-light);
    line-height: 1.5;
}

h1, h2, h3, .display {
    font-family: var(--font-display);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--vd-navy);
}

.accent-red { color: var(--vd-red); }
.label-condensed { font-family: var(--font-condensed); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.label-narrow { font-family: var(--font-narrow); font-weight: 500; }

/* --- Link "volver" (usado en partido.php, calendario.php, etc.) --- */
.vd-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 16px 0;
    padding: 6px 4px;
    color: var(--vd-navy);
    font-family: var(--font-condensed);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-decoration: none;
    transition: color .15s ease, transform .15s ease;
}
.vd-back-link:hover {
    color: var(--vd-red);
    transform: translateX(-2px);
}

/* ===== LETRA NUEVA (definitiva): Roboto Slab en titulares; Inter en texto, menus y datos. Para volver a Novecento: copiar el respaldo de base.css ===== */
/* Fuentes nuevas (propuesta del diseñador): Roboto Slab en titulares, Inter en texto, menus y datos.
   Se carga DESPUES de base.css y redefine las 4 familias Novecento con el mismo nombre; para volver a la letra anterior basta dejar de cargar este archivo. */
@font-face { font-family:'Inter'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Roboto Slab'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Roboto Slab'; src:url('/assets/fonts/roboto-slab-latin-800-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:100; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-700-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-800-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Wide'; src:url('/assets/fonts/roboto-slab-latin-800-normal.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:100; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:100; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Condensed'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:100; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Novecento Slab Narrow'; src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2'); font-weight:900; font-style:normal; font-display:swap; }
html { font-variant-numeric: tabular-nums; }   /* cifras del mismo ancho: las columnas de las tablas no se mueven */

/* ===== Ajustes de la letra nueva (Inter es mas ancha que la condensada anterior). Solo se cargan en la vista previa (?fuente=nueva). ===== */
/* MENU DEL ENCABEZADO: solo escritorio (de 961 px hacia arriba); el celular conserva sus reglas */
@media (min-width: 961px) {
  html body .vd-nav { gap: 16px; }
  html body .vd-nav a { font-size: 13px; letter-spacing: .3px; white-space: nowrap; }
  html body .vd-social { gap: 16px; margin-left: 20px; padding-left: 20px; }
  html body .vd-logo-link { margin-right: 24px; flex-shrink: 0; }
  html body .vd-header-right { flex-shrink: 0; }
}
@media (min-width: 961px) and (max-width: 1199px) {
  html body .vd-header-inner { padding-left: 16px; padding-right: 16px; }
  html body .vd-nav { gap: 12px; }
  html body .vd-nav a { font-size: 12px; letter-spacing: .2px; }
  html body .vd-social { gap: 12px; margin-left: 14px; padding-left: 14px; }
  html body .vd-social a svg { width: 20px; height: 20px; }
  html body .vd-logo-link { margin-right: 14px; }
}
/* Ventanas angostas de escritorio y tablets horizontales: el menu pasa a un segundo renglon */
@media (min-width: 961px) and (max-width: 1080px) {
  html body .vd-header-inner { flex-wrap: wrap; row-gap: 4px; }
  html body .vd-header-right { display: contents; }
  html body .vd-social { order: 2; margin-left: auto; padding-left: 0; border-left: 0; }
  html body .vd-nav { order: 3; width: 100%; justify-content: space-between; gap: 8px; border-top: 1px solid #e6e8ee; padding-top: 2px; }
  html body .vd-nav a { font-size: 13px; }
}
/* PAGINA DEL PARTIDO: la linea de la liga deja espacio a los lados para que la etiqueta de estado (arriba a la derecha) no la tape */
@media (min-width: 701px) {
  html body .pm-kicker { padding-left: 92px; padding-right: 92px; }
}

/* ===== ENLACES DE EQUIPO EN TABLAS: sin color de enlace ni subrayado; al pasar el mouse se subrayan ===== */
html body a.st-team-link,
html body a.st-team-link:visited { color: inherit; text-decoration: none; }
html body a.st-team-link:hover { text-decoration: underline; }

/* ===== ENLACES DE EQUIPO EN STATS EQUIPO: mismo trato que en las tablas ===== */
html body td.team-name-cell a,
html body td.team-name-cell a:visited { color: inherit; text-decoration: none; }
html body td.team-name-cell a:hover { text-decoration: underline; }
