/**
 * Janosci Homepage ? Full Mobile App UI
 * Applies only ?767.98px. Desktop layout untouched.
 */
@media (max-width: 767.98px) {

  /* ── FOUNDATION + SCROLL UNLOCK ── */
  html {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-text-size-adjust: 100%;
    overscroll-behavior-y: auto !important;
  }

  html,
  body.app-body.home-catalog {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
  }

  body.app-body.home-catalog,
  body.app-body.home-catalog.home-pro,
  body.app-body.home-catalog.home-mobile-app {
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y pinch-zoom !important;
    position: relative !important;
    background:
      radial-gradient(ellipse 100% 36% at 50% -8%, rgba(23, 105, 232, 0.12), transparent 55%),
      linear-gradient(180deg, #eef3fb 0%, #f4f7fc 40%, #f0f4fa 100%) !important;
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    font-family: "Plus Jakarta Sans", Inter, "Public Sans", system-ui, -apple-system, sans-serif !important;
  }

  /* Never trap scroll behind mega/search leftovers on mobile home */
  body.app-body.home-catalog.mega-menu-open,
  body.app-body.home-catalog.nav-scroll-lock {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.app-body.home-catalog *,
  body.app-body.home-catalog *::before,
  body.app-body.home-catalog *::after {
    box-sizing: border-box;
  }

  body.app-body.home-catalog img {
    max-width: 100%;
    height: auto;
  }

  body.app-body.home-catalog .ann-bar,
  body.app-body.home-catalog .header-search,
  body.app-body.home-catalog .header-nav,
  body.app-body.home-catalog .header-shop-zone,
  body.app-body.home-catalog .ml-home-achievements {
    display: none !important;
  }

  body.app-body.home-catalog .page-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto !important;
    max-height: none !important;
    background: transparent !important;
    padding-top: 56px !important;
    overflow: visible !important;
    overflow-x: hidden !important;
    touch-action: pan-y pinch-zoom !important;
  }

  /* Horizontal strips: allow x-pan without killing page scroll */
  body.app-body.home-catalog .app-quick-actions,
  body.app-body.home-catalog .app-cat-icons,
  body.app-body.home-catalog .hc-feature-grid,
  body.app-body.home-catalog .mobile-cat-chips,
  body.app-body.home-catalog .ml-shop-swiper {
    touch-action: pan-x pan-y !important;
  }

  body.app-body.home-catalog .hero-swiper {
    touch-action: pan-y !important;
  }

  body.app-body.home-catalog .container,
  body.app-body.home-catalog .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  /* Shared section rhythm */
  body.app-body.home-catalog .mobile-section-pad {
    padding-left: 14px;
    padding-right: 14px;
  }

  /* ??????????? APP HEADER ??????????? */
  body.app-body.home-catalog .site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    z-index: 1050 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(18px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
    border-bottom: 1px solid rgba(228, 234, 242, 0.95) !important;
    box-shadow: 0 2px 16px rgba(16, 24, 40, 0.05) !important;
    transform: none !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.app-body.home-catalog .site-header > .container {
    height: 56px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.app-body.home-catalog .header-main {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .header-logo-img {
    width: auto !important;
    max-width: 148px !important;
    height: 54px !important;
    max-height: 54px !important;
    object-fit: contain !important;
  }

  body.app-body.home-catalog .header-actions,
  body.app-body.home-catalog .catalog-header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-left: auto !important;
  }

  body.app-body.home-catalog .site-header .action-btn,
  body.app-body.home-catalog .site-header .cart-btn,
  body.app-body.home-catalog .site-header .mobile-search-trigger,
  body.app-body.home-catalog .site-header .mobile-menu-trigger,
  body.app-body.home-catalog .site-header .catalog-action-link.action-btn,
  body.app-body.home-catalog .site-header .catalog-action-link.cart-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f4f7fc !important;
    border: 1px solid #e6ecf4 !important;
    border-radius: 12px !important;
    color: #17305f !important;
    box-shadow: none !important;
    position: relative !important;
    font-size: 1rem !important;
  }

  body.app-body.home-catalog .site-header .user-menu,
  body.app-body.home-catalog .site-header .catalog-action-text,
  body.app-body.home-catalog .site-header .catalog-account-link {
    display: none !important;
  }

  body.app-body.home-catalog .site-header .cart-count,
  body.app-body.home-catalog .site-header .cart-badge,
  body.app-body.home-catalog .site-header .wish-badge,
  body.app-body.home-catalog .site-header .catalog-badge {
    position: absolute !important;
    top: 1px !important;
    right: 1px !important;
    min-width: 16px !important;
    height: 16px !important;
    background: #175cd3 !important;
    color: #fff !important;
    border-radius: 999px !important;
    font-size: 0.55rem !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #fff !important;
  }

  /* Search sheet */
  body.app-body.home-catalog .mobile-search-sheet {
    padding: 12px 14px 16px !important;
    background: #f2f5fb !important;
    border-bottom: 1px solid #e4eaf2 !important;
  }

  body.app-body.home-catalog .mobile-search-field input {
    width: 100% !important;
    height: 48px !important;
    border-radius: 14px !important;
    border: 1px solid #dfe7f2 !important;
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(16, 24, 40, 0.05) !important;
    font-size: 15px !important;
  }

  body.app-body.home-catalog .mobile-search-submit {
    height: 46px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    margin-top: 8px !important;
    font-weight: 700 !important;
  }

  /* ═══════════ HERO SLIDER (fixed height — Swiper needs this) ═══════════ */
  body.app-body.home-catalog .hero-slider-section {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border-radius: 0 0 22px 22px !important;
    overflow: hidden !important;
    background: #0a2540 !important;
    box-shadow: 0 12px 32px rgba(10, 37, 64, 0.18) !important;
  }

  body.app-body.home-catalog .hero-swiper {
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(380px, 54vh, 480px) !important;
    min-height: 380px !important;
    max-height: 500px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  body.app-body.home-catalog .hero-swiper .swiper-wrapper {
    height: 100% !important;
    min-height: 100% !important;
  }

  body.app-body.home-catalog .hero-swiper .swiper-slide {
    height: 100% !important;
    min-height: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, #001a3a 0%, #0a2540 40%, #1769e8 100%) !important;
  }

  body.app-body.home-catalog .home-hero .slide-container,
  body.app-body.home-catalog .hero-slider-section .slide-container,
  body.app-body.home-catalog .slide-container {
    position: relative !important;
    z-index: 3 !important;
    height: 100% !important;
    min-height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.35rem 1.1rem 2.6rem !important;
    display: flex !important;
    align-items: flex-end !important;
    box-sizing: border-box !important;
  }

  body.app-body.home-catalog .slide-img,
  body.app-body.home-catalog .hero-swiper img.slide-img,
  body.app-body.home-catalog .slide-img-fallback {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    z-index: 1 !important;
  }

  body.app-body.home-catalog .slide-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    background: linear-gradient(
      180deg,
      rgba(8, 22, 54, 0.2) 0%,
      rgba(8, 22, 54, 0.45) 40%,
      rgba(8, 22, 54, 0.88) 100%
    ) !important;
  }

  body.app-body.home-catalog .slide-content {
    text-align: left !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.app-body.home-catalog .slide-tag {
    display: inline-flex !important;
    align-items: center !important;
    padding: 0.32rem 0.75rem !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.32) !important;
    font-size: 0.7rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    margin-bottom: 0.65rem !important;
    color: #fff !important;
    backdrop-filter: blur(8px);
  }

  body.app-body.home-catalog .slide-title {
    font-size: clamp(1.35rem, 5.2vw, 1.75rem) !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    margin: 0 0 0.5rem !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35) !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    max-width: 20ch !important;
  }

  body.app-body.home-catalog .slide-subtitle {
    font-size: 0.9rem !important;
    line-height: 1.45 !important;
    margin: 0 0 1.05rem !important;
    opacity: 0.95 !important;
    color: rgba(255, 255, 255, 0.92) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    max-width: 34ch !important;
  }

  body.app-body.home-catalog .slide-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: 100% !important;
  }

  body.app-body.home-catalog .slide-actions .btn,
  body.app-body.home-catalog .slide-actions a {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    padding: 0.55rem 0.85rem !important;
    flex: 1 1 0 !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  body.app-body.home-catalog .slide-actions .btn-hc-primary,
  body.app-body.home-catalog .slide-actions .btn-gold {
    background: #1769e8 !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(23, 105, 232, 0.4) !important;
  }

  body.app-body.home-catalog .slide-actions .btn-outline-white {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.85) !important;
    color: #fff !important;
    backdrop-filter: blur(6px);
  }

  body.app-body.home-catalog .hero-swiper .swiper-button-next,
  body.app-body.home-catalog .hero-swiper .swiper-button-prev {
    display: none !important;
  }

  body.app-body.home-catalog .hero-swiper .swiper-pagination {
    bottom: 10px !important;
    z-index: 5 !important;
  }

  body.app-body.home-catalog .hero-swiper .swiper-pagination-bullet {
    width: 7px !important;
    height: 7px !important;
    background: rgba(255, 255, 255, 0.45) !important;
    opacity: 1 !important;
    margin: 0 3px !important;
    transition: width 0.2s ease, background 0.2s ease !important;
  }

  body.app-body.home-catalog .hero-swiper .swiper-pagination-bullet-active {
    width: 22px !important;
    border-radius: 999px !important;
    background: #fff !important;
  }

  /* ??????????? FEATURE CHIPS ??????????? */
  body.app-body.home-catalog .hc-feature-ribbon {
    margin: -1.35rem 0 0.25rem !important;
    padding: 0 !important;
    max-width: 100% !important;
    position: relative !important;
    z-index: 6 !important;
  }

  body.app-body.home-catalog .hc-feature-ribbon .container {
    padding: 0 !important;
    max-width: 100% !important;
  }

  body.app-body.home-catalog .hc-feature-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 14px 16px !important;
    margin: 0 !important;
    background: transparent !important;
  }

  body.app-body.home-catalog .hc-feature-grid::-webkit-scrollbar {
    display: none !important;
  }

  body.app-body.home-catalog .hc-feature-item {
    flex: 0 0 auto !important;
    min-width: 172px !important;
    max-width: 200px !important;
    scroll-snap-align: start;
    display: flex !important;
    align-items: center !important;
    gap: 0.7rem !important;
    padding: 0.9rem 0.95rem !important;
    border-radius: 16px !important;
    border: 1px solid #e5ebf4 !important;
    background: #fff !important;
    box-shadow: 0 10px 28px rgba(16, 24, 40, 0.08) !important;
    transform: none !important;
  }

  body.app-body.home-catalog .hc-feature-ico {
    width: 40px !important;
    height: 40px !important;
    border-radius: 11px !important;
    font-size: 0.95rem !important;
    flex-shrink: 0 !important;
  }

  body.app-body.home-catalog .hc-feature-item > div strong {
    font-size: 0.78rem !important;
    line-height: 1.25 !important;
    font-weight: 750 !important;
    color: #101828 !important;
  }

  body.app-body.home-catalog .hc-feature-item > div span {
    font-size: 0.68rem !important;
    color: #98a2b3 !important;
  }

  /* ??????????? SECTION HEADERS ??????????? */
  body.app-body.home-catalog .cat-section-head,
  body.app-body.home-catalog .ml-shop-slider-heading {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
  }

  body.app-body.home-catalog .cat-section-head .section-tag,
  body.app-body.home-catalog .ml-section-label {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 0 0.35rem !important;
    padding: 0.22rem 0.55rem !important;
    border-radius: 999px !important;
    background: #edf4ff !important;
    color: #175cd3 !important;
    font-size: 0.65rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    border: none !important;
  }

  body.app-body.home-catalog .cat-section-head h2,
  body.app-body.home-catalog .mobile-section-title,
  body.app-body.home-catalog .ml-shop-slider-title {
    margin: 0 !important;
    font-size: 1.2rem !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.01em !important;
  }

  body.app-body.home-catalog .cat-section-head p,
  body.app-body.home-catalog .mobile-section-subtitle {
    margin: 4px 0 0 !important;
    font-size: 0.78rem !important;
    line-height: 1.35 !important;
    color: #667085 !important;
    max-width: 210px !important;
  }

  body.app-body.home-catalog .cat-section-link,
  body.app-body.home-catalog .ml-shop-slider-viewall {
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    color: #175cd3 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
  }

  /* ??????????? CATEGORIES ??????????? */
  body.app-body.home-catalog .section-categories {
    padding: 0.5rem 0 0.25rem !important;
    margin: 0 !important;
    background: transparent !important;
  }

  body.app-body.home-catalog .section-categories .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.app-body.home-catalog .cat-section-head {
    padding: 4px 0 10px !important;
  }

  body.app-body.home-catalog .mobile-cat-chips {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding: 0 0 12px !important;
    margin: 0 !important;
  }

  body.app-body.home-catalog .mobile-cat-chips::-webkit-scrollbar {
    display: none !important;
  }

  body.app-body.home-catalog .mobile-cat-chip {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 36px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid #dde5f0 !important;
    color: #344054 !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 8px rgba(16, 24, 40, 0.04) !important;
  }

  body.app-body.home-catalog .mobile-cat-chip:active {
    background: #edf4ff !important;
    color: #175cd3 !important;
    border-color: #bfd5ff !important;
  }

  body.app-body.home-catalog .category-grid,
  body.app-body.home-catalog .ml-cat-grid,
  body.app-body.home-catalog .category-grid.ml-cat-grid,
  body.app-body.home-catalog .category-card-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px !important;
    padding: 0 0 8px !important;
    margin: 0 !important;
    overflow: visible !important;
    width: 100% !important;
  }

  body.app-body.home-catalog .cat-card,
  body.app-body.home-catalog .ml-cat-card,
  body.app-body.home-catalog .mobile-category-card {
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    min-height: 198px !important;
    height: auto !important;
    padding: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border: 1px solid #e5ebf4 !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 22px rgba(16, 24, 40, 0.06) !important;
    overflow: hidden !important;
    text-decoration: none !important;
    transform: none !important;
    -webkit-tap-highlight-color: transparent;
  }

  body.app-body.home-catalog .cat-card:active {
    transform: scale(0.985) !important;
  }

  body.app-body.home-catalog .ml-cat-icon-glow {
    display: none !important;
  }

  body.app-body.home-catalog .ml-cat-icon-wrap {
    margin: 0 !important;
    padding: 0 !important;
  }

  body.app-body.home-catalog .cat-card-icon,
  body.app-body.home-catalog .ml-cat-icon,
  body.app-body.home-catalog .category-icon-box {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: linear-gradient(145deg, var(--cat-accent, #1769e8), var(--cat-accent-dark, #103f9c)) !important;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--cat-accent, #1769e8) 35%, transparent) !important;
    margin: 0 !important;
  }

  body.app-body.home-catalog .cat-card-icon i,
  body.app-body.home-catalog .ml-cat-icon i {
    color: #fff !important;
    font-size: 1.1rem !important;
    opacity: 1 !important;
  }

  body.app-body.home-catalog h3.cat-card-title,
  body.app-body.home-catalog .cat-card-title {
    margin: 12px 0 5px !important;
    font-size: 0.92rem !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    color: #101828 !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    hyphens: none !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
  }

  body.app-body.home-catalog .cat-card-desc {
    margin: 0 !important;
    min-height: 34px !important;
    max-height: 34px !important;
    font-size: 0.74rem !important;
    line-height: 1.45 !important;
    color: #667085 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    opacity: 1 !important;
    word-break: normal !important;
  }

  body.app-body.home-catalog .category-card-footer {
    margin-top: auto !important;
    padding-top: 10px !important;
  }

  body.app-body.home-catalog .cat-card-meta {
    display: block !important;
    margin: 0 0 6px !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #98a2b3 !important;
  }

  body.app-body.home-catalog .cat-card-cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    color: #175cd3 !important;
  }

  /* ??????????? TRUST PILLS ??????????? */
  body.app-body.home-catalog .jp-trust {
    padding: 0.4rem 0 0.85rem !important;
    background: transparent !important;
  }

  body.app-body.home-catalog .jp-trust .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.app-body.home-catalog .jp-trust-strip {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
    padding: 0 14px !important;
    -webkit-overflow-scrolling: touch;
  }

  body.app-body.home-catalog .jp-trust-strip::-webkit-scrollbar {
    display: none !important;
  }

  body.app-body.home-catalog .jp-trust-item {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    background: #fff !important;
    border: 1px solid #e5ebf4 !important;
    border-radius: 999px !important;
    padding: 0.55rem 0.95rem !important;
    font-size: 0.72rem !important;
    color: #475467 !important;
    box-shadow: 0 4px 12px rgba(16, 24, 40, 0.04) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
  }

  body.app-body.home-catalog .jp-trust-item i {
    color: #175cd3 !important;
    font-size: 0.8rem !important;
  }

  body.app-body.home-catalog .jp-trust-item.jp-trust-cta {
    padding: 0.25rem 0.35rem 0.25rem 0.85rem !important;
  }

  body.app-body.home-catalog .jp-trust-item.jp-trust-cta .btn {
    min-height: 34px !important;
    padding: 0.3rem 0.8rem !important;
    font-size: 0.72rem !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
  }

  /* ??????????? PRODUCT SHELVES ??????????? */
  body.app-body.home-catalog .ml-shop-slider-section,
  body.app-body.home-catalog .ml-cat-slides-section {
    padding: 0.65rem 0 0.35rem !important;
    background: transparent !important;
    overflow: hidden !important;
  }

  body.app-body.home-catalog .ml-shop-slider-section .container,
  body.app-body.home-catalog .ml-cat-slides-section .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.app-body.home-catalog .ml-shop-nav {
    display: inline-flex !important;
    width: 36px !important;
    height: 36px !important;
    font-size: 0.85rem !important;
  }

  body.app-body.home-catalog .ml-shop-nav--prev { left: 4px !important; }
  body.app-body.home-catalog .ml-shop-nav--next { right: 4px !important; }

  body.app-body.home-catalog .ml-shop-slider-wrap {
    margin: 0 -14px !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.app-body.home-catalog .ml-shop-swiper {
    padding: 2px 14px 12px !important;
    overflow: visible !important;
  }

  body.app-body.home-catalog .ml-shop-swiper .swiper-slide {
    height: auto !important;
  }

  body.app-body.home-catalog .ml-shop-card.janosci-product-card {
    border-radius: 16px !important;
    border: 1px solid #e5ebf4 !important;
    box-shadow: 0 8px 20px rgba(16, 24, 40, 0.06) !important;
    background: #fff !important;
    padding: 10px !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-img-wrap {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    background: #f8fafc !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-img-wrap img {
    width: 100% !important;
    height: 100% !important;
    padding: 8px !important;
    object-fit: contain !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-zoom-hint,
  body.app-body.home-catalog .ml-shop-card .sale-badge--featured,
  body.app-body.home-catalog .ml-shop-card .card-brand {
    display: none !important;
  }

  body.app-body.home-catalog .ml-shop-card .stock-badge {
    top: 6px !important;
    left: 6px !important;
    font-size: 0.58rem !important;
    padding: 3px 7px !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
  }

  body.app-body.home-catalog .ml-shop-card .wishlist-btn {
    opacity: 1 !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    background: #fff !important;
    border: 1px solid #e8edf5 !important;
    top: 6px !important;
    right: 6px !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-body {
    padding: 8px 2px 2px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-title {
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #101828 !important;
    margin: 0 0 3px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 2.15em !important;
    word-break: normal !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-sku {
    font-size: 0.65rem !important;
    color: #98a2b3 !important;
    margin-bottom: 4px !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-price {
    margin-bottom: 8px !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-price-now {
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    color: #175cd3 !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-gst {
    display: block !important;
    width: 100% !important;
    font-size: 0.6rem !important;
    color: #98a2b3 !important;
  }

  body.app-body.home-catalog .ml-shop-card .card-actions {
    margin-top: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
  }

  body.app-body.home-catalog .ml-shop-card .btn-view-details {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
    background: #edf4ff !important;
    color: #175cd3 !important;
    border: 1px solid #d4e4ff !important;
    font-size: 0.75rem !important;
    font-weight: 750 !important;
    text-decoration: none !important;
  }

  body.app-body.home-catalog .ml-shop-card .btn-add-cart,
  body.app-body.home-catalog .ml-shop-card .btn-enquiry {
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 10px !important;
    font-size: 0.75rem !important;
    font-weight: 750 !important;
  }

  body.app-body.home-catalog .ml-shop-card .btn-add-cart {
    background: linear-gradient(135deg, #1769e8, #1155c7) !important;
    color: #fff !important;
    border: none !important;
  }

  body.app-body.home-catalog .jp-subject-head {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .jp-subject-icon {
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: color-mix(in srgb, var(--slide-accent, #1769e8) 14%, #fff) !important;
    color: var(--slide-accent, #1769e8) !important;
    font-size: 0.9rem !important;
  }

  body.app-body.home-catalog .jp-catalog-cta {
    padding: 0.75rem 0 0.5rem !important;
    text-align: center !important;
  }

  body.app-body.home-catalog .jp-catalog-cta .btn {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    font-weight: 750 !important;
    font-size: 0.92rem !important;
    background: linear-gradient(135deg, #1769e8, #1155c7) !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(23, 92, 211, 0.25) !important;
  }

  /* ??????????? TRUST STATS ??????????? */
  body.app-body.home-catalog .hc-trust-bar {
    margin: 0.5rem 14px 1rem !important;
    padding: 0 !important;
    max-width: none !important;
  }

  body.app-body.home-catalog .hc-trust-bar .container {
    padding: 0 !important;
  }

  body.app-body.home-catalog .hc-trust-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  body.app-body.home-catalog .hc-trust-item {
    background: #fff !important;
    border: 1px solid #e5ebf4 !important;
    border-radius: 16px !important;
    padding: 0.95rem 0.85rem !important;
    box-shadow: 0 6px 18px rgba(16, 24, 40, 0.05) !important;
    text-align: left !important;
  }

  body.app-body.home-catalog .hc-trust-ico {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #edf4ff !important;
    color: #175cd3 !important;
    margin-bottom: 0.55rem !important;
  }

  body.app-body.home-catalog .hc-trust-item strong {
    display: block !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    color: #101828 !important;
    line-height: 1.25 !important;
    margin-bottom: 0.15rem !important;
  }

  body.app-body.home-catalog .hc-trust-item span {
    font-size: 0.68rem !important;
    color: #98a2b3 !important;
  }

  /* ??????????? OUR STORY ??????????? */
  body.app-body.home-catalog .ml-story {
    padding: 1.5rem 0 !important;
    margin: 0.25rem 0 !important;
  }

  body.app-body.home-catalog .ml-story-layout {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  body.app-body.home-catalog .ml-story-copy h2 {
    font-size: 1.3rem !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    margin-bottom: 0.65rem !important;
    max-width: none !important;
  }

  body.app-body.home-catalog .ml-story-copy > p {
    font-size: 0.88rem !important;
    line-height: 1.55 !important;
    color: #475467 !important;
  }

  body.app-body.home-catalog .ml-story-bullets {
    margin: 0.85rem 0 1rem !important;
    padding: 0 !important;
    list-style: none !important;
  }

  body.app-body.home-catalog .ml-story-bullets li {
    font-size: 0.84rem !important;
    padding: 0.45rem 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
  }

  body.app-body.home-catalog .ml-story-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .ml-story-btn {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: center !important;
    border-radius: 12px !important;
    font-weight: 750 !important;
  }

  body.app-body.home-catalog .ml-story-panel {
    border-radius: 18px !important;
    padding: 1rem !important;
  }

  body.app-body.home-catalog .ml-story-stat-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .ml-story-stat {
    padding: 0.85rem 0.7rem !important;
    border-radius: 14px !important;
  }

  body.app-body.home-catalog .ml-story-stat strong {
    font-size: 1.15rem !important;
  }

  /* ??????????? ENQUIRY ??????????? */
  body.app-body.home-catalog .ml-enquiry {
    padding: 1.35rem 0 1.75rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-grid {
    grid-template-columns: 1fr !important;
    gap: 1.15rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-intro h2 {
    font-size: 1.25rem !important;
    font-weight: 800 !important;
  }

  body.app-body.home-catalog .ml-enquiry-cards {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .ml-enquiry-card {
    padding: 0.85rem !important;
    border-radius: 14px !important;
  }

  body.app-body.home-catalog .ml-enquiry-contact-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  body.app-body.home-catalog .ml-enquiry-contact-link {
    min-height: 42px !important;
    border-radius: 11px !important;
    font-size: 0.8rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-form {
    padding: 1.1rem !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 28px rgba(16, 24, 40, 0.07) !important;
    border: 1px solid #e5ebf4 !important;
  }

  body.app-body.home-catalog .ml-enquiry-fields {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-form input,
  body.app-body.home-catalog .ml-enquiry-form textarea {
    min-height: 46px !important;
    border-radius: 12px !important;
    border: 1.5px solid #dfe7f2 !important;
    font-size: 0.92rem !important;
    padding: 0.7rem 0.85rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-form textarea {
    min-height: 110px !important;
  }

  body.app-body.home-catalog .ml-enquiry-form button {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    font-weight: 750 !important;
    font-size: 0.92rem !important;
    background: linear-gradient(135deg, #1769e8, #1155c7) !important;
    border: none !important;
    box-shadow: 0 8px 18px rgba(23, 92, 211, 0.25) !important;
  }

  /* ??????????? BLOG (if present) ??????????? */
  body.app-body.home-catalog .home-blog,
  body.app-body.home-catalog .jp-blog {
    padding: 1rem 0 !important;
  }

  body.app-body.home-catalog .blog-grid,
  body.app-body.home-catalog .jp-blog-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* ??????????? REVIEWS / TESTIMONIALS ??????????? */
  body.app-body.home-catalog .jp-reviews {
    padding: 1.25rem 0 0.5rem !important;
  }

  body.app-body.home-catalog .jp-reviews .section-header {
    text-align: left !important;
    margin-bottom: 0.85rem !important;
  }

  body.app-body.home-catalog .jp-reviews .section-header h2 {
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    margin: 0.25rem 0 !important;
  }

  body.app-body.home-catalog .jp-reviews .section-header p,
  body.app-body.home-catalog .jp-reviews .section-divider {
    display: none !important;
  }

  body.app-body.home-catalog .jp-reviews .grid-3 {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding: 2px 2px 12px !important;
    margin: 0 -2px !important;
  }

  body.app-body.home-catalog .jp-reviews .grid-3::-webkit-scrollbar {
    display: none !important;
  }

  body.app-body.home-catalog .jp-reviews .testimonial-card {
    flex: 0 0 82% !important;
    max-width: 300px !important;
    min-width: 250px !important;
    border-radius: 16px !important;
    border: 1px solid #e5ebf4 !important;
    background: #fff !important;
    box-shadow: 0 8px 20px rgba(16, 24, 40, 0.06) !important;
    padding: 1rem !important;
  }

  body.app-body.home-catalog .jp-reviews .testimonial-text {
    font-size: 0.84rem !important;
    line-height: 1.45 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 4 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  body.app-body.home-catalog .jp-reviews .testimonial-stars {
    color: #f4b400 !important;
    font-size: 0.78rem !important;
    margin-bottom: 0.5rem !important;
  }

  body.app-body.home-catalog .jp-reviews .testimonial-avatar {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: #edf4ff !important;
    color: #175cd3 !important;
    font-size: 0.75rem !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* ——————————— FOOTER (brand blue, not emerald) ——————————— */
  body.app-body.home-catalog .jp-footer,
  body.app-body.home-catalog .site-footer {
    margin-bottom: 0 !important;
  }

  body.app-body.home-catalog .jp-footer .footer-top,
  body.app-body.home-catalog .site-footer .footer-top {
    padding: 1.5rem 0 1.15rem !important;
  }

  body.app-body.home-catalog .jp-footer .footer-bottom,
  body.app-body.home-catalog .site-footer .footer-bottom {
    padding: 0.85rem 0 1.25rem !important;
    font-size: 0.75rem !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-newsletter {
    background: linear-gradient(145deg, rgba(23,105,232,0.32), rgba(10,37,64,0.78)) !important;
    border-color: rgba(96,165,250,0.4) !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-news-tag {
    background: rgba(23,105,232,0.45) !important;
    color: #e0f2fe !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-news-text h3 {
    color: #fff !important;
    font-size: 1.18rem !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-news-text p,
  body.app-body .site-footer.jp-foot .jp-foot-about {
    color: #e2e8f0 !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-col ul li a {
    color: #f1f5f9 !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-news-form button {
    background: linear-gradient(135deg, #2b7fff, #1769e8 50%, #1155c7) !important;
    box-shadow: 0 10px 22px rgba(23,105,232,0.45) !important;
    color: #fff !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-news-field input:focus {
    border-color: #60a5fa !important;
    box-shadow: 0 0 0 3px rgba(23,105,232,0.3) !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-trust-item {
    color: #fff !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-trust-item i {
    color: #60a5fa !important;
  }

  body.app-body .site-footer.jp-foot .jp-foot-logo-plate {
    background: #fff !important;
    border-radius: 12px !important;
    padding: 0.45rem 0.7rem !important;
    display: inline-flex !important;
  }

  /* ??????????? FABs ??????????? */
  body.app-body.home-catalog .app-fab-wa,
  body.app-body.home-catalog .mobile-whatsapp {
    position: fixed !important;
    right: 14px !important;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    left: auto !important;
    z-index: 1060 !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 50% !important;
    background: #25d366 !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(37, 211, 102, 0.38) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.45rem !important;
    transform: none !important;
  }

  body.app-body.home-catalog .scroll-top-btn,
  body.app-body.home-catalog .back-to-top {
    position: fixed !important;
    right: 14px !important;
    bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important;
    left: auto !important;
    z-index: 1058 !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
  }

  /* ??????????? BOTTOM NAV ??????????? */
  body.app-body.home-catalog nav.mobile-bottom-nav {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    padding: 0 2px env(safe-area-inset-bottom, 0px) !important;
    margin: 0 !important;
    background: #ffffff !important;
    border-top: 1px solid #e8edf5 !important;
    border-radius: 0 !important;
    box-shadow: 0 -6px 24px rgba(16, 24, 40, 0.08) !important;
    z-index: 1080 !important;
    overflow: visible !important;
    transform: none !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    height: 64px !important;
    min-width: 0 !important;
    color: #667085 !important;
    text-decoration: none !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item i {
    font-size: 1.3rem !important;
    color: inherit !important;
    line-height: 1 !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item.active,
  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item.active i {
    color: #175cd3 !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .nav-icon-with-badge {
    position: relative !important;
    display: inline-flex !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .nav-count {
    position: absolute !important;
    top: -6px !important;
    right: -10px !important;
    min-width: 16px !important;
    height: 16px !important;
    background: #175cd3 !important;
    color: #fff !important;
    border-radius: 999px !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    font-style: normal !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .nav-count.is-empty {
    display: none !important;
  }
}

@media (max-width: 349.98px) {
  body.app-body.home-catalog .category-grid,
  body.app-body.home-catalog .ml-cat-grid {
    grid-template-columns: 1fr !important;
  }

  body.app-body.home-catalog .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  body.app-body.home-catalog .slide-title {
    font-size: 1.35rem !important;
  }

  body.app-body.home-catalog .ml-enquiry-cards {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 768px) {
  nav.mobile-bottom-nav {
    display: none !important;
  }
}

/* ===========================================================
   Janosci brand mobile strip — after hero
   Navy / Royal Blue / Soft Gold accents
   =========================================================== */
@media (max-width: 767.98px) {
  body.app-body.home-catalog .app-home-strip {
    display: block !important;
    background: transparent;
    padding: 0 0 18px;
    margin-top: -10px;
    position: relative;
    z-index: 4;
  }

  /* hc-feature-ribbon: visible on phone (see home-mobile-beautify.css) */

  /* Search — elevated pill */
  body.app-body.home-catalog .app-home-search {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 14px 12px !important;
    padding: 0 6px 0 16px !important;
    height: 52px !important;
    background: #fff !important;
    border: 1px solid rgba(23, 105, 232, 0.14) !important;
    border-radius: 16px !important;
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.8) inset,
      0 10px 28px rgba(10, 37, 64, 0.1) !important;
  }
  body.app-body.home-catalog .app-home-search i {
    color: #1769e8 !important;
    font-size: 1rem !important;
  }
  body.app-body.home-catalog .app-home-search input {
    flex: 1 !important;
    border: 0 !important;
    outline: none !important;
    background: transparent !important;
    font-size: 0.92rem !important;
    color: #0a2540 !important;
    height: 100% !important;
    min-width: 0 !important;
    font-weight: 500 !important;
  }
  body.app-body.home-catalog .app-home-search input::placeholder {
    color: #94a3b8 !important;
  }
  body.app-body.home-catalog .app-home-search button {
    height: 40px !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #1d7ef5 0%, #1155c7 55%, #0A2540 100%) !important;
    color: #fff !important;
    font-size: 0.8rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em !important;
    box-shadow: 0 6px 14px rgba(23, 105, 232, 0.35) !important;
  }

  /* Quick chips */
  body.app-body.home-catalog .app-quick-actions {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding: 0 14px 14px !important;
    -webkit-overflow-scrolling: touch;
  }
  body.app-body.home-catalog .app-quick-actions::-webkit-scrollbar { display: none !important; }
  body.app-body.home-catalog .app-quick-chip {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 38px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid #e2eaf5 !important;
    color: #0A2540 !important;
    font-size: 0.76rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(10, 37, 64, 0.05) !important;
  }
  body.app-body.home-catalog .app-quick-chip i {
    color: #1769e8 !important;
    font-size: 0.82rem !important;
  }
  body.app-body.home-catalog .app-quick-chip--hot {
    background: linear-gradient(135deg, #fff9eb, #fff) !important;
    border-color: #f0d78a !important;
    box-shadow: 0 4px 14px rgba(217, 119, 6, 0.1) !important;
  }
  body.app-body.home-catalog .app-quick-chip--hot i { color: #d97706 !important; }

  body.app-body.home-catalog .app-block-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 2px 6px 12px !important;
  }
  body.app-body.home-catalog .app-block-head h2 {
    margin: 0 !important;
    font-size: 1.12rem !important;
    font-weight: 800 !important;
    color: #0A2540 !important;
    letter-spacing: -0.02em !important;
  }
  body.app-body.home-catalog .app-block-head a {
    font-size: 0.8rem !important;
    font-weight: 750 !important;
    color: #1769e8 !important;
    text-decoration: none !important;
  }

  body.app-body.home-catalog .app-cat-block {
    margin: 0 14px 14px !important;
    padding: 16px 12px 14px !important;
    background: #fff !important;
    border: 1px solid rgba(228, 236, 247, 0.95) !important;
    border-radius: 20px !important;
    box-shadow: 0 10px 28px rgba(10, 37, 64, 0.06) !important;
  }

  body.app-body.home-catalog .app-cat-icon-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 16px 10px !important;
    padding: 2px 2px 4px !important;
  }
  body.app-body.home-catalog .app-cat-icon-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    min-width: 0 !important;
    color: #344054 !important;
  }
  body.app-body.home-catalog .app-cat-icon-circle {
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(145deg, #2b7fff 0%, #1769e8 45%, #0A2540 100%) !important;
    color: #fff !important;
    box-shadow:
      0 10px 20px rgba(23, 105, 232, 0.28),
      inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    font-size: 1.22rem !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  }
  body.app-body.home-catalog .app-cat-icon-item:active .app-cat-icon-circle {
    transform: scale(0.94) !important;
  }
  body.app-body.home-catalog .app-cat-icon-item--gold .app-cat-icon-circle {
    background: linear-gradient(145deg, #fcd34d, #f59e0b 55%, #d97706) !important;
    box-shadow: 0 10px 20px rgba(217, 119, 6, 0.28) !important;
  }
  body.app-body.home-catalog .app-cat-icon-item--soft .app-cat-icon-circle {
    background: linear-gradient(145deg, #60a5fa, #3b82f6 40%, #1769e8) !important;
  }
  body.app-body.home-catalog .app-cat-icon-circle i {
    color: inherit !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  body.app-body.home-catalog .app-cat-icon-label {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    max-width: 100% !important;
    color: #0A2540 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* Promo duo */
  body.app-body.home-catalog .app-promo-duo {
    display: grid !important;
    grid-template-columns: 1.12fr 0.88fr !important;
    gap: 12px !important;
    padding: 0 14px 14px !important;
  }
  body.app-body.home-catalog .app-promo-tile {
    position: relative !important;
    min-height: 148px !important;
    padding: 16px 14px !important;
    border-radius: 18px !important;
    text-decoration: none !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    gap: 3px !important;
    box-shadow: 0 14px 30px rgba(10, 37, 64, 0.16) !important;
  }
  body.app-body.home-catalog .app-promo-glow {
    position: absolute !important;
    width: 120px !important;
    height: 120px !important;
    border-radius: 50% !important;
    top: -36px !important;
    right: -28px !important;
    background: radial-gradient(circle, rgba(255,255,255,0.28), transparent 70%) !important;
    pointer-events: none !important;
  }
  body.app-body.home-catalog .app-promo-tile--blue {
    background:
      radial-gradient(circle at 90% 10%, rgba(255,255,255,0.18), transparent 40%),
      linear-gradient(155deg, #2b7fff 0%, #1769e8 42%, #0A2540 100%) !important;
    color: #fff !important;
  }
  body.app-body.home-catalog .app-promo-tile--navy {
    background:
      radial-gradient(circle at 85% 15%, rgba(251,191,36,0.22), transparent 42%),
      linear-gradient(155deg, #12365f 0%, #0A2540 55%, #061525 100%) !important;
    color: #fff !important;
    border: 1px solid rgba(251, 191, 36, 0.28) !important;
  }
  body.app-body.home-catalog .app-promo-kicker {
    position: relative !important;
    z-index: 1 !important;
    font-size: 0.64rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    opacity: 0.9 !important;
  }
  body.app-body.home-catalog .app-promo-tile strong {
    position: relative !important;
    z-index: 1 !important;
    font-size: 1.08rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em !important;
  }
  body.app-body.home-catalog .app-promo-tile em {
    position: relative !important;
    z-index: 1 !important;
    font-style: normal !important;
    font-size: 0.74rem !important;
    opacity: 0.82 !important;
    margin-bottom: 8px !important;
  }
  body.app-body.home-catalog .app-promo-cta {
    position: relative !important;
    z-index: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 0.76rem !important;
    font-weight: 750 !important;
    color: #fff !important;
  }
  body.app-body.home-catalog .app-promo-cta--gold { color: #fbbf24 !important; }

  body.app-body.home-catalog .app-offer-bar {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 14px 14px !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    background: linear-gradient(105deg, #fff8e1 0%, #edf4ff 55%, #fff 100%) !important;
    border: 1px solid rgba(240, 208, 120, 0.65) !important;
    color: #0A2540 !important;
    text-decoration: none !important;
    font-size: 0.76rem !important;
    font-weight: 650 !important;
    box-shadow: 0 6px 16px rgba(217, 119, 6, 0.08) !important;
  }
  body.app-body.home-catalog .app-offer-bar i {
    color: #d97706 !important;
    font-size: 1rem !important;
  }
  body.app-body.home-catalog .app-offer-bar strong {
    color: #1769e8 !important;
    font-weight: 800 !important;
  }

  /* Product love grid */
  body.app-body.home-catalog .app-love-section {
    padding: 4px 14px 12px !important;
  }
  body.app-body.home-catalog .app-love-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  body.app-body.home-catalog .app-love-card {
    position: relative !important;
    background: #fff !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    border: 1px solid #e4ecf7 !important;
    box-shadow: 0 8px 22px rgba(10, 37, 64, 0.07) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  }
  body.app-body.home-catalog .app-love-card:active {
    transform: scale(0.985) !important;
  }
  body.app-body.home-catalog .app-love-link {
    display: block !important;
    text-decoration: none !important;
    color: inherit !important;
  }
  body.app-body.home-catalog .app-love-media {
    position: relative !important;
    aspect-ratio: 1 / 1.02 !important;
    background: linear-gradient(180deg, #edf4ff 0%, #f8fafc 55%, #fff 100%) !important;
  }
  body.app-body.home-catalog .app-love-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    padding: 16px !important;
  }
  body.app-body.home-catalog .app-love-tag {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 2 !important;
    max-width: 68% !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    background: rgba(10, 37, 64, 0.9) !important;
    color: #fff !important;
    font-size: 0.58rem !important;
    font-weight: 750 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  body.app-body.home-catalog .app-love-off {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 2 !important;
    padding: 4px 7px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
    color: #0A2540 !important;
    font-size: 0.58rem !important;
    font-weight: 800 !important;
    box-shadow: 0 4px 10px rgba(245, 158, 11, 0.3) !important;
  }
  body.app-body.home-catalog .app-love-wish {
    position: absolute !important;
    right: 10px !important;
    bottom: 78px !important;
    z-index: 3 !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    border: 1px solid #e4ecf7 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #1769e8 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 6px 14px rgba(10, 37, 64, 0.12) !important;
  }
  body.app-body.home-catalog .app-love-wish.active,
  body.app-body.home-catalog .app-love-wish.active i {
    color: #e11d48 !important;
  }
  body.app-body.home-catalog .app-love-body {
    padding: 11px 12px 13px !important;
  }
  body.app-body.home-catalog .app-love-heading {
    margin: 0 0 5px !important;
    font-size: 0.82rem !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    color: #0A2540 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 2.2em !important;
    word-break: normal !important;
  }
  body.app-body.home-catalog .app-love-price {
    display: block !important;
    font-size: 0.98rem !important;
    font-weight: 800 !important;
    color: #1769e8 !important;
    line-height: 1.2 !important;
  }
  body.app-body.home-catalog .app-love-sub {
    display: block !important;
    font-size: 0.68rem !important;
    font-weight: 650 !important;
    color: #667085 !important;
    margin-top: 2px !important;
  }
  body.app-body.home-catalog .app-love-viewall {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 14px !important;
    min-height: 50px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #1d7ef5 0%, #1155c7 50%, #0A2540 100%) !important;
    color: #fff !important;
    font-size: 0.92rem !important;
    font-weight: 750 !important;
    text-decoration: none !important;
    box-shadow: 0 12px 26px rgba(23, 105, 232, 0.3) !important;
    border: 0 !important;
  }

  body.app-body.home-catalog .app-trust-row {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding: 6px 14px 4px !important;
  }
  body.app-body.home-catalog .app-trust-row::-webkit-scrollbar { display: none !important; }
  body.app-body.home-catalog .app-trust-pill {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 36px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid #dce6f5 !important;
    color: #0A2540 !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    box-shadow: 0 3px 10px rgba(10, 37, 64, 0.04) !important;
  }
  body.app-body.home-catalog .app-trust-pill i {
    color: #1769e8 !important;
    font-size: 0.8rem !important;
  }

  /* Soften following shop-by-category block on mobile */
  body.app-body.home-catalog .section-categories {
    padding-top: 0.35rem !important;
  }
  body.app-body.home-catalog .section-categories .mobile-section-subtitle {
    display: none !important;
  }

  /* Sidebar brand polish */
  body.app-body.home-catalog .mobile-sidebar .btn-warning {
    background: #fbbf24 !important;
    border-color: #fbbf24 !important;
    color: #0A2540 !important;
    font-weight: 800 !important;
  }
  body.app-body.home-catalog .mobile-sidebar .sidebar-nav-link.active {
    background: rgba(23, 105, 232, 0.18) !important;
    box-shadow: inset 3px 0 0 #fbbf24 !important;
  }
}

@media (max-width: 360px) {
  body.app-body.home-catalog .app-cat-icon-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  body.app-body.home-catalog .app-promo-duo {
    grid-template-columns: 1fr 1fr !important;
  }
  body.app-body.home-catalog .app-cat-icon-circle {
    width: 50px !important;
    height: 50px !important;
    border-radius: 16px !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE PREMIUM POLISH PASS — sections below the strip
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {
  body.app-body.home-catalog .site-header {
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow: 0 4px 20px rgba(10, 37, 64, 0.06) !important;
  }

  body.app-body.home-catalog .header-logo-img {
    max-width: 156px !important;
    height: 56px !important;
    max-height: 56px !important;
  }

  body.app-body.home-catalog .site-header .action-btn,
  body.app-body.home-catalog .site-header .cart-btn,
  body.app-body.home-catalog .site-header .mobile-search-trigger,
  body.app-body.home-catalog .site-header .mobile-menu-trigger {
    background: #edf4ff !important;
    border-color: #d7e5f8 !important;
    color: #0a2540 !important;
    border-radius: 13px !important;
  }

  /* Hero text polish */
  body.app-body.home-catalog .slide-title {
    font-size: clamp(1.45rem, 5.6vw, 1.9rem) !important;
    letter-spacing: -0.025em !important;
    max-width: 18ch !important;
  }
  body.app-body.home-catalog .slide-subtitle {
    font-size: 0.92rem !important;
    max-width: 32ch !important;
  }
  body.app-body.home-catalog .slide-actions .btn-hc-primary,
  body.app-body.home-catalog .slide-actions .btn-gold {
    background: linear-gradient(135deg, #2b7fff, #1769e8) !important;
    box-shadow: 0 10px 24px rgba(23, 105, 232, 0.45) !important;
  }

  /* Shop sliders */
  body.app-body.home-catalog .ml-shop-slider-section {
    margin: 10px 0 6px !important;
    padding: 0 !important;
  }
  body.app-body.home-catalog .ml-shop-slider-heading {
    padding: 4px 14px 10px !important;
  }
  body.app-body.home-catalog .ml-shop-slider-title {
    font-size: 1.12rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: #0a2540 !important;
  }
  body.app-body.home-catalog .ml-shop-card.janosci-product-card {
    border-radius: 16px !important;
    border: 1px solid #e4ecf7 !important;
    box-shadow: 0 8px 22px rgba(10, 37, 64, 0.07) !important;
    overflow: hidden !important;
  }
  body.app-body.home-catalog .ml-shop-card .btn-view-details,
  body.app-body.home-catalog .ml-shop-card .btn-add-cart {
    border-radius: 11px !important;
  }
  body.app-body.home-catalog .ml-shop-card .btn-add-cart {
    background: linear-gradient(135deg, #1769e8, #0A2540) !important;
  }

  /* Reviews */
  body.app-body.home-catalog .jp-reviews {
    padding: 1.5rem 0 !important;
  }
  body.app-body.home-catalog .jp-reviews .section-header h2 {
    font-size: 1.35rem !important;
    letter-spacing: -0.02em !important;
  }
  body.app-body.home-catalog .jp-reviews .testimonial-card {
    border-radius: 16px !important;
    border: 1px solid #e4ecf7 !important;
    box-shadow: 0 8px 22px rgba(10, 37, 64, 0.06) !important;
  }

  /* Articles + FAQ on mobile */
  body.app-body.home-catalog .home-articles-section {
    padding: 2rem 0 !important;
    background:
      radial-gradient(ellipse 90% 50% at 50% 0%, rgba(23, 105, 232, 0.08), transparent 60%),
      #f0f4fa !important;
  }
  body.app-body.home-catalog .home-section-head h2 {
    font-size: 1.4rem !important;
  }
  body.app-body.home-catalog .home-article-card {
    border-radius: 16px !important;
    box-shadow: 0 10px 26px rgba(10, 37, 64, 0.08) !important;
  }
  body.app-body.home-catalog .home-faq-section {
    padding: 2rem 0 2.5rem !important;
    background: #fff !important;
  }
  body.app-body.home-catalog .home-faq-item {
    border-radius: 14px !important;
    box-shadow: 0 6px 18px rgba(10, 37, 64, 0.05) !important;
  }

  /* Bottom nav polish */
  body.app-body.home-catalog .mobile-bottom-nav {
    box-shadow: 0 -8px 28px rgba(10, 37, 64, 0.1) !important;
    border-top: 1px solid #e8eef7 !important;
  }

  /* WhatsApp FAB */
  body.app-body.home-catalog .app-fab-wa,
  body.app-body.home-catalog .mobile-whatsapp {
    box-shadow: 0 10px 28px rgba(37, 211, 102, 0.42) !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   Mobile beauty pass + scroll safety (≤767.98px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {
  body.app-body.home-catalog {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.app-body.home-catalog .site-header {
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 4px 20px rgba(10, 37, 64, 0.07) !important;
  }

  body.app-body.home-catalog .hero-slider-section {
    border-radius: 0 0 26px 26px !important;
    box-shadow: 0 16px 36px rgba(10, 37, 64, 0.2) !important;
  }

  body.app-body.home-catalog .hero-swiper {
    height: clamp(360px, 50vh, 460px) !important;
    min-height: 360px !important;
  }

  body.app-body.home-catalog .slide-title {
    font-size: clamp(1.45rem, 6.2vw, 1.85rem) !important;
    letter-spacing: -0.03em !important;
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35) !important;
  }

  body.app-body.home-catalog .slide-actions .btn {
    border-radius: 14px !important;
    min-height: 46px !important;
    font-weight: 800 !important;
  }

  body.app-body.home-catalog .app-home-strip {
    margin-top: -18px !important;
    padding-bottom: 10px !important;
  }

  body.app-body.home-catalog .app-home-search {
    height: 54px !important;
    border-radius: 18px !important;
    border-color: rgba(23, 105, 232, 0.16) !important;
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.9) inset,
      0 12px 32px rgba(10, 37, 64, 0.12) !important;
  }

  body.app-body.home-catalog .app-quick-chip {
    min-height: 38px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid #e2eaf5 !important;
    box-shadow: 0 4px 12px rgba(10, 37, 64, 0.05) !important;
  }

  body.app-body.home-catalog .app-cat-icon-circle {
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
  }

  body.app-body.home-catalog .app-promo-tile {
    min-height: 156px !important;
    border-radius: 20px !important;
  }

  body.app-body.home-catalog .app-offer-bar {
    border-radius: 16px !important;
    margin-left: 14px !important;
    margin-right: 14px !important;
  }

  body.app-body.home-catalog .section,
  body.app-body.home-catalog .ml-shop-slider-section,
  body.app-body.home-catalog .section-categories {
    padding-top: 1.15rem !important;
    padding-bottom: 0.85rem !important;
  }

  body.app-body.home-catalog .cat-card,
  body.app-body.home-catalog .ml-cat-card,
  body.app-body.home-catalog .app-love-card,
  body.app-body.home-catalog .ml-shop-card.janosci-product-card {
    border-radius: 18px !important;
    box-shadow: 0 10px 26px rgba(10, 37, 64, 0.08) !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav {
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(16px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
    box-shadow: 0 -8px 28px rgba(10, 37, 64, 0.1) !important;
    border-top-color: #e8edf5 !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item.active {
    color: #1769e8 !important;
  }

  body.app-body.home-catalog nav.mobile-bottom-nav .mobile-nav-item.active i {
    color: #1769e8 !important;
    transform: translateY(-1px);
  }

  /* Footer breathes above bottom nav */
  body.app-body.home-catalog .site-footer.jp-foot {
    margin-bottom: 0 !important;
    border-radius: 22px 22px 0 0 !important;
  }

  /* Reveal content immediately on small screens (avoid blank/stuck feel) */
  body.home-pro.js-reveal-ready .jp-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}