/* =========================================
   stats-strip.css — Franja de cifras clave
   Compartida por el inicio y el mapa de estaciones
   (partials/stats-strip.blade.php)
   ========================================= */
/* Playfair Display 700 (solo el subconjunto latino, el mismo que servía Google Fonts).
   Se sirve desde el propio sitio: antes eran dos pedidos a fonts.googleapis.com y
   fonts.gstatic.com en cada visita nueva. Licencia en public/fonts/PLAYFAIR-LICENCIA.txt */
@font-face {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/playfair-display-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.stats-strip {
    background: #001730;
    border-bottom: 4px solid #ecc94b;
    padding: 48px 5%;
}

.stats-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto;
}

/* Con una o dos cifras no se estiran a todo el ancho */
.stats-inner--duo {
    max-width: 680px;
}

.stat-item {
    text-align: center;
    flex: 1;
    padding: 0 24px;
}

.stat-num {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 3.5rem;
    font-weight: 700;
    color: #ecc94b;
    line-height: 1;
}

/* El "+" queda alineado al borde superior del número, no flotando con vertical-align. */
.stat-num sup {
    position: relative;
    top: -0.1em;
    font-size: 1.8rem;
    line-height: 1;
    vertical-align: baseline;
    margin-left: 2px;
}

.stat-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 12px;
}

.stat-sep {
    width: 1px;
    height: 60px;
    background: rgba(255, 255, 255, 0.2);
    flex-shrink: 0;
}

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
    .stats-inner {
        gap: 0;
    }
    .stat-item {
        padding: 0 12px;
    }
    .stat-num {
        font-size: 2.6rem;
    }
    .stat-num sup {
        font-size: 1.4rem;
    }
    .stat-label {
        letter-spacing: 2px;
    }
    .stat-sep {
        height: 44px;
    }
}

@media (max-width: 540px) {
    .stats-strip {
        padding: 36px 5%;
    }
    .stats-inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 26px 12px;
    }
    .stat-sep {
        display: none;
    }
    .stat-item {
        padding: 0;
    }
    .stat-label {
        letter-spacing: 1.5px;
    }
    /* Cifra suelta al final (cantidad impar): ocupa toda la fila y queda centrada.
       Los separadores ocultos también cuentan como hijos: por eso 4n+1. */
    .stat-item:last-child:nth-child(4n+1) {
        grid-column: 1 / -1;
    }
}

/* Teléfonos angostos (320-400 px): siguen dos columnas, con números un poco menores.
   Antes se apilaban una por fila y 4 cifras ocupaban ~480 px de alto. */
@media (max-width: 400px) {
    .stats-inner {
        gap: 22px 8px;
    }
    .stat-num {
        font-size: 2.2rem;
    }
    .stat-num sup {
        font-size: 1.2rem;
    }
}

/* Dos cifras caben lado a lado incluso en teléfonos: se conserva la fila con su separador */
@media (max-width: 540px) {
    .stats-inner.stats-inner--duo {
        display: flex;
        gap: 0;
    }
    .stats-inner--duo .stat-sep {
        display: block;
    }
    .stats-inner--duo .stat-item {
        padding: 0 12px;
    }
}