/*
	Theme Name:   Droppery
	Description:  Custom theme for Droppery
	Author:       Oncotton LTD
	Author URI:   https://oncotton.net
	Version:      1.0.0
*/


/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
button,hr,input{overflow:visible}progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}details,main{display:block}hr{box-sizing:content-box;height:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}

.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}


body {
    font-family: "Inter", sans-serif;
   letter-spacing: -0.03125rem;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;  
}
b, strong {
  font-weight: 600
}
#droppery-content p {
  color: var(--wp--preset--color--dark);
  margin: 10px 0 10px 0
}
h1 {
  margin: 15px 0;
  line-height: 1em
}

h2 {
  line-height: 3.23rem;
  position: relative;
  padding-left: 30px;
  margin-bottom: 27px !important
}

.price-card h2, 
.card h2 {
  padding-left: 0;
}

h2::before {
    content: '';
    display: inline-block;
    width: 10px;  
    height: 10px;  
    background-color: var(--wp--preset--color--primary);
    position: absolute;
    left: 0;  
    top: 20px;  
    border-radius: 2px;
    animation: popReveal 0.5s ease-out;
    animation-delay: .1s;
}


.nav-800 {font-weight: 800}
h2.no-bullet::before {
display: none;

}
.footer-copyright .menu li {padding-left: 30px; }

h2.wp-block-heading:not(.wp-block-column h2.wp-block-heading) {
position: relative;
left: 20px;
margin-bottom: 27px !important
}
.entry-content .wp-block-cover.alignfull h2.wp-block-heading.faq-title {
padding-left: 35px
}

.wp-block-column > h2:first-of-type  {
  margin-top: 10px !important
}
h3 {margin: 30px 0 0}
#droppery-content .trusted-slider p{
  color: #141416 !important
}

h3.has-extra-large-font-size {
  font-weight: 400;
  font-size: 2.25rem;
  line-height: 2.565rem;
  padding: 45px 0
}

hr + h2 {
    margin-top: 130px !important
}

.card h2::before {
  display: none
}

.card h2 {
  font-weight: 300;
  margin: 10px 0 20px 0;
  font-size: 2.625rem !important;
  line-height:  2.9925rem;
  padding: 0

}


.price-table .card h2 {
  font-weight: 800;
  margin: 10px 0 20px 0;
  font-size: var(--wp--preset--font-size--large) !important;
  line-height:  2.9925rem

}


.card .wp-block-columns {
  gap: 5px
}

#hero-area {
  background-color: var(--wp--preset--color--primary);
  min-height: 650px !important
}


#hero-area h1, 
#hero-area p {
  color: #FFF;
    font-family: 'At Hauss Regular', sans-serif;
}

#hero-area h1 {
  font-weight: 600;
  font-size: 3.125rem;
  line-height: 3.516875rem;

}
#hero-area p {
  font-size: 1.342rem !important;
  line-height: 1.969rem;
  letter-spacing: -0.01341875rem;
  font-weight: 300;
  padding: 30px 0 10px
}
/*
	Header
*/
@keyframes slideDown {
    from {
        transform: translateY(-100%);  
    }
    to {
        transform: translateY(0); /* Slide into view */
    }
}



#masthead .custom-logo {height: 50px; width: auto}
/* Initial masthead setup */
/* Initial masthead setup - visible on page load */
#masthead {
    text-align: left;
    padding: 0px 0 0;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
    border-bottom: solid 1px #CFCFCF;
}

 .fixed #masthead {
    position: fixed;
    top: 0;
    z-index: 99999;
    width: 100%;
    background: #fff;
    animation: slideDown 0.3s ease-out forwards; /* Apply the slide-down animation */

}





.header-container {
  max-width: var(--wp--style--global--wide-size);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex: 1;
  align-items: center

}

.site-branding span {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
  }
  
.site-branding img {
  display: flex;
  align-items: center;
  height: 32px
}


  
nav ul {
  display: flex; 
  flex-wrap: wrap;
  justify-content: end;
  padding: 0; 
  margin: 0;
font-size: var(--wp--preset--font-size--small)
}

