/* Lotus Floating Section Nav (Lite)
   - white bar
   - black text
   - horizontally scrollable on mobile
   - active highlight (orange)
   - This row is intended to live visually under the main header nav.
*/

/* Outer bar row */
.lotus-section-bar-wrapper {
    width: 100%;
    background: #fff;
    color: #000;
    border-bottom: 1px solid rgba(0,0,0,0.15);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    position: relative;
    z-index: 3; /* keep this below mega menus if they sit at 80-100 */
    /* by default `display:none;` inline -- JS will reveal it */
    opacity: 1;
    transition: opacity .15s ease;
}

/* Inner flex container */
.lotus-section-bar {
    max-width: 1280px;
    margin: 0 auto;
    padding: 10px 16px;
    display: flex;
    flex-wrap: nowrap;
    gap: 24px;

    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
}

/* Hide native scrollbar in WebKit */
.lotus-section-bar::-webkit-scrollbar {
    display: none;
}

/* Links */
.lotus-section-bar_link {
    font-family: Poppins, system-ui, sans-serif;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
    color: #000;
    text-decoration: none;
    white-space: nowrap;
    transition: color .15s ease, border-color .15s ease;
}

.lotus-section-bar_link:hover {
    color: #000;
    border-bottom-color: rgba(0,0,0,0.4);
}

/* Active / "currently in this section" */
.lotus-section-bar_link.is-active {
    color: #ff6b1a;
}

/* Mobile tweaks */
@media (max-width: 768px) {
    .lotus-section-bar {
        gap: 20px;
        padding-left: 12px;
        padding-right: 12px;
    }
    .lotus-section-bar_link {
        font-size: 15px;
        font-weight: 500;
    }
}

/* Desktop tweaks */
@media (min-width: 1024px) {
    .lotus-section-bar {
        gap: 32px;
        padding-left: 24px;
        padding-right: 24px;
    }
    .lotus-section-bar_link {
        font-size: 14px;
        letter-spacing: .03em;
    }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .lotus-section-bar_link {
        transition: none;
    }
}