:root {
  --color-white: #fff;
  --color-black: #272727;
  --color-beige: #fbf7f2;
  --color-blue: #6d6ed9;
  --color-lightblue: #f1f1fb;
  --color-mediumblue: #d3d4f2;
  --color-gray: #868280;
  --color-lightgray: #dbd7d3;

  --page-x-padding: 15px;
  --section-y-padding: 60px;
  --section-y-padding-lg: 120px;
  --section-title-font-size: 20px;
  --section-title-font-weight: bold;
  --section-title-margin-bottom: 28px;
  --section-subtitle-font-weight: 500;
  --section-subtitle-color: var(--color-gray);
  --section-subtitle-margin-bottom: 48px;
  --navbar-height: 68px;

  --wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.21 13'%3E%3Cpath d='M0,10.5c9.05,0,9.05-8,18.11-8s9.05,8,18.11,8' style='fill:none;stroke:%23000;stroke-width:5px'/%3E%3C/svg%3E");
  --white-top-bg-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.21 13'%3E%3Cpath d='M0 0 0 9.05 8.46 8.12 15.15 2.94 21.59 3.13 27.54 7.93 31.98 10.3 36.21 10.3 36.21 0 0 0z' style='fill:%23fff'/%3E%3Cpath d='M0,10.5c9.05,0,9.05-8,18.11-8s9.05,8,18.11,8' style='fill:none;stroke:%23000;stroke-width:5px'/%3E%3C/svg%3E");
  --white-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.21 13'%3E%3Cpath d='M0,10.5c9.05,0,9.05-8,18.11-8s9.05,8,18.11,8' style='fill:none;stroke:%23fff;stroke-width:5px'/%3E%3C/svg%3E");

  /* --slider-btn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='b' viewBox='0 0 37.62 37.62'%3E%3Cdefs%3E%3Cstyle%3E.d%7Bfill:none;stroke:%23181818;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px%7D%3C/style%3E%3C/defs%3E%3Cg id='c'%3E%3Cpath d='m16.8 12.79 6.02 6.02-6.02 6.02' class='d'/%3E%3Cpath d='M.75 18.81c0 9.97 8.09 18.06 18.06 18.06 9.97 0 18.06-8.09 18.06-18.06C36.87 8.84 28.78.75 18.81.75 8.84.75.75 8.84.75 18.81Z' class='d'/%3E%3C/g%3E%3C/svg%3E"); */
  --slider-btn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='a' viewBox='0 0 38.62 38.62'%3E%3Cdefs%3E%3Cstyle%3E.c%7Bfill:none;stroke:%23272727;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px%7D%3C/style%3E%3C/defs%3E%3Cg id='b'%3E%3Cpath d='m17.3 13.29 6.02 6.02-6.02 6.02' class='c'/%3E%3Cpath d='M1.25 19.31c0 9.97 8.09 18.06 18.06 18.06s18.06-8.09 18.06-18.06S29.28 1.25 19.31 1.25 1.25 9.34 1.25 19.31' class='c'/%3E%3C/g%3E%3C/svg%3E");
  --slider-btn-20px: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='a' viewBox='0 0 38.62 38.62'%3E%3Cdefs%3E%3Cstyle%3E.c%7Bfill:none;stroke:%23272727;stroke-linecap:round;stroke-linejoin:round;stroke-width:3px%7D%3C/style%3E%3C/defs%3E%3Cg id='b'%3E%3Cpath d='m17.3 13.29 6.02 6.02-6.02 6.02' class='c'/%3E%3Cpath d='M1.25 19.31c0 9.97 8.09 18.06 18.06 18.06s18.06-8.09 18.06-18.06S29.28 1.25 19.31 1.25 1.25 9.34 1.25 19.31' class='c'/%3E%3C/g%3E%3C/svg%3E");

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);

  scroll-behavior: smooth;
}

  @media (min-width: 1024px) {:root {
    --page-x-padding: 30px;
    --section-title-font-size: 28px;
    --section-subtitle-font-size: 24px;
    --navbar-height: 88px
}
  }

  @media (min-width: 1336px) {:root {
    --page-x-padding: calc(30vw / 2)
}
  } 

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

::-moz-selection {
  background-color: var(--color-blue);
  color: var(--color-white);
}

::selection {
  background-color: var(--color-blue);
  color: var(--color-white);
}

html,
body {
  height: 100%;
}

body {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  line-height: 1.4;
  color: var(--color-black);
  display: flex;
  flex-direction: column;
}

