/* SERPENS — lançamento dos kits Presa, Naja e Mamba Negra */

.pageHero--kit-mamba-negra {
  --vip-hero: image-set(
    url("../assets/kit_mamba_negra_art.webp") type("image/webp"),
    url("../assets/kit_mamba_negra_art.png") type("image/png")
  );
  --vip-accent1: rgba(239, 68, 68, .96);
  --vip-accent2: rgba(69, 10, 10, .62);
  --vip-glow: rgba(239, 68, 68, .28);
}

.pageHero--kit-naja {
  --vip-hero: image-set(
    url("../assets/kit_naja_art.webp") type("image/webp"),
    url("../assets/kit_naja_art.png") type("image/png")
  );
  --vip-accent1: rgba(236, 72, 153, .96);
  --vip-accent2: rgba(88, 28, 135, .55);
  --vip-glow: rgba(236, 72, 153, .28);
}

.pageHero--kit-presa {
  --vip-hero: image-set(
    url("../assets/kit_presa_art.webp") type("image/webp"),
    url("../assets/kit_presa_art.png") type("image/png")
  );
  --vip-accent1: rgba(34, 211, 238, .96);
  --vip-accent2: rgba(29, 78, 216, .58);
  --vip-glow: rgba(34, 211, 238, .28);
}

body.vipTheme--mamba-negra {
  --vip-accent1: rgba(239, 68, 68, .96);
  --vip-accent2: rgba(69, 10, 10, .62);
  --vip-glow: rgba(239, 68, 68, .28);
}

body.vipTheme--naja {
  --vip-accent1: rgba(236, 72, 153, .96);
  --vip-accent2: rgba(88, 28, 135, .55);
  --vip-glow: rgba(236, 72, 153, .28);
}

body.vipTheme--presa {
  --vip-accent1: rgba(34, 211, 238, .96);
  --vip-accent2: rgba(29, 78, 216, .58);
  --vip-glow: rgba(34, 211, 238, .28);
}

.product--kit-mamba-negra {
  --vip-accent: #ef4444;
  --vip-accent-rgb: 239, 68, 68;
}

.product--kit-naja {
  --vip-accent: #ec4899;
  --vip-accent-rgb: 236, 72, 153;
}

.product--kit-presa {
  --vip-accent: #22d3ee;
  --vip-accent-rgb: 34, 211, 238;
}

.vipCard__media--mamba-negra {
  background-image: image-set(
    url("../assets/kit_mamba_negra_art.webp") type("image/webp"),
    url("../assets/kit_mamba_negra_art.png") type("image/png")
  );
  background-position: 50% 46%;
}

.vipCard__media--naja {
  background-image: image-set(
    url("../assets/kit_naja_art.webp") type("image/webp"),
    url("../assets/kit_naja_art.png") type("image/png")
  );
  background-position: 50% 46%;
}

.vipCard__media--presa {
  background-image: image-set(
    url("../assets/kit_presa_art.webp") type("image/webp"),
    url("../assets/kit_presa_art.png") type("image/png")
  );
  background-position: 50% 46%;
}

#kits .products--serpensStore {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.page-kitdetail .vipDetail__splashImg {
  height: 320px;
  object-position: center;
}

.page-kitdetail .vipTextHeading {
  color: var(--vip-accent1, rgba(255, 255, 255, .92));
}

.page-kitdetail .vipDetail__splashPanel,
.page-kitdetail .vipDetail__kitPanel,
.page-kitdetail .vipDetail__benefitsPanel {
  border-color: color-mix(in srgb, var(--vip-accent1, #fff) 22%, transparent);
}

@media (max-width: 1100px) {
  #kits .products--serpensStore {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  #kits .products--serpensStore {
    grid-template-columns: 1fr;
  }

  .page-kitdetail .vipDetail__splashImg {
    height: 260px;
  }
}

@supports not (color: color-mix(in srgb, #fff, #000)) {
  .page-kitdetail .vipDetail__splashPanel,
  .page-kitdetail .vipDetail__kitPanel,
  .page-kitdetail .vipDetail__benefitsPanel {
    border-color: rgba(255, 255, 255, .14);
  }
}