/*Mai ketchin navbar*/
.navbar{
    position: sticky;
    top:0;
    z-index: 999;
    background: rgba(18,18,18,0.78);
    backdrop-filter: blur(10px);
    border-bottom:1px solid rgba(255,255,255,0.08) ;

}
.nav-container{max-width: 1200px;
                margin:0 auto;
                padding: 14px 20px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap:18px;}
.logo{display: flex;
    align-items: center;
    gap:10px;
    text-decoration: none;}
.logo-mark{width:38px;
        height:38px;
        border-radius: 10px;
        display: grid;
        place-items: center; 
        font-weight: 800;
        letter-spacing: 1px;
        color: #121212;
        background: linear-gradient(135deg,#f7c66f,#e7a84a);}
.logo-text{color:#fff;
        font-weight:700
        ;
        font-size: 18px;
        letter-spacing: 0.4px;}
.nav-links{list-style: none;display: flex;align-items: center;gap:22px;margin:0;padding:0;}      
.nav-links{color:rgba(255,255,255,0.85);
        text-decoration: none;
        font-size:14px;
        letter-spacing: 0.4px;
        padding:8px 2px;
        position: relative;
        transition: 0.25s;}    
.nav-links a{position: relative;
            display: inline-block;
            padding:8px 0;
            text-decoration: none;
            transition: 0.25;
            color:rgba(255,255,255,0.85)}         
.nav-links{font-size:13px;
            font-weight: 500;
            letter-spacing: 0,5px;}        
.nav-links a.active::after,.nav-links a:hover::after{content: "";position: absolute;
                                                        right: 0;
    bottom: -6px;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg,#f7c66f,#e7a84a);
    border-radius: 999px;}
.nav-actions{display: flex;align-items: center;gap: 10px;}
.btn-outline.btn-fill{ text-decoration: none;font-size: 13px;padding:10px 14px;border-radius: 12px;transition: 0.25s;white-space: nowrap;}   
.btn-outline{color:rgba(255,255,255,0.35);
            border:1px solid
           rgba(255,255,255,0.18) }
.btn-outline{color:#f7c66f;
            border:1px solid #f7c66f;
            padding:10px 18px;
            border-radius:12px;
            font-size:14px;
            font-weight:600;}           
.btn-outline:hover{border-color:rgba(255,255,255,0.35);transform: translateY(-1px);}
.btn-fill{color:#121212;background: linear-gradient(135deg,#f7c66f,#e7a84a);font-weight: 700;}   
.btn-fill:hover{filter:brightness(1.05);
                transform: translateY(-1px);}
@media(max-width:900px){.nav-links{display: none;}}
/*end of nav bar*/   
/*hero sec*/
.hero{height:90vh;
    background-image: linear-gradient(rgba(0,0,0,0.55),rgba(0,0,0,0.55)),url(food.im.jpeg);
    background-position: center;
    background-size: cover;
    display: flex;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
padding: 20px;
;}   
.hero-content{color: #fff;
            max-width: 700px;}       
.hero h1{font-size: 42px;
        margin-bottom: 15px;
        font-weight: 800;}    
.hero p{font-size: 18px;
        margin-bottom: 25px;
        color: #f1f1f1;}
.hero-buttons{display: flex;
                gap: 15px;
                justify-content: center;} 
.btn-main{background: #f7c66f;
        color:#121212;
        padding: 12px 22px;
        border-radius: 12px;
        text-decoration: none;
        font-weight: 700;
        transition: 0.3s;}
.btn-main:hover{transform: translateY(-3px);}
.btn-secondary{border: 1px solid #fff;
            color:#fff;
            padding:12px 22px;
            border-radius: 12px;
            text-decoration: none;
            transition: 0.3s;}  
.btn-secondary:hover{background: #fff;
                    color:#121212}  
      /*menu*/              
.menu{
    padding: 70px 20px;
    background: #0f0f0f;
}                    
.menu-container{max-width: 1100px;
                margin: 0 auto;
                text-align: center;  }
.menu-title{color: #f7c66f;
            font-size: 40px;
            margin-bottom: 25px;
            font-weight: 800;}
.menu-link{display: inline-block;
            width: min(900px,95vw);}    
.menu-img{width:100%;
        height: auto;
        display: block;
        border-radius: 18px;
        box-shadow: 0 18px 45px rgba(0,0,0,0.55);}
.menu-hint{margin-top: 12px;
        color:rgba(255,255,255,0.6);
        font-size: 14px;}                                            
.menu h2{color: #f7c66f;}  
.menu-img{image-rendering: auto;
        filter:contrast(1.05) saturate(1.05)}     
@media (max-width:700px){.menu-title{font-size: 28px;}
                        .menu-link{width:95vm}
                        .menu-img{border-radius: 14px;}}
.menu-container{background: rgba(255,255 ,255 ,0.03 );
                border:1px solid rgba(255,255,255,0.8);
                border-radius: 22px;
                padding:25px 18px}  
    /* footer*/            
.footer{
    background: rgba(0,0,0,0.55);
    border-top: 1px solid rgba(255,255,255,0.08);
    padding:40px 18px 16px;
    color:rgba(255,255,255,0.85);
    
}                
.footer-container{max-width: 1100px;
                margin:0 auto;
                    display: flex;
                justify-content: space-between;
                gap:25px;
                align-items: flex-start;}
.footer-logo{
    display: flex;
    align-items: center;
    gap:10px;
    margin-bottom: 10px;}
.footer-desc{margin:0;
            font-size: 14px;
            color:rgba(255,255,255,0.7);
            line-height:1.7}    
.footer-links h4{margin: 0 0 12px;
                font-size:16px;
                color:#fff;}
.footer-btn{
    display:inline-block;
    width:260px;
    max-width:100%;
    padding:11px 14px;
    border-radius: 14px;
    text-decoration: none;
    margin-bottom:10px;
    border: 1px solid rgba(255,255,255,0.15);
    color:rgba(255,255,255,0.9);
    transition: 0.25s;}
.footer-btn:hover{transform: translateY(-2px);
                border-color:rgba(255,255,255,0.28)}
.footer-btn.wa{background: rgba(37,211,102,0.12);}
.footer-btn.fb{background: rgba(24,119,242,0.12);}
.footer-bottom{max-width:1100px;
                margin:18px auto 0;
                padding-top:14px ;
                border-top:1px solid rgba(255,255,255,0.08);
                    font-size: 13px;
                    text-align: center;
                    color:rgba(255,255,255,0.6);
                    }
@media (max-width:850px){.footer-container{flex-direction: column;
                                            align-items: stretch;}}