nav ul li {list-style: none; padding: 11px 25px 10px; margin: 0; line-height: 1em}
nav ul li.primary-button {padding-right: 0}
nav ul li a {
  text-decoration: none;
color: #000}
.mobile-menu { display: none; }

nav ul li a:hover {
  color: var(--wp--preset--color--primary);
}
.bar {
	display: block;
	width: 38px;
	height: 3px;
	margin: 5px auto;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	background-color: #101010;
}


#hero-area .wp-block-heading, #hero-area p, #hero-area  .wp-block-buttons, h2.wp-block-heading.active {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.4s ease-in-out forwards;
}
/* Basic styling for the menu */
ul.menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

ul.menu li {
    position: relative;
}

ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    list-style: none;
    padding: 20px 0;
    margin: 0;
    display: none; /* Hidden by default */
    background-color: #fff;
    z-index: 1000;
    border-radius: 4px;
    border: solid 1px #000
}

ul.sub-menu li {
    margin: 0;
}

ul.sub-menu li a {
    padding: 10px;
    white-space: nowrap; /* Prevents text from breaking to the next line */
}

ul.sub-menu li a:hover {
color: var(--wp--preset--color--primary);
}

/* Add the arrow SVG for parent menu items with submenus */
.menu-item-has-children > a::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px; /* Adjust as needed */
    height: 12px; /* Adjust as needed */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="m54.34 76.273 43.863-43.711c2.3945-2.543 2.3945-6.4375 0-8.832s-6.4375-2.3945-8.832 0l-39.371 39.371-39.371-39.371c-2.543-2.3945-6.4375-2.3945-8.832 0s-2.3945 6.2891 0 8.832l43.711 43.711c2.543 2.3945 6.4375 2.3945 8.832 0z" fill-rule="evenodd"/></svg>');
    background-size: cover;
    transition: transform 0.3s ease; /* Smooth rotation transition */
}

/* Rotate the arrow when the submenu is opened (using the 'open' class) */
.menu-item-has-children.open > a::after {
    transform: translateY(-50%) rotate(180deg); /* Rotate the arrow */
}

/* Additional styling for responsive mobile menu */
.menu.active {
    display: block;
    position: relative;
    flex-direction: column;
}

.mobile-menu {
    display: none; /* Hidden by default (only visible on smaller screens) */
    cursor: pointer;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#hero-area p {
  animation-delay: .2s
}

#hero-area .wp-block-buttons {
  animation-delay: .3s
}

/*
	Wordpress specific BUTTONS
*/


.wp-block-separator {
background: #C5C5C5; 
height: 1px;
width: 100%;
padding: 0;
margin: 20px 0 20px 0;
border: none;
}

.wp-block-columns {
  gap: 52px
}

.primary-button a {
  color: #FFF;
  padding: 16px 24px 16px 24px;
  background: var(--wp--preset--color--primary);
  border-radius: 4px;
  font-weight: 600;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; 
  border: solid 1px var(--wp--preset--color--primary);
  }
  
  .primary-button a:hover {
    color: var(--wp--preset--color--primary); /* Invert to primary color */
    background: #FFF; /* Invert to white */
  }

.wp-element-button, .wp-block-button__link {
  background: var(--wp--preset--color--primary); 
  border-radius: 4px; 
  color: #fff;
  border: solid 1px var(--wp--preset--color--primary); 
  padding: 6px 24px 6px 24px; 
  margin-top: 20px;
  transition: 0.2s;
  font-size: var(--wp--preset--font-size--small);
  font-weight: 600
}

.fixed-width .wp-block-button__link, .fixed-width .wp-element-button {width: 250px;
  padding: 6px 24px 6px 24px;
  line-height: 2rem

}

.wp-element-button:hover, .wp-block-button__link:hover{

  color: var(--wp--preset--color--primary);
  background: #fff
}

a.wp-block-button__link.has-white-background-color:hover {
  background-color: var(--wp--preset--color--tertiary) !important;
  color: #FFF !important; 
}

.wp-element-button:hover:after, .wp-block-button__link:hover:after {
  opacity: 1;
  right: 20px;
}

.wp-block-button.is-style-outline a {
  border-width: 1px !important;
  border-color: #D3D3D3
}


#verhoog {
    position: relative;
    background: none;
    padding: 0;
    overflow: visible;
}

#verhoog::before {
    content: "";
    position: absolute;
    bottom: -90px;
    left: 0;
    width: 100%;
    height: 820px;
    background: linear-gradient(60deg, var(--wp--preset--color--primary), #D1D9FF);  
    clip-path: polygon(0 45%, 100% 0%, 100% 55%, 0% 100%);  
    z-index: -1;
}

