/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

  /* Fix white text on yellow buttons and UI elements v1 */
.background-default .hs-button.primary, 
.background-light-1 .hs-button.primary, 
.background-light-2 .hs-button.primary {
  --text-color: #000000 !important;
}
.background-default,
.background-light-1,
.background-light-2 {
  --cta-text-color: #000000 !important;
}

li.hs-form-booleancheckbox label input:checked + span::after {
  border-color: #000000 !important;
}
.background-default .quotation-slider__button svg path,
.background-light-1 .quotation-slider__button svg path,
.background-light-2 .quotation-slider__button svg path {
  filter: invert(0) !important;
}
.background-default .cta.-tertiary,
.background-light-1 .cta.-tertiary,
.background-light-2 .cta.-tertiary {
  color: #000000;
}
.background-dark-1 .cta.-tertiary,
.background-dark-2 .cta.-tertiary,
.background-dark-3 .cta.-tertiary,
.background-dark-4 .cta.-tertiary {
  color: var(--site-brand-light-color) !important;
}
.background-default .tabs__button-wrapper button,
.background-light-1 .tabs__button-wrapper button,
.background-light-2 .tabs__button-wrapper button {
  color: #000000 !important;
}
.background-light-1 .tabs__button-wrapper button.active,
.background-light-2 .tabs__button-wrapper button.active {
  border-color: #000000 !important;
}

.background-default .quote__author-name,
.background-light-1 .quote__author-name,
.background-light-2 .quote__author-name {
  color: #000000 !important;
}

.background-default .hs_cos_wrapper.form-title,
.background-light-1 .hs_cos_wrapper.form-title,
.background-light-2 .hs_cos_wrapper.form-title {
  color: #000000 !important;
}

.background-light-4 .cta {
   --background-color: #132A4E;
   color: var(--site-text-light);
}

/* End of cta fixes */

/*****************************************/
/* HEADER & FOOTER   */
/*****************************************/

/* transparent header */
@media screen and (min-width: 1200px) {
    .header-wrapper .background:not(.submenu-list):not(.site-search) {
        --background-color: transparent;
    }
}

/* Override text color on header primary button */
.header-wrapper a.cta.-primary {
    color: var(--site-text-dark);
}
/* Footer image */
.body-wrapper > div:nth-child(2) > div:not([class*="background-dark"]) {
    background-color: #ffffff; /* Set background color */
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/Footer-Mobile.svg);
    background-repeat: no-repeat;
    background-position: right bottom; /* Pin image to lower right */
}
/* Footer social icons */

.footer-social .social-links__icon svg,
.footer-social .social-links__icon svg:hover,
.footer-social .social-links__icon svg:focus,
.footer-social .social-links__icon:hover svg,
.footer-social .social-links__icon:focus svg {
    fill: black;
}

.background-default .quotation-slider__button:not(.--inactive) svg,
.background[class*="background-light"] .quotation-slider__button:not(.--inactive) svg {
    filter: unset;
}



/*****************************************/
/************** FRONT PAGE ***************/
/*****************************************/

/* Waves bg - front page & product page */
/* Make the background image container disapear */
.front-page .row-fluid-wrapper.row-depth-1.row-number-1.dnd-section:first-of-type,
.product-page .row-fluid-wrapper.row-depth-1.row-number-1.dnd-section:first-of-type {
    height: 0 !important;
}

.front-page span[data-hs-cos-type=rich_text],
.product-page span[data-hs-cos-type=rich_text] {
  max-width: 100vw;
}


@keyframes animation01 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(32px, 0px); transform: scale(1.5, 1); } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation02 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(28px, 0px); transform: scale(1.3, 1);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation03 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(24px, 0px); transform: scale(1.1, 1);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation04 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(24px, 0px); transform: scale(1, 1.02);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation05 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(8px, 0px); transform: scale(0.9, 1);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation06 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(4px, 0px); transform: scale(0.8, 1.02);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}

