*{margin:0;padding:0;box-sizing:border-box}
:root{
  --accent:#c4b5a0;
  --bg:#0f0e0c;
  --text:#ece8e4;
  --dim:#7a756f;
}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:210;display:flex;align-items:center;justify-content:space-between;padding:20px 40px}
.nav__logo{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:400;letter-spacing:1px;color:var(--text)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px;z-index:201}
.burger span{display:block;width:22px;height:1px;background:var(--text);transition:all .35s cubic-bezier(.4,0,.2,1);transform-origin:center}
.burger.active span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile-menu{position:fixed;inset:0;background:rgba(15,14,12,0.98);z-index:200;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
.mobile-menu.active{opacity:1;pointer-events:all}
.mobile-menu__inner{display:flex;flex-direction:column;align-items:center;gap:36px}
.mobile-menu__link{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,5vw,2.8rem);font-weight:300;color:var(--dim);text-decoration:none;opacity:0;transform:translateY(20px);transition:color .3s,opacity .4s,transform .4s}
.mobile-menu.active .mobile-menu__link{opacity:1;transform:translateY(0)}
.mobile-menu__link:hover{color:var(--text)}
.mobile-menu.active .mobile-menu__link:nth-child(1){transition-delay:.08s}
.mobile-menu.active .mobile-menu__link:nth-child(2){transition-delay:.14s}
.mobile-menu.active .mobile-menu__link:nth-child(3){transition-delay:.20s}
.mobile-menu.active .mobile-menu__link:nth-child(4){transition-delay:.26s}

/* HERO */
.hero-menu{min-height:32vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 20px 60px}
.hero-menu__label{font-size:0.68rem;letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:16px;display:block}
.hero-menu h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,5vw,3.4rem);font-weight:300;margin-bottom:16px}
.hero-menu p{color:var(--dim);font-size:0.92rem;line-height:1.8}

/* MENU */
.menu{max-width:1200px;margin:0 auto;padding:0 clamp(16px,4vw,40px) 100px}

.menu__toolbar{position:sticky;top:0;z-index:50;background:var(--bg);padding:24px 0 16px;border-bottom:1px solid rgba(255,255,255,0.06);margin-bottom:8px}
.menu__cats{display:flex;gap:6px;overflow-x:auto;padding-bottom:14px;scrollbar-width:none}
.menu__cats::-webkit-scrollbar{display:none}
.menu__cat{padding:8px 20px;border:1px solid rgba(255,255,255,0.08);background:transparent;color:var(--dim);font-family:'Inter',sans-serif;font-size:0.78rem;letter-spacing:0.5px;cursor:pointer;transition:all .3s;white-space:nowrap;border-radius:0}
.menu__cat:hover{border-color:var(--accent);color:var(--text)}
.menu__cat.active{background:var(--accent);border-color:var(--accent);color:var(--bg)}

.menu__filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.menu__search{flex:1;min-width:200px;padding:10px 16px;background:transparent;border:1px solid rgba(255,255,255,0.08);color:var(--text);font-family:'Inter',sans-serif;font-size:0.82rem;outline:none;transition:border-color .3s}
.menu__search::placeholder{color:var(--dim)}
.menu__search:focus{border-color:var(--accent)}
.menu__sort{padding:10px 14px;background:transparent;border:1px solid rgba(255,255,255,0.08);color:var(--text);font-family:'Inter',sans-serif;font-size:0.82rem;cursor:pointer;outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%237a756f' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:30px}
.menu__sort option{background:var(--bg);color:var(--text)}
.menu__diet{display:flex;gap:6px}
.menu__diet-btn{padding:8px 16px;border:1px solid rgba(255,255,255,0.08);background:transparent;color:var(--dim);font-family:'Inter',sans-serif;font-size:0.75rem;cursor:pointer;transition:all .3s;white-space:nowrap}
.menu__diet-btn:hover{border-color:var(--accent);color:var(--text)}
.menu__diet-btn.active{background:var(--accent);border-color:var(--accent);color:var(--bg)}

.menu__count{padding:16px 0 0;font-size:0.78rem;color:var(--dim)}
.menu__count strong{color:var(--accent)}

/* GRID */
.menu__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:24px 0}

