/*custom CSS*/
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');

:root {
  --padding-inline-small: 10px;
  --padding-inline-big: 40px;
  --shopIcon: #231611;
  --hamburgerIcon: #331812;
}

/* #header{
  display: none !important;
} */

.header-top {
  display: none !important;
}

.breadcrumb-bg.brleft.breadcrumb-full .container {
  padding: 0px !important;
}

.breadcrumb-bg {
  margin-bottom: 15px !important;
}

.breadcrumb li {
  margin: 0px 0px 0px 0px !important;
  &::after {
    content: '/';
  }

  a {
    padding: 0px 5px 0px 5px !important;
    &:first-of-type {
      padding-left: 0px !important;
    }
  }
}

#left-column {
  width: 100% !important;
}

.pagination {
  padding-inline: 30px;
}

.dropdown-menu-inner .row {
  display: flex;
}

.mega-col-inner {
  height: 100%;
}

.product-customization {
  display: none !important;
}

.breadcrumb-full {
  width: 100% !important;
}

/* .header-top {
  display: none !important;
} */

body {
  font-family: 'Lexend', sans-serif !important;
  color: inherit !important;
  line-height: inherit !important;
  scrollbar-gutter: stable both-edges;

  &.overflow-hidden {
    overflow-y: hidden !important;
    @media (min-width: 1200px) {
      padding-right: 10px !important;
    }
  }
}

#content-wrapper {
  width: 100% !important;
  &.js-content-wrapper {
    @media (max-width: 768px) {
      padding-inline: 0px !important;
    }
  }
}
.product-miniature {
  height: 100% !important;
}
#footer li {
  margin-bottom: 10px;
}

ul {
  list-style: none !important;
}

.line-though {
  text-decoration: line-through;
}

.hero-discount {
  background: #de2a2a 0% 0% no-repeat padding-box;
  border-radius: 58px;
  width: fit-content !important;
  display: flex;
  justify-content: center;
  align-items: center;

  position: relative;
  z-index: 2 !important;

  font-size: clamp(24px, 2vw, 28px) !important;
  line-height: clamp(24px, 2vw, 28px) !important;

  letter-spacing: 0px;
  padding: 4px 20px;

  .caption-contain {
    height: fit-content !important;
  }
}

.tp-caption {
  position: absolute !important;
  z-index: 2 !important;
}
.tp-caption:has(> .caption-contain > .content) {
  top: auto !important;
  bottom: 20% !important;
}

.slider-header-h1 {
  position: relative;
  z-index: 2 !important;

  font-size: clamp(48px, 5vw, 80px) !important;
  line-height: clamp(48px, 5vw, 80px) !important;
  font-family: inherit !important;
  letter-spacing: 0px;
  color: inherit !important;

  span {
    display: block;

    &.accent {
      display: inline-block;
      letter-spacing: 0px;
      font-size: clamp(48px, 5vw, 80px) !important;
      line-height: clamp(48px, 5vw, 80px) !important;
      font-family: inherit !important;
      background: #ff6a13 0% 0% no-repeat padding-box;
      padding: 4px;
    }
  }
}

.slider-date {
  position: relative;
  z-index: 2 !important;
  font-size: clamp(24px, 2vw, 28px) !important;
  line-height: clamp(24px, 2vw, 28px) !important;
  letter-spacing: 0px !important;
  color: inherit !important;
}

.thumbnail-container {
  margin-bottom: 0px !important;
  height: 100% !important;
  .product-image {
    height: 100% !important;
  }
}

.product_list {
  height: 100% !important;
}

.product_list li {
  padding-right: 0px !important;

  @media (max-width: 1199px) {
    padding-left: 0px !important;
  }
}

.no-padding {
  padding: 0px 0px 0px 0px !important;
}

.product_list li {
  article {
    height: 100% !important;
  }
  .product-meta {
    padding-bottom: 0px !important;
  }
}

.flex-stretch {
  align-items: stretch;
  width: 100% !important;
  & > div:last-of-type {
    & > div {
      height: 100%;
    }
  }

  @media (min-width: 1024px) {
    display: flex;
  }
}

.iview-items {
  text-align: start !important;
  padding-left: 5% !important;

  .iview-control {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    margin: 0 5px !important;
    border-radius: 100% !important;
    background: white !important;
    border: none !important;
    transition: none !important;
    opacity: 1 !important;

    &.active {
      border-radius: 4px !important;
      width: 21px !important;
      background: white !important;
    }

    @media (min-width: 1200px) {
      width: 15px !important;
      height: 15px !important;
      margin: 0 10px !important;

      &.active {
        width: 100px !important;
        height: 15px !important;
        border-radius: 8px !important;
      }
    }
  }
}

.ApSlideShow {
  min-height: 600px !important;
}

.bannercontainer {
  --containerHeight: 600px;
  height: 100% !important;

  .iview {
    height: var(--containerHeight) !important;

    .iviewSlider {
      height: var(--containerHeight) !important;

      width: 100% !important;
      transform-origin: 0 !important;
      transform: scale(1) !important;
      background-size: cover !important;
      background-position: top !important;

      .slide_config {
        height: var(--containerHeight) !important;

        &::after {
          content: '';
          position: absolute;
          inset: 0;
          background: transparent
            linear-gradient(180deg, #43392700 0%, #433927 100%) 0% 0% no-repeat
            padding-box;
          opacity: 0.41;
          z-index: 1;
        }

        .slider-image-container {
          width: 100% !important;
          inset: 0 !important;

          img {
            max-width: 100%;
            width: 100%;
            height: 100%;
            object-fit: cover;
          }

          &.slider-image-position-left {
            img {
              object-position: left !important;
            }
          }

          .caption-contain {
            width: 100% !important;
          }
        }
      }
    }

    .slider-image-container {
      height: var(--containerHeight) !important;
      .caption-contain {
        height: var(--containerHeight) !important;
      }
    }
  }
}

.all-blogs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;

  @media (min-width: 1200px) {
    grid-template-columns: repeat(3, 1fr);
  }
}

button {
  background-color: transparent;
  border: none;
  cursor: pointer;
}

figure {
  margin: 0px !important;
}

.leo-megamenu .navbar-nav {
  text-align: left !important;
}

.leo-megamenu .navbar-nav > li.aligned-fullwidth > .dropdown-menu {
  width: 100vw !important;
}

.leo-megamenu .dropdown-menu {
  left: -30px !important;
}

.leo-megamenu .navbar-nav > li {
  padding-right: 48px !important;

  &:first-of-type {
    padding-left: 0px !important;
  }
  &:last-of-type {
    padding-right: 0px !important;
  }

  & > a {
    padding: 20px 0px !important;
    &::after {
      display: none !important;
    }
  }
}

.menu-title::after,
.menu-title::before {
  display: none !important;
}

.leo-megamenu .navbar-nav > .nav-item {
  &.accent a {
    color: #de2a2a !important;
  }
  &.active {
    .nav-link {
      color: #e96f42 !important;
      font-weight: 700 !important;
      position: relative !important;

      &::before {
        content: '';
        position: absolute;
        bottom: 0px;
        left: 0;
        right: 0;
        height: 4px;
        background-color: #ff6a13;
      }
    }
  }
}
.dropdown-sub.dropdown-menu {
  min-height: 50vh !important;
  .dropdown-menu-inner {
    min-height: 50vh !important;
    .row {
      min-height: 50vh !important;
    }
  }
}

.mega-link {
  padding: 0px;
  margin-bottom: 20px;
  display: block;

  figure {
    padding: 0px;
    display: flex;
    align-items: center;
    gap: 20px;
    position: relative;

    transform: translate(0, 0);
    opacity: 1;

    img {
      width: 60px;
      height: 40px;
      object-fit: contain;
    }

    figcaption {
      display: flex;
      flex-direction: column;

      text-align: left;
      letter-spacing: 0px;
      color: #000000;

      span {
        &:first-of-type {
          font-size: 18px !important;
          line-height: 20px !important;
          font-weight: 500;
        }
        &:last-of-type {
          font-size: 14px !important;
          line-height: 20px !important;
        }
      }
    }
  }
}

.padding-inline-header {
  padding-inline: 30px;
}

.flex-center {
  display: flex;
  align-items: center;
}

.text-white,
.text-white a {
  color: white;
}

.padding-inline {
  padding-inline: var(--padding-inline-big);
}

