/* Overwrite main module-header styles */
.acubiz__integrations-overview .visma-module-header .visma-module {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.acubiz__integrations-overview .visma-module-header .visma-module > * {
  width: var(--header-text-width);
}

.acubiz__integrations-overview .visma-module-header :last-child {
    margin-bottom: 0 !important;
}

.acubiz__integrations-overview .top-section__title {
  margin-bottom: var(--space-32);
}

.acubiz__integrations-overview .visma-module-header {
  padding-bottom: var(--space-48);
}

.acubiz__integrations-overview .visma-module-header:not(.--no_bg) {
  padding-bottom: var(--space-64);
}

.--no_bg + .acubiz__integrations-overview__content {
  padding-top: var(--space-16);
}

.acubiz__integrations-overview .visma-module-header .visma-module {
  margin: unset;
}

.acubiz__integrations-overview__content {
  padding-top: var(--space-32);
}

/* filters */
.acubiz__integrations-overview__filter-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
    margin-top: 0;
    margin-bottom: var(--space-32);
    padding-left: 0;
    list-style-type: none;
    justify-content: center;
}

.acubiz__integrations-overview__filter-wrapper button {
    background-color: #F8F8F8;
    color: #1a1a1a;
    border: 2px solid transparent;
}

.acubiz__integrations-overview__filter-wrapper button.active {
    background-color: #DDDDDC;
    color: var(--site-text-dark);
    border: 2px solid transparent;
}

.acubiz__integrations-overview__filter-wrapper button:focus {
    outline: none;
    border: 2px solid transparent;
    box-shadow: none;
}


/* cards */
.acubiz__integrations-overview__cards-wrapper {
  /* --row-gap: var(--space-16); */
  --card-padding-bottom: var(--space-24);
  --image-radius: 0;
  --card-radius: 0;
  --image-layout: cover;
  --image-width: auto;
  --image-height: auto;
  --image-align-horizontal: flex-start;
  --image-align-vertical: flex-start;
  --image-position-horizontal: center;
  --image-position-vertical: center;
  display: grid;
  /* column-gap: var(--column-gap); */
  /* row-gap: var(--row-gap); */
}
/* IMAGE CARD OPTION STYLES */
.acubiz__integrations-overview__cards-wrapper.-rounded-image {
  --image-radius: var(--radius-16);
}

.acubiz__integrations-overview__cards-wrapper.-round-image-shape {
  --image-radius: 50%;
  --image-layout: cover;
}
.acubiz__integrations-overview__cards-wrapper.-square-image-shape {
  --image-radius: 0;
}

.acubiz__integrations-overview__cards-wrapper.-image-cover {
  --image-layout: cover;
  --image-align-horizontal: center;
  --image-align-vertical: center;
  --image-width: 100%;
  --image-height: 100%;
}

.acubiz__integrations-overview__card-image-container {
  display: flex;
  flex-direction: column;
  justify-content: var(--image-align-vertical);
  align-items: var(--image-align-horizontal);
  margin-bottom: var(--space-32);
}

.acubiz__integrations-overview__cards-wrapper.center-horizontal-image {
  --image-align-horizontal: center;
  --image-position-horizontal: center;
}
.acubiz__integrations-overview__cards-wrapper.left-horizontal-image {
  --image-align-horizontal: flex-start;
}
.acubiz__integrations-overview__cards-wrapper.right-horizontal-image {
  --image-align-horizontal: flex-end;
}
.acubiz__integrations-overview__cards-wrapper.center-vertical-image {
  --image-align-vertical: center;
}
.acubiz__integrations-overview__cards-wrapper.top-vertical-image {
  --image-align-vertical: flex-start;
}
.acubiz__integrations-overview__cards-wrapper.bottom-vertical-image {
  --image-align-vertical: flex-end;
}
.acubiz__integrations-overview__card-image {
    border-radius: var(--image-radius);
    object-fit: var(--image-layout);
    object-position: var(--image-position-horizontal) var(--image-position-vertical);
    margin: 0 !important;
}

.acubiz__integrations-overview__cards-wrapper.-image-cover .acubiz__integrations-overview__card-image {
  aspect-ratio: inherit;
  width: 100%;
  height: 100%;
}
/* END IMAGE CARD OPTION STYLES */

.acubiz__integrations-overview__card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: var(--space-24);
    border-radius: var(--card-radius);
    position: relative;
    border: 1px solid #DDDDDC;
    transition: transform 150ms ease, box-shadow 150ms ease, opacity 180ms ease;
}

.acubiz__integrations-overview__card:hover {
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
  z-index: 10;
  transform: translateY(-2px);
}

.acubiz__integrations-overview__card.hide {
  display: none;
  opacity: 0;
}

.acubiz__integrations-overview__cards-wrapper.-image-cover .acubiz__integrations-overview__card {
  justify-content: flex-start;
}

