.listing-page { padding-bottom: 56px; }
.listing-loading { min-height: 340px; padding: 50px 0; color: #777; }
.listing-breadcrumb { margin: 0 calc((100vw - 100%) / -2) 28px; }
.listing-title { margin: 20px 0 26px; color: #25282a; font-size: 28px; font-weight: 600; }
.listing-layout { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 32px; }
.listing-sidebar { align-self: start; }
.listing-sidebar h4 { margin: 0 0 15px; font-size: 18px; font-weight: 600; }
.listing-sidebar ul { padding: 0; list-style: none; }
.listing-sidebar li { position: relative; padding: 7px 0; border-bottom: 1px solid #eee; }
.listing-sidebar a { color: #333; text-decoration: none; }
.listing-sidebar a:hover, .listing-sidebar a.active { color: #ee403d; }
.listing-sidebar .listing-child { display: block; padding: 6px 0 2px 18px; color: #777; font-size: 14px; }
.listing-filter { margin-top: 26px; }
.listing-filter + .listing-filter { padding-top: 20px; border-top: 1px solid #eee; }
.price-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; color: #777; font-size: 13px; }
.price-fields input { display: block; width: 100%; margin-top: 6px; padding: 7px; border: 1px solid #ddd; }
.listing-check { display: block; padding: 5px 0; color: #555; font-size: 14px; }
.listing-toolbar { display: flex; min-height: 45px; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 22px; }
.listing-style { display: flex; gap: 6px; }
.listing-style button { width: 34px; height: 34px; border: 1px solid #ddd; background: white; color: #555; }
.listing-style button.active { border-color: #222; color: #111; }
.listing-count { margin-left: auto; color: #777; font-size: 14px; white-space: nowrap; }
.listing-selects { display: flex; align-items: center; gap: 8px; }
.listing-selects label { display: flex; align-items: center; gap: 6px; color: #777; font-size: 13px; }
.listing-selects select { min-height: 36px; border: 1px solid #ddd; background: white; color: #555; padding: 0 8px; }
.listing-filter-toggle { padding: 8px 12px; border: 1px solid #ddd; background: #fff; }
.listing-cards { row-gap: 28px; }
.listing-product-card { height: 100%; }
.listing-product-card .image { overflow: hidden; background: #f5f5f5; }
.listing-product-card .image-old img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .35s ease; }
.listing-product-card:hover .image-old img { transform: scale(1.035); }
.listing-product-card .product-bottom-info { padding: 12px 2px 0; }
.listing-product-card .product-name { display: -webkit-box; min-height: 42px; overflow: hidden; color: #242424; font-size: 14px; line-height: 1.5; text-decoration: none; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.listing-product-card .product-price { display: flex; align-items: baseline; gap: 8px; margin-top: 5px; }
.listing-product-card .price-new { color: #161616; font-weight: 600; }
.listing-product-card .price-old { color: #999; font-size: 12px; text-decoration: line-through; }
.listing-product-card .button-wrap { position: absolute; right: 10px; bottom: 10px; left: 10px; display: flex; justify-content: center; gap: 5px; opacity: 0; transition: opacity .2s ease; }
.listing-product-card:hover .button-wrap, .listing-product-card:focus-within .button-wrap { opacity: 1; }
.listing-product-card .button-wrap .btn { padding: 7px 9px; font-size: 12px; }
.listing-cards.is-list { display: block; }
.listing-cards.is-list .product-grid { width: 100%; max-width: 100%; flex: 0 0 100%; }
.listing-cards.is-list .listing-product-card { display: grid; grid-template-columns: minmax(160px, 260px) 1fr; gap: 20px; margin-bottom: 22px; }
.listing-cards.is-list .listing-product-card .product-bottom-info { padding: 18px 0; }
.listing-cards.is-list .listing-product-card .product-name { font-size: 17px; }
.listing-empty { padding: 35px; color: #777; text-align: center; }
.brand-letters { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 34px; }
.brand-letters a { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid #ddd; color: #222; text-decoration: none; }
.brand-letters a:hover { border-color: #ee403d; color: #ee403d; }
.brand-letter-group { display: grid; grid-template-columns: 90px minmax(0, 1fr); padding: 22px 0; border-top: 1px solid #eee; }
.brand-letter-group h2 { margin: 0; font-size: 30px; }
.brand-letter-group > div { display: flex; flex-wrap: wrap; gap: 18px; }
.brand-directory-item { display: flex; width: 180px; min-height: 95px; align-items: center; gap: 12px; padding: 12px; border: 1px solid #eee; color: #333; text-decoration: none; }
.brand-directory-item img { width: 65px; height: 65px; object-fit: contain; }
.brand-hero { display: flex; align-items: center; gap: 18px; margin: 0 0 22px 277px; padding: 18px 22px; background: #f6f6f6; }
.brand-hero img { width: 82px; height: 82px; object-fit: contain; background: white; }
.brand-hero span { font-size: 24px; font-weight: 600; }
@media (max-width: 991.98px) {
  .listing-layout { display: block; }
  .listing-sidebar.is-mobile-open { display: block !important; margin: 0 0 24px; padding: 18px; border: 1px solid #eee; }
  .brand-hero { margin-left: 0; }
}
@media (max-width: 575.98px) {
  .listing-page { padding-bottom: 34px; }
  .listing-title { margin: 18px 0; font-size: 23px; }
  .listing-toolbar { flex-wrap: wrap; justify-content: flex-start; }
  .listing-count { margin-left: 0; }
  .listing-selects { width: 100%; }
  .listing-selects select:last-child { flex: 1; }
  .listing-cards { row-gap: 20px; }
  .listing-product-card .button-wrap { right: 5px; bottom: 5px; left: 5px; opacity: 1; }
  .listing-product-card .button-wrap .btn { padding: 6px; font-size: 0; }
  .listing-product-card .button-wrap i { font-size: 14px; }
  .brand-letter-group { grid-template-columns: 45px 1fr; }
  .brand-directory-item { width: calc(50% - 9px); min-height: 75px; gap: 6px; padding: 7px; font-size: 12px; }
  .brand-directory-item img { width: 44px; height: 44px; }
  .listing-cards.is-list .listing-product-card { grid-template-columns: 125px 1fr; gap: 12px; }
}