/* MPGroup mobile polish */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden!important}
img,svg,video{max-width:100%}
button,a,input{-webkit-tap-highlight-color:transparent}
.product-card,.category-card,.glass-card,.site-search-modal{max-width:100%}
.product-card,.category-card,.product-slider,.product-slide,.product-photo{min-width:0}
.slider-btn,.slider-dot,.site-search-trigger,.back-link,.back-btn,.category-link,.menu-toggle{touch-action:manipulation}

@media (max-width:920px){
  section,.hero{width:100%!important;max-width:100%!important;padding-left:16px!important;padding-right:16px!important}
  .hero{padding-top:34px!important;padding-bottom:20px!important}
  .hero-box{padding:24px!important;border-radius:26px!important}
  .hero h1{font-size:clamp(30px,8vw,52px)!important;line-height:1.02!important}
  .hero p,.section-text{font-size:15px!important;line-height:1.65!important}
  .section-title{font-size:clamp(26px,7vw,38px)!important;margin-bottom:12px!important}
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;width:100%!important}
  .product-card{border-radius:24px!important;grid-template-rows:auto auto auto!important;min-width:0!important}
  .product-photo{height:clamp(260px,38vw,340px)!important}
  .product-card h3{font-size:20px!important;padding:18px 18px 0!important}
  .meta{padding:12px 18px 18px!important;gap:8px!important}
  .tag{padding:8px 10px!important;font-size:12.5px!important;line-height:1.2!important}
}