.front-page #animationLayerContainer {
    position: absolute; /* Change position to sticky */
    top: 0; /* Align to the top of the viewport */
    width: 100%; /* Fill the entire width of the screen */
    z-index: -3; /* Place the container under everything else */
}

.front-page #animationLayerContainer img {
    position: absolute; /* Set position to absolute */
    top: -32px; /* Offset by 32px down */
    right: -32px; /* Offset by 32px right */
    display: block; /* Ensure images stack on top of each other */
    animation-timing-function: ease-in-out;
    max-height: 1325px
}

#animationLayer01 { 
    animation: animation01 10s ease-in-out infinite alternate;
}

#animationLayer02 {
    animation: animation02 10s ease-in-out infinite alternate;
}

#animationLayer03 {
    animation: animation03 10s ease-in-out infinite alternate;
}

#animationLayer04 {
    animation: animation04 10s ease-in-out infinite alternate;
    transform-origin: top right;
}

#animationLayer05 {
    animation: animation05 10s ease-in-out infinite alternate;
}

#animationLayer06 {
    animation: animation06 15s ease-in-out infinite alternate;
    transform-origin: top right;
}

/* Front page - Add transparent bg  */
.front-page .visma-module-wrapper.background-default,
.product-page .visma-module-wrapper.background-default {
    background-color: transparent;
    color: var(--site-text-dark);
}

.front-page .visma-module-wrapper.background-default > * {
    color: var(--site-text-dark);
}

.front-page .banner-block__cta.module-cta-container .cta.-primary {
    --text-color: var(--site-text-dark);
}

/* Front page - Tiles style */
.front-page .tile {
    background-color: #132A4E;
}
/* tiles images */
.front-page #hs_cos_wrapper_dnd_area-module-4 .tile:nth-child(1) {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/tiles1.svg);
    background-size: cover;
    background-position: right;
}
.front-page #hs_cos_wrapper_dnd_area-module-4 .tile:nth-child(2) {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/tiles2.svg);
    background-size: cover;
    background-position: right;
}
.front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(1) {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/tiles3.svg);
    background-size: cover;
    background-position: right;
    color: var(--site-text-light);
}

.front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(1) .cta {
    color: black;
}

.front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(2) {
    background-color: #1CD9E9;
}

.front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(3) {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/tile5.png);
    background-size: cover;
    background-position: right;
}

.front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(3) .tile__content{
    height: 100%;
    display: flex;
    align-items: flex-end;
    text-align: center;
}
.front-page #hs_cos_wrapper_dnd_area-module-4 .tile__content-text p {
    max-width: 70%;
}

/* Front page text 2 col */
.front-page #hs_cos_wrapper_dnd_area-module-5 .visma-module-wrapper {
    padding-bottom: var(--space-32);
}
.front-page .text-block.-two-column-layout section:first-child{
    max-width: 10%;
}
.front-page .text-block.-two-column-layout section:nth-child(2) {
    max-width: 100%;
}

.front-page .text-block.-two-column-layout .kicker-text {
    color: var(--site-text-dark);
}

@media  screen and (min-width: 768px) {
    .front-page #hs_cos_wrapper_dnd_area-module-5 .visma-module-wrapper {
        padding-bottom: var(--space-64);
    }
} 


/* Front page - columns (numbers)  */
.front-page #hs_cos_wrapper_dnd_area-module-6 .visma-module-wrapper {
    padding-top: 0;
}
.front-page #hs_cos_wrapper_dnd_area-module-6 .visma-module {
    border-top: 1px solid #000;
}

.front-page #hs_cos_wrapper_dnd_area-module-6 .columns__card-container  {
    margin-top: var(--space-32);
}
.front-page #hs_cos_wrapper_dnd_area-module-6 .columns__card__header {
    font-size: var(--title-xlarge-size);
}

.front-page #hs_cos_wrapper_dnd_area-module-6 .columns__card__text-container {
    padding: 0;
}


@media  screen and (min-width: 768px) {
    .front-page #hs_cos_wrapper_dnd_area-module-6 .columns__card-container  {
        margin-top: var(--space-64);
    }
} 