a {
  text-decoration: none;
  color: inherit;
}

button {
  border: none;
  outline: none;
  background: transparent;
  font-family: inherit;
  cursor: pointer;

  -webkit-tap-highlight-color: transparent;
}

img {
  display: block;
  width: 100%;
  height: auto;
}



/* Global wrapper */
.wrapper {
  flex: 1 0 auto;
}



/* Button */
.button {
  display: block;
  padding: 1.25em 2.31em;
  background: var(--color-blue);
  color: var(--color-white);
  font-size: 16px;
  font-weight: bold;
  border-radius: 200px;
  text-decoration: none;
  transition: all 150ms ease;
}
.button:hover {
    background: var(--color-mediumblue);
    color: var(--color-blue);
    outline: 2px solid var(--color-blue);
  }

.button--white {
  background: var(--color-white);
  color: var(--color-blue);
}



/* Section */
div[id] {
  scroll-margin-top: calc(var(--navbar-height));
}

.section__title {
  font-size: var(--section-title-font-size);
  font-weight: var(--section-title-font-weight);
  margin-bottom: 28px;
  text-align: center;
  text-transform: uppercase;
}

.section__subtitle {
  color: var(--section-subtitle-color);
  font-weight: var(--section-subtitle-font-weight);
  margin-bottom: var(--section-subtitle-margin-bottom);
  text-align: center;
}



/* Swiper */
.swiper {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.swiper-pagination {
  --swiper-pagination-bullet-horizontal-gap: 9px;
  --swiper-pagination-bullet-size: 18px;
  --swiper-pagination-bullet-inactive-color: var(--color-gray);
  --swiper-theme-color: var(--color-blue);
}



/* Wave utility */
.has-wave {
  position: relative;
}
.has-wave::after {
    position: absolute;
    content: '';
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    height: 6px;
    background: var(--wave) repeat-x top left/15px 5.5px;
    animation: shart 50s linear infinite;
  }

@keyframes shart {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: 600px 0;
  }
}

.wave {
  cursor: default;
  width: 100%;
  height: 6px;
  background: var(--wave) repeat-x top left/15px 5.5px;
  animation: shart 50s linear infinite;
}

.wave--white-top-bg {
  background-image: var(--white-top-bg-wave);
}

.wave--white {
  background-image: var(--white-wave);
}

.wave--absolute {
  position: absolute;
  top: 0;
  left: 0;
}



.navbar {
  position: sticky;
  top: 0;
  z-index: 100;
  display: grid;
  grid-template-columns: 1fr 210px 1fr;
  grid-template-rows: var(--navbar-height);
  align-items: center;
  background: var(--color-beige);
  padding: 0 var(--page-x-padding);
}



@media (min-width: 1024px) {



.navbar {
    grid-template-columns: 1fr 280px 1fr;
    padding: 0 40px
}
  }

.navbar__hamburger {
  width: 22px;
  height: auto;
}

@media (min-width: 1336px) {

.navbar__hamburger {
    display: none
}
  }

.navbar__links {
  display: none;
  padding-top: 5px;
}

.navbar__links a {
    text-transform: uppercase;
    font-weight: 500;
    line-height: 1;
    position: relative;
  }

.navbar__links a::after {
      position: absolute;
      content: '';
      top: calc(100% + 6px);
      left: 0;
      right: 0;
      height: 6px;
      background: var(--wave) repeat-x top left/15px 5.5px;
      animation: shart 50s linear infinite;
      opacity: 0;
      transition: opacity 150ms ease;
    }

.navbar__links a:hover::after {
      opacity: 1;
    }

@media (min-width: 1336px) {

.navbar__links {
    display: flex;
    gap: 30px
}
  }

.navbar__button {
  display: none !important;
}

@media (min-width: 1336px) {

.navbar__button {
    display: block !important;
    justify-self: end
}
  }



/* Menu */
.menu {
  position: fixed;
  top: var(--navbar-height);
  left: 0;
  width: 100vw;
  transform: translateY(-100%);
  transition: transform 150ms ease-out;
  background: var(--color-beige);
  z-index: 90;
}
.menu.is-open {
    transform: none;
  }

.menu__links {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 30px;
  padding: var(--page-x-padding) var(--page-x-padding) calc(var(--page-x-padding) * 2);
}

.menu__links a {
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1;
    color: transparent;
    transition: color 50ms ease-out;
  }

.menu.is-open .menu__links a {
  color: var(--color-black);
  transition: color 150ms ease-out 150ms;
}



