:root {
      /* Чуть-чуть освежили фон для крутого контраста с белыми карточками */
      --bg: #fcf9f2;
      --bg-soft: #fffdf8;
      --card: #ffffff;
      --text: #1f140d;
      --muted: #74604f;
      --line: #ead9c2;
      --line-soft: #f2e7d8;
      --accent: #ffbf18;
      --accent-2: #f1a81c;
      --brown: #8b4513;
      --red: #bb4a20;
      --dark: #171717;
      --shadow: 0 18px 40px rgba(69, 39, 16, 0.08);
      --shadow-soft: 0 10px 22px rgba(69, 39, 16, 0.05);
      --container: 1180px;
      --header-top: 88px;
      --ease: cubic-bezier(.22, 1, .36, 1);
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    
    body {
      margin: 0;
      color: var(--text);
      /* Базовый чистый шрифт для текстов, цен и описаний */
      font-family: 'Inter', system-ui, sans-serif;
      background:
        radial-gradient(circle at top right, rgba(255, 191, 24, 0.06), transparent 22%),
        radial-gradient(circle at bottom left, rgba(139, 69, 19, 0.035), transparent 26%),
        linear-gradient(180deg, var(--bg-soft) 0%, var(--bg) 100%);
      overflow-x: hidden;
    }

    /* === СИЛЬНАЯ УЛИЧНАЯ ТИПОГРАФИКА ДЛЯ ЗАГОЛОВКОВ И КНОПОК === */
    h1, h2, h3, h4, .brand-copy strong, .featured-badge, .hero-badge, .hero-call, .hero-menu-link, .quick-pill {
      font-family: 'Montserrat', sans-serif;
    }

    /* Заголовкам секций даем брутальный капс (Все буквы большие) */
    .section-head h2 {
      text-transform: uppercase;
      letter-spacing: -0.01em;
    }

    a { text-decoration: none; color: inherit; }
    img { display: block; max-width: 100%; }
    button { font: inherit; }

    .container {
      width: min(var(--container), calc(100% - 24px));
      margin: 0 auto;
    }

    /* === ШАПКА === */
    .topbar {
      position: sticky;
      top: 0;
      z-index: 180;
      background: linear-gradient(180deg, rgba(19,19,19,.98) 0%, rgba(28,24,20,.96) 100%);
      border-bottom: 1px solid rgba(255, 191, 24, 0.12);
      box-shadow: 0 10px 24px rgba(0,0,0,.18);
      backdrop-filter: blur(10px);
      transition: box-shadow .25s ease, background .25s ease;
      
      /* НОВЫЙ КОД: Защита от наложения на "челку" iPhone */
      padding-top: env(safe-area-inset-top); 
    }

    .nav {
      min-height: var(--header-top);
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: center;
      padding: 10px 0;
      transition: min-height .25s ease, padding .25s ease;
    }

    .brand { min-width: 0; display: flex; align-items: center; gap: 12px; }
    .brand-logo {
      width: 48px; height: 48px;
      display: grid; place-items: center; flex-shrink: 0;
      transition: width .25s ease, height .25s ease;
    }
    .brand-logo img { width: 48px; height: 48px; object-fit: contain; }

    .brand-copy strong {
      display: block; color: #fff4df;
      font-size: 20px; line-height: 1; letter-spacing: -0.02em; white-space: nowrap;
    }
    .brand-copy span {
      display: block; margin-top: 4px; color: rgba(255,244,223,.72);
      font-size: 12px; font-weight: 800; white-space: nowrap;
    }

    .nav-actions { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; justify-content: flex-end; }

    .lang-switch {
      display: inline-flex; align-items: center; gap: 6px; padding: 4px;
      border-radius: 999px; background: rgba(255,250,244,.96);
      border: 1px solid rgba(255,191,24,.18); box-shadow: 0 6px 16px rgba(0,0,0,.10);
    }
    .lang-btn {
      min-width: 44px; height: 34px; border: 0; border-radius: 999px;
      background: transparent; color: var(--text); font-weight: 900; cursor: pointer; transition: .25s ease;
    }
    .lang-btn.active {
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%); color: #111;
    }

    .phone-btn {
      display: inline-flex; align-items: center; justify-content: center;
      min-height: 46px; padding: 0 18px; border-radius: 999px;
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: #111; font-weight: 900; font-size: 16px; white-space: nowrap;
      box-shadow: 0 12px 26px rgba(255,191,24,.20);
      transition: transform .28s var(--ease), box-shadow .28s ease, min-height .25s ease, font-size .25s ease;
    }
    .phone-btn:hover { transform: translateY(-1px); box-shadow: 0 16px 30px rgba(255,191,24,.26); }

    .topbar.is-scrolled .nav { min-height: 60px; padding: 6px 0; }
    .topbar.is-scrolled .brand-logo, .topbar.is-scrolled .brand-logo img { width: 38px; height: 38px; }
    .topbar.is-scrolled .brand-copy strong { font-size: 17px; }
    .topbar.is-scrolled .brand-copy span { font-size: 11px; margin-top: 2px; }
    .topbar.is-scrolled .phone-btn { min-height: 40px; padding: 0 14px; font-size: 14px; }
    .topbar.is-scrolled .lang-btn { min-width: 40px; height: 30px; font-size: 13px; }

    /* === МАГИЯ АДАПТИВНОГО ЛОГОТИПА (ПЕРЕКЛЮЧЕНИЕ) === */
    .brand-logo .logo-full { display: block; }
    .brand-logo .logo-mini { display: none; }

    .topbar.is-scrolled .brand-logo .logo-full { display: none; }
    .topbar.is-scrolled .brand-logo .logo-mini { 
      display: block; 
      animation: logo-swap 0.3s ease forwards;
    }

    @keyframes logo-swap {
      from { opacity: 0; transform: scale(0.5); }
      to { opacity: 1; transform: scale(1); }
    }

    /* === НОВАЯ УМНАЯ НАВИГАЦИЯ ПО МЕНЮ === */
    .quick-nav-wrap {
      position: sticky;
      top: 60px; /* Прячется ровно под скролленной черной шапкой */
      z-index: 170;
      /* Добавляем блюр и полупрозрачный фон, чтобы плашки красиво плыли над блюдами */
      background: rgba(253, 250, 246, 0.95);
      backdrop-filter: blur(8px);
      padding: 12px 0 16px 0;
      margin-bottom: 12px;
      border-bottom: 1px dashed rgba(139, 69, 19, 0.08); /* Мягкое отсечение от карточек */
    }

    .quick-nav {
      display: flex; gap: 10px; overflow-x: auto;
      scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 2px;
    }
    .quick-nav::-webkit-scrollbar { display: none; }

    .quick-pill {
      flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      min-height: 44px; padding: 0 16px; border-radius: 999px;
      border: 1px solid var(--line); background: var(--card); color: #6d523a;
      font-size: 15px; font-weight: 800; white-space: nowrap; cursor: pointer;
      box-shadow: var(--shadow-soft); transition: .25s ease;
    }
    .quick-pill:hover, .quick-pill.active {
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: #111; border-color: transparent; box-shadow: 0 10px 22px rgba(255,191,24,.16);
    }

    /* === СЕКЦИИ === */
    .section { padding: 30px 0; }
    .hero { padding: 24px 0 12px; }

    .hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: center; min-height: 520px; }
    .hero-copy { max-width: 580px; }
    
    .hero-badge {
      display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px;
      border-radius: 999px; background: #fff6e3; border: 1px solid #f0ddbd;
      color: #8a4f1d; font-size: 13px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase;
    }
    .hero h1 {
      margin: 16px 0 10px;
      font-size: clamp(40px, 6vw, 78px);
      line-height: 0.95;
      letter-spacing: -0.03em; /* <-- УБРАЛИ СПЛЮЩИВАНИЕ ТУТ */
      max-width: 12ch;
    }
    .hero p {
      margin: 0; color: var(--muted); font-size: 19px; line-height: 1.45; max-width: 44ch; font-weight: 600;
    }

    .hero-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
    .hero-call {
      display: inline-flex; align-items: center; justify-content: center;
      min-height: 60px; padding: 0 24px; border-radius: 999px;
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: #111; font-size: 28px; font-weight: 900; letter-spacing: -0.02em;
      box-shadow: 0 16px 34px rgba(255,191,24,.18); white-space: nowrap;
    }

    /* === ССЫЛКА НА ЛОКАЦИЮ В HERO (МИНИМАЛИЗМ + АНИМАЦИЯ ПИНА) === */
    .hero-location {
      margin-top: 28px;
    }
    
    .location-link {
      display: inline-flex; 
      align-items: center; 
      gap: 6px;
      color: #8a6a4e; /* Тот самый аккуратный кофейный цвет */
      font-size: 15px; 
      font-weight: 700;
      transition: color 0.25s ease, transform 0.25s ease;
      background: transparent; /* Убили желтый фон */
      padding: 0;
      border: none;
    }
    
    .location-link:hover {
      color: var(--red); /* При наведении просто меняет цвет на красный */
      transform: translateY(-1px);
    }

    /* Анимация "дыхания" только для самого пина */
    .loc-pin {
      font-size: 18px;
      display: inline-block;
      animation: pin-float 2.5s ease-in-out infinite;
    }

    @keyframes pin-float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-4px); } /* Мягко прыгает вверх-вниз */
    }
    /* Прячем кнопку ТОЛЬКО на компьютерах (экраны больше 760px) */
    @media (min-width: 761px) {
      .hero-menu-link {
        display: none !important;
      }
    }
    
    .hero-menu-link:hover {
      transform: translateY(-2px);
      box-shadow: 0 16px 34px rgba(251, 133, 0, 0.35);
    }

    /* Это цвет для слова "Горячий" в заголовке! */
    .text-accent {
      color: var(--accent-2); 
    }

    .hero-note { margin-top: 14px; color: #7f654d; font-size: 15px; font-weight: 700; }
    .hero-points { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
    .hero-point {
      display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px;
      border-radius: 999px; background: var(--card); border: 1px solid var(--line-soft);
      color: #6b5038; font-size: 14px; font-weight: 800; box-shadow: var(--shadow-soft);
    }

    .hero-visual { display: flex; align-items: center; justify-content: center; }

    /* === АНИМАЦИЯ ПОВАРА ОСТАЛАСЬ === */
    .hero-logo-shell {
      width: min(560px, 100%); aspect-ratio: 1 / 1;
      display: grid; place-items: center; position: relative;
    }
    /* УСИЛЕННОЕ 3D СВЕЧЕНИЕ: делаем теплый очаг позади повара */
      .hero-logo-shell::before {
        content: ""; position: absolute; inset: -20%; border-radius: 50%;
        /* Сделал цвета ярче и насыщеннее */
        background: radial-gradient(circle at center, rgba(251, 133, 0, 0.45) 0%, rgba(255, 191, 24, 0.2) 50%, transparent 75%);
        z-index: 1; filter: blur(20px); animation: glow-pulse 4s ease-in-out infinite;
      }
    .hero-logo-shell img {
      width: 100%; max-width: 520px; object-fit: contain; position: relative; z-index: 2;
      filter: drop-shadow(0 25px 35px rgba(69, 39, 16, 0.15));
      animation: logo-entrance 1.2s cubic-bezier(0.2, 1, 0.3, 1) forwards, logo-float 4s ease-in-out 1.2s infinite;
    }

    @keyframes logo-entrance {
      0% { opacity: 0; transform: translateY(60px) scale(0.85); }
      100% { opacity: 1; transform: translateY(0) scale(1); }
    }
    @keyframes logo-float {
      0%, 100% { transform: translateY(0px) rotate(0deg); }
      50% { transform: translateY(-18px) rotate(1.5deg); }
    }
    @keyframes glow-pulse {
      0%, 100% { transform: scale(1); opacity: 0.8; }
      50% { transform: scale(1.15); opacity: 1; }
    }

    /* === ЗАГОЛОВКИ СЕКЦИЙ === */
    .section-head { margin-bottom: 20px; }
    .section-head h2 {
      margin: 0 0 6px; font-size: clamp(30px, 6vw, 48px); line-height: 0.95; letter-spacing: -0.03em;
    }
    .section-head p {
      margin: 0; color: var(--muted); font-size: 16px; line-height: 1.45; font-weight: 600; max-width: 760px;
    }

    /* === БЛОК: ПОПУЛЯРНЫЕ БЛЮДА (ТЕПЕРЬ НА ПК В 3 КОЛОНКИ БЕЗ СКРОЛЛА) === */
    .featured-strip {
      display: grid;
      grid-template-columns: repeat(3, 1fr); /* 3 ровные колонки на компах! */
      gap: 16px;
    }
    
    .featured-card {
      border-radius: 26px; overflow: hidden;
      border: 1px solid var(--line);
      background: var(--card); /* Сделали чистый белый для свежести! */
      box-shadow: var(--shadow);
    }
    .featured-media {
      position: relative; aspect-ratio: 4 / 3; background: transparent; overflow: hidden;
    }
    .featured-media img { width: 100%; height: 100%; object-fit: cover; }
    
    .featured-badge {
      position: absolute; top: 12px; left: 12px; display: inline-flex; align-items: center;
      min-height: 32px; padding: 0 12px; border-radius: 999px;
      background: rgba(20,20,20,.92); color: #ffd971; font-size: 12px; font-weight: 900;
      letter-spacing: .03em; text-transform: uppercase; box-shadow: 0 8px 18px rgba(0,0,0,.16);
    }
    
    .featured-body { padding: 18px; }
    .featured-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
    .featured-card h3 { margin: 0; font-size: 26px; line-height: 1.02; letter-spacing: -0.02em; max-width: 12ch; }
    .featured-price { color: var(--red); font-size: 24px; font-weight: 900; white-space: nowrap; text-align: right; letter-spacing: -0.02em; }
    .featured-foot { display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
    .featured-size { color: #8b5a2f; font-size: 14px; font-weight: 800; }

    /* === БЛОК: КАРТОЧКИ МЕНЮ === */
    /* Невидимый буфер, чтобы черная шапка не съедала слово МЕНЮ */
    #menu {
      scroll-margin-top: 90px;
    }
    .menu-grid { display: grid; gap: 18px; }
    .menu-section {
      scroll-margin-top: 180px; /* Сдвинули, чтобы новая умная панель не перекрывала заголовки */
      border-radius: 28px; background: var(--card); /* Белый фон */
      border: 1px solid var(--line); box-shadow: var(--shadow); padding: 16px;
    }

    .menu-section-head {
      display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px dashed rgba(139,69,19,.16);
    }
    .menu-section-left { display: flex; align-items: center; gap: 12px; min-width: 0; }
    .menu-icon {
      width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; flex-shrink: 0;
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: #111; font-size: 26px; box-shadow: 0 10px 22px rgba(255,191,24,.16);
    }
    .menu-section-head h3 { margin: 0; font-size: 32px; line-height: 1; letter-spacing: -0.03em; }
    .menu-section-head p { margin: 4px 0 0; color: var(--muted); font-size: 15px; font-weight: 600; }

    .menu-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }

    /* ИЗМЕНЕНИЕ 4: Сделали фотки в меню крупнее на компьютерах (было 108px, стало 140px) */
    .menu-item {
      display: grid;
      grid-template-columns: 140px 1fr; /* УВЕЛИЧЕНО */
      gap: 16px;
      align-items: stretch; border-radius: 22px;
      background: var(--card); border: 1px solid var(--line-soft);
      box-shadow: 0 10px 22px rgba(69,39,16,.05); padding: 12px; min-width: 0; transition: transform .25s ease, box-shadow .25s ease;
    }
    .menu-item:hover { transform: translateY(-3px); box-shadow: 0 16px 28px rgba(69,39,16,.08); }
    
    /* Добавляем благородную подложку для всех картинок */
    .menu-media { 
       min-height: 120px; border-radius: 16px; overflow: hidden; 
       background: #f4f1ea; /* Очень мягкий, теплый аппетитный цвет "молочной пенки" */
       cursor: zoom-in; 
    }
    .menu-media img { 
       width: 100%; height: 100%; 
       object-fit: contain; 
       mix-blend-mode: multiply; /* Сменили darken на multiply! Теперь он впитывает цвет подложки */
       transition: transform 0.2s ease; 
    }
    .menu-media img:hover {
       transform: scale(1.05); /* Легкий зум картинки при наведении мышью (очень сочно) */
    }
    .menu-body { display: flex; flex-direction: column; min-width: 0; justify-content: center; }
    .menu-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
    .menu-item h4 { margin: 0; font-size: 20px; line-height: 1.1; letter-spacing: -0.02em; }
    .menu-subtitle { margin: 6px 0 0; color: #8a6a4e; font-size: 13px; line-height: 1.35; font-weight: 800; }
    .menu-desc { margin: 8px 0 0; color: var(--muted); font-size: 14px; line-height: 1.4; font-weight: 600; }
    .menu-price { color: var(--red); font-size: 19px; font-weight: 900; text-align: right; white-space: nowrap; flex-shrink: 0; }

    /* === БЛОК: КОНТАКТЫ И КАРТА === */
    .contact-shell {
      border-radius: 30px; background: var(--card); border: 1px solid var(--line);
      box-shadow: var(--shadow); padding: 18px;
    }
    .contact-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
    .contact-top h2 { margin: 0 0 6px; font-size: 38px; line-height: 1; letter-spacing: -0.03em; }
    .contact-top p { margin: 0; color: var(--muted); font-size: 15px; font-weight: 600; max-width: 560px; }
    
    /* === Кнопка Контактов (ПК) - Элегантная, Центрированная === */
.contact-cta { 
   display: flex !important; 
   justify-content: center !important;
   align-items: center !important;
   width: 100% !important; 
   max-width: 400px !important; /* Удобный "широкий" размер для нажатия мышкой */
   margin: 32px auto 0 auto !important; /* МАГИЯ: Автоматически ставит кнопку ИДЕАЛЬНО по центру! */
   min-height: 64px; 
   border-radius: 999px !important;
   font-size: 22px; font-weight: 900; color: var(--text-button) !important;
   background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
   box-shadow: 0 16px 32px rgba(251, 133, 0, 0.25) !important; text-decoration: none; 
}

    .contact-main-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 14px; }
    .contact-info-col { display: flex; flex-direction: column; gap: 16px; }
    
    .contact-card {
      border-radius: 22px; background: var(--card); border: 1px solid var(--line-soft);
      box-shadow: var(--shadow-soft); padding: 22px;
    }
    .contact-card strong { display: block; color: var(--muted); font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 8px; font-weight: 900; }
    .contact-card span { display: block; color: var(--text); font-size: 16px; font-weight: 700; line-height: 1.4; }
    
    /* Красиво центрируем карточку с адресом слева */
    .contact-address-card { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
    .contact-card span.big-address { font-size: 22px; font-weight: 900; letter-spacing: -0.02em; margin-bottom: 6px;}
    
    .contact-link {
      margin-top: 14px; display: inline-flex; align-items: center; justify-content: center;
      min-height: 40px; padding: 0 18px; border-radius: 12px;
      background: #fff4dd; border: 1px solid #f0d9b0; color: #8a4d1c; font-size: 14px; font-weight: 900;
    }

    .map-card { border-radius: 24px; overflow: hidden; border: 1px solid var(--line-soft); box-shadow: var(--shadow-soft); background: var(--card); display: flex; min-height: 300px; }
    .map-card iframe { width: 100%; height: 100%; flex: 1; border: 0; display: block; }

    .mobile-callbar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 190; display: none; }
    .mobile-callbar a {
      min-height: 56px; border-radius: 18px; display: flex; align-items: center; justify-content: center;
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
      color: #111; font-size: 19px; font-weight: 900; box-shadow: 0 18px 36px rgba(255,191,24,.22);
    }
    
    .footer { padding: 20px 0 92px; color: #7a6757; font-size: 15px; font-weight: 600; text-align: center;}

    /* === ПРЕМИУМ КАРТОЧКА КОНТАКТОВ И КАРТА (ГЛОБАЛЬНЫЕ СТИЛИ) === */
    .contact-premium-card {
      background: var(--card);
      border-radius: 22px;
      border: 1px solid var(--line-soft);
      box-shadow: var(--shadow-soft);
      overflow: hidden; 
      display: flex;
      flex-direction: column;
      height: 100%;
    }

    .contact-row {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 22px;
      text-decoration: none;
      color: inherit;
    }

    .c-address-link {
      transition: background 0.2s ease;
      cursor: pointer;
      flex: 1;
    }
    
    .c-address-link:hover, 
    .c-address-link:active {
      background: rgba(255, 191, 24, 0.08); 
    }

    .c-icon { font-size: 28px; flex-shrink: 0; }

    .c-text { display: flex; flex-direction: column; gap: 6px; flex: 1; }

    .c-text strong {
      font-size: 14px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 900;
    }

    .c-text span { font-size: 16px; font-weight: 700; color: var(--text); line-height: 1.3; }

    .c-text span.big-address { font-size: 19px; font-weight: 900; letter-spacing: -0.01em; }

    .c-divider { height: 1px; background: var(--line-soft); margin: 0 22px; }

    .c-arrow { color: #b59b85; font-size: 24px; font-weight: 900; transition: transform 0.25s ease, color 0.25s ease; }

    .c-address-link:hover .c-arrow { transform: translate(2px, -2px); color: var(--red); }

    /* === ПРЕМИАЛЬНАЯ РАМКА ДЛЯ КАРТЫ === */
    .map-premium-frame {
      border-radius: 22px;
      overflow: hidden; 
      border: 1px solid var(--line-soft);
      box-shadow: var(--shadow-soft);
      background: #f4f1ea; 
      display: flex;
      width: 100%;
      min-height: 320px; /* На ПК карта будет большой и высокой! */
      height: 100%;
    }

    .map-premium-frame iframe { width: 100%; height: 100%; border: none; display: block; filter: contrast(1.05) saturate(1.15); }

    /* === АДАПТАЦИЯ (ТЕЛЕФОНЫ И ПЛАНШЕТЫ) === */
    @media (max-width: 1080px){
      .hero-grid { grid-template-columns: 1fr; min-height: auto; }
      .hero-copy { max-width: none; }
      .hero-visual { order: -1; }
      .hero-logo-shell { width: min(360px, 100%); }
    }

    @media (max-width: 920px){
      .menu-list, .contact-main-grid { grid-template-columns: 1fr; }
      /* Возвращаем свайп для популярных блюд на мобильных! */
      .featured-strip {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 82%;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: 6px;
      }
    } /* <--- Вот эта скобка и её соседка выше у тебя потерялись! */

    /* === АДАПТАЦИЯ ДЛЯ ТЕЛЕФОНОВ === */
    @media (max-width: 760px){
      :root{ --header-top-mobile: 66px; --header-top-mobile-scrolled: 56px; }
      
      .nav { min-height: var(--header-top-mobile); padding: 6px 0; gap: 8px; }
      .brand-logo, .brand-logo img { width: 34px; height: 34px; }
      .brand-copy strong { font-size: 16px; }
      .brand-copy span { font-size: 10px; margin-top: 1px; }
      
      .phone-btn { min-height: 38px; padding: 0 12px; font-size: 13px; }
      .lang-btn { min-width: 36px; height: 30px; font-size: 12px; }
      
      .topbar.is-scrolled .nav { min-height: var(--header-top-mobile-scrolled); padding: 4px 0; }
      .topbar.is-scrolled .brand-logo, .topbar.is-scrolled .brand-logo img { width: 28px; height: 28px; }
      .topbar.is-scrolled .brand-copy strong { font-size: 14px; }
      
      .quick-nav-wrap { top: 56px; padding: 8px 0 12px; margin-bottom: 8px; }
      .quick-pill { min-height: 38px; padding: 0 12px; font-size: 13px; }

      /* === ЭПИЧНАЯ ОБЛОЖКА ПРИЛОЖЕНИЯ (МЕНЮ СПРЯТАНО ВНИЗУ) === */
      .hero { 
         /* Берем всю высоту экрана телефона минус наша шапка! */
         min-height: calc(100svh - 66px); 
         padding: 2vh 0 4vh; /* Мягкие "резиновые" отступы от краев */
         display: flex; 
         flex-direction: column;
         align-items: center; 
      }
      
      /* Магия сетки: заставляем контент растолкать друг друга по высоте */
      .hero-grid { 
         display: flex; 
         flex-direction: column; 
         justify-content: space-between; /* <- Вот она! Отталкивает повара наверх, а текст вниз! */
         width: 100%; 
         flex: 1; /* Сетка заполняет всю свободную высоту */
      } 
      
      /* ПОВАР (Главная эмоция) - Занимает верхнюю половину экрана и становится БОЛЬШЕ */
      .hero-visual { 
         display: flex; order: -1; justify-content: center; align-items: center; flex: 1; position: relative; 
      }
      .hero-logo-shell { width: 260px; } /* Увеличили шефа! Теперь он заполняет пространство */
      
      .hero-logo-shell::before {
        content: ""; position: absolute; inset: -20%; border-radius: 50%;
        background: radial-gradient(circle at center, rgba(251, 133, 0, 0.4) 0%, rgba(255, 191, 24, 0.2) 40%, transparent 70%);
        z-index: 1; filter: blur(20px); animation: glow-pulse 4s ease-in-out infinite;
      }
      
      /* ТЕКСТ И КНОПКА - Группируются внизу, образуя мощный призыв */
      .hero-copy { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding-bottom: 20px;}
      .hero-badge { margin-bottom: 12px; }
      .hero h1 { font-size: 42px; line-height: 0.95; text-align: center; margin: 0 0 10px; }
      .hero p { text-align: center; font-size: 16px; margin: 0 0 24px; max-width: 320px; line-height: 1.35; }
      
      /* Сама кнопка: делаем ее еще сочнее и крупнее */
      .hero-actions { width: 100%; display: flex; justify-content: center; margin-top: 10px; }

      /* Замени старый .hero-location на этот: */
      .hero-location { 
         width: 100%; 
         display: flex; 
         justify-content: center; 
         margin-top: 24px; 
      }
      .location-link { 
         font-size: 13px; /* Чуть мельче, чтобы влезло */
         padding: 8px 18px; 
      }
      
      /* Анимированная кнопка (показывается только на телефоне) */
      .hero-menu-link { 
         display: inline-flex !important; /* Включаем кнопку обратно для телефона */
         width: 100%; max-width: 320px; min-height: 60px; font-size: 20px; margin: 0; 
         align-items: center; justify-content: center; border-radius: 16px; border: none;
         background: linear-gradient(135deg, var(--accent) 0%, var(--accent-2) 100%);
         color: #3A1F04 !important; font-weight: 900; text-decoration: none;
         position: relative; overflow: hidden; /* Важно для блика */
         /* Анимация "горячего" дыхания тени */
         animation: btn-shadow-breath 2.5s infinite alternate ease-in-out;
      }
      
      /* Светящийся блик */
      .hero-menu-link::after {
         content: ""; position: absolute; top: 0; left: -100%; width: 40%; height: 100%;
         background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);
         transform: skewX(-20deg); 
         /* Анимация пробегания блика каждые 4 секунды */
         animation: btn-shimmer 4s infinite ease-in-out;
      }

      /* Скрипты анимаций (Вставляем сюда же) */
      @keyframes btn-shimmer {
         0%, 60% { left: -100%; } 
         80%, 100% { left: 200%; } 
      }
      @keyframes btn-shadow-breath {
         0% { box-shadow: 0 8px 16px rgba(251, 133, 0, 0.2); transform: translateY(0); }
         100% { box-shadow: 0 16px 36px rgba(251, 133, 0, 0.45); transform: translateY(-1px); }
      }
      
      .menu-section { scroll-margin-top: 120px; padding: 12px; }
      .map-card iframe { height: 240px; }
      .mobile-callbar { display: none !important; }

      /* Отступы контактов для мобильных */
      .map-premium-frame { margin-top: 16px; min-height: 240px; }
      .contact-row { padding: 16px 20px; }

      /* ========================================================== */
      /* ==== НОВАЯ РАСКЛАДКА МЕНЮ (2 КОЛОНКИ - ФИНАЛ) ==== */
      /* ========================================================== */
      .menu-list { 
         grid-template-columns: repeat(2, minmax(0, 1fr)); 
         gap: 8px; /* Сделали сетку чуть плотнее (было 12px) */
      }
      
      .menu-item { 
         display: flex; 
         flex-direction: column; 
         align-items: stretch; 
         gap: 8px; 
         padding: 10px; /* Чуть уменьшили белые поля внутри карточки (было 12px) */
         text-align: left;
         height: 100%; 
      }
      
      .menu-media { 
         width: 100%; 
         height: 130px; /* Слегка увеличили высоту самого серого квадрата (было 120px) */
         background: #f4f1ea; 
         border-radius: 12px;
         display: flex; align-items: center; justify-content: center;
         flex-shrink: 0;
         overflow: hidden;
      }
      
      .menu-media img {
         width: 100%; height: 100%; object-fit: contain;
         /* Вернули очень деликатный зум. Еда останется с красивыми отступами от краев! */
         transform: scale(1.08); 
         transition: transform 0.2s ease;
      }
      
      .menu-body {
         padding: 0; 
         width: 100%; 
         display: flex; 
         flex-direction: column; 
         flex: 1; /* Толкает цену всегда в самый низ */
         min-width: 0; /* Защита от вылезания длинных слов */
      }
      
      .menu-top { 
         display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
      }
      
      .menu-item h4 { 
         font-size: 15px; line-height: 1.15; margin: 0; letter-spacing: -0.01em; 
         word-wrap: break-word;
      }
      
      /* Описания теперь выглядят аккуратно и не ломают карточку */
      .menu-desc { 
         font-size: 11px; 
         line-height: 1.25; /* Уплотнили интервал */
         margin-top: 4px; 
         color: var(--muted);
         display: -webkit-box; 
         -webkit-line-clamp: 4; /* Теперь влазит 4 строки! */
         line-clamp: 4; 
         -webkit-box-orient: vertical; 
         overflow: hidden;
      }
      
      .menu-price { 
         margin-top: auto; 
         font-size: 14px; /* Чуть меньше, чтобы влезало 2 цены */
         color: var(--red); 
         font-weight: 900; 
         padding-top: 8px;
         white-space: normal; /* ИСПРАВЛЕНИЕ: Разрешаем цене перенос строки! */
         line-height: 1.2;
      }
      }

    @media (max-width: 560px){
      .container { width: min(var(--container), calc(100% - 12px)); }
      .nav-actions { gap: 6px; }
      .lang-switch { padding: 2px; gap: 2px; }
      
      .section-head h2 { font-size: 26px; }
      .featured-strip { grid-auto-columns: 88%; }
      
      
      .contact-top h2 { font-size: 28px; }
      .contact-card { padding: 16px; }
      .contact-card span.big-address { font-size: 18px; }

      /* === НАВЕДЕНИЕ КРАСОТЫ В КОНТАКТАХ (Для телефонов) === */
      .contact-top h2 { font-size: 32px; text-align: center; }
      .contact-top p { text-align: center; margin-bottom: 24px;}
      
      /* Убиваем синдром "матрешки" - делаем внешний фон невидимым на мобилках */
      .contact-shell {
         background: transparent !important; border: none !important; 
         box-shadow: none !important; padding: 0 !important;
         display: flex; flex-direction: column;
      }
      
      /* Исправляем растягивание карточек */
      .contact-card { 
         padding: 16px 20px; 
         justify-content: flex-start !important; 
         height: auto !important; 
      }
      .contact-card span.big-address { font-size: 18px; margin-bottom: 0; line-height: 1.35; margin-top: 4px; }
      
      .map-card { margin-top: 8px; height: 220px; min-height: 220px; }

      /* ПРЕВРАЩАЕМ КНОПКУ В ЭЛЕГАНТНУЮ КАПСУЛУ */
      .contact-cta {
         display: flex !important;
         width: 100% !important; 
         max-width: 320px !important; /* Делаем ее не на всю ширину, а с отступами */
         margin: 28px auto 0 !important; /* Отодвигаем от карты и центрируем */
         min-height: 60px; 
         font-size: 20px; 
         border-radius: 999px !important; /* Овальные края, как у Apple */
      }
      .contact-cta::after { display: none !important; } /* Убираем бегающий блик для мобильных контактов, чтобы не пестрило */
    }

    /* === СТИЛИ ВСПЛЫВАЮЩЕГО ОКНА ДЛЯ ФОТОГРАФИЙ (ЛАЙТБОКС) === */
    .image-modal {
      position: fixed; top: 0; left: 0; width: 100%; height: 100%;
      background: rgba(25, 15, 5, 0.85); z-index: 999;
      display: flex; align-items: center; justify-content: center;
      opacity: 0; pointer-events: none; transition: opacity 0.3s ease;
      padding: 20px; backdrop-filter: blur(10px);
    }
    .image-modal.show { opacity: 1; pointer-events: auto; }
    
    .image-modal img {
      max-width: 100%; max-height: 70vh; border-radius: 20px;
      box-shadow: 0 20px 50px rgba(0,0,0,0.5);
      transform: scale(0.9); transition: transform 0.3s ease;
      background: #fff; 
    }
    .image-modal.show img { transform: scale(1); }
    
    .modal-close {
      position: absolute; top: 24px; right: 24px;
      background: var(--card); border: none; width: 44px; height: 44px;
      border-radius: 50%; font-size: 28px; cursor: pointer;
      display: flex; align-items: center; justify-content: center; color: #333;
    }