/* Front page columns cta color */
.front-page .columns__card .cta {
    color: black;
}

/* Video kicker */
.front-page .video__top-section .kicker-text {
    width: fit-content;
    padding: 8px 16px;
    background-color: #1CD9E9;
    color: black;
    border-radius: 8px;
}

/* form */
.front-page .form-card-style.form-align-center,
.product-page .form-card-style.form-align-center {
    max-width: 100%;
}


@media screen and (min-width: 1200px) {
    .front-page #hs_cos_wrapper_dnd_area-module-4 .tile {
        height: 720px;
    }
    .front-page #hs_cos_wrapper_dnd_area-module-4 .tile:first-child .tile__content,
    .front-page #hs_cos_wrapper_dnd_area-module-4 .tile:nth-child(2) .tile__content,
    .front-page #hs_cos_wrapper_dnd_area-module-4 .tile:first-child .tile__content-text,
    .front-page #hs_cos_wrapper_dnd_area-module-4 .tile:nth-child(2) .tile__content-text {
        display: flex;
        flex-direction: column;
        height: 100%;
        justify-content: space-between;
    }
    .front-page #hs_cos_wrapper_dnd_area-module-10 .tile:first-child .tile__content {
        padding-top: 256px;
    }
    .front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(2),
    .front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(3) {
        height: 640px; 
    }
    .front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(2) {
        display: flex;
        justify-content: flex-end;
    }
    .front-page #hs_cos_wrapper_dnd_area-module-10 .tile:nth-child(2) .tile__content {
        display: flex;
        flex-direction: column;
        max-width: 70%;
    }
}

@media screen and (min-width: 768px) {
    .front-page #animationLayerContainer img {
        max-height: fit-content; 
    }
    .body-wrapper > div:nth-child(2) > div:not([class*="background-dark"]) {
        background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/images/Footer-wave.svg) !important;
    }
}


/*****************************************/
/************* PRODUCT PAGE **************/
/*****************************************/

/* bgAnimation */

.product-page span[data-hs-cos-type=rich_text] {
  max-width: 100vw;
  padding: 0;
}

@keyframes productAnimation01 {
    10% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(8px, 32px); } 
    85% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes productAnimation02 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    65% { transform: translate(8px, 16px); } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes productAnimation03 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    40% { transform: translate(32px, 24px); } 
    90% { transform: translate(0px, 0px); } /* Back to initial position */
}
.product-page #productAnimationLayerContainer {
    position: relative; 
    width: 100%; /* Fill the entire width of the screen */
    z-index: -3; /* Place the container under everything else */
    height: 1020px;
}

.product-page #productAnimationLayerContainer img {
    position: absolute; /* Set position to absolute */
    right: 0; /* Offset by 32px right */
    display: block; /* Ensure images stack on top of each other */
    animation-timing-function: ease-in-out;
    max-height: 550px;
    bottom: -250px;
}

/* Top Left bg */

.product-page #productAnimationLayerContainer #productAnimationLayerLeft01,
.product-page #productAnimationLayerContainer #productAnimationLayerLeft02,
.product-page #productAnimationLayerContainer #productAnimationLayerLeft03 {
    left: 0;
    right: unset;
    top: -100px;
}

@media screen and (min-width: 1080px) {
    .product-page #productAnimationLayerContainer {
        min-height: 1647px !important;
        height: 2130px !important;
    }
    .product-page #productAnimationLayerContainer img {
        max-height: fit-content !important; 
        bottom: 0 !important;
    }
}


/* media query big screens */
@media screen and (min-width: 1600px) {
    .product-page #productAnimationLayerContainer #productAnimationLayerLeft01,
    .product-page #productAnimationLayerContainer #productAnimationLayerLeft02,
    .product-page #productAnimationLayerContainer #productAnimationLayerLeft03 {
        left: 0;
        right: unset;
        top: -150px;
    }
}

#productAnimationLayer01 { 
    animation: animation01 10s ease-in-out infinite alternate;
}

#productAnimationLayer02 {
    animation: animation02 10s ease-in-out infinite alternate;
}

