/* ============================================================
   UI polish — scroll progress bar, active nav link, back-to-top
   ============================================================ */

/* Scroll progress bar (top of page) */
.scroll-progress {
    position: fixed;
    top: 0; left: 0;
    height: 3px; width: 0%;
    background: var(--gold-grad);
    z-index: 150;
    transition: width .08s linear;
    box-shadow: 0 0 12px rgba(245,199,106,0.5);
}

/* Active nav link (underline on the current section) */
.nav .nav__link { position: relative; }
.nav__link.active:not(.nav__cta) { color: var(--gold-soft); }
.nav__link.active:not(.nav__cta)::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -7px;
    height: 2px; border-radius: 2px;
    background: var(--gold-grad);
}
.nav__link.nav__cta.active { box-shadow: 0 0 0 2px rgba(245,199,106,0.35); }

/* Back-to-top button */
.to-top {
    position: fixed;
    right: 22px; bottom: 22px;
    z-index: 120;
    width: 46px; height: 46px;
    border-radius: 50%;
    display: grid; place-items: center;
    border: 1px solid var(--line);
    background: rgba(11,16,32,0.9);
    color: var(--gold);
    font-size: 1rem;
    cursor: pointer;
    opacity: 0;
    transform: translateY(14px);
    pointer-events: none;
    backdrop-filter: blur(8px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.45);
    transition: opacity .3s ease, transform .3s ease, background .2s ease, color .2s ease;
}
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
.to-top:hover { background: var(--gold-grad); color: #1a1405; transform: translateY(-2px); }

@media (max-width: 620px) {
    .to-top { right: 16px; bottom: 16px; width: 42px; height: 42px; }
}