@media (max-width:760px){
  body{background-attachment:scroll!important}
  .page{width:100%!important;overflow-x:hidden!important}

  .topbar{
    position:sticky!important;top:0!important;z-index:1500!important;
    display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;
    align-items:center!important;justify-content:space-between!important;
    gap:8px!important;padding:10px 12px!important;min-height:0!important;
    width:100%!important;overflow:visible!important;
  }
  .topbar .brand-link,.topbar .brand{
    order:1!important;flex:1 1 auto!important;max-width:calc(100% - 56px)!important;min-width:0!important;
  }
  .topbar .logo-wrap{width:44px!important;height:44px!important;border-radius:15px!important}
  .topbar .brand-name{font-size:13px!important;letter-spacing:.08em!important}
  .topbar .brand-sub{display:none!important}
  .topbar .nav{display:none!important}
  .topbar .menu-toggle{
    order:2!important;display:flex!important;align-items:center!important;justify-content:center!important;
    flex:0 0 44px!important;width:44px!important;height:44px!important;margin:0!important;
  }
  .topbar .site-search-trigger{
    order:3!important;flex:1 1 calc(50% - 4px)!important;width:auto!important;min-width:0!important;
    height:42px!important;padding:10px 12px!important;font-size:13px!important;justify-content:center!important;
    margin:0!important;white-space:nowrap!important;
  }
  .topbar .site-search-trigger .hint{display:none!important}
  .topbar .back-link,.topbar .back-btn{
    order:4!important;flex:1 1 calc(50% - 4px)!important;width:auto!important;min-width:0!important;
    height:42px!important;padding:10px 12px!important;font-size:12.5px!important;line-height:1!important;
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }

  .mobile-menu{
    top:76px!important;left:12px!important;right:12px!important;
    max-height:calc(100dvh - 92px)!important;overflow:auto!important;overscroll-behavior:contain!important;
    padding:12px!important;border-radius:22px!important;
  }
  .mobile-menu a{min-height:46px!important;display:flex!important;align-items:center!important;padding:12px 14px!important;font-size:15px!important}

  section{padding-top:18px!important;padding-bottom:58px!important}
  .hero{padding-top:22px!important;padding-bottom:12px!important}
  .hero-box{padding:20px!important;border-radius:24px!important}
  .eyebrow{font-size:12px!important;padding:8px 12px!important;margin-bottom:12px!important}
  .hero h1{font-size:clamp(30px,10vw,42px)!important;line-height:1.04!important;margin-bottom:12px!important}
  .hero p,.section-text{font-size:14.5px!important;line-height:1.6!important}
  .section-text{margin-bottom:24px!important}
  .section-title{font-size:clamp(25px,8vw,34px)!important;line-height:1.08!important}

  .categories-grid{width:100%!important;max-width:100%!important;gap:12px!important}
  .category-card{border-radius:18px!important;box-shadow:0 10px 24px rgba(0,0,0,.24),0 0 16px rgba(31,240,171,.045)!important}
  .category-card::before{width:3px!important}
  .category-body{
    display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;
    gap:9px 12px!important;padding:14px 15px!important;min-height:0!important;align-items:center!important;
  }
  .category-body::before{
    grid-column:1!important;grid-row:1 / span 2!important;width:34px!important;height:34px!important;
    border-radius:12px!important;font-size:12px!important;
  }
  .category-body h3{grid-column:2!important;margin:0!important;font-size:18px!important;line-height:1.14!important}
  .category-body p{
    grid-column:2!important;margin:0!important;font-size:13px!important;line-height:1.35!important;
    display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
  }
  .category-link{
    grid-column:2!important;justify-self:start!important;min-width:0!important;min-height:40px!important;
    padding:10px 14px!important;font-size:13px!important;border-radius:999px!important;margin-top:2px!important;
  }

  .products-grid{grid-template-columns:1fr!important;gap:14px!important}
  .product-card{display:grid!important;grid-template-rows:auto auto auto!important;border-radius:22px!important;overflow:hidden!important;width:100%!important}
  .product-photo{
    height:clamp(220px,72vw,300px)!important;min-height:220px!important;max-height:300px!important;
    padding:10px!important;overflow:hidden!important;background:linear-gradient(180deg,rgba(12,18,15,.96),rgba(18,26,22,.92))!important;
  }
  .product-card.has-real-gallery .product-photo{padding:0!important}
  .product-photo.has-image{display:flex!important;align-items:center!important;justify-content:center!important}
  .product-photo>img,.product-slide img{
    width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
    object-fit:contain!important;object-position:center center!important;display:block!important;
  }
  .product-slider,.product-slides,.product-slide{height:100%!important}
  .product-slide{padding:0!important}
  .slider-btn{
    width:40px!important;height:40px!important;font-size:24px!important;background:rgba(7,11,9,.76)!important;
    border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 10px 20px rgba(0,0,0,.18)!important;
  }
  .slider-btn.prev{left:8px!important}
  .slider-btn.next{right:8px!important}
  .slider-dots{bottom:9px!important;gap:7px!important}
  .slider-dot{width:9px!important;height:9px!important;border:1px solid rgba(255,255,255,.22)!important}
  .product-card h3{font-size:18px!important;line-height:1.22!important;padding:16px 16px 0!important}
  .product-card p{font-size:14px!important;line-height:1.55!important}
  .meta{padding:12px 16px 16px!important;gap:8px!important}
  .tag{padding:8px 10px!important;border-radius:999px!important;font-size:12.5px!important;line-height:1.2!important}

  .telegram-float{
    right:12px!important;bottom:12px!important;padding:11px 14px!important;min-height:42px!important;
    border-radius:999px!important;font-size:14px!important;z-index:1200!important;
  }
  .telegram-float svg{width:18px!important;height:18px!important}

  body .site-search-overlay.open{align-items:stretch!important;justify-content:stretch!important}
  body .site-search-overlay{padding:0!important}
  body .site-search-modal{
    width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;
    margin:0!important;border-radius:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;
  }
  body .site-search-head{
    flex:0 0 auto!important;display:grid!important;grid-template-columns:1fr auto!important;gap:8px!important;padding:12px!important;
  }
  body .site-search-input{
    min-width:0!important;height:46px!important;padding:12px 14px!important;border-radius:16px!important;font-size:16px!important;
  }
  body .site-search-close{
    width:auto!important;min-width:78px!important;height:46px!important;padding:0 12px!important;border-radius:16px!important;font-size:13px!important;
  }
  body .site-search-help{flex:0 0 auto!important;padding:0 12px 10px!important;font-size:12px!important}
  body .site-search-filters{
    flex:0 0 auto!important;padding:0 12px 10px!important;gap:7px!important;overflow-x:auto!important;
    flex-wrap:nowrap!important;scrollbar-width:none!important;
  }
  body .site-search-filters::-webkit-scrollbar{display:none!important}
  body .site-search-chip{flex:0 0 auto!important;padding:8px 10px!important;font-size:12.5px!important}
  body .site-search-meta{flex:0 0 auto!important;padding:10px 12px 8px!important;gap:4px!important;font-size:12px!important}
  body .site-search-meta span:last-child{display:none!important}
  body .site-search-results{
    flex:1 1 auto!important;max-height:none!important;min-height:0!important;overflow:auto!important;
    padding:8px 10px 18px!important;overscroll-behavior:contain!important;
  }
  body .site-search-item{grid-template-columns:72px minmax(0,1fr)!important;gap:10px!important;padding:10px!important;border-radius:18px!important}
  body .site-search-thumb{width:72px!important;height:64px!important;border-radius:14px!important}
  body .site-search-title{font-size:15.5px!important;line-height:1.22!important;margin-bottom:6px!important}
  body .site-search-desc{
    font-size:12.5px!important;line-height:1.35!important;display:-webkit-box!important;
    -webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
  }
  body .site-search-badges{gap:5px!important}
  body .site-search-badge{font-size:11.5px!important;padding:4px 7px!important}
  body .site-search-open{grid-column:2!important;justify-self:start!important;padding:7px 11px!important;font-size:12px!important}
}

