/* General */
html {
   scroll-behavior: smooth;
}

/* body {
  color: var(--wp--preset--color--base-500-light)!important;
  font-family: var(--wp--preset--font-family--open-sans)!important;
  font-size: var(--wp--preset--font-size--medium)!important;
  line-height: 1.6!important;
  font-weight: 500!important;
} */
figure {
   line-height: 0 !important;
}

body.woocommerce .is-layout-constrained>.alignwide {
   max-width: unset !important;
}

ul {
   padding: 0;
   margin: 0;
}

ul.wp-block-page-list {
   list-style-position: inside;
}

ul.wp-block-page-list li a,
ul li a {
   color: var(--wp--preset--color--base-900-light);
   text-decoration: none;
}

.wp-block-navigation__container .wp-block-navigation-item a.wp-block-navigation-item__content:hover,
.wp-block-navigation__container .wp-block-navigation-item.current-menu-item a.wp-block-navigation-item__content {
   color: var(--wp--preset--color--base-900-light) !important;
   text-decoration: none !important;
}

section,
.entry-content {
   margin: 0 !important;
}

.green-border {
   border-color: var(--wp--preset--color--primary) !important;
}

.image-card-text {
   margin: 0;
}

.image-card-text p {
   margin-top: 0;
   margin-right: 0;
   margin-bottom: 8px;
   margin-left: 0;
   font-size: 14px;
   font-style: normal;
   font-weight: 500;
   text-align: left;
   color: var(--wp--preset--color--base-500-light);
}

.sliding-column-grey-section h3 {
   font-size: 18px !important;
}

.wp-block-query.posts-loop .wp-block-post-featured-image {
   overflow: hidden;
   border: 1px solid var(--wp--preset--color--base-100-light);
   border-width: 1px 1px 0 1px;
   border-radius: 8px 8px 0 0;
}

.overflow-hidden {
   overflow: hidden;
}

.overflow-scroll {
   overflow: scroll;
}

@media only screen and (min-width: 992px) {
   .is-hidden-on-desktop {
      display: none !important;
   }
}

@media only screen and (max-width: 992px) {

   html,
   body {
      overflow-x: hidden;
   }

   .max-width-100>*,
   .needs-width-100>div,
   .wp-block-cover.max-width-100>.wp-block-cover__inner-container>* {
      max-width: 100% !important;
   }

   .flex-basis-100>div {
      flex-basis: 100% !important;
   }

}

@media only screen and (min-width: 600px) and (max-width: 991px) {
   section {
      padding: 32px !important;
   }

   .is-hidden-on-tablet,
   .is-hidden-on-tab {
      display: none !important;
   }
}

@media only screen and (max-width: 599px) {
   main {
      margin: 0 !important;
      padding: 0 !important;
   }

   section {
      padding: 32px 16px !important;
   }

   .section-header h2 {
      font-size: 24px !important;

   }

   .has-padding-for-mobile {
      padding: 0 20px !important;
   }

   .wp-block-cover {
      min-height: unset !important;
      padding-top: 20px !important;
      padding-bottom: 20px !important;
   }

   .is-hidden-on-mobile {
      display: none !important;
   }
}


/* Header */
.top-bar-carousel {
   position: relative;
}

body .top-bar-carousel {
   display: none !important;
}

/* .coupon-text {
   display: none !important;
} */


.top-bar {
   background-color: #1d4e90!important;
}
header .coupon-text,
header .coupon-info-text {
   color: #fff !important;
}

header .coupon-text a {
   text-decoration: underline;
   color: #fff !important;
}


/* For desktop, display all items in a single row */
@media (min-width: 768px) {
   .top-bar-carousel {
      display: flex;
      justify-content: space-around;
      width: 50%;
   }

   .top-bar-carousel-item {
      position: static;
      opacity: 1;
      transition: none;
   }
}