.padding-start {
  padding-left: var(--padding-inline-small) !important;
  padding-right: var(--padding-inline-small) !important;

  &.mobile {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  @media (min-width: 1200px) {
    padding-left: var(--padding-inline-big) !important;
    padding-right: var(--padding-inline-big) !important;

    &.mobile {
      padding-left: 0px !important;
      padding-right: 0px !important;
    }
  }
}

.padding-top {
  padding-top: 30px;

  @media (min-width: 1200px) {
    padding-top: 60px;
  }
}

.padding-bottom {
  padding-bottom: 30px;

  @media (min-width: 1200px) {
    padding-bottom: 60px;
  }
}

.margin-block {
  padding-block: 30px;
}

.padding-block {
  padding-block: 30px;

  @media (min-width: 1200px) {
    padding-block: 60px;
  }
}

@media (max-width: 768px) {
  .row {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
}

.padding-none {
  padding: 0px 0px 0px 0px !important;

  & > div:first-child {
    padding: 0px 0px 0px 0px !important;
  }
}

.title-padding-bottom {
  padding-bottom: 15px !important;
}

.margin-none {
  margin: 0px 0px 0px 0px !important;

  & > .block {
    margin: 0px 0px 0px 0px !important;
  }

  .title_block {
    margin: 0px 0px 0px 0px !important;
  }
}

.ApProductList ul.product_list.grid > .ajax_block_product {
  width: 100% !important;
}

.title_block {
  text-align: start !important;

  font-size: 25px !important;
  line-height: 31px !important;

  letter-spacing: 0px !important;
  color: #260b01 !important;

  text-transform: initial !important;

  pointer-events: none !important;

  @media (min-width: 1200px) {
    font-size: 41px !important;
    line-height: 51px !important;
  }
}

.thumbnail-container {
  display: flex;
  flex-direction: column;
  .product-meta {
    flex-grow: 1;
  }
}

.owl-wrapper {
  display: flex !important;
  align-items: stretch !important;
  height: max-content !important;
}

.owl-theme .owl-controls .owl-page {
  span {
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    margin: 0 5px !important;
    border-radius: 100% !important;
    background: #59041e !important;
  }

  &.active {
    span {
      border-radius: 4px !important;
      width: 21px !important;
      background: #ff6a13 !important;
    }
  }

  @media (min-width: 1200px) {
    span {
      width: 15px !important;
      height: 15px !important;
      margin: 0 10px !important;
    }
    &.active {
      span {
        width: 100px !important;
        height: 15px !important;
        border-radius: 8px !important;
      }
    }
  }
}

.bg-gray {
  background-color: #260b0108;
}
.bg-white {
  background-color: #ffffff;
}
.bg-brown {
  background-color: #331812;
}

.owl-item .item,
.owl-item article,
.owl-item .thumbnail-container,
.owl-item .thumbnail-container .product-image {
  height: 100%;
}

.category-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-content: center;

  .category-label {
    --color: #000000;

    font-size: clamp(10px, 2vw, 12px) !important;
    line-height: clamp(10px, 2vw, 12px) !important;

    letter-spacing: 0px;
    text-transform: uppercase;

    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid var(--color);
    color: var(--color);
    padding: 3px 11px;
    width: fit-content;

    &[data-category='colchões'] {
      --color: #ff6a13;
    }

    &[data-category='almofadas'] {
      --color: #f5ba72;
    }

    &[data-category='lar'] {
      --color: #7bb55f;
    }

    &[data-category='camas'] {
      --color: #844739;
    }

    &[data-category='saúde'] {
      --color: #5fafb5;
    }

    &[data-category='conselhos'] {
      --color: #e96f42;
    }

    &.color-1 {
      --color: #f2a444;
    }
    &.color-2 {
      --color: #a6242f;
    }
    &.color-saúde {
      --color: #5fafb5;
    }
    &.color-4 {
      --color: #f5ba72;
    }
    &.color-conselhos {
      --color: #e96f42;
    }
    &.color-6 {
      --color: #7bb55f;
    }
    &.color-7 {
      --color: #ff6a13;
    }

    &.text-big {
      font: normal normal bold 13px/16px inherit;
      padding: 5px 19px;
    }
  }
}

.font-bold {
  font-weight: bold;
}

.aside-hero {
  position: relative;
  height: 100%;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: end;

  figure {
    position: absolute;
    inset: 0;
    z-index: 0;
    margin: 0;
    overflow: hidden;

    &.bg-contrast {
      &::after {
        content: '';
        position: absolute;
        inset: 0;
        background: transparent
          linear-gradient(180deg, #33181200 0%, #3318129c 100%) 0% 0% no-repeat
          padding-box;
      }

      & + .content {
        color: #ffffff;
      }
    }

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: relative;
      z-index: 0;
      transform: scale(1);
      transition: transform 0.3s linear;
    }
  }
  &:hover {
    figure img {
      transform: scale(1.1);
    }
  }

  .content {
    position: relative;
    z-index: 2;
    padding-inline: 10px;
    padding-bottom: 20px;

    color: #331812;

    @media (min-width: 1024px) {
      padding-inline: 23px;
    }

    h2 {
      font-size: clamp(18px, 2vw, 24px) !important;
      line-height: clamp(18px, 2vw, 24px) !important;
      letter-spacing: 0px;
      margin: 10px 0;
      color: inherit;
    }
    p {
      margin: 0;
      font-size: clamp(14px, 2vw, 16px) !important;
      line-height: clamp(14px, 2vw, 16px) !important;

      span {
        font-size: clamp(13px, 2vw, 15px) !important;
        line-height: clamp(13px, 2vw, 15px) !important;
        font-weight: 600;

        margin-left: 3px;
      }
    }
  }
}

.rounded-corners {
  border-radius: 23px;
}

.check-product {
  cursor: pointer;
  text-decoration: none;
  font-size: clamp(10px, 2vw, 14px) !important;
  line-height: clamp(10px, 2vw, 14px) !important;

  letter-spacing: 0px;
  color: #e6e6e6;
  background: #ff6a13 0% 0% no-repeat padding-box;
  border-radius: 19px;
  padding: 7px 27px;

  width: fit-content;
  transition: all 0.3s ease-in-out;
  &:hover {
    color: #fff;
    background: #ff6a13c9 0% 0% no-repeat padding-box;
  }
}

.discount-label {
  background: #de2a2a 0% 0% no-repeat padding-box;
  letter-spacing: 0px;
  text-transform: uppercase;
  color: #ffffff;

  position: absolute;
  z-index: 3;
  top: 10px;
  right: 10px;

  padding: 12px 10px;

  display: inline-block;

  &.small {
    padding: 8px 12px;
    font: normal normal normal 16px/20px inherit;
  }
  &.normal {
    font: normal normal normal 18px/23px inherit;
  }
  &.big {
    font: normal normal normal 28px/35px inherit;
  }
  &.static {
    position: static;
  }
}

.product-container-list-products {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 10px;

  .picture {
    margin-left: -10px;
    max-height: 710px;
    position: relative;
    img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
  }

  @media (min-width: 768px) {
    grid-template-columns: repeat(3, 1fr);

    .picture {
      margin-left: 0;
      grid-column: span 2;
    }
  }

  @media (min-width: 1200px) {
    grid-template-columns: repeat(4, 1fr);
    padding-inline: 30px;
  }

  .product {
    @media (max-width: 768px) {
      .product-content {
        padding-inline: 5px 0px;
      }
      .description {
        display: none;
      }
    }
  }
}

.product-bg-gray {
  .product {
    background-color: #f5f5f5;
    .product-content {
      background-color: #f5f5f5;
    }
  }
}

.product {
  background-color: white;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;

  .product-img {
    position: relative;
    margin: 0;
    overflow: hidden;
    min-height: 150px;
    max-height: 150px;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.01);
      transition: transform 0.3s linear;
      object-position: center;
    }

    @media (min-width: 768px) {
      min-height: 300px;
    }
  }

  &:hover {
    .product-img {
      img {
        transform: scale(1.1);
      }
      .wishlist {
        opacity: 1;
      }
    }
  }

  .product-content {
    padding: 24px 15px 21px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .description-content {
      color: #000000;
      letter-spacing: 0px;

      h3 {
        font-family: inherit !important;
        font-size: clamp(16px, 2vw, 20px) !important;
        line-height: clamp(20px, 2vw, 26px) !important;
        a {
          text-decoration: none;
          color: inherit;

          &:hover {
            color: #ff6a13;
          }
        }
      }

      .description {
        text-align: left;
        font-size: clamp(14px, 2vw, 16px) !important;
        line-height: clamp(18px, 2vw, 20px) !important;

        margin-block: 10px;
      }
    }

    .price-content {
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      margin-top: 8px;

      .price-tag {
        font-size: clamp(10px, 2vw, 12px) !important;
        line-height: clamp(10px, 2vw, 12px) !important;
        margin-bottom: 4px;
      }

      .price {
        margin-bottom: 10px;
        font-size: clamp(15px, 2vw, 20px) !important;
        line-height: clamp(15px, 2vw, 20px) !important;
        font-weight: 600;

        .before-price {
          text-decoration: line-through;
          font-size: clamp(13px, 2vw, 16px) !important;
          line-height: clamp(13px, 2vw, 16px) !important;
          color: #bf8161;
        }
      }
    }

    @media (min-width: 1200px) {
      padding: 31px 30px 28px;

      .price-content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin-top: 20px;
      }
    }
  }
}

.product-detail-name {
  font-size: clamp(22px, 2vw, 30px) !important;
  line-height: clamp(22px, 2vw, 30px) !important;
  font-weight: 600;
  color: #000000;
  font-family: inherit;
}

.description-short {
  font-size: clamp(15px, 2vw, 17px) !important;
  line-height: clamp(15px, 2vw, 17px) !important;
  font-weight: 400;
  color: #000000;
  font-family: inherit;
}

#logo-socials {
  #logo img {
    width: min(100%, 190px);
  }

  #socials {
    margin-top: 15px;
    display: flex;
    align-items: center;
    gap: 15px;

    img {
      width: 31px;
      height: 31px;
      object-fit: contain;
    }
  }
}

#payment-methods {
  display: grid;
  grid-template-columns: 1fr;
  height: fit-content;

  img {
    width: 200px;
    height: 60px;

    object-fit: contain;
  }

  div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    img {
      width: 60px;
      height: 60px;
      object-fit: cover;
    }
  }
}

#primary-footer,
#secondary-footer {
  padding: 30px var(--padding-inline-small);

  @media (min-width: 1200px) {
    padding: 20px 60px;
  }
}

#primary-footer {
  ul li {
    font: normal normal normal 17px/25px inherit !important;
  }
  @media (min-width: 1200px) {
    padding-block: 80px;
  }
}

#secondary-footer {
  background: #140f0d 0% 0% no-repeat padding-box;

  display: flex;
  flex-direction: column;
  gap: 2rem;

  text-align: left;
  letter-spacing: 0px;

  ul {
    list-style: none;

    li {
      margin-bottom: 15px;
      font-size: clamp(10px, 2vw, 12px) !important;
      line-height: clamp(10px, 2vw, 12px) !important;
      font-family: inherit !important;

      a {
        text-decoration: none;
      }

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  p {
    flex-grow: 1;
    font-size: clamp(10px, 2vw, 13px) !important;
    line-height: clamp(10px, 2vw, 13px) !important;
    font-family: inherit !important;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }

  @media (min-width: 768px) {
    flex-direction: row;
  }

  @media (min-width: 1200px) {
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;

    ul {
      display: flex;

      li {
        margin-bottom: 0;
        padding-inline: 10px;
        border-right: 1px solid white;
        &:last-child {
          border-right: none;
        }
      }
    }

    p {
      padding: 0;
      border: none;
    }
  }
}

#important-section {
  padding: 40px 0px var(--padding-inline-big);
  text-align: center;

  &::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    clip-path: polygon(0 0, 100% 0, 100% 50%, 0 65%);

    background: #ff6a13 0% 0% no-repeat padding-box;
  }

  h2 {
    font-size: clamp(30px, 3vw, 40px);
    line-height: clamp(30px, 2vw, 40px);

    position: relative;
    z-index: 1;

    color: #e6e6e6;
  }

  h3 {
    position: relative;
    z-index: 1;

    width: min(100%, 1000px);
    text-wrap: balance;
    margin-inline: auto;

    margin-top: 44px;

    font-size: clamp(20px, 2vw, 24px);
    line-height: clamp(20px, 2vw, 24px);

    font-weight: 400;

    color: #e6e6e6;

    span {
      position: relative;
      z-index: 1;
      display: block;

      color: inherit;

      font-size: clamp(21px, 2vw, 25px);
      line-height: clamp(21px, 2vw, 25px);
      font-weight: 700;
    }
  }

  .important-container {
    width: min(100%, 1400px);
    margin-inline: auto;
    margin-top: 30px;

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;

    position: relative;
    z-index: 1;

    .item {
      position: relative;
      z-index: 1;

      position: relative;

      width: 100%;
      height: 300px;

      display: flex;
      flex-direction: column;
      justify-content: end;

      figure {
        position: absolute;
        height: 100%;
        width: 100%;
        margin: 0px;
        overflow: hidden;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          transform: scale(1);
          transition: transform 0.3s linear;
        }
      }

      .content {
        position: relative;
        z-index: 1;

        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;

        padding: 20px 10px;

        p {
          font-size: 20px;
          line-height: 25px;
          margin: 0px;
          color: #ffffff;
        }

        a {
          font-size: 13px;
          line-height: 16px;
          text-align: center;
          color: #ffffff;
          white-space: nowrap;

          display: block;
          width: min(100%, 157px);
          padding: 7px 27px;

          background: #ff6a13 0% 0% no-repeat padding-box;
          border-radius: 19px;
        }
      }

      &:hover {
        figure img {
          transform: scale(1.1);
        }
      }
    }
  }

  @media (min-width: 768px) {
    .important-container {
      grid-template-columns: repeat(4, 1fr);
    }
  }

  @media (min-width: 1024px) {
    padding-inline: var(--padding-inline-big);

    .important-container {
      .item {
        height: 500px;
        .content {
          padding-bottom: 46px;
          gap: 25px;
          p {
            font-size: 31px;
            line-height: 39px;
          }

          a {
            font-size: 16px;
            line-height: 20px;
            padding: 9px 27px;
          }
        }
      }
    }

    &::after {
      clip-path: polygon(0 0, 100% 0, 100% 55%, 0 93%);
    }
  }

  @media (min-width: 1500px) {
    .important-container .item {
      height: 600px;
    }
  }
}

