/*
 * Product archives and product taxonomy pages for the 2026 redesign.
 * Scoped, token-driven, mobile-first.
 */

.post-type-archive-product .site-main,
.tax-product_cat .site-main,
.tax-product_tag .site-main {
  padding-block: 0 var(--k-space-6);
  background: var(--k-cream-bg);
}

.kanto-archive {
  max-width: 100%;
  overflow-x: hidden;
  color: var(--k-ink);
}

.kanto-archive a {
  color: inherit;
  text-decoration: none;
}

.kanto-archive a:focus-visible,
.kanto-archive button:focus-visible,
.kanto-archive summary:focus-visible,
.kanto-archive select:focus-visible,
.kanto-archive input:focus-visible {
  outline: 2px solid var(--k-zalo-blue);
  outline-offset: 3px;
}

.kanto-archive ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kanto-archive-breadcrumb {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .375rem;
  overflow-x: auto;
  padding-block-start: .375rem;
  color: var(--k-muted);
  font-size: .75rem;
  line-height: 1.3;
  scrollbar-width: none;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.kanto-archive-breadcrumb::-webkit-scrollbar {
  display: none;
}

.kanto-archive-breadcrumb a:hover {
  color: var(--k-accent-strong);
}

.kanto-archive-breadcrumb a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
}

.kanto-archive-breadcrumb__sep {
  color: color-mix(in srgb, var(--k-muted) 42%, var(--k-surface));
}

.kanto-archive__layout,
.kanto-archive__content {
  min-width: 0;
}

.kanto-archive-sidebar {
  display: none;
}

.kanto-archive-hero {
  position: relative;
  min-height: 8rem;
  overflow: hidden;
  border-radius: 1.25rem;
  background: var(--k-ink);
  isolation: isolate;
}

.kanto-archive-hero__media,
.kanto-archive-hero__image,
.kanto-archive-hero__fallback,
.kanto-archive-hero__overlay {
  position: absolute;
  inset: 0;
}

.kanto-archive-hero__image,
.kanto-archive-hero__fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kanto-archive-hero__media {
  overflow: hidden;
}

.woocommerce .kanto-archive .kanto-archive-hero__image,
.woocommerce .kanto-archive .kanto-archive-hero__fallback {
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
}

.kanto-archive-hero__fallback {
  display: block;
  background: var(--k-grad-hero);
}

.kanto-archive-hero__overlay {
  z-index: 1;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--k-ink) 88%, transparent),
    color-mix(in srgb, var(--k-ink) 18%, transparent)
  );
  pointer-events: none;
}

.kanto-archive-hero__copy {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 8rem;
  max-width: 16rem;
  flex-direction: column;
  justify-content: center;
  padding: var(--k-space-3);
  color: var(--k-surface);
}

