/* Botón flotante "scroll to top" */
#scrollToTop {
    position: fixed;
    display: none;
    background-color: #9e0202; /* Bordó oscuro como navbar */
    color: #fff;
    padding: 10px 14px;
    font-size: 18px;
    border-radius: 40%; /* Redondo para que se vea moderno */
    right: 20px;
    bottom: 20px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 9999; /* Por encima de todo */
}

    /* Hover: mismo efecto que tus enlaces */
    #scrollToTop:hover {
        background-color: #590303; /* Bordó más oscuro */
        color: #f44336; /* Rojo claro como hover de links */
        transform: translateY(-4px); /* Levitación */
        box-shadow: 0 6px 12px rgba(0,0,0,0.4);
    }

    /* Mostrar botón cuando hay scroll */
    #scrollToTop.show {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Ícono dentro del botón (ej: flecha ↑ en SVG o FontAwesome) */
    #scrollToTop i,
    #scrollToTop svg {
        font-size: 20px;
        pointer-events: none;
    }

/* Ocultar en móviles (como lo tenías) */
@media (max-width: 768px) {
    #scrollToTop {
        display: none !important;
    }
}