@media (max-width:420px){
  .topbar{padding:9px 10px!important;gap:7px!important}
  .topbar .logo-wrap{width:40px!important;height:40px!important}
  .topbar .brand-name{font-size:12px!important;letter-spacing:.07em!important}
  .topbar .site-search-trigger,.topbar .back-link,.topbar .back-btn{height:40px!important;font-size:12px!important;padding:9px 10px!important}
  section,.hero{padding-left:12px!important;padding-right:12px!important}
  .hero-box{padding:18px!important;border-radius:22px!important}
  .product-photo{height:clamp(210px,75vw,280px)!important;min-height:210px!important}
  .product-card h3{font-size:17px!important}
  .tag{font-size:12px!important}
  .telegram-float{padding:10px 12px!important;font-size:13px!important}
}
@media (max-width:360px){
  .topbar .site-search-trigger span:first-child::after{content:"Пошук"!important}
  .topbar .back-link,.topbar .back-btn{font-size:0!important}
  .topbar .back-link::before,.topbar .back-btn::before{content:"← Назад";font-size:12px}
  .product-photo{height:205px!important}
}

/* ===== FIX: mobile header, menu and hero cards ===== */
@media (max-width: 760px) {
  body {
    padding-top: 112px !important;
  }

  .topbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 10000 !important;
    margin: 0 !important;
    transform: none !important;
    background: rgba(7, 11, 9, 0.94) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    backdrop-filter: blur(18px) !important;
    box-shadow: 0 12px 28px rgba(0,0,0,.34), 0 0 18px rgba(31,240,171,.05) !important;
  }

  .mobile-menu {
    position: fixed !important;
    top: 92px !important;
    z-index: 9999 !important;
    max-height: calc(100dvh - 108px) !important;
  }

  .menu-toggle,
  .mobile-menu,
  .mobile-menu * {
    -webkit-tap-highlight-color: transparent !important;
  }

  .mobile-menu.open {
    pointer-events: auto !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .site-search-overlay {
    z-index: 11000 !important;
  }

  /* Главная: две нижние правые ячейки на телефоне ровно по центру */
  .hero {
    overflow-x: hidden !important;
  }

  .hero-side {
    width: 100% !important;
    max-width: calc(100vw - 32px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .hero-visual-gallery {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    width: calc(100vw - 32px) !important;
    max-width: 420px !important;
    margin: 18px auto 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    z-index: 3 !important;
    transform: none !important;
  }

  .hero-visual-gallery .hero-shot,
  .hero-visual-gallery .hero-graphic {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }

  .hero-shot-main,
  .hero-graphic-main {
    height: 205px !important;
    min-height: 205px !important;
  }

  .hero-logo-composition,
  .graphic-radar {
    border-radius: 24px !important;
  }
}

@media (max-width: 420px) {
  body {
    padding-top: 108px !important;
  }

  .mobile-menu {
    top: 88px !important;
    max-height: calc(100dvh - 104px) !important;
  }

  .hero-visual-gallery {
    width: calc(100vw - 28px) !important;
    max-width: 390px !important;
  }

  .hero-shot-main,
  .hero-graphic-main {
    height: 190px !important;
    min-height: 190px !important;
  }

  .graphic-label {
    font-size: 13px !important;
  }
}

/* ===== FIX: mobile menu as left sidebar + no page scroll ===== */
@media (max-width: 760px) {
  html.menu-locked,
  body.menu-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  body.menu-open {
    touch-action: none !important;
  }

  body.menu-open::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 9998 !important;
    background: rgba(0, 0, 0, 0.52) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
  }

  .topbar {
    z-index: 10020 !important;
  }

  .menu-toggle {
    z-index: 10024 !important;
  }

  .mobile-menu {
    display: flex !important;
    position: fixed !important;
    top: 88px !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: min(82vw, 340px) !important;
    max-width: calc(100vw - 44px) !important;
    height: calc(100dvh - 104px) !important;
    max-height: calc(100dvh - 104px) !important;
    padding: 16px !important;
    border-radius: 0 28px 28px 0 !important;
    z-index: 10010 !important;
    flex-direction: column !important;
    gap: 10px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateX(-108%) !important;
    transition: transform .26s ease, opacity .22s ease, visibility .22s ease !important;
    background: rgba(7, 12, 10, 0.98) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-left: 0 !important;
    box-shadow: 24px 0 54px rgba(0,0,0,.44), 0 0 26px rgba(31,240,171,.10) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
  }

  .mobile-menu.open {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }

  .mobile-menu a {
    width: 100% !important;
    min-height: 54px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    padding: 14px 16px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.045) !important;
  }

  .mobile-menu a:active {
    transform: scale(.99) !important;
  }

  .mobile-menu-group,
  .mobile-submenu {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding-left: 0 !important;
  }
}