.acubiz__integrations-overview__card-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.acubiz__integrations-overview__card-title {
    margin-bottom: var(--space-8);
}

.acubiz__integrations-overview__cards-wrapper.-image-cover .acubiz__integrations-overview__card-title {
  margin-top: 0;
}

.acubiz__integrations-overview__card-main-container p {
    margin-bottom: 0;
}

.acubiz__integrations-overview__card-main-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-16);
    margin-bottom: var(--space-16);
}

.acubiz__integrations-overview__card-cta-container {
    align-self: flex-end;
    margin-top: auto;
}
.acubiz__integrations-overview__card-cta-container:has(.acubiz__integrations-overview_card-tag) {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.acubiz__integrations-overview__card-cta-container .cta {
    transform: scale(1.5);
    color: var(--site-text-dark);
}

.acubiz__integrations-overview__cta-container { 
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--space-24);
}

@media screen and (min-width: 768px) {
    /* cards */
    .acubiz__integrations-overview__cards-wrapper { 
        /* --row-gap: var(--space-32); */
        /* --column-gap: var(--space-32); */
        grid-template-columns: repeat(2, minmax(200px, 1fr));
        grid-auto-flow: row dense;
    }
}

@media screen and (min-width: 1050px) {
    /* header */
    .acubiz__integrations-overview .visma-module-header {
      padding-bottom: var(--space-48);
    }

    .acubiz__integrations-overview .visma-module-header:not(.--no_bg) {
      padding-bottom: var(--space-128);
    }

    .--no_bg + .acubiz__integrations-overview__content {
      padding-top: var(--space-48);
    }

  .acubiz__integrations-overview__content {
    padding-top: var(--space-16);
  }

  /* cards */
  .acubiz__integrations-overview__cards-wrapper {
      /* --row-gap: var(--space-48); */
      /* --column-gap: var(--space-48); */
      grid-template-columns: repeat(3, minmax(200px, 1fr));
      grid-auto-flow: row dense;
  }

  /* .acubiz__integrations-overview__card {
      padding: var(--space-32);
  } */

  .acubiz__integrations-overview__card-title {
      margin-bottom: var(--space-16);
  }

  .acubiz__integrations-overview__card-main-container {
    gap: var(--space-24);
  }

  .acubiz__integrations-overview__cta-container {
      margin-top: var(--space-48);
  }
}

@media screen and (min-width: 1600px) {
  .acubiz__integrations-overview__card-title {
    margin-bottom: var(--space-24);
  }
}

@media (max-width: 480px) {
  .columns__card__cta {
    width: 100%;
    justify-content: center;
  }
}
  --row-gap: var(--space-16);
  --card-padding-bottom: var(--space-24);
  --image-radius: 0;
  --card-radius: 0;
  --image-layout: cover;
  --image-width: auto;
  --image-height: auto;
  --image-align-horizontal: flex-start;
  --image-align-vertical: flex-start;
  --image-position-horizontal: center;
  --image-position-vertical: center;
  display: grid;
  column-gap: var(--column-gap);
  row-gap: var(--row-gap);
}
/* IMAGE CARD OPTION STYLES */
.product-finder__cards-wrapper.-rounded-card {
  --card-radius: var(--radius-16);
}

.product-finder__cards-wrapper.-rounded-image {
  --image-radius: var(--radius-16);
}

.product-finder__cards-wrapper.-round-image-shape {
  --image-radius: 50%;
  --image-layout: cover;
}
.product-finder__cards-wrapper.-square-image-shape {
  --image-radius: 0;
}

.product-finder__cards-wrapper.-image-cover {
  --image-layout: cover;
  --image-align-horizontal: center;
  --image-align-vertical: center;
  --image-width: 100%;
  --image-height: 100%;
}

.product-finder__card-image-container {
  display: flex;
  flex-direction: column;
  justify-content: var(--image-align-vertical);
  align-items: var(--image-align-horizontal);
  margin-bottom: var(--space-32);
}

.product-finder__cards-wrapper.center-horizontal-image {
  --image-align-horizontal: center;
  --image-position-horizontal: center;
}
.product-finder__cards-wrapper.left-horizontal-image {
  --image-align-horizontal: flex-start;
}
.product-finder__cards-wrapper.right-horizontal-image {
  --image-align-horizontal: flex-end;
}
.product-finder__cards-wrapper.center-vertical-image {
  --image-align-vertical: center;
}
.product-finder__cards-wrapper.top-vertical-image {
  --image-align-vertical: flex-start;
}
.product-finder__cards-wrapper.bottom-vertical-image {
  --image-align-vertical: flex-end;
}
.product-finder__card-image {
    border-radius: var(--image-radius);
    object-fit: var(--image-layout);
    object-position: var(--image-position-horizontal) var(--image-position-vertical);
    margin: 0 !important;
}
/* Background card image styles */
.product-finder__card.background.background-image {
  height: 400px;
  justify-content: flex-end;
}
.product-finder__card.background-image .product-finder__card-image {
  height: 40px;
}
.product-finder__card.background.background-image .product-finder__card-cta-container {
  margin-top: 0;
}
.product-finder__cards-wrapper.-image-cover .product-finder__card-image {
  aspect-ratio: inherit;
  width: 100%;
  height: 100%;
}
/* END IMAGE CARD OPTION STYLES */

