/** Shopify CDN: Minification failed

Line 641:0 Expected "}" to go with "{"

**/
/* 1. Make menu font bolder and more readable (for desktop) */
.header-menu .menu-list__link,
.header-menu span,
.header__inline-menu .list-menu__item {
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  color: #111111 !important;
}

.header-menu .menu-list__link:hover {
  opacity: 0.7 !important;
}

/* 2. Ideal mobile header (Specific to Horizon structure) */
@media screen and (max-width: 749px) {
  
  /* Hide account icon permanently */
  header-actions dialog-component.account-drawer,
  .account-drawer,
  .header-actions__action--account {
    display: none !important;
  }

  /* Turn header into a flexible container */
  #header-component .header__columns {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: relative !important; 
    padding-inline: 15px !important; 
  }

  /* Left section (Burger + Search) */
  .header__column--left {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 1 !important;
    gap: 0px !important; 
  }
  
  /* Cut off "invisible" frames (hitboxes) of the buttons inside */
  .header__column--left .header__icon,
  .header__column--left .header-actions__action {
    margin: 0 !important;
    min-width: auto !important; 
  }
  
  /* Right section (Cart) */
  .header__column--right {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    justify-content: flex-end !important; 
  }

  /* EXTRACT LOGO AND PLACE STRICTLY IN THE CENTER */
  .header-logo {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, calc(-50% - 4px)) !important;
    max-width: 105px !important; 
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    z-index: 10 !important;
  }

  .header-logo img, 
  .header-logo svg {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
}

/* 3. Ideal desktop slideshow (Rounded corners and transparent background) */
@media screen and (min-width: 750px) {
  
  .slideshow-section,
  .slideshow-section slideshow-component,
  .slideshow-section slideshow-container,
  .slideshow-section slideshow-slides,
  .slideshow-section slideshow-slide,
  .slideshow-section .slide__content,
  .slideshow-section .slide_image-container {
    background-color: transparent !important;
    background: transparent !important;
  }
  
  .slideshow-section slideshow-slides {
    border-radius: 32px !important;
    overflow: hidden !important;
    border: none !important; 
    box-shadow: none !important; 
  }
} 

/* 4. White header (no overlay on photo, but sticky on scroll) */

.header[transparent] {
  position: static !important; 
}

.header[transparent] .header__row,
#header-component .header__row {
  background-color: #ffffff !important;
  transition: background-color 0.3s ease; 
}

main #MainContent {
  margin-top: 0 !important;
}

/* ==========================================
   5. GLOBAL PRODUCT CARD FIX
   ========================================== */

/* 1. Make titles larger and more prominent */
[class*="product-title"], 
[class*="card__heading"], 
[class*="product-item__title"] {
  font-size: 18px !important; 
  font-weight: 600 !important;
  letter-spacing: 0.2px !important;
}

/* 2. Make price larger */
[class*="price"] {
  font-size: 16px !important; 
  font-weight: 500 !important;
}

/* 3. Kill the huge top margin */
.section-resource-list,
.section-carousel {
  padding-top: 0 !important; 
}

/* 4. БЕЗОПАСНЫЙ фикс отступов на десктопе (Без поломки внутренних галерей) */
@media screen and (min-width: 750px) {
  
  /* Бьем ТОЛЬКО по самой внешней обертке карусели, чтобы убить правый отступ */
  .section-resource-list .resource-list__carousel,
  .section-resource-list .slider {
    padding-right: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
  }
  
  /* Скрываем всё, что пытается вылезти за пределы */
  .section-resource-list {
    overflow: hidden !important;
  }
}

/* 5. Hide remaining navigation (arrows) if they appeared */
[class*="carousel__navigation"],
[class*="slider-buttons"] {
  display: none !important;
}

/* 6. Mobile responsiveness (when 2 products per row) */
@media screen and (max-width: 749px) {
  [class*="product-title"], 
  [class*="card__heading"] {
    font-size: 15px !important;
    line-height: 1.2 !important;
  }
  
  [class*="price"] {
    font-size: 14px !important;
  }
}