#health-highlight-section {
  display: grid;
  grid-template-columns: 1fr;

  @media (min-width: 768px) {
    grid-template-columns: 2fr minmax(300px, 1fr);
  }

  @media (min-width: 1024px) {
    grid-template-columns: 2fr minmax(500px, 1fr);
  }

  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  figure {
    height: 100%;
  }

  article:nth-child(2) {
    background: #ff6a13 0% 0% no-repeat padding-box;
    position: relative;
    padding: 50px 20px;

    h2 {
      text-align: left;
      font: normal normal 600 28px/31px Lexend;
      letter-spacing: 0px;
      color: #ffffff;
    }
    h3 {
      text-align: left;
      font: normal normal normal 19px/24px Lexend;
      letter-spacing: 0px;
      color: #e6e6e6;
      margin-block: 1rem;
    }

    p {
      text-align: left;
      a {
        font: normal normal normal 15px/19px Lexend;
        letter-spacing: 0px;
        color: #e6e6e6;
        text-decoration: underline;
      }
    }

    @media (min-width: 768px) {
      padding: 50px 100px;

      .content {
        position: absolute;
        min-width: 380px;
        top: 50%;
        right: 30px;
        transform: translate(0, -50%);

        h2 {
          text-align: right;
        }

        h3 {
          text-align: right;
          max-width: 240px;
          margin-left: auto;
          font: normal normal normal 14px/19px Lexend;
        }

        p {
          text-align: right;
          a {
            font: normal normal normal 14px/19px Lexend;
          }
        }
      }
    }
    @media (min-width: 1024px) {
      .content {
        min-width: 640px;
        right: 5.5vw;

        h2 {
          font: normal normal 600 50px/52px Lexend;
        }
        h3 {
          max-width: 360px;
          font: normal normal 600 18px/26px Lexend;
        }
        p a {
          font: normal normal normal 16px/26px Lexend;
        }
      }
    }
    @media (min-width: 1540px) {
      .content {
        min-width: 800px;
        right: 7vw;

        h2 {
          font: normal normal 600 60px/62px Lexend;
        }
        h3 {
          max-width: 355px;
          font: normal normal 600 20px/26px Lexend;
        }
        p a {
          font: normal normal normal 18px/26px Lexend;
        }
      }
    }
  }
}

.title-container {
  display: flex;
  gap: 1rem;
  padding-bottom: 28px;

  .limit {
    text-align: left;
    font: normal normal normal 16px/20px Lexend;
    letter-spacing: 0px;
    color: #ffffff;
    background: #ff6a13 0% 0% no-repeat padding-box;
    text-transform: uppercase;

    display: flex;
    justify-content: center;
    align-items: center;

    padding: 6px 12px;
  }
}

.benefits {
  background: rgba(140, 110, 93, 0.06) 0% 0% no-repeat padding-box;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  height: 100%;

  .benefits-img {
    margin: 0;
    max-height: 268px;
    min-height: 268px;
    width: 100%;

    overflow: hidden;

    @media (min-width: 1200px) {
      max-height: 420px;
      min-height: 420px;
    }

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.02);
      transition: transform 0.3s linear;
    }
  }

  .benefits-content {
    padding: 33px 21px;
    padding-bottom: 28px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    height: 100%;

    gap: 24px;

    .benefits-header {
      h3 {
        margin-top: 12px;
        text-align: left;
        font: normal normal bold 16px/25px Lexend;
        letter-spacing: 0px;
        color: #000000;
      }

      .description {
        text-align: left;
        font: normal normal normal 15px/19px Lexend;
        letter-spacing: 0px;
        color: #000000;
        margin-top: 15px;
        margin-bottom: 15px;
        max-width: 550px;
      }

      @media (min-width: 768px) {
        h3 {
          font: normal normal bold 20px/26px Lexend;
        }
      }
    }

    .benefits-footer {
      @media (min-width: 1024px) {
        display: flex;
        justify-content: space-between;
        align-items: center;

        .author-container {
          display: flex;
          align-items: center;
          gap: 36px;
        }
      }

      p {
        margin: 0;
      }
      .date {
        text-align: left;
        font: normal normal normal 13px/16px Lexend;
        letter-spacing: 0px;
        color: #000000;
        text-transform: uppercase;
      }

      .author {
        text-align: left;
        font: normal normal bold 13px/16px Lexend;
        letter-spacing: 0px;
        color: #000000;
        margin-block: 8px;
      }

      .time {
        display: flex;
        align-items: center;
        gap: 5px;
        margin: 0;

        img {
          width: 14px;
          height: 14px;
          object-fit: contain;
        }

        figcaption {
          text-align: left;
          font: normal normal normal 13px/16px Lexend;
          letter-spacing: 0px;
          color: #000000;
        }
      }
    }
  }

  &:hover {
    .benefits-img {
      img {
        transform: scale(1.1);
      }
    }

    .benefits-content .benefits-header h3 a {
      text-decoration: underline;
      text-underline-offset: 3px;
      text-decoration-thickness: 2px;
      color: #ff6a13;
      transition: all 0.3s linear;
    }
  }
}

#stores-map-section {
  position: relative;

  background: transparent
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.35) 0%,
      rgba(233, 150, 78, 0.35) 100%
    )
    0% 0% no-repeat padding-box;
  overflow: hidden;

  .cc-e-icon {
    pointer-events: none;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    right: 100%;
    transform: translateX(65%);

    @media (max-width: 1400px) {
      display: none;
    }
  }

  .stores-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;

    padding-inline: 20px;

    h2 {
      font: normal normal 600 22px/23px Lexend;
      letter-spacing: 0px;
      color: #331812;
      margin: 0;
    }

    span {
      &:first-of-type {
        font: normal normal 200 40px/51px Lexend;
        letter-spacing: 0px;
        color: #ff6a13;
      }
      &:last-of-type {
        font: normal normal 200 53px/81px Lexend;
        letter-spacing: 0px;
        color: #ff6a13;
      }
    }

    @media (min-width: 1024px) {
      margin-bottom: 100px;
      h2 {
        font: normal normal 600 66px/62px Lexend;
      }

      span {
        &:first-of-type {
          font: normal normal 200 110px/141px Lexend;
        }
        &:last-of-type {
          font: normal normal 200 150px/140px Lexend;
        }
      }
    }
  }

  .view-360-container {
    padding-inline: 33px;

    display: grid;
    gap: 18px;
    margin-top: 40px;
    margin-bottom: 82px;

    .view-360-item-more {
      background: #ff6a13 0% 0% no-repeat padding-box;
      border-radius: 40px;
      font: normal normal normal 15px/19px Lexend;
      letter-spacing: 0px;
      color: #ffffff;
      text-align: center;
      padding: 16.5px 0;
    }

    .view-360-item {
      width: 100%;
      text-align: center;

      display: flex;
      align-items: center;
      justify-content: start;

      background: #a6242f 0% 0% no-repeat padding-box;

      border-radius: 40px;
      font: normal normal normal 15px/19px Lexend;
      color: #ffffff;

      text-transform: uppercase;
      text-decoration: none;

      span {
        &:first-of-type {
          display: flex;
          align-items: center;
          justify-content: center;

          background: #59041e 0% 0% no-repeat padding-box;
          border-radius: 40px;
          height: 100%;
          padding: 5px 20px;
          img {
            width: 30px;
            height: 30px;
            object-fit: contain;
          }
        }
        &:last-of-type {
          flex-grow: 1;
          padding-right: 10px;
        }
      }
    }

    @media (min-width: 768px) {
      display: grid;
      grid-template-columns: repeat(3, 1fr);

      .view-360-item-more {
        grid-column: 3 span;
      }
      .view-360-item {
        font: normal normal normal 12px/19px Lexend;
      }
    }

    @media (min-width: 1024px) {
      grid-template-columns: repeat(4, 1fr);
      margin-bottom: 200px;

      .view-360-item-more {
        grid-column: 1 span;
      }
    }

    @media (min-width: 1200px) {
      padding-inline: var(--padding-inline-big);

      .view-360-item {
        font: normal normal normal 15px/19px Lexend;
      }
    }
  }

  .store-map-container {
    position: relative;

    padding-inline: 23px;
    padding-bottom: 100px;

    &::before {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 100%;
      z-index: 0;
      background-color: #331812;
      clip-path: polygon(0 55%, 100% 10%, 100% 100%, 0% 100%);

      @media (min-width: 768px) {
        clip-path: polygon(0 70%, 100% 15%, 100% 100%, 0% 100%);
      }

      @media (min-width: 1024px) {
        clip-path: polygon(0px 66%, 100% 22%, 100% 100%, 0% 100%);
      }

      @media (min-width: 1500px) {
        clip-path: polygon(0px 78%, 100% 10%, 100% 100%, 0% 100%);
      }
    }

    .stores-map {
      width: min(100%, 1200px);

      aspect-ratio: 16 / 9;

      margin: 0 auto;

      position: relative;

      #map-img {
        width: 100%;
        height: 100%;
        object-fit: fill;
        position: absolute;
        z-index: 0;
        pointer-events: none;
      }

      .store {
        --positionX: 0%;
        --positionY: 0%;

        position: absolute;
        top: var(--positionY);
        left: var(--positionX);

        z-index: 4;

        width: 15px;
        height: 15px;
        object-fit: fill;

        .store-icon {
          position: absolute;

          cursor: pointer;

          width: 15px;
          height: 18px;
          max-width: fit-content !important;
          bottom: 60%;
          left: -30%;
          object-fit: contain;

          z-index: 4;

          &:first-of-type {
            z-index: 2;
          }

          &:last-of-type {
            z-index: 1;
          }
        }

        &:nth-child(odd) {
          z-index: 3;
        }

        &.store-selected {
          z-index: 5;

          .store-icon:first-of-type {
            z-index: 1;
          }
        }

        .popup {
          position: absolute;

          background: #ffffff 0% 0% no-repeat padding-box;
          border-radius: 35px;

          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
          padding: 48px 43px 30px 26px;

          text-align: left;
          font: normal normal normal 18px/24px Lexend;
          letter-spacing: 0px;

          .close-popup-btn {
            width: 20px;
            height: 20px;
            position: absolute;
            top: 20px;
            right: 29px;

            img {
              width: 100%;
              height: 100%;
              object-fit: fill;
            }
          }

          .phone {
            margin-top: 16px;
          }

          .popup-accent {
            color: #ff6a13;
          }

          width: 400px;

          z-index: 100 !important;
          visibility: hidden;
          opacity: 0;
          transition: opacity 0.3s, visibility 0.3s;

          &.top {
            bottom: calc(200% + 20px);

            &::after {
              bottom: -5px;
              left: 50%;
              margin-left: -5px;
            }
          }

          &.bottom {
            top: 100%;

            &::after {
              top: -5px;
              left: 50%;
              margin-left: -5px;
            }
          }

          &.right {
            left: 0;

            &::after {
              left: 10%;
            }
          }

          &.left {
            right: 0;

            &::after {
              left: 90%;
            }
          }

          &::after {
            content: '';
            position: absolute;
            width: 10px;
            height: 10px;
            background: white;
            transform: rotate(45deg);
          }
        }

        &.store-selected .popup {
          visibility: visible;
          opacity: 1;
        }

        @media screen and (max-width: 1200px) {
          .popup {
            display: none;
          }
        }

        @media screen and (orientation: landscape), (min-width: 768px) {
          top: calc(var(--positionY) + 1.2%);
        }

        @media screen and (min-width: 768px) {
          .store-icon {
            width: 20px;
            height: 25px;
          }
        }

        @media screen and (min-width: 1024px) {
          .store-icon {
            width: 30px;
            height: 35px;
          }

          top: calc(var(--positionY) + 1.8%);
          left: calc(var(--positionX) - 0.8%);
        }
      }
    }
  }
}

