.produto-card {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  border-radius: 1.15rem;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  font-family: 'Geist', 'Geist Reserva', 'Geist Reserva R', system-ui, sans-serif;
  cursor: pointer;
  background: rgb(28 28 33);
  border: 1px solid rgb(255 255 255 / 0.07);
  background-origin: border-box;
  box-shadow: 0 10px 28px -16px rgb(0 0 0 / 0.8);
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}

.produto-card:focus-visible {
  outline: none;
  border-color: rgb(var(--primary) / 0.8);
  box-shadow: 0 0 0 3px rgb(var(--primary) / 0.35);
}

.produto-card__arte {
  position: relative;
  width: 100%;
  aspect-ratio: var(--arte-ratio, 12 / 17);
  overflow: hidden;
  flex-shrink: 0;
  background: rgb(var(--muted-solid));
}

.produto-card__img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), filter 0.4s ease;
}

.produto-card__img.is-cobrir {
  object-fit: cover;
}

.produto-card__arte.tem-fundo::before {
  content: "";
  position: absolute;
  inset: -12%;
  z-index: 0;
  background: var(--arte-fundo) center / cover no-repeat;
  filter: blur(18px) brightness(0.55) saturate(1.2);
  pointer-events: none;
}

.produto-card__arte::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  z-index: 2;
  height: 32%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgb(28 28 33 / 0.55));
}

.produto-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  padding: 2.5px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(160deg, #e6d4ff 0%, rgb(var(--grad-fim)) 45%, rgb(var(--grad-ini)) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.produto-card.is-esgotado .produto-card__img {
  filter: grayscale(0.7) brightness(0.8);
  opacity: 0.6;
}

.produto-card__esgotado {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 4;
  transform: translate(-50%, -50%);
  padding: 0.3rem 0.75rem;
  border-radius: var(--radius-pill);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
  background: rgb(0 0 0 / 0.72);
}

.produto-card__corpo {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 0.22rem;
  min-width: 0;
  padding: 0.6rem 0.7rem 0.7rem;
}

.produto-card__nome {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: -0.01em;
  min-height: 2.44em;
  color: #fff;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.produto-card__precos {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0;
  margin-top: auto;
  padding-top: 0.15rem;
}

.produto-card__linha-de {
  display: flex;
  min-height: 0.92rem;
  align-items: baseline;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.produto-card__rotulo {
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.2;
  text-transform: uppercase;
  color: rgb(var(--muted-foreground));
}

.produto-card__de {
  font-size: 0.6875rem;
  line-height: 1.2;
  text-decoration: line-through;
  color: rgb(var(--muted-foreground));
}

.produto-card__linha-preco {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.produto-card__off {
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.42rem;
  border-radius: 0.4rem;
  font-size: 0.6875rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  color: #fff;
  background-image: linear-gradient(99deg, #9b5cff, #4f7dff);
}

.produto-card__preco {
  font-size: 1.125rem;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #fff;
  white-space: nowrap;
}

.produto-card__pix {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.625rem;
  line-height: 1.2;
  color: rgb(var(--muted-foreground));
}

.produto-card__pix .ico-pix {
  width: 0.72rem;
  height: 0.72rem;
}

.produto-card__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  height: 2.3rem;
  margin-top: 0.45rem;
  border-radius: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 800;
  color: #fff;
  background-image:
    linear-gradient(180deg, rgb(255 255 255 / 0.16) 0%, rgb(255 255 255 / 0) 55%),
    linear-gradient(110deg, rgb(var(--grad-ini)) 0%, rgb(var(--grad-fim)) 50%, rgb(var(--grad-ini)) 100%);
  background-size: 100% 100%, 220% 100%;
  background-position: 0 0, 0% 50%;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.22), 0 8px 20px -12px rgb(var(--primary) / 0.9);
  transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s ease;
}

.produto-card__cta svg,
.produto-card__cta i {
  width: 1rem;
  height: 1rem;
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.produto-card.is-esgotado .produto-card__cta {
  color: rgb(var(--muted-foreground));
  background-image: none;
  background-color: rgb(var(--botao-escuro));
  box-shadow: none;
}

@media (hover: hover) and (pointer: fine) {
  .produto-card:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 0.14),
      0 0 26px -6px rgb(var(--primary) / 0.85),
      0 26px 44px -22px rgb(0 0 0 / 0.95);
  }

  .produto-card:hover::after {
    opacity: 1;
  }

  .produto-card:hover .produto-card__img {
    transform: scale(1.1);
  }

  .produto-card:hover .produto-card__cta {
    background-position: 0 0, 100% 50%;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.25), 0 10px 24px -8px rgb(var(--primary) / 0.85);
  }

  .produto-card:hover .produto-card__cta svg,
  .produto-card:hover .produto-card__cta i {
    transform: translateX(3px);
  }

  .produto-card.is-esgotado:hover {
    transform: none;
  }
}

.produto-card:active {
  transform: scale(0.985);
}

.produto-card--compact .produto-card__corpo {
  padding: 0.6rem 0.65rem 0.7rem;
}

.produto-card--compact .produto-card__nome {
  font-size: 0.8125rem;
}

.produto-card--compact .produto-card__preco {
  font-size: 0.95rem;
}

.produto-card--compact .produto-card__cta {
  height: 2.1rem;
}