#productAnimationLayer03 {
    animation: animation03 10s ease-in-out infinite alternate;
}

#productAnimationLayer04 {
    animation: animation04 10s ease-in-out infinite alternate;
    transform-origin: top right;
}

#productAnimationLayer05 {
    animation: animation05 10s ease-in-out infinite alternate;
}

#productAnimationLayer06 {
    animation: animation06 15s ease-in-out infinite alternate;
    transform-origin: top right;
}

#productAnimationLayer01, #productAnimationLayer02, #productAnimationLayer03, #productAnimationLayer04, #productAnimationLayer05, #productAnimationLayer06 {
  right: -24px; /* Offset by 32px right */
}

#productAnimationLayerLeft01, #productAnimationLayerLeft02, #productAnimationLayerLeft03 {
  /* Offset for left animation */
}

/* Top left animation */
@keyframes animation-Left01 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(32px, 0px); transform: scale(1.5, 1); } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation-Left02 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(28px, 0px); transform: scale(1.3, 1);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}
@keyframes animation-Left03 {
    0% { transform: translate(0px, 0px); } /* Initial position */
    50% { transform: translate(24px, 0px); transform: scale(1.1, 1);  } 
    100% { transform: translate(0px, 0px); } /* Back to initial position */
}

#productAnimationLayerLeft01 { 
    animation: animation-Left01 10s ease-in-out infinite alternate;
    transform-origin: top left;
}
#productAnimationLayerLeft02 { 
    animation: animation-Left01 10s ease-in-out infinite alternate;
    transform-origin: top left;
}
#productAnimationLayerLeft03 { 
    animation: animation-Left01 10s ease-in-out infinite alternate;
    transform-origin: top left;
}

/* Video text banner */
.product-page #hs_cos_wrapper_dnd_area-module-3 .visma-module-wrapper {
    padding-top: 0;
}
.product-page #hs_cos_wrapper_dnd_area-module-3 .banner-block__text  {
    max-width: 50%;
}

.product-page #hs_cos_wrapper_dnd_area-module-3 .cta {
    --text-color: var(--site-text-dark);
}

/* Slider - Product page & Front Page  */
.product-page .quotation-slider__quote .quote-slider__author-description,
.product-page .quotation-slider__quote .quotation-slider__quote-link,
.front-page .quotation-slider__quote .quote-slider__author-description,
.front-page .quotation-slider__quote .quotation-slider__quote-link  {
    color: var(--site-text-dark);
}

.product-page .quotation-slider__button,
.front-page .quotation-slider__button {
    background: #FFD43D;
    border-color: #FFD43D;
    color: black;
}

.product-page .quotation-slider__buttons-container .--inactive,
.front-page .quotation-slider__buttons-container .--inactive {
    filter: none !important;
}

/* Front-page hero image fix */

.front-page #hs_cos_wrapper_dnd_area-module-3_ img {
  max-height: 100%;
}


/* -------------------------------------------------------------------------------------*/
/*                           New overides web version 2                                 */
/* -------------------------------------------------------------------------------------*/
/* Helper classes */
* {
    --hover-shadow-medium: drop-shadow(0 16px 24px rgba(0, 0, 0, 0.16));
}

.transparent-bg {
    background: transparent;
}

.overlap-bottom {
    position: relative;
}
.overlap-bottom .visma-module {
    z-index: 2;
}
.overlap-bottom::after {
    content: "";
    position: absolute;
    width: 100%;
    height: calc(var(--block-padding-vertical) * 2);
    left: 0;
    bottom: 0;
}
.overlap-bottom.-light-1::after {
    background-color: var(--background-light-1);
}
.overlap-bottom.-light-2::after {
    background-color: var(--background-light-2);
}
.overlap-bottom.-light-3::after {
    background-color: var(--background-light-3);
}
.overlap-bottom.-light-4::after {
    background-color: var(--background-light-4);
}
.overlap-bottom[class*="-dark"]::after {
    background-color: var(--background-dark-1);
}
/* End helper classes */