#desktop-nav {
  position: fixed;
  z-index: 100000000000001;

  inset: 0;
  height: 100vh;
  pointer-events: none;

  @media (orientation: portrait) {
    display: none;
  }

  .menu {
    padding: 120px 35px 35px;
    background: #362623 0% 0% no-repeat padding-box;
    position: fixed;
    z-index: 10001;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100vh;
    opacity: 0;

    transition: opacity 0.3s linear;

    button {
      position: absolute;
      top: 20px;
      right: 45px;
    }

    figure {
      padding-bottom: 45px;
    }

    .socials {
      display: flex;
      gap: 1rem;
      align-items: center;
      padding-top: 50px;
    }
  }

  .bg {
    background: #000000 0% 0% no-repeat padding-box;
    opacity: 0;
    position: fixed;
    z-index: 999;
    height: 100vh;
    inset: 0;

    transition: opacity 0.3s linear;
  }

  &.open {
    pointer-events: all;
    .bg {
      opacity: 0.58;
    }
    .menu {
      opacity: 1;
    }
  }
}
.page-heading.product-listing {
  padding: 0px 30px !important;
}

.page-heading.product-listing + #products #filter-open-btn,
.head-leosearch-product + #products #filter-open-btn {
  display: none !important;
}

.toggle-search-container {
  cursor: pointer !important;
}
.search-in-suggest,
.search-in-cat {
  .search-value-title,
  ul {
    padding: 10px 30px;
  }
}
#search-container {
  position: fixed;
  z-index: 100000000000002;
  inset: 0;
  padding: 20px;
  padding-top: 60px;
  display: none;

  &.open {
    display: block;
  }

  #search-container-bg {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
  }

  .leoproductsearch-content {
    max-width: 1000px;
    margin: 0 auto;
  }
}

#header {
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;

  z-index: 9999999;

  &:has(.top-header.hide:not(.scroll)) {
    pointer-events: none;
  }

  .top-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;

    position: relative;
    z-index: 100000;

    background-color: white;

    padding-inline: 20px;

    @media (min-width: 1024px) {
      border-bottom: 1px solid rgba(38, 11, 1, 0.2);
      padding: 0 30px;
    }

    .mobile-btn-logo {
      display: flex;
      align-items: center;
      gap: 10px;
      overflow: hidden;

      button {
        padding: 0px 0px 0px 0px !important;
      }

      figure {
        padding-block: 15px;
        transition: transform 0.3s linear, opacity 0.3s linear;
        margin: 0px;

        img {
          padding-top: 5px;
          width: 270px;
          height: auto;
        }
      }
      @media (min-width: 1024px) {
        button {
          display: none;
        }
      }

      .header-nav-links {
        display: none;
      }
    }

    &.v-2 {
      .mobile-btn-logo figure {
        position: absolute;
        transform: translateY(-100%);
        opacity: 0;
      }
      .header-nav-links {
        display: flex;
      }

      &:not(.scroll) {
        .mega-menu {
          opacity: 0;
          pointer-events: none;
          .mega-menu-content {
            pointer-events: none;
          }
        }
      }
    }

    transition: transform 0.3s linear;

    &.hide {
      transform: translateY(-100%);

      &.scroll {
        transform: translateY(0);
      }

      & ~ #desktop-nav-bar {
        transform: translateY(-200%);

        .mega-menu {
          opacity: 0;
          pointer-events: none;
          .mega-menu-content {
            pointer-events: none;
          }
        }
      }
    }

    @media (orientation: portrait) and (min-width: 768px) {
      transform: translateY(0) !important;
      .mobile-btn-logo figure {
        position: static !important;
        transform: translateY(0) !important;
        opacity: 1 !important;
      }
      .header-nav-links {
        display: none !important;
      }
    }
  }

  .header-svg {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 30px;

    figure {
      img {
        width: auto;
        height: 22px;
      }
    }

    @media (max-width: 1023px) {
      figure:nth-of-type(1),
      figure:nth-of-type(3),
      button {
        display: none;
      }
    }
  }

  #mobile-nav {
    position: fixed;
    z-index: 100;
    inset: 0;
    height: 100dvh;

    padding-top: 55px;
    padding-bottom: 16px;
    background-color: white;

    overflow-y: scroll;

    transform: translateX(-100%);
    opacity: 0;

    transition: transform 0.3s linear;

    &.open {
      opacity: 1;
      transform: translateX(0);
    }

    .menu {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      .item {
        --border-color: rgba(112, 112, 112, 0.2);
        background: #ffffff 0% 0% no-repeat padding-box;
        border: 1px solid var(--border-color);
        border-bottom: 0;

        display: flex;
        align-items: center;
        justify-content: center;

        min-height: 200px;

        font: normal normal 600 21px/26px Lexend;
        letter-spacing: 0px;
        color: #584a45;

        text-decoration: none;
        text-align: center;

        &.active {
          color: #ff6a13;
        }

        img {
          width: 77px;
          margin-bottom: 30px;

          &.emma,
          &.tempur,
          &.bsensible {
            margin-bottom: 0;
          }
          &.lar {
            margin-bottom: 18px;
          }

          &.tempur {
            width: 130px;
          }

          &.bsensible {
            width: 100%;
          }
        }

        &:nth-child(even) {
          border-left: none;
        }

        &:nth-child(7) {
          border-bottom: 1px solid var(--border-color);
        }

        figure {
          margin: 0;
        }
      }
    }

    @media (orientation: landscape) and (min-width: 768px) {
      display: none;
    }
  }

  #desktop-nav-bar {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 0 30px;

    transition: transform 0.3s linear;

    border-bottom: 1px solid rgba(38, 11, 1, 0.2);
    background-color: white;

    @media (max-width: 1023px) {
      display: none;
    }
  }
}

.nav-toggle {
  span {
    background: var(--hamburgerIcon);
    height: 2px;
    display: block;

    transition: all 0.3s linear;

    &:nth-child(1) {
      width: 11px;
    }
    &:nth-of-type(2) {
      width: 18px;
      margin-block: 4px;
    }
    &:last-of-type {
      width: 25px;
    }
  }

  &.white {
    span {
      background-color: white;
    }
  }

  &.open {
    span {
      &:nth-child(1) {
        transform: rotate(45deg) translate(25%, 2px);
        width: 25px;
      }
      &:nth-of-type(2) {
        opacity: 0;
      }
      &:last-of-type {
        transform: rotate(-45deg) translate(25%, -2px);
      }
    }

    &.right {
      span {
        &:nth-child(1) {
          transform: rotate(45deg) translate(25%, 2px);
          width: 25px;
        }
        &:nth-of-type(2) {
          opacity: 0;
        }
        &:last-of-type {
          transform: rotate(-45deg) translate(25%, -2px);
        }
      }
    }
  }

  &.right {
    span {
      margin-left: auto;
    }
  }
}

.secondary-menu {
  .item {
    --border-color: rgba(38, 11, 1, 0.2);
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 25px 10px;

    border-top: 1px solid var(--border-color);

    text-decoration: none;

    p {
      margin: 0;
      text-align: left;
      font: normal normal normal 21px/26px Lexend;
      letter-spacing: 0px;
      color: #584a45;
    }

    &:last-child {
      border-bottom: 1px solid var(--border-color);
    }

    &.active {
      p {
        color: #ff6a13 !important;
      }
    }
  }

  &.desktop {
    min-width: 450px;

    .item {
      --border-color: rgba(250, 250, 250, 0.2);

      p {
        color: white;
      }

      &:first-child {
        border-top: 1px solid transparent;
      }
      &:last-child {
        border-bottom: 1px solid transparent;
      }
    }
  }
}