@media (max-width: 768px) {
   .top-bar-carousel {
      display: flex;
      overflow: hidden;
      position: relative;
   }

   .top-bar-carousel-item p {
      font-weight: 700 !important;
   }

   .top-bar-carousel-item {
      min-width: calc(75%);
      transition: transform 0.5s ease;
      /* Smooth transition */
   }

   .top-bar {
      position: relative;
   }

   /* .top-bar::before {
      content: '';
      display: inline-block;
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 60px;
      background: linear-gradient(to right, rgb(140, 198, 62) 5%, rgba(140, 198, 62, 0.6) 50%, transparent 100%);
      opacity: 1;
      z-index: 999;
   }

   .top-bar::after {
      content: '';
      display: inline-block;
      position: absolute;
      right: 0;
      top: 0;
      height: 100%;
      width: 60px;
      background: linear-gradient(to left, rgb(140, 198, 62) 5%, rgba(140, 198, 62, 0.6) 50%, transparent 100%);
      opacity: 1;
      opacity: 0.5;
   } */

   header .coupon-text {
      width: 70%;
   }
   header .coupon-info-text {
   font-size: 12px !important;
}
}

.top-bar-carousel-item figure {
   border-radius: 50%;
   justify-content: center;
   display: flex;
   align-items: center;
}

header.wp-block-template-part {
   border-bottom: 0.5px solid #1A1A1A1A;
}


.wp-block-navigation__responsive-close {
   margin: 0;
}

header .wp-block-button.has-icon-on-left.is-style-outline a.wp-block-button__link {
   border-width: 1px;
   border-color: var(--wp--preset--color--base-100-light);
   background: transparent;
}

header .header-buttons {
   position: relative;
}

.sticky-header {
   position: fixed;
   top: 0;
   width: 100%;
   background-color: #FFF;
   z-index: 1000;
   padding-bottom: 10px !important;
   box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
   display: none;
   animation: slideUp 0.5;
}

.sticky {
   animation: slideDown 0.5s;
   display: block;
}

@keyframes slideDown {
   0% {
      transform: translateY(-100%);
   }

   100% {
      transform: translateY(0);
   }
}

@keyframes slideUp {
   0% {
      transform: translateY(0);
   }

   100% {
      transform: translateY(-100%);
   }
}

@keyframes displayBlock {
   to {
      display: block;
   }
}

.asl_w_container {
   position: relative;
}

.asl_w_container .asl_w.asl_m.asl_m_1.asl_m_1_1 {
   background: white;
}

#popular-products {
   position: absolute;
   background: #fff;
   z-index: 1000;
   width: 100%;
   padding: 8px;
   box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
   border: 1px solid rgba(26, 26, 26, 0.1);
   border-radius: 8px 8px 8px 8px;
   margin-top: 10px;
   display: none;
}

.grey-bg-heading {
   padding: 6px 8px;
   font-size: 16px;
   font-style: normal;
   font-weight: 500;
   line-height: 24px;
   color: var(--wp--preset--color--base-900-light);
   background: var(--wp--preset--color--base-50-light);
   border-radius: 8px;
   margin-bottom: 10px;
}

.popular-items {
   display: flex;
   flex-direction: column;
   padding: 6px 8px;
   gap: 16px;
}

.popular-search-item {
   display: flex;
   align-items: center;
}

.popular-item-img {
   width: 35px;
   height: 35px;
   border: 1px solid var(--wp--preset--color--base-200-light);
   border-radius: 50%;
   margin-right: 8px;
}

.popular-item-img img {
   height: 100%;
   width: 100%;
   border-radius: 50%;
}

.popular-item-name {
   display: flex;
   flex-direction: column;
}

.popular-search-item:hover .item-name,
.item.asl_r_product:hover a.asl_res_url {
   text-decoration: underline;
}

.popular-item-name .item-name {
   font-size: 16px;
   font-weight: 500;
   line-height: 24px;
   letter-spacing: 0em;
   color: var(--wp--preset--color--base-900-light);
   ;
}

