/* Category page discovery block (PZ-1044): need-based banners from category_slides and the category card slider. Rebuilt from the 2026-10-24 category delivery. Loaded only on the category page; font is inherited from the site. */
.pz-category-discovery { --pz-cd-ink: #2d4735; --pz-cd-muted: #62745b; --pz-cd-action: #526d4a; --pz-cd-line: #e1e6dc; --pz-cd-hover: #7f9875; margin: 4px 0 16px; color: var(--pz-cd-ink); }
.pz-category-discovery * { box-sizing: border-box; }
.pz-category-discovery a { color: inherit; text-decoration: none; }
.pz-category-discovery a:focus-visible { outline: 2px solid #426645; outline-offset: 3px; }

.pz-category-discovery__banners { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pz-category-discovery__banners--count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pz-category-discovery__banners--count-1 { grid-template-columns: 1fr; }

.pz-category-discovery__banner { display: grid; grid-template-columns: 48% 52%; height: 134px; overflow: hidden; border: 1px solid var(--pz-cd-line); border-radius: 12px; background: #f2f4ed; transition: box-shadow .2s ease; }
.pz-category-discovery__banner--tone-1 { background: #f4f0e9; }
.pz-category-discovery__banner--tone-2 { background: #eeeede; }
.pz-category-discovery__banners--count-1 .pz-category-discovery__banner { grid-template-columns: 45% 55%; }
.pz-category-discovery a.pz-category-discovery__banner:hover { box-shadow: inset 0 0 0 1px var(--pz-cd-hover), 0 4px 12px rgba(49, 74, 50, .06); }

.pz-category-discovery__copy { display: flex; flex-direction: column; justify-content: center; gap: 6px; min-width: 0; padding: 12px 10px 11px 14px; }
.pz-category-discovery__title { font-size: 19px; font-weight: 600; line-height: 1.12; letter-spacing: -.45px; color: var(--pz-cd-ink); }
.pz-category-discovery__description { font-size: 11px; line-height: 1.35; color: var(--pz-cd-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pz-category-discovery__action { display: inline-flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 600; color: var(--pz-cd-action); }
.pz-category-discovery__action-icon { display: inline-grid; place-items: center; width: 19px; height: 19px; border: 1px solid rgba(135, 154, 123, .44); border-radius: 50%; font-size: 12px; line-height: 1; }

.pz-category-discovery__media { display: block; height: 100%; overflow: hidden; background: #d7d8ca; }
.pz-category-discovery__media img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
.pz-category-discovery__banners--count-1 .pz-category-discovery__media img { object-position: center 53%; }

.pz-category-discovery__banners + .pz-category-discovery__slider { margin-top: 12px; }
.pz-category-discovery__slider { position: relative; padding: 0 30px 8px; border-bottom: 1px solid #e6e9e2; }
.pz-category-discovery__track { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.pz-category-discovery__track::-webkit-scrollbar { display: none; }
.pz-category-discovery__card { flex: 0 0 calc((100% - 60px) / 6); min-width: 145px; min-height: 65px; display: flex; align-items: center; gap: 10px; padding: 3px 5px; border-radius: 8px; color: #374737; scroll-snap-align: start; transition: background-color .2s ease; }
.pz-category-discovery__card:hover { background: #f5f7f1; }
.pz-category-discovery__card--current, .pz-category-discovery__card--current:hover { background: #eef3e8; box-shadow: inset 0 0 0 1px #9db68b; }
.pz-category-discovery__card--current .pz-category-discovery__label { color: #2d4735; font-weight: 700; }
.pz-category-discovery__thumb { flex: none; width: 58px; height: 58px; overflow: hidden; border-radius: 9px; background: #f6f3ed; }
.pz-category-discovery__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pz-category-discovery__label { font-size: 13px; font-weight: 600; line-height: 1.3; }
.pz-category-discovery__arrow { position: absolute; top: 19px; width: 25px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: #f1f4ed; color: #446439; font-size: 21px; line-height: 1; cursor: pointer; }
.pz-category-discovery__arrow[hidden] { display: none; }
.pz-category-discovery__arrow--prev { left: 0; }
.pz-category-discovery__arrow--next { right: 0; }
.pz-category-discovery__arrow:disabled { opacity: .3; cursor: default; }
.pz-category-discovery__arrow:focus-visible, .pz-category-discovery__track:focus-visible { outline: 2px solid #426645; outline-offset: 3px; }

@media (min-width: 992px) and (max-width: 1199.98px) {
  .pz-category-discovery__copy { gap: 4px; padding-left: 11px; }
  .pz-category-discovery__title { font-size: 17px; }
  .pz-category-discovery__description { font-size: 10px; }
}

@media (max-width: 991.98px) {
  .pz-category-discovery { margin: 12px 0; }
  .pz-category-discovery__banners { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
  .pz-category-discovery__banners::-webkit-scrollbar { display: none; }
  .pz-category-discovery__banner { flex: 0 0 310px; max-width: calc(100vw - 40px); height: 116px; grid-template-columns: 49% 51%; scroll-snap-align: start; }
  .pz-category-discovery__banners--count-1 .pz-category-discovery__banner { flex-basis: 100%; max-width: 100%; grid-template-columns: 49% 51%; }
  .pz-category-discovery__copy { gap: 5px; padding: 10px 9px 10px 12px; }
  .pz-category-discovery__title { font-size: 17px; line-height: 1.13; }
  .pz-category-discovery__description { font-size: 10.5px; line-height: 1.3; }
  .pz-category-discovery__banners + .pz-category-discovery__slider { margin-top: 8px; }
  .pz-category-discovery__slider { padding: 0 0 6px; }
  .pz-category-discovery__track { gap: 9px; }
  .pz-category-discovery__card { flex-basis: 158px; min-width: 0; min-height: 60px; gap: 8px; padding: 3px 0; }
  .pz-category-discovery__card--current { padding: 3px 6px 3px 3px; }
  .pz-category-discovery__thumb { width: 52px; height: 52px; }
  .pz-category-discovery__label { font-size: 12px; }
  .pz-category-discovery__arrow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .pz-category-discovery__banner, .pz-category-discovery__card { transition: none; }
  .pz-category-discovery__track { scroll-behavior: auto; }
}
