/* ═══════════════════════════════════════════════════════════════════════════
   Гастро Консьерж — МОБИЛЬНАЯ главная v4 (GC-12)
   ───────────────────────────────────────────────────────────────────────────
   Источник дизайна: static/preview/app-home-v4.html (утверждённый v4).
   Что здесь:
     • ВСЕ селекторы дизайна v4 переименованы в gcv4-* — generic .card/.section/
       .rail/.row/.pic перетёрли бы каталог/чекаут (RULES §12/§15) — ЗАПРЕЩЕНЫ.
     • Все правила-селекторы обёрнуты в @media(max-width:768px) — мобильный слой.
       Десктоп (hp-*) физически не трогается; на мобильной home-page его прячем.
     • Шрифт Inter НЕ дублируется (self-hosted в style.css). Source Serif 4 —
       единственный недостающий шрифт дизайна v4 — в отдельном serif-v4.css
       (единый источник, RULES §12), линкуется в head ДО этого файла.
     • Chrome (шапка/бургер/нижний таб-бар/сервис-меню) — из БОЕВЫХ партиалов
       (header.html / service_menu.html / mobile_bar.html). v4-копии chrome
       (.header/.svc-menu/.gc-mobar/openSvc) сюда НЕ перенесены (§12-дубль).
     • Этот файл линкуется ТОЛЬКО из home.html → правила-«прятки» hp-* и
       hp-footer затрагивают исключительно главную, не другие страницы.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════
   МОБИЛЬНЫЙ СЛОЙ v4 — только ≤768px. На десктопе весь блок инертен
   (.gcv4-app display:none ниже).
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Корень мобильного приложения + дизайн-токены v4 (заскоплены) ── */
  .gcv4-app{
    --gcv4-green:#4F7A63;
    --gcv4-green-cta:#2F5E47;
    --gcv4-green-deep:#3E5F4E;
    --gcv4-green-mid:#6A9B7E;
    --gcv4-green-soft:#E4EDE6;
    --gcv4-bg:#FAFBF8;
    --gcv4-cream:#F4EFE4;
    --gcv4-ink:#1E231F;
    --gcv4-ink-soft:#5C645E;
    --gcv4-ink-faint:#9AA29C;
    --gcv4-line:#E7EBE6;
    --gcv4-accent:#C2703D;
    --gcv4-serif:'Source Serif 4','Georgia',serif;
    --gcv4-sans:'Inter','Liberation Sans','Segoe UI',system-ui,sans-serif;
    display:block;
    background:var(--gcv4-bg);
    color:var(--gcv4-ink);
    font-family:var(--gcv4-sans);
    line-height:1.5;
    padding-bottom:8px;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }
  .gcv4-app *{box-sizing:border-box;}

  /* На мобильной главной прячем десктопный home-layout (hp-* и hpv3-*) — показываем
     только v4. Файл линкуется лишь на home.html → правила локальны.
     GC-81 T05: десктоп теперь hpv3-page (визуал v3); футер — общий партиал,
     его прячет store-chrome.css (.hpv3-footer), здесь не дублируем. */
  .hp-hero,
  .hp-strip,
  .hp-banner,
  .hp-section,
  .hpv3-page{ display:none !important; }

  /* ── HERO ── */
  .gcv4-hero-wrap{padding:10px 18px 2px;}
  .gcv4-hero{
    position:relative;border-radius:24px;overflow:hidden;min-height:344px;
    background:linear-gradient(155deg,#3E5F4E 0%,#52765F 52%,#6E9078 100%);
    display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:#fff;
  }
  .gcv4-hero .gcv4-deco{position:absolute;right:-40px;top:-30px;width:240px;height:240px;border-radius:50%;
    background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.22),transparent 62%);}
  .gcv4-hero .gcv4-deco2{position:absolute;left:-50px;bottom:-60px;width:190px;height:190px;border-radius:50%;
    background:radial-gradient(circle at 50% 50%,rgba(196,224,205,.34),transparent 65%);}
  .gcv4-hero .gcv4-eb{font-size:10.5px;text-transform:uppercase;letter-spacing:.18em;opacity:.85;margin-bottom:11px;position:relative;font-weight:600;}
  .gcv4-hero h1{font-family:var(--gcv4-serif);font-size:28px;line-height:1.16;font-weight:600;letter-spacing:-.015em;position:relative;margin-bottom:10px;}
  .gcv4-hero h1 em{font-style:italic;color:#E4D3A8;}
  .gcv4-hero p{font-size:13px;opacity:.9;line-height:1.5;position:relative;max-width:252px;margin-bottom:18px;}
  .gcv4-hero .gcv4-cta{align-self:flex-start;background:#fff;color:var(--gcv4-green-cta);font-size:13px;font-weight:700;padding:12px 22px;border-radius:999px;position:relative;letter-spacing:-.01em;text-decoration:none;border:none;cursor:pointer;}

  /* ── SECTION HEAD ── */
  .gcv4-section{padding:28px 18px 2px;}
  .gcv4-sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;gap:12px;}
  .gcv4-sec-head .gcv4-ttl{font-family:var(--gcv4-serif);font-size:22px;font-weight:600;letter-spacing:-.01em;line-height:1.15;color:var(--gcv4-ink);}
  .gcv4-sec-head .gcv4-ttl em{font-style:italic;color:var(--gcv4-green);}
  .gcv4-sec-head .gcv4-all{min-height:44px;font-size:12px;font-weight:600;color:var(--gcv4-green);display:flex;align-items:center;gap:3px;cursor:pointer;flex:0 0 auto;white-space:nowrap;text-decoration:none;}
  .gcv4-sec-head .gcv4-all svg{display:block;}
  .gcv4-sec-eyebrow{font-size:10.5px;text-transform:uppercase;letter-spacing:.15em;color:var(--gcv4-ink-soft);margin-bottom:5px;font-weight:600;}

  /* ── ЕДИНЫЙ МОДУЛЬНЫЙ РЕЙЛ ТОВАРОВ (используется 3 раза) ── */
  .gcv4-rail{display:flex;gap:13px;overflow-x:auto;padding:4px 18px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .gcv4-rail::-webkit-scrollbar{display:none;}
  /* витринная карточка БЕЗ фото — аккуратная CSS-плашка с иконкой */
  .gcv4-card{position:relative;flex:0 0 auto;width:154px;cursor:pointer;}
  .gcv4-card-hit{position:absolute;inset:0;z-index:1;border-radius:16px;}
  .gcv4-card-hit:focus-visible{outline:3px solid var(--gcv4-green);outline-offset:2px;}
  .gcv4-card .gcv4-pic{
    width:154px;height:154px;border-radius:16px;position:relative;overflow:hidden;
    display:flex;align-items:center;justify-content:center;margin-bottom:10px;
    border:1px solid rgba(0,0,0,.05);
  }
  .gcv4-card .gcv4-pic .gcv4-glyph{
    font-family:var(--gcv4-serif);font-size:52px;font-weight:600;font-style:italic;
    color:rgba(255,255,255,.92);text-shadow:0 1px 2px rgba(0,0,0,.10);line-height:1;
  }
  .gcv4-card .gcv4-pic .gcv4-emoji{font-size:50px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.08));}
  /* GC-12: реальное фото товара заполняет плашку (если image непустой);
     z-index:0 — бейдж/кнопка «+» остаются поверх фото */
  .gcv4-card .gcv4-pic .gcv4-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0;}
  .gcv4-card .gcv4-pic .gcv4-badge,
  .gcv4-card .gcv4-pic .gcv4-add,
  .gcv4-card .gcv4-pic .gcv4-stepper{z-index:2;}
  .gcv4-card .gcv4-pic .gcv4-add{
    position:absolute;bottom:9px;right:9px;width:44px;height:44px;border-radius:50%;
    background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.13);border:none;padding:0;cursor:pointer;
    display:flex;align-items:center;justify-content:center;color:var(--gcv4-green);
  }
  .gcv4-card .gcv4-pic .gcv4-add svg{display:block;}
  .gcv4-card .gcv4-pic .gcv4-add:active{transform:scale(.9);}
  .gcv4-card .gcv4-pic .gcv4-badge{
    position:absolute;top:9px;left:9px;background:var(--gcv4-green-cta);color:#fff;
    font-size:9.5px;font-weight:700;padding:4px 9px;border-radius:7px;letter-spacing:.01em;
  }
  /* GC-12: степпер (когда товар в корзине) — на месте кнопки «+» */
  .gcv4-card .gcv4-pic .gcv4-stepper{
    position:absolute;bottom:9px;right:9px;display:flex;align-items:center;gap:2px;
    background:#fff;border-radius:999px;box-shadow:0 3px 10px rgba(0,0,0,.13);padding:2px;
  }
  .gcv4-card .gcv4-pic .gcv4-step{
    width:44px;height:44px;border-radius:50%;border:none;background:var(--gcv4-green-soft);
    color:var(--gcv4-green-deep);font-size:15px;font-weight:700;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;padding:0;
  }
  .gcv4-card .gcv4-pic .gcv4-step:active{background:var(--gcv4-green-mid);color:#fff;}
  .gcv4-card .gcv4-pic .gcv4-step-num{min-width:18px;text-align:center;font-size:12px;font-weight:700;color:var(--gcv4-ink);}
  .gcv4-pg1{background:linear-gradient(140deg,#F4DACE,#E6B196);}
  .gcv4-pg2{background:linear-gradient(140deg,#CFE0E6,#A3C2CF);}
  .gcv4-pg3{background:linear-gradient(140deg,#F2E6C4,#DDC78E);}
  .gcv4-pg4{background:linear-gradient(140deg,#D7E8D9,#ACD0B3);}
  .gcv4-pg5{background:linear-gradient(140deg,#EADFD2,#D2BCA1);}
  .gcv4-pg6{background:linear-gradient(140deg,#E4DDF0,#C2B4DE);}
  .gcv4-pg7{background:linear-gradient(140deg,#DCE9E2,#A9C9B8);}
  .gcv4-card .gcv4-origin{font-size:9.5px;color:var(--gcv4-ink-soft);letter-spacing:.04em;text-transform:uppercase;margin-bottom:3px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  /* GC-12 T06: на ГЛАВНОЙ происхождение в карточке-рейле скрыто (дизайн-решение). Другие страницы (hp-product-origin / pp-origin-badge) не трогаем — там происхождение сохраняется. */
  .gcv4-card .gcv4-origin{display:none;}
  .gcv4-card .gcv4-nm{font-size:13.5px;font-weight:600;line-height:1.3;margin-bottom:6px;letter-spacing:-.01em;height:35px;overflow:hidden;color:var(--gcv4-ink);}
  .gcv4-card .gcv4-row{display:flex;align-items:baseline;gap:6px;}
  .gcv4-card .gcv4-price{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--gcv4-ink);}
  .gcv4-card .gcv4-unit{font-size:11px;color:var(--gcv4-ink-soft);}
  /* состояние загрузки рейла */
  .gcv4-rail-loading{padding:14px 18px;color:var(--gcv4-ink-faint);font-size:12.5px;}

  /* ── ПОДБОРКА ШЕФА (заготовка-плейсхолдер) ── */
  .gcv4-chef-ph{
    margin:6px 18px 0;border-radius:20px;
    background:linear-gradient(150deg,#EFF3EC 0%,#E4EDE6 100%);
    border:1px dashed #C4D3C8;padding:26px 22px;text-align:center;position:relative;overflow:hidden;
  }
  .gcv4-chef-ph .gcv4-ico{
    width:52px;height:52px;border-radius:16px;margin:0 auto 14px;
    background:var(--gcv4-green-soft);display:flex;align-items:center;justify-content:center;color:var(--gcv4-green-deep);
  }
  .gcv4-chef-ph h3{font-family:var(--gcv4-serif);font-size:19px;font-weight:600;line-height:1.2;letter-spacing:-.01em;margin-bottom:8px;color:var(--gcv4-ink);}
  .gcv4-chef-ph h3 em{font-style:italic;color:var(--gcv4-green);}
  .gcv4-chef-ph p{font-size:12.5px;color:var(--gcv4-ink-soft);line-height:1.55;max-width:268px;margin:0 auto;}
  .gcv4-chef-ph .gcv4-tag{
    display:inline-flex;align-items:center;gap:6px;margin-top:15px;
    background:rgba(47,94,71,.08);color:var(--gcv4-green-deep);
    font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
    padding:6px 13px;border-radius:999px;
  }
  .gcv4-chef-ph .gcv4-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gcv4-accent);}

  /* ── DARK story «Почему мы» (внизу перед футером) ── */
  .gcv4-story{
    margin:34px 0 0;
    background:linear-gradient(160deg,#3E5F4E 0%,#476A56 100%);color:#fff;
    padding:38px 22px 40px;position:relative;overflow:hidden;
  }
  .gcv4-story .gcv4-deco{position:absolute;right:-60px;top:-40px;width:210px;height:210px;border-radius:50%;
    background:radial-gradient(circle,rgba(168,200,178,.34),transparent 65%);}
  .gcv4-story .gcv4-eb{font-size:10px;text-transform:uppercase;letter-spacing:.17em;opacity:.7;margin-bottom:13px;position:relative;font-weight:600;}
  .gcv4-story h3{font-family:var(--gcv4-serif);font-size:24px;font-weight:600;line-height:1.24;position:relative;margin-bottom:13px;letter-spacing:-.01em;}
  .gcv4-story h3 em{font-style:italic;color:#E4D3A8;}
  .gcv4-story p{font-size:13.5px;opacity:.88;line-height:1.62;position:relative;max-width:330px;}
  .gcv4-story p + p{margin-top:15px;}


} /* /@media(max-width:768px) */

/* ── ДЕСКТОП (≥769px): мобильный слой v4 полностью инертен ── */
@media (min-width: 769px) {
  .gcv4-app{ display:none !important; }
}