/* Hero */
.hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 70px 9%;

  background: url(/wp-content/themes/labs/assets/img/generic-bg.svg) center/cover no-repeat;

  -webkit-mask: linear-gradient(white, white), url(/wp-content/themes/labs/assets/img/hero-mask-wave.svg) left calc(100% + 40px)/56px 52px repeat-x;

          mask: linear-gradient(white, white), url(/wp-content/themes/labs/assets/img/hero-mask-wave.svg) left calc(100% + 40px)/56px 52px repeat-x;
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}
@media (min-width: 1024px) {
.hero {
    background: url(/wp-content/themes/labs/assets/img/hero-desktop.webp) center/cover no-repeat
}
  }

.hero__title {
  font-size: 32px;
  font-weight: bold;
  text-wrap: balance;
  line-height: 1.25;
  color: var(--color-blue);
  margin-bottom: 34px;
  text-align: center;
}

@media (min-width: 1024px) {

.hero__title {
    max-width: 800px;
    font-size: 42px;
    line-height: 1.3
}
  }

.hero__subtitle {
  margin-bottom: 60px;
  text-align: center;
  text-wrap: balance;
}

@media (min-width: 1024px) {

.hero__subtitle {
    font-size: 20px;
    line-height: 1.6;
    max-width: 800px
}
  }

.hero__button {
  align-self: center;
}

/* Slider 1 */
.slider-1 {
  --swiper-pagination-bottom: 60px;
}
@media (min-width: 1336px) {
.slider-1 {
    padding: 0 var(--page-x-padding) !important
}
  }

.slider-1-slide {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  padding: 60px 30px 0;
  min-height: 450px;
  max-width: calc(50% + (30px * 2));
}

@media (min-width: 1024px) {

.slider-1-slide {
    max-width: 25%;
    padding: 100px 30px
}
  }

.slider-1-slide__image {
  height: 90px;
  width: auto;
  margin-bottom: 38px;
}

.slider-1-slide__title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 30px;
  text-align: center;
  text-transform: uppercase;
}

.slider-1-slide__subtitle {
  line-height: 1.625;
  text-align: center;
}



/* Products */
.products {
  position: relative;
  padding: var(--section-y-padding) var(--page-x-padding);
  background: var(--color-beige);
  /* border-image: var(--wave-border-top-bg-white);
  border-image-repeat: repeat;
  border-image-width: 5px 0 0;
  border-image-slice: 100% 0 0 0 fill; */
}

.products__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 36px 9px;
}

@media (min-width: 1024px) {

.products__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 55px 40px
}
  }



/* Product */
.product {
  position: relative;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color 200ms ease;
}
.product>* {
    position: relative;
  }
.product:not(.product--cta)::before {
    content: '';
    position: absolute;
    inset: -5px;
    /* border: 1px solid var(--color-black); */
    background: var(--color-white);
    border-radius: 5px;
    opacity: 0;
    transition: opacity 150ms ease-out;
  }
@media (min-width: 1024px) {
.product:not(.product--cta)::before {
      inset: -10px;
      border-radius: 10px
  }
    }
.product:hover {
    color: var(--color-blue);
  }
@media (min-width: 1024px) {
.product:hover::before {
      opacity: 1
  }
    }

.product--cta {
  min-width: 0;
}

.product__image {
  position: relative;
  margin-bottom: 20px;
  aspect-ratio: 4/5;
}