.header-nav-links {
  display: flex;
  align-items: center;
  list-style: none;
  gap: 20px;

  li {
    a {
      text-align: left;
      font: normal normal normal 16px/26px Lexend;
      letter-spacing: 0px;
      color: #331812;
      text-decoration: none;
      padding-block: 15px;
      display: block;

      &.accent {
        color: #de2a2a;
        font-weight: bold;
      }

      &.active {
        border-bottom: 4px solid #e96f42;
        font: normal normal bold 21px/26px Lexend;
        letter-spacing: 0px;
        color: #ff6a13;
      }
    }

    &.active {
      color: #de2a2a;
    }
  }

  &.phone-stores {
    li {
      a {
        text-align: left;
        font: normal normal normal 15px/20px Lexend;
        font-weight: 600;
        letter-spacing: 0px;
        color: #311d19;
      }

      &:nth-child(2) {
        height: fit-content;

        background: #ff6a13 0% 0% no-repeat padding-box;
        border-radius: 23px;
        font: normal normal normal 15px/20px Lexend;
        letter-spacing: 0px;
        color: #ffffff;

        display: flex;
        align-items: center;
        gap: 1rem;

        padding: 5px 24px;

        a {
          color: #ffffff;
          padding-block: 0px;
        }

        img {
          width: 20px;
          height: 20px;
          object-fit: contain;
        }
      }
    }
  }
}

.second-header-svg {
  display: none !important;
}

#header {
  transform: translateY(0%);
  transition: transform 0.3s linear;

  &.scroll-hide {
    pointer-events: none;

    .dropdown-sub.dropdown-menu {
      pointer-events: none;
    }

    transform: translateY(-100%);
  }

  &.scrolled {
    .bottomnav .header-nav-links {
      display: none !important;
    }
    .second-header-svg {
      display: flex !important;
    }
  }

  &.scroll-half {
    transform: translateY(-50%);
  }

  .bottomnav .header-nav-links {
    justify-content: end;
  }

  @media (max-width: 1200px) {
    .bottomnav {
      display: none;
    }
  }
}

#about-us-hero-section {
  padding-block: 25px 140px;

  @media (min-width: 1024px) {
    padding: 80px var(--padding-inline-big);
  }

  #hero-image {
    @media (max-width: 760px) {
      margin-left: -10px;
      margin-right: -10px;
      width: calc(100% + 20px) !important;
      max-width: calc(100% + 20px) !important;
    }
  }

  img {
    height: 300px;
    object-fit: cover;
    margin-bottom: 100px;
  }

  article:nth-child(2) {
    padding: 0px 10px;
  }

  @media (min-width: 1024px) {
    img {
      height: auto;
    }
  }
}

.highlight-section {
  background: #ff6a13 0% 0% no-repeat padding-box;
  padding: 130px 10px;
}
#partners-section {
  padding-block: 181px 134px;
  padding-inline: 10px;

  .partners-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;

    margin-block: 98px;

    .partner {
      text-align: center;
      background: #ffffff 0% 0% no-repeat padding-box;
      border: 9px solid #f8f6f5;
      padding: 0px 20px;
      padding-bottom: 40px;

      display: flex;
      flex-direction: column;

      figure {
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: center;
        gap: 80px;

        height: 350px;

        margin-bottom: 22px;

        img {
          width: 80%;
          height: 200px;
          margin-top: 80px;
          object-fit: contain;
        }
      }

      hr {
        width: 100%;
        border: 1px solid #f8f6f5;
      }

      .partner-content {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 10px;
      }

      h3 + p {
        margin-bottom: 22px;
      }

      p:last-of-type {
        flex-grow: 1;
      }
    }

    @media (min-width: 768px) {
      grid-template-columns: repeat(2, 1fr);
    }
    @media (min-width: 1440px) {
      grid-template-columns: repeat(3, 1fr);
    }
  }

  @media (min-width: 1024px) {
    padding-inline: 140px;
  }
}

#more-about-us {
  padding-inline: 10px;

  @media (min-width: 1024px) {
    padding-inline: var(--padding-inline-big);
  }
}

.title {
  color: #231611;
  letter-spacing: 0px;
  text-wrap: balance;

  &.title-primary {
    font-size: clamp(26px, 2vw, 30px);
    line-height: clamp(26px, 2vw, 30px);
  }

  &.title-secondary-1 {
    font-size: clamp(22px, 2vw, 26px);
    line-height: clamp(22px, 2vw, 26px);
  }

  &.title-secondary-2 {
    font-size: clamp(18px, 2vw, 22px);
    line-height: clamp(18px, 2vw, 22px);
  }

  &.title-secondary-4 {
    font: normal normal bold 24px/41px Lexend;
  }

  &.title-secondary-5 {
    font: normal normal bold 20px/41px Lexend;
  }

  &.title-secondary-3 {
    font: normal normal 300 130px/163px Lexend;
  }
  &.title-center {
    text-align: center;
  }
  &.title-white {
    color: #ffffff;
  }
}

.text {
  color: #000000;
  letter-spacing: 0px;

  &.text-primary {
    font-size: clamp(14px, 2vw, 16px);
    line-height: clamp(16px, 2vw, 18px);
  }

  &.text-center {
    text-align: center;
  }

  &.text-white {
    color: #ffffff;
  }
  &.text-accent {
    color: #ff6a13;
  }
}

.width-1200 {
  width: min(100%, 1200px);
  margin-inline: auto !important;
}

.figure {
  .image-full {
    width: 100%;
  }
}

#google-maps-section {
  display: grid;
  grid-template-columns: 1fr;

  overflow: hidden;

  #map-container {
    width: 100%;
    min-height: 400px;
    height: 100%;
    position: relative;

    &.loading .loader {
      display: flex;
    }

    .loader {
      display: none;
      position: absolute;
      inset: 0;
      align-items: center;
      flex-direction: column;
      justify-content: center;
      gap: 15px;
      text-transform: uppercase;
      padding: 10px;
      z-index: 2;
      background-color: rgba(255, 255, 255, 0.8);
    }

    #map {
      width: 100%;
      height: 100%;

      .phone {
        margin-block: 16px;
      }

      .popup-accent {
        color: #ff6a13;
      }
    }
  }

  #google-maps-stores {
    padding: 10px;

    .google-maps-search {
      form {
        display: flex;
        flex-wrap: wrap;

        gap: 10px;
        margin-block: 10px 20px;

        input {
          flex-grow: 1;
          padding: 10px 20px;
          border: 1px solid #231611;
          border-radius: 23px;
        }

        button {
          background: #ff6a13 0% 0% no-repeat padding-box;
          border-radius: 23px;
          padding-block: 10px;
          padding-inline: 23px 20px;
          color: #ffffff;
          font: normal normal normal 16px/20px Lexend;
          letter-spacing: 0px;
          cursor: pointer;

          &#clean-button {
            background: #231611;
          }
        }
      }
    }

    .google-maps-stores-container {
      display: grid;
      gap: 18px;

      overflow-y: scroll;

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

      -ms-overflow-style: none; /* Internet Explorer 10+ */
      scrollbar-width: none; /* Firefox */

      height: 70dvh;

      scroll-behavior: smooth;
      padding-bottom: 25px;

      .google-maps-store {
        cursor: pointer;
        background: rgba(140, 110, 93, 0.06) 0% 0% no-repeat padding-box;
        padding: 20px;
        border-radius: 23px;
        height: fit-content;

        display: grid;
        grid-template-areas:
          'store-title store-title'
          'store-location store-location'
          'store-time store-time';

        gap: 15px;

        font: normal normal normal 16px/23px Lexend;
        letter-spacing: 0px;
        color: #231611;

        h2 {
          grid-area: store-title;
          font: normal normal bold 20px/28px Lexend;
          color: inherit;
        }

        .store-location {
          grid-area: store-location;
          padding-right: 20px;

          display: flex;
          flex-direction: column;
          justify-content: space-evenly;
          gap: 10px;

          .address-link {
            color: #e96f42;
          }
        }

        .store-time {
          grid-area: store-time;

          ul {
            list-style: none;
            text-transform: capitalize;

            li {
              margin-bottom: 5px;
              display: flex;
              align-items: center;
              justify-content: space-between;
              gap: 15px;
              font-size: 14px;
              text-wrap: nowrap;
            }
          }
        }

        .phone {
          background: #ff6a13 0% 0% no-repeat padding-box;
          padding: 5px 22px;
          border-radius: 23px;
          width: fit-content;
          gap: 10px;

          color: #ffffff;
          display: flex;
          align-items: center;

          img {
            width: 24px;
            height: 24px;
            object-fit: contain;

            &:last-of-type {
              display: none;
            }
          }
        }

        &.selected {
          background: #ff6a13 0% 0% no-repeat padding-box;
          color: #ffffff;

          .address-link {
            color: #ffffff;
          }
          .phone {
            background-color: white;
            color: #e96f42;
            img {
              &:first-of-type {
                display: none;
              }
              &:last-of-type {
                display: block;
              }
            }
          }
        }

        &.loader {
          display: none;
        }
      }

      &.loading .loader {
        display: flex;
        align-items: center;
        gap: 10px;
        opacity: 0;
        animation: loadingContainer 1s infinite alternate;
      }
    }
  }

  @media screen and (min-width: 1024px) {
    grid-template-columns: 1fr 1fr;
    height: 88dvh;
    gap: 20px;

    .google-maps-store {
      grid-template-areas:
        'store-title store-title'
        'store-location store-time' !important;
    }
    .google-maps-stores-container {
      height: 76dvh !important;
    }
  }

  @media (min-width: 1440px) {
    grid-template-columns: 1.8fr 1fr;
    gap: 20px;
    .google-maps-store {
      h2 {
        font-size: 24px !important;
      }
    }
  }
}
.gm-style-iw-d {
  overflow: visible !important;
}
@keyframes loadingContainer {
  0% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

#more-stores-360-view {
  background: #ff6a13 0% 0% no-repeat padding-box;
  padding: var(--padding-inline-big) 10px;
  article {
    width: min(100%, 1000px);
    margin: 0 auto;
    text-align: center;
    color: white;

    h1 {
      font: normal normal bold 26px/33px Lexend;
      margin-bottom: 20px;
      color: inherit;

      & + p {
        font: normal normal normal 17px/21px Lexend;
        margin-bottom: 20px;
      }
    }

    figure {
      img {
        width: 100%;
        max-width: 90px;
      }
      figcaption {
        font: normal normal normal 18px/18px Lexend;
        margin-block: 12px;

        span {
          display: inline-block;
          transform: translate(2px, -5px);
        }
      }
    }

    .more-360-container {
      p {
        font: normal normal normal 14px/21px Lexend;
        margin-bottom: 20px;
      }

      .more-306-items {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;

        gap: 20px;
        width: min(100%, 800px);
        margin-top: 20px;
        margin-inline: auto;

        .view-360-item {
          max-width: 250px;
        }
      }
    }

    @media screen and (min-width: 1024px) {
      padding-block: var(--padding-inline-big);

      h1 {
        font: normal normal bold 46px/58px Lexend;

        & + p {
          font: normal normal normal 25px/31px Lexend;
        }
      }
      figure {
        margin-block: 50px;
        figcaption {
          font: normal normal normal 23px/29px Lexend;
        }
      }
      .more-360-container {
        p {
          font: normal normal normal 18px/23px Lexend;
          margin-block: 30px;
        }
      }
    }
  }
}
.view-360-item {
  width: 100%;
  text-align: center;

  display: flex;
  align-items: center;
  justify-content: start;

  background: #a6242f 0% 0% no-repeat padding-box;

  border-radius: 40px;
  font: normal normal normal 15px/19px Lexend;
  color: #ffffff;

  text-transform: uppercase;
  text-decoration: none;

  span {
    &:first-of-type {
      display: flex;
      align-items: center;
      justify-content: center;

      background: #59041e 0% 0% no-repeat padding-box;
      border-radius: 40px;
      height: 100%;
      padding: 5px 20px;
      img {
        width: 30px;
        height: 30px;
        object-fit: contain;
      }
    }
    &:last-of-type {
      flex-grow: 1;
      padding-right: 10px;
    }
  }
}

