/* Подключаем Unbounded (через @import, безопасно для Tilda) */
@import url('https://fonts.googleapis.com/css2?family=Unbounded:ital,wght@1,400;1,600&display=swap');

/* Стили для подсказки — показывается только на мобильных */
@media (max-width: 768px) {
  #mf-hint-wrap { display:block; position:relative; width:100%; max-width:1200px; margin:8px auto 0; pointer-events:none; }
  #mf-hint-pulse { position:absolute; left:50%; transform:translateX(-50%); top:-6px; width:calc(100% - 20px); height:calc(100% + 12px); border-radius:18px; opacity:0; pointer-events:none; z-index:2;}
  @keyframes mf-pulse { 0%{ box-shadow:0 0 0 0 rgba(204,245,1,0.18); opacity:0.9 } 40%{ box-shadow:0 0 22px 6px rgba(204,245,1,0.12); opacity:1 } 100%{ box-shadow:0 0 0 30px rgba(204,245,1,0); opacity:0 } }
  #mf-hint-pulse.show { opacity:1; animation: mf-pulse 1.6s ease-out infinite; }

  #mf-hint-bubble {
    position: absolute;
    left:50%;
    transform:translateX(-50%) translateY(-8px);
    top:-56px;
    background: linear-gradient(180deg,#fff 0%, #fcfff6 100%);
    border-radius:12px;
    padding:10px 14px;
    box-shadow:0 8px 24px rgba(6,18,38,0.12);
    border:1px solid rgba(0,0,0,0.06);
    display:flex; gap:10px; align-items:center;
    pointer-events:auto;
    opacity:0; transform-origin:50% 100%;
    transition: opacity .24s ease, transform .26s cubic-bezier(.2,.9,.2,1);
    font-family: 'Unbounded', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
    font-style: italic; font-weight:600; font-size:14px; color:#0b0b0b; z-index:9999;
    min-width:200px; max-width:calc(100% - 40px);
  }
  #mf-hint-bubble.show { opacity:1; transform:translateX(-50%) translateY(0); }

  #mf-hint-bubble::after{ content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-8px; width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #fcfff6; filter:drop-shadow(0 1px 0 rgba(0,0,0,0.03)); }

  .mf-hint-ico{ width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(204,245,1,0.12), rgba(204,245,1,0.06));border:1px solid rgba(204,245,1,0.35); color:#222; font-size:16px; flex:0 0 34px; }
  .mf-hint-text{ flex:1 1 auto; line-height:1.1; text-align:left; font-size:13px; color:#0b1722; }
  .mf-hint-close{ background:transparent;border:none;font-size:14px;color:#666;cursor:pointer;padding:6px;border-radius:8px; }
  .mf-hint-close:active{ transform:scale(.98); }
}
/* скрыт по умолчанию вне медиазапроса */
#mf-hint-wrap { display:none; }




  
  
    👟
    Нажми на категорию — бутсы, сороконожки или футзалки — чтобы быстро подобрать обувь.
    ✕
  



(function(){
  // Надёжная авто-вставка и управление подсказкой для стандартного ST320N
  const HINT_KEY = 'mf_filter_hint_shown_v1';
  const hintWrap = document.getElementById('mf-hint-wrap');
  const hintPulse = document.getElementById('mf-hint-pulse');
  const hintBubble = document.getElementById('mf-hint-bubble');
  const hintClose = document.getElementById('mf-hint-close');

  // селекторы, которые обозначают ST320N / Tilda Store контейнер
  const STORE_SELECTORS = ['.t-store', '.t-store__cards', '.t-store__list', '.t-store__items', '.t-store__grid'];

  function isMobileView(){ return window.matchMedia && window.matchMedia('(max-width: 768px)').matches; }
  function isAlreadyShownInSession(){ try { return !!sessionStorage.getItem(HINT_KEY); } catch(e){ return false; } }
  function setShownInSession(){ try { sessionStorage.setItem(HINT_KEY, '1'); } catch(e){} }

  // показывает подсказку (добавляет классы)
  function showHint() {
    if (!hintWrap) return;
    // убедимся, что mobile
    if (!isMobileView()) return;
    hintWrap.style.display = 'block';
    requestAnimationFrame(() => {
      hintPulse.classList.add('show');
      hintBubble.classList.add('show');
      hintWrap.setAttribute('aria-hidden','false');
    });
  }
  function hideHint(persist=true){
    if (!hintWrap) return;
    hintPulse.classList.remove('show');
    hintBubble.classList.remove('show');
    hintWrap.setAttribute('aria-hidden','true');
    setTimeout(()=>{ hintWrap.style.display = 'none'; }, 320);
    if (persist) setShownInSession();
  }

  // попытка аккуратно вставить подсказку перед первым найденным ST320N-контейнером
  function insertHintBeforeStore(target) {
    try {
      if (!target || !hintWrap) return false;
      target.parentNode.insertBefore(hintWrap, target);
      return true;
    } catch(e){
      console.warn('mf-hint: insert failed', e);
      return false;
    }
  }

  // ищем первый подходящий контейнер (синхронно)
  function findStoreSync(){
    for (const s of STORE_SELECTORS) {
      const el = document.querySelector(s);
      if (el) return el;
    }
    return null;
  }

  // ждём появления ST320N через MutationObserver с таймаутом
  function waitForStore(timeout = 4000){
    return new Promise((resolve) => {
      const existing = findStoreSync();
      if (existing) return resolve(existing);
      // наблюдаем за body на предмет вставки элементов
      const obs = new MutationObserver((mutations, observer) => {
        for (const m of mutations) {
          if (m.addedNodes && m.addedNodes.length) {
            // попробуем найти store
            const found = findStoreSync();
            if (found) {
              try { observer.disconnect(); } catch(e){}
              return resolve(found);
            }
          }
        }
      });
      try { obs.observe(document.body, { childList: true, subtree: true }); } catch(e){}
      setTimeout(()=>{ try{ obs.disconnect(); }catch(e){}; resolve(null); }, timeout);
    });
  }

  // прикрепляем автоматическое скрытие при первом клике на фильтр (если фильтр есть)
  function attachAutoHideOnFilterInteraction() {
    const filterButtons = document.querySelectorAll('.mf-club-filter .mf-filter-btn, .t-store__filter .t-store__filter-list button, .t-store__filter button, .t-store__filter a');
    if (!filterButtons || filterButtons.length === 0) return;
    const handler = function(){
      hideHint(true);
      // удаляем всех слушателей (cleanup)
      filterButtons.forEach(b => b.removeEventListener('click', handler));
    };
    filterButtons.forEach(b => b.addEventListener('click', handler));
  }

  // публичная инициализация: попробуем вставить подсказку перед ST320N; если не получилось — append to body
  async function initAutoInsert() {
    if (!isMobileView()) return; // показываем только на мобилках
    if (isAlreadyShownInSession()) return; // не надоедать в сессии
    // попробуем найти синхронно
    let target = findStoreSync();
    if (!target) {
      // ждём асинхронно (MutationObserver)
      target = await waitForStore(4000);
    }
    let inserted = false;
    if (target) {
      inserted = insertHintBeforeStore(target);
    }
    if (!inserted) {
      // fallback: вставим в начало body, чтобы было видно (не лучшее место, но рабочее)
      try { document.body.insertBefore(hintWrap, document.body.firstChild);


/* Подключаем Unbounded (через @import, безопасно для Tilda) */
@import url('https://fonts.googleapis.com/css2?family=Unbounded:ital,wght@1,400;1,600&display=swap');

/* Стили для подсказки — показывается только на мобильных */
@media (max-width: 768px) {
  #mf-hint-wrap { display:block; position:relative; width:100%; max-width:1200px; margin:8px auto 0; pointer-events:none; }
  #mf-hint-pulse { position:absolute; left:50%; transform:translateX(-50%); top:-6px; width:calc(100% - 20px); height:calc(100% + 12px); border-radius:18px; opacity:0; pointer-events:none; z-index:2;}
  @keyframes mf-pulse { 0%{ box-shadow:0 0 0 0 rgba(204,245,1,0.18); opacity:0.9 } 40%{ box-shadow:0 0 22px 6px rgba(204,245,1,0.12); opacity:1 } 100%{ box-shadow:0 0 0 30px rgba(204,245,1,0); opacity:0 } }
  #mf-hint-pulse.show { opacity:1; animation: mf-pulse 1.6s ease-out infinite; }

  #mf-hint-bubble {
    position: absolute;
    left:50%;
    transform:translateX(-50%) translateY(-8px);
    top:-56px;
    background: linear-gradient(180deg,#fff 0%, #fcfff6 100%);
    border-radius:12px;
    padding:10px 14px;
    box-shadow:0 8px 24px rgba(6,18,38,0.12);
    border:1px solid rgba(0,0,0,0.06);
    display:flex; gap:10px; align-items:center;
    pointer-events:auto;
    opacity:0; transform-origin:50% 100%;
    transition: opacity .24s ease, transform .26s cubic-bezier(.2,.9,.2,1);
    font-family: 'Unbounded', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
    font-style: italic; font-weight:600; font-size:14px; color:#0b0b0b; z-index:9999;
    min-width:200px; max-width:calc(100% - 40px);
  }
  #mf-hint-bubble.show { opacity:1; transform:translateX(-50%) translateY(0); }

  #mf-hint-bubble::after{ content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-8px; width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #fcfff6; filter:drop-shadow(0 1px 0 rgba(0,0,0,0.03)); }

  .mf-hint-ico{ width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(204,245,1,0.12), rgba(204,245,1,0.06));border:1px solid rgba(204,245,1,0.35); color:#222; font-size:16px; flex:0 0 34px; }
  .mf-hint-text{ flex:1 1 auto; line-height:1.1; text-align:left; font-size:13px; color:#0b1722; }
  .mf-hint-close{ background:transparent;border:none;font-size:14px;color:#666;cursor:pointer;padding:6px;border-radius:8px; }
  .mf-hint-close:active{ transform:scale(.98); }
}
/* скрыт по умолчанию вне медиазапроса */
#mf-hint-wrap { display:none; }




  
  
    👟
    Нажми на категорию — бутсы, сороконожки или футзалки — чтобы быстро подобрать обувь.
    ✕
  



(function(){
  // Надёжная авто-вставка и управление подсказкой для стандартного ST320N
  const HINT_KEY = 'mf_filter_hint_shown_v1';
  const hintWrap = document.getElementById('mf-hint-wrap');
  const hintPulse = document.getElementById('mf-hint-pulse');
  const hintBubble = document.getElementById('mf-hint-bubble');
  const hintClose = document.getElementById('mf-hint-close');

  // селекторы, которые обозначают ST320N / Tilda Store контейнер
  const STORE_SELECTORS = ['.t-store', '.t-store__cards', '.t-store__list', '.t-store__items', '.t-store__grid'];

  function isMobileView(){ return window.matchMedia && window.matchMedia('(max-width: 768px)').matches; }
  function isAlreadyShownInSession(){ try { return !!sessionStorage.getItem(HINT_KEY); } catch(e){ return false; } }
  function setShownInSession(){ try { sessionStorage.setItem(HINT_KEY, '1'); } catch(e){} }

  // показывает подсказку (добавляет классы)
  function showHint() {
    if (!hintWrap) return;
    // убедимся, что mobile
    if (!isMobileView()) return;
    hintWrap.style.display = 'block';
    requestAnimationFrame(() => {
      hintPulse.classList.add('show');
      hintBubble.classList.add('show');
      hintWrap.setAttribute('aria-hidden','false');
    });
  }
  function hideHint(persist=true){
    if (!hintWrap) return;
    hintPulse.classList.remove('show');
    hintBubble.classList.remove('show');
    hintWrap.setAttribute('aria-hidden','true');
    setTimeout(()=>{ hintWrap.style.display = 'none'; }, 320);
    if (persist) setShownInSession();
  }

  // попытка аккуратно вставить подсказку перед первым найденным ST320N-контейнером
  function insertHintBeforeStore(target) {
    try {
      if (!target || !hintWrap) return false;
      target.parentNode.insertBefore(hintWrap, target);
      return true;
    } catch(e){
      console.warn('mf-hint: insert failed', e);
      return false;
    }
  }

  // ищем первый подходящий контейнер (синхронно)
  function findStoreSync(){
    for (const s of STORE_SELECTORS) {
      const el = document.querySelector(s);
      if (el) return el;
    }
    return null;
  }

  // ждём появления ST320N через MutationObserver с таймаутом
  function waitForStore(timeout = 4000){
    return new Promise((resolve) => {
      const existing = findStoreSync();
      if (existing) return resolve(existing);
      // наблюдаем за body на предмет вставки элементов
      const obs = new MutationObserver((mutations, observer) => {
        for (const m of mutations) {
          if (m.addedNodes && m.addedNodes.length) {
            // попробуем найти store
            const found = findStoreSync();
            if (found) {
              try { observer.disconnect(); } catch(e){}
              return resolve(found);
            }
          }
        }
      });
      try { obs.observe(document.body, { childList: true, subtree: true }); } catch(e){}
      setTimeout(()=>{ try{ obs.disconnect(); }catch(e){}; resolve(null); }, timeout);
    });
  }

  // прикрепляем автоматическое скрытие при первом клике на фильтр (если фильтр есть)
  function attachAutoHideOnFilterInteraction() {
    const filterButtons = document.querySelectorAll('.mf-club-filter .mf-filter-btn, .t-store__filter .t-store__filter-list button, .t-store__filter button, .t-store__filter a');
    if (!filterButtons || filterButtons.length === 0) return;
    const handler = function(){
      hideHint(true);
      // удаляем всех слушателей (cleanup)
      filterButtons.forEach(b => b.removeEventListener('click', handler));
    };
    filterButtons.forEach(b => b.addEventListener('click', handler));
  }

  // публичная инициализация: попробуем вставить подсказку перед ST320N; если не получилось — append to body
  async function initAutoInsert() {
    if (!isMobileView()) return; // показываем только на мобилках
    if (isAlreadyShownInSession()) return; // не надоедать в сессии
    // попробуем найти синхронно
    let target = findStoreSync();
    if (!target) {
      // ждём асинхронно (MutationObserver)
      target = await waitForStore(4000);
    }
    let inserted = false;
    if (target) {
      inserted = insertHintBeforeStore(target);
    }
    if (!inserted) {
      // fallback: вставим в начало body, чтобы было видно (не лучшее место, но рабочее)
      try { document.body.insertBefore(hintWrap, document.body.firstChild);