/* ===== 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);
}