.product__image img {
    position: absolute;
    inset: 0;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

.product__eye {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.17 23.17'%3E%3Cpath d='M21.57 11.53c-6.66-7.23-13.32-7.36-19.98 0 6.66 7.36 13.32 7.23 19.98 0ZM6.4 21.22c-.19.32-.6.44-.93.25s-.44-.6-.25-.93l.72-1.25c.19-.32.6-.44.93-.25.32.19.44.6.25.93l-.72 1.25Zm10.86-.38c.19.32.08.74-.25.93-.32.19-.74.08-.93-.25l-.72-1.25a.677.677 0 0 1 .25-.93c.32-.19.74-.08.93.25l.72 1.25Zm-5.38 1.65c0 .38-.3.68-.68.68s-.68-.3-.68-.68v-1.45c0-.38.3-.68.68-.68s.68.3.68.68v1.45ZM5.22 2.63a.677.677 0 0 1 .25-.93c.32-.19.74-.08.93.25l.72 1.25c.19.32.08.74-.25.93-.32.19-.74.08-.93-.25l-.72-1.25Zm10.86-.99c.19-.32.6-.44.93-.25.32.19.44.6.25.93l-.72 1.25c-.19.32-.6.44-.93.25s-.44-.6-.25-.93l.72-1.25ZM10.51.68c0-.38.3-.68.68-.68s.68.3.68.68v1.45c0 .38-.3.68-.68.68s-.68-.3-.68-.68V.68Zm1.07 7.08c2.08 0 3.76 1.69 3.76 3.76s-1.69 3.76-3.76 3.76-3.76-1.69-3.76-3.76 1.69-3.76 3.76-3.76Zm1.7 2.07c.94.94.94 2.46 0 3.39s-2.46.94-3.4 0-.94-2.46 0-3.39c.94-.94 2.46-.94 3.4 0ZM.17 11.08c7.61-8.75 15.22-8.59 22.82-.02.23.25.24.65 0 .91-7.61 8.58-15.21 8.75-22.82 0a.673.673 0 0 1-.01-.9Z' style='fill:%23fbf7f2;fill-rule:evenodd'/%3E%3C/svg%3E");

  position: absolute;
  top: 12px;
  right: 12px;
  width: 28px;
  aspect-ratio: 1;
  border-radius: 100%;
  background: var(--icon) center/68% auto no-repeat, rgba(0, 0, 0, 0.2);
  transition: background 150ms ease;
}

@media (min-width: 1024px) {

.product__eye {
    top: 25px;
    right: 25px;
    width: 32px
}
  }

.product:hover .product__eye {
  background: var(--icon) center/68% auto no-repeat, var(--color-blue);
}

.product__colors {
  position: absolute;
  bottom: 12px;
  right: 12px;
  padding: 3px;
  border-radius: 100px;
  background: #d8d4d0;
  display: flex;
  gap: 4px;
}

@media (min-width: 1024px) {

.product__colors {
    bottom: 25px;
    right: 25px
}
  }

.product__color {
  width: 18px;
  aspect-ratio: 1;
  border: 1px solid var(--color-white);
  background: var(--color-black);
  border-radius: 100%;
}

.product__colors[data-has-more-colors] .product__color:last-child {
  position: relative;
}

.product__colors[data-has-more-colors] .product__color:last-child::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23fff'%3E%3Cpath d='M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5v-4.5Z' /%3E%3C/svg%3E%0A") center/80% no-repeat;
  }

.product--cta .product__image {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 18px;
}

@media (min-width: 1024px) {

.product--cta .product__image {
    padding: 0 48px
}
  }

.product__cta-title {
  position: relative;
  font-size: 16px;
  font-weight: bold;
  color: var(--color-blue);
  text-align: center;
  margin-bottom: 14px;
}

@media (min-width: 1024px) {

.product__cta-title {
    font-size: 28px;
    margin-bottom: 42px
}
  }

.product__cta-btn {
  position: relative;
}

@media (max-width: 1023px) {

.product__cta-btn {
    font-size: 14px
}
  }

.product__title {
  margin-bottom: 18px;
  font-size: 14px;
  font-weight: bold;
}

.product__description {
  font-size: 13px;
  line-height: 1.4;
}



/* Info */
.info {
  padding: var(--section-y-padding) 0;
  /* border-image: var(--wave-border);
  border-image-repeat: repeat;
  border-image-width: 0 0 5px;
  border-image-slice: 0 0 100% 0 fill; */
}

.info__title {
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
}

.info__slider {
  overflow-y: visible;
  --swiper-pagination-bottom: 60px;
}

@media (min-width: 1336px) {

.info__slider {
    padding: 0 var(--page-x-padding) !important
}
  }

.info__slide {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  min-height: 460px;
  max-width: 50%;
  padding: var(--section-y-padding) 30px 0;
  max-width: calc(50% + (30px * 2));
  transition: color 150ms ease;
}

.info__slide:hover {
    color: var(--color-blue);
  }

@media (min-width: 1024px) {

.info__slide {
    max-width: 25%;
    padding: 100px 30px
}
  }

.info__slide-number {
  position: relative;
  background: var(--color-blue);
  color: var(--color-white);
  font-weight: bold;
  font-size: 38px;
  width: 80px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 100%;
  margin-bottom: 50px;
  transition: transform 200ms ease;
}

.info__slide:hover .info__slide-number {
  transform: scale(1.2);
}

.info__slide:first-child .info__slide-number::after {
  content: '';
  position: absolute;
  height: 3px;
  top: 38px;
  left: 100%;
  width: 500vw;
  background: var(--color-blue);
}