@media (min-width: 640px) {
  .produto-card__corpo { padding: 0.7rem 0.85rem 0.85rem; }
  .produto-card__nome { font-size: 0.9rem; }
  .produto-card__preco { font-size: 1.25rem; }
  .produto-card__de { font-size: 0.75rem; }
  .produto-card__pix { font-size: 0.6875rem; }
  .produto-card__cta { height: 2.4rem; font-size: 0.875rem; }
}

@media (max-width: 639px) {
  .produto-card__nome { font-size: 0.8125rem; }
  .produto-card__preco { font-size: 1.02rem; }
  .produto-card__cta { height: 2.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .produto-card,
  .produto-card__cta,
  .produto-card__cta svg,
  .produto-card__cta i {
    transition: none;
  }

  .produto-card:active {
    transform: none;
  }
}

.package-list,
.category-grid {
  align-items: stretch;
}

.package-list > .reveal-fade-up,
.category-grid > .reveal-fade-up {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.package-list > .reveal-fade-up > .produto-card,
.category-grid > .reveal-fade-up > .produto-card {
  width: calc(100% - var(--faixa-lado, 0px));
  min-width: 0;
  max-width: calc(100% - var(--faixa-lado, 0px));
  height: 100%;
  flex: 1 1 auto;
}

.category-page .category-grid,
.package-list {
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .category-page .category-grid,
  .package-list:not(.category-preview) {
    gap: 0.875rem;
  }
}

@media (max-width: 767px) {
  .produto-card,
  .produto-card:active,
  .produto-card:hover {
    -webkit-tap-highlight-color: transparent;
  }

  #store,
  #categories-container {
    overflow-x: clip;
    max-width: 100%;
  }

  .category-preview-wrap {
    width: 100%;
    max-width: 100%;
  }

  .category-preview-viewport {
    width: 100%;
    min-width: 0;
  }

  .package-list.category-preview {
    --category-card-width: calc((100% - 0.75rem) / 2.15);
    display: flex !important;
    gap: 0.75rem !important;
    margin: -0.5rem -1rem -1.5rem;
    padding: 0.5rem 1rem 1.5rem;
    scroll-padding-inline: 1rem;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .package-list.category-preview::-webkit-scrollbar {
    display: none;
  }

  .package-list.category-preview > .reveal-fade-up {
    flex: 0 0 var(--category-card-width);
    width: var(--category-card-width);
    max-width: var(--category-card-width);
    height: auto;
    scroll-snap-align: start;
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
  }
}

.produto-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.6rem;
}

@media (min-width: 768px) {
  .category-preview-wrap {
    overflow: visible;
  }

  .category-preview-slider {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    overflow: visible;
  }

  .category-preview-viewport {
    overflow: visible;
    padding-top: 0.85rem;
    padding-bottom: 1.1rem;
  }

  .package-list.category-preview,
  .category-page .category-grid {
    gap: 1.5rem;
    --category-slide-gap: 1.5rem;
  }

  .package-list.category-preview {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: visible;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding: 0.85rem 0.35rem 2.5rem;
    margin: -0.85rem 0 -2.5rem;
  }

  .package-list.category-preview::-webkit-scrollbar {
    display: none;
  }

  .package-list.category-preview > .reveal-fade-up {
    flex: 0 0 calc((100% - (4 * var(--category-slide-gap, 1.5rem))) / 5);
    width: calc((100% - (4 * var(--category-slide-gap, 1.5rem))) / 5);
    max-width: calc((100% - (4 * var(--category-slide-gap, 1.5rem))) / 5);
    position: relative;
    z-index: 1;
    overflow: visible;
  }

  .package-list.category-preview > .reveal-fade-up:hover {
    z-index: 20;
  }

}

@media (min-width: 1024px) {
  .package-list.category-preview,
  .category-page .category-grid {
    gap: 1.75rem;
    --category-slide-gap: 1.75rem;
  }
}

.banner-prod {
  --banner-cor: rgb(var(--primary));

  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 1rem;
  min-height: 9.5rem;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  background: rgb(var(--card));
  border: 1px solid color-mix(in srgb, var(--banner-cor) 55%, transparent);
  box-shadow: 0 6px 20px -8px color-mix(in srgb, var(--banner-cor) 45%, transparent);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.banner-prod__fundo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  transition: transform 0.35s ease;
}

.banner-prod:not(.banner-prod--limpo):has(> .banner-prod__fundo)::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    to top,
    rgb(0 0 0 / 0.55) 0%,
    rgb(0 0 0 / 0.18) 32%,
    rgb(0 0 0 / 0) 58%
  );
}

.banner-prod__conteudo {
  position: relative;
  z-index: 1;
  margin-top: auto;
  padding: 0.7rem 0.75rem 0.75rem;
}

.banner-prod__planos {
  position: absolute;
  left: 0.5rem;
  bottom: 0.5rem;
  z-index: 1;
  margin-top: 0;
  display: inline-flex;
  align-items: stretch;
  border-radius: 0.5rem;
  overflow: hidden;
  background: rgb(0 0 0 / 0.55);
}

.banner-prod__plano {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.3rem 0.6rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: rgb(255 255 255 / 0.85);
  cursor: pointer;
  transition: color 0.18s ease, background-color 0.18s ease;
}

.banner-prod__plano + .banner-prod__plano::before {
  content: '';
  position: absolute;
  left: 0;
  top: 22%;
  bottom: 22%;
  width: 1px;
  background: rgb(255 255 255 / 0.18);
}

.banner-prod__plano.is-ativo {
  color: #fff;
  box-shadow: inset 0 -2px 0 0 var(--banner-cor);
}