#news-letter-section {
  padding: var(--padding-inline-big) 10px;

  @media (min-width: 768px) {
    padding-left: calc(var(--padding-inline-big) + 2rem);
    margin-top: var(--padding-inline-big);
  }

  @media (min-width: 1024px) {
    padding-inline: 0px;
  }

  article {
    display: flex;
    flex-direction: column;

    @media (min-width: 768px) {
      flex-direction: row;
    }

    @media (min-width: 1024px) {
      padding-left: calc(3rem + 50px);
    }
  }

  figure {
    display: flex;
    align-items: center;

    position: relative;

    @media (min-width: 768px) {
      background: rgba(242, 164, 68, 0.31) 0% 0% no-repeat padding-box;
    }

    img {
      width: 180px;

      @media (min-width: 768px) {
        position: absolute;
        right: 100%;
        transform: translateX(50%);
        bottom: 0;
      }
    }
    figcaption {
      padding-right: 20px;

      @media (min-width: 768px) {
        padding-right: 0px;
        padding-left: 80px;
      }

      @media (min-width: 1024px) {
        padding-left: 90px;
      }

      h2 {
        text-align: left;
        font: normal normal bold 22px/32px Lexend;
        letter-spacing: 0px;
        color: #d93636;
        margin: 0;
      }

      p {
        text-align: left;
        font: normal normal normal 14px/20px Lexend;
        letter-spacing: 0px;
        color: #331812;
        margin: 0;
      }

      @media (min-width: 1024px) {
        h2 {
          font: normal normal bold 32px/33px Lexend;
        }

        p {
          font: normal normal normal 20px/29px Lexend;
          padding-right: 20px;
        }
      }
    }
  }

  .form-container {
    background: #f2a4444f 0% 0% no-repeat padding-box;
    padding: 34px 22px;
    width: 100%;

    @media (max-width: 768px) {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    }

    h2 {
      text-align: center;
      font: normal normal 600 17px/22px Lexend;
      letter-spacing: 0px;
      color: #d93636;

      @media (min-width: 768px) {
        font: normal normal 600 20px/30px Lexend;
        margin-bottom: 20px;
      }
    }

    .form-field {
      position: relative;
      width: min(100%, 650px);

      input[type='email'] {
        width: 100%;
        border: none;
        background: #ffffff 0% 0% no-repeat padding-box;
        border-radius: 30px;
        padding: 13px 22px;

        text-align: left;
        font: normal normal normal 15px/34px Lexend;
        letter-spacing: 0px;
        color: #000000;

        &::placeholder {
          text-align: left;
          font: normal normal normal 15px/34px Lexend;
          letter-spacing: 0px;
          color: #000000;
        }
      }

      button {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;

        background: #e96f42 0% 0% no-repeat padding-box;
        border-radius: 30px;

        text-align: left;
        font: normal normal normal 14px/32px Lexend;
        letter-spacing: 0px;
        color: #ffffff;

        padding-inline: 30px;
      }
    }
  }
}

#search_filters .facet {
  border-bottom: none !important;
}

#search_filters .facet .facet-title {
  font-weight: 700 !important;
  text-transform: capitalize;

  font-size: 19px !important;
  line-height: 24px !important;

  color: #000000 !important;
}

.products-sort-order .select-title {
  max-width: 250px;
}

.magnitude {
  display: none !important;
}

#search_filters .facet-label {
  font-size: 10px !important;
  padding-right: 0px !important;
  .custom-checkbox input[type='checkbox'] + span,
  .custom-checkbox input[type='radio'] + span {
    border-radius: 4px;
    margin-right: 4px !important;
  }

  @media (min-width: 768px) {
    font-size: 14px !important;
    .custom-checkbox input[type='checkbox'] + span,
    .custom-checkbox input[type='radio'] + span {
      margin-right: 10px !important;
    }
  }

  &.active {
    .custom-checkbox input[type='checkbox'] + span,
    .custom-checkbox input[type='radio'] + span {
      background-color: #ff6a13 !important;
      border: none !important;
      outline: 1px solid #ff6a13 !important;
      outline-offset: 2px;
    }
  }
}

#search_filters .facet .collapse:not(.faceted-slider) {
  display: grid !important;
  max-height: none !important;
  overflow: unset !important;
  grid-template-columns: 1fr 1fr;
}

#search_filters {
  overflow: hidden;
  max-height: 0px;

  transition: all 0.3s linear;

  &.open {
    max-height: 800px;
    border-bottom: 1px solid rgba(38, 11, 1, 0.2);
    margin-bottom: 20px;
    @media (min-width: 768px) {
      max-height: 400px;
    }
  }
}

.filter-container {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;

  @media (min-width: 768px) {
    grid-template-columns: 1fr 2fr;
  }
}

#filter-open-btn {
  font: normal normal normal 13px/16px Lexend;
  letter-spacing: 0px;
  color: #584a45;
  transition: color 0.3s linear;

  display: flex;
  align-items: center;

  img {
    width: 15px;
    transition: all 0.3s linear;
  }

  &.active {
    font-weight: bold;
    color: #ff6a13;

    img {
      transform: rotate(180deg);
    }
  }
}

.personalized-sizes-container {
  position: fixed;
  inset: 0;
  z-index: 10000000000000;

  pointer-events: none;
  opacity: 0;

  &.personalized-sizes-container-open {
    pointer-events: all;
    opacity: 1;
  }

  .personalized-sizes-container-bg {
    position: fixed;
    inset: 0;
    background: #000000 0% 0% no-repeat padding-box;
    opacity: 0.58;
  }

  .personalized-sizes-container-sizes {
    overflow-y: scroll;

    position: relative;

    width: min(100%, 1300px);
    height: 100dvh;
    max-height: 100dvh;

    background: #ffffff 0% 0% no-repeat padding-box;

    display: grid;
    gap: 10px;

    .personalized-sizes-container-h3 {
      text-align: left;
      font: normal normal bold 28px/35px Lexend;
      letter-spacing: 0px;
      color: #231611;
    }

    .personalized-sizes-container-p {
      font: normal normal normal 16px/20px Lexend;
      letter-spacing: 0px;
      color: #000000;
    }

    .personalized-sizes-container-h4 {
      text-align: left;
      font: normal normal bold 23px/29px Lexend;
      letter-spacing: 0px;
      color: #ff6a13;

      margin-block: 10px;
    }

    .personalized-sizes-container-start,
    .personalized-sizes-container-end {
      padding: 30px 10px;
      position: relative;
    }

    .personalized-sizes-container-close {
      position: absolute;
      top: 15px;
      right: 10px;
      margin: 0;
      z-index: 10;
    }

    .personalized-sizes-container-start {
      .sizes-container {
        margin-top: 20px;
        margin-bottom: 30px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;

        label {
          cursor: pointer;
          display: flex;
          align-items: center;
          justify-content: center;
          width: 100%;
          height: 100%;
          padding: 10px 0px;
          background: #ffffff 0% 0% no-repeat padding-box;
          text-align: center;
          font: normal normal normal 16px/20px Lexend;
          letter-spacing: 0px;
          color: #231611;
          border: 1px solid #231611;

          transition: background 0.3s linear, border 0.3s linear,
            color 0.3s linear;

          &:hover {
            border: 1px solid #ff6a13;
            color: #ff6a13;
          }

          &.checked {
            background: #ff6a13 0% 0% no-repeat padding-box;
            border: 1px solid #ff6a13;
            color: #ffffff;
          }
        }

        input {
          display: none;
        }
      }
    }
    .personalized-sizes-container-end {
      background: #f8f7f7 0% 0% no-repeat padding-box;

      .match-results-container {
        margin-top: 63px;
        margin-bottom: 30px;
        padding-bottom: 56px;

        border-bottom: 1px solid rgba(38, 11, 1, 0.2);

        display: grid;
        grid-template-columns: 1fr min-content 1fr min-content 1fr;
        gap: 10px;
        text-align: center;

        .personalized-sizes-container-h5 {
          font: normal normal bold 14px/20px Lexend;
          letter-spacing: 0px;
          color: #231611;
        }

        .match-results-container-span {
          text-align: center;
          font: normal normal normal 8px/8px Lexend;
          letter-spacing: 0px;
          color: #ff6a13;

          &.match-results-container-hidden {
            opacity: 0;
          }
        }

        .match-results-input-container {
          position: relative;

          button {
            position: absolute;
            right: 1px;

            margin: 0;
            width: 20px;
            padding: 0px !important;
            height: 50%;

            background-color: transparent;

            img {
              width: 100%;
              height: 100%;
            }

            &.minus {
              bottom: 1px;
              border-bottom-right-radius: 10px;
            }

            &.plus {
              top: 1px;
              border-top-right-radius: 10px;
            }
          }
        }

        input {
          width: 100%;
          text-align: center;
          height: 46px;

          background: #ffffff 0% 0% no-repeat padding-box;
          border: 1px solid #231611;

          font: normal normal normal 24px/30px Lexend;
          letter-spacing: 0px;
          color: #000000;

          &.disabled {
            background: #efefef 0% 0% no-repeat padding-box;
            pointer-events: none;
          }
          &.input-fail {
            border: 1px solid red !important;
          }
        }

        .match-x {
          display: flex;
          flex-direction: column;
          justify-content: end;

          p {
            height: 46px;
            margin: 0px 0px 0px 0px !important;
          }
        }
      }

      .sizes-info {
        text-align: left;
        font: normal normal normal 18px/23px Lexend;
        letter-spacing: 0px;
        color: #000000;

        .sizes-info-accent {
          color: #ff6a13;
        }
      }

      .check-product {
        width: fit-content;
        display: block;
        font: normal normal bold 20px/25px Lexend;
        margin: 20px auto 0px;
      }
    }
  }

  @media (min-width: 768px) {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 10px;

    .personalized-sizes-container-sizes {
      grid-template-columns: repeat(2, 1fr);
      height: auto;
    }
  }

  @media (min-width: 1100px) {
    .personalized-sizes-container-sizes {
      .personalized-sizes-container-start,
      .personalized-sizes-container-end {
        padding: 58px;
      }
    }
  }
}