.wp-block-cover__inner-container {
    position: relative;
    padding: 0px;  
    z-index: 1;
}


.wp-block-cover__inner-container .wp-block-columns {
  margin: 0
}
.has-primary-background-color + div h2::before {
  display: none
}

.card {
  background: #fff; 
  border-radius: 10px;
  padding: 30px 40px;
  border: solid 1px var(--wp--preset--color--primary);
  position: relative;

}


.price-table .card {
padding: 30px 20px;
}

.best-option-pill {
  position: absolute;
  top: -30px;
  right: 20px;
  left: auto;
  background: #F64F59 !important;
  border-radius: 30px;
  padding: 10px 20px;
  color: #FFF !important;
  animation: popReveal 0.5s ease-out;


}

@keyframes popReveal {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  60% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}

.card:nth-of-type(2) {
  border: solid 1px #C5C1CC;
}

.price-table .card {
  border: solid 1px #C5C1CC !important;
}

.card:nth-of-type(2) p.has-primary-color{
  color: #8034FF !important
}

/*
  Wordpress specific 
*/



.blockquote-column {
  gap: 0;
  min-height: 740px
}


.blockquote-column .has-extra-large-font-size {
  font-size: 6.875rem !important;
  color: #FFF !important;
  margin: 0 !important;
  font-weight: 300;
  line-height: 1em
}
.blockquote-column blockquote {
  margin: 0  !important;
  font-size: 2rem;
  line-height: 2.28rem;
  font-weight: 600
}

.blockquote-column blockquote p{
  color: #FFF !important;
  padding: 15px 0;
  margin: 0
}

.blockquote-column blockquote .has-extra-small-font-size {
  font-weight: 400;
  font-size: 0.9375rem;
  line-height: 1.8125rem
}

.tertiary-background-grid{
  padding: 0;
  background-image: 
    url('inc/img/line-2.webp'), /* Add your background image */
    linear-gradient(88deg, rgb(32, 41, 67) 43%, rgba(32, 40, 66, 0.86) 100%); /* Existing gradient */
  background-repeat: repeat-y; /* Repeat the image vertically */
  background-size: contain; /* Adjust image size */
  background-blend-mode: overlay; /* Ensure the gradient and image blend properly */
}


.blockquote-column .wp-block-group {padding: 0 100px}


.blockquote-column .wp-block-column.is-layout-flow {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Adjust this depending on your alignment needs */
}

.wp-block-cover.is-light {
    flex-grow: 1;
}

.wp-block-group.is-layout-constrained {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Adjust this depending on your alignment needs */
}


.taxonomy-category a {
  text-decoration: none;
  text-transform: uppercase;
  font-size: var(--wp--preset--font-size--extra-small);
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  letter-spacing: 20%;
  font-weight: 600
}

h3.wp-block-post-title a {
  text-decoration: none;
  color: #1B1B1B;

}

ul.wp-block-list {
  padding: 0;
  margin: 20px 0 0;
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.5rem

}

ul.wp-block-list li {
    list-style: none;
    position: relative;
    padding-left: 30px; 
    color: var(--wp--preset--color--dark);
    font-weight: 600;
    color: #424242;
    line-height: 1.5rem;
    margin-bottom: 8px

}

ul.wp-block-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px; /* Width of the SVG */
    height: 21px; /* Height of the SVG */
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_2012_440)"><path d="M15 6.65161L9.16667 14.5683L5 11.2349" stroke="black" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.0001 20.4016C15.2928 20.4016 19.5834 16.111 19.5834 10.8183C19.5834 5.52553 15.2928 1.23492 10.0001 1.23492C4.70735 1.23492 0.416748 5.52553 0.416748 10.8183C0.416748 16.111 4.70735 20.4016 10.0001 20.4016Z" stroke="black" stroke-linecap="round" stroke-linejoin="round"/></g><defs><clipPath id="clip0_2012_440"><rect width="20" height="20" fill="white" transform="translate(0 0.819092)"/></clipPath></defs></svg>');
    background-size: contain;
    background-repeat: no-repeat;
}
.card h2 + p{
  color: #848199;
  min-height: 20px
}



.card .green-tick-list li {
color: #848199;
font-weight: 400

}
.card .green-tick-list li:before {
  background-color: #44DE8F;
  border-radius: 50%;
}