.popular-item-name .item-category-name {
   font-size: 14px;
   font-weight: 400;
   line-height: 20px;
   letter-spacing: 0em;
   color: var(--wp--preset--color--base-500-light);
}

.mini-cart-counter {
   padding: 0 6px;
   position: absolute;
   top: 5px;
   left: 30px;
   background: var(--wp--preset--color--primary);
   height: 18px;
   line-height: 0;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 10px;
   z-index: 1;
}

.mini-cart-counter span {
   font-size: 10px !important;
   color: white !important;
   font-weight: 400;
}

@keyframes fadeIn {
   0% {
      opacity: 0;
   }

   100% {
      opacity: 1;
   }
}

@keyframes fadeOut {
   0% {
      opacity: 1;
   }

   100% {
      opacity: 0;
   }
}

@media only screen and (max-width: 599px) {

   .mobile-header .mobile-menu-icons-wrap {
      position: relative;
   }

   .mobile-header .mobile-menu-icons-wrap span,
   .mobile-header .mobile-menu-icons-wrap span a {
      font-size: 20px;
      color: var(--wp--preset--color--base-700-light);
      cursor: pointer;
   }

   .mobile-header .search-icon.active,
   body.woocommerce-cart .mobile-header .mobile-menu-icons-wrap span a {
      color: var(--wp--preset--color--base-900-light);
   }

   .mobile-header .mini-cart-counter {
      top: 0px;
      left: unset;
      right: 25%;
   }

   #nav-icon1 {
      width: 25px;
      height: 45px;
      position: relative;
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-transition: .5s ease-in-out;
      -moz-transition: .5s ease-in-out;
      -o-transition: .5s ease-in-out;
      transition: .5s ease-in-out;
      cursor: pointer;
   }

   #nav-icon1 span {
      display: block;
      position: absolute;
      height: 3px;
      width: 100%;
      background: var(--wp--preset--color--base-700-light);
      border-radius: 9px;
      opacity: 1;
      left: 0;
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-transition: .25s ease-in-out;
      -moz-transition: .25s ease-in-out;
      -o-transition: .25s ease-in-out;
      transition: .25s ease-in-out;
   }

   #nav-icon1.open span {
      background: var(--wp--preset--color--base-900-light);
   }

   #nav-icon1 span:nth-child(1) {
      top: 14px;
   }

   #nav-icon1 span:nth-child(2) {
      top: 22px;
   }

   #nav-icon1 span:nth-child(3) {
      top: 30px;
   }

   #nav-icon1.open span:nth-child(1) {
      top: 18px;
      -webkit-transform: rotate(135deg);
      -moz-transform: rotate(135deg);
      -o-transform: rotate(135deg);
      transform: rotate(135deg);
   }

   #nav-icon1.open span:nth-child(2) {
      opacity: 0;
      left: -60px;
   }

   #nav-icon1.open span:nth-child(3) {
      top: 18px;
      -webkit-transform: rotate(-135deg);
      -moz-transform: rotate(-135deg);
      -o-transform: rotate(-135deg);
      transform: rotate(-135deg);
   }

   .mobile-menu-content {
      display: none;
      position: fixed;
      left: 0;
      height: 100%;
      width: 100%;
      z-index: 10000;
      padding: 40px 20px;
      animation: fadeOut 0.8s;
      background: #F4F4F5;
   }

   .mobile-menu-content.opened {
      animation: fadeIn 0.8s;
   }

   .mobile-menu-content ul.wp-block-page-list li {
      margin-bottom: 20px;
   }

   #search-area {
      display: none;
      position: fixed;
      left: 0;
      height: 100%;
      width: 100%;
      z-index: 10000;
      padding: 40px 20px;
      background: #F4F4F5;
   }

   #search-area div.asl_w .probox {
      border-radius: 0 !important;
   }

   #search-area .promagnifier {
      margin-right: -8px;
   }

}

@media only screen and (min-width: 600px) {

   .mobile-header,
   #search-area {
      display: none;
   }
}