.measures-details {
  border-top: 1px solid rgba(38, 11, 1, 0.2) !important;
  padding-top: 24px !important;

  .measures-details-h2 {
    font: normal normal bold 16px/20px Lexend;
    letter-spacing: 0px;
    color: #000000;
    margin-bottom: 24px;
  }

  .measures {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    border-bottom: 1px solid rgba(38, 11, 1, 0.2) !important;
    padding-bottom: 40px;

    .measures-container {
      .measures-container-title {
        text-align: left;
        font: normal normal normal 16px/20px Lexend;
        letter-spacing: 0px;
        color: #ff6a13;
      }

      .product-colors {
        position: relative;
      }

      .measures-detail,
      .mais-tecidos {
        --figure-color: attr(data-color);

        display: flex;
        align-items: center;
        justify-content: space-between;

        padding: 10px;
        margin-block: 10px;

        min-height: 62px;
        background: #ffffff 0% 0% no-repeat padding-box;
        border: 1px solid #231611;

        cursor: pointer;

        .measures-detail-figure {
          display: flex;
          align-items: center;
          gap: 15px;

          .color-box {
            width: 40px;
            height: 40px;
            border: 1px solid #231611;
            position: relative;
            span,
            input {
              position: absolute;
              inset: 0;
              width: auto !important;
              height: auto !important;
            }
          }

          &.measures-detail-figure-check {
            display: none;
          }

          &:first-of-type {
            .measures-detail-img {
              width: 32px;
              height: 32px;
              object-fit: cover;
            }
          }
        }

        &.measures-detail-selected {
          pointer-events: none;
          opacity: 0.4;

          .measures-detail-figure-check {
            display: flex;
          }
        }
      }

      #more-colors {
        position: absolute;
        opacity: 0;
        pointer-events: none;
        top: 110%;
        left: -1px;
        right: -1px;

        border: 1px solid black;

        padding: 10px;

        background-color: rgb(255, 255, 255);

        transition: opacity 0.15s;

        &.more-colors-open {
          opacity: 1;
          pointer-events: all;
        }
      }

      .measures-detail-clear {
        text-align: left;
        text-decoration: underline;
        font: normal normal normal 14px/18px Lexend;
        letter-spacing: 0px;
        color: #000000;
        cursor: pointer;
      }
    }
    .measures-container {
      .measures-container-title {
        text-align: left;
        font: normal normal normal 16px/20px Lexend;
        letter-spacing: 0px;
        color: #ff6a13;
      }

      .product-colors {
        position: relative;
      }

      .measures-detail {
        --figure-color: attr(data-color);

        display: flex;
        align-items: center;
        justify-content: space-between;

        padding: 10px;
        margin-block: 10px;

        min-height: 62px;
        background: #ffffff 0% 0% no-repeat padding-box;
        border: 1px solid #231611;

        cursor: pointer;

        .measures-detail-figure {
          display: flex;
          align-items: center;
          gap: 15px;

          .color-box {
            width: 40px;
            height: 40px;
            border: 1px solid #231611;
            background-color: var(--figure-color);
          }

          &.measures-detail-figure-check {
            display: none;
          }

          &:first-of-type {
            .measures-detail-img {
              width: 32px;
              height: 32px;
              object-fit: cover;
            }
          }
        }

        &.measures-detail-selected {
          pointer-events: none;
          opacity: 0.4;

          .measures-detail-figure-check {
            display: flex;
          }
        }
      }

      .more-colors-container {
        position: absolute;
        opacity: 0;
        pointer-events: none;
        top: 110%;
        left: -1px;
        right: -1px;

        border: 1px solid black;

        padding: 10px;
        max-height: 250px;
        overflow-y: scroll;
        background-color: rgb(255, 255, 255);

        transition: opacity 0.15s;
        z-index: 15;
        &.more-colors-open {
          opacity: 1;
          pointer-events: all;
        }
      }

      .measures-detail-clear {
        text-align: left;
        text-decoration: underline;
        font: normal normal normal 14px/18px Lexend;
        letter-spacing: 0px;
        color: #000000;
        cursor: pointer;
      }
    }
    @media (min-width: 1200px) {
      grid-template-columns: repeat(2, 1fr);
    }
  }
}

.product-info-icons {
  display: flex;
  align-items: end;
  gap: 40px;
  margin-bottom: 30px;

  .product-info-figure {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;

    .product-info-figure-img {
      width: 40px;
    }

    .product-info-figure-caption {
      font: normal normal normal 13px/16px Lexend;
      letter-spacing: 0px;
      color: #000000;
    }

    .firm {
      display: flex;
      align-items: center;
      gap: 5px;
      margin-bottom: 10px;
      .ball {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background: #ffffff 0% 0% no-repeat padding-box;
        border: 1px solid #ff6a13;

        &.full {
          background: #ff6a13 0% 0% no-repeat padding-box;
        }
      }
    }
  }
}

#more-about-product-section {
  text-align: center;
  letter-spacing: 0px;

  .more-about-product-h2 {
    margin-bottom: 18px;
    font: normal normal bold 27px/34px Lexend;
    color: #231611;
  }

  .more-about-product-p {
    color: #584a45;
    font: normal normal normal 19px/24px Lexend;
  }

  #more-about-product-figure {
    .more-about-product-img {
      width: min(100%, 900px);
      aspect-ratio: 16/9;
      height: auto;
      object-fit: cover;
    }
  }

  .more-about-product-more-details {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 500ms;

    & > .more-about-product-div {
      overflow: hidden;
    }

    .more-about-product-p {
      width: min(100%, 800px);
      margin: 10px auto;

      text-wrap: balance;
    }

    &.more-about-product-more-details-open {
      grid-template-rows: 1fr;
    }
  }

  .more-about-product-open {
    .more-about-product-header {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      justify-content: center;
      margin-bottom: 10px;
      cursor: pointer;
    }
  }

  a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    background: #ff6a13 0% 0% no-repeat padding-box;
    border-radius: 38px;

    width: fit-content;

    text-decoration: none;
    text-align: left;
    font: normal normal bold 18px/23px Lexend;
    color: #ffffff;

    min-width: 200px;

    padding-block: 12px;

    img {
      width: 30px;
      height: 30px;
    }

    margin: 0 auto;
    margin-top: 30px;

    font: normal normal bold 18px/23px Lexend;
  }
}

#ergo-confy-section {
  background: #ff6a13 0% 0% no-repeat padding-box;
  padding: 80px 14px;
  margin-inline: -20px -20px !important;

  @media (min-width: 768px) {
    margin-inline: -30px -30px !important;
  }
  @media (min-width: 1024px) {
    margin-inline: -20px -20px !important;
  }

  @media (min-width: 1024px) {
    margin-inline: -20px -20px !important;
  }

  @media (min-width: 1220px) {
    margin-inline: -30px -30px !important;
  }

  color: #e6e6e6;
  letter-spacing: 0px;
  text-align: center;

  .ergo-header {
    width: min(100%, 700px);
    margin-inline: auto;
  }
  .ergo-h2 {
    font: normal normal bold Lexend;
    font-size: clamp(20px, 2vw, 30px);
    line-height: clamp(20px, 2vw, 30px);
    letter-spacing: 0px;
    color: inherit;
    text-wrap: balance;
  }
  .ergo-p {
    font-size: clamp(14px, 2vw, 18px);
    line-height: clamp(14px, 2vw, 18px);
    margin-top: 30px;
    margin-bottom: 20px;

    &:last-of-type {
      margin-bottom: 0px;
    }
  }

  .ergo-icons {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;

    width: min(100%, 800px);
    margin: 0 auto;
    margin-top: 80px;
    .ergo-figure {
      display: flex;
      flex-direction: column;
      justify-content: end;
      align-items: center;
      gap: 20px;
      .ergo-img {
        width: 60%;
        height: auto;
        object-fit: fill;
      }

      .ergo-figcaption {
        font-size: clamp(13px, 2vw, 14px) !important;
        line-height: clamp(13px, 2vw, 16px) !important;
      }
    }
    @media (min-width: 768px) {
      grid-template-columns: repeat(4, 1fr);
      gap: 30px;
    }
  }
}

#description {
  & + div {
    display: none !important;
  }
}

#product-description-section {
  margin-inline: -20px -20px !important;

  @media (min-width: 768px) {
    margin-inline: -30px -30px !important;
  }
  article {
    display: grid;
    grid-template-columns: 1fr;

    .product-description-figure {
      max-height: 700px;
      .product-description-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .product-description-description {
      background: #f8f7f7 0% 0% no-repeat padding-box;
      padding: 45px 30px 64px 17px;
      display: flex;
      align-items: center;

      .product-description-h2 {
        font: normal normal bold 25px/31px Lexend;
        letter-spacing: 0px;
        color: #000000;
      }

      .product-description-p {
        font: normal normal normal 17px/21px Lexend;
        letter-spacing: 0px;

        margin-top: 25px;

        &.bold {
          margin-top: 10px;
          margin-bottom: 35px;
          font-weight: bold;
        }
      }

      .speak-with-us {
        background: #231611 0% 0% no-repeat padding-box;
        border-radius: 40px;
        width: fit-content;
        display: flex;
        gap: 20px;

        letter-spacing: 0px;
        color: #ffffff;
        font: normal normal normal 15px/19px Lexend;
        text-transform: uppercase;

        .product-description-start {
          font-weight: bold;
          background: #ff6a13 0% 0% no-repeat padding-box;
          border-radius: 40px;
          padding: 20px 35px;
        }
        .product-description-end {
          padding-block: 20px;
          padding-right: 30px;
        }
      }
    }

    @media (min-width: 1024px) {
      grid-template-columns: repeat(2, 1fr);

      .product-description-h2 {
        text-wrap: balance;
      }

      .product-description-description {
        grid-area: 1/1;
        padding-left: 60px;
        padding-right: 140px;
      }
    }
  }
}

