/* Mobile restaurant experience: restaurant identity, menu discovery and ordering access. */
@media (max-width: 767px) {
  body { background: #f4f7f4; padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  body > .site-header, body > .site-footer { display: none !important; }
  .restaurant-hero {
    height: 422px;
    min-height: 422px;
    margin: 0;
    padding: 0;
    align-items: stretch;
    border-radius: 0 0 30px 30px;
    background: #083d24;
  }
  .restaurant-hero-img { animation: none; filter: saturate(.9); }
  .restaurant-hero-overlay--dark { background: linear-gradient(180deg, rgba(4, 35, 19, .48) 0%, rgba(4, 35, 19, .08) 34%, rgba(4, 35, 19, .88) 100%); }
  .restaurant-hero-overlay--gradient { background: radial-gradient(circle at 82% 16%, rgba(242, 106, 27, .24), transparent 32%); }
  .restaurant-hero-nav { top: 0; padding: 15px 16px; }
  .restaurant-hero-nav .container { display: flex; align-items: center; justify-content: space-between; padding: 0; }
  .back-link {
    gap: 0;
    width: 40px;
    height: 40px;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 13px;
    background: rgba(7, 41, 22, .47);
    backdrop-filter: blur(12px);
  }
  .back-link span { display: none; }.back-link svg { width: 21px; height: 21px; }
  .restaurant-mobile-cart {
    position: relative;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 13px;
    background: rgba(7, 41, 22, .47);
    color: #fff;
    backdrop-filter: blur(12px);
  }
  .restaurant-mobile-cart svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .restaurant-mobile-cart-count { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; align-items: center; justify-content: center; padding: 0 4px; border: 2px solid #fff; border-radius: 99px; background: #FF7000; color: #fff; font-size: 8px; font-weight: 800; }
  .restaurant-hero-content { padding: 0 18px 23px; }
  .restaurant-hero-content .container { padding: 0; }
  .hero-info-wrapper { display: block; }.hero-main-info { margin: 0; animation: none; }
  .hero-title { max-width: 320px; margin-bottom: 10px; font-family: 'Poppins', system-ui, sans-serif; font-size: clamp(28px, 8vw, 34px); line-height: 1.08; letter-spacing: -1px; }
  .hero-meta { margin-bottom: 10px; gap: 7px; }.meta-item { gap: 6px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.16); border-radius: 11px; background: rgba(255,255,255,.12); font-size: 10.5px; }.meta-icon { width: 15px; height: 15px; color: #FF7000; }.meta-icon svg { width: 15px; height: 15px; }
  .hero-description { display: -webkit-box; max-width: 310px; overflow: hidden; margin-bottom: 11px; font-size: 12px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .hero-address { max-width: 100%; gap: 6px; padding: 6px 9px; border-radius: 11px; background: rgba(255,255,255,.1); font-size: 10.5px; }.hero-address span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .menu-section { position: relative; z-index: 2; margin-top: -11px; padding: 24px 0 20px; border-radius: 28px 28px 0 0; background: #f4f7f4; }.menu-section .container { padding: 0 16px; }
  .menu-section-title { margin-bottom: 14px; color: #153324; font-family: 'Poppins', system-ui, sans-serif; font-size: 20px; letter-spacing: -.55px; }.menu-section-title::after { display: block; margin-top: 3px; color: #74847b; content: 'Choose what you are craving today'; font-size: 10.5px; font-weight: 500; letter-spacing: 0; }
  .food-search-wrapper { margin-bottom: 14px; }.food-search-container { min-height: 51px; padding: 0 12px; border: 1px solid #dde7df; border-radius: 16px; background: #fff; box-shadow: 0 8px 18px rgba(8, 56, 30, .06); }.food-search-input { font-size: 12px; }.food-search-icon { width: 18px; height: 18px; color: #64786c; }
  .category-tabs { gap: 8px; margin: 0 -16px 16px; padding: 0 16px 3px; overflow-x: auto; scrollbar-width: none; }.category-tabs::-webkit-scrollbar { display: none; }.category-tab { flex: 0 0 auto; padding: 8px 13px; border: 1px solid #dbe7de; border-radius: 999px; background: #fff; color: #64786c; font-size: 10.5px; font-weight: 600; }.category-tab.active { border-color: #0b6b3a; background: #0b6b3a; color: #fff; }
  .foods-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.food-card { overflow: hidden; border: 1px solid #e1e9e3; border-radius: 19px; background: #fff; box-shadow: 0 8px 20px rgba(8, 56, 30, .065); }.food-image { height: 118px; }.food-content { padding: 11px; }.food-name { overflow: hidden; margin-bottom: 3px; color: #1d3326; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.food-description { display: -webkit-box; min-height: 30px; overflow: hidden; margin-bottom: 8px; color: #718178; font-size: 9.5px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.food-price { color: #d96012; font-size: 13px; }.add-to-cart-btn { min-height: 32px; margin-top: 8px; padding: 6px 8px; border-radius: 10px; background: #0b6b3a; font-size: 10px; }.add-to-cart-btn:active { transform: scale(.97); }
  .foods-loading { grid-column: 1 / -1; min-height: 160px; border: 1px dashed #ccdbd0; border-radius: 18px; background: #fff; }
  .food-modal-content { width: calc(100% - 24px); max-height: 88vh; border-radius: 24px; }.food-modal-body { padding: 14px; }.food-modal-image { height: 180px; }.modal-add-to-cart { border-radius: 14px; background: #0b6b3a; }
}
@media (max-width: 359px) {
  .restaurant-hero { height: 390px; min-height: 390px; }.hero-title { font-size: 27px; }.menu-section .container { padding: 0 13px; }.foods-grid { gap: 9px; }.food-image { height: 104px; }.food-content { padding: 9px; }.food-name { font-size: 11px; }.add-to-cart-btn { font-size: 9px; }
}