@media (max-width: 420px) {
  .mobile-menu {
    top: 84px !important;
    width: min(84vw, 324px) !important;
    height: calc(100dvh - 98px) !important;
    max-height: calc(100dvh - 98px) !important;
    padding: 14px !important;
    border-radius: 0 24px 24px 0 !important;
  }

  .mobile-menu a {
    min-height: 52px !important;
    font-size: 15.5px !important;
  }
}

/* ===== FIX: sidebar menu readability on phone ===== */
@media (max-width: 760px) {
  /* Убираем сильное размытие фона, из-за которого меню выглядит как мутное пятно */
  body.menu-open::before {
    display: none !important;
    content: none !important;
  }

  body.menu-open {
    touch-action: auto !important;
  }

  .mobile-menu {
    top: 86px !important;
    left: 0 !important;
    right: auto !important;
    width: min(86vw, 356px) !important;
    max-width: calc(100vw - 26px) !important;
    height: calc(100dvh - 100px) !important;
    max-height: calc(100dvh - 100px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate3d(-105%, 0, 0) !important;
    background: #07100d !important;
    background-image:
      radial-gradient(circle at 18% 8%, rgba(31,240,171,.14), transparent 32%),
      linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-left: 0 !important;
    box-shadow: 20px 0 44px rgba(0,0,0,.55), 0 0 22px rgba(31,240,171,.10) !important;
    color: #f4fbf8 !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
  }

  .mobile-menu.open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate3d(0, 0, 0) !important;
  }

  .mobile-menu a {
    color: #f4fbf8 !important;
    text-shadow: none !important;
    background: rgba(255,255,255,.065) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: none !important;
    filter: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .mobile-menu a.active,
  .mobile-menu a:hover,
  .mobile-menu a:focus-visible {
    background: rgba(31,240,171,.12) !important;
    border-color: rgba(31,240,171,.28) !important;
  }
}

@media (max-width: 420px) {
  .mobile-menu {
    top: 82px !important;
    width: min(88vw, 340px) !important;
    max-width: calc(100vw - 20px) !important;
    height: calc(100dvh - 94px) !important;
    max-height: calc(100dvh - 94px) !important;
  }
}

/* ===== FIX: product groups stay visible + highlighted catalog submenu ===== */
@media (max-width: 760px) {
  .mp-reveal,
  .mp-reveal.is-visible,
  section.mp-reveal,
  .glass-card.mp-reveal,
  .product-card.mp-reveal,
  .category-card.mp-reveal,
  .info-card.mp-reveal {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
  }

  .products-grid,
  .categories-grid,
  .product-card,
  .category-card {
    opacity: 1 !important;
    visibility: visible !important;
  }

  .mobile-submenu {
    margin-top: 4px !important;
    padding: 10px !important;
    border-radius: 20px !important;
    background: rgba(31,240,171,.055) !important;
    border: 1px solid rgba(31,240,171,.13) !important;
  }

  .mobile-submenu::before {
    content: "Розділи товарів";
    display: block;
    padding: 2px 6px 6px;
    font-size: 11px;
    line-height: 1;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(178, 255, 222, .72);
  }

  .mobile-submenu a[href$="plastics.html"],
  .mobile-submenu a[href$="metal.html"] {
    position: relative !important;
    min-height: 58px !important;
    padding-left: 48px !important;
    font-weight: 800 !important;
    letter-spacing: .02em !important;
    color: #f4fbf8 !important;
    background:
      linear-gradient(135deg, rgba(31,240,171,.17), rgba(255,255,255,.055)) !important;
    border-color: rgba(31,240,171,.30) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 12px 24px rgba(0,0,0,.18) !important;
  }

  .mobile-submenu a[href$="plastics.html"]::before,
  .mobile-submenu a[href$="metal.html"]::before {
    position: absolute;
    left: 15px;
    top: 50%;
    width: 22px;
    height: 22px;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: rgba(31,240,171,.16);
    border: 1px solid rgba(31,240,171,.24);
    color: #7fffd4;
    font-size: 13px;
  }

  .mobile-submenu a[href$="plastics.html"]::before {
    content: "P";
  }

  .mobile-submenu a[href$="metal.html"]::before {
    content: "M";
  }
}

/* ===== Catalog choice button ===== */
.catalog-choice-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  isolation: isolate;
}