@media (hover: hover) and (pointer: fine) {
  .banner-prod__plano:hover {
    color: #fff;
    background: rgb(255 255 255 / 0.08);
  }
}

.banner-prod__plano:focus-visible {
  outline: 2px solid var(--banner-cor);
  outline-offset: -2px;
}

.banner-prod--limpo {
  min-height: 0;
  border: 0;
  box-shadow: 0 10px 28px -16px rgb(0 0 0 / 0.8);
}

.banner-prod__arte {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1920 / 551;
  container-type: inline-size;
}

.banner-prod.banner-prod--limpo {
  --faixa-lado: clamp(1.6rem, 2.4vw, 2.1rem);
  min-height: 0;
}

.banner-prod--limpo > .banner-prod__arte {
  margin-right: var(--faixa-lado);
}

.banner-prod--limpo > .faixa {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--faixa-lado);
  min-height: 0;
  padding: 0.3rem 0;
  gap: 0.25rem;
  overflow: hidden;
  font-size: clamp(0.5rem, 1.05vw, 0.66rem);
  letter-spacing: 0.02em;
  writing-mode: vertical-rl;
  box-shadow: inset 1px 0 0 rgb(255 255 255 / 0.12);
}

.banner-prod--limpo > .faixa .faixa__marca,
.banner-prod--limpo > .faixa svg,
.banner-prod--limpo > .faixa i {
  width: 0.8rem;
  height: 0.8rem;
  transform: rotate(90deg);
}

.banner-prod__info {
  position: absolute;
  top: 54%;
  right: 1.6%;
  bottom: 6%;
  left: 76.2%;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.1cqw;
  pointer-events: none;
}