.card .green-tick-list li.no-tick:before {
  background-color: #F64F59;
  
}


ul.wp-block-list.green-tick-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  background-image: url('data:image/svg+xml;utf8,<svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2727 1.83337L5.5685 9.57421C5.43246 9.7547 5.2296 9.87296 5.00552 9.90242C4.78143 9.93188 4.5549 9.87007 4.37683 9.73087L0.303497 6.47421C-0.0559479 6.18656 -0.114151 5.66199 0.173497 5.30254C0.461146 4.94309 0.985719 4.88489 1.34516 5.17254L4.74183 7.89004L9.931 0.84754C10.1012 0.592198 10.3979 0.451025 10.7033 0.480071C11.0088 0.509117 11.2736 0.703681 11.3926 0.986517C11.5116 1.26935 11.4655 1.59469 11.2727 1.83337Z" fill="%23ffffff"/></svg>');
    background-size: 12px 13px;
    background-repeat: no-repeat;
    background-position: center center
}

.price-table {
  max-width: 900px;
  gap: 20px
}

.price-table.price-table-wide {
  max-width: var(--wp--style--global--wide-size) !important;
}

:where(.wp-block-columns.is-layout-flex) {gap: 10em}

.entry-content > *:not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), .wp-block-cover.alignwide {
  max-width: var(--wp--style--global--wide-size);
  margin: 0 auto
}

.wp-block-post-excerpt__excerpt {
margin: 10px 0 !important}

.wp-block-post-template {
  margin: 80px 0 0}

.wide-gap {
  gap: 80px
}
.entry-content > .wp-block-cover.alignfull {min-height: 130px !important}
.entry-content .wp-block-cover.alignfull h2.wp-block-heading {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0;
  left: 0
}

.price-card {
  border-radius: 12px;
  border: solid 1px #D2D2D2;
  box-shadow: 0px 4px 20px 0px #0000001F;
  margin: 120px auto !important;
  padding: 60px 80px;
  border-radius: 12px !important;
    position: relative;
    background-clip: padding-box;
    min-height: 130px
}

.price-card::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 12px; /* Thickness of the border */
    background: linear-gradient(to right, #012EFD, #D9E9FF, #1288E9);
    border-radius: 0 0 12px 12px; /* Rounded corners */
    z-index: 1;
}

.price-card .wp-block-cover.is-light {
  border-radius: 8px;
  border: 1px solid #CFCFCF;
  min-height: 100px;
  color: #000;
  
}
.price-card .wp-block-cover.is-light p.has-primary-color  {
  font-size: var(--wp--preset--font-size--extra-extra-large) !important;
  color: var(--wp--preset--color--primary);
  margin-top: 0px !important
}


.price-card .wp-block-cover.is-light em {
  font-size: var(--wp--preset--font-size--default);
  color: #000;
  font-style: normal
  
}


.price-card span.wp-block-cover__background.has-background-gradient {
background: radial-gradient(
  circle at 85% 20%,  /* Position of the gradient center */
  rgb(0, 54, 249) 0%,  
  rgba(0, 54, 249, 0.359) 20%,  
  rgba(255, 255, 255, 0.8) 50%   /* Adjusted to make the circle smaller */
) !important;
}

.price-card h2 {
  font-size: var(--wp--preset--font-size--large)
}

.price-card h2::before {display: none}

#blog-single {
  margin-top: 110px
}
#blog-single h1 {
  font-size: var(--wp--preset--font-size--extra-large);
  font-weight: 600;
  line-height: 3.4375rem;
  max-width: 840px;
  margin: 30px auto 80px auto
}
.author-details {
  max-width: 840px !important;
  margin: 0 auto
}
.author-name-date {
  flex-direction: column;
  display: flex;
}
.blog-featured-image {
}

.blog-featured-image img {
  width: 100%; 
  height: auto
}
body.single ul.wp-block-list {
  margin: 20px
}
body.single ul.wp-block-list li {
    list-style-type: disc; 
  
}

body.single ul.wp-block-list li::before {
  display: none
}
.wp-block-column img {
  max-width: 100%;
  height: auto
}
.author-details {display: flex;
  line-height: 1.2em;
  align-items: center
}
.author-gravatar img{
  border-radius: 50%;
  margin-right: 20px
}
.author-name-date .author,
 {
  color: var(--wp--preset--color--primary);  
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 600;
  display: block;
  max-width: 840px; 
  margin: 0 auto
}