@media only screen and (min-width: 600px) and (max-width: 991px) {

   #desktop-header>.wp-block-group,
   #sticky-desktop-header>.wp-block-group {
      flex-direction: column;
      align-items: flex-start;
   }

   #desktop-header>.wp-block-group>.wp-block-group:first-child,
   #sticky-desktop-header>.wp-block-group>.wp-block-group:first-child {
      width: 100%;
   }
}


/* Horizontal Sliding Columns */
a.wp-block-column:hover {
   color: inherit;
}

.progress-bar-outer-wrap {
   min-width: 100%;
   max-width: 100% !important;
   margin-bottom: 16px;
   margin-top: 0;
}

.progress-bar-inner-wrap {
   width: 100%;
   display: flex;
   justify-content: flex-start;
   background-color: var(--wp--preset--color--primary-100-light);
}

.progress-bar {
   height: 2px;
   background-color: var(--wp--preset--color--primary);
}

@media only screen and (max-width: 992px) {

   /* Remove section padding */
   .mobile-sliding-section {
      padding-left: 0 !important;
      padding-right: 0 !important;
   }

   .mobile-sliding-section>div:not(.sliding-columns) {
      padding-left: 32px !important;
      padding-right: 32px !important;
   }

   /* Hide scrollbar for Chrome, Safari and Opera */
   .sliding-columns>div.wp-block-columns::-webkit-scrollbar {
      display: none;
   }

   /* Hide scrollbar for IE, Edge and Firefox */
   .sliding-columns>div.wp-block-columns {
      -ms-overflow-style: none;
      /* IE and Edge */
      scrollbar-width: none;
      /* Firefox */
   }

   .sliding-columns {
      padding: 0;
      overflow: hidden;
   }

   .sliding-columns>div.wp-block-columns {
      max-width: 100% !important;
      overflow-x: scroll;
      overflow-y: hidden;
   }

   .sliding-columns>div.wp-block-columns .wp-block-column {
      display: inline-block;
      min-width: unset;
      min-width: 40%;
   }

   .sliding-columns>div.wp-block-columns .wp-block-column:first-child {
      margin-left: 20px;
   }

   .sliding-columns>div.wp-block-columns::after {
      content: "";
      min-width: 20px;
      min-height: 100%;
   }

   .progress-bar-outer-wrap {
      padding: 0 32px;
   }
}

@media only screen and (max-width: 780px) {
   .sliding-columns div.wp-block-columns .wp-block-column {
      min-width: 60%;
   }
}

@media only screen and (max-width: 599px) {
   .mobile-sliding-section>div:not(.sliding-columns) {
      padding-left: 16px !important;
      padding-right: 16px !important;
   }

   .sliding-columns div.wp-block-columns .wp-block-column {
      min-width: 80% !important;
   }

   .progress-bar-outer-wrap {
      padding: 0 16px;
   }

}

@media only screen and (min-width: 993px) {
   .sliding-columns .wp-block-columns {
      justify-content: center;
   }

   .mobile-sliding-section .sliding-columns .wp-block-columns .wp-block-column {
      max-width: 350px;
   }

   .progress-bar-outer-wrap {
      display: none !important;
   }

}

/* Buttons */
.wp-block-button.has-width-auto {
   width: auto !important;
   flex-basis: auto !important;
}

.wp-block-button.is-style-fill a.wp-block-button__link:not(.is-in-text-form a.wp-block-button__link):hover {
   background: var(--wp--preset--color--primary-800-light) !important;
   text-decoration: none !important;
}

.wp-block-button.is-style-outline a.wp-block-button__link:hover {
   text-decoration: none !important;
}

.wp-block-button.has-icon-on-right .wp-block-button__link,
.wp-block-button.has-icon-on-left .wp-block-button__link {
   display: flex;
   justify-content: center;
   align-items: center;
   color: #FFF;
}

.wp-block-button.has-icon-on-right .wp-block-button__link:hover,
.wp-block-button.has-icon-on-left .wp-block-button__link:hover {
   color: #FFF;
}