/* Override bullet list style */
.two-column-module ul, .text-block__richtext ul, .form-header-container ul:not(.inputs-list) {
    list-style-type: none;
    padding-left: 0;
    margin-top: 2em;
}
.two-column-module ul li, .text-block__richtext ul li, .form-header-container ul:not(.inputs-list) li {
    background-size: 23px;
    padding-left: 2.5em;
    padding-bottom: var(--space-16);;
    margin-bottom: 0;
}
.background-default .two-column-module ul li, .background-default .text-block__richtext ul li, .background-default .form-header-container ul:not(.inputs-list) li,
.background-light-1 .two-column-module ul li, .background-light-1 .text-block__richtext ul li, .background-light-1 .form-header-container ul:not(.inputs-list) li,
.background-light-2 .two-column-module ul li, .background-light-2 .text-block__richtext ul li, .background-light-2 .form-header-container ul:not(.inputs-list) li {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-small-circle-03.svg);
    background-repeat: no-repeat;
    background-position: 0 2px;
}
.background-light-3 .two-column-module ul li, .background-light-3 .text-block__richtext ul li, .background-light-3 .form-header-container ul:not(.inputs-list) li,
.background-light-4 .two-column-module ul li, .background-light-4 .text-block__richtext ul li, .background-light-4 .form-header-container ul:not(.inputs-list) li {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-small-circle-04.svg);
    background-repeat: no-repeat;
    background-position: 0 2px;
}
.background[class*="background-dark"] .two-column-module ul li, .background[class*="background-dark"] .text-block__richtext ul li, .background[class*="background-dark"] .form-header-container ul:not(.inputs-list) li {
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-small-circle-02.svg);
    background-repeat: no-repeat;
    background-position: 0 2px;
}
/* End Override bullet list style */

/* Large checklist style */
.large-checklist.background[class*="background-dark"] ul {
    list-style-type: none;
    padding-left: 0;
    margin-top: 0;
}
.large-checklist li {
    font-size: var(--text-medium-size);
}
.large-checklist li strong {
    font-size: var(--text-large-size);
    margin-bottom: var(--space-16);
}
.large-checklist.background[class*="background-dark"] ul li {
    background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-big-circle-02.svg);
    background-repeat: no-repeat;
    background-position: 0 5px;
    background-size: 32px;
    padding-bottom: var(--space-32);
    padding-left: var(--space-64);
}

/*        Custom list style           */
.custom-list ul li {
    background-image: unset !important;
    position: relative:
}

.custom-list ul {
    display: flex;
    flex-wrap: wrap; /* Allows flex items to wrap to the next line if needed */
    align-items: flex-start; /* Aligns items at the start of the cross axis */
    row-gap: 16px; /* Defines the gap between rows */
    column-gap: 16px;
}

.custom-list ul li {
    display: inline-flex; /* Ensures list items hug their content and can be flex containers */
    flex-direction: row-reverse;
    padding: 12px 24px;
    background-color: #C8F1FA;
    border-radius: 16px;
    font-weight: 600;
}
.custom-list ul li::after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px; 
    background-image: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-small-circle-01.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 12px;;
    vertical-align: middle; 
}
/* ----- End custom list style ----  */



/* Override default kicker text color */
.kicker-text {
  color: var(--site-text-color);
}

/* Override default kicker text color */
.kicker-pill .kicker-text, .kicker-text.kicker-pill {
  color: var(--site-text-dark);
  padding: 4px 8px;
  border-radius: 8px;
  background: #FFD43D;
  width: fit-content;
}


.banner-block.-center .banner-block__text {
  display: flex;
  flex-direction: column;
  align-items: center;
}


/* Helper classes padding */
.padding-0-top {
  padding-top: 0 !important;
}
.padding-0-bottom {
  padding-bottom: 0 !important;
}
.padding-medium-top {
  padding-top: calc(var(--block-padding-vertical) / 2) !important;
}
.padding-medium-bottom {
  padding-bottom: calc(var(--block-padding-vertical) / 2) !important;
}
.padding-small-top {
  padding-bottom: calc(var(--block-padding-vertical) / 4) !important;
}
.padding-small-bottom {
  padding-bottom: calc(var(--block-padding-vertical) / 4) !important;
}

