.hero-bg {
    background: linear-gradient(rgba(11, 19, 37, 0.2), rgba(11, 19, 37, 0.4)), url('../img/trading-division-Background.png') no-repeat center center / cover;
}

.metallic-text {
    background: linear-gradient(to bottom, #fff 0%, #b3b3b3 50%, #808080 51%, #ccc 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    /* Using drop-shadow here can sometimes cause rendering bugs in Safari/Chrome. 
       If the shadow is lost, apply filter: drop-shadow(...) on the parent container instead. */
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.5));
}