.wp-block-button.has-icon-on-right .wp-block-button__link span {
   margin-left: 10px;
}

.wp-block-button.has-icon-on-left .wp-block-button__link span {
   margin-right: 10px;
}

.wp-block-button.is-in-text-form .wp-block-button__link {
   border: none;
}

.wp-block-button.has-icon-on-right.is-in-text-form .wp-block-button__link:not(.text-in-center a.wp-block-button__link) {
   justify-content: flex-start;
}

@media only screen and (max-width: 599px) {
   .has-width-for-mobile {
      flex-basis: 73%;
   }
}

/* VMT Image Card Blocks */
.image-card-blocks figure img {
   max-width: 100%;
   height: auto;
}

.image-card .wp-block-column a,
.image-card .wp-block-column a:hover,
.faqs a:hover {
   color: unset !important;
}

/* Footer */
.pre-footer-cta {
   margin: 0 !important;
}

footer {
   margin-top: 0;
}

footer .custom-logo {
   margin-left: -6px;
}

footer .footer h6 {
   margin: 20px 0 0;
}

footer .footer ul.wp-block-page-list {
   display: flex;
   flex-direction: column;
   justify-content: space-evenly;
}

footer .footer ul li a {
   color: var(--wp--preset--color--base-500-light);
}

footer .footer .wp-block-column.is-vertically-aligned-top {
   align-self: stretch;
}

footer .footer ul.social-links li {
   position: relative;
   list-style-type: none;
   padding-left: 28px;
   margin-bottom: 8px;
}

footer .footer ul.social-links li a:hover {
   color: var(--wp--preset--color--base-900-light);
}

footer .footer ul.social-links li a:before {
   content: "";
   position: absolute;
   left: 2px;
   top: 2px;
   width: 20px;
   height: 21px;
   background-repeat: no-repeat;
}

footer .footer ul.social-links li.facebook-item a:before {
   background-image: url('../images/svgs/facebook.svg');
}

footer .footer ul.social-links li.instagram-item a:before {
   background-image: url('../images/svgs/instagram.svg');
}

footer .footer ul.social-links li.linkedin-item a:before {
   background-image: url('../images/linkedin.png');
   background-size: contain;
}

footer .footer ul.social-links li.tiktok-item a:before {
   background-image: url('../images/svgs/tiktok.svg');
}

.pre-footer-categories-list {
   padding: 56px 32px;
   display: flex;
   flex-wrap: wrap;
}

.footer-category {
   width: 19%;
   margin-bottom: 24px;
}


.footer-category:nth-child(1),
.footer-category:nth-child(6) {
   width: 24%;
}

.footer-category ul {
   list-style: none;
   width: 90%;
}

.footer-category ul li {
   line-height: 20px;
}

.footer-category h6 {
   text-transform: unset;
   font-size: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.455), 12px);
   font-weight: 600;
}

.footer-category a {
   font-size: clamp(12px, 0.875rem + ((1vw - 3.2px) * 0.455), 10px);
   font-weight: 500;
}

@media only screen and (max-width: 781px) {

   .footer-cta .wp-block-buttons {
      justify-content: flex-start;
   }
}

@media only screen and (min-width: 415px) and (max-width: 599px) {

   footer .footer-cta h2 {
      font-size: var(--wp--preset--font-size--x-large) !important;
   }

   footer .footer h6 {
      margin-bottom: 10px;
   }

   footer .footer .social-links {
      margin-top: 10px;
   }
}

@media only screen and (min-width: 781px) and (max-width: 1000px) {
   footer .footer .wp-block-columns {
      flex-wrap: wrap !important;
   }
}

@media only screen and (min-width: 599px) {
   .pre-footer-categories-list>.footer-category:nth-last-child(-n+5) {
      margin-bottom: 0;
   }
}