/* Helper classes margin */
.margin-0-top {
  margin-top: 0 !important;
}
.margin-0-bottom {
  margin-bottom: 0 !important;
}
.margin-medium-top {
  margin-top: calc(var(--block-padding-vertical) / 2) !important;
}
.margin-medium-bottom {
  margin-bottom: calc(var(--block-padding-vertical) / 2) !important;
}
.margin-small-top {
  margin-bottom: calc(var(--block-padding-vertical) / 4) !important;
}
.margin-small-bottom {
  margin-bottom: calc(var(--block-padding-vertical) / 4) !important;
}

/* Adjust so background dark - 3, 4, has same look and feel as 1, 2 */
.background-dark-3, .background-dark-4 {
  --cta-background-color: var(--site-brand-dark-color);
  --cta-border-color: var(--site-brand-dark-color);
}

/* Add map background to banner */
.background.background-dark-3:has(.banner-block),
.background.background-dark-4:has(.banner-block) {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Topographic%20backgrounds/topographic-map-top-01.svg);
  background-size: cover;
  background-repeat: no-repeat;
}


/* Quotation slider restyle */
.background-default .quotation-slider .quotation-slider__quote {
  background-color: var(--background-light-1);
  --site-text-color: var(--site-text-dark);
  --cta-text-color: var(--site-text-light);
  --site-brand-color: var(--site-dark-color);
}
.background-light-1 .quotation-slider .quotation-slider__quote, 
.background-light-2 .quotation-slider .quotation-slider__quote, 
.background-light-3 .quotation-slider .quotation-slider__quote,
.background-light-4 .quotation-slider .quotation-slider__quote, 
.background[class*="background-dark"] .quotation-slider .quotation-slider__quote {
  background-color: #ffffff;
  --site-text-color: var(--site-text-dark);
  --cta-text-color: var(--site-text-light);
  --site-brand-color: var(--site-dark-color);
}
/* First quote */
.background-default .quotation-slider .quotation-slider__item:nth-child(1) .quotation-slider__quote,
.background-light-1 .quotation-slider .quotation-slider__item:nth-child(1) .quotation-slider__quote, 
.background-light-2 .quotation-slider .quotation-slider__item:nth-child(1) .quotation-slider__quote,
.background[class*="background-dark"] .quotation-slider .quotation-slider__item:nth-child(1) .quotation-slider__quote {
  background-color: #1CD9E9;
  --site-text-color: var(--site-text-dark);
  --cta-text-color: var(--site-text-light);
  --site-brand-color: var(--site-dark-color);
}

/* Columns checkmark style */
@media screen and (max-width: 1199px) {
  .checklist-columns {
    --checklist-columns-icon_size: var(--space-32);
  }
}
@media screen and (min-width: 1200px) {
  .checklist-columns {
    --checklist-columns-icon_size: var(--space-48);
  }
}
.checklist-columns .columns__card-container {
   --row-gap: var(--space-64);
}
.checklist-columns .columns__card {
  position: relative;
  padding-left: calc(var(--checklist-columns-icon_size) + var(--space-32));
}
.checklist-columns .columns__card::after {
  content: "";
  position: absolute;
  width: var(--checklist-columns-icon_size);
  height: 100%;
  left: 0;
  top: 0;
}
.checklist-columns .background-default .columns__card::after {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-big-circle-01.svg);
  background-repeat: no-repeat !important;
  background-size: 100% auto !important;
}
.checklist-columns.background-light-1 .columns__card::after, 
.checklist-columns.background-light-2 .columns__card::after {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-big-circle-03.svg);
  background-repeat: no-repeat !important;
  background-size: 100% auto !important;
}
.checklist-columns.background-light-3 .columns__card::after, 
.checklist-columns.background-light-4 .columns__card::after {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-big-circle-04.svg);
  background-repeat: no-repeat !important;
  background-size: 100% auto !important;
}
.checklist-columns[class*="background-dark"] .columns__card::after {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Icons/checkmark-big-circle-02.svg) !important;
  background-repeat: no-repeat !important;
  background-size: 100% auto !important;
} 
/* End of Columns checkmark style */