.info__slide:last-child .info__slide-number::after {
  content: '';
  position: absolute;
  height: 5px;
  top: 37px;
  left: 100%;
  width: 100vw;
  background: var(--color-white);
}

.info__slide-title {
  margin-bottom: 23px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

.info__slide-description {
  line-height: 1.625;
  text-align: center;
}

.info__cta {
  display: flex;
  justify-content: center;
  align-items: center;
}

.info__cta-title {
  font-size: 20px;
  font-weight: bold;
  margin-right: 30px;
}



/* Inspiration */
.inspiration {
  display: none;
  padding: var(--section-y-padding) var(--page-x-padding);
  /* display: flex; */
  flex-direction: column;
  align-items: center;
}

.inspiration__gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: min-content;
  gap: 22px 9px;
  align-items: start;
  margin-bottom: 38px;
}

@media (min-width: 1024px) {

.inspiration__gallery {
    grid-template-columns: repeat(3, 1fr);
    gap: 45px 40px
}
  }

.inspiration__image {
  aspect-ratio: 1;
  -o-object-fit: cover;
     object-fit: cover;
}

.inspiration__image.is-hidden {
    display: none;
  }

@media (max-width: 1023px) {

    .inspiration__image:nth-child(1),
    .inspiration__image:nth-child(4),
    .inspiration__image:nth-child(7),
    .inspiration__image:nth-child(10) {
      aspect-ratio: 4/5;
    }
  }

@media (min-width: 1024px) {

    .inspiration__image:nth-child(1),
    .inspiration__image:nth-child(3),
    .inspiration__image:nth-child(8) {
      aspect-ratio: 4/5;
    }
  }




/* Partners */
.partners {
  padding: var(--section-y-padding) 0 calc(var(--section-y-padding) + 32px);
}
.partners .swiper {
    pointer-events: none;
  }
.partners .swiper-wrapper {
    transition-timing-function: linear !important;
    /* transition-duration: 2s!important; */
  }
.partners .swiper-slide {
    height: 45px;
    width: calc(29vw - 48px);
  }
@media (min-width: 981px) {
.partners .swiper-slide {
      height: 80px;
      width: calc((1300px / 6) - 48px - (128px / 6)) !important;
      margin: 0 24px
  }
    }
.partners .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: contain;
         object-fit: contain;
      -o-object-position: center left;
         object-position: center left;
      filter: brightness(0) saturate(100%) invert(58%) sepia(7%) saturate(181%) hue-rotate(322deg) brightness(88%) contrast(90%);
    }
@media (min-width: 981px) {
.partners .swiper-slide img {
        -o-object-position: center;
           object-position: center
    }
      }