@media only screen and (max-width: 599px) {
   .pre-footer-categories-list {
      padding: 32px 16px;
   }

   .pre-footer-categories-list>.footer-category:nth-last-child(-n+2) {
      margin-bottom: 0;
   }

   .footer-category {
      width: 50% !important;
   }

   .footer-category ul {
      width: 95% !important;
   }

   footer .footer-about {
      padding: 0 !important;
   }
}






/* ======================================================================== *
                                          HOME
 * ======================================================================== */

/*  Hero Section  */
.hero-section,
.wp-block-cover {
   background-color: #f4f4f5;
}

@media only screen and (min-width: 993px) and (max-width: 1200px) {
   .hero-section picture img {
      object-position: -50% 50% !important;
   }
}

@media only screen and (min-width: 1201px) and (max-width: 1600px) {
   .hero-section picture img {
      object-position: 90% 50% !important;
   }
}

ul.hero-list li {
   position: relative;
   list-style-type: none;
   padding-left: 15px;
   margin-bottom: 10px;
}

ul.hero-list li:before {
   content: "";
   position: absolute;
   left: -20px;
   width: 26px;
   height: 26px;
   background-image: url('../images/svgs/list-icon.svg');
}

.hero-rating-stars a {
   display: flex !important;
}

.kiyoh-hero-img {
   margin-top: -9px !important;
}

@media only screen and (max-width: 599px) {
   .hero-section {
      padding: 20px !important;
   }

   .hero-section h1 {
      font-size: 36px !important;
   }

   .hero-section h2 {
      font-size: var(--wp--preset--font-size--x-large) !important;
   }

   .hero-section h2 span {
      display: block;
   }

   .hero-section .bulk-sale-btn a {
      padding-left: 8px !important;
      padding-right: 8px !important;
   }

   .hero-review-wrap>.wp-block-group {
      margin-top: -5px !important;
   }
}

/* Tabs */
.rounded-tab-buttons p {
   border-bottom: 2px solid #FFF;
   cursor: pointer;
   color: var(--wp--preset--color--base-700-light);
   transition: font-weight 0.5s ease-out 100ms;
   transition: color 0.5s ease-out 100ms
}

.rounded-tab-buttons p:hover {
   color: var(--wp--preset--color--base-900-light);
   font-weight: 700 !important;
}

.rounded-tab-buttons p.active {
   border-bottom-color: var(--wp--preset--color--base-900-light);
   color: var(--wp--preset--color--base-900-light);
   font-weight: 700 !important;
}

.tab-content {
   margin-top: 0;
   display: none !important;
}

.tab-content.active {
   display: flex !important;
}

@media only screen and (max-width: 599px) {
   .rounded-tab-buttons {
      margin-bottom: 12px;
   }

   #brands-section .rounded-tab-buttons {
      justify-content: flex-start !important;
      overflow-x: scroll;
      -ms-overflow-style: none;
      /* IE and Edge */
      scrollbar-width: none;
      /* Firefox */
   }

   /* Hide scrollbar for Chrome, Safari and Opera */
   .rounded-tab-buttons::-webkit-scrollbar {
      display: none;
   }
}

@media only screen and (min-width: 386px) and (max-width: 1440px) {
   #brands-section .rounded-tab-buttons {
      gap: 40px;
   }
}

@media only screen and (max-width: 385px) {
   #brands-section .rounded-tab-buttons {
      gap: 28px;
   }
}

/*  Grey Background Slider Sections  */
.grey-bg-slider .wp-block-columns {
   border-radius: 4px;
}

.grey-bg-slider .wp-block-column {
   max-width: 350px;
   border-radius: 4px;
}

@media only screen and (min-width: 601px) and (max-width: 780px) {
   .grey-bg-slider .sliding-columns div.wp-block-columns .wp-block-column {
      min-width: 80% !important;
   }
}