/* Form card style */
.card-form .visma-module {
  padding: var(--block-padding-vertical);
  background-color: #ffffff;
  color: var(--site-text-dark); /* In case of dark background */
  border-radius: var(--space-48);
 --site-text-color: var(--site-text-dark) !important;
  
}
@media screen and (max-width: 1199px) {
  .card-form .visma-module {
    padding: var(--space-32);
    border-radius: var(--space-24);
  }
}

.card-form .visma-module {
    -webkit-filter: drop-shadow(0px 4px 64px rgba(0, 0, 0, 0.07));
    filter: drop-shadow(0px 4px 64px rgba(0, 0, 0, 0.07));
}

/* End form card style */

/* From dark 1 style */
.visma-module-wrapper.background-dark-1[class*="form-widget"] {
    background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Topographic%20backgrounds/topographic-map-top-01.svg);
    background-repeat: no-repeat;
    background-size: cover;
}
.visma-module-wrapper.background-dark-1[class*="form-widget"] .form__module-header-container {
    justify-content: center;
    display: flex;
} 
.visma-module-wrapper.background-dark-1[class*="form-widget"] form {
    padding: var(--space-48);
    background-color: #ffffff;
    color: #000000;
    border-radius: var(--space-24);
    --site-text-color: var(--site-text-dark);
}
/* End form dark 1 style */

/* Footer overlap */
.-overlap-footer {
  margin-bottom: calc(var(--block-padding-vertical) * -2);
  padding-bottom: 0;
  position: relative;
}
.-overlap-footer .visma-module {
    z-index: 2;
}
.footer.-overlap-footer {
  padding-top: calc(var(--block-padding-vertical) * 3);
  padding-bottom: var(--block-padding-vertical);
}
/* End footer overlap */

/* Tweak position grecaptcha badge */
.grecaptcha-badge {
    margin-left: 0;
}
/* Tweak form bug */ 
.form-columns-2 label {
    min-height: unset !important;
}

/* Temporary footer design */
.footer.background[class*="background-dark"] {
  background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Topographic%20backgrounds/topographic-map-top-01.svg);
  background-size: cover;
  background-repeat: no-repeat;
}
/* End temporary footer design */



/* Graphics and animation */
.graphics-container {
    position: relative;
    aspect-ratio: 1 / 1;
    
}
.text-block.-two-column-layout:has(.graphics-container) {
    align-items: center;
}
@media screen and (max-width: 766px) {
    .text-block.-two-column-layout:has(.graphics-container) {
        gap: 0;
    }   
    /* Reverse direction on mobile if first one is graphic so text comes first */
    .text-block:has(section:nth-child(1) .graphics-container) {
        flex-direction: column-reverse;
    }
    
}
.graphics-container img {
    position: absolute;
    left: 0;
    top: 0;
}

.graphics-container img.shadow, 
.fullscreenproduct img.shadow {
   -webkit-filter:
    drop-shadow(0px 2.749px 30.241px rgba(0, 0, 0, 0.03))
    drop-shadow(0px 2.749px 11.684px rgba(0, 0, 0, 0.05))
    drop-shadow(0px 10.997px 43.986px rgba(0, 0, 0, 0.11));
    
  filter:
    drop-shadow(0px 2.749px 30.241px rgba(0, 0, 0, 0.03))
    drop-shadow(0px 2.749px 11.684px rgba(0, 0, 0, 0.05))
    drop-shadow(0px 10.997px 43.986px rgba(0, 0, 0, 0.11));
}
/* Extend outside of layout, account for left or right*/
@media screen and (min-width: 1200px) and (max-width: 1899px) {
    .text-block.-two-column-layout section:nth-child(1) .graphics-container.extend-layout {
        transform: scale(1.07);
        transform-origin: center right;   
    }
    .text-block.-two-column-layout section:nth-child(2) .graphics-container.extend-layout{
        transform: scale(1.07);
        transform-origin: center left; 
    }
}
@media screen and (min-width: 1920px) {
    .text-block.-two-column-layout section:nth-child(1) .graphics-container.extend-layout {
        transform: scale(1.12);
        transform-origin: center right;   
    }
    .text-block.-two-column-layout section:nth-child(2) .graphics-container.extend-layout {
        transform: scale(1.12);
        transform-origin: center left; 
    }
}