.banner-prod__preco {
  font-size: clamp(0.72rem, 3.5cqw, 2rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
  white-space: nowrap;
  color: #fff;
}

.banner-prod__assinar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.7cqw;
  width: 100%;
  padding: 1.15cqw 0;
  border-radius: 999px;
  font-size: clamp(0.56rem, 1.85cqw, 1rem);
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
  color: #fff;
  background: linear-gradient(120deg, #9b5cff, #4f7dff);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.22);
  transition: filter 0.2s ease;
}

.banner-prod__assinar svg,
.banner-prod__assinar i {
  width: 1.1em;
  height: 1.1em;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.banner-prod.is-esgotado .banner-prod__assinar {
  filter: grayscale(1);
  opacity: 0.7;
}

@container (max-width: 250px) {
  .banner-prod__info {
    top: 52%;
    bottom: 4%;
    gap: 1cqw;
  }

  .banner-prod__preco {
    font-size: 4.6cqw;
  }

  .banner-prod__assinar {
    padding: 0.8cqw 0;
    font-size: 4cqw;
  }

  .banner-prod__assinar span {
    display: none;
  }

  .banner-prod.banner-prod--limpo .banner-prod__plano {
    padding: 0.8cqw 1.4cqw;
    font-size: 3.4cqw;
  }
}

.banner-prod--limpo .banner-prod__planos {
  left: 2cqw;
  bottom: 3cqw;
  border-radius: 1.6cqw;
}

.banner-prod--limpo .banner-prod__plano {
  padding: 1cqw 2cqw;
  font-size: clamp(0.55rem, 1.9cqw, 0.78rem);
}

@media (hover: hover) and (pointer: fine) {
  .banner-prod--limpo:hover {
    box-shadow: 0 16px 34px -14px rgb(0 0 0 / 0.9);
  }

  .banner-prod--limpo:hover .banner-prod__assinar {
    filter: brightness(1.12);
  }

  .banner-prod--limpo:hover .banner-prod__assinar svg {
    transform: translateX(2px);
  }
}

.banner-prod__esgotado {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  z-index: 2;
  padding: 0.24rem 0.55rem;
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  background: rgb(0 0 0 / 0.7);
}

.banner-prod.is-esgotado .banner-prod__fundo {
  filter: grayscale(0.75) brightness(0.7);
}

.banner-prod__opcoes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.banner-prod__opcao {
  padding: 0.32rem 0.72rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  color: #fff;
  background: rgb(0 0 0 / 0.55);
  border: 1px solid rgb(255 255 255 / 0.3);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  text-shadow: 0 1px 2px rgb(0 0 0 / 0.5);
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .banner-prod:hover {
    transform: translateY(-3px);
    border-color: var(--banner-cor);
    box-shadow: 0 12px 28px -8px color-mix(in srgb, var(--banner-cor) 60%, transparent);
  }

  .banner-prod:hover .banner-prod__fundo {
    transform: scale(1.05);
  }

  .banner-prod__opcao:hover {
    color: #fff;
    background: var(--banner-cor);
    border-color: var(--banner-cor);
  }
}

.banner-prod:focus-visible,
.banner-prod__opcao:focus-visible {
  outline: 2px solid var(--banner-cor);
  outline-offset: 2px;
}

@media (min-width: 768px) {
  .banner-prod { min-height: 11rem; }
}

.package-list.category-preview:has(.banner-prod) {
  align-items: stretch;
}

@media (min-width: 768px) {
  .package-list.category-preview:has(.banner-prod) {
    flex-wrap: wrap;
    justify-content: center;
    overflow: visible;
    scroll-snap-type: none;
  }

  .package-list.category-preview:has(.banner-prod) > .reveal-fade-up {
    flex: 0 0 calc((100% - var(--category-slide-gap, 1.5rem)) / 2);
    width: calc((100% - var(--category-slide-gap, 1.5rem)) / 2);
    max-width: calc((100% - var(--category-slide-gap, 1.5rem)) / 2);
    margin: 0 !important;
  }
}

@media (max-width: 767px) {
  .package-list.category-preview:has(.banner-prod) {
    display: flex !important;
    flex-direction: column;
    gap: 0.65rem !important;
    margin: 0;
    padding: 0;
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .package-list.category-preview:has(.banner-prod) > .reveal-fade-up {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .banner-prod { transition: none; }
}

.secao-tema__grade,
.category-page .category-grid {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: var(--gap) !important;
}

.secao-tema__grade > *,
.category-page .category-grid > * {
  flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  max-width: calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  min-width: 0;
}

.category-page .category-grid {
  --cols: 2;
  --gap: 0.75rem;
}

@media (min-width: 640px) {
  .category-page .category-grid {
    --gap: 0.875rem;
  }
}

@media (min-width: 768px) {
  .category-page .category-grid {
    --cols: 3;
    --gap: 1.5rem;
  }

  .package-list.category-preview > .reveal-fade-up:first-child {
    margin-left: auto;
  }

  .package-list.category-preview > .reveal-fade-up:last-child {
    margin-right: auto;
  }
}

@media (min-width: 1024px) {
  .category-page .category-grid {
    --cols: 4;
    --gap: 1.75rem;
  }
}

@media (min-width: 1280px) {
  .category-page .category-grid {
    --cols: 5;
  }
}

.category-grid:has(.banner-prod),
.category-grid--banner {
  --cols: 1;
  --gap: 0.65rem;
}

@media (min-width: 768px) {
  .category-grid:has(.banner-prod),
  .category-grid--banner {
    --cols: 2;
    --gap: 1.1rem;
  }
}

.similares {
  position: relative;
  margin-top: 3rem;
}

.similares__trilho {
  display: flex;
  gap: 0.75rem;
  margin: 0 -1rem;
  padding: 0.5rem 1rem 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 1rem;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}

.similares__trilho::-webkit-scrollbar {
  display: none;
}

.similares__item {
  display: flex;
  flex: 0 0 calc((100% - 0.75rem) / 2.15);
  min-width: 0;
  scroll-snap-align: start;
}

.similares__item > .produto-card {
  flex: 1 1 auto;
}

.similares__seta {
  position: absolute;
  top: 50%;
  z-index: 8;
  display: none;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 999px;
  color: #fff;
  background: rgb(var(--card) / 0.9);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.08), 0 10px 24px -10px rgb(0 0 0 / 0.9);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: opacity .2s ease, background-color .2s ease;
}

.similares__seta:hover {
  background: rgb(var(--primary));
}

.similares__seta:disabled {
  opacity: 0;
  pointer-events: none;
}

.similares__seta--ant {
  left: -1.3rem;
}

.similares__seta--prox {
  right: -1.3rem;
}

.similares__seta svg,
.similares__seta i {
  width: 1.2rem;
  height: 1.2rem;
}

@media (min-width: 768px) {
  .similares__trilho {
    gap: 1rem;
    margin: 0 -0.5rem;
    padding: 0.85rem 0.5rem 2.5rem;
    scroll-padding-inline: 0.5rem;
  }

  .similares__item {
    flex-basis: calc((100% - 2rem) / 3);
  }

  .similares__seta {
    display: inline-flex;
  }
}

@media (min-width: 1024px) {
  .similares__item {
    flex-basis: calc((100% - 4rem) / 5);
  }
}

.faixa {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 1.9rem;
  padding: 0.35rem 0.75rem;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;
  background: var(--faixa-fundo, linear-gradient(110deg, rgb(var(--grad-ini)), rgb(var(--grad-fim))));
  box-shadow: inset 0 -1px 0 rgb(255 255 255 / 0.12), inset 0 1px 0 rgb(255 255 255 / 0.12);
}

.faixa__nome {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 639px) {
  .faixa {
    gap: 0.3rem;
    padding-inline: 0.5rem;
    font-size: 0.6rem;
    letter-spacing: 0.04em;
  }
}

.faixa svg,
.faixa i,
.faixa__marca {
  width: 0.95rem;
  height: 0.95rem;
  flex-shrink: 0;
}

.faixa__marca {
  background: currentColor;
  -webkit-mask: var(--faixa-icone) center / contain no-repeat;
  mask: var(--faixa-icone) center / contain no-repeat;
}

.faixa--tiktok .faixa__marca {
  filter: drop-shadow(1px 0 0 #fe2c55) drop-shadow(-1px 0 0 #25f4ee);
}

.faixa--instagram {
  --faixa-fundo: linear-gradient(110deg, #5b2bb5, #c1307a 55%, #f0833a);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M7.0301.084c-1.2768.0602-2.1487.264-2.911.5634-.7888.3075-1.4575.72-2.1228 1.3877-.6652.6677-1.075 1.3368-1.3802 2.127-.2954.7638-.4956 1.6365-.552 2.914-.0564 1.2775-.0689 1.6882-.0626 4.947.0062 3.2586.0206 3.6671.0825 4.9473.061 1.2765.264 2.1482.5635 2.9107.308.7889.72 1.4573 1.388 2.1228.6679.6655 1.3365 1.0743 2.1285 1.38.7632.295 1.6361.4961 2.9134.552 1.2773.056 1.6884.069 4.9462.0627 3.2578-.0062 3.668-.0207 4.9478-.0814 1.28-.0607 2.147-.2652 2.9098-.5633.7889-.3086 1.4578-.72 2.1228-1.3881.665-.6682 1.0745-1.3378 1.3795-2.1284.2957-.7632.4966-1.636.552-2.9124.056-1.2809.0692-1.6898.063-4.948-.0063-3.2583-.021-3.6668-.0817-4.9465-.0607-1.2797-.264-2.1487-.5633-2.9117-.3084-.7889-.72-1.4568-1.3876-2.1228C21.2982 1.33 20.628.9208 19.8378.6165 19.074.321 18.2017.1197 16.9244.0645 15.6471.0093 15.236-.005 11.977.0014 8.718.0076 8.31.0215 7.0301.0839m.1402 21.6932c-1.17-.0509-1.8053-.2453-2.2287-.408-.5606-.216-.96-.4771-1.3819-.895-.422-.4178-.6811-.8186-.9-1.378-.1644-.4234-.3624-1.058-.4171-2.228-.0595-1.2645-.072-1.6442-.079-4.848-.007-3.2037.0053-3.583.0607-4.848.05-1.169.2456-1.805.408-2.2282.216-.5613.4762-.96.895-1.3816.4188-.4217.8184-.6814 1.3783-.9003.423-.1651 1.0575-.3614 2.227-.4171 1.2655-.06 1.6447-.072 4.848-.079 3.2033-.007 3.5835.005 4.8495.0608 1.169.0508 1.8053.2445 2.228.408.5608.216.96.4754 1.3816.895.4217.4194.6816.8176.9005 1.3787.1653.4217.3617 1.056.4169 2.2263.0602 1.2655.0739 1.645.0796 4.848.0058 3.203-.0055 3.5834-.061 4.848-.051 1.17-.245 1.8055-.408 2.2294-.216.5604-.4763.96-.8954 1.3814-.419.4215-.8181.6811-1.3783.9-.4224.1649-1.0577.3617-2.2262.4174-1.2656.0595-1.6448.072-4.8493.079-3.2045.007-3.5825-.006-4.848-.0608M16.953 5.5864A1.44 1.44 0 1 0 18.39 4.144a1.44 1.44 0 0 0-1.437 1.4424M5.8385 12.012c.0067 3.4032 2.7706 6.1557 6.173 6.1493 3.4026-.0065 6.157-2.7701 6.1506-6.1733-.0065-3.4032-2.771-6.1565-6.174-6.1498-3.403.0067-6.156 2.771-6.1496 6.1738M8 12.0077a4 4 0 1 1 4.008 3.9921A3.9996 3.9996 0 0 1 8 12.0077%22/%3E%3C/svg%3E");
}

.faixa--tiktok {
  --faixa-fundo: linear-gradient(110deg, #0d0d12, #1d1d26);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z%22/%3E%3C/svg%3E");
}

.faixa--youtube {
  --faixa-fundo: linear-gradient(110deg, #b3121a, #ff2d2d);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z%22/%3E%3C/svg%3E");
}

.faixa--netflix {
  --faixa-fundo: linear-gradient(110deg, #9b050c, #e50914);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22m5.398 0 8.348 23.602c2.346.059 4.856.398 4.856.398L10.113 0H5.398zm8.489 0v9.172l4.715 13.33V0h-4.715zM5.398 1.5V24c1.873-.225 2.81-.312 4.715-.398V14.83L5.398 1.5z%22/%3E%3C/svg%3E");
}

.faixa--disney {
  --faixa-fundo: linear-gradient(110deg, #0e2a78, #1f55b3);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3.22 5.838C1.913 5.688 2 5.26 2 5.044S2.424 4 6.34 4C11.034 4 21 7.645 21 14.042s-8.71 4.931-10.435 4.52S5 16.306 5 14.388C5 12.993 8.08 12 11.715 12S17 13.041 17 14c0 .5-.074 1.229-1 1.5'/%3E%3Cpath d='M10.02 8a505 505 0 0 0 0 13'/%3E%3C/g%3E%3C/svg%3E");
}

.faixa--hbo {
  --faixa-fundo: linear-gradient(110deg, #1a2bd8, #6a2ee0);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M7.042 16.896H4.414v-3.754H2.708v3.754H.01L0 7.22h2.708v3.6h1.706v-3.6h2.628zm12.043.046C21.795 16.94 24 14.689 24 11.978a4.89 4.89 0 0 0-4.915-4.92c-2.707-.002-4.09 1.991-4.432 2.795.003-1.207-1.187-2.632-2.58-2.634H7.59v9.674l4.181.001c1.686 0 2.886-1.46 2.888-2.713.385.788 1.72 2.762 4.427 2.76zm-7.665-3.936c.387 0 .692.382.692.817 0 .435-.305.817-.692.817h-1.33v-1.634zm.005-3.633c.387 0 .692.382.692.817 0 .436-.305.818-.692.818h-1.33V9.373zm1.77 2.607c.305-.039.813-.387.992-.61-.063.276-.068 1.074.006 1.35-.204-.314-.688-.701-.998-.74zm3.43 0a2.462 2.462 0 1 1 4.924 0 2.462 2.462 0 0 1-4.925 0zm2.462 1.936a1.936 1.936 0 1 0 0-3.872 1.936 1.936 0 0 0 0 3.872Z%22/%3E%3C/svg%3E");
}

.faixa--crunchyroll {
  --faixa-fundo: linear-gradient(110deg, #d9571a, #f78b2d);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M2.909 13.436C2.914 7.61 7.642 2.893 13.468 2.898c5.576.005 10.137 4.339 10.51 9.819q.021-.351.022-.706C24.007 5.385 18.64.006 12.012 0S.007 5.36 0 11.988 5.36 23.994 11.988 24q.412 0 .815-.027c-5.526-.338-9.9-4.928-9.894-10.538Zm16.284.155a4.1 4.1 0 0 1-4.095-4.103 4.1 4.1 0 0 1 2.712-3.855 8.95 8.95 0 0 0-4.187-1.037 9.007 9.007 0 1 0 8.997 9.016q-.001-.847-.15-1.651a4.1 4.1 0 0 1-3.278 1.63Z%22/%3E%3C/svg%3E");
}

.faixa--paramount {
  --faixa-fundo: linear-gradient(110deg, #0a3d91, #0064ff);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M16.347 21.373c.057-.084.151-.314-.025-.74l-.53-1.428c-.073-.182.084-.293.19-.173 0 0 1.004 1.157 1.264 1.64l.495.822c.425.028 1.6.06 2.732.06a3.26 3.26 0 0 1-.316-.364c-1.93-2.392-3.154-3.724-3.166-3.737-.391-.426-.572-.508-.87-.643a4.82 4.82 0 0 1-.138-.065v.364c0 .047-.057.073-.086.022l-2.846-5.001a1.598 1.598 0 0 0-.508-.587l-.277-.194-1.354 3.123c.212 0 .354.216.27.409l-1.25 2.893h1.147c.443 0 .883.087 1.294.255l.302.125s-.913 1.878-.913 2.867c0 .181.028.362.075.534h2.104l-.096-.595s1.266.294 2.502.413M12 2.437c-6.627 0-12 5.373-12 12 0 2.669.873 5.133 2.346 7.126.503-.218.783-.542.983-.791l2.234-2.858a.467.467 0 0 1 .179-.138l.336-.146 3.674-4.659.534-.417 1.094-1.524a.482.482 0 0 1 .101-.102l.478-.347a.34.34 0 0 1 .398-.004l.578.407c.308.216.557.504.726.84l2.322 4.077c.051.09.09.129.182.174.454.227.732.268 1.33.913.277.304 1.495 1.666 3.203 3.784.236.318.538.588.963.783A11.948 11.948 0 0 0 24 14.437c0-6.627-5.373-12-12-12M3.236 15.1l-.778-.253-.48.662v-.818l-.778-.253.778-.253v-.818l.48.662.778-.253-.48.662Zm-.185 2.676-.252.778-.253-.778h-.818l.661-.481-.253-.777.663.48.66-.48-.252.777.662.481Zm.156-6.195.253.778-.661-.48-.663.48.253-.778-.66-.48h.817l.253-.778.252.777h.818Zm1.314-1.76L4.04 9.16l-.778.253.48-.661-.48-.663.778.254.48-.662v.818l.778.253-.777.252Zm2.045-2.862-.253.777-.252-.777h-.818l.662-.48-.253-.778.661.48.661-.48-.252.777.662.48Zm2.577-1.313-.48.661V5.49l-.779-.254.778-.253v-.817l.48.66.78-.253-.481.663.48.66zm3.265-.75.253.778-.661-.48-.662.48.252-.777-.66-.481h.818L12 3.637l.252.778h.818zm2.93.595v.816l-.481-.661-.777.252.48-.662-.48-.662.777.253.48-.66v.817l.779.252zm5.426 8.285.778.253.48-.662v.818l.778.253-.778.253v.818l-.48-.662-.778.253.48-.662zm-3.077-6.04-.253-.777h-.818l.662-.48-.253-.778.662.48.662-.48-.254.778.662.48h-.818zm1.792 2.086v-.818l-.777-.252.777-.253V7.68l.481.662.777-.254-.48.663.48.66-.777-.252zm1.469 1.278.253-.777.254.777h.816l-.66.481.252.778-.662-.48-.661.48.253-.778-.662-.48zm.506 6.676-.253.778-.253-.778h-.817l.662-.481-.253-.777.66.48.663-.48-.253.777.661.481zm-12.08-.615.76-1.588c.024-.048-.032-.108-.067-.067l-.664.668c-.313.329-.847 1.25-.95 1.421l-.808 1.335a.109.109 0 0 1 .1.162l-.739 1.238c-.18.309.145.523.189.452 1.157-1.868 1.832-1.719 1.832-1.719l.387-.897c.022-.047-.001-.1-.05-.12-.12-.05-.316-.27.01-.885z%22/%3E%3C/svg%3E");
}

.faixa--appletv {
  --faixa-fundo: linear-gradient(110deg, #0c0c0f, #2a2a31);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M12.152 6.896c-.948 0-2.415-1.078-3.96-1.04-2.04.027-3.91 1.183-4.961 3.014-2.117 3.675-.546 9.103 1.519 12.09 1.013 1.454 2.208 3.09 3.792 3.039 1.52-.065 2.09-.987 3.935-.987 1.831 0 2.35.987 3.96.948 1.637-.026 2.676-1.48 3.676-2.948 1.156-1.688 1.636-3.325 1.662-3.415-.039-.013-3.182-1.221-3.22-4.857-.026-3.04 2.48-4.494 2.597-4.559-1.429-2.09-3.623-2.324-4.39-2.376-2-.156-3.675 1.09-4.61 1.09zM15.53 3.83c.843-1.012 1.4-2.427 1.245-3.83-1.207.052-2.662.805-3.532 1.818-.78.896-1.454 2.338-1.273 3.714 1.338.104 2.715-.688 3.559-1.701%22/%3E%3C/svg%3E");
}

.faixa--spotify {
  --faixa-fundo: linear-gradient(110deg, #0f6e33, #1db954);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z%22/%3E%3C/svg%3E");
}

.faixa--capcut {
  --faixa-icone: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22white%22 fill-rule=%22evenodd%22 d=%22M24.189 6.442V2.671l-4.535 2.383V4.91c.002-1.505-1.078-2.411-2.638-2.411H2.64C.993 2.5 0 3.407 0 4.91v3.81L6.354 12L0 15.316v3.8C0 20.595 1 21.5 2.64 21.5h14.373c1.56 0 2.639-.907 2.639-2.382v-.197l4.536 2.409v-3.828L13.64 12l10.55-5.557zM9.982 13.873l7.797 4.083H2.157zm7.741-7.828l-7.742 4.057l-7.825-4.057z%22/%3E%3C/svg%3E");
  --faixa-fundo: linear-gradient(110deg, #101014, #2c2c36);
}

.faixa--chatgpt {
  --faixa-fundo: linear-gradient(110deg, #0a5e4a, #10a37f);
}

.faixa--canva {
  --faixa-fundo: linear-gradient(110deg, #00a3b4, #7d2ae8);
}

.faixa--utilitarios {
  --faixa-fundo: linear-gradient(110deg, #0f766e, #14b8a6);
}

.faixa--combo {
  --faixa-fundo: linear-gradient(160deg, #e50914 0%, #7b2ff7 55%, #113ccf 100%);
}

.faixa--roblox {
  --faixa-icone: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill-rule=%22evenodd%22 d=%22M18.926 23.998 0 18.892 5.075.002 24 5.108zM15.348 10.09l-5.282-1.453-1.414 5.273 5.282 1.453z%22/%3E%3C/svg%3E");
  --faixa-fundo: linear-gradient(110deg, #17181c, #3f434c);
}

.faixa--microsoft {
  --faixa-icone: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M8 7V5.5a4 4 0 0 1 8 0V7h-2V5.5a2 2 0 0 0-4 0V7z%22/%3E%3Cpath fill-rule=%22evenodd%22 d=%22M5 7h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2zm3.5 3.5v3h3v-3zm4 0v3h3v-3zm-4 4v3h3v-3zm4 0v3h3v-3z%22/%3E%3C/svg%3E");
  --faixa-fundo: linear-gradient(110deg, #0b6b2e, #119a46);
}

.faixa--xbox {
  --faixa-icone: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22white%22 d=%22M5.42 19.528A9.96 9.96 0 0 0 12 22a9.97 9.97 0 0 0 6.585-2.472c1.564-1.594-3.597-7.258-6.585-9.515c-2.985 2.257-8.15 7.921-6.582 9.515m9.3-12.005c2.083 2.467 6.236 8.594 5.063 10.76A9.95 9.95 0 0 0 22 12.002a9.96 9.96 0 0 0-2.975-7.113s-.023-.018-.068-.035a.7.7 0 0 0-.234-.038c-.494 0-1.655.362-4.005 2.706M5.045 4.855c-.048.017-.068.034-.072.035A9.96 9.96 0 0 0 2 12.003c0 2.379.832 4.561 2.217 6.278C3.051 16.11 7.201 9.988 9.285 7.523C6.935 5.178 5.772 4.818 5.28 4.818a.6.6 0 0 0-.234.039zM12 4.959S9.546 3.523 7.63 3.455c-.753-.027-1.213.246-1.268.282C8.15 2.539 10.05 2 11.988 2H12c1.945 0 3.838.538 5.638 1.737c-.056-.038-.512-.31-1.266-.282c-1.917.068-4.372 1.5-4.372 1.5z%22/%3E%3C/svg%3E");
  --faixa-fundo: linear-gradient(110deg, #0a4d0c, #149414);
}

.faixa--steam {
  --faixa-fundo: linear-gradient(110deg, #0a1b48, #132e62 45%, #1387b8);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M11.979 0C5.678 0 .511 4.86.022 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142V8.91c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727L.436 15.27C1.862 20.307 6.486 24 11.979 24c6.627 0 11.999-5.373 11.999-12S18.605 0 11.979 0zM7.54 18.21l-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012H7.54zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z%22/%3E%3C/svg%3E");
}

.faixa--caixa {
  --faixa-fundo: linear-gradient(110deg, #8e3fd6, #c27cf2);
}

.faixa--caixa-streaming {
  --faixa-fundo: linear-gradient(110deg, #c21b1b, #f0443a);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22m5.398 0 8.348 23.602c2.346.059 4.856.398 4.856.398L10.113 0H5.398zm8.489 0v9.172l4.715 13.33V0h-4.715zM5.398 1.5V24c1.873-.225 2.81-.312 4.715-.398V14.83L5.398 1.5z%22/%3E%3C/svg%3E");
}

.faixa--caixa-cupom {
  --faixa-fundo: linear-gradient(110deg, #c81f73, #f25fae);
}

.faixa--caixa-steam {
  --faixa-fundo: linear-gradient(110deg, #1d4fb8, #3b82f6);
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M11.979 0C5.678 0 .511 4.86.022 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142V8.91c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727L.436 15.27C1.862 20.307 6.486 24 11.979 24c6.627 0 11.999-5.373 11.999-12S18.605 0 11.979 0zM7.54 18.21l-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012H7.54zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z%22/%3E%3C/svg%3E");
}

.faixa--padrao {
  --faixa-fundo: linear-gradient(110deg, rgb(var(--grad-ini)), rgb(var(--grad-fim)));
}

.faixa--steam-key {
  --faixa-fundo: #f4f4f6;
  --faixa-icone: url("data:image/svg+xml,%3Csvg viewBox=%220 0 24 24%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M11.979 0C5.678 0 .511 4.86.022 11.037l6.432 2.658c.545-.371 1.203-.59 1.912-.59.063 0 .125.004.188.006l2.861-4.142V8.91c0-2.495 2.028-4.524 4.524-4.524 2.494 0 4.524 2.031 4.524 4.527s-2.03 4.525-4.524 4.525h-.105l-4.076 2.911c0 .052.004.105.004.159 0 1.875-1.515 3.396-3.39 3.396-1.635 0-3.016-1.173-3.331-2.727L.436 15.27C1.862 20.307 6.486 24 11.979 24c6.627 0 11.999-5.373 11.999-12S18.605 0 11.979 0zM7.54 18.21l-1.473-.61c.262.543.714.999 1.314 1.25 1.297.539 2.793-.076 3.332-1.375.263-.63.264-1.319.005-1.949s-.75-1.121-1.377-1.383c-.624-.26-1.29-.249-1.878-.03l1.523.63c.956.4 1.409 1.5 1.009 2.455-.397.957-1.497 1.41-2.454 1.012H7.54zm11.415-9.303c0-1.662-1.353-3.015-3.015-3.015-1.665 0-3.015 1.353-3.015 3.015 0 1.665 1.35 3.015 3.015 3.015 1.663 0 3.015-1.35 3.015-3.015zm-5.273-.005c0-1.252 1.013-2.266 2.265-2.266 1.249 0 2.266 1.014 2.266 2.266 0 1.251-1.017 2.265-2.266 2.265-1.253 0-2.265-1.014-2.265-2.265z%22/%3E%3C/svg%3E");
  color: #0b0b0f;
  box-shadow: inset 0 -1px 0 rgb(0 0 0 / 0.08);
}

@media (hover: none) {
  .produto-card,
  .banner-prod {
    border-color: transparent;
  }
}

.produto-card {
  --faixa-lado: 1.65rem;
  width: auto;
  margin-right: var(--faixa-lado);
  overflow: visible;
  border: 0;
  border-radius: 1.15rem 0 0 0;
}

.produto-card__corpo {
  border: 1px solid rgb(255 255 255 / 0.07);
  border-top: 0;
}

.produto-card__topo {
  position: relative;
}

.produto-card__arte {
  border-top-left-radius: 1.15rem;
}

.produto-card__topo > .faixa {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 100%;
  width: var(--faixa-lado);
  min-height: 0;
  padding: 0.5rem 0;
  gap: 0.25rem;
  overflow: hidden;
  border-radius: 0 1rem 1rem 0;
  font-size: 0.55rem;
  letter-spacing: 0.03em;
  writing-mode: vertical-rl;
  box-shadow: none;
}

.produto-card__topo > .faixa .faixa__marca,
.produto-card__topo > .faixa svg,
.produto-card__topo > .faixa i {
  width: 0.85rem;
  height: 0.85rem;
  transform: rotate(90deg);
}

.secao-tema--faixa-topo .produto-card,
.category-grid--faixa-topo .produto-card {
  --faixa-lado: 0px;
  border-radius: 1rem 1rem 0 0;
}

.secao-tema--faixa-topo .produto-card__arte,
.category-grid--faixa-topo .produto-card__arte {
  border-radius: 0;
}

.secao-tema--faixa-topo .produto-card__topo > .faixa,
.category-grid--faixa-topo .produto-card__topo > .faixa {
  position: relative;
  top: auto;
  bottom: auto;
  left: auto;
  width: auto;
  min-height: 1.9rem;
  padding: 0.35rem 0.75rem;
  gap: 0.4rem;
  border-radius: 1rem 1rem 0 0;
  font-size: 0.66rem;
  letter-spacing: 0.08em;
  writing-mode: horizontal-tb;
}

.secao-tema--faixa-topo .produto-card__topo > .faixa .faixa__marca,
.secao-tema--faixa-topo .produto-card__topo > .faixa svg,
.secao-tema--faixa-topo .produto-card__topo > .faixa i,
.category-grid--faixa-topo .produto-card__topo > .faixa .faixa__marca,
.category-grid--faixa-topo .produto-card__topo > .faixa svg,
.category-grid--faixa-topo .produto-card__topo > .faixa i {
  width: 0.95rem;
  height: 0.95rem;
  transform: none;
}

@media (min-width: 768px) {
  .produto-card {
    --faixa-lado: 1.85rem;
  }

  .produto-card__topo > .faixa {
    font-size: 0.6rem;
  }
}

@media (max-width: 767px) {
  .produto-card {
    --faixa-lado: 0px;
    border-radius: 1rem 1rem 0 0;
  }

  .produto-card__arte {
    border-radius: 0;
  }

  .produto-card__topo > .faixa {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    width: auto;
    min-height: 1.75rem;
    padding: 0.3rem 0.6rem;
    gap: 0.3rem;
    border-radius: 1rem 1rem 0 0;
    font-size: 0.6rem;
    letter-spacing: 0.05em;
    writing-mode: horizontal-tb;
  }

  .produto-card__topo > .faixa .faixa__marca,
  .produto-card__topo > .faixa svg,
  .produto-card__topo > .faixa i {
    width: 0.9rem;
    height: 0.9rem;
    transform: none;
  }
}