@media only screen and (max-width: 600px) {
   .grey-bg-slider .wp-block-columns {
      gap: 8px !important;
      justify-content: flex-start;
      padding: 12px !important;
      margin-left: 16px;
      border-radius: 4px 0 0 4px;
   }

   .grey-bg-slider .wp-block-columns .wp-block-column:first-child:first-child {
      margin-left: 0 !important;
   }

   .grey-bg-slider .wp-block-columns::after {
      content: "";
      min-width: 4px !important;
      min-height: 100%;
   }

   .grey-bg-slider .sliding-columns div.wp-block-columns .wp-block-column {
      min-width: 95% !important;
   }
}

/*  Brands Section  */
#brands-section .wp-block-column:hover .text-section {
   color: var(--wp--preset--color--base-900-light) !important;
}

/*  Reviews Section  */
.review-text-block {
   overflow: hidden;
}

.review-text-block p {
   overflow: hidden;
   text-overflow: ellipsis;
}

.tp-cta-link img {
   width: 55px;
   margin: -8px 4px 0;
}

@media only screen and (min-width: 992px) {
   .wp-block-columns.review-columns .wp-block-column:last-child {
      display: none;
   }
}

@media only screen and (max-width: 600px) {
   .wp-block-columns.review-columns {
      overflow: unset !important;
   }
}

/*  How we work Section  */

.how-it-works p strong {
   color: var(--wp--preset--color--base-900-light);
}

.how-it-works .wp-block-separator {
   width: 1125px !important;
}

.how-it-works-video {
   width: 45% !important;
}

@media only screen and (max-width: 992px) {
   .how-it-works .wp-block-separator {
      display: none;
   }

   .how-it-works-video {
      width: 60% !important;
   }
}

@media only screen and (max-width: 768px) {
   .how-it-works-video {
      width: 90% !important;
   }
}

/*  We Plant Trees Section  */
@media only screen and (max-width: 599px) {
   .we-plant-trees .planted-trees-count-row {
      flex-direction: column;
      align-items: flex-start;
      gap: unset;
   }
}

/*  FAQs Section  */
.accordion-container {
   transition: 0.4s;
   position: relative;
   border: 1px solid var(--wp--preset--color--base-300-light);
   border-radius: 8px;
   padding: 16px 24px;
}

.accordion-head {
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.accordion-head :where(h3, h4) {
   font-weight: 400;
   font-size: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.227), 16px);
   width: 90%;
   line-height: normal;
}

.accordion-head.active :where(h3, h4) {
   font-weight: 700;
}

.accordion-head .faq-icon i {
   color: var(--wp--preset--color--primary);
   padding: 16px 8px;
   background: var(--wp--preset--color--primary-50-light);
   border-radius: 8px;
   font-size: 1.5rem;
   line-height: 0;
}

.accordion-head.active .faq-icon i.fa-plus,
.accordion-head .faq-icon i.fa-minus {
   display: none;
}

.accordion-head .faq-icon i.fa-plus,
.accordion-head.active .faq-icon i.fa-minus {
   display: block;
}

.panel {
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.4s ease-out;
}

.panel>* {
   margin-top: 10px !important;
   margin-bottom: 0;
   font-size: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.227), 16px);
   font-weight: 500;
   color: var(--wp--preset--color--base-500-light);

}

@media only screen and (max-width: 599px) {
   .accordion-container {
      padding: 16px 12px;
   }

   .accordion-head :where(h3, h4) {
      width: 80%;
   }
}


/* ======================================================================== *
                                          About
 * ======================================================================== */
.about-page-hero-section h2 span {
   display: unset !important;
}

@media only screen and (min-width: 778px) {
   .hero-section-mobile-heading {
      display: none;
   }
}

@media only screen and (max-width: 778px) {
   .hero-section-desktop-heading {
      display: none;
   }
}

@media only screen and (max-width: 599px) {
   .hero-section-mobile-heading {
      font-size: 36px;
      line-height: 40px;
   }
}

/* ======================================================================== *
                                          Voor bedrijn
 * ======================================================================== */

.what-you-can-do .wp-block-columns .wp-block-column {
   border-radius: 8px;
}