/* CARD */
.dish{position:relative;border:1px solid rgba(255,255,255,0.06);cursor:pointer;transition:border-color .3s}
.dish:hover{border-color:rgba(255,255,255,0.12)}
.dish__img{height:220px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.dish__badges{position:absolute;top:12px;left:12px;display:flex;gap:6px}
.dish__badge{padding:3px 10px;font-size:0.6rem;letter-spacing:1px;text-transform:uppercase;font-weight:500}
.badge--new{background:rgba(61,90,76,0.9);color:#b7e4c7}
.badge--popular{background:rgba(107,91,123,0.9);color:#d4c8e0}
.badge--chef{background:var(--accent);color:var(--bg)}
.dish__body{padding:20px}
.dish__cat{font-size:0.6rem;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:6px;display:block}
.dish__name{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:400;margin-bottom:6px}
.dish__desc{font-size:0.78rem;color:var(--dim);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}
.dish__bottom{display:flex;align-items:center;justify-content:space-between}
.dish__price{font-size:1.05rem;font-weight:500;color:var(--accent)}
.dish__add{width:34px;height:34px;border:1px solid rgba(255,255,255,0.1);background:transparent;color:var(--text);font-size:1.1rem;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center}
.dish__add:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}

/* EMPTY */
.menu__empty{text-align:center;padding:80px 0}
.menu__empty h3{margin-bottom:8px;font-weight:300}
.menu__empty p{color:var(--dim);font-size:0.88rem}

/* CART */
.cart{position:fixed;bottom:24px;right:24px;width:340px;background:var(--bg);border:1px solid rgba(255,255,255,0.06);z-index:100;transition:transform .4s cubic-bezier(.16,1,.3,1);transform:translateY(calc(100% + 30px))}
.cart.visible{transform:translateY(0)}
.cart__head{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid rgba(255,255,255,0.06)}
.cart__head span{font-size:0.82rem;letter-spacing:1px;text-transform:uppercase;color:var(--dim)}
.cart__clear{background:none;border:none;color:var(--dim);cursor:pointer;font-size:0.75rem;transition:color .3s}
.cart__clear:hover{color:#d48a8a}
.cart__items{max-height:200px;overflow-y:auto;padding:10px 20px}
.cart__items::-webkit-scrollbar{width:2px}
.cart__items::-webkit-scrollbar-thumb{background:var(--accent)}
.cart__empty{color:var(--dim);text-align:center;padding:16px 0;font-size:0.82rem}
.cart-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,0.04)}
.cart-item:last-child{border-bottom:none}
.cart-item__info{flex:1}
.cart-item__name{font-size:0.82rem}
.cart-item__price{color:var(--accent);font-size:0.75rem}
.cart-item__qty{display:flex;align-items:center;gap:8px}
.cart-item__qty button{width:26px;height:26px;border:1px solid rgba(255,255,255,0.08);background:transparent;color:var(--accent);cursor:pointer;font-size:0.8rem;transition:all .2s;display:flex;align-items:center;justify-content:center}
.cart-item__qty button:hover{background:var(--accent);color:var(--bg)}
.cart-item__qty span{font-size:0.82rem;min-width:18px;text-align:center}
.cart-item__remove{background:none;border:none;color:var(--dim);cursor:pointer;font-size:0.85rem;transition:color .3s;padding:2px}
.cart-item__remove:hover{color:#d48a8a}
.cart__foot{padding:14px 20px;border-top:1px solid rgba(255,255,255,0.06)}
.cart__total{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:0.92rem}
.cart__total strong{color:var(--accent);font-size:1.1rem}
.cart__order{width:100%;padding:12px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-family:'Inter',sans-serif;font-size:0.78rem;font-weight:400;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:all .3s}
.cart__order:hover{background:var(--accent);color:var(--bg)}

/* MODAL */
.modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s}
.modal.active{opacity:1;pointer-events:all}
.modal__bg{position:absolute;inset:0;background:rgba(0,0,0,0.92)}
.modal__box{position:relative;max-width:520px;width:90%;max-height:90vh;overflow-y:auto;background:var(--bg);border:1px solid rgba(255,255,255,0.06)}
.modal__close{position:absolute;top:12px;right:12px;width:36px;height:36px;background:rgba(0,0,0,0.5);border:none;color:var(--text);font-size:1.3rem;cursor:pointer;z-index:2;transition:background .3s;display:flex;align-items:center;justify-content:center}
.modal__close:hover{background:var(--accent);color:var(--bg)}
.modal__img{height:260px;background-size:cover;background-position:center;position:relative}
.modal__img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(15,14,12,0.6),transparent)}
.modal__body{padding:28px}
.modal__cat{font-size:0.65rem;letter-spacing:2px;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:8px}
.modal__body h2{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:300;margin-bottom:12px}
.modal__desc{color:var(--dim);font-size:0.88rem;line-height:1.7;margin-bottom:20px}
.modal__info{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:16px;border:1px solid rgba(255,255,255,0.06);margin-bottom:20px}
.modal__info div{text-align:center}
.modal__info span{display:block;font-size:0.6rem;letter-spacing:1px;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.modal__info strong{font-size:0.88rem;color:var(--accent)}
.modal__tags{display:flex;gap:6px;margin-bottom:24px;flex-wrap:wrap}
.modal__tags span{padding:4px 12px;font-size:0.72rem;border:1px solid rgba(255,255,255,0.08);color:var(--dim)}
.modal__foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.modal__price{font-size:1.4rem;font-weight:500;color:var(--accent)}
.modal__qty{display:flex;align-items:center;gap:12px;margin-left:auto}
.modal__qty button{width:36px;height:36px;border:1px solid rgba(255,255,255,0.1);background:transparent;color:var(--accent);font-size:1.1rem;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center}
.modal__qty button:hover{background:var(--accent);color:var(--bg)}
.modal__qty span{font-size:1rem;min-width:20px;text-align:center}

/* TOAST */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);background:var(--accent);color:var(--bg);padding:12px 28px;font-weight:500;font-size:0.82rem;z-index:10000;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.toast.visible{transform:translateX(-50%) translateY(0)}

/* FOOTER */
.footer{display:flex;align-items:center;justify-content:space-between;padding:24px 40px;border-top:1px solid rgba(255,255,255,0.06);font-size:0.78rem;color:var(--dim)}
.footer__back{color:var(--accent);display:inline-flex;align-items:center;gap:6px;transition:color .3s}
.footer__back:hover{color:var(--text)}
.footer__back svg{transition:transform .3s}
.footer__back:hover svg{transform:translateX(-3px)}

/* RESPONSIVE */
@media(max-width:1024px){
  .menu__grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
}
@media(max-width:768px){
  .burger{display:flex}
  .nav{padding:16px 20px}
  .hero-menu{min-height:24vh;padding:80px 20px 40px}
  .menu__toolbar{position:static}
  .menu__grid{grid-template-columns:1fr 1fr}
  .dish__img{height:180px}
  .cart{width:calc(100% - 48px);left:24px;right:24px}
  .footer{padding:20px;flex-direction:column;gap:8px;text-align:center}
  .modal__info{grid-template-columns:1fr}
  .menu__filters{flex-direction:column}
  .menu__search,.menu__sort{width:100%}
}
@media(max-width:480px){
  .menu__grid{grid-template-columns:1fr}
  .dish__img{height:240px}
}