/* Open gallery: deliberately separate from the original mosaic. */
.skrupt-categories.skc-style-showcase { --skc-showcase-image: 176px; --skc-showcase-main: 320px; }
.skrupt-categories.skc-style-showcase .skc-track { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; align-items: end; }
.skrupt-categories.skc-style-showcase .skc-item { min-width: 0; align-self: end; }
.skrupt-categories.skc-style-showcase .skc-card { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-height: 0; padding: 12px 8px; gap: 18px; border: 0; border-radius: 16px; background: transparent; box-shadow: none; text-align: center; }
.skrupt-categories.skc-style-showcase .skc-card:is(:hover,:focus-visible,:active) { background: transparent; box-shadow: none; }
.skrupt-categories.skc-style-showcase .skc-card:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.skrupt-categories.skc-style-showcase .skc-card__visual { display: flex; align-items: center; justify-content: center; width: 100%; height: var(--skc-showcase-image); flex: 0 0 auto; margin: 0; }
.skrupt-categories.skc-style-showcase .skc-card__visual img { display: block; position: static; width: auto; height: 100%; max-width: 100%; object-fit: contain; transition: transform .2s ease; }
.skrupt-categories.skc-style-showcase .skc-item:first-child .skc-card__visual { height: var(--skc-showcase-main); }
.skrupt-categories.skc-style-showcase .skc-card__copy { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; min-width: 0; }
.skrupt-categories.skc-style-showcase .skc-card__label { padding: 0; font-size: 19px; line-height: 1.3; font-weight: 500; text-wrap: balance; }
.skrupt-categories.skc-style-showcase .skc-card__description { margin: 0; font-size: 14px; line-height: 1.45; font-weight: 400; }
.skrupt-categories.skc-style-showcase .skc-card__arrow { display: none; }
.skrupt-categories.skc-style-showcase .skc-item:only-child { grid-column: 1 / -1; }
@media(max-width:767px) {
  .skrupt-categories.skc-style-showcase { --skc-showcase-image: 80px; --skc-showcase-main: 240px; }
  .skrupt-categories.skc-style-showcase .skc-track { grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); gap: 10px 10px; align-items: center; }
  .skrupt-categories.skc-style-showcase .skc-item { align-self: center; }
  .skrupt-categories.skc-style-showcase .skc-card { padding: 4px 2px; gap: 6px; }
  .skrupt-categories.skc-style-showcase .skc-card__label { font-size: 14px; }
  .skrupt-categories.skc-style-showcase .skc-card__description { margin: 0; font-size: 12px; line-height: 1.35; }
}
@media(prefers-reduced-motion:reduce) { .skrupt-categories.skc-style-showcase .skc-card__visual img { transition: none; } }