/* Restore airy padding for product section ONLY on mobile */
@media screen and (max-width: 749px) {
  .section-resource-list,
  .section-carousel {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

/* ==========================================
   6. PERFECT PRODUCT GRID ALIGNMENT (MOBILE)
   ========================================== */

@media screen and (max-width: 749px) {
  
  /* 1. Target the exact title elements inside Horizon's product cards */
  .product-card [class*="title"], 
  .product-card [class*="heading"],
  .product-card h3,
  .product-card__title {
    min-height: 40px !important; 
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; 
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
  }

  /* 2. Make sure the content wrapper flexes properly */
  .product-card__content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important; 
  }
}

/* Убираем верхний отступ у секции Multicolumn */
.layout-panel-flex.section-content-wrapper {
  padding-top: 0 !important;
}

/* Обновленные отступы Bento секции */
  .bento-why-us {
    overflow: hidden;
    padding-top: 0 !important; /* Всегда 0 сверху */
    padding-bottom: 48px !important; /* 48px снизу на десктопе */
  }

  /* Настройки для мобильной версии */
  @media screen and (max-width: 749px) {
    .bento-why-us {
      padding-bottom: 24px !important; /* 24px снизу на мобилке */
    }
    
    /* Остальные твои мобильные стили... */
    .bento-title { font-size: 28px; }
    .bento-grid { grid-template-columns: 1fr; gap: 20px; }
    .bento-main-visual { height: 350px; min-height: auto; }
    .bento-feature-card { flex-direction: row; align-items: flex-start; gap: 16px; padding: 20px; }
    .bento-icon-wrapper { width: 48px; height: 48px; border-radius: 12px; }
    .bento-svg-icon svg { width: 24px; height: 24px; }
    .bento-feature-title { font-size: 16px; margin-bottom: 4px; }
    .bento-feature-text { font-size: 13px; }
  }

  /* Обнуляем отступы сверху и настраиваем низ для блока отзывов */
.custom-reviews-section {
  padding-top: 0 !important;
  padding-bottom: 48px !important;
}

/* Настройки для мобильной версии */
@media screen and (max-width: 749px) {
  .custom-reviews-section {
    padding-top: 0 !important;
    padding-bottom: 24px !important;
  }
}

/* Убираем отступ сверху и настраиваем низ для FAQ */
.custom-faq-section {
  padding-top: 0 !important;
  padding-bottom: 48px !important;
}

/* Настройки для мобильной версии FAQ */
@media screen and (max-width: 749px) {
  .custom-faq-section {
    padding-top: 0 !important;
    padding-bottom: 24px !important;
  }
}

/* =========================================
   СЕТКА ФУТЕРА (ПК)
   ========================================= */
.footer-content {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas:
    "email   ."
    "social  ."
    "copy    ."
    "menu    payment" !important;
  row-gap: 20px !important;
  column-gap: 40px !important;
  padding-top: 80px !important;
  padding-bottom: 60px !important;
  border-top: 1px solid #f0f0f0 !important;
}

/* Сброс внешних отступов у блоков */
.footer-content > * {
  margin: 0 !important;
  max-width: 100% !important;
}

/* --- 1. ПОДПИСКА (Верх Лево) --- */
.footer-content > :nth-child(1) {
  grid-area: email;
  max-width: 400px !important;
  width: 100% !important;
}

/* --- 2. СОЦСЕТИ (Под подпиской) --- */
.footer-content > :nth-child(2) {
  grid-area: social;
  display: flex !important;
  justify-content: flex-start !important;
}

/* --- КОПИРАЙТ (Вставляем текстом над меню) --- */
.footer-content::before {
  content: "© 2026 Livvera. Powered by Shopify";
  grid-area: copy;
  font-size: 14px;
  color: #666;
  margin-top: 30px; 
}

/* --- 3. МЕНЮ (Низ Лево) --- */
.footer-content > :nth-child(3) {
  grid-area: menu;
}
.footer-content .list-unstyled {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
  padding: 0 !important;
  margin: 0 !important;
}
.footer-content .list-unstyled li {
  display: inline-flex !important;
  width: auto !important; 
  margin: 0 !important;
  align-items: center !important;
}
.footer-content .list-unstyled li a {
  font-size: 14px !important;
  color: #666 !important;
  text-decoration: none !important;
}
.footer-content .list-unstyled li a:hover {
  color: #111 !important;
}
.footer-content .list-unstyled li:not(:last-child)::after {
  content: "•";
  color: #888;
  margin-left: 15px;
  display: inline-block;
}

/* --- 4. ОПЛАТА (Низ Право) --- */
.footer-content > :nth-child(4) {
  grid-area: payment;
  display: flex !important;
  justify-content: flex-end !important; 
  align-items: flex-end !important;
}
.payment-icons__list {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  max-width: none !important; /* УБРАЛИ ОГРАНИЧЕНИЕ: теперь они в один ряд на ПК */
}

/* =========================================
   ИДЕАЛЬНАЯ МОБИЛЬНАЯ ВЕРСИЯ
   ========================================= */
@media screen and (max-width: 749px) {
  .footer-content {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "email"
      "social"
      "payment"
      "copy"
      "menu" !important;
    gap: 32px !important;
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  
  .footer-content > * {
    justify-self: center !important;
    text-align: center !important;
  }

  .footer-content > :nth-child(2) {
    justify-content: center !important;
  }

  .footer-content > :nth-child(4) {
    justify-content: center !important; 
  }
  .payment-icons__list {
    justify-content: center !important;
    max-width: 280px !important; /* На мобилке возвращаем лимит, чтобы красиво переносились */
  }

  /* Меню вертикально и ПО ЦЕНТРУ на мобилке */
  .footer-content .list-unstyled {
    flex-direction: column !important;
    align-items: center !important; /* ДОБАВИЛИ ЦЕНТРИРОВАНИЕ МЕНЮ */
    gap: 16px !important;
  }
  .footer-content .list-unstyled li::after {
    display: none !important; 
  }

  .footer-content::before {
    text-align: center;
    margin-top: 0;
  }
}

/* Применяем изменения ТОЛЬКО для десктопа (шире 750px) */
@media screen and (min-width: 750px) {
  
  .product-form-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important; 
    width: 100% !important;
  }

  /* 1. Блок количества: жестко на всю ширину (100%) */
  .product-form-buttons .quantity-selector-wrapper {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 2. Жестко рубим блоки кнопок ровно 50/50 */
  .product-form-buttons add-to-cart-component,
  .product-form-buttons .accelerated-checkout-block {
    flex: 0 0 calc(50% - 8px) !important; 
    width: calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    margin: 0 !important;
  }
  
  /* 3. ФИКС ВЫСОТЫ: Серая кнопка ровно 52px */
  .product-form-buttons add-to-cart-component button[name="add"] {
    width: 100% !important;
    height: 52px !important; /* Жестко 52px */
    min-height: 52px !important;
    max-height: 52px !important;
    margin: 0 !important;
    padding-top: 0 !important; /* Убиваем дефолтные отступы темы */
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* 4. Запрещаем фиолетовой кнопке вылезать за рамки */
  .product-form-buttons .accelerated-checkout-block .shopify-payment-button {
    width: 100% !important;
  }
}

/* =========================================
   ИДЕАЛЬНАЯ МОБИЛЬНАЯ ВЕРСИЯ (до 749px)
   ========================================= */
@media screen and (max-width: 749px) {
  
  .product-form-buttons {
    display: flex !important;
    flex-wrap: wrap !important; /* Разрешаем перенос элементов на новые строки */
    gap: 12px !important; /* Отступ между рядами */
  }

  /* 1. Количество: на всю ширину (100%), чтобы следующие кнопки ушли вниз */
  .product-form-buttons .quantity-selector-wrapper {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 2. Обёртка серой кнопки (строго исключаем блок с ошибкой, чтобы не было красного "!") */
  .product-form-buttons > span:not(.product-form-text__error) {
    flex: 0 0 100% !important;
    width: 100% !important;
  }

  /* Сама серая кнопка: тянем на 100% и фиксируем высоту под фиолетовую */
  .product-form-buttons add-to-cart-component button[name="add"] {
    width: 100% !important;
    min-height: 52px !important;
    height: 52px !important;
    margin: 0 !important;
  }

  /* 3. Блок фиолетовой кнопки: на всю ширину */
  .product-form-buttons .accelerated-checkout-block {
    flex: 0 0 100% !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Убиваем встроенный "костыльный" отступ Shopify, чтобы не было дыры */
  .product-form-buttons .shopify-payment-button {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* --- НАСТРОЙКИ ОТСТУПОВ ДЛЯ СЕКЦИИ ПРОДУКТА --- */

/* Компьютерная версия (Десктоп) */

/* Мобильная версия (до 749px) */
@media screen and (max-width: 749px) {
  .product-information {
    padding-top: 0 !important;
    padding-bottom: 24px !important;
  }
}

/* =========================================
   ФИКС ОШИБКИ "SOLD OUT" (Исправленный)
   ========================================= */
.product-form-buttons .product-form-text__error:not([hidden]),
.product-form-buttons .product-form__error-message-wrapper:not([hidden]),
.product-form-buttons [role="alert"]:not([hidden]),
.product-form-buttons .form__message:not([hidden]) {
  flex: 0 0 100% !important;
  width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

/* Отступы для компьютера */
  .htu {
    padding-top: 0 !important;
    padding-bottom: 48px !important;
    width: 100%;
  }

  /* Отступы для телефона */
  @media (max-width: 768px) {
    .htu { 
      padding-top: 0 !important; 
      padding-bottom: 24px !important; 
    }

    /* =========================================
   ОТСТУПЫ ДЛЯ СЕКЦИИ "YOU MAY ALSO LIKE"
   ========================================= */

/* Десктоп (ПК) */
.section-resource-list {
  padding-top: 0 !important;
  padding-bottom: 48px !important;
}

/* Мобильная версия (до 749px) */
@media screen and (max-width: 749px) {
  .section-resource-list {
    padding-top: 0 !important;
    padding-bottom: 24px !important;
  }
}

/* Базовые стили для ПК: убираем верхний отступ, нижний 48px */
div.jm-review-widget {
    padding-top: 0px !important;
    padding-bottom: 48px !important;
}

/* Стили для мобильных устройств (экраны до 768px) */
@media screen and (max-width: 768px) {
    div.jm-review-widget {
        padding-bottom: 24px !important;
    }
}

/* --- ВЫРАВНИВАНИЕ НА ДЕСКТОПЕ --- */
/* Резервируем место под 2 строки названия, чтобы рейтинг и цена всегда были на одном уровне */
div[class*="__product_title"] {
    min-height: 54px; /* Примерная высота двух строк. Если не хватит - увеличь до 60px */
}

/* --- НАСТРОЙКИ ДЛЯ МОБИЛОК (экраны до 768px) --- */
@media screen and (max-width: 768px) {
    div[class*="__product_title"] {
        /* Обнуляем отступы, как ты и просил */
        margin: 0px !important;
        padding: 0px !important;
        
        /* На мобилке шрифт может быть меньше, поэтому высота под 2 строки тоже чуть меньше */
        min-height: 42px; 
    }
}

/* Настройки только для мобильных устройств (экраны до 768px) */
@media screen and (max-width: 768px) {
    div.section-resource-list {
        padding-top: 24px !important;
    }
}


@media screen and (max-width: 768px) {
    /* Используем связку из трех классов для максимального веса */
    div.spacing-style.text-block[class*="__product_title"] {
        margin: 0px !important;
        margin-bottom: 0px !important;
    }
}

/* Настройки только для компьютеров и планшетов (экраны шире 768px) */
@media screen and (min-width: 769px) {
    div.jm-stack.jm-review-widget {
        padding-top: 0px !important;
    }
}

/* Базовые отступы для компьютера (48px сверху и снизу) */
div.htup[id^="htup-template"] {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
}

/* Отступы для мобильной версии (экраны до 768px) */
@media screen and (max-width: 768px) {
    div.htup[id^="htup-template"] {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}