<!doctype html>
<html lang="uk">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Італійський жіночий одяг - Стиль прямо з Італії | Lavanda Boutique</title>
    <meta name="description" content="Lavanda Boutique - Ексклюзивні колекції жіночого одягу прямо з Італії. Натуральні тканини, швидка доставка по Україні, гарантія якості. Замовляйте зараз зі знижкою 10%!" />
    <meta name="keywords" content="італійський одяг, жіночий одяг з Італії, стильний одяг, модні новинки, італійська мода, жіночий одяг України" />
    
    <!-- Open Graph -->
    <meta property="og:title" content="Lavanda Boutique - Італійський жіночий одяг прямо з Італії" />
    <meta property="og:description" content="Lavanda Boutique - Ексклюзивні колекції жіночого одягу прямо з Італії" />
    <meta property="og:type" content="website" />
    
    <!-- Google Fonts - з прелоадом для оптимізації -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preload" href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap" as="style">
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    
    <!-- Оптимізація продуктивності -->
    <link rel="dns-prefetch" href="https://www.googletagmanager.com">
    <link rel="dns-prefetch" href="https://connect.facebook.net">
    
    <!-- Стилі для оптимізації скролінгу -->
    <style>
      html {
        scroll-behavior: smooth;
      }
      
      body {
        overflow-x: hidden;
        overscroll-behavior-y: none;
      }
      
      /* Попереднє завантаження фону під час скролінгу */
      @media (min-width: 768px) {
        body::after {
          content: '';
          position: fixed;
          pointer-events: none;
          top: 0;
          left: 0;
          width: 100%;
          height: 200%;
          background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
          z-index: -1;
          will-change: transform;
          transform: translateZ(0);
          opacity: 0;
          transition: opacity 0.2s ease;
        }
        
        body.scrolling::after {
          opacity: 0.1;
        }
      }
    </style>
    
    <!-- Google Analytics буде ініціалізовано через GoogleServicesIntegration компонент -->
    
    <!-- Meta Pixel - закоментовано до налаштування -->
    <!--
    <script>
      !function(f,b,e,v,n,t,s)
      {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
      n.callMethod.apply(n,arguments):n.queue.push(arguments)};
      if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
      n.queue=[];t=b.createElement(e);t.async=!0;
      t.src=v;s=b.getElementsByTagName(e)[0];
      s.parentNode.insertBefore(t,s)}(window, document,'script',
      'https://connect.facebook.net/en_US/fbevents.js');
      fbq('init', 'YOUR_PIXEL_ID'); // Замініть на справжній Pixel ID
      fbq('track', 'PageView');
    </script>
    -->
    <script type="module" crossorigin src="/assets/index-BZ2N9BKP.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-Z7PLOiih.css">
  </head>
  <body>
    <div id="root"></div>
    
    <!-- Скрипт для оптимізації скролінгу -->
    <script>
      let scrollTimeout;
      function handleScroll() {
        // Додаємо клас для показу скролінгу
        document.body.classList.add('scrolling');
        
        // Видаляємо клас через 100 мс після завершення скролінгу
        clearTimeout(scrollTimeout);
        scrollTimeout = setTimeout(() => {
          document.body.classList.remove('scrolling');
        }, 100);
      }
      
      // Додаємо пасивний обробник скролінгу
      window.addEventListener('scroll', handleScroll, { passive: true });
      
      // Попередній завантаження зображень для найвищого рівня
      window.addEventListener('load', () => {
        setTimeout(() => {
          if ('IntersectionObserver' in window) {
            const imgObserver = new IntersectionObserver((entries) => {
              entries.forEach((entry) => {
                if (entry.isIntersecting) {
                  const img = entry.target;
                  const dataSrc = img.getAttribute('data-src');
                  if (dataSrc) {
                    img.src = dataSrc;
                    img.removeAttribute('data-src');
                  }
                  imgObserver.unobserve(img);
                }
              });
            });
            
            // Знаходимо всі зображення з атрибутом data-src
            document.querySelectorAll('img[data-src]').forEach(img => {
              imgObserver.observe(img);
            });
          }
        }, 1000); // Затримка для пріоритета завантаження основного контенту
      });
    </script>
  </body>
</html>