.skrupt-categories {
  --skc-card-bg: var(--vvp-ds-subtle, #eef0f2);
  --skc-card-hover-bg: var(--vvp-ds-action-soft, #e5eaf2);
  --skc-text-color: var(--vvp-ds-action, #263b63);
  --skc-icon-color: var(--vvp-ds-action, #263b63);
  --skc-title-color: var(--vvp-ds-muted, #62656a);
  --skc-gap: 16px;
  --skc-radius: 18px;
  --skc-padding: 20px;
  --skc-icon-size: 44px;
  --skc-min-height: 124px;
  --skc-title-size: 16px;
  --skc-label-size: 15px;
  --skc-margin-top: 0px;
  --skc-margin-bottom: 0px;
  --skc-columns: var(--skc-columns-mobile, 2);
  box-sizing: border-box;
  clear: both;
  display: block;
  margin: var(--skc-margin-top) 0 var(--skc-margin-bottom);
  min-width: 0;
  width: 100%;
  font-family: inherit;
}

.skrupt-categories *,
.skrupt-categories *::before,
.skrupt-categories *::after {
  box-sizing: border-box;
}

.skrupt-categories [hidden] {
  display: none !important;
}

.skrupt-categories .skc-title {
  color: var(--skc-title-color);
  font: inherit;
  font-size: var(--skc-title-size);
  font-weight: 500;
  line-height: 1.4;
  margin: 0 0 16px;
  overflow-wrap: anywhere;
  text-align: start;
  text-transform: none;
}

.skrupt-categories h2.skc-title::after {
  content: none;
  display: none;
}

.skrupt-categories .skc-track {
  border: 0;
  display: grid;
  gap: var(--skc-gap);
  grid-template-columns: repeat(var(--skc-columns), minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

.skrupt-categories .skc-item {
  display: flex;
  float: none;
  list-style: none;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.skrupt-categories .skc-item::before {
  content: none;
}

.skrupt-categories .skc-card {
  align-items: flex-start;
  background: var(--skc-card-bg);
  border: 0;
  border-radius: var(--skc-radius);
  box-shadow: none;
  color: var(--skc-text-color);
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 14px;
  justify-content: center;
  margin: 0;
  min-height: var(--skc-min-height);
  min-width: 0;
  padding: var(--skc-padding);
  position: relative;
  text-align: start;
  text-decoration: none;
  transition: background-color 160ms ease, color 160ms ease;
  -webkit-tap-highlight-color: transparent;
}

.skrupt-categories .skc-card:visited {
  color: var(--skc-text-color);
}

.skrupt-categories .skc-card:hover,
.skrupt-categories .skc-card:focus-visible {
  background: var(--skc-card-hover-bg);
  color: var(--skc-text-color);
  text-decoration: none;
}

.skrupt-categories .skc-card:focus,
.skrupt-categories .skc-track:focus,
.skrupt-categories .skc-control:focus,
.skrupt-categories .skc-dot:focus,
.skrupt-categories .skc-reveal:focus {
  outline: 2px solid var(--skc-text-color);
  outline-offset: -3px;
}

.skrupt-categories .skc-card:focus:not(:focus-visible),
.skrupt-categories .skc-track:focus:not(:focus-visible),
.skrupt-categories .skc-control:focus:not(:focus-visible),
.skrupt-categories .skc-dot:focus:not(:focus-visible),
.skrupt-categories .skc-reveal:focus:not(:focus-visible) {
  outline: none;
}

.skrupt-categories .skc-card__visual {
  align-items: center;
  color: var(--skc-icon-color);
  display: flex;
  flex: 0 0 auto;
  height: var(--skc-icon-size);
  justify-content: center;
  max-width: 100%;
  width: var(--skc-icon-size);
}

.skrupt-categories .skc-card__visual img {
  border: 0;
  border-radius: 0;
  display: block;
  height: 100%;
  margin: 0;
  max-width: 100%;
  object-fit: contain;
  padding: 0;
  width: 100%;
}

@supports ((mask-image: none) or (-webkit-mask-image: none)) {
  .skrupt-categories .skc-card__visual--icon {
    background-color: currentColor;
    -webkit-mask-image: var(--skc-icon-url);
    mask-image: var(--skc-icon-url);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  .skrupt-categories .skc-card__visual--icon img {
    visibility: hidden;
  }
}

.skrupt-categories .skc-card__label {
  color: inherit;
  display: block;
  font-size: var(--skc-label-size);
  font-weight: 500;
  line-height: 1.4;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding-inline-end: 22px;
  text-transform: none;
}

.skrupt-categories .skc-card__copy {
  display: contents;
}

.skrupt-categories .skc-card__arrow {
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  bottom: calc(var(--skc-padding) + 5px);
  height: 7px;
  inset-inline-end: calc(var(--skc-padding) + 2px);
  position: absolute;
  transform: rotate(-45deg);
  width: 7px;
}

[dir="rtl"] .skrupt-categories .skc-card__arrow,
.skrupt-categories[dir="rtl"] .skc-card__arrow {
  transform: rotate(135deg);
}

.skrupt-categories.skc-style-compact .skc-card {
  align-items: center;
  flex-direction: row;
  gap: 12px;
  justify-content: flex-start;
  min-height: min(var(--skc-min-height), 84px);
}

.skrupt-categories.skc-style-compact .skc-card__visual {
  height: min(var(--skc-icon-size), 36px);
  width: min(var(--skc-icon-size), 36px);
}

.skrupt-categories.skc-style-compact .skc-card__label {
  flex: 1 1 auto;
  min-width: 0;
}

.skrupt-categories.skc-style-compact .skc-card__arrow {
  bottom: calc(50% - 3px);
}

/* A single shallow row of category illustrations, with native horizontal scroll. */
.skrupt-categories.skc-style-visuals {
  --skc-gap: 8px;
  --skc-label-size: 13px;
  --skc-icon-size: 48px;
  --skc-min-height: 88px;
}

.skrupt-categories.skc-style-visuals .skc-visuals-shell {
  min-width: 0;
  position: relative;
}

.skrupt-categories.skc-style-visuals .skc-visuals-shell--arrows {
  /* Reserved before JS initializes; showing arrows cannot move the product grid. */
  padding-inline: 32px;
}

.skrupt-categories.skc-style-visuals .skc-card {
  align-items: center;
  background: transparent;
  border-radius: 6px;
  flex-direction: column;
  gap: 6px;
  justify-content: flex-start;
  min-height: 88px;
  padding: 4px 2px;
  text-align: center;
}

.skrupt-categories.skc-style-visuals .skc-card:hover,
.skrupt-categories.skc-style-visuals .skc-card:focus-visible {
  background: transparent;
}

.skrupt-categories.skc-style-visuals .skc-card:hover .skc-card__label,
.skrupt-categories.skc-style-visuals .skc-card:focus-visible .skc-card__label {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Visuals style: height from the design setting (48px by default), 4:3 box. */
.skrupt-categories.skc-style-visuals .skc-card__visual {
  height: var(--skc-visual-size, 48px);
  width: calc(var(--skc-visual-size, 48px) * 4 / 3);
}

.skrupt-categories.skc-style-visuals .skc-card__label {
  font-size: var(--skc-label-size);
  font-weight: 500;
  line-height: 1.3;
  padding: 0;
}

.skrupt-categories.skc-style-visuals .skc-card__arrow,
.skrupt-categories.skc-style-visuals .skc-dots {
  display: none !important;
}

.skrupt-categories.skc-style-visuals .skc-controls {
  display: block;
  inset: 0;
  margin: 0;
  pointer-events: none;
  position: absolute;
}

.skrupt-categories.skc-style-visuals .skc-control {
  background: transparent;
  border-radius: 6px;
  height: 44px;
  pointer-events: auto;
  position: absolute;
  top: 6px;
  width: 32px;
}

.skrupt-categories.skc-style-visuals .skc-control:disabled {
  visibility: hidden;
  pointer-events: none;
}

.skrupt-categories.skc-style-visuals .skc-control--previous { inset-inline-start: 0; }
.skrupt-categories.skc-style-visuals .skc-control--next { inset-inline-end: 0; }

.skrupt-categories.skc-style-visuals .skc-control:hover:not(:disabled),
.skrupt-categories.skc-style-visuals .skc-control:focus-visible {
  background: var(--skc-card-hover-bg);
}

.skrupt-categories.skc-layout-carousel .skc-track {
  grid-auto-columns: calc((100% - (var(--skc-columns) - 1) * var(--skc-gap)) / var(--skc-columns));
  grid-auto-flow: column;
  grid-template-columns: none;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-color: var(--skc-title-color) transparent;
  scrollbar-width: thin;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.skrupt-categories.skc-layout-carousel .skc-item {
  scroll-snap-align: start;
}

.skrupt-categories.skc-layout-carousel.skc-style-visuals .skc-track {
  grid-auto-columns: 112px;
  justify-content: start;
  scrollbar-width: none;
}

.skrupt-categories.skc-layout-carousel.skc-style-visuals .skc-track::-webkit-scrollbar {
  display: none;
}

@media (max-width: 767px) {
  .skrupt-categories.skc-layout-carousel.skc-style-visuals .skc-track {
    grid-auto-columns: 104px;
  }

  .skrupt-categories.skc-style-visuals .skc-card__label { font-size: 12px; }

  /* Phones keep the visual inside the 104px carousel column. */
  .skrupt-categories.skc-style-visuals .skc-card__visual {
    height: min(var(--skc-visual-size, 48px), 72px);
    width: calc(min(var(--skc-visual-size, 48px), 72px) * 4 / 3);
  }
}

@media (min-width: 992px) {
  .skrupt-categories.skc-style-visuals .skc-visuals-shell--arrows {
    padding-inline: 0;
  }
}

/* Vapovor's page gutters already leave room for the lateral controls. */
@media (max-width: 991px) {
  #js-product-list-header.vvp-category-header--visuals .skc-visuals-shell--arrows {
    padding-inline: 0;
  }
  #js-product-list-header.vvp-category-header--visuals .skc-control--previous {
    inset-inline-start: -16px;
  }
  #js-product-list-header.vvp-category-header--visuals .skc-control--next {
    inset-inline-end: -16px;
  }
}
@media (max-width: 359px) {
  #js-product-list-header.vvp-category-header--visuals .skc-style-visuals .skc-track {
    grid-auto-columns: calc((100% - var(--skc-gap)) / 2);
  }
}

.skrupt-categories .skc-controls {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 12px;
  min-width: 0;
}

.skrupt-categories .skc-reveal-slot {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  list-style: none;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.skrupt-categories .skc-reveal-slot::before {
  content: none;
}

.skrupt-categories .skc-reveal-slot--full {
  grid-column: 1 / -1;
}

.skrupt-categories .skc-reveal {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  color: var(--skc-text-color);
  cursor: pointer;
  display: flex;
  flex: 0 0 auto;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  gap: 9px;
  justify-content: center;
  line-height: 1.4;
  margin: 0;
  margin-inline-start: auto;
  margin-inline-end: 0;
  max-width: 100%;
  min-height: 44px;
  padding: 8px 4px;
  text-align: start;
  text-transform: none;
}

.skrupt-categories .skc-reveal::after {
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  content: "";
  flex: 0 0 auto;
  height: 7px;
  margin: -4px 2px 0;
  transform: rotate(45deg);
  width: 7px;
}

.skrupt-categories .skc-reveal[aria-expanded="true"]::after {
  margin-top: 4px;
  transform: rotate(225deg);
}

.skrupt-categories .skc-reveal:hover span,
.skrupt-categories .skc-reveal:focus-visible span {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.skrupt-categories .skc-control,
.skrupt-categories .skc-dot {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  color: var(--skc-text-color);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font: inherit;
  justify-content: center;
  margin: 0;
  padding: 0;
  text-decoration: none;
}

.skrupt-categories .skc-control {
  background: var(--skc-card-bg);
  height: 40px;
  width: 40px;
}

.skrupt-categories .skc-control:hover:not(:disabled),
.skrupt-categories .skc-control:focus-visible {
  background: var(--skc-card-hover-bg);
}

.skrupt-categories .skc-control:disabled {
  cursor: default;
  opacity: 0.35;
}

.skrupt-categories .skc-control span {
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  display: block;
  height: 8px;
  width: 8px;
}

.skrupt-categories .skc-control--previous span {
  margin-inline-start: 3px;
  transform: rotate(135deg);
}

.skrupt-categories .skc-control--next span {
  margin-inline-end: 3px;
  transform: rotate(-45deg);
}

[dir="rtl"] .skrupt-categories .skc-control--previous span,
.skrupt-categories[dir="rtl"] .skc-control--previous span {
  transform: rotate(-45deg);
}

[dir="rtl"] .skrupt-categories .skc-control--next span,
.skrupt-categories[dir="rtl"] .skc-control--next span {
  transform: rotate(135deg);
}

.skrupt-categories .skc-dots {
  align-items: center;
  display: flex;
  flex: 0 1 auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.skrupt-categories .skc-dot {
  height: 36px;
  width: 28px;
}

.skrupt-categories .skc-dot::before {
  background: currentColor;
  border-radius: 50%;
  content: "";
  height: 6px;
  opacity: 0.3;
  width: 6px;
}

.skrupt-categories .skc-dot[aria-current="true"]::before {
  height: 8px;
  opacity: 1;
  width: 8px;
}

.skrupt-categories .skc-sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/* The first four cards form the home mosaic; their order defines the layout. */
.skrupt-categories.skc-style-mosaic {
  --skc-card-bg: #fff;
  --skc-card-hover-bg: #fafbfc;
  --skc-text-color: #202124;
  --skc-gap: 24px;
  --skc-radius: 22px;
  --skc-padding: 24px;
  --skc-icon-size: 56px;
  --skc-min-height: 190px;
  --skc-label-size: 24px;
}

.skrupt-categories.skc-style-mosaic .skc-track {
  grid-template-columns: minmax(0, 1fr);
}

.skrupt-categories.skc-style-mosaic .skc-card {
  align-items: stretch;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

.skrupt-categories.skc-style-mosaic .skc-card__copy {
  align-items: flex-start;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 16px;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}

.skrupt-categories.skc-style-mosaic .skc-card__label {
  font-weight: 600;
  line-height: 1.2;
  padding: 0;
}

.skrupt-categories.skc-style-mosaic .skc-card__visual {
  align-self: center;
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  min-height: 0;
  min-width: 0;
}

.skrupt-categories.skc-style-mosaic .skc-card__visual--image {
  height: 100%;
  min-height: 96px;
  position: relative;
  width: 100%;
}

.skrupt-categories.skc-style-mosaic .skc-card__visual--image img {
  inset: 0;
  position: absolute;
}

.skrupt-categories.skc-style-mosaic .skc-card--text-only .skc-card__copy {
  grid-column: 1 / -1;
}

.skrupt-categories.skc-style-mosaic .skc-item:first-child .skc-card {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  min-height: calc(var(--skc-min-height) * 2 + var(--skc-gap));
}

.skrupt-categories.skc-style-mosaic .skc-item:first-child .skc-card__label {
  font-size: calc(var(--skc-label-size) * 1.35);
}

.skrupt-categories.skc-style-mosaic .skc-item:first-child .skc-card__visual {
  grid-column: 1;
  grid-row: 2;
}

.skrupt-categories.skc-style-mosaic .skc-item:first-child .skc-card__visual--image {
  min-height: 160px;
}

.skrupt-categories.skc-style-mosaic .skc-card__arrow,
.skrupt-categories.skc-style-chips .skc-card__arrow {
  --skc-arrow-shaft: 15px;
  --skc-arrow-head: 9px;
  border: 0;
  bottom: auto;
  color: var(--skc-icon-color);
  display: inline-block;
  flex: 0 0 auto;
  inset-inline-end: auto;
  position: relative;
  transform: none;
}

.skrupt-categories.skc-style-mosaic .skc-card__arrow {
  background: var(--vvp-ds-subtle, #eef0f2);
  border-radius: 50%;
  height: 44px;
  width: 44px;
}

.skrupt-categories.skc-style-mosaic .skc-card__arrow::before,
.skrupt-categories.skc-style-chips .skc-card__arrow::before {
  background: currentColor;
  content: "";
  height: 1.5px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  width: var(--skc-arrow-shaft);
}

.skrupt-categories.skc-style-mosaic .skc-card__arrow::after,
.skrupt-categories.skc-style-chips .skc-card__arrow::after {
  border: solid currentColor;
  border-width: 1.5px 1.5px 0 0;
  content: "";
  height: var(--skc-arrow-head);
  left: calc(50% - var(--skc-arrow-head) / 2 + 1px);
  position: absolute;
  top: calc(50% - var(--skc-arrow-head) / 2 - 1px);
  width: var(--skc-arrow-head);
}

.skrupt-categories.skc-style-chips {
  --skc-gap: 10px;
  --skc-radius: 999px;
  --skc-padding: 12px;
  --skc-min-height: 44px;
  --skc-title-size: 14px;
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.skrupt-categories.skc-style-chips .skc-title {
  flex: 0 0 auto;
  margin: 0;
  max-width: 100%;
  min-width: 0;
}

.skrupt-categories.skc-style-chips .skc-track {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  min-width: 0;
}

.skrupt-categories.skc-style-chips .skc-item {
  max-width: 100%;
}

.skrupt-categories.skc-style-chips .skc-card {
  align-items: center;
  border: 1px solid var(--vvp-ds-line, #dcdfe5);
  flex-direction: row;
  gap: 8px;
  padding: var(--skc-padding) calc(var(--skc-padding) + 4px);
}

.skrupt-categories.skc-style-chips .skc-card__label {
  font-weight: 400;
  min-width: 0;
  padding: 0;
}

.skrupt-categories.skc-style-chips .skc-card__arrow {
  --skc-arrow-shaft: 11px;
  --skc-arrow-head: 7px;
  color: var(--skc-title-color);
  height: 14px;
  width: 14px;
}

@media (min-width: 600px) and (max-width: 991px) {
  .skrupt-categories.skc-style-mosaic .skc-track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .skrupt-categories.skc-style-mosaic .skc-item:first-child,
  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(2),
  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(2n + 3):last-child {
    grid-column: 1 / -1;
  }
}

@media (min-width: 992px) {
  .skrupt-categories.skc-style-mosaic .skc-track {
    grid-template-columns: minmax(0, 1.57fr) repeat(2, minmax(0, 1fr));
  }

  .skrupt-categories.skc-style-mosaic .skc-item:first-child {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(2) {
    grid-column: 2 / span 2;
    grid-row: 1;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(2) .skc-card {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(4) {
    grid-column: 3;
    grid-row: 2;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:only-child {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(2):last-child {
    grid-row: 1 / span 2;
  }

  .skrupt-categories.skc-style-mosaic .skc-item:nth-child(3):last-child {
    grid-column: 2 / span 2;
  }
}

@media (min-width: 768px) {
  .skrupt-categories {
    --skc-columns: var(--skc-columns-tablet, 2);
  }

  .skrupt-categories.skc-style-chips {
    flex-direction: row;
  }

  .skrupt-categories.skc-style-chips .skc-title {
    max-width: 240px;
    padding: calc(var(--skc-padding) + 1px) 0;
  }
}

@media (min-width: 1200px) {
  .skrupt-categories {
    --skc-columns: var(--skc-columns-desktop, 2);
  }
}

@media (prefers-reduced-motion: reduce) {
  .skrupt-categories .skc-card {
    transition: none;
  }

  .skrupt-categories .skc-track {
    scroll-behavior: auto !important;
  }
}

@media (forced-colors: active) {
  .skrupt-categories .skc-card,
  .skrupt-categories .skc-control {
    border: 1px solid ButtonText;
  }

  .skrupt-categories .skc-card__visual--icon {
    background: none;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .skrupt-categories .skc-card__visual--icon img {
    visibility: visible;
  }

  .skrupt-categories .skc-dot[aria-current="true"] {
    outline: 1px solid ButtonText;
  }
}

/* Optional, list-specific description under the category label. */
.skrupt-categories .skc-card__description { display: block; margin-top: 6px; color: var(--vvp-ds-muted, #69758a); font-size: 13px; font-weight: 400; line-height: 1.5; overflow-wrap: anywhere; }


/* Theme-independent showcase geometry and optional shared slideshow. */
.skrupt-categories.skc-style-showcase { position: relative; isolation: isolate; }
.skrupt-categories.skc-style-showcase .skc-showcase-stage { position: relative; min-width: 0; }
.skrupt-categories.skc-style-showcase .skc-track { position: relative; z-index: 1; align-items: start; }
.skrupt-categories.skc-style-showcase .skc-item { align-self: stretch; }
.skrupt-categories.skc-style-showcase .skc-card { justify-content: flex-start; }
.skrupt-categories.skc-style-showcase .skc-item .skc-card__visual { position: relative; height: var(--skc-showcase-main); }
.skrupt-categories.skc-style-showcase .skc-card .skc-card__visual img { position: absolute; inset: auto auto 0 50%; width: auto; max-width: none; height: var(--skc-showcase-image); transform: translateX(-50%); transition: height 140ms ease-out; pointer-events: none; }
.skrupt-categories.skc-style-showcase .skc-item.is-featured .skc-card__visual img,
.skrupt-categories.skc-style-showcase .skc-track:not(:has(.is-featured)) .skc-item:first-child .skc-card__visual img { height: var(--skc-showcase-main); }
.skrupt-categories.skc-style-showcase .skc-card:is(:hover,:focus,:focus-visible) { outline: none; box-shadow: none; }
.skrupt-categories.skc-style-showcase .skc-card:focus-visible:not(:hover) .skc-card__label { text-decoration: underline; text-underline-offset: 4px; }
.skc-watermark-layer { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; user-select: none; }
.skc-watermark { position: absolute; display: inline-block; visibility: hidden; white-space: nowrap; font-weight: 700; line-height: 1; letter-spacing: -.04em; }
.skc-watermark.is-positioned { visibility: visible; animation: skc-watermark-in 200ms ease-out; }
/* 1.7.4: the watermark is placed by the script, so it shows last; it now fades in instead of appearing at once. The fade uses
   filter: opacity(), because the configured opacity is an inline style and themes may force it. Final state unchanged. */
@keyframes skc-watermark-in { from { filter: opacity(0); } to { filter: opacity(1); } }
@media (prefers-reduced-motion: reduce) { .skc-watermark.is-positioned { animation: none; } }
.skc-watermark img { display: block; width: 100%; height: auto; object-fit: contain; }
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase { --skc-carousel-enabled: 0; --skc-carousel-display: grid; --skc-carousel-overflow: visible; --skc-carousel-gap: 24px; }
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skc-track { display: var(--skc-carousel-display); overflow-x: var(--skc-carousel-overflow); overflow-y: hidden; gap: var(--skc-carousel-gap); scroll-snap-type: x mandatory; scroll-padding: 0; padding: 0; margin: 0; scrollbar-width: none; overscroll-behavior-x: contain; }
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skc-track::-webkit-scrollbar { display: none; }
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skc-item { box-sizing: border-box; flex: 0 0 var(--skc-carousel-basis,auto); width: var(--skc-carousel-basis,auto); max-width: var(--skc-carousel-basis,none); min-width: 0; padding: 0; scroll-snap-align: start; }
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skrupt-carousel__viewport { padding: 0; }
.skrupt-categories.skc-style-showcase .skc-shared-controls,
.skrupt-categories.skc-style-showcase .skc-shared-nav { display: none; }
.skrupt-categories.skc-style-showcase.skc-carousel-active[data-skrupt-ready] .skc-shared-controls { display: flex; }
.skrupt-categories.skc-style-showcase.skc-carousel-active[data-skrupt-ready] .skc-shared-nav { display: flex; }
.skrupt-categories.skc-style-showcase.skc-carousel-active .skc-carousel-top { justify-content: flex-end; gap: 8px; margin: 0 0 12px; }
.skrupt-categories.skc-style-showcase.skc-carousel-active .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 44px; }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skrupt-carousel--has-page-arrows .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 84px; }
.skrupt-categories.skc-style-showcase .skc-shared-controls[hidden] { display: none; }
/* 1.7.2: a gallery that scrolls on this format keeps the place of its controls until the shared engine is ready,
   so the content below does not move when they appear. */
@media (max-width:767.98px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not([data-skrupt-ready]) .skc-shared-controls:not([hidden]),
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not([data-skrupt-ready]) .skc-shared-nav { display: flex; visibility: hidden; }
}
@media (min-width:768px) and (max-width:1279.98px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not([data-skrupt-ready]) .skc-shared-controls:not([hidden]),
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not([data-skrupt-ready]) .skc-shared-nav { display: flex; visibility: hidden; }
}
@media (min-width:1280px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not([data-skrupt-ready]) .skc-shared-controls:not([hidden]),
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not([data-skrupt-ready]) .skc-shared-nav { display: flex; visibility: hidden; }
}
@media (min-width:1280px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"] { --skc-carousel-enabled: 1; --skc-carousel-display: flex; --skc-carousel-overflow: auto; --skc-carousel-gap: 0px; --skc-carousel-basis: calc(100% / var(--skc-carousel-items-desktop,4)); }
}
@media (min-width:768px) and (max-width:1279.98px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"] { --skc-carousel-enabled: 1; --skc-carousel-display: flex; --skc-carousel-overflow: auto; --skc-carousel-gap: 0px; --skc-carousel-basis: calc(100% / var(--skc-carousel-items-tablet,3)); }
}
@media (max-width:767.98px) {
  .skrupt-categories.skc-style-showcase { --skc-showcase-main: clamp(170px,58vw,240px); --skc-showcase-image: calc(var(--skc-showcase-main) * .55); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase { --skc-carousel-gap: 10px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"] { --skc-carousel-enabled: 1; --skc-carousel-display: flex; --skc-carousel-overflow: auto; --skc-carousel-gap: 0px; --skc-carousel-basis: 50%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skc-item { grid-row: auto; grid-column: auto; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase .skc-track { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .skrupt-categories.skc-style-showcase.skc-carousel-active .skc-card { padding-inline: 6px; }
  .skrupt-categories.skc-style-showcase.skc-carousel-active .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 36px; }
  .skrupt-categories.skc-style-showcase.skc-carousel-active.skrupt-carousel--has-page-arrows .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 60px; }
}
@media(prefers-reduced-motion:reduce) { .skrupt-categories.skc-style-showcase .skc-card .skc-card__visual img { transition: none; } }
.skrupt-categories.skc-style-showcase.skc-carousel-active .skc-card .skc-card__visual img { max-width: 100%; object-position: center bottom; }

/* Only centered view needs a trailing viewport; aligned view ends on its last full group. */
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .skc-track>.skc-item:last-child { flex-basis: 100%; width: 100%; max-width: 100%; }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .skc-track>.skc-item:last-child .skc-card { flex: 0 0 auto; width: var(--skc-carousel-basis,50%); margin-inline-start: 0; }
/* Keep native item offsets/snaps: shift only each card by half of its slot.
   The next image is then centered on the clipping edge, exactly half visible. */
.skrupt-categories.skc-style-showcase.skc-adaptive-showcase.skc-carousel-active.skc-view-centered { --skc-carousel-basis: 50%; }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .skc-card { transform: translateX(50%); }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered:dir(rtl) .skc-card { transform: translateX(-50%); }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-full-bleed .skc-showcase-stage { width: var(--skc-bleed-width,100%); margin-inline-start: var(--skc-bleed-offset,0px); }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-full-bleed .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 0; }

.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .skc-card__copy { opacity: 0; transition: opacity 140ms ease-out; }
.skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .is-featured .skc-card__copy { opacity: 1; }
@media(prefers-reduced-motion:reduce) { .skrupt-categories.skc-style-showcase.skc-carousel-active.skc-view-centered .skc-card__copy { transition: none; } }

/* 1.7.7: the gallery's state before its script runs. A gallery that scrolls on this format gets, from the HTML and this
   CSS alone, the geometry the script gives it with .skc-carousel-active (full width, card padding, centered view, arrow
   space): the track no longer moves when the script starts. Same values as the active rules above.
   1.7.8: the full width is --skc-cw, the page width without its scrollbar, set on <html> by the small observer printed
   before the first full-width gallery (categories.tpl), after the browser's layout and before its first paint. With an
   overlay scrollbar it equals 100vw, so the gallery is placed exactly as in 1.7.7; with a classic scrollbar (Windows,
   macOS "always show") it no longer overflows the page by the scrollbar width. 100vw cannot be used: it counts the
   scrollbar. Without the observer (no ResizeObserver), the gallery keeps its parent's width until the script runs. */
@media (max-width:767.98px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active) .skc-card .skc-card__visual img { max-width: 100%; object-position: center bottom; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active) .skc-carousel-top { justify-content: flex-end; gap: 8px; margin: 0 0 12px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active) .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 36px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active).skrupt-carousel--has-page-arrows .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 60px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active) .skc-card { padding-inline: 6px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] { --skc-carousel-basis: 50%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] .skc-track>.skc-item:last-child { flex-basis: 100%; width: 100%; max-width: 100%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] .skc-track>.skc-item:last-child .skc-card { flex: 0 0 auto; width: var(--skc-carousel-basis,50%); margin-inline-start: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] .skc-card { transform: translateX(50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"]:dir(rtl) .skc-card { transform: translateX(-50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] .skc-card__copy { opacity: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-view-mobile="centered"] .skc-item:first-child .skc-card__copy { opacity: 1; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage { width: var(--skc-cw, 100%); margin-inline-start: calc(50% - var(--skc-cw, 100%) / 2); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-mobile="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 0; }
}
@media (min-width:768px) and (max-width:1279.98px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active) .skc-card .skc-card__visual img { max-width: 100%; object-position: center bottom; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active) .skc-carousel-top { justify-content: flex-end; gap: 8px; margin: 0 0 12px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active) .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 44px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active).skrupt-carousel--has-page-arrows .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 84px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] { --skc-carousel-basis: 50%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] .skc-track>.skc-item:last-child { flex-basis: 100%; width: 100%; max-width: 100%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] .skc-track>.skc-item:last-child .skc-card { flex: 0 0 auto; width: var(--skc-carousel-basis,50%); margin-inline-start: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] .skc-card { transform: translateX(50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"]:dir(rtl) .skc-card { transform: translateX(-50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] .skc-card__copy { opacity: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-view-tablet="centered"] .skc-item:first-child .skc-card__copy { opacity: 1; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage { width: var(--skc-cw, 100%); margin-inline-start: calc(50% - var(--skc-cw, 100%) / 2); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-tablet="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 0; }
}
@media (min-width:1280px) {
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active) .skc-card .skc-card__visual img { max-width: 100%; object-position: center bottom; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active) .skc-carousel-top { justify-content: flex-end; gap: 8px; margin: 0 0 12px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active) .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 44px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active).skrupt-carousel--has-page-arrows .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 84px; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] { --skc-carousel-basis: 50%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] .skc-track>.skc-item:last-child { flex-basis: 100%; width: 100%; max-width: 100%; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] .skc-track>.skc-item:last-child .skc-card { flex: 0 0 auto; width: var(--skc-carousel-basis,50%); margin-inline-start: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] .skc-card { transform: translateX(50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"]:dir(rtl) .skc-card { transform: translateX(-50%); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] .skc-card__copy { opacity: 0; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-view-desktop="centered"] .skc-item:first-child .skc-card__copy { opacity: 1; }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage { width: var(--skc-cw, 100%); margin-inline-start: calc(50% - var(--skc-cw, 100%) / 2); }
  .skrupt-categories.skc-style-showcase.skc-adaptive-showcase[data-skc-carousel-desktop="1"]:not(.skc-carousel-active)[data-skc-full-bleed="1"] .skc-showcase-stage:has(>.skc-shared-nav) { padding-inline: 0; }
}