.author-name-date .author-date,
.related-post-author,
.related-post-date {
  font-size: var(--wp--preset--font-size--small);
  color: #6D6E76
}

.related-post-info h4 a {
  text-decoration: none;
  color: #232536;
  font-size: var(--wp--preset--font-size--large)
}

.related-post-feed {
  margin-bottom: 100px;
  border-bottom: solid 1px #6D6E76;
  padding-bottom: 60px
}

.narrow-column {
  max-width: 840px; 
  margin: 0 auto 100px auto
}


/*
	Slider
*/
.swiper-trusted-companies  {
  overflow: hidden;
  mask-image: linear-gradient(to right, transparent 0%, var(--wp--preset--color--primary) 20% 80%, transparent 100%);
}

.swiper-trusted-companies .swiper-wrapper, .swiper-brands .swiper-wrapper{
  -webkit-transition-timing-function:linear!important; 
  -o-transition-timing-function:linear!important;
  transition-timing-function:linear!important; 
}


.swiper-slide img {
  max-width: 100%;
  height: auto
}

.swiper-trusted-companies .swiper-slide img {
  max-width: 80px;
  height: auto;
  width: auto
}

.swiper-trusted-companies .swiper-wrapper {
  align-items: center
}


.swiper-brands {
  margin-top: 100px !important;
  overflow: hidden;
}

.swiper-container {
    width: 100%;
    height: auto; /* Allow container height to adjust automatically */
}

.swiper-wrapper {
    height: auto; /* Allow the wrapper to adjust its height dynamically */
}
.swiper-brands h3 {
  font-size: var(--wp--preset--font-size--medium);
  line-height: 3.54 rem;
  font-family: 'At Hauss Regular', sans-serif;
font-weight: 400
}

/* Style for the toast effect within .swiper-trusted-companies */
.swiper-trusted-companies .swiper-slide {
    position: relative;
    overflow: hidden;
    justify-content: center;
    display: flex;
}

.swiper-trusted-companies .swiper-slide img {
    display: block;
    transition: transform 0.3s ease-in-out;
}


.swiper-trusted-companies .swiper-slide .toast-caption {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 15px;
    background: rgba(0, 0, 0, 0.8); /* Semi-transparent dark background */
    color: white;
    font-size: 14px;
    text-align: center;
    border-radius: 5px;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    transform: translateY(20px);
    max-width: calc(100% - 40px); 
    line-height: 1.2em
}

