/* NGIS responsive utility bar and market ticker */
:root {
    --ngis-utility-height: 76px;
    --ngis-topbar-height: 36px;
    --ngis-ticker-height: 40px;
    --ngis-utility-navy: #061a31;
    --ngis-utility-blue: #0a2b4f;
    --ngis-utility-gold: #d5ae63;
}

body { padding-top: 0; }

.ngis-utility-stack {
    position: relative;
    z-index: 900;
    width: 100%;
    box-shadow: 0 5px 18px rgba(3, 17, 33, .14);
}

.ngis-utility-container {
    width: min(1400px, 100%);
    margin: 0 auto;
    padding: 0 2rem;
}

.ngis-topbar {
    height: var(--ngis-topbar-height);
    color: rgba(255, 255, 255, .8);
    background: var(--ngis-utility-navy);
    font-size: .7rem;
    letter-spacing: .04em;
}

.ngis-topbar .ngis-utility-container,
.ngis-market-ticker-inner {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ngis-opening-hours,
.ngis-topbar-links,
.ngis-market-label,
.ngis-market-quote { display: inline-flex; align-items: center; }
.ngis-opening-hours i { color: var(--ngis-utility-gold); margin-right: .5rem; }
.ngis-topbar-links { gap: .75rem; }
.ngis-topbar-label { color: rgba(255, 255, 255, .55); text-transform: uppercase; font-size: .62rem; letter-spacing: .1em; }
.ngis-topbar-links a { color: rgba(255, 255, 255, .82); transition: color .2s ease, transform .2s ease; }
.ngis-topbar-links a:hover { color: var(--ngis-utility-gold); transform: translateY(-1px); }

.ngis-market-ticker {
    height: var(--ngis-ticker-height);
    color: #fff;
    background: linear-gradient(90deg, var(--ngis-utility-blue), #103c67 50%, var(--ngis-utility-blue));
    border-top: 1px solid rgba(213, 174, 99, .18);
}
.ngis-market-label { flex: 0 0 auto; gap: .55rem; color: var(--ngis-utility-gold); font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.ngis-live-dot { width: 6px; height: 6px; border-radius: 50%; background: #57d49a; box-shadow: 0 0 0 4px rgba(87, 212, 154, .14); }
.ngis-market-viewport { flex: 1 1 auto; min-width: 0; overflow: hidden; margin: 0 1.5rem; }
.ngis-market-track { display: flex; width: max-content; }
.ngis-market-track-item { display: flex; align-items: center; animation: ngis-market-scroll 72s linear infinite; }
.ngis-market-track-item + .ngis-market-track-item { margin-left: 2rem; }
.ngis-market-ticker:hover .ngis-market-track-item,
.ngis-market-ticker:focus-within .ngis-market-track-item { animation-play-state: paused; }
.ngis-market-quote { gap: .55rem; margin-right: 2.25rem; white-space: nowrap; font-size: .76rem; }
.ngis-market-quote strong { color: #fff; font-size: .7rem; letter-spacing: .08em; }
.ngis-market-quote.is-positive .ngis-market-change { color: #70dfaa; }
.ngis-market-quote.is-negative .ngis-market-change { color: #ff9a9a; }
.ngis-market-change::before { content: '↗'; margin-right: .2rem; }
.is-negative .ngis-market-change::before { content: '↘'; }
.ngis-market-status { color: rgba(255, 255, 255, .68); font-size: .75rem; }
.ngis-market-updated { flex: 0 0 auto; color: rgba(255, 255, 255, .5); font-size: .62rem; }

@keyframes ngis-market-scroll { from { transform: translateX(0); } to { transform: translateX(-100%); } }

.ngis-navbar { top: 0; }
.ngis-hero-carousel { padding-top: 0; }

@media (max-width: 767px) {
    :root { --ngis-utility-height: 86px; --ngis-topbar-height: 43px; --ngis-ticker-height: 43px; }
    .ngis-utility-container { padding: 0 1rem; }
    .ngis-topbar { font-size: .62rem; }
    .ngis-topbar-label { display: none; }
    .ngis-topbar-links { gap: .65rem; }
    .ngis-market-label span:not(.ngis-live-dot) { display: none; }
    .ngis-market-viewport { margin: 0 .8rem; }
    .ngis-market-updated { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ngis-market-track-item { animation: none; }
}