/* Idea */
.idea {
  padding: var(--section-y-padding) var(--page-x-padding);
  color: var(--color-white);
  background: var(--color-blue);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.idea::before {
    content: '';
    position: absolute;
    bottom: calc(100% - 20px);
    left: 0;
    right: 0;
    height: 52px;
    background: url(/wp-content/themes/labs/assets/img/idea-wave-2.svg) left bottom/56px 52px repeat-x;
  }

.idea__title {
  color: inherit;
}

.idea__subtitle {
  color: inherit;
  font-weight: normal;
}



/* faq */
.faq {
  padding: var(--section-y-padding) var(--page-x-padding);
  background: var(--color-beige);
}

.faq__title {
  margin-bottom: 16px;
}

.faq__subtitle {
  max-width: 250px;
  margin: 0 auto 62px auto;
}

@media (min-width: 1024px) {

.faq__subtitle {
    max-width: 100%
}
  }

.faq__accordion {}

.faq__item {
  border-bottom: 1px solid var(--color-black);
}

.faq__question {
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1.375;
  padding: 20px 40px 20px 0;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: filter 200ms ease;

  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.2' height='27.2'%3E%3Cpath d='M17.68 14.68h-3.23v3.31h-1.7v-3.31H9.52v-1.54h3.23V9.83h1.7v3.31h3.23z' style='fill:%23272727'/%3E%3Ccircle cx='13.6' cy='13.6' r='12.85' style='fill:none;stroke:%23272727;stroke-width:1.5px'/%3E%3C/svg%3E") right center/26px no-repeat;
}

.faq__item:hover .faq__question,
.faq__item.is-open .faq__question {
  filter: brightness(0) saturate(100%) invert(50%) sepia(8%) saturate(5799%) hue-rotate(205deg) brightness(89%) contrast(89%);
}

.faq__item.is-open .faq__question {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27.2 27.2'%3E%3Cpath d='M16.89 12.83v1.54h-6.58v-1.54h6.58Z' style='fill:%23272727'/%3E%3Ccircle cx='13.6' cy='13.6' r='12.85' style='fill:none;stroke:%23272727;stroke-width:1.5px'/%3E%3C/svg%3E") right center/26px no-repeat;
}

/* .faq__item:first-child .faq__question {
  padding-top: 0;
} */

.faq__answer {
  display: none;
  padding: 0 0 20px 0;
}

.faq__item.is-open .faq__answer {
  display: block;
}





/* Reviews */
.reviews {
  padding: var(--section-y-padding) 0;
}

.reviews__title {
  margin: 0 auto var(--section-y-padding) auto;
  width: -moz-fit-content;
  width: fit-content;
}

@media (min-width: 1024px) {

.reviews__title {
    margin-bottom: 0
}
  }

.reviews__slider {
  --swiper-pagination-bottom: 0;
}

@media (min-width: 1024px) {

.reviews__slider {
    --swiper-navigation-sides-offset: 10px;
    padding: 0 var(--page-x-padding) !important
}
  }

@media (min-width: 1336px) {

.reviews__slider {
    --swiper-navigation-sides-offset: 5%
}
  }

.reviews__slider .swiper-button-prev,
  .reviews__slider .swiper-button-next {
    display: none;
    width: 36px;
    background: var(--slider-btn) center/contain no-repeat;
    transition: filter 150ms ease;
  }

.reviews__slider .swiper-button-prev::after, .reviews__slider .swiper-button-next::after {
      display: none;
    }

.reviews__slider .swiper-button-prev:hover, .reviews__slider .swiper-button-next:hover {
      filter: brightness(0) saturate(100%) invert(50%) sepia(8%) saturate(5799%) hue-rotate(205deg) brightness(89%) contrast(89%);
    }

@media (min-width: 1024px) {

.reviews__slider .swiper-button-prev,
  .reviews__slider .swiper-button-next {
      display: block
  }
    }

.reviews__slider .swiper-button-prev {
    transform: rotateY(180deg);
  }

.reviews__slide {
  display: flex !important;
  flex-direction: column;
  align-items: start;
  padding: 0 30px;
  min-height: 450px;
  max-width: calc(70% + (30px * 2));
  opacity: 0;
  transition: all 150ms ease !important;
}

.reviews__slide.is-fully-visible {
    opacity: 1;
  }

@media (min-width: 1024px) {

.reviews__slide {
    max-width: 100%;
    /* max-width: 33%; */
    padding: 100px 30px
}
  }

.reviews__slide-rating {
  height: 20px;
  aspect-ratio: 300/40;
  background: var(--color-lightgray);
  -webkit-mask: url(/wp-content/themes/labs/assets/img/stars-2.svg) center/contain no-repeat;
          mask: url(/wp-content/themes/labs/assets/img/stars-2.svg) center/contain no-repeat;
  margin-bottom: 40px;
}

.reviews__slide-rating[data-rating="1"] {
    background: linear-gradient(to right, var(--color-blue), var(--color-blue) 20%, var(--color-lightblue) 20%, var(--color-lightblue));
  }

.reviews__slide-rating[data-rating="2"] {
    background: linear-gradient(to right, var(--color-blue), var(--color-blue) 40%, var(--color-lightblue) 40%, var(--color-lightblue));
  }

.reviews__slide-rating[data-rating="3"] {
    background: linear-gradient(to right, var(--color-blue), var(--color-blue) 60%, var(--color-lightblue) 60%, var(--color-lightblue));
  }

.reviews__slide-rating[data-rating="4"] {
    background: linear-gradient(to right, var(--color-blue), var(--color-blue) 80%, var(--color-lightblue) 80%, var(--color-lightblue));
  }

.reviews__slide-rating[data-rating="5"] {
    background: linear-gradient(to right, var(--color-blue));
  }

.reviews__slide-author {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 12px;
}

@media (min-width: 1024px) {

.reviews__slide-author {
    margin-bottom: 24px
}
  }

.reviews__slide-content {
  line-height: 1.625;
}



/* Preview */
.preview {
  border: none;
  margin: auto;
  padding: 25px;
  opacity: 0;
  transform: scaleY(0);
  transition: all 150ms allow-discrete;
  outline: none;
  border-radius: 10px;
}
.preview[open] {
    opacity: 1;
    transform: scaleX(1) scaleY(1);
  }
.preview::backdrop {
    background: rgba(0, 0, 0, 0);
    transition: all 150ms allow-discrete;
  }
.preview[open]::backdrop {
    background: rgba(0, 0, 0, 0.5);
  }

@starting-style {
  .preview[open] {
    opacity: 0;
    transform: scaleY(0);
  }

  .preview[open]::backdrop {
    background: rgba(0, 0, 0, 0);
  }
}

@media (min-width: 1024px) {

.preview__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    max-width: 1100px
}
  }