.swiper-trusted-companies .swiper-slide:hover .toast-caption {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.has-extra-small-font-size, .has-extra-small-font-size {
  font-weight: 600;
  line-height: 1.1875rem;
  letter-spacing: -0.0075rem;
  text-transform: uppercase;
  letter-spacing: 20%
}
/*
	Footer
*/
a.post-edit-link, a.back-top {color: #000; padding-left: 20px; font-weight: 700; text-align: right; float: right}
footer {
	background:  #2D3A49;
	padding: 100px 0 0 0;
	color: #BDBDBD;!important
}

footer .has-white-color.has-text-color, footer .wp-block-page-list {
  opacity: .6
}

 footer .wp-block-page-list a {
   text-decoration: none
 }
footer a{
  color: rgba(255, 255, 255, 1);
  text-decoration: underline

}
footer .has-background {
  background: transparent !important
}
footer h4 {
  color: #FFF
}

footer .wp-block-media-text {
  grid-template-columns:25px auto !important
}
footer .wp-block-media-text img {
  max-width: 20px
}
.wp-block-media-text>.wp-block-media-text__content {
  padding: 0 0 0 5px
}

footer ul {padding: 0; margin: 0}
footer ul li {list-style: none; padding: 5px 0; margin: 0}
footer .container {display: flex;  align-items: flex-start; gap: 80px; max-width: var(--wp--style--global--wide-size);
margin: 40px auto 80px auto; }
footer .widget {max-width: var(--wp--style--global--wide-size);margin: 0 auto; }}
footer .wp-block-columns {gap: 60px}
footer ul li strong {display: block}
footer h2.wp-block-heading {padding: 30px 0 10px 0}
footer .container div {display: block}

.footer-copyright {max-width: var(--wp--style--global--wide-size);
	margin: 0px auto 0; border-top: solid 1px #ffffff; padding: 30px 0 40px 0; color: var(--wp--preset--color--dark);
color: #fff !important;opacity: .7; display: flex; justify-content: space-between;
align-items: start}



details {
    border-top: 1px solid gray;
    padding: 20px 0;
}

details[open] > summary {
    margin-bottom: 0.5rem;
}
.lightweight-accordion details[open] summary ~ * {animation: lwopen 1s ease-in-out !important;}
.lightweight-accordion-title {font-weight: 600; position: relative}
.lightweight-accordion-title::after {
    content: "";
    display: inline-block;
    width: 14px;
    height: 13px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 13" fill="none"><path d="M1.54583 7.26074H6.14125V11.8562C6.14125 12.3232 6.52546 12.715 7.00007 12.715C7.47468 12.715 7.85889 12.3232 7.85889 11.8562V7.26074H12.4543C12.9214 7.26074 13.3131 6.87653 13.3131 6.40193C13.3131 5.92732 12.9214 5.54311 12.4543 5.54311H7.85889V0.947684C7.85889 0.480608 7.47468 0.0888672 7.00007 0.0888672C6.52546 0.0888672 6.14125 0.480608 6.14125 0.947684V5.54311H1.54583C1.07875 5.54311 0.687012 5.92732 0.687012 6.40193C0.687012 6.87653 1.07875 7.26074 1.54583 7.26074Z" fill="%231A0F91"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    clear: both;
    transition: transform 0.3s ease;
    position: absolute;
    top: 0;
    right: 0

}
/* Rotate the arrow or any indicator when details are open */
details[open] .lightweight-accordion-title::after {
    transform: rotate(45deg);
    transition: transform 0.3s ease; /* Optional: Smooth transition */
}

/* Hide the default marker for supporting browsers */
summary::marker {
    display: none;
}

/* Fallback for WebKit-based browsers (like Chrome and Safari) */
summary::-webkit-details-marker {
    display: none;
}

/* Additional fallback to ensure marker is hidden in all cases */
summary {
    list-style: none; 
    display: flex;
    align-items: end; 
    padding-right: 20px
}




.menu.active {
display: flex;
height: 100vh !important;
background: #fff;
flex-direction: column;
width: 100%;
z-index: 99;
position: absolute;
top: 0;
right: 0;
left: 0;
justify-content: start;
padding-top: 20px;
text-align: left
} 

nav ul.menu.active li {
width: 100%;
text-transform: uppercase;
font-size: 1.25rem;
border-bottom: solid 1px #D4D4D4
}
nav ul.menu.active li a {
  padding: 10px 25px;

}

nav ul.menu.active li.primary-button {
  margin-top: 17px
}
.mobile-menu.active {
  z-index: 999
}





/* Gravity styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.gform_wrapper {
  padding: 32.68px 37.98px 32.68px 37.98px;
  border-radius: 11px;
  border: 0.88px solid #DDE2E5;
  box-shadow: 0px 13.53px 13.53px 0px #00000014;
  overflow: hidden


}


.gfield--type-honeypot, .gform_required_legend {
  display: none !important
}
h2.gform_submission_error {
  font-size: 1.825rem;
  color: #ff4545;
  font-weight: 800
}


.gfield {
  display: flex;
  flex-direction: column;
  position: relative;
  padding-top: 0;
  margin-top: 20px;
  
} 

.gform_wrapper .gform_fields {
  display: flex;
  flex-direction: column;
  width: 100%;
}

fieldset {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: initial;
  box-shadow: none;
}

.gform_wrapper label{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap; 
  border: 0;
}
.gform_wrapper input::placeholder {
    color: #64747D;
    opacity: 1; 
}


.ginput_container {
  display: flex;
  gap: 40px;
  
}
.ginput_container span {
flex: 1; 
}
.ginput_container_textarea {
  display: block
}
.gform-body input[type="text"],
.gform-body input[type="email"],
.gform-body input[type="tel"],
.gform-body textarea {
  width: calc(100%);
  padding: 15px;
  border:none;
  border-radius: 7px;
  background: #EFF1F999;
  font-size: var(--wp--preset--font-size--small);
  color: #64747D !important

}
input.gform_button[type="submit"] {
    all: unset;  
    background-color: var(--wp--preset--color--primary);
    color: #ffffff;  
    border-radius: 3.5px; 
    padding: 15px 14px;
    text-align: center;  
    cursor: pointer;  
    display: inline-block;
    width: calc(100% - 28px);
    margin-top: 40px;
    border: solid 1px var(--wp--preset--color--primary);
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
input.gform_button[type="submit"]:hover {
  color: var(--wp--preset--color--primary);
  background: #FFF;;
}


.gform-body .validation_error, .validation_message  {
  color: #ff4545;
  font-size: 1rem;
}

.ginput_counter {
  font-size: 0.825rem
}

.gfield_description {
  margin-bottom: 20px
}

.gfield--width-half {
  grid-column: span 6;
}

#hero-area {
  background-image: url("inc/img/grid.png");
  background-repeat: no-repeat;
  background-position: right center;
  
}
#hero-area.wp-block-cover img.wp-block-cover__image-background  {
  left: auto;
  max-height: none;
  max-width: none;
  object-fit: contain;
  padding: 0;
  position: absolute;
  right: -25%;
  top: 0;
  width: 80%;
  }
  

  
/*
  Responsive
*/

  
@media screen and (max-width: 1260px) and (min-width: 781px) {
  h2.wp-block-heading:not(.wp-block-column h2.wp-block-heading) {
    left: 5px;
  }
}

@media only screen and (max-width: 1260px) {
  .entry-content > *:not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide), 
  .wp-block-cover.alignwide,
  .wp-block-cover.alignfull .wp-block-cover__inner-container {
    max-width: var(--wp--style--global--wide-size);
    margin: 0 30px;
  }
  .wp-block-cover.price-card {
    margin: 20px 30px 60px 30px !important;

  }

  .header-container {
    max-width: var(--wp--style--global--wide-size);
    margin: 0 20px;
  }

  .wp-block-separator {
    width: calc(100% - 60px);
  }
}