.what-you-can-do .contact-columns figure {
   padding-bottom: 4px;
}

/* ======================================================================== *
                                          Mobile Verkopen
 * ======================================================================== */
#mobile-verkopen-list {
   list-style-type: disc;
}

/* ======================================================================== *
                                          404 Page
 * ======================================================================== */
body.error404 footer .wp-block-cover.footer-cta {
   display: none;
}

/* ======================================================================== *
                                          Posts Loop
 * ======================================================================== */

.wp-block-query.posts-loop ul li {
   margin: 0;
}

*/ .wp-block-query ul li .wp-block-post-title {
   width: 80%;
}

@media only screen and (max-width: 600px) {
   .wp-block-query.posts-loop {
      max-width: 100%;
   }
}

/*
=======================================================

CSS FOR PRODUCT CATEGORY ON HOMEPAGE 

=======================================================
*/
.moving-bg-cards {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
   margin: 24px 0;
}

.card-item-wrap {
   flex: 0 1 auto;
}

/* Default: 3 cards = each gets 33.33% */
.moving-bg-cards .card-item-wrap {
   width: calc(33.33% - 11px);
}

/* If only 1 or 2 cards, make them 50% */
.moving-bg-cards:has(.card-item-wrap:nth-child(2)):not(:has(.card-item-wrap:nth-child(3))) .card-item-wrap,
.moving-bg-cards:has(.card-item-wrap:nth-child(1)):not(:has(.card-item-wrap:nth-child(2))) .card-item-wrap {
   width: calc(50% - 8px);
}


.card-item-wrap-inner>* {
   border: 1px solid #1A1A1A1A;
}

.moving-bg-cards .image-wrap {
   display: flex;
   justify-content: center;
   align-items: center;
   border-bottom-width: 0;
   border-color: #8CC63E33;
   border-top-right-radius: 4px;
   border-top-left-radius: 4px;
   padding-top: 32px;
   position: relative;
   overflow: hidden;
}

.moving-bg-cards .image-wrap::before {
   content: '';
   width: 100%;
   height: 150%;
   background: #8cc63e1a;
   position: absolute;
   z-index: -1;
   right: -40px;
   top: -80%;
   border-radius: 100%;
   transition: all 0.3s ease-in-out 0.05s;
}

.card-item-wrap-inner:hover .image-wrap::before {
   top: -55%;
   width: 115%;
   border-bottom-left-radius: 88%;
   border-bottom-right-radius: 70%;
}

.moving-bg-cards .image-wrap-inner {
   width: 50%;
}

.btn-wrap {
   width: 100%;
   display: flex;
   justify-content: center;
   gap: 24px;
   border-top-width: 0;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
   padding-bottom: 32px;
}

@media(max-width:599px) {
   .moving-bg-cards .image-wrap {
      padding-top: 24px;
   }

   .moving-bg-cards .card-item-wrap {
      width: calc(50% - 11px);
   }

   /* If only 1 or 2 cards, make them 50% */

   /* .moving-bg-cards:has(.card-item-wrap:nth-child(2)):not(:has(.card-item-wrap:nth-child(3))) .card-item-wrap, */
   .moving-bg-cards:has(.card-item-wrap:nth-child(1)):not(:has(.card-item-wrap:nth-child(2))) .card-item-wrap {
      width: 100%;
   }

   .card-item-wrap-inner:hover .image-wrap::before {
      width: 120%;
   }

   .moving-bg-cards .image-wrap-inner {
      width: 60%;
   }

   .btn-wrap {
      padding-bottom: 16px;
      gap: 12px;
   }
}

@media(max-width:499px) {
   .card-item-wrap-inner:hover .image-wrap::before {
      width: 125%;
   }
}

@media(max-width:399px) {
   .moving-bg-cards .image-wrap::before {
      width: 115%;
      height: 155%;
   }

   .card-item-wrap-inner:hover .image-wrap::before {
      width: 130%;
   }
}

.imei-no {
   clear: both;
   display: block;
}