.product-price-details-quantity-container {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 500px;

  margin-block: 22px;

  background: #ffffff 0% 0% no-repeat padding-box;
  border: 1px solid #231611;
  border-radius: 29px;

  .quantity-selector {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 5px;

    @media (min-width: 768px) {
      padding: 0px 20px;
    }
  }

  .quantity-button {
    font: normal normal 200 25px/31px Lexend;
    letter-spacing: 0px;
    color: #231611;
    @media (max-width: 768px) {
      display: none;
    }
  }

  .quantity-input {
    width: 100% !important;
    border: none !important;
    outline: none !important;
    font: normal normal normal 20px/25px Lexend;
    letter-spacing: 0px;
    color: #231611;
    text-align: center;
    border-radius: 29px !important;
    &:focus-within {
      outline: none !important;
      border: none !important;
      box-shadow: none !important;
      background: #ffffff 0% 0% no-repeat padding-box;
    }
  }

  .input-group-btn-vertical {
    @media (min-width: 768px) {
      display: none !important;
    }
  }

  .add-button {
    background-color: #ff6a13;
    outline: 1px solid #ff6a13;
    border-radius: 29px;
    font: normal normal bold 16px/20px Lexend;
    letter-spacing: 0px;
    color: #ffffff;
    width: 100%;
    padding-block: 15px;
    min-width: 180px;

    &:disabled {
      opacity: 0.5;
      pointer-events: none;
    }
  }
}

.product-price-details-time {
  font: normal normal normal 13px/16px Lexend;
  color: #000000;
}

.product-detail-carousel-wrapper {
  margin-inline: -20px -20px !important;
  display: flex;
  width: 100vw;
  overflow-x: scroll;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;

  .product-detail-carousel-img {
    flex-shrink: 0;
    scroll-snap-align: start;
    width: 100vw;
    height: auto;
    max-height: 400px;
    object-fit: cover;
  }

  @media (min-width: 768px) {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;

    &::-webkit-scrollbar {
      display: none;
    }

    -ms-overflow-style: none; /* Internet Explorer 10+ */
    scrollbar-width: none; /* Firefox */

    .product-detail-carousel-img {
      width: 100%;
      height: 100%;
      max-height: 800px;
      &:first-child {
        grid-column: span 2;
        min-height: auto;
      }
    }
  }
}

#blog-section {
  padding: 28px 10px;

  width: min(100%, 1220px);
  margin: 0 auto;

  .blog-post-main-title {
    text-align: center;
    font-size: clamp(28px, 2vw, 46px);
    line-height: clamp(35px, 2vw, 58px);
    letter-spacing: 0px;
    color: #231611;
    font-family: inherit;
    margin-block: 19px 15px;
  }

  .blog-post-sub-title {
    text-align: left;
    font-size: clamp(22px, 2vw, 36px);
    line-height: clamp(22px, 2vw, 45px);
    letter-spacing: 0px;
    color: #231611;
    margin-bottom: 15px;
  }

  .blog-post-sub-title-2 {
    text-align: left;
    font-size: clamp(16px, 2vw, 23px);
    line-height: clamp(21px, 2vw, 29px);
    font-family: inherit;
    letter-spacing: 0px;
    color: #ff6a13;
    margin-bottom: 15px;
  }

  .blog-post-text {
    text-align: left;
    font-size: clamp(16px, 2vw, 23px);
    line-height: clamp(19px, 2vw, 31px);
    font-family: inherit;
    letter-spacing: 0px;
    color: #000000;
  }

  @media (min-width: 1200px) {
    .blog-post-main-title {
      margin-block: 25px;
    }

    .blog-post-sub-title {
      margin-bottom: 18px;
    }

    .blog-post-sub-title-2 {
      margin-bottom: 14px;
    }
  }

  div {
    &.blog-post {
      .category-container {
        justify-content: center;
      }

      .blog-post-description {
        --color: hsla(33, 87%, 61%, 0.1);

        background: var(--color) 0% 0% no-repeat padding-box;
        padding: 22px 12px;
        margin-bottom: 22px;

        .blog-post-text {
          width: min(100%, 700px);
          margin: 0 auto;
          text-align: center;
        }

        &[data-category='saúde'] {
          --color: hsla(184, 37%, 54%, 0.1);
        }

        &[data-category='conselhos'] {
          --color: hsla(16, 79%, 59%, 0.1);
        }

        &.post-description-color-1 {
          --color: hsla(33, 87%, 61%, 0.1);
        }
        &.post-description-color-2 {
          --color: rgba(166, 36, 47, 0.1);
        }
        &.post-description-color-3 {
          --color: rgba(95, 175, 181, 0.1);
        }
        &.post-description-color-4 {
          --color: rgba(245, 186, 114, 0.1);
        }
        &.post-description-color-5 {
          --color: rgba(233, 111, 66, 0.1);
        }
        &.post-description-color-6 {
          --color: rgba(124, 181, 95, 0.1);
        }
        &.post-description-color-7 {
          --color: rgba(255, 106, 19, 0.1);
        }
      }

      .blog-post-date {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 15px;

        margin-bottom: 24px;

        font: normal normal normal 14px/18px Lexend;
        letter-spacing: 0px;
        color: #000000;

        p {
          margin-bottom: 0px !important;
        }

        .blog-post-author-author {
          font-weight: bold;
          color: #ff6a13;
        }

        .blog-post-author-time {
          display: flex;
          align-items: center;
          gap: 5px;
        }

        @media (min-width: 1200px) {
          font: normal normal normal 18px/23px Lexend;
        }
      }

      .blog-post-img {
        margin-bottom: 30px;
        width: 100%;
        max-height: 650px;
        object-fit: cover;

        @media (min-width: 1200px) {
          margin-bottom: 55px;
        }
      }
    }
    &.blog-details {
      margin-block: 32px;

      @media (min-width: 1200px) {
        margin-top: 80px;
      }
    }
    &.blog-benefits {
      margin-bottom: calc(48px - 15px);

      .blog-post-list {
        margin-top: 12px;
        padding-left: 20px;
        list-style: none;

        li {
          margin-bottom: 15px;

          span {
            color: #ff6a13 !important;
            font-weight: bold;

            position: relative;

            &::before {
              content: '';
              position: absolute;
              left: -20px;
              top: 50%;
              transform: translateY(-50%);
              width: 10px;
              height: 10px;
              background: #e96f42 0% 0% no-repeat padding-box;
              border-radius: 50%;
            }
          }
        }
      }

      @media (min-width: 1200px) {
        margin-top: 70px;
      }
    }

    &.blog-post-share {
      background: #fbe3c5 0% 0% no-repeat padding-box;
      opacity: 1;
      padding: 20px 15px;
      margin-top: 22px;

      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;

      gap: 20px;

      @media (min-width: 1200px) {
        margin-top: 120px;
        margin-bottom: 60px;
        padding: 10px 28px !important;
      }

      p {
        font-size: clamp(16px, 2vw, 22px);
        letter-spacing: 0px;
        color: #000000;
        line-height: clamp(30px, 2vw, 40px);
      }

      .font-bold {
        color: #ff6a13;
      }

      img {
        width: 100%;
      }

      .blog-share {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 25px;

        img {
          width: 25px;
          height: 25px;
          object-fit: fill;
        }
      }
    }
  }
}

.all-blogs-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;

  .blogs-header-title {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .blogs-header-filters {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;

    select {
      border: none !important;
      outline: none !important;
      background: #ffffff 0% 0% no-repeat padding-box;
    }
  }

  @media (min-width: 1024px) {
    padding-inline: 10px;
  }
}

.all-blogs-container {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 15px;
}

@media (min-width: 768px) {
  .all-blogs-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

.all-blogs-section {
  padding: 15px 10px !important;

  @media (min-width: 1024px) {
    padding-top: 30px !important;
  }
}

.more-tecido {
  position: fixed;
  inset: 0;
  z-index: 999999999999999999;
  display: flex;

  background-color: rgba(0, 0, 0, 0.2);

  &:not(.more-tecido-open) {
    display: none;
  }

  .tecidos-container {
    width: min(100%, 1200px);

    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: min-content 1fr;
    height: 100vh;
    min-height: 35vh;

    background-color: white;

    & > div:first-of-type {
      padding: 1rem;

      p {
        font-size: clamp(20px, 2vw, 28px);
        line-height: clamp(20px, 2vw, 28px);
        letter-spacing: 0px;
        color: #231611;
      }
    }

    .tecidos {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
      overflow-y: scroll;
      max-height: 425px;

      .escolher-tecido {
        display: flex;
        padding: 10px;
        border: 1px solid #231611;
        cursor: pointer;

        &.escolhido {
          border: 1px solid #ff6a13;
        }

        img {
          width: 100%;
          height: auto;
          object-fit: cover;
        }
      }
    }
    .tecido-escolhido-container {
      position: relative;

      .more-tecido-close {
        position: absolute;
        top: 10px;
        right: 10px;
        margin: 0;
        z-index: 10;

        border-radius: 100%;
        background-color: white;
        padding: 2px;
      }

      .tecido-escolhido {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1rem;

        img {
          position: absolute;
          inset: 0;
          object-fit: cover;
          width: 100%;
          height: 100%;
        }
        figcaption {
          position: relative;
          background-color: white;

          padding: 1.5rem;
          width: 70%;

          .tecido-escolhido-nome {
            font-size: clamp(24px, 2vw, 30px);
            line-height: clamp(24px, 2vw, 30px);
            color: #231611;
          }
          .tecido-escolhido-desc {
            font-size: clamp(16px, 2vw, 20px);
            line-height: clamp(16px, 2vw, 20px);
            color: #231611;
          }

          .check-product {
            margin-top: 20px;
            width: 100%;
            padding: 1rem;
            font-size: clamp(16px, 2vw, 20px);
            line-height: clamp(16px, 2vw, 20px);
            color: white;
          }
        }
      }
    }
  }

  @media (min-width: 768px) {
    align-items: center;
    justify-content: center;
    padding: 1rem;
    .tecidos-container {
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto;
      height: fit-content;
      & > div:first-of-type {
        padding: 2rem;
      }
    }
  }
}