@media (min-width: 1024px) and (max-height: 899px) {

.preview__inner {
    padding: 10px 0
}
  }

@media (min-width: 1024px) and (min-height: 900px) {

.preview__inner {
    padding: 70px 50px
}
  }

.preview__close {
  position: absolute;
  top: 25px;
  right: 25px;
  background: url(/wp-content/themes/labs/assets/img/close-2.svg) center/contain no-repeat;
  width: 20px;
  aspect-ratio: 1;
}

.preview__title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
}

@media (min-width: 1024px) {

.preview__title {
    display: none
}
  }

.preview__title--desktop {
  display: none;
}

@media (min-width: 1024px) {

.preview__title--desktop {
    display: block;
    margin-bottom: 20px;
    font-size: 48px
}
  }

.preview__price {
  color: var(--color-blue);
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 20px;
}

.preview__price>div {
    display: inline;
  }

.preview__gallery {
  min-width: 0;
}

.preview__main-slider {
  --swiper-navigation-sides-offset: 40px;
  margin-bottom: 20px;
}

.preview__main-slider img {
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
    -o-object-fit: contain;
       object-fit: contain;
  }

.preview__main-slider .swiper-button-prev,
  .preview__main-slider .swiper-button-next {
    display: none;
    width: 36px;
    background: var(--slider-btn) center/contain no-repeat;
    transition: filter 150ms ease;
  }

.preview__main-slider .swiper-button-prev::after, .preview__main-slider .swiper-button-next::after {
      display: none;
    }

.preview__main-slider .swiper-button-prev:hover, .preview__main-slider .swiper-button-next:hover {
      filter: brightness(0) saturate(100%) invert(50%) sepia(8%) saturate(5799%) hue-rotate(205deg) brightness(89%) contrast(89%);
    }

@media (min-width: 1024px) {

.preview__main-slider .swiper-button-prev,
  .preview__main-slider .swiper-button-next {
      display: block
  }
    }

.preview__main-slider .swiper-button-prev {
    transform: rotateY(180deg);
  }

.preview__thumb-slider {
  margin-bottom: 30px;
}

@media (min-width: 1024px) {

.preview__thumb-slider {
    margin-bottom: 20px
}
  }

.preview__thumb-slider img {
    aspect-ratio: 1;
    -o-object-fit: contain;
       object-fit: contain;
    border: 1px solid var(--color-lightgray);
    border-radius: 5px;
  }

.preview__thumb-slider .swiper-slide-thumb-active img {
    border: 2px solid var(--color-blue);
  }

.preview__content {
  display: flex;
  flex-direction: column;
}

.preview__description {
  margin-bottom: 30px;
}

.preview__separator {
  height: 2px;
  background: var(--color-lightgray);
  border-radius: 5px;
}

.preview__tiers {
  display: flex;
  gap: 20px;
  margin-bottom: 30px;
}

@media (min-width: 1024px) {

.preview__tiers {
    margin-bottom: 30px
}
  }

.preview__tier {
  flex: 1 0 auto;
  padding: 12px 14px;
  font-size: 16px;
  font-weight: 500;
  border: 2px solid var(--color-gray);
  border-radius: 100px;
  line-height: 1;
  color: var(--color-gray);
}

.preview__tier.is-selected {
    border-color: var(--color-blue);
    color: var(--color-blue);
    font-weight: 500;
  }

@media (min-width: 480px) {

.preview__tier {
    flex: 0 0 auto
}
  }

.preview__properties {
  display: flex;
  flex-direction: column;
  gap: 18px;
  /* border-top: 2px solid var(--color-lightgray); */
  padding-top: 30px;
  margin-bottom: 40px;
}

@media (min-width: 1024px) {

.preview__properties {
    padding-top: 30px;
    margin-bottom: 60px;
    gap: 20px
}
  }