.catalog-choice-toggle {
  cursor: pointer;
}

.catalog-choice-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  min-width: 220px;
  padding: 10px;
  border-radius: 22px;
  background: rgba(7, 12, 10, 0.98);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 22px 46px rgba(0,0,0,.40), 0 0 24px rgba(31,240,171,.12);
  z-index: 80;
}

.catalog-choice-panel[hidden] {
  display: none !important;
}

.catalog-choice-panel a {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 12px 14px 12px 44px;
  margin: 0;
  border-radius: 16px;
  color: #f4fbf8;
  text-decoration: none;
  font-weight: 800;
  position: relative;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
}

.catalog-choice-panel a + a {
  margin-top: 8px;
}

.catalog-choice-panel a::before {
  position: absolute;
  left: 14px;
  top: 50%;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(31,240,171,.16);
  border: 1px solid rgba(31,240,171,.24);
  color: #7fffd4;
  font-size: 13px;
}

.catalog-choice-panel a[href$="plastics.html"]::before {
  content: "P";
}

.catalog-choice-panel a[href$="metal.html"]::before {
  content: "M";
}

.catalog-choice-panel a:hover,
.catalog-choice-panel a:focus-visible {
  background: rgba(31,240,171,.12);
  border-color: rgba(31,240,171,.28);
}

@media (max-width: 760px) {
  .catalog-choice-wrap {
    width: 100%;
  }

  .catalog-choice-toggle {
    width: 100%;
  }

  .catalog-choice-panel {
    left: 0;
    right: 0;
    top: calc(100% + 10px);
    min-width: 0;
    width: 100%;
  }
}

/* ===== REAL FIX: navigation and catalog choice ===== */
.brand-link {
  text-decoration: none !important;
  cursor: pointer;
}

.hero h1,
.hero p,
.hero-copy-content,
.hero-copy-content * {
  text-decoration: none !important;
}

.catalog-choice-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  isolation: isolate;
}

.catalog-choice-wrap summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.catalog-choice-wrap summary::-webkit-details-marker {
  display: none;
}

.catalog-choice-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 12px);
  min-width: 220px;
  padding: 10px;
  border-radius: 22px;
  background: rgba(7, 12, 10, 0.98);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 22px 46px rgba(0,0,0,.40), 0 0 24px rgba(31,240,171,.12);
  z-index: 9999;
}

.catalog-choice-panel a {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 12px 14px 12px 44px;
  margin: 0;
  border-radius: 16px;
  color: #f4fbf8;
  text-decoration: none;
  font-weight: 800;
  position: relative;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
}

.catalog-choice-panel a + a {
  margin-top: 8px;
}

.catalog-choice-panel a::before {
  position: absolute;
  left: 14px;
  top: 50%;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(31,240,171,.16);
  border: 1px solid rgba(31,240,171,.24);
  color: #7fffd4;
  font-size: 13px;
}

.catalog-choice-panel a[href$="plastics.html"]::before {
  content: "P";
}

.catalog-choice-panel a[href$="metal.html"]::before {
  content: "M";
}

@media (max-width: 760px) {
  .catalog-choice-wrap {
    width: 100%;
  }

  .catalog-choice-wrap summary {
    width: 100%;
    justify-content: center;
  }

  .catalog-choice-panel {
    left: 0;
    right: 0;
    width: 100%;
    min-width: 0;
  }
}

/* ===== FIX: catalog details dropdown + no top jump on ordinary clicks ===== */
.catalog-choice-wrap[open] .catalog-choice-panel {
  display: block !important;
}

.catalog-choice-panel {
  pointer-events: auto !important;
}

.catalog-choice-panel a {
  pointer-events: auto !important;
}