:root {
  --petco__dk-blue: #00205b;
  --petco__lt-gray: #f2f2f2;
  --petco__white: #fff;
  --petco__black: #000;
  --petco__box-shadow: rgba(0, 0, 0, 0.1) 0 2px 8px;

  --petco__font-family:
    PetcoCircular, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-book:
    PetcoCircular-Book, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-medium:
    PetcoCircular-Medium, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-bold:
    PetcoCircular-Bold, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-black:
    PetcoCircular-Black, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-ultra:
    PetcoCircular-Ultra, "Segoe UI", Roboto, Arial, sans-serif !important;
  --petco__font-family-tiempos:
    "TiemposHeadline-RegularItalic", "PetcoCircular-Italic", Arial, sans-serif !important;
}
/* Global Styles */
img.img-contain {
  object-fit: contain;
  width: 100%;
}
img.img-cover {
  object-fit: cover;
  width: 100%;
}
.text-center {
  text-align: center;
}
.text-left {
  text-align: left;
}
.text-blue {
  color: var(--petco__dk-blue);
}

/* quicktiles - primary v.1.1.0 */
.site-qt--primary {
  box-sizing: border-box;
  max-width: 1440px;
  padding: 20px 0;
  margin: 0 auto;
}
.site-qt--primary * {
  box-sizing: border-box;
}
.site-qt--primary ul.quicktile__wrap {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  overflow: hidden;
  transition: max-height 0.3s ease;
  max-height: 160px;
  padding: 0 8px;
}
.site-qt--primary li.quicktile {
  display: flex;
  justify-content: center;
  flex: 1;
  min-width: 175px;
  max-width: 175px;
  min-height: 160px;
}
.site-qt--primary .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  text-align: center;
  background: var(--petco__white);
  border-radius: 8px;
  margin: 8px;
}
.site-qt--primary a {
  text-decoration: none;
  border-radius: 8px;
  border: 2px solid var(--petco__white);
  box-shadow: var(--petco__box-shadow);
  transition: 300ms ease-in-out;
  width: 100%;
  height: 100%;
  padding: 8px;
}
.site-qt--primary a:hover {
  border: 2px solid var(--petco__dk-blue);
  box-shadow: var(--petco__box-shadow);
}
.site-qt--primary .img-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  max-height: 85px;
  margin: 0 auto 10px auto;
}
.site-qt--primary .img-wrap:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.site-qt--primary .img-wrap img {
  object-fit: contain;
  max-height: 85px;
  width: 100%;
  height: auto;
}
.site-qt--primary .text-wrap {
  display: flex;
  flex-direction: column;
}
.site-qt--primary span.cta-text {
  font-family: var(--petco__font-family) !important;
  font-size: 12px;
  line-height: 14px;
  letter-spacing: 0.5px;
  font-weight: 500;
  color: var(--petco__black);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: balance;
}
.site-qt--primary .show-all {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: var(--petco__font-family) !important;
  font-weight: bold;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 0.5px;
  color: var(--petco__white);
  background-color: var(--petco__dk-blue);
  text-transform: capitalize;
  cursor: pointer;
  border: 2px solid var(--petco__dk-blue);
  border-radius: 50px;
  box-sizing: border-box;
  padding: 0px 16px;
  white-space: nowrap;
  overflow: hidden;
  user-select: none;
  transition: all 0.3s ease;
  height: 44px;
  width: 150px;
  margin: 8px auto 0 auto;
}
.site-qt--primary .show-all:visited,
.site-qt--primary .show-all:active {
  color: var(--petco__white);
  background-color: var(--petco__dk-blue);
}
.site-qt--primary .show-all:hover {
  background: transparent;
  border: 2px solid var(--petco__dk-blue);
  color: var(--petco__dk-blue);
}
@media screen and (max-width: 768px) {
  .site-qt--primary ul.quicktile__wrap {
    max-height: 148px;
  }
  .site-qt--primary li.quicktile {
    min-width: 110px;
    max-width: 110px;
    min-height: 148px;
  }
  .site-qt--primary .img-wrap {
    max-height: 75px;
  }
  .site-qt--primary .img-wrap img {
    max-height: 75px;
  }
}
/* quicktiles - circular v.1.2.0 */
.site-qt--circular {
  box-sizing: border-box;
  max-width: 1440px;
  padding: 20px 0;
  margin: 0 auto;
}
.site-qt--circular * {
  box-sizing: border-box;
}
.site-qt--circular p.headline {
  font-family: var(--petco__font-family-bold) !important;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  margin: 0 0 10px 0;
  padding: 0;
}
.site-qt--circular ul.quicktile__wrap {
  display: flex;
  justify-content: center;
  overflow: hidden;
  padding: 0 8px;
  margin: 0;
}
.site-qt--circular li.quicktile {
  display: flex;
  justify-content: center;
  flex: 1;
}
.site-qt--circular .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  text-align: center;
  transition: 300ms ease-in-out;
  margin: 8px;
  /* max-width: fit-content; */
  max-width: 100%;
}
.site-qt--circular a {
  text-decoration: none;
  transition: 300ms ease-in-out;
  height: 100%;
  width: 100%;
  padding: 0px;
}
.site-qt--circular .img-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  transition: 300ms ease-in-out;
  overflow: hidden;
  max-height: 150px;
  max-width: 150px;
  margin: 0 auto 10px auto;
}
.site-qt--circular .img-wrap.img-wrap--circle {
  border-radius: 50%;
}
.site-qt--circular .img-wrap:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.site-qt--circular .content-wrap:hover .img-wrap {
  transform: scale(1.025);
}
.site-qt--circular .img-wrap img {
  max-height: 150px;
  height: auto;
  width: 100%;
}
.site-qt--circular .text-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.site-qt--circular span.cta-text {
  font-family: var(--petco__font-family) !important;
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0.5px;
  font-weight: 500;
  text-wrap: balance;
  color: var(--petco__black);
  transition: 300ms ease-in-out;
}
.site-qt--circular .content-wrap:hover span.cta-text {
  color: var(--petco__dk-blue);
}
.site-qt--circular .show-all {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: var(--petco__font-family) !important;
  font-weight: bold;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 0.5px;
  color: var(--petco__white);
  background-color: var(--petco__dk-blue);
  text-transform: capitalize;
  cursor: pointer;
  border: 2px solid var(--petco__dk-blue);
  border-radius: 50px;
  box-sizing: border-box;
  padding: 0px 16px;
  white-space: nowrap;
  overflow: hidden;
  user-select: none;
  transition: all 0.3s ease;
  height: 44px;
  width: 150px;
  margin: 8px auto 0 auto;
}
.site-qt--circular .show-all:visited,
.site-qt--circular .show-all:active {
  color: var(--petco__white);
  background: var(--petco__dk-blue);
}
.site-qt--circular .show-all:hover {
  background: transparent;
  border: 2px solid var(--petco__dk-blue);
  color: var(--petco__dk-blue);
}
@media screen and (max-width: 768px) {
  .site-qt--circular ul.quicktile__wrap {
    flex-wrap: wrap;
    transition: max-height 0.3s ease;
    max-height: 152px;
  }
  .site-qt--circular li.quicktile {
    min-height: 152px;
    min-width: 110px;
    max-width: 110px;
  }
  .site-qt--circular .img-wrap {
    max-height: 100px;
  }
  .site-qt--circular .img-wrap img {
    max-height: 100px;
    max-width: 100px;
  }
  .site-qt--circular span.cta-text {
    font-size: 14px;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
/* Site Quicktile Carousel v.1.0.1 */
.site-qt--carousel {
  --items-per-view: 5;
  --gap: 0px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  max-width: 1440px;
  width: 100%;
  padding: 20px 0;
  margin: 0 auto;
}
.site-qt--carousel * {
  box-sizing: border-box;
}
.site-qt--carousel h2 {
  font-family: var(--petco__font-family-bold) !important;
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  margin: 0 16px 10px 16px;
}
.site-qt--carousel p.headline {
  font-family: var(--petco__font-family-bold) !important;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  margin: 0 72px 10px 72px;
  padding: 0;
}
.site-qt--carousel .carousel-wrap {
  position: relative;
}
.site-qt--carousel .quicktile-carousel {
  width: calc(100% - 124px);
  margin: 0 auto;
  overflow: hidden;
}
.site-qt--carousel .quicktile-carousel.carousel--full-width {
  width: 100%;
}
.site-qt--carousel ul.quicktile-wrap {
  display: flex;
  gap: var(--gap);
  margin: 0;
  list-style: none;
  transition: transform 300ms ease;
  will-change: transform;
}
.site-qt--carousel li.quicktile {
  display: flex;
  justify-content: center;
  flex: 0 0
    calc(
      (100% - (var(--gap) * (var(--items-per-view) - 1))) /
        var(--items-per-view)
    );
  box-sizing: border-box;
  padding: 8px;
}
.site-qt--carousel .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  max-width: 247px;
}
.site-qt--carousel a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-decoration: none;
  width: 100%;
  height: auto;
}
.site-qt--carousel .img-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border: 2px solid var(--petco__white);
  box-shadow: var(--petco__box-shadow);
  overflow: hidden;
  transition: 300ms ease-in-out;
  max-height: 138px;
  height: 100%;
  max-width: 247px;
  width: 100%;
}
.site-qt--carousel .img-wrap:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.site-qt--carousel a:hover .img-wrap {
  border: 2px solid var(--petco__dk-blue);
}
.site-qt--carousel .img-wrap img {
  max-height: 139px;
  height: 100%;
  width: 100%;
}
.site-qt--carousel .img-wrap img.img-contain {
  padding: 8px;
}
.site-qt--carousel.brand-carousel .img-wrap img {
  object-fit: contain;
  max-width: 80%;
  max-height: 80px;
  padding: 0;
}
.site-tabs--carousel .img-wrap p {
  font-family: var(--petco__font-family) !important;
  color: var(--petco__dk-blue);
  font-size: 14px;
  line-height: 1.25;
  text-align: center;
  text-transform: capitalize;
  text-wrap: balance;
  font-weight: normal;
  margin: 0;
  padding: 0;
}
.site-qt--carousel .text-wrap {
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 8px;
}
.site-qt--carousel p.heading {
  font-family: var(--petco__font-family-bold) !important;
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--carousel p.sub-heading {
  font-family: var(--petco__font-family) !important;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.5px;
  color: var(--petco__black);
  font-weight: normal;
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--carousel .carousel-arrow {
  /* display: none; */
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  opacity: 1;
  background: var(--petco__lt-gray);
  transition: all 300ms ease-in-out;
  appearance: none;
  border: none !important;
  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  width: 40px;
  height: 40px;
  padding: 0;
}
.site-qt--carousel .carousel-arrow--prev {
  left: 16px;
}
.site-qt--carousel .carousel-arrow--next {
  right: 16px;
}
.site-qt--carousel .carousel-arrow svg {
  fill: var(--petco__dk-blue);
  height: 1.2em;
  width: 1.2em;
}
.site-qt--carousel .carousel-arrow--prev svg {
  transform: scaleX(-1);
}
.site-qt--carousel .carousel-arrow[disabled] {
  opacity: 0.5;
}

@media (min-width: 1281px) {
  .site-qt--carousel {
    --items-per-view: 5;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .site-qt--carousel {
    --items-per-view: 4;
  }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .site-qt--carousel {
    --items-per-view: 3;
  }
}
@media (max-width: 768px) {
  .site-qt--carousel {
    --items-per-view: 1;
  }
  .site-qt--carousel h2 {
    font-size: 20px;
  }
  .site-qt--carousel p.headline {
    font-size: 16px;
    margin: 0 16px 10px 16px;
  }
  .site-qt--carousel .carousel-arrow {
    display: none !important;
  }
  .site-qt--carousel .quicktile-carousel {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
  }
  .site-qt--carousel ul.quicktile-wrap {
    overflow: scroll;
    scrollbar-width: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    transition: none;
    transform: none !important;
    padding: 0 8px;
  }
  .site-qt--carousel ul.quicktile-wrap::-webkit-scrollbar {
    display: none;
  }
  .site-qt--carousel li.quicktile {
    min-width: 247px;
    max-width: 247px;
  }
}
/* FAQs v.1.0.0 */
.site-faqs {
  max-width: 1440px !important;
  margin: 0 auto;
  padding: 40px 0;
}
.site-faqs *,
.site-faqs *::before,
.site-faqs *::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
.site-faqs .content-wrap {
  margin: 0 16px;
}
.site-faqs h2 {
  font-family: var(--petco__font-family-bold);
  font-size: 25px;
  line-height: 1.25;
  color: var(--petco__black);
  text-align: center;
  margin-bottom: 40px;
}
.site-faqs .faq-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.site-faqs dl {
  display: flex;
  flex-direction: column;
  position: relative;
  border-radius: 8px;
  border: 2px solid var(--petco__white);
  background-color: var(--petco__white);
  box-sizing: border-box;
  box-shadow: var(--petco__box-shadow);
  transition: ease-in-out 300ms;
  width: 100%;
  height: min-content;
  overflow: hidden;
}
.site-faqs dl.active,
.site-faqs dl:hover {
  border: 2px solid var(--petco__dk-blue);
  box-shadow: rgba(0, 0, 0, 0.15) 0 2px 8px;
  overflow: hidden;
}
.site-faqs dt {
  display: flex;
  align-items: center;
  background-color: var(--petco__white);
  cursor: pointer;
  outline: none;
  transition: ease-in-out 300ms;
  padding: 8px 48px 8px 16px;
  min-height: 60px;
  position: relative;
}
.site-faqs dt:after {
  content: url("https://assets.petco.com/petco/image/upload/w_20,f_auto,q_auto:best/icon__petco-down-arrow-00205b.png");
  position: absolute;
  right: 16px;
  transition: all ease-in-out 0.3s;
  transform: rotate(0);
}
.site-faqs dt.active:after {
  transform: rotate(180deg);
}
.site-faqs dt button {
  font-family: "PetcoCircular-Bold", Arial, sans-serif !important;
  font-weight: normal;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0.225px;
  text-align: left;
  color: #000;
  background: transparent;
  border: none;
  user-select: none;
  padding: 0;
  margin: 0;
}
.site-faqs dd {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
  color: var(--petco__black);
  border-radius: 0 0 8px 8px;
  border-color: transparent #00205b #00205b #00205b;
}
.site-faqs .panel-body {
  display: flex;
  flex-direction: column;
  padding: 0 16px 16px 16px;
}
.site-faqs dd .panel-body p,
.site-faqs dd .panel-body ul li,
.site-faqs dd .panel-body ol li {
  font-family: var(--petco__font-family);
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: 0.5px;
  color: var(--petco__black);
  margin-bottom: 8px;
}
.site-faqs dd .panel-body p:last-of-type {
  margin-bottom: 0px;
}
.site-faqs .panel-body ul,
.site-faqs .panel-body ol {
  margin: 8px 0 8px 32px;
}
.site-faqs dd .panel-body ul li:last-of-type,
.site-faqs dd .panel-body ol li:last-of-type {
  margin-bottom: 0px;
}
.site-faqs dd .panel-body a {
  font-family: var(--petco__font-family);
  font-weight: normal;
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .site-faqs {
    padding: 20px 0;
  }
  .site-faqs h2 {
    font-size: 20px;
  }
  .site-faqs dt button {
    font-size: 18px;
  }
}

/* Site SEO v.1.0. */
.site-seo {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 40px 0;
}
.site-seo .text-wrap {
  display: flex;
  flex-direction: column;
  margin: 0 16px;
}
.site-seo h2 {
  font-family: var(--petco__font-family);
  font-weight: bold;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: #000;
  margin: 0 0 10px 0;
  padding: 0;
}
.site-seo h2 {
  font-family: var(--petco__font-family);
  font-weight: bold;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: #000;
  margin: 0 0 10px 0;
  padding: 0;
}
.site-seo p {
  font-family: var(--petco__font-family);
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: 0.5px;
  color: #000;
  margin: 0 0 20px 0;
  padding: 0;
}
.site-seo a {
  font-family: var(--petco__font-family);
  font-weight: bold;
  font-size: 16px;
  color: var(--petco__dk-blue);
  text-decoration: underline;
}
.site-seo ul,
.site-seo ol {
  margin: 0;
  padding: 0;
}
.site-seo li {
  font-family: var(--petco__font-family);
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: 0.5px;
  color: #000;
  list-style: disc !important;
  list-style-position: inside !important;
  margin-bottom: 20px;
}
.site-seo .hidden-text {
  display: block;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition:
    max-height 0.35s ease,
    opacity 0.35s ease;
}
.site-seo .toggle-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: var(--petco__font-family-bold) !important;
  font-weight: bold;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 0.25px;
  color: var(--petco__white);
  background: var(--petco__dk-blue);
  cursor: pointer;
  border: 2px solid var(--petco__dk-blue);
  border-radius: 30px;
  padding: 0px 20px;
  white-space: nowrap;
  overflow: hidden;
  user-select: none;
  transition: all 0.3s ease;
  height: 40px;
  width: 150px;
  margin: 10px auto 0 auto;
}

/* Site Tabs v.1.0. */
.site-tabs {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
}
.site-tabs * {
  box-sizing: border-box;
}
.site-tabs .tab-list {
  display: flex;
  position: relative;
  /* margin: 0 16px 40px 16px; */
  margin: 0 16px;
}
.site-tabs .tab-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
  position: relative;
  background: var(--petco__white);
  color: var(--petco__dk-blue);
  border: 0;
  border-radius: 0;
  opacity: 1;
  transition: all 0.3s ease-in-out;
  width: 100%;
  padding: 0;
}
.site-tabs .tab-btn[aria-selected="true"] {
  /* opacity: 1; */
}
.site-tabs .tab-btn:hover {
  opacity: 1;
  transition: all 0.3s ease-in-out;
}
.site-tabs .tab-title {
  font-family: var(--petco__font-family);
  font-weight: bold;
  font-size: 16px;
  line-height: 1.125;
  letter-spacing: 1px;
  text-align: center;
  text-wrap: balance;
  padding: 10px 16px;
}
.site-tabs .tab-panel {
  display: initial;
  box-sizing: border-box;
  -webkit-animation-name: content;
  animation-name: content;
  -webkit-animation-direction: normal;
  animation-direction: normal;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  box-sizing: border-box;
}
@-webkit-keyframes content {
  from {
    opacity: 0;
    transform: translateY(5%);
  }
  to {
    opacity: 1;
    transform: translateY(0%);
  }
}
@keyframes content {
  from {
    opacity: 0;
    transform: translateY(5%);
  }
  to {
    opacity: 1;
    transform: translateY(0%);
  }
}
@media screen and (min-width: 769px) {
  .site-tabs .tab-list::after {
    content: "";
    border-bottom: 4px solid var(--petco__lt-gray);
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  .site-tabs .tab-btn::after {
    content: "";
    position: absolute;
    bottom: 0;
    z-index: 1;
    display: block;
    background: var(--petco__dk-blue);
    border-radius: 50px;
    transition:
      width 0.3s ease,
      background-color 0.3s ease;
    height: 4px;
    width: 0;
  }
  .site-tabs .tab-btn[aria-selected="true"]::after {
    content: "";
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .site-tabs {
    /* padding: 20px 0; */
  }
  .site-tabs .tab-list {
    display: flex;
    overflow: scroll;
    scrollbar-width: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    width: 100%;
    gap: 10px;
    margin: 0;
    padding: 0 16px;
  }
  .site-tabs .tab-list::-webkit-scrollbar {
    display: none;
  }
  .site-tabs .tab-btn {
    border: 2px solid var(--petco__dk-blue);
    border-radius: 50px;
    min-width: fit-content;
  }
  .site-tabs .tab-btn[aria-selected="true"] {
    background: var(--petco__dk-blue);
    color: var(--petco__white);
    border-radius: 50px;
  }
  .site-tabs .tab-btn .tab-title {
    line-height: 1;
    white-space: nowrap;
    padding: 5px 16px;
  }
}

/* Site Tabs Carousel v.1.0.0 */
.site-tabs--carousel {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
.site-tabs--carousel * {
  box-sizing: border-box;
}
/* .site-tabs--carousel .site-qt--carousel .quicktile-carousel {
  width: 100%;
} */
.site-tabs--carousel .splide {
  margin: 40px 0;
}
.site-tabs--carousel .site-tabs {
  width: calc(100% - 120px);
  margin: 0 auto;
  padding: 0;
}
.site-tabs--carousel .splide__arrow {
  display: flex;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  opacity: 1;
  background: var(--petco__lt-gray);
  transition: all 300ms ease-in-out;
  border: none !important;
  border-radius: 50%;
  cursor: pointer;
  width: 40px;
  height: 40px;
  padding: 0;
}
.site-tabs--carousel .splide__arrow svg {
  height: 20px;
  width: 20px;
  fill: var(--petco__dk-blue);
}
.site-tabs--carousel .splide__arrow--prev {
  top: 17px;
  left: 0px;
  transform: none;
}
.site-tabs--carousel .splide__arrow--next {
  top: 17px;
  right: 0px;
  transform: none;
}
.site-tabs--carousel .splide__arrow:disabled {
  opacity: 0.5;
}
.site-tabs--carousel .splide__arrow:hover:not(:disabled) {
  opacity: 0.9;
}
.site-tabs--carousel .splide {
  position: relative;
}
.site-tabs--carousel ul.splide__list {
  display: flex;
  position: relative;
  touch-action: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 0 !important;
}
.site-tabs--carousel li.splide__slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  -ms-flex-negative: 0;
  cursor: pointer;
  text-align: center;
  overflow: hidden;
  position: relative;
  list-style-type: none !important;
  backface-visibility: hidden;
  box-sizing: border-box;
  background: var(--petco__white);
  color: var(--petco__dk-blue);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  width: 100%;
  margin: 0;
}
.site-tabs--carousel .splide__slide span.tab-btn {
  font-family: var(--petco__font-family);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.125;
  letter-spacing: 1px;
  text-align: center;
  text-wrap: balance;
  transition: all 300ms ease-in-out;
  padding: 10px;
}
.site-tabs--carousel .site-qt--carousel .content-wrap p.heading {
  display: flex;
  justify-content: center;
  font-family: var(--petco__font-family) !important;
  font-size: clamp(14px, 1.75vw, 16px);
  line-height: 1.25;
  letter-spacing: 0.5px;
  font-weight: 500;
  color: var(--petco__black);
  transition: 0.3s ease-in-out;
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-tabs--carousel .site-qt--carousel .content-wrap:hover p.heading {
  color: var(--petco__dk-blue);
}
.site-tabs--carousel .tab-panel > .cta-wrap {
  display: flex;
  justify-content: center;
  margin: 0 16px;
}
.site-tabs--carousel .tab-panel > .cta-wrap a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: var(--petco__font-family) !important;
  font-weight: 700;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 0.5px;
  color: var(--petco__white);
  background-color: var(--petco__dk-blue);
  text-transform: capitalize;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid var(--petco__dk-blue);
  border-radius: 50px;
  box-sizing: border-box;
  padding: 0 16px;
  white-space: nowrap;
  overflow: hidden;
  user-select: none;
  transition: all 0.3s ease;
  height: 44px;
  width: auto;
  gap: 8px;
}
.site-tabs--carousel .tab-panel > .cta-wrap a span {
  display: flex;
  transition: all 0.3s ease-in-out;
}
.site-tabs--carousel .tab-panel > .cta-wrap a:hover span {
  transform: translateX(4px);
  transition: all 0.3s ease;
}
@media screen and (min-width: 769px) {
  .site-tabs--carousel .splide::after {
    content: "";
    border-bottom: 4px solid var(--petco__lt-gray);
    position: absolute;
    top: 70px;
    left: 60px;
    right: 60px;
    width: calc(100% - 120px);
    z-index: -1;
    border-radius: 50px;
  }
  .site-tabs--carousel li.splide__slide {
    border: 0;
    border-radius: 0;
    background: transparent;
    min-height: 74px;
  }
  .site-tabs--carousel li.splide__slide::after {
    content: "";
    position: absolute;
    bottom: 0;
    z-index: 1;
    display: block;
    background: var(--petco__dk-blue);
    border-radius: 50px;
    transition:
      width 0.3s ease,
      background-color 0.3s ease;
    height: 4px;
    width: 0;
  }
  .site-tabs--carousel li.splide__slide[aria-selected="true"] {
    opacity: 1;
  }
  .site-tabs--carousel li.splide__slide[aria-selected="true"]::after {
    content: "";
    width: 100%;
    transition:
      width 0.3s ease,
      background-color 0.3s ease;
  }
  .site-tabs--carousel li.splide__slide:hover {
    opacity: 1;
  }
  .site-tabs--carousel li.splide__slide[aria-selected="true"] span.tab-btn {
    opacity: 1;
  }
  .site-tabs--carousel li.splide__slide:hover span.tab-btn {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  .site-tabs--carousel .site-tabs {
    width: 100%;
  }
  .site-tabs--carousel ul.splide__list {
    display: flex !important;
    overflow: scroll;
    gap: 10px;
    scrollbar-width: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    width: 100%;
    padding: 0 !important;
  }
  .site-tabs--carousel li.splide__slide {
    width: auto !important;
  }
  .site-tabs--carousel .site-qt--carousel {
    padding: 12px 0;
  }
  .site-tabs--carousel .site-qt--carousel li.quicktile {
    max-width: 125px;
    min-width: 125px;
  }
}

/* Product Quicktile Carousel v.1.0.0 */
.site-qt--product {
  --items-per-view: 4;
  --gap: 0px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  max-width: 1440px;
  width: 100%;
  padding: 20px 0;
  margin: 0 auto;
}
.site-qt--product * {
  box-sizing: border-box;
}
.site-qt--product .carousel-wrap {
  position: relative;
}
.site-qt--product .quicktile-carousel {
  width: calc(100% - 124px);
  margin: 0 auto;
  overflow: hidden;
}
.site-qt--product .quicktile-carousel.carousel--full-width {
  width: 100%;
}
.site-qt--product ul.quicktile-wrap {
  display: flex;
  gap: var(--gap);
  margin: 0;
  list-style: none;
  transition: transform 300ms ease;
  will-change: transform;
}
.site-qt--product li.quicktile {
  display: flex;
  justify-content: center;
  flex: 0 0
    calc(
      (100% - (var(--gap) * (var(--items-per-view) - 1))) /
        var(--items-per-view)
    );
  box-sizing: border-box;
  padding: 8px;
}
.site-qt--product .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}
.site-qt--product a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-decoration: none;
  width: 100%;
  height: auto;
}
.site-qt--product .img-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border: 2px solid var(--petco__white);
  overflow: hidden;
  transition: 300ms ease-in-out;
  max-height: 194px;
  min-height: 194px;
  height: 100%;
  width: 100%;
}
.site-qt--product a:hover .img-wrap {
  border: 2px solid var(--petco__dk-blue);
}
.site-qt--product .img-wrap img {
  height: 100%;
  width: 100%;
}
.site-qt--product .text-wrap {
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 8px;
}
.site-qt--product .text-wrap h3 {
  font-family: var(--petco__font-family) !important;
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: #000;
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--product p.sub-heading {
  font-family: var(--petco__font-family) !important;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.5px;
  color: #333;
  font-weight: normal;
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--product .carousel-arrow {
  /* display: none; */
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  opacity: 1;
  background: var(--petco__lt-gray);
  transition: all 300ms ease-in-out;
  appearance: none;
  border: none !important;
  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  width: 40px;
  height: 40px;
  padding: 0;
}
.site-qt--product .carousel-arrow--prev {
  left: 16px;
}
.site-qt--product .carousel-arrow--next {
  right: 16px;
}
.site-qt--product .carousel-arrow svg {
  fill: var(--petco__dk-blue);
  height: 1.2em;
  width: 1.2em;
}
.site-qt--product .carousel-arrow--prev svg {
  transform: scaleX(-1);
}
.site-qt--product .carousel-arrow[disabled] {
  opacity: 0.5;
}
@media (min-width: 1025px) {
  .site-qt--product {
    --items-per-view: 4;
  }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .site-qt--product {
    --items-per-view: 3;
  }
}
@media (max-width: 768px) {
  .site-qt--product {
    --items-per-view: 1;
  }
  .site-qt--product .carousel-arrow {
    display: none !important;
  }
  .site-qt--product .quicktile-carousel {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
  }
  .site-qt--product ul.quicktile-wrap {
    overflow: scroll;
    scrollbar-width: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    transition: none;
    transform: none !important;
    padding: 0 8px;
  }
  .site-qt--product ul.quicktile-wrap::-webkit-scrollbar {
    display: none;
  }
  .site-qt--product li.quicktile {
    min-width: 247px;
    max-width: 247px;
  }
  .site-qt--product .img-wrap {
    min-height: auto;
  }
}
/* Brand Quicktile Carousel v.1.0.0 */
.site-qt--brand {
  --items-per-view: 5;
  --gap: 0px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  max-width: 1440px;
  width: 100%;
  padding: 20px 0;
  margin: 0 auto;
}
.site-qt--brand * {
  box-sizing: border-box;
}
.site-qt--brand h2 {
  font-family: var(--petco__font-family) !important;
  font-size: 18px;
  line-height: 1.25;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  margin: 0 72px 10px 72px;
  padding: 0;
}
.site-qt--brand .carousel-wrap {
  position: relative;
}
.site-qt--brand .quicktile-carousel {
  width: calc(100% - 124px);
  margin: 0 auto;
  overflow: hidden;
}
.site-qt--brand .quicktile-carousel.carousel--full-width {
  width: 100%;
}
.site-qt--brand ul.quicktile-wrap {
  display: flex;
  gap: var(--gap);
  margin: 0;
  list-style: none;
  transition: transform 300ms ease;
  will-change: transform;
}
.site-qt--brand li.quicktile {
  display: flex;
  justify-content: center;
  flex: 0 0
    calc(
      (100% - (var(--gap) * (var(--items-per-view) - 1))) /
        var(--items-per-view)
    );
  box-sizing: border-box;
  padding: 8px;
}
.site-qt--brand .content-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  max-width: 247px;
}
.site-qt--brand a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-decoration: none;
  width: 100%;
  height: auto;
}
.site-qt--brand .img-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border: 2px solid var(--petco__white);
  box-shadow: var(--petco__box-shadow);
  overflow: hidden;
  transition: 300ms ease-in-out;
  max-height: 138px;
  height: 100%;
  max-width: 247px;
  width: 100%;
}
.site-qt--brand .img-wrap:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.site-qt--brand a:hover .img-wrap {
  border: 2px solid var(--petco__dk-blue);
}
.site-qt--brand .img-wrap img {
  object-fit: contain;
  max-width: 80%;
  max-height: 80%;
  width: 100%;
}
.site-tabs--carousel .img-wrap p {
  font-family: var(--petco__font-family) !important;
  color: var(--petco__dk-blue);
  font-size: 14px;
  line-height: 1.25;
  text-align: center;
  text-transform: capitalize;
  text-wrap: balance;
  font-weight: normal;
  margin: 0;
  padding: 0;
}
.site-qt--brand .text-wrap {
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 8px;
}
.site-qt--brand p.heading {
  font-family: var(--petco__font-family-bold) !important;
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 0.5px;
  color: var(--petco__dk-blue);
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--brand p.sub-heading {
  font-family: var(--petco__font-family) !important;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.5px;
  color: var(--petco__black);
  font-weight: normal;
  text-wrap: balance;
  padding: 0;
  margin: 0;
}
.site-qt--brand .carousel-arrow {
  /* display: none; */
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
  justify-content: center;
  -ms-flex-pack: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  opacity: 1;
  background: var(--petco__lt-gray);
  transition: all 300ms ease-in-out;
  appearance: none;
  border: none !important;
  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  width: 40px;
  height: 40px;
  padding: 0;
}
.site-qt--brand .carousel-arrow--prev {
  left: 16px;
}
.site-qt--brand .carousel-arrow--next {
  right: 16px;
}
.site-qt--brand .carousel-arrow svg {
  fill: var(--petco__dk-blue);
  height: 1.2em;
  width: 1.2em;
}
.site-qt--brand .carousel-arrow--prev svg {
  transform: scaleX(-1);
}
.site-qt--brand .carousel-arrow[disabled] {
  opacity: 0.5;
}
@media (min-width: 1281px) {
  .site-qt--brand {
    --items-per-view: 5;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .site-qt--brand {
    --items-per-view: 4;
  }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .site-qt--brand {
    --items-per-view: 3;
  }
}
@media (max-width: 768px) {
  .site-qt--brand {
    --items-per-view: 1;
  }
  .site-qt--brand h2 {
    font-size: 20px;
    margin: 0 16px 10px 16px;
  }
  .site-qt--brand .carousel-arrow {
    display: none !important;
  }
  .site-qt--brand .quicktile-carousel {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
  }
  .site-qt--brand ul.quicktile-wrap {
    overflow: scroll;
    scrollbar-width: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
    transition: none;
    transform: none !important;
    padding: 0 8px;
  }
  .site-qt--brand ul.quicktile-wrap::-webkit-scrollbar {
    display: none;
  }
  .site-qt--brand li.quicktile {
    min-width: 247px;
    max-width: 247px;
  }
}