.preview__property {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.preview__property--colors {
  justify-content: end;
  gap: 0;
}

.preview__property-title {
  color: var(--color-gray);
  min-width: 100px;
}

.preview__property-spacer {
  flex: 1 1 0;
}

.preview__property-value {
  text-align: right;
}

.preview__property--colors .preview__property-value {
  margin: -25px -45px 0;
  padding: 25px 45px 0;

  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  align-items: start;
  gap: 15px 6px;
  /* max-height: 20px; */
  max-height: 45px;
  overflow: hidden;
}

.preview__property--colors.is-expanded .preview__property-value {
  max-height: initial;
}

.preview__property-more {
  flex: 0 0 auto;
  width: 20px;
  margin-left: 20px;
}

.preview__property-more-btn {
  width: 100%;
  aspect-ratio: 1;
  border: none;
  outline: none;
  background: var(--slider-btn-20px) top center/contain no-repeat;
  transform: rotate(90deg);
  transition: transform 150ms ease;
}

.preview__property--colors.is-expanded .preview__property-more-btn {
  transform: rotate(-90deg);
}

.preview__color {
  width: 20px;
  aspect-ratio: 1;
  border: 2px solid #fbf7f3;
  border-radius: 100%;
  position: relative;
  cursor: pointer;
  background: var(--color-black);
  -webkit-tap-highlight-color: transparent;
}

.preview__color.is-selected {
    border-color: var(--color-blue);
  }

.preview__color>div {
    display: none;
    position: absolute;
    bottom: calc(100% + 4px);
    left: -50px;
    right: -50px;
    justify-content: center;
    pointer-events: none;
  }

@media (min-width: 1024px) {

.preview__color>div {
      bottom: calc(100% + 9px)
  }
    }

.preview__color>div>span {
    background: var(--color-lightblue);
    color: var(--color-blue);
    border-radius: 30px;
    padding: 2px 5px;
    font-size: 9px;
    line-height: 1;
  }

.preview__color:hover>div {
    display: flex;
  }

.preview__cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

@media (min-width: 1024px) {

.preview__cta {
    flex-direction: row;
    justify-content: space-between
}
  }

.preview__cta-info {
  color: var(--color-blue);
  font-weight: 500;
}

.preview__cta-button {
  padding: 18px 25px;
}

.preview__packaging {
  margin-top: 30px;
}

@media (min-width: 1024px) {

.preview__packaging {
    margin-top: 40px
}
  }



/* Footer */
.footer {
  background: var(--color-black);
  color: var(--color-white);
}
.footer a {
    transition: color 150ms ease;
  }
.footer a:hover {
    color: var(--color-blue);
  }

.footer__row--1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--section-y-padding) 0;
}

@media (min-width: 1024px) {

.footer__row--1 {
    flex-direction: row;
    justify-content: space-between;
    padding: var(--section-y-padding) 5%
}
  }

.footer__logo {
  max-width: 260px;
  margin-bottom: var(--section-y-padding);
}

@media (min-width: 1024px) {

.footer__logo {
    max-width: 240px;
    margin-bottom: 0
}
  }

.footer__links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  margin-bottom: var(--section-y-padding);
}

.footer__links a {
    color: var(--color-white);
    line-height: 1;
  }

@media (min-width: 1024px) {

.footer__links {
    flex-direction: row;
    margin-bottom: 0
}
  }

.footer__social {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.footer__social a {
    line-height: 1;
  }

@media (min-width: 1024px) {

.footer__social {
    align-items: start;
    justify-content: center
}
  }

.footer__social-link--email {
  font-weight: bold;
}

.footer__row--2 {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  padding: var(--section-y-padding) 5%;
  /* border-top: 1px solid var(--color-white); */
  /* border-image: var(--wave-border-white);
  border-image-repeat: repeat;
  border-image-width: 5px 0 0;
  border-image-slice: 100% 0 0 0 fill; */
}

@media (min-width: 1024px) {

.footer__row--2 {
    flex-direction: row;
    justify-content: space-between
}
  }

.footer__privacy {
  margin-bottom: 50px;
}

.footer__privacy a {
    line-height: 1;
    text-transform: uppercase;
    color: #dbd7d4;
  }

@media (min-width: 1024px) {

.footer__privacy {
    margin-bottom: 0
}
  }

.footer__copyright {
  text-align: center;
  font-size: 14px;
  color: #dbd7d4;
}

@media (min-width: 1024px) {

.footer__copyright {
    text-align: left
}
  }



/* Pages */
.page {
  padding: var(--section-y-padding) var(--page-x-padding);
}

.page__title {
  margin-bottom: 20px;
}