/* FAQ banner redesign */
.test-faq .faq-module .faq-accordion .accordion {
    font-size: var(--text-large-size);
    padding: 0;
    margin-bottom: var(--space-8);
}
.test-faq .faq-module .faq-accordion {
    padding: var(--space-32);
    border-radius: var(--space-8);
}

.test-faq .faq-module .faq-wrapper {
    display: flex;
    flex-direction: column;
    row-gap: var(--space-8);
}

.test-faq .faq-module .faq-accordion .panel p {
    margin-top: 22px;
    margin-bottom: 0;
}
.test-faq.background-default .faq-module .faq-accordion.active {
    background-color: #1CD9E9;
}
.test-faq.background-default .faq-module .faq-accordion:not(.active), 
.test-faq.background[class*="background-light"] .faq-module .faq-accordion:not(.active) {
    border: 1px solid #00000010;
}
.test-faq.background[class*="background-light"] .faq-module .faq-accordion.active {
    background-color: #FFFFFF;
}
.test-faq.background[class*="background-dark"] .faq-module .faq-accordion:not(.active) {
    border: 1px solid #ffffff20;
}
.test-faq.background[class*="background-dark"] .faq-module .faq-accordion.active {
    background-color: #1CD9E9;
    color: #000000;
}


@media screen and (min-width: 1200px) {
    .visma-module:has(.fullscreenproduct) .h2,
    .visma-module:has(.fullscreenproduct) .h3,
    .visma-module:has(.fullscreenproduct) .h4, 
    .visma-module:has(.fullscreenproduct) .text-large {
        width: 70%;
    }
}
@media screen and (max-width: 1199px) {
    .fullscreenproduct {
        transform: scale(0.8);
    }
}
@media screen and (min-width: 1200px) and (max-width: 1800px) {
    .fullscreenproduct {
        transform: scale(0.9);
    }
}
.fullscreenproduct {
    position: relative;
}
.fullscreenproduct .fullscreen {
    max-height: unset;
    width: 100% !important;
    border: 3px solid #0C91BC;
    border-radius: var(--space-16);
}
.fullscreenproduct img:not(.fullscreen) {
    position: absolute;
}
.fullscreenproduct .annotation-1 {
    width: 25%;
    left: -8%;
    bottom: -5%;
}
.fullscreenproduct .annotation-2 {
    width: 35%;
    right: -10%;
    top: 10%;
}
.fullscreenproduct .annotation-3 {
    width: 20%;
    right: -10%;
    bottom: 15%;
}

/* Simple animation classes */
.animate.fade-in {
    transition-duration: .8s;
    transition-delay: .0s;
}
.animate.fade-in.done {
    opacity: 1;
    transform: none;
}
.animate.fade-in:not(.done) {
    opacity: 0;
}

.animate.up {
    transform: translate3d(0, 10%, 0);
}

.wave-overlap-bottom {
    position: relative;
    padding-bottom: 0;
}
.wave-overlap-bottom .visma-module {
    z-index: 2;
}
.wave-overlap-bottom::after {
    content: "";
    position: absolute;
    width: 100%;
    height: auto;
    aspect-ratio: 1940 / 490;
    left: 0;
    bottom: 0;
    background: url(//7783269.fs1.hubspotusercontent-eu1.net/hubfs/7783269/raw_assets/public/product-pages-theme-child/Brand%20assets/Wave%20backgrounds/wave-overlap-bottom-desktop.svg);
    background-size: 100% auto;
}