/* SPLASH SCREEN & PRESENTACIÓN */
        #splash-screen {
            position: fixed;
            inset: 0;
            z-index: 999999;
            background: linear-gradient(135deg, #ffffff 0%, #f8fafc 50%, #f1f5f9 100%);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            text-align: center;
            overflow: hidden;
            transition: opacity 0.55s ease, visibility 0.55s ease;
        }

        /* Tema Splash Inicio / Hub: Blancos y Claros */
        #splash-screen.splash-hub {
            background: linear-gradient(135deg, #ffffff 0%, #f8fafc 50%, #f1f5f9 100%);
            color: #0f172a;
        }
        #splash-screen.splash-hub .splash-title {
            color: #0f172a;
            text-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
        }
        #splash-screen.splash-hub .splash-title span {
            color: #008844;
        }
        #splash-screen.splash-hub .splash-subtitle {
            color: #64748b;
        }
        #splash-screen.splash-hub .splash-road-line {
            background: #e2e8f0;
            border-bottom: 2px dashed #cbd5e1;
        }

        /* Tema Splash Metropolitano: Verde Institucional */
        #splash-screen.splash-metro {
            background: linear-gradient(135deg, #004d26 0%, #008844 50%, #059669 100%);
            color: #ffffff;
        }
        #splash-screen.splash-metro .splash-title {
            color: #ffffff;
            text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
        }
        #splash-screen.splash-metro .splash-title span {
            color: #86efac;
        }
        #splash-screen.splash-metro .splash-subtitle {
            color: rgba(255, 255, 255, 0.92);
        }
        #splash-screen.splash-metro .splash-road-line {
            background: rgba(255, 255, 255, 0.25);
            border-bottom: 2px dashed rgba(255, 255, 255, 0.6);
        }

        /* Tema Splash EMT Málaga: Celestes Claros */
        #splash-screen.splash-emt {
            background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #bae6fd 100%);
            color: #004481;
        }
        #splash-screen.splash-emt .splash-title {
            color: #004481;
            text-shadow: 0 4px 15px rgba(0, 68, 129, 0.1);
        }
        #splash-screen.splash-emt .splash-title span {
            color: #005596;
        }
        #splash-screen.splash-emt .splash-subtitle {
            color: #0369a1;
            font-weight: 600;
        }
        #splash-screen.splash-emt .splash-road-line {
            background: #bae6fd;
            border-bottom: 2px dashed #0284c7;
        }

        #splash-screen.splash-hidden {
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
        }

        .splash-content {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            z-index: 2;
            padding: 1.5rem;
            max-width: 700px;
        }

        .splash-title {
            font-family: 'Outfit', sans-serif;
            font-size: clamp(2.4rem, 6vw, 4rem);
            font-weight: 800;
            letter-spacing: -0.02em;
            margin: 0;
            animation: splashTitleIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        .splash-subtitle {
            font-size: clamp(0.9rem, 2.2vw, 1.2rem);
            font-weight: 500;
            margin-top: 0.65rem;
            letter-spacing: 0.04em;
            animation: splashSubIn 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        }

        .splash-bus-track {
            width: 100%;
            position: absolute;
            bottom: 14%;
            left: 0;
            height: 145px;
            overflow: visible;
            pointer-events: none;
        }

        .splash-road-line {
            position: absolute;
            bottom: 20px;
            left: 0;
            right: 0;
            height: 3px;
            background: rgba(255, 255, 255, 0.25);
            border-bottom: 2px dashed rgba(255, 255, 255, 0.6);
        }

        .splash-bus {
            position: absolute;
            bottom: 14px;
            left: -330px;
            display: flex;
            align-items: center;
            will-change: transform;
            animation: busDriveAcross 3.0s linear forwards;
        }

        .splash-bus-svg {
            filter: drop-shadow(0 12px 22px rgba(0,0,0,0.48));
        }

        @keyframes splashTitleIn {
            0% { opacity: 0; transform: translateY(-25px) scale(0.94); }
            100% { opacity: 1; transform: translateY(0) scale(1); }
        }

        @keyframes splashSubIn {
            0% { opacity: 0; transform: translateY(18px); }
            100% { opacity: 1; transform: translateY(0); }
        }

        /* Entrada pausada y suave con parada limpia en el centro y salida progresiva */
        @keyframes busDriveAcross {
            0% {
                transform: translate3d(0, 0, 0);
                animation-timing-function: cubic-bezier(0.35, 0.85, 0.55, 1);
            }
            50% {
                transform: translate3d(calc(50vw + 167px), 0, 0);
                animation-timing-function: ease-in-out;
            }
            58% {
                transform: translate3d(calc(50vw + 167px), 0, 0);
                animation-timing-function: cubic-bezier(0.4, 0, 0.8, 0.5);
            }
            100% {
                transform: translate3d(calc(100vw + 550px), 0, 0);
            }
        }

        /* Modo Fade Rápido para visitas repetidas: permanece 1 segundo extra y oculta bus */
        .splash-fast .splash-bus-track,
        .splash-fast .splash-bus,
        .splash-fast .splash-road-line {
            display: none !important;
            visibility: hidden !important;
            opacity: 0 !important;
        }
        .splash-fast .splash-title {
            animation: splashFadeQuick 1.85s ease forwards;
        }
        .splash-fast .splash-subtitle {
            animation: splashFadeQuick 1.85s ease forwards;
        }
        @keyframes splashFadeQuick {
            0% { opacity: 0; transform: scale(0.97); }
            15% { opacity: 1; transform: scale(1); }
            80% { opacity: 1; transform: scale(1); }
            100% { opacity: 0; transform: scale(1.02); }
        }