.product-finder__card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: var(--space-24);
    border-radius: var(--card-radius);
    position: relative;
}

.product-finder__cards-wrapper.-image-cover .product-finder__card {
  justify-content: flex-start;
}

.product-finder__card-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.product-finder__card-title {
    margin-bottom: var(--space-8);
}

.product-finder__cards-wrapper.-image-cover .product-finder__card-title {
  margin-top: 0;
}

.product-finder__card-main-container p {
    margin-bottom: 0;
}

.product-finder__card-main-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-16);
    margin-bottom: var(--space-16);
}

.product-finder__card-cta-container {
    align-self: flex-end;
    margin-top: auto;
}
.product-finder__card-cta-container:has(.product-finder_card-tag) {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.product-finder__card-cta-container .cta {
    transform: scale(1.5);
}

.product-finder__cta-container { 
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--space-24);
}
/* Dropdown variant */
.product-finder__filter-wrapper.-dropdown {
  position: relative;
  display: inline-block;
  cursor: pointer;
  max-width: 100%;
  appearance: none;
  background-position: 94%;
  background-repeat: no-repeat;
  background-color: #fff;
  border: var(--border);
  border-radius: 8px;
  --border: 1px solid #888;
  padding: var(--space-16) var(--space-32);
  line-height: normal;
}

@media screen and (min-width: 768px) {
    /* cards */
    .product-finder__cards-wrapper { 
        --row-gap: var(--space-32);
        --column-gap: var(--space-32);
        --column-count: 2;
        grid-template-columns: repeat(var(--column-count),minmax(200px,1fr));
    }  
    .product-finder__filter-wrapper.-dropdown { 
      width: 25%;
    }      
}

@media screen and (min-width: 1050px) {
    /* header */
    .product-finder .visma-module-header {
      padding-bottom: var(--space-48);
    }

    .product-finder .visma-module-header:not(.--no_bg) {
      padding-bottom: var(--space-128);
    }

    .--no_bg + .product-finder__content {
      padding-top: var(--space-48);
    }

    /* filter */
    .product-finder__filter-wrapper:has(.-tabs) {
      display: flex;
      gap: 0;
      margin-bottom: var(--space-48);
      border-bottom: 2px solid;
      border-color: color-mix(in srgb, var(--site-text-color), transparent 85%);
  }
  
  .product-finder__filter-wrapper .filter-btn.-tabs {
      background: none;
      font: inherit;
      font-size: 2.4rem;
      outline: inherit;
      color: var(--site-text-color);
      border: none;
      border-radius: 0;
      border-bottom: 4px solid transparent !important;
      position: relative;
      z-index: 0;
      margin: 0 var(--space-24);
      padding: var(--space-12) 0;
  }

  .product-finder__filter-wrapper li:nth-child(1) button.-tabs {
      margin-left: 0;
  }

  .product-finder__filter-wrapper button.active.-tabs {
    background-color: transparent;
    color: var(--site-brand-color);
  }

  .product-finder__filter-wrapper button.active.-tabs::after {
      content: "";
      position: absolute;
      bottom: -7px;
      left: 0;
      width: 100%;
      height: 4px;
      background-color: var(--site-brand-color);
      z-index: -1;
  }

  .product-finder__content {
    padding-top: var(--space-16);
  }

  /* cards */
  .product-finder__cards-wrapper[data-col-count="2"] {
      --column-count: 2;
  }
  .product-finder__cards-wrapper[data-col-count="3"],
  .product-finder__cards-wrapper[data-col-count="4"] {
      --column-count: 3;
  }
  .product-finder__cards-wrapper {
      --row-gap: var(--space-48);
      --column-gap: var(--space-48);
      grid-template-columns: repeat(var(--column-count),minmax(200px,1fr));
  }

  .product-finder__card {
      padding: var(--space-32);
  }

  .product-finder__card-title {
      margin-bottom: var(--space-16);
  }

  .product-finder__card-main-container {
    gap: var(--space-24);
  }

  .product-finder__cta-container {
      margin-top: var(--space-48);
  }
}

@media screen and (min-width: 1600px) {
  .product-finder__cards-wrapper[data-col-count="4"] {
    --column-count: 4;
  }
  .product-finder__card {
    padding: var(--space-48);
  }

  .product-finder__card-title {
    margin-bottom: var(--space-24);
  }
}

@media (max-width: 480px) {
  .columns__card__cta {
    width: 100%;
    justify-content: center;
  }
}