.home-banner-container {
  position: relative;
  width: 100%;
  height: 95vh;
  overflow: hidden;
}

.home-banner-container-overlay {
  position: absolute;
  inset: 0;
  margin: auto;
  object-fit: cover;
  background: RGBA(0, 0, 0, 6);
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0) 55%,
    rgba(0, 0, 0, 0) 100%
  );
}

.home-banner-container-image {
  position: absolute;
  inset: 0;
  margin: auto;
  object-fit: cover;
}

.categories-menu {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px 10px;
}

.footer-logo {
  max-width: 280px;
}

.logo-header img {
  width: 200px;
}

.icon-box img {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  width: 100%;
  height: auto;
  max-width: 40px;
  margin: 0 auto;
}

.flat-banner-parallax,
.page-title,
.blog-detail-wrap {
  position: relative;
}

.flat-banner-parallax-overlay,
.page-title-overlay,
.blog-detail-wrap .image-image-overlay {
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  inset: 0;
  margin: auto;
}

.flat-banner-parallax-overlay + .container,
.page-title-overlay + .container-full,
.page-title-overlay + .container,
.blog-detail-wrap + .inner {
  z-index: 2;
  position: relative;
}

.blog-detail-wrap .image {
  position: relative;
}

.blog-detail-wrap .image + .inner {
  position: relative;
  z-index: 3;
}

.blog-detail-wrap .image-image {
  position: absolute;
  inset: 0;
  margin: auto;
  object-fit: contain;
}

body:not(.home) .tf-topbar {
  display: none;
}

.header-white .logo-black,
.header-default .logo-white {
  display: none;
}

.header-default:not(.header-white) .logo-black,
.header-white .logo-white {
  display: block;
}

.single-produto .tf-product-info-price .compare-at-price {
  text-decoration: none;
}

#gridLayout {
  padding-top: 50px;
  border-top: 1px solid var(--line);
}

.subscribe-msg.success {
  color: green;
}

.subscribe-msg.error {
  color: red;
}
.subscribe-button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

#contact-msg.success {
  color: green;
}

#contact-msg.error {
  color: red;
}

.product-grid {
  grid-template-columns: repeat(4, 1fr);
}

.product-grid {
  grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 991px) {
  .product-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 767px) {
  .product-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 575px) {
  .product-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}