@media only screen and (max-width: 781px) {
  #hero-area {
    background-image: none
  }
.swiper-brands .swiper-wrapper{
    -webkit-transition-timing-function:inherit!important; 
    -o-transition-timing-function:inherit!important;
    transition-timing-function: inherit!important; 
  }
  
  
  #hero-area h1.wp-block-heading {
    text-align: center;
    padding-top: 43px;
    margin: 0
  }
  
  #hero-area p {
    text-align: center;
    padding: 20px 40px 0 40px;
}
  
  #hero-area  .wp-block-columns {
    gap: 0px
  }
  #hero-area .wp-block-cover__inner-container {
    position: relative;
  }
  
  #hero-area .wp-block-buttons {
    justify-content: center
  }
  
  #hero-area.wp-block-cover img.wp-block-cover__image-background {
    left: auto;
    max-height: none;
    max-width: none;
    object-fit: contain;
    padding: 0;
    position: relative;
    right: auto;
    top: auto;
    width: 120%;
    bottom: -20px;
  }
  
  #hero-area {
    background-size: cover;
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-around;
  }

#hero-area .wp-block-button__link {
margin-top: 20px
}

  #hero-area.wp-block-cover {
    min-height: 595px !important
  }
  
  
  .menu {
    display: none;
  }

  .mobile-menu {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 18px;
  }
  
  .mobile-menu.active .bar:nth-child(2) {
    opacity: 0;
  }

  .mobile-menu.active .bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }

  .mobile-menu.active .bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }

  .fixed #site-navigation {
    height: 65px;
  }

  .fixed .menu {
    top: 0;
    z-index: 3;
  }
}