.kanto-archive-hero__title {
  margin: 0;
  font-size: 1.1875rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.kanto-archive-summary {
  max-width: 48rem;
  margin-block: .75rem var(--k-space-3);
  color: var(--k-muted);
  font-size: .875rem;
  line-height: 1.65;
}

.kanto-archive-summary > * {
  margin: 0;
}

.kanto-archive-summary > * + * {
  margin-block-start: .625rem;
}

.kanto-archive-summary :where(p, li) {
  text-wrap: pretty;
}

.kanto-archive-summary :where(ul, ol) {
  padding-inline-start: 1.25rem;
}

.kanto-archive-summary :where(a) {
  color: var(--k-brand-pink);
  text-decoration-thickness: .08em;
  text-underline-offset: .16em;
}

.kanto-archive-summary :where(strong, b) {
  color: var(--k-ink);
}

.kanto-archive-summary img {
  display: none;
}

.kanto-archive .scrollx {
  display: flex;
  max-width: 100%;
  min-width: 0;
  gap: var(--k-space-2);
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scroll-padding-inline: var(--k-space-3);
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.kanto-archive .scrollx::-webkit-scrollbar {
  display: none;
}

.kanto-archive .scrollx > * {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.kanto-archive-rail {
  margin-block: var(--k-space-3) .25rem;
}

.kanto-archive-rail__title {
  margin: 0 0 var(--k-space-2);
  color: var(--k-ink);
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.25;
}

.kanto-archive-rail__title::before {
  display: inline-block;
  width: .375rem;
  aspect-ratio: 1;
  margin-inline-end: .5rem;
  border-radius: 50%;
  background: var(--k-brand-pink);
  content: "";
  vertical-align: .08em;
}

.kanto-archive-rail__track {
  padding-block-end: .125rem;
}

.kanto-archive-rail__item {
  display: grid;
  width: 4.875rem;
  gap: .5rem;
  color: var(--k-ink);
  font-size: .6875rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  overflow-wrap: anywhere;
}

.kanto-archive-rail__media {
  display: grid;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 1rem;
  background: color-mix(in srgb, var(--k-surface) 80%, var(--k-cream-bg));
  place-items: center;
}

.kanto-archive-rail__image {
  width: 82%;
  height: 82%;
  object-fit: contain;
}

.kanto-archive-rail__item:hover {
  color: var(--k-accent-strong);
}

.kanto-archive__image-fallback {
  display: block;
  width: 70%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: color-mix(in srgb, var(--k-brand-yellow) 36%, var(--k-surface));
}

.kanto-archive-subcats {
  display: none;
  margin-block: var(--k-space-2) 0;
}

.kanto-archive-subcats__track {
  padding-block: .125rem .25rem;
}

.kanto-archive-subcats__pill {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .375rem;
  padding-inline: .875rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--k-surface) 72%, var(--k-cream-bg));
  color: var(--k-ink);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
}

.kanto-archive-subcats__pill.is-active {
  background: var(--k-accent-strong);
  color: var(--k-surface);
}

.kanto-archive-subcats__count {
  color: color-mix(in srgb, currentColor 60%, transparent);
}

.kanto-archive-subcats__pill.is-active .kanto-archive-subcats__count {
  color: var(--k-surface);
}

.kanto-archive-filters {
  position: relative;
  display: flex;
  max-width: 100%;
  gap: .5rem;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
  margin-block: .25rem .875rem;
  padding-block: .125rem .375rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.kanto-archive-filters::-webkit-scrollbar {
  display: none;
}

.kanto-archive-filter,
.kanto-archive-filters__reset {
  flex: 0 0 auto;
  min-inline-size: 0;
}

.kanto-archive-filter {
  position: relative;
}

.kanto-archive-filter--mobile {
  display: block;
}

.kanto-archive-filter-group {
  display: none;
}

.kanto-archive-filter summary,
.kanto-archive-filters__reset {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: .375rem;
  padding-inline: .75rem;
  border: 1px solid color-mix(in srgb, var(--k-card-border) 78%, var(--k-surface));
  border-radius: .75rem;
  background: var(--k-surface);
  color: var(--k-ink);
  cursor: pointer;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
  list-style: none;
  white-space: nowrap;
}

.kanto-archive-filter summary::-webkit-details-marker {
  display: none;
}

.kanto-archive-filter summary::after {
  flex: 0 0 auto;
  color: color-mix(in srgb, var(--k-muted) 72%, var(--k-surface));
  content: "▾";
  font-size: .6875rem;
  line-height: 1;
}

.kanto-archive-filter[open] summary::after {
  transform: rotate(180deg);
}

.kanto-archive-filter[open] summary,
.kanto-archive-filter.is-active summary,
.kanto-archive-filter-group.is-active .kanto-archive-filter-group__title {
  border-color: var(--k-accent-text);
  color: var(--k-accent-strong);
}

.kanto-archive-filter__menu,
.kanto-archive-filter-group__options {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kanto-archive-filter__menu {
  position: fixed;
  top: var(--kanto-filter-menu-top, 3rem);
  left: var(--kanto-filter-menu-left, .75rem);
  z-index: 80;
  display: grid;
  width: var(--kanto-filter-menu-width, min(20rem, calc(100vw - 1.5rem)));
  max-height: min(20rem, calc(100dvh - var(--kanto-filter-menu-top, 3rem) - .75rem));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: .375rem;
  border: 1px solid var(--k-card-border);
  border-radius: .875rem;
  background: var(--k-surface);
  box-shadow: var(--k-shadow);
}

.kanto-archive-filter__option {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: space-between;
  gap: .625rem;
  padding: .5rem .75rem;
  border-radius: .625rem;
  color: var(--k-ink);
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.kanto-archive-filter__option:hover,
.kanto-archive-filter__option.is-active {
  background: color-mix(in srgb, var(--k-brand-pink) 10%, var(--k-surface));
  color: var(--k-accent-strong);
}

.kanto-archive-filter__option-label {
  min-width: 0;
}

.kanto-archive-filter__count {
  flex: 0 0 auto;
  color: var(--k-muted);
  font-size: .75rem;
}

.kanto-archive-filter__card {
  flex-direction: row;
}

.kanto-archive-filter__card .kanto-archive-filter__image {
  display: none;
}

.kanto-archive-filter__custom-price {
  margin-block-start: .25rem;
  padding-block-start: .625rem;
  border-block-start: 1px solid var(--k-card-border);
}

.kanto-archive-filter__price-form,
.kanto-archive-filter__price-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.kanto-archive-filter__price-form fieldset {
  display: grid;
  gap: .625rem;
}

.kanto-archive-filter__price-form legend {
  margin-block-end: .375rem;
  color: var(--k-ink);
  font-size: .8125rem;
  font-weight: 700;
}

.kanto-archive-filter__price-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
}

.kanto-archive-filter__price-fields label {
  display: grid;
  min-width: 0;
  gap: .25rem;
  color: var(--k-muted);
  font-size: .75rem;
}

.kanto-archive-filter__price-form input {
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding-inline: .625rem;
  border: 1px solid var(--k-card-border);
  border-radius: .625rem;
  background: var(--k-surface);
  color: var(--k-ink);
  font: inherit;
}

.kanto-archive-filter__price-form button {
  min-height: 2.75rem;
  border: 0;
  border-radius: 999px;
  background: var(--k-ink);
  color: var(--k-surface);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.kanto-archive-filters__reset {
  color: var(--k-accent-text);
}

.kanto-archive-filters__reset:hover {
  color: var(--k-accent-strong);
}

.kanto-archive-filters__reset.is-disabled {
  display: none;
}

.kanto-archive-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--k-space-2);
  margin-block: .875rem .75rem;
}

.kanto-archive-header__copy {
  min-width: 0;
}

.kanto-archive-header__title {
  margin: 0;
  color: var(--k-ink);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}

.kanto-archive-header .woocommerce-result-count {
  margin: .125rem 0 0;
  color: var(--k-muted);
  font-size: .6875rem;
  line-height: 1.35;
}

.kanto-archive-sort {
  flex: 0 0 auto;
}

.kanto-archive-sort .woocommerce-ordering {
  margin: 0;
}

.kanto-archive-sort .orderby {
  min-height: 2.75rem;
  max-width: 9.5rem;
  padding-inline: .75rem 1.625rem;
  border: 0;
  border-radius: .75rem;
  background-color: color-mix(in srgb, var(--k-surface) 72%, var(--k-cream-bg));
  color: var(--k-ink);
  font: inherit;
  font-size: .75rem;
  font-weight: 700;
}

.kanto-archive-products {
  min-width: 0;
}

.woocommerce .kanto-archive ul.products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .6875rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce .kanto-archive ul.products::before,
.woocommerce .kanto-archive ul.products::after {
  display: none;
}

.woocommerce .kanto-archive ul.products li.product.archive-product-grid__item {
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.archive-product-card {
  display: flex;
  height: 100%;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--k-card-border) 72%, var(--k-surface));
  border-radius: 1rem;
  background: var(--k-surface);
  container-type: inline-size;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.archive-product-card__media {
  position: relative;
  display: grid;
  height: 7.625rem;
  place-items: center;
  background: color-mix(in srgb, var(--k-surface) 88%, var(--k-cream-bg));
}

.archive-product-card__badge {
  position: absolute;
  top: .5rem;
  left: .5rem;
  z-index: 1;
  padding: .1875rem .375rem;
  border-radius: .4375rem;
  color: var(--k-surface);
  background: var(--k-accent-strong);
  font-size: .625rem;
  font-weight: 700;
  line-height: 1.2;
}

.archive-product-card__badge--green {
  background: color-mix(in srgb, var(--k-trust-green) 62%, var(--k-ink));
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__image {
  width: min(82%, 6.75rem);
  max-height: 6.5rem;
  margin: 0;
  object-fit: contain;
  transition: transform .2s ease;
}

.archive-product-card__body {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  padding: .625rem .6875rem .75rem;
}

.archive-product-card__eyebrow {
  display: block;
  min-height: .75rem;
  color: var(--k-accent-text);
  font-size: .5625rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__title {
  display: -webkit-box;
  min-height: 1.9375rem;
  margin: .1875rem 0 .3125rem;
  overflow: hidden;
  color: var(--k-ink);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.archive-product-card__title a {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
}

.archive-product-card__title a:hover {
  color: var(--k-accent-strong);
}

.archive-product-card__rating {
  display: flex;
  min-height: 1rem;
  align-items: center;
  gap: .25rem;
  color: var(--k-muted);
  font-size: .625rem;
  line-height: 1;
}

.archive-product-card__stars {
  position: relative;
  display: inline-block;
  color: color-mix(in srgb, var(--k-card-border) 82%, var(--k-surface));
  letter-spacing: 0;
}

.archive-product-card__stars::before {
  position: absolute;
  inset: 0;
  width: var(--rating);
  overflow: hidden;
  color: var(--k-brand-yellow);
  content: "★★★★★";
}

.archive-product-card__footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: .5rem;
  margin-block-start: auto;
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__price {
  min-width: 0;
  margin: 0;
  color: var(--k-ink);
  font-size: .90625rem;
  font-weight: 700;
  line-height: 1.2;
}

.archive-product-card__price del {
  display: block;
  color: var(--k-muted);
  font-size: .625rem;
  font-weight: 500;
  line-height: 1.2;
}

.archive-product-card__price ins {
  text-decoration: none;
}

.archive-product-card__price .amount {
  white-space: nowrap;
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__cart {
  display: inline-grid;
  width: 2.75rem;
  min-width: 2.75rem;
  height: 2.75rem;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: .875rem;
  background: var(--k-brand-yellow);
  color: var(--k-ink);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  transition: background-color .2s ease, transform .2s ease;
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__cart:hover,
.woocommerce .kanto-archive ul.products li.product .archive-product-card__cart.added {
  background: var(--k-yellow-dark);
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__cart.loading {
  opacity: .65;
  pointer-events: none;
}

.woocommerce .kanto-archive ul.products li.product .archive-product-card__footer .added_to_cart {
  display: none;
}

.kanto-archive-pagination {
  display: grid;
  justify-items: center;
  gap: var(--k-space-2);
  margin-block-start: var(--k-space-3);
}

.kanto-archive-pagination__more {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  padding-inline: 1.75rem;
  border-radius: 999px;
  background: var(--k-brand-yellow);
  color: var(--k-ink);
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1.2;
}

.kanto-archive-pagination__more:hover {
  background: var(--k-yellow-dark);
}

.kanto-archive-pagination__more[aria-busy="true"] {
  opacity: .7;
  pointer-events: none;
}

.woocommerce .kanto-archive .woocommerce-pagination {
  margin: 0;
}

.kanto-archive--infinite-ready .woocommerce-pagination {
  display: none;
}

.woocommerce .kanto-archive .woocommerce-pagination ul.page-numbers {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .375rem;
  margin: 0;
  border: 0;
}

.woocommerce .kanto-archive .woocommerce-pagination ul.page-numbers li {
  border: 0;
}

.woocommerce .kanto-archive .woocommerce-pagination .page-numbers a,
.woocommerce .kanto-archive .woocommerce-pagination .page-numbers span {
  display: grid;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: .5rem;
  place-items: center;
  border: 1px solid var(--k-card-border);
  border-radius: 50%;
  background: var(--k-surface);
  color: var(--k-ink);
  font-weight: 700;
}

.woocommerce .kanto-archive .woocommerce-pagination .page-numbers .current,
.woocommerce .kanto-archive .woocommerce-pagination .page-numbers a:hover {
  border-color: var(--k-brand-yellow);
  background: var(--k-brand-yellow);
}

.kanto-archive-empty {
  padding: var(--k-space-4);
  border: 1px solid var(--k-card-border);
  border-radius: 1rem;
  background: var(--k-surface);
  color: var(--k-ink);
  text-align: center;
}

.kanto-archive-empty .woocommerce-info {
  margin: 0;
  border: 0;
  background: transparent;
}

.kanto-archive-guide {
  margin-block-start: var(--k-space-5);
  padding-block-start: var(--k-space-4);
  border-top: 1px solid var(--k-card-border);
}

.kanto-archive-guide__title {
  margin: 0 0 .5625rem;
  color: var(--k-ink);
  font-size: .9375rem;
  font-weight: 700;
  line-height: 1.3;
}

.kanto-archive-guide__copy {
  color: var(--k-muted);
  font-size: 1rem;
  line-height: 1.65;
}

.kanto-archive-guide__copy > * {
  margin-block: 0 .625rem;
}

.kanto-archive-guide__copy a {
  color: var(--k-accent-text);
  font-weight: 700;
}

.kanto-archive-faqs {
  display: grid;
  gap: .625rem;
  margin-block-start: var(--k-space-3);
}

.kanto-archive-faq {
  padding: .875rem 1rem;
  border: 1px solid var(--k-card-border);
  border-radius: .875rem;
  background: var(--k-surface);
}

.kanto-archive-faq__question {
  margin: 0 0 .25rem;
  color: var(--k-ink);
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1.35;
}

.kanto-archive-faq__answer {
  margin: 0;
  color: var(--k-muted);
  font-size: .75rem;
  line-height: 1.6;
}

@media (min-width: 48rem) {
  .kanto-archive-breadcrumb {
    min-height: 3rem;
    font-size: .8125rem;
  }

  .kanto-archive-hero {
    min-height: 9rem;
    border-radius: 1.125rem;
  }

  .kanto-archive-hero__copy {
    min-height: 9rem;
    max-width: 25rem;
    padding-inline: 1.75rem;
  }

  .kanto-archive-hero__title {
    font-size: 1.375rem;
  }

  .kanto-archive-summary {
    max-width: 56rem;
    margin-block-start: var(--k-space-2);
    font-size: .9375rem;
  }

  .kanto-archive-rail__item {
    width: 6rem;
    font-size: .78125rem;
  }

  .kanto-archive-subcats__pill,
  .kanto-archive-filter summary,
  .kanto-archive-filters__reset {
    font-size: .8125rem;
  }

  .kanto-archive-filter-group {
    display: flex;
    flex: 0 1 auto;
    min-width: 0;
    align-items: center;
    gap: .5rem;
  }

  .kanto-archive-filter--mobile {
    display: none;
  }

  .kanto-archive-filter-group__title {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    flex: 0 0 auto;
    padding-inline: .75rem;
    border: 1px solid color-mix(in srgb, var(--k-card-border) 78%, var(--k-surface));
    border-radius: .75rem;
    background: var(--k-surface);
    color: var(--k-ink);
    font-size: .8125rem;
    font-weight: 700;
    line-height: 1.2;
  }

  .kanto-archive-filter-group__options {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
  }

  .kanto-archive-filter-group .kanto-archive-filter__option {
    min-height: 2.75rem;
    border: 1px solid color-mix(in srgb, var(--k-card-border) 78%, var(--k-surface));
    border-radius: .75rem;
    background: var(--k-surface);
  }

  .kanto-archive-filter-group .kanto-archive-filter__option.is-active {
    border-color: var(--k-brand-pink);
    background: var(--k-brand-pink);
    color: var(--k-surface);
  }

  .kanto-archive-filter-group .kanto-archive-filter__option.is-active .kanto-archive-filter__count {
    color: color-mix(in srgb, var(--k-surface) 70%, transparent);
  }

  .kanto-archive-filter__menu {
    position: absolute;
    top: calc(100% + .375rem);
    left: 0;
    width: min(20rem, calc(100vw - 2rem));
    max-height: 20rem;
    transform: translateX(var(--kanto-filter-menu-shift, 0));
  }

  .woocommerce .kanto-archive ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--k-space-3);
  }

  .archive-product-card__media {
    height: 9.5rem;
  }

  .woocommerce .kanto-archive ul.products li.product .archive-product-card__image {
    width: min(82%, 8.25rem);
    max-height: 8rem;
  }

  .kanto-archive-faqs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .875rem;
  }
}

@media (min-width: 64rem) {
  .kanto-archive__layout {
    display: grid;
    grid-template-columns: 15.5rem minmax(0, 1fr);
    gap: 1.75rem;
    align-items: start;
    padding-block-start: var(--k-space-2);
  }

  .kanto-archive-sidebar {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    gap: var(--k-space-3);
  }

  .kanto-archive__content {
    grid-column: 2;
    grid-row: 1;
  }

  .kanto-archive-sidebar__tree,
  .kanto-archive-sidebar__section {
    overflow: hidden;
    border: 1px solid var(--k-card-border);
    border-radius: 1rem;
    background: var(--k-surface);
  }

  .kanto-archive-sidebar__heading {
    margin: 0;
    padding: .8125rem 1rem;
    background: var(--k-brand-yellow);
    color: var(--k-ink);
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25;
  }

  .kanto-archive-sidebar__tree-body {
    padding-block: .25rem;
  }

  .kanto-archive-sidebar__tree-link {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-inline: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--k-card-border) 42%, var(--k-surface));
    color: var(--k-muted);
    font-size: .8125rem;
    font-weight: 700;
    line-height: 1.25;
  }

  .kanto-archive-sidebar__tree-item:first-child .kanto-archive-sidebar__tree-link {
    border-top: 0;
  }

  .kanto-archive-sidebar__tree-link:hover,
  .kanto-archive-sidebar__tree-link.is-current,
  .kanto-archive-sidebar__tree-link.is-trail {
    background: color-mix(in srgb, var(--k-brand-yellow) 22%, var(--k-surface));
    color: var(--k-ink);
  }

  .kanto-archive-sidebar__count {
    color: var(--k-muted);
    font-size: .75rem;
    font-weight: 700;
  }

  .kanto-archive-sidebar__title {
    margin: 0;
    padding: .875rem 1rem .75rem;
    color: var(--k-ink);
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25;
  }

  .kanto-archive-sidebar__products {
    display: grid;
    padding-inline: 1rem;
  }

  .kanto-archive-sidebar__products li:not(:last-child) {
    border-bottom: 1px solid color-mix(in srgb, var(--k-card-border) 48%, var(--k-surface));
  }

  .kanto-archive-sidebar__product {
    display: grid;
    grid-template-columns: 3.375rem minmax(0, 1fr);
    min-height: 4.75rem;
    align-items: center;
    gap: .6875rem;
  }

  .kanto-archive-sidebar__media {
    display: grid;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: .625rem;
    background: color-mix(in srgb, var(--k-surface) 88%, var(--k-cream-bg));
    place-items: center;
  }

  .kanto-archive-sidebar__media img {
    width: 84%;
    height: 84%;
    object-fit: contain;
  }

  .kanto-archive-sidebar__body {
    display: grid;
    gap: .1875rem;
    min-width: 0;
  }

  .kanto-archive-sidebar__name {
    display: -webkit-box;
    overflow: hidden;
    color: var(--k-ink);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .kanto-archive-sidebar__price {
    color: var(--k-accent-text);
    font-size: .78125rem;
    font-weight: 700;
    line-height: 1.25;
  }

  .kanto-archive-sidebar__price del {
    display: none;
  }

  .kanto-archive-subcats {
    display: none;
  }

  .kanto-archive-hero {
    min-height: 9.375rem;
    margin-block-start: 0;
  }

  .kanto-archive-hero__copy {
    min-height: 9.375rem;
  }

  .kanto-archive-rail {
    margin-block-end: .5rem;
  }

  .kanto-archive-filters {
    flex-wrap: wrap;
    overflow: visible;
    margin-block: 0 var(--k-space-3);
    padding-block: 0;
  }

  .kanto-archive-header {
    margin-block-start: 0;
  }

  .kanto-archive-header__title {
    font-size: 1.25rem;
  }

  .kanto-archive-header .woocommerce-result-count {
    font-size: .78125rem;
  }

  .kanto-archive-sort .orderby {
    max-width: 12rem;
    font-size: .8125rem;
  }

  .archive-product-card__media {
    height: 10rem;
  }

  .archive-product-card__body {
    padding: .75rem .8125rem .875rem;
  }

  .woocommerce .kanto-archive ul.products li.product .archive-product-card__title {
    font-size: .78125rem;
  }

  .woocommerce .kanto-archive ul.products li.product .archive-product-card__price {
    font-size: .9375rem;
  }

  .archive-product-card:hover {
    z-index: 1;
    border-color: color-mix(in srgb, var(--k-brand-pink) 26%, var(--k-card-border));
    transform: translateY(-.125rem);
    box-shadow: var(--k-shadow);
  }

  .archive-product-card:hover .archive-product-card__image {
    transform: scale(1.02);
  }
}

@media (min-width: 90rem) {
  .kanto-archive.wrap {
    width: min(100% - 5rem, var(--k-wrap));
  }

  .woocommerce .kanto-archive ul.products {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--k-space-3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .archive-product-card,
  .archive-product-card__image,
  .woocommerce .kanto-archive ul.products li.product .archive-product-card__cart {
    transition: none;
  }

  .archive-product-card:hover {
    transform: none;
  }
}
