/* Mobile Menu Button */
.mobile-menu-btn{display:none;width:40px;height:40px;background:transparent;border:none;cursor:pointer;z-index:1001}
.mobile-menu-btn span{display:block;width:24px;height:2px;background:#c9a962;margin:5px auto;transition:all .3s}
.mobile-menu-btn.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-menu-btn.active span:nth-child(2){opacity:0}
.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* Mobile Nav */
.mobile-nav{display:none;position:fixed;top:0;right:-100%;width:80%;max-width:300px;height:100vh;background:#0a0a0a;z-index:1000;transition:right .3s;padding:80px 30px 30px;border-left:1px solid rgba(255,255,255,0.1);overflow-y:auto}
.mobile-nav.active{right:0}
.mobile-nav a{display:block;padding:15px 0;color:#fff;text-decoration:none;font-size:1.1rem;border-bottom:1px solid rgba(255,255,255,0.1)}
.mobile-nav a:hover,.mobile-nav a.active{color:#c9a962}
.mobile-nav-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.7);z-index:999}
.mobile-nav-overlay.active{display:block}

/* Bottom Nav */
.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;background:#111;border-top:1px solid rgba(255,255,255,0.1);padding:8px 0;padding-bottom:calc(8px + env(safe-area-inset-bottom));z-index:100}
.bottom-nav-inner{display:flex;justify-content:space-around;max-width:500px;margin:0 auto}
.bottom-nav-item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#888;font-size:.7rem;padding:5px 10px}
.bottom-nav-item .icon{font-size:1.4rem;margin-bottom:3px}
.bottom-nav-item.active,.bottom-nav-item:hover{color:#c9a962}

@media(max-width:768px){
.mobile-menu-btn{display:block}
.mobile-nav{display:block}
.bottom-nav{display:block}
.header .nav{display:none!important}
body{padding-bottom:70px}
.hero{padding:100px 15px 40px!important}
.hero h1{font-size:2rem!important}
.container{padding:30px 15px!important}
}