@media only screen and (max-width: 781px) {
    ul.menu {
        flex-direction: column;
        display: none; 
        align-items: end
    }
    
    nav ul li {
      padding: 20px 0px
    }
    
ul.sub-menu {
  border: none;
  position: relative;
  display: block;
  top: 0;
  padding: 0;
  margin: 20px 0 0;

}

nav ul.menu.active ul.sub-menu li {
  border-top: solid 1px #D4D4D4;
  border-bottom: none
}

ul.menu ul.sub-menu > li:last-of-type {
padding-bottom: 0}

ul.menu > li:first-of-type {
  border-top: solid 1px #D4D4D4
}

.menu-item-has-children > a::after {
top: 30px
}

nav ul.menu.active li a {
    padding: 10px 0;
}

.menu.active {
padding-right: 25px;
padding-left: 25px;
top: 60px;
}
.menu.active .primary-button {
  border: none
}
.menu.active .primary-button a {
  height: 45px;
  justify-content: center;
  align-items: center;
  display: flex;
}


  .wp-block-cover.alignfull .has-extra-small-font-size {
    display: none
  }
  
  .swiper-trusted-companies {
    padding-top: 20px
  }
  
  .price-table .card {
    margin-bottom: 40px
  }
  .price-table .card h2 + p {
    min-height: 10px
  }
  .wp-block-cover, .wp-block-cover-image {padding: 0}
  #hero-area.wp-block-cover.alignfull .wp-block-cover__inner-container
  {
    margin: 0;
    padding: 0 20px
  }
  
  .wp-block-cover.alignfull.trusted-slider {
  padding: 0 0 20px 0;
  margin: 0;
  }
  
  h3.wp-block-heading {
    padding: 0; 
    margin: 0;
  }

  .swiper-brands {
    margin-top: 40px;
  }

  .blockquote-column .wp-block-group {
    padding: 20px;
  }
.wp-block-columns.blockquote-column {
  gap: 0
}

.gform_wrapper {
  margin: 20px 0
}

  #verhoog::before {
    display: none;
  }

  #verhoog.wp-block-cover.alignfull {
    margin: 0;
  }


  .wp-block-spacer {
    height: 20px !important;
  }
  .wp-block-spacer.sm-keep {
  height: 50px !important;
  }
  .footer {
    padding: 40px 20px 0 20px;
  }

  h2::before {top: 15px}

  .price-card {
    margin: 30px auto !important;
    padding: 30px;
  }

  body {
    line-height: 1.6875rem !important;
  }

  .site-branding img {
    max-height: 25px; 
    width: auto;
  }

  h1.wp-block-heading {
    font-size: var(--wp--preset--font-size--large) !important;
    line-height: 1.2em !important;
  }

  h2.wp-block-heading {
    font-size: var(--wp--preset--font-size--medium) !important;
    line-height: 1.2em !important;
  }

  h3.wp-block-heading {
    font-size: var(--wp--preset--font-size--default) !important;
    line-height: 1.2em !important;
  }

  h2::before {
    width: 6px;
    height: 6px;
    margin-right: 8px;
    margin-top: -5px;
  }

  hr + h2 {
    margin-top: 50px !important;
  }

  .swiper-brands {
    margin-top: 50px !important;
  }

  #hero-area p {
    font-size: var(--wp--preset--font-size--default) !important;
    line-height: 1.2em !important;
  }



  .card {
    padding: 20px 30px;
  }

  ul.wp-block-list li {
    line-height: 1.2rem;
  }

  .blockquote-column .has-extra-large-font-size {
    font-size: 4.88rem !important;
  }

  .blockquote-column blockquote {
    margin: 0 !important;
    font-size: 1.2rem;
    line-height: 1.48rem;
    font-weight: 600;
  }

  .blockquote-column blockquote .has-extra-small-font-size {
    line-height: 1.125rem;
  }

  .gform_wrapper {
    padding: 20px;
  }

  .wp-block-post-template {
    margin: 50px 0 50px;
  }

 
  #droppery-content .trusted-slider p {
    text-align: center
  }
#droppery-content .trusted-slider .wp-block-columns {
  gap: 0
}
h2.wp-block-heading:not(.wp-block-column h2.wp-block-heading) {
  left: 0;
  position: relative
}
}

@media only screen and (max-width: 540px) {
.wp-block-columns {
  gap: 14px
}


}



@-webkit-keyframes animate_down {
  0% {
	top: -60px;
  }
  100% {
	top: 0;
  }
}

@keyframes animate_down {
  0% {
	top: -60px;
  }
  100% {
	top: 0;
  }
}


@-webkit-keyframes animate_up {
  0% {
	opacity: 1;
	   transform: translateY(-100px);
  }
  100% {
	opacity: 0;
	   transform: translateY(0);
  }
}

@keyframes animate_up {
  0% {
  opacity: 0;
     transform: translateY(100px);
  }
  100% {
  opacity: 1;
     transform: translateY(0);
  }
}

 @keyframes fadeOutUp {
	0% {
	   opacity: 1;
	   transform: translateY(0);
	}
	100% {
	   opacity: 0;
	   transform: translateY(-120px);
	}
 }