/**
 * =========================================================
 * Building Navigation
 * ========================================================= */

.building-nav{

    position:sticky;

    top:var(--header-height);

    z-index:var(--building-nav-z-index);

    height:var(--building-nav-height);

    background:#fff;

    border-bottom:1px solid var(--color-border);

    box-shadow:0 2px 12px rgba(0,0,0,.04);

}

.building-nav-inner{

    display:flex;

    align-items:center;

    overflow-x:auto;

    overflow-y:hidden;

    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;

}

.building-nav-inner::-webkit-scrollbar{

    display:none;

}

.building-nav-link{

    position:relative;

    flex:1 0 auto;

    min-width:92px;

    height:64px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:6px;

    text-decoration:none;

    color:var(--text-secondary,#6b7280);

    transition:
        color .2s,
        background .2s;

    user-select:none;

    -webkit-tap-highlight-color:transparent;

}

.building-nav-link:hover{

    color:var(--primary);

    background:#fafafa;

}

.building-nav-link.is-active{

    color:var(--primary);

}

.building-nav-link::after{

    content:"";

    position:absolute;

    left:18px;

    right:18px;

    bottom:0;

    height:3px;

    border-radius:999px;

    background:var(--primary);

    transform:scaleX(0);

    transform-origin:center;

    transition:transform .25s;

}

.building-nav-link.is-active::after{

    transform:scaleX(1);

}

.building-nav-icon{

    display:flex;

    align-items:center;

    justify-content:center;

}

.building-nav-icon svg{

    width:20px;

    height:20px;

}

.building-nav-text{

    font-size:12px;

    font-weight:600;

    white-space:nowrap;

}

/* ==========================
   Tablet
========================== */

@media (min-width:768px){

    .building-nav-inner{

        justify-content:center;

    }

    .building-nav-link{

        min-width:120px;

        height:68px;

    }

    .building-nav-text{

        font-size:13px;

    }

}

/* ==========================
   Desktop
========================== */

@media (min-width:1200px){

    .building-nav{

        backdrop-filter:blur(12px);

        -webkit-backdrop-filter:blur(12px);

    }

    .building-nav-inner{

        max-width:1200px;

        margin:0 auto;

    }

}