/**
 * Theme Name: Block n Roll
 * Version: 1.1.1
 * Author: DIGIWEDO
 * Author URI: https://digiwedo.nl/
 * Text Domain: blocknroll
 */

:root {
    --swiper-navigation-size: 3rem;
    --swiper-pagination-bullet-size: 0.5rem;
    --swiper-pagination-bullet-color: #000000;
    --swiper-pagination-bullet-opacity: 1;
    --swiper-pagination-bullet-inactive-color: #000000;
    --swiper-pagination-bullet-inactive-opacity: 0.25;
    --swiper-pagination-bullet-horizontal-gap: 0.5rem;
    --swiper-pagination-bullet-vertical-gap: 0.5rem;
	--transition-smooth: 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

:root :where(.is-layout-flow) > * {
	margin-block-start: 0;
}

:where(.wp-site-blocks) > * {
    margin-block: 0;
}

:where(figure) {
    margin: 0;
}

.no-underline a {
	text-decoration: none !important;
}

/* voorkom horizontale scroll in content */
.entry-content,
main {
  overflow-x: clip;
}

.is-salmon-color-anim, .is-yellow-color-anim, .is-purple-color-anim {
	position: relative;

}

.is-salmon-color-anim img , .is-yellow-color-anim img, .is-purple-color-anim img {
	display: block;
	width: 100%;
	height: auto;
}

.is-salmon-color-anim::before , .is-yellow-color-anim::after , .is-purple-color-anim:after{
	content: "";
	position: absolute;
	inset: 0;
	mix-blend-mode: multiply;
	opacity: 1;
	pointer-events: none;
	transition: opacity 0.6s ease;
}

.is-salmon-color-anim::before {
	background-color: var(--wp--preset--color--salmon);
}

.is-yellow-color-anim::after {
	background-color: var(--wp--preset--color--yellow);
}

.is-purple-color-anim::after {
	background-color: var(--wp--preset--color--purple);
}



.is-salmon-color-anim:hover::before, .is-yellow-color-anim:hover:after, .is-purple-color-anim:hover:after {
	opacity: 0;
}



.w-50 {
	width: 50%;
}

.w-75 {
	width: 75%;
}

.no-anim {
	font-size: var(--wp--preset--font-size--heading-2);
	font-family: var(--wp--preset--font-family--source-serif-pero);
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

.no-link {
	pointer-events: none !important;
}

.is-mono-color {
	filter: grayscale(1);
	transition: .4s ease-in;
}

.is-mono-color:hover {
	filter: grayscale(0);
}

.is-referentie-wrapper--inner {
    color: white;
}

@media (min-width: 769px) {
	.is-referentie-wrapper--inner:not(:last-child) {
    border-right: 1px solid white;
}
}


.is-small-gap {
	gap: 5px;
}


.has-opacity-hover:has(a:hover) .footer-socials {
  opacity: 0.2;
	transition: .3s;
}

.has-opacity-hover:has(a:hover) .footer-socials:hover {
  opacity: 1;
	transition: .3s;
} 

.has-opacity-hover:has(a:hover) a:not(:hover) {
  opacity: 0.2;
  transition: opacity .3s ease;
}


.has-opacity-hover a:hover {
  opacity: 1;
}

/* Beige stroke svg */

.is-class-for-beige-svg .is-scroll-arrow-down path {
	stroke: #FFEFCA !important;
}

.is-class-for-brown-svg path {
	stroke: #EBCCA1 !important;
}

.is-class-for-green-svg path {
	stroke: var(--wp--preset--color--green) !important;
}

.is-class-for-grey-svg path {
	stroke: #A5B3B3 !important;
}

.is-class-for-white-svg path {
	stroke: #FFFFFF !important;
}


.is-class-for-purple-svg path {
	stroke: #D7C2EA !important;
}



header.wp-block-template-part {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    height: 4rem;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: var(--transition-smooth);
}

.header-scrolled {
	background: var(--wp--preset--color--green);
}

.home header.wp-block-template-part {
	position: fixed;
	padding-top: 40px;
}

.home .header-scrolled {
	padding-top: 0 !important;
}

header.wp-block-template-part > div {
    margin: 0;
    max-width: 100%;
    width: 100%;
    padding: 1rem 0;
}

header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--yellow) !important;
}

header.wp-block-template-part .wp-block-navigation .current-menu-item .wp-block-navigation-item__content,
header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] {
    color: var(--wp--preset--color--yellow);
}


.is-header-home-logo {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0 !important;
}

.home .is-header-home-logo {
	display: none;
}



.header-topbar {
    min-width: 100%;
}


.header-buttons a {
    transition: var(--transition-smooth);
    color: var(--wp--preset--color--off-white);
    text-transform: uppercase;
    line-height: 1;
    text-decoration: none;
    font-size: 1rem;
}

.header-buttons a:hover {
    color: var(--wp--preset--color--yellow);
}

/* .header-buttons:before {
    content: "";
    width: 32px;
    height: 32px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
	background-image: url('/wp-content/uploads/2025/06/Maasdam-MARK.svg');
	background-size: contain;	
	background-repeat: no-repeat;
} */

.header-buttons {
    position: relative;
    padding-left: 36px !important;
}

.header-buttons-right a {
    color: var(--wp--preset--color--off-white);
    line-height: 1;
    text-decoration: none;
    font-size: 1rem;
    transition: var(--transition-smooth);
}

.header-buttons-right a:hover {
    color: var(--wp--preset--color--yellow);
}

header .wp-block-button a:hover {
    background-color: var(--wp--preset--color--green);
    border: 1px solid var(--wp--preset--color--yellow);
}

header .wp-block-button a:hover:after {
    content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy4.svg");
}





.h-full {
    height: 100%;
}



.wp-block-button a, .wp-block-read-more, .gform_wrapper input[type="submit"] {
	position: relative;
	border-radius: 999px;
	padding: 1.125rem 1.8125rem;
	transition: var(--transition-smooth);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: 1.8125rem;
}

header .wp-block-button a {
    padding: 0.5rem 1.125rem;
    gap: 1.125rem;
    border: 1px solid var(--wp--preset--color--green);

}

/* Footer */

footer.wp-block-template-part > div {
    display: flex;
    flex-direction: column;
    align-content: space-between;
    justify-content: space-between;
}

.footer-middle-area {
	width: 100%;
}


.is-style-icon-button-yellow a, .wp-block-read-more.is-style-icon-button-yellow, .gform_wrapper input[type="submit"], .category-computervloeren .wp-block-read-more {
	background: var(--wp--preset--color--yellow);
	color: var(--wp--preset--color--green);
}

.is-style-icon-button-yellow a:after, .is-style-icon-button-salmon-arrow a:after, .wp-block-read-more:after, .is-style-icon-button-purple a:after, .is-style-icon-button-outline a:after {
	content: url("/wp-content/uploads/2025/06/SMALL-ARROW-Copy.svg");
	display: block;
	width: 1.87294rem;
	height: 1.50269rem;
	transition: var(--transition-smooth);
}

.is-style-icon-button-outline a {
	background: transparent;
	border: 1px solid var(--wp--preset--color--green);
	color: var(--wp--preset--color--green);
	padding: 0.5rem 1rem;
}

.is-style-icon-button-outline a:after {
	background: transparent;
	color: var(--wp--preset--color--green);
}

.is-style-icon-button-outline a:hover:after {
/* 	content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy4.svg"); */
	transform: translateX(0.5rem);
}

.is-style-icon-button-yellow a:hover {
	background: var(--wp--preset--color--green);
	color: var(--wp--preset--color--yellow);
}

.is-style-icon-button-yellow a:hover:after {
	content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy4.svg");
	transform: translateX(0.5rem);
}

.wp-block-read-more:hover:after {
	transform: translateX(0.5rem);
}

.wp-block-read-more:after {
	transition: var(--transition-smooth) !important;
}

.is-style-icon-button-purple a:hover {
	background: var(--wp--preset--color--green) !important;
	color: var(--wp--preset--color--purple) !important;
}

.is-style-icon-button-purple a:hover:after {
	content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy3.svg");
	transform: translateX(0.5rem);
}

.is-style-icon-button-salmon a:hover:after, .is-style-icon-button-salmon:hover:after {
	transform: translateX(0.5rem);
}

.is-style-icon-button-green a {
	background: var(--wp--preset--color--green);
	color: var(--wp--preset--color--yellow);
}

.is-style-icon-button-green a:after {
	content: url("/wp-content/uploads/2025/06/Plus-yellow.svg");
	display: block;
	width: 1.54506rem;
	height: 1.54506rem;
}

.is-style-icon-button-salmon a, .wp-block-read-more.is-style-icon-button-salmon, .is-style-icon-button-salmon-arrow a, .category-totaalinrichting .wp-block-read-more {
	background: var(--wp--preset--color--salmon);
	color: var(--wp--preset--color--green);
}

.wp-block-read-more.is-style-icon-button-purple,.is-style-icon-button-purple a, .category-vloerafwerkingen .wp-block-read-more {
    background: var(--wp--preset--color--purple);
    color: var(--wp--preset--color--green);
}

.is-style-icon-button-salmon a:after {
	content: url("/wp-content/uploads/2025/06/Plus-green.svg");
	display: block;
	width: 1.54506rem;
	height: 1.54506rem;
}


/* Pattern hero home */
.is-hero-home {
    position: relative;
    z-index: 0;
	min-height: 90vh;
	display: flex;
	align-items: stretch;
    align-content: stretch;
}



.is-hero-home-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.home header > div, .home header > div > div {
    background-color: transparent !important;
}

.home .header-buttons {
	padding-left: 0 !important;
}


.hero-home--wrapper {
	width: 100%;
}


/* Pattern hero 2 */

.is-pattern-hero-2 {
	overflow-x: clip;
}

.is-hero-2-desktop {
	overflow-x: clip;
}

.hero-2-inner, .hero-2-bottom-inner, .hero-3-inner, .hero-3-bottom-inner {
    position: relative;
}

.hero-2-inner:before, .hero-2-bottom-inner:before, .hero-3-inner:before, .hero-3-bottom-inner:before, .is-xtra-before:after {
    content: "";
    background: white;
    position: absolute;
    height: 100%;
    width: 100vw;
    top: 0;
}

.hero-2-inner:before, .hero-2-bottom-inner:before {
    left: -100vw;

}

.wp-block-group .wp-block-columns .is-hero-3-bottom-left {
		flex-basis: 34% !important;
		
	}
	.wp-block-group .wp-block-columns .hero-2-bottom-left {
		flex-basis: 66% !important;
	}

.hero-3-inner:before, .hero-3-bottom-inner:before, .is-xtra-before:after {
    right: calc(-100vw - -120px);
}

.hero-3-inner:before {
	height: calc(100% + 10rem) !important;
    top: -6rem;
}

.is-pattern-hero-3 {
	overflow-x: clip;
}

.hero-3-inner h1 {
	position: relative;
	z-index: 3;
}

.hero-2-bottom-inner:before {
	left: -100vw;
}

.hero-3-bottom-inner:before {
    right: -100vw;
}

.is-xtra-before:after; {
    left: -5vw;
}

.is-hero-3-content {
    z-index: 3;
}

.is-hero-3-bottom-left {
    transform: translateY(5.4rem);
    z-index: 4;
	padding-left: 60px !important;
}

.image-margin-right {
	margin-right: -120px !important;
}


.hero-2-bottom {
	background: linear-gradient(0deg,rgba(255, 255, 255, 1) 40%, rgba(232, 195, 170, 1) 40%);
}

.hero-3-bottom {
    background: linear-gradient(0deg,rgba(255, 255, 255, 1) 40%, rgba(255, 255, 111, 1) 40%);
}

.hero-4-bottom {
    background: linear-gradient(0deg,rgba(255, 255, 255, 1) 40%, var(--wp--preset--color--purple) 40%);
	position: relative;
}

.hero-4-bottom:before {
	content: "";
	width: 100%;
	left: -50%;
	top: 0;
	height: 100%;
	position: absolute;
	background: linear-gradient(0deg,rgba(255, 255, 255, 1) 40%, var(--wp--preset--color--purple) 40%);
	z-index: 2;
}

.hero-desktop-4-top {
	position: relative;
}

.hero-desktop-4-top:before {
	content: "";
	width: 100%;
	left: -100%;
	top: 0;
	height: 100%;
	position: absolute;
	background: var(--wp--preset--color--purple);
	z-index: 2;
}

.hero-2-bottom-left {
    z-index: 2;
    position: relative;
}

.hero-2-arrow {
    position: absolute;
    right: 4%;
    top: 0;
}

/*MAASDAM GRID DECO*/

.com--hero__grid-box {
    position: absolute;
    width: 100%;
    max-width: 480px;    
    aspect-ratio: 1;    
    bottom: 0;
    right: 0;
    z-index: -1;
}

.hero-lines-wrapper {
    position: absolute;
    z-index: 0;
    top: 25%;
    left: 62.5%;
    width: 100%;
    aspect-ratio: 1;     
    display: flex;
    justify-content: space-between;
    gap: 0 !important;
}

.hero-3-lines-wrapper {
    position: absolute;
    z-index: 0;
    top: 30.5%;
    left: auto; 
    right: calc(100% - 76px);
    transform: translateX(-31rem);
    width: 100%;
    aspect-ratio: 1;     
    display: flex;
    justify-content: space-between;
    gap: 0 !important;
}

.hero-lines-h, .hero-lines-v {
    position: absolute;
    display: flex;
    justify-content: space-between;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hero-lines-h {
    flex-direction: column;
    margin: 0 !important;
}

.hero-lines-v {
    margin: 0 !important;
}

.hero-lines-h .hero__lines {
    width: 100%;
    height: 1px;
}

.hero-lines-v .hero__lines {
    width: 1px;
    height: 100%;
}

.hero__lines {
    background-color: var(--wp--preset--color--gray);
    margin: 0 !important;
}

.is-pattern-50-grid-img-text.grid-is-beige .hero__lines {
    background-color: var(--wp--preset--color--beige);
}


.hero-2-grid {
    position: absolute;
    left: 62rem;
    bottom: -12rem;
    z-index: 1;
}

.w-full, .w-full img {
	width: 100%;
}


/* hover text */
.is-hover-text {
	max-width: var(--wp--style--global--wide-size) !important;
}

/* Pattern scroll */

.is-pattern-scroll {
	height: 100vh;
	display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
	overflow: hidden;
}

.is-pattern-scroll *:not(figure) {
    z-index: 2;
}


.pin-spacer {
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: 100% !important;
    padding: 0 !important;
}

.is-scroll-change {
	margin: 0 auto;
	position: absolute;
	left: 0;
    top: 0;
}

.is-scroll-change-2, .is-scroll-change-3 {
	opacity: 0;
}

.is-scroll-change-wrapper {
	position: relative;
	min-height: 500px;
}

.is-scroll-icon-1 {
    position: absolute;
    left: 0;
    bottom: 0%;
    width: 40%;
    aspect-ratio: 1;
}

.is-scroll-icon-1 img {
	object-fit: cover;
	width: 100%;
    height: 100%;
}

.is-scroll-icon-2 {
	position: absolute;
	right: 3rem;
	bottom: -50%;
}

.is-scroll-arrow-down {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
}

.is-scroll-arrow-down img {
	width: 12rem;
	max-width: 100%;
}

.is-scroll-pagination-wrapper {
    position: absolute;
    left: 3rem;
    bottom: 3rem;
}

.is-scroll-pagination-counter {
	position: relative;
}

.is-scroll-pagination--2, .is-scroll-pagination--3, .is-scroll-pagination--4, .is-scroll-pagination--5 {
	font-size: 0;
}

.is-scroll-pagination--1, .is-scroll-pagination--2, .is-scroll-pagination--3, .is-scroll-pagination--4, .is-scroll-pagination--5 {
	margin: 0 !important;
}




/* Slider careers */
.is-pattern-team-swiper {
		overflow: clip;
	}

/*TOTAAL INRICHTING SCROLL*/

.is-scroll-icon-1-ti {
    position: absolute;
    right: 0;
    width: 40%;
    aspect-ratio: 1;
}

.is-scroll-icon-2-purple {
	left: 0;
}

.is-scroll-icon-1-ti img {
	width: 100%;
	height: 100%;
}

/*Computervloeren*/

.is-scroll-icon-1-cv {
    position: absolute;
    left: 0;
    width: 40%;
    aspect-ratio: 1;
}

.is-scroll-icon-1-cv img {
	width: 100%;
	height: 100%;
}

.has-raster-bottom-left {
	position: relative;
}

.has-raster-bottom-left:before {
	content: "";
	width: 480px;
	height: 480px;
	position: absolute;
	left: -240px;
	bottom: -180px;
	background-image: url(/wp-content/uploads/2025/08/Raster-grijs.svg);
	background-size: contain;
	background-repeat: no-repeat;
	z-index: -1;
}

.has-color-dark path {
    stroke: var(--wp--preset--color--green);
}

.is-shortened-yellow-bg {
	background: linear-gradient(180deg,rgba(255, 255, 111, 1) 50%, rgba(255, 255, 255, 1) 50%) !important;
}

@media (max-width: 768px) {
	.has-raster-bottom-left:before {
		display: none;
	}
	.has-color-dark .icon-container {
		width: 3rem !important;
	}
}



/*VLOERAFWERKINGEN*/

.is-scroll-icon-2-va {
    position: absolute;
    left: 0;
    bottom: -50%;
}
/* Big text hover */

.wp-block-paragraph,
.is-pattern-hover-text {
  --fade-opacity: 1;
  color: rgba(40, 57, 54, var(--fade-opacity));
  transition: color 0.25s ease;
}

.wp-block-paragraph:has(.span-wrapper:hover),
.is-pattern-hover-text:has(.span-wrapper:hover) {
  --fade-opacity: 0.3;
}


/* scroll section computervloeren */

.is-steps-scroll-wrapper {
	position: relative;
	padding-left: 2rem;
}

.is-steps-scroll-wrapper .is-steps-scroll-wrapper--icon {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 !important;
}

/* .is-columns-scroll-list {
	overflow-y: auto;
}

@media (max-width: 768px) {
	.is-columns-scroll-list {
		height: 300px;
		z-index: 99;
	}
} */


.span-wrapper {
  text-decoration: underline;
  transition: color 0.25s ease;
  position: relative;
  overflow: visible;
}
.span-wrapper:hover {
  --fade-opacity: 1;
  color: rgba(40, 57, 54, var(--fade-opacity));
}



.wrapper-hover {
  position: relative;
  display: inline-block;
	z-index: 0;
}

.wrapper-hover:hover {
	z-index: 1000;
}

.wrapper-hover img {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.6s ease,
    transform 0.6s ease;
  transform-origin: center center;
  width: 700px !important;
  max-width: 700px !important;
  height: auto !important;
  object-fit: cover;
  z-index: 1001;
}

.is-hover-text {
  --fade-opacity: 1 !important;
  color: rgba(40,57,54,var(--fade-opacity)) !important;
  transition: color .25s ease;
}

.is-hover-text:has(.span-wrapper:hover), .span-wrapper:hover {
  --fade-opacity: 0.4 !important;
}

.wrapper-hover:hover,
.wrapper-hover:hover .span-wrapper {
  --fade-opacity: 1 !important;
  color: rgba(40,57,54,var(--fade-opacity)) !important;
  z-index: 1000; 
}

.is-hover-text {
  position: relative;
}


.is-hover-text .span-wrapper {
  transition: opacity 0.3s ease;
}

/* Als er een span-wrapper gehoverd wordt → alle span-wrappers dimmen */
.is-hover-text:has(.span-wrapper:hover) .span-wrapper {
  opacity: 0.4;
}

/* Behalve degene waar je op zit */
.is-hover-text:has(.span-wrapper:hover) .span-wrapper:hover {
  opacity: 1;
}




.wrapper-hover[data-placement="bottom"] img {
  top: 100%;
  left: 50%;

  opacity: 0;
}
.wrapper-hover[data-placement="bottom"]:hover img {

  opacity: 1;
}

.wrapper-hover[data-placement="top"] img {
  bottom: 100%;
  left: 50%;

  top: auto;
  opacity: 0;
}
.wrapper-hover[data-placement="top"]:hover img {

  opacity: 1;
}

.wrapper-hover[data-placement="left"] img {
  top: 50%;
  right: calc(100% + 0.5rem);

  left: auto;
  opacity: 0;
}
.wrapper-hover[data-placement="left"]:hover img {

  opacity: 1;
}

.wrapper-hover[data-placement="right"] img {
  top: 50%;
  left: calc(100% + 0.5rem);

  opacity: 0;
}
.wrapper-hover[data-placement="right"]:hover img {

  opacity: 1;
}



.is-pattern-hover-text {
  position: relative;
}

.is-pattern-hover-text * {
    z-index: 2;
    position: relative;
}

.is-pattern-hover-text:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 100%;
  background: var(--wp--preset--color--yellow);
}


/* Diensten */


.is-pattern-diensten {
  position: relative;
/* 	min-height: 80vh; */
}

.is-pattern-diensten * {
    z-index: 2;
    position: relative;
}

.is-pattern-diensten:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 100%;
  background: var(--wp--preset--color--beige);
}

.is-img-arrow-wrapper {
	position: relative;
	transition: .4s;
}

.is-column-diensten-img-wrapper {
  position: relative;
	aspect-ratio: 3/4;
}

.is-diensten-image {
  position: absolute;
  inset: 0;          
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease;
}

.is-diensten-image.is-active {
  opacity: 1;
  visibility: visible;
}


.is-img-arrow-wrapper img {
	width: 100%;
	height: 100%;
}

.is-diensten-wrapper {
  opacity: 1;
  transition: opacity .4s ease;
}

.diensten-container:has(.is-diensten-wrapper:hover)
  .is-diensten-wrapper:not(:hover) {
  opacity: 0.1 !important;
}


/*Referenties*/


/* Filter */

.query-filter-links {
	display: flex;
    flex-direction: row;
    align-content: center;
    gap: 1rem; 
}

.query-filter-links .query-filter-link { 
	text-decoration: none; 
}

.query-filter-links .query-filter-link.is-active {
	font-weight: 600; 
	color: var(--wp--preset--color--green); 
}

.referentie-categorie-computervloeren .referentie-hover-header {
	background: var(--wp--preset--color--yellow) !important;
}

.referentie-categorie-totaalinrichting .referentie-hover-header {
	background: var(--wp--preset--color--salmon) !important;
}

.referentie-categorie-vloerafwerkingen .referentie-hover-header {
	background: var(--wp--preset--color--purple) !important;
}

.referentie-categorie-totaalinrichting .is-groep-oppervlakte {
	display: none;
}

a.wp-block-button__link.wp-element-button.wp-load-more__button {
        background: transparent;
    color: var(--wp--preset--color--green);
    border: 2px solid var(--wp--preset--color--green);
}

a.wp-block-button__link.wp-element-button.wp-load-more__button:hover {
    background: var(--wp--preset--color--green);
    color: var(--wp--preset--color--yellow);
}


.is-testimonial-content {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: space-between;
}

.is-testimonial-content-inner {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    align-self: flex-start;
    height: 100%;
    width: 40%;
}

.is-testimonial-content-inner-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: flex-start;
    height: 100%;
}

.is-testimonial-content-inner-inner > *, .is-testimonial-content-inner > * {
    margin-left: 0 !important;
    margin-right: auto !important;
    max-width: none !important;
}


.is-testimonial-content a {
    align-self: flex-end;
}


#is-testimonial-swiper ul {
	height: 100vh;
}

#is-testimonial-swiper .wp-block-post-featured-image, #is-testimonial-swiper .wp-block-post-featured-image img {
	height: 100%;
}

#is-testimonial-swiper .swiper-pagination {
    position: absolute;
    bottom: 10%;
    left: 15%;
}

#is-testimonial-swiper .swiper-pagination-bullet {
    background-color: transparent;
    border: 1px solid white;
    opacity: 1;
}

#is-testimonial-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: var(--testimonial-color);
    border: 1px solid var(--testimonial-color);
}

#is-testimonial-swiper .swiper-button-next {
    position: absolute;
    bottom: 50%;
    right: 5%;
    height: 4rem;
    color: var(--testimonial-color);
}

#is-testimonial-swiper .swiper-button-prev {
    position: absolute;
    bottom: 50%;
    left: 5%;
    height: 4rem;
    color: var(--testimonial-color);
}

.testimonial-quotes {
    color:  var(--testimonial-color);
}

#is-testimonial-swiper.is-salmon {
    --testimonial-color: var(--wp--preset--color--salmon);
}

#is-testimonial-swiper.is-purple {
    --testimonial-color: var(--wp--preset--color--purple);
}

#is-testimonial-swiper.is-yellow {
    --testimonial-color: var(--wp--preset--color--yellow);
}

/*Careers*/

.is-careers-left {
    min-width: 30%;
    z-index: 10;
}

.is-careers-right {
    align-self: center;
}

#is-team-swiper.wp-block-blocknroll-swiper, #is-team-swiper .wp-block-query {
    overflow: visible;
}

#is-team-swiper.wp-block-blocknroll-swiper:before {
    content: "";
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--wp--preset--color--salmon);
    z-index: 9;
}

#is-team-swiper .swiper-navigation {
    position: absolute;
    top: -2rem;
    right: 0;
    gap: 1rem;
}

.is-teams-grid {
    margin: 0 auto !important;
}

.is-team-name {
    position: absolute;
    bottom: 10%;
    left: 10%;
    z-index: 2;
}

.is-team-card {
    position: relative;
    overflow: hidden;
	height: 100%;
}


.is-team-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--wp--preset--color--black);
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
    z-index: 3; 
}

.is-team-card:hover::before {
    opacity: 0.6;
}

.is-team-card-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    color: var(--wp--preset--color--green) !important;
    transition: opacity 0.4s ease-in-out;
    z-index: 5; 
    text-align: left;
    line-height: 1;
    letter-spacing: 3px;
}

.is-team-card-link {
    position: absolute;
    bottom: 2%;
    left: 50%;
    width: 82%;
    opacity: 0;
    transform: translate(-50%, -50%);
    color: var(--wp--preset--color--green) !important;
    transition: opacity 0.4s ease-in-out;
    z-index: 5;
    text-align: left;
    padding: 0;
    margin: 0;
    justify-content: space-between;
}

#is-team-swiper li {
	height: auto !important;
}



.is-team-card-join a {
    text-decoration: none;
    color: var(--wp--preset--color--green) !important;
}

.is-team-card:hover .is-team-card-content, .is-team-card:hover .is-team-card-link {
    opacity: 1;
}

.is-team-card img {
    transition: transform 0.5s ease;
    display: block;
    width: 100%;
    height: 100%;
	object-fit: cover !important;
}

.is-team-card figure {
	height: 100%;
}

.is-team-card:hover img {
    transform: scale(1.02);
}



.is-grid {
    position: absolute;
    left: 180px;
    bottom: -580px;
    z-index: 0;
}

#is-team-swiper figure {
    z-index: 2;
}

.video-modal { 
	position: fixed; 
	inset: 0; 
	display: none; 
	z-index: 9999; 
}

.video-modal.is-open { 
	display: block; 
}

.video-modal__backdrop { 
	position:absolute; 
	inset:0; 
	background:rgba(0,0,0,.6); 
}

.video-modal__dialog {
  position:absolute; 
	left:50%; 
	top:50%; 
	transform:translate(-50%,-50%);
  width:min(90vw, 500px); 
	background:#111; 
	border-radius:12px; 
	overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}

.video-modal__close {
  position:absolute; 
	top:.25rem; 
	right:.5rem; 
	font-size:2rem; 
	background:none; 
	border:0; 
	color:#fff; 
	cursor:pointer;
	z-index: 9;
}
.video-modal__body { 
	aspect-ratio:2/3; 
	background:#000; 
}

.video-modal__body > * { 
	width:100%; 
	height:100%; 
	display:block; 
	border:0; 
	object-fit: cover;
}

html.modal-open { 
	overflow:hidden; 
}

.js-video-modal-trigger { 
	cursor:pointer; 
}

.js-video-url { 
  display: none !important; 
  visibility: hidden !important; 
  height: 0 !important; 
  overflow: hidden !important;
}

.js-video-url .wp-video,
.js-video-url .mejs-container,
.js-video-url iframe,
.js-video-url video { 
  display: none !important; 
}





/* UPDATES */

.is-update-img {
    grid-column-end: -1;
    position: relative;
    overflow: hidden; 
	aspect-ratio: 1;
}

.is-updates {
    position: relative;
}

.swiper-navigation-button:hover {
    opacity: 0.7;
}

#is-updates .swiper-navigation {
    position: absolute;
    right: 0;
    top: 0;
    gap: 5rem;
}

#is-updates .swiper-pagination {
    position: absolute;
    right: 48px;
    top: 24px;
    width: 5rem;
    transform: translateY(-50%);
}

.taxonomy-category a,
.wp-block-post-title a {
    text-decoration: none;
    color: var(--wp--preset--color--green);
}

/* Pijl-icoon via mask */
.is-updates-inner .wp-block-read-more:after {
    content: "";
    display: inline-block;
    width: 1.87294rem;
    height: 1.50269rem;
    background-color: var(--wp--preset--color--green);
    mask: url("/wp-content/uploads/2025/07/SMALL-ARROW-Copy2.svg") no-repeat center;
    -webkit-mask: url("/wp-content/uploads/2025/07/SMALL-ARROW-Copy2.svg") no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    transition: background-color 0.3s ease;
    margin-left: 0.5rem;
}

.category-vloerafwerkingen .is-updates-inner:hover .wp-block-read-more:after {
    content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy3.svg");
    display: block;
    width: 1.87294rem;
    height: 1.50269rem
}

/* Hover: switch pijl-kleur */
.category-totaalinrichting .is-updates-inner:hover .wp-block-read-more::after {
    background-color: var(--wp--preset--color--salmon);
}

.category-vloerafwerkingen .is-updates-inner:hover .wp-block-read-more::after {
    background-color: var(--wp--preset--color--purple);
}

.category-computervloeren .is-updates-inner:hover .wp-block-read-more::after {
    background-color: var(--wp--preset--color--yellow);
}

/*.is-updates-inner:hover .wp-block-read-more.is-style-icon-button-purple::after {*/
/*    background-color: var(--wp--preset--color--purple);*/
/*}*/

/* Zalmkleurlaag met blend-mode */
.is-updates-inner .is-update-img::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--wp--preset--color--salmon);
    mix-blend-mode: multiply;
    opacity: 0;
    transition: opacity 0.6s ease;
    pointer-events: none;
}

.is-updates .category-computervloeren .is-update-img::after {
    background-color: var(--wp--preset--color--yellow);
}

.is-updates-purple .is-update-img::after, .is-updates .category-vloerafwerkingen .is-update-img::after {
    background-color: var(--wp--preset--color--purple);
}

/* Hover: zoom + tint */
.is-updates-inner:hover .is-update-img::after {
    opacity: 1; /* Intensity van de zalmkleurlaag */
}

.is-updates-inner .is-update-img img {
    transition: transform 0.6s ease, filter 0.6s ease;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Hover: zoom + lichte filter voor warmte en helderheid */
.is-updates-inner:hover .is-update-img img {
    transform: scale(1.03);
    filter: brightness(1.00) contrast(1.1) saturate(0);
}

/* Knopkleur switch */
.category-totaalinrichting .is-updates-inner:hover .wp-block-read-more {
    background-color: var(--wp--preset--color--green);
    color: var(--wp--preset--color--salmon);
    border-color: var(--wp--preset--color--green);
}

.category-computervloeren .is-updates-inner:hover .wp-block-read-more {
    background-color: var(--wp--preset--color--green);
    color: var(--wp--preset--color--yellow);
    border-color: var(--wp--preset--color--green);
}

.category-vloerafwerkingen .is-updates-inner:hover .wp-block-read-more {
    background-color: var(--wp--preset--color--green);
    color: var(--wp--preset--color--purple);
    border-color: var(--wp--preset--color--green);
}


/* 	Computer intro pattern */
	.is-pattern-computer-intro {
		overflow-x: clip;
	}


.is-60-40-img-txt img, .is-60-40-img-txt figure {
    object-fit: cover;
    height: 100%;
}

.is-double-content-image--right-col > div, .is-double-content-image--left-col > div {
	height: 100%;
}


/*Totaalinrichting*/



.is-pattern-50-grid-img-text-wrapper {
    position: relative;
}

.is-pattern-50-grid-img-text-wrapper:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    background: var(--wp--preset--color--yellow);
}

.on-vloerafwerkingen.is-pattern-50-grid-img-text-wrapper:before {
    background: var(--wp--preset--color--gray);
}

.is-pattern-50-grid-img-text > * {
    width: 50%;
}

.is-pattern-50-grid-img-text .is-style-icon-button-yellow a {
    background-color: transparent;
    padding: 0;
}

.is-pattern-50-grid-img-text .is-style-icon-button-yellow a:hover {
	color: inherit;
} 

.is-pattern-50-grid-img-text .is-style-icon-button-yellow a:hover:after {
	content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy2.svg");
} 

.is-pattern-50-grid-img-text .image-grid-green-bg .is-50-grid-img-txt-img {
    position: absolute;
    left: 0;
    bottom: 50%;
    transform: translateY(50%);
	z-index: 2;
}

.is-pattern-50-grid-img-text .image-grid-green-bg  .hero-lines-wrapper-ti {
	left: unset !important;
	bottom: unset !important;
}

.is-pattern-50-grid-img-text .image-grid-green-bg  .com--hero__grid-box-ti {
	bottom: -22px !important;
    right: -60px !important;
}

.grid-wrapper {
    position: relative;
    height: 100%;
}

.com--hero__grid-box-ti {
    position: relative;
    width: 100%;
    max-width: 480px;    
    aspect-ratio: 1;    
    bottom: 15%;
    right: 82.5%;
    z-index: 0;
}

.is-50-grid-img-txt-img {
    position: absolute;
    right: 21%;
    bottom: -0.5%;
}

.is-50-grid-img-txt-img video {
	max-width: 420px;
}

.hero-lines-wrapper-ti {
    position: absolute;
    z-index: 0;
    bottom: 10%;
    left: 86.5%;
    width: 100%;
    aspect-ratio: 1;     
    display: flex;
    justify-content: space-between;
    gap: 0 !important;
}


/*CONTACT*/

.contact-inner-2 {
    align-items: stretch; 
    height: 100%;
}

.contact-inner-2 > * {
    flex: 1;
}

.is-contact-right {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-left: 1px solid #FFFFFF40;
}

.is-contact-left {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.is-contact-left > div {
    margin: 0 !important;

}



/* Groene USPs */

.is-pattern-knauf-faq {
    overflow-x: clip;
    margin-top: -5rem !important;
    z-index: 999;
}

.is-knauf-usp-col-wrapper {
	z-index: 9;
}



/* Referenties hero */
.is-pattern-referenties-hero-bottom {
	background: linear-gradient(180deg,rgba(232, 195, 170, 1) 0%, rgba(232, 195, 170, 1) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 100%);
	position: relative;
}

.is-pattern-referenties-hero-bottom--purple {
	background: linear-gradient(180deg, rgba(215, 194, 234, 1) 0%, rgba(215, 194, 234, 1) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 100%);
}

.is-hero-image-group {
	position: relative;
}

.is-pattern-referenties-hero-bottom .hero-3-lines-wrapper {
	position: static;
	transform: translateX(0);
}

/* slider */
#is-testimonial-swiper figure:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgb(0 0 0 / 40%) 100%);
    inset: 0;
}


.is-pattern-referenties-hero-bottom .com--hero__grid-box {
    position: absolute;
    width: 100%;
    max-width: 480px;
    aspect-ratio: 1;
    bottom: -180px;
    left: -60px;
    z-index: -1;
	margin: 0 !important;
}

.is-pattern-text-centered-arrow {
	position: relative;
	padding-left: 120px;
    padding-right: 180px;
}

.is-arrow-down--centered {
	position: absolute;
    left: 50%;
    bottom: -5rem;
    transform: translateX(-50%);
}






/*GFORMS*/

.gform_wrapper {
	flex-direction: column;
}

.gform_wrapper.gravity-theme input[type=color], .gform_wrapper.gravity-theme input[type=date], .gform_wrapper.gravity-theme input[type=datetime-local], .gform_wrapper.gravity-theme input[type=datetime], .gform_wrapper.gravity-theme input[type=email], .gform_wrapper.gravity-theme input[type=month], .gform_wrapper.gravity-theme input[type=number], .gform_wrapper.gravity-theme input[type=password], .gform_wrapper.gravity-theme input[type=search], .gform_wrapper.gravity-theme input[type=tel], .gform_wrapper.gravity-theme input[type=text], .gform_wrapper.gravity-theme input[type=time], .gform_wrapper.gravity-theme input[type=url], .gform_wrapper.gravity-theme input[type=week], .gform_wrapper.gravity-theme select, .gform_wrapper.gravity-theme textarea {
    padding: 0 !important;
}
.gform_wrapper {
    display: flex;
    gap: 10px; /* ruimte tussen de velden */
    align-items: center;
}

::placeholder {
	color: #ffffff;
	opacity: 0.5;
	font-size: 1.5rem !important;
}

.gform_wrapper input[type="submit"] {
    background-image: url("/wp-content/uploads/2025/06/SMALL-ARROW-Copy.svg");
    background-repeat: no-repeat;
    background-position: right 24px center;
    padding-right: 5rem; /* ruimte maken voor icoon */
    font-size: var(--wp--preset--font-size--normal);
    border: none;
}

.gform_wrapper input[type="submit"]:hover {
	background-position: right 12px center;
}

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="textarea"] {
    flex: 1; /* velden vullen de ruimte */
    padding: 10px;
    background-color: transparent;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid var(--wp--preset--color--yellow);
    font-size: 16px;
}

.is-contact-page .gform_wrapper input[type="text"],
.is-contact-page .gform_wrapper input[type="email"],
.is-contact-page .gform_wrapper textarea {
    border: 0;
    border-bottom: 1px solid var(--wp--preset--color--green);
}



.gfield_required {
    font-size: 2rem !important;
	color: var(--wp--preset--color--green) !important;
}

.is-contact-inner-wrapper .gfield_required {
	color: var(--wp--preset--color--yellow) !important;
}

p.gform_required_legend {
    display: none;
}

#gform_fields_1 .gfield_label, #gform_fields_3 .gfield_label, #gform_fields_6 .gfield_label {
    font-weight: 400;
    font-size: var(--wp--preset--font-size--heading-4);
    color: var(--wp--preset--color--yellow);
    margin: 0 !important;
}

#gform_fields_2 .gfield_label {
    font-weight: 400;
    font-size: var(--wp--preset--font-size--heading-4);
    color: var(--wp--preset--color--green);
    margin: 0 !important;
}

.ginput_container input::placeholder, .ginput_container input[type="text"] {
    color: #ffffff50;
    font-size: var(--wp--preset--font-size--heading-4) !important;
    font-family: "Suisse Intl";
	font-size: 1.5rem !important;
}

.is-contact-page .ginput_container input::placeholder, .ginput_container input[type="text"], .is-contact-page .ginput_container textarea {
    color: var(--wp--preset--color--white);
    font-size: var(--wp--preset--font-size--heading-4) !important;
    font-family: "Suisse Intl";
	font-size: 1.5rem !important;
}


.gform_wrapper input[type="submit"]:hover {
	background-color: transparent;
	outline: 1px solid #FFFF6F;
	color: #FFFF6F;
	fill: #FFFF6F;
	cursor: pointer;
	background-image: url(/wp-content/uploads/2025/08/SMALL-ARROW-Copy4.svg);
}

form#gform_1, div#gform_wrapper_1 {
    width: 100%;
}

.is-contact-inner-wrapper .gform_wrapper.gravity-theme .gform_fields {
	grid-row-gap: 4rem;
}

/* Gravity contact page */ 

.is-contact-page ::placeholder, .is-contact-page input, .is-contact-page .ginput_container input::placeholder, .is-contact-page .ginput_container input[type="text"], .is-contact-page .ginput_container textarea {
	color: var(--wp--preset--color--green);
	font-size: 1.5rem !important;
}

/*Computervloeren*/


.is-cv-video {
   	position: absolute;
    top: 75%;
    z-index: 2;
    width: 100%;
    scale: 1.5;
}





#lpbLottiePlayer-2 .lpbLottiePlayer dotlottie-player {
    width: 100% !important;
}


.is-video-wrapper {
	position: relative;
}

#lpbLottiePlayer-1 .lpbLottiePlayer {
    text-align: left !important;
}

#lpbLottiePlayer-1 .lpbLottiePlayer dotlottie-player {
	width: 60% !important;
}

.computervloeren-intro-left * {
	z-index: 3;
	position: relative;
}

.is-knauf-50-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
}

.is-knauf-50-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4rem;
}

.is-knauf-50-right img {
    object-fit: cover;
}

/*USP BLOCK*/

.expandable-card {
    overflow: hidden;
}

/* Header */
.expandable-header {
    display: flex;
    justify-content: flex-start;
    cursor: pointer;
    background-color: var(--wp--preset--color--green);
    color: white;
}



/* Toggle icoon */
.expandable-toggle {
    transition: transform 0.3s ease;
}

.expandable-card.open .expandable-toggle {
    transform: rotate(45deg);
}

/* Body */
.expandable-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    padding: 0 1rem;
}

.expandable-card.open .expandable-body {
    max-height: 500px; 
}

/*VLOERENAFWERKING*/

.is-vloeren-swiper {
  --vloeren-header-h: 72px;
  position: relative;
  overflow: hidden;
}

.is-vloeren-swiper-content {
  position: absolute;
  inset: 0;
  transform: translateY(calc(100% - var(--vloeren-header-h)));
  transition: transform 600ms ease;
  will-change: transform;
	margin-top: 0 !important;
}

.is-vloeren-swiper:hover .is-vloeren-swiper-content,
.is-vloeren-swiper-content.open {
  transform: translateY(0);
}

.is-vloeren-swiper-header {
  cursor: pointer;
  min-height: var(--vloeren-header-h);
  display: flex;
  align-items: center;
  transition:
    background-color 300ms ease,
    color 300ms ease,
    border-bottom-width 300ms ease;
  border-bottom: 1px solid var(--wp--preset--color--green);
}

.is-vloeren-swiper {
	border-bottom: 1px solid var(--wp--preset--color--green);
}

.is-vloeren-swiper:hover .is-vloeren-swiper-header,
.is-vloeren-swiper-content.open .is-vloeren-swiper-header {
  border-bottom-width: 0 !important;
}

.is-vloeren-swiper-header svg {
  transition: transform 300ms ease;
}
.is-vloeren-swiper:hover .is-vloeren-swiper-header svg,
.is-vloeren-swiper-content.open .is-vloeren-swiper-header svg {
  transform: rotate(45deg);
}

.swiper-slide-prev .is-vloeren-swiper-content,
.swiper-slide-next .is-vloeren-swiper-content {
  transform: translateY(calc(100% - var(--vloeren-header-h)));
}


.is-vloeren-swiper-header svg {
    transition: var(--transition-smooth);
}

#onze-vloeren .is-style-icon-button-green a:after {
    content: url("/wp-content/uploads/2025/08/SMALL-ARROW-Copy3.svg");
    display: block;
    width: 1.87294rem;
    height: 1.50269rem;
}

.has-fade-up-js {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.6s ease-out 0.2s, transform 0.6s ease-out 0.2s;
}

.has-fade-up-js.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.has-letter-spacing {
    letter-spacing: 0.04167em;
}

/* =======================================
   TEMPLATES: REFERENTIES ARCHIEF
   ======================================= */

/* Categorieën lijst boven de referenties */
.is-referentie-categories {
    list-style: none;
    display: flex;
    gap: 1rem;
    padding-inline-start: 0;
}

.is-referentie-categories > * a {
    text-decoration: none;
    color: var(--wp--preset--color--gray);
}

.is-referentie-categories .current-cat a {
    color: var(--wp--preset--color--green);
}

/* Pijl rechts */
.is-referentie-big-arrow-wrapper {
    height: 85%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.is-referentie-big-arrow svg {
    height: 100%;
    width: 100%;
}

.is-referentie-card-wrapper .wp-block-columns {
    height: 100%;
}

.is-referentie-big-arrow:before {
    content: "Bekijk project";
    position: absolute;
    top: calc(50% + 2px);
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
    line-height: 1;
}
.is-referentie-big-arrow {
    position: relative;
}

/* Kaart wrapper */
.is-referentie-card-wrapper {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--wp--preset--color--green);
}

/* -----------------------------
   Kaarten
------------------------------ */

/* Top card blijft in de flow → bepaalt hoogte */
.is-referenties-top-card {
    position: relative;
    z-index: 2;
    opacity: 1;
    transition: opacity 0.4s ease;
}

/* Bottom card absoluut boven top card */
.is-referenties-bottom-card {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
    overflow: hidden;
    opacity: 0;
    transform: translateY(20px);
    z-index: 3;
    transition: opacity 0.4s ease, transform 0.4s ease;
}


/* Hover effect: top card verdwijnt */
.is-referentie-card-wrapper:hover .is-referenties-top-card {
    opacity: 0;
}

/* Hover effect: bottom card verschijnt */
.is-referentie-card-wrapper:hover .is-referenties-bottom-card {
    opacity: 1;
    transform: translateY(0);
}

/* -----------------------------
   Overlay
------------------------------ */
/* Overlay standaard onzichtbaar */
.is-referentie-card-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.75);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 4;
}

/* Zodra er binnen de UL een li wordt gehoverd → dim alle kaarten */
.wp-block-post-template:has(.wp-block-post:hover) .is-referentie-card-wrapper::before {
    opacity: 1;
}

.wp-block-post-template:has(.wp-block-post:hover) .is-referentie-card-wrapper {
    border-color: rgba(40, 57, 54, 0.25) !important;
}

/* Maar de gehoverde kaart zelf blijft helder */
.wp-block-post-template .wp-block-post:hover .is-referentie-card-wrapper::before {
    opacity: 0;
}

.wp-block-post-template .wp-block-post:hover .is-referentie-card-wrapper {
    border-color: var(--wp--preset--color--green) !important;
}


.is-referentie-card-wrapper a {
    z-index: 6 !important;
}

.is-referenties-bottom-left {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    height: 100%;
}

.is-referentie-archive {
	position: relative;
}

.is-referentie-archive--raster {
	position: absolute;
	left: -120px;
    top: -130px;
	z-index: -1;
	max-width: 100%;
}

.is-referentie-archive:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    background: var(--wp--preset--color--beige);
	z-index: -1;
}



/*EEN ANDERE KIJK*/

.is-artikelen-categories {
    list-style: none;
    display: flex;
    gap: 1rem;
    padding-inline-start: 0;
}

.is-artikelen-categories > * a {
    text-decoration: none;
    color: var(--wp--preset--color--gray);
}

.is-artikelen-categories .current-cat a {
    color: var(--wp--preset--color--green);
}

/*CONTACT PAGE*/

.is-contact-page:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    background: #F7F3E8;
}

.is-contact-page img {
    position: relative;
}

.is-hubert img, .is-hugo img {
	    object-position: 100% 0%;
}

.is-pattern-grid-images-text .hero-lines-wrapper-ti {
	position: static;
}

.is-pattern-grid-images-text .com--hero__grid-box-ti {
    position: static !important;
}

.is-pattern-grid-images-text .grid-wrapper {
	gap: 60px;
	display: flex;
	justify-content: center;
    align-items: center;
	padding: 180px;
}

.grid-image-top {
	position: absolute;
    top: 0;
    left: 0;
    width: 600px;
    height: 420px;
    overflow: hidden;
    z-index: 2;
}

.grid-image-bottom {
	position: absolute;
	bottom: 120px;
	right: 61px;
	width: 420px;
	height: 240px;
    margin-left: auto !important;
}

.grid-image-top img, .grid-image-bottom img {
	object-fit: cover !important;
	height: 100%;
}

/* Pattern quote center */

.is-pattern-quote-center {
	position: relative;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: center;
}


/* Chat sliderr */

.is-pattern-chat-slider {
	overflow-x: clip;
}

.is-chat-left-col {
    transform: translateX(33%);
}

#is-chat-slider {
	overflow: visible;
}

.is-pattern-chat-slider .wp-swiper-wrapper .wp-block-blocknroll-swiper-slide {
    opacity: 0.3;
    transition: opacity 0.3s ease;
}

.is-pattern-chat-slider .wp-swiper-wrapper .wp-block-blocknroll-swiper-slide.swiper-slide-active {
    opacity: 1;
}



/* Chatten block */

.is-chat-block {
	position: relative;
}

.is-chat-block .chat-font-small {
	font-size: 14px !important;
}

.is-chat-block .is-chat-image {
	position: absolute;
    top: -50px;
    right: 2rem;
}

.is-image-full-height {
	height: 100%;
}

.is-image-full-height img {
	object-fit: cover;
	height: 100%;
}

/* Full width image slider */

#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-prev {
    position: absolute;
    top: 50%;
    left: -5rem;
    transform: translateY(-50%);
	height: 4rem;
    color: var(--testimonial-color);
}

#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-next {
    position: absolute;
    top: 50%;
    right: -5rem;
    transform: translateY(-50%);
	height: 4rem;
    color: var(--testimonial-color);
}

#is-swiper-fullwidth-image .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
    position: absolute;
    left: 0;
    bottom: -3rem;
}

#is-swiper-fullwidth-image span.swiper-pagination-bullet {
    background: transparent !important;
    border: 1px solid #283A36;
	opacity: 1 !important;
}

#is-swiper-fullwidth-image span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--wp--preset--color--salmon) !important;
}


/* Downloads */

.is-pattern-downloads {
	position: relative;
}

.list-download {
	list-style: lower-roman;
}

.is-download-image {
	position: absolute;
	aspect-ratio: 1;
	z-index: -1;
	
}

.is-download-image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.is-download-image-1 {
	top: -10rem;
	left: 0;
	opacity: 0.5;
}

.page-id-1448 main:before {
    content: "";
    background: #F7F3E8;
    width: 60px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
	z-index: -1;
}

.is-download-grid .hero-lines-wrapper-ti {
    position: absolute;
    z-index: 0;
    bottom: -120px;
    left: -120px;
    width: 100%;
    aspect-ratio: 1;
    display: flex;
    justify-content: space-between;
    gap: 0 !important;
}

.is-download-grid .com--hero__grid-box-ti {
    position: static;
    width: 100%;
    max-width: 360px;
    aspect-ratio: 1;
    bottom: unset !important;
    right: unset !important;
    z-index: 0;
	margin: 0 !important
}

.is-download-grid .is-50-grid-img-txt-img {
	right: 0 !important;
	bottom: 0 !important;
}


/*-------------------------- Dit is maasdam --------------------------*/

.is-pattern-hero-dit-is {
	min-height: 80vh;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.hero-dit-is--wrapper {
	position: relative;
}

.hero-dit-is--wrapper h1 {
	z-index: 2;
	position: relative;
}

.hero-dit-is--arrow {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

.is-green-block-centered {
	position: relative;
	max-width: 60%;
    margin-top: 0;
    transform: translateY(calc(var(--wp--preset--spacing--l) * -1));
	z-index: 2;
}

.is-green-block-centered:before {
	content: "";
	position: absolute;
	top: calc(100% - 60px);
	right: -240px;
	background-image: url(https://maasdam.digiwedo.dev/wp-content/uploads/2025/08/Raster-zalm.svg);
	background-size: contain;
	background-repeat: no-repeat;
	width: 480px;
	height: 480px;
}

.is-purple-block-centered {
	position: relative;
	max-width: 75%;
    margin-top: -60px !important;
	z-index: 2;
	padding-bottom: calc(var(--wp--preset--spacing--l) * 3) !important;
}

.is-purple-block-centered:before {
    content: "";
    width: 300px;
    height: 360px;
    position: absolute;
    top: -120px;
    right: 60px;
    background-color: #FFEFCA;
    mask-image: url(/wp-content/uploads/2025/11/Maasdam-arrow_Medium.svg);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
    -webkit-mask-image: url(/wp-content/uploads/2025/11/Maasdam-arrow_Medium.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
}

.is-pattern-maas-beige {
	position: relative;
	padding-top: calc(2 * var(--wp--preset--spacing--4-xl)) !important;
	padding-bottom: calc(60px + var(--wp--preset--spacing--l)) !important;
	margin-top: calc(var(--wp--preset--spacing--l) * -2.5) !important;
}

.is-pattern-maas-beige:after {
	content: "";
	background: var(--wp--preset--color--beige);
	position: absolute;
	top: 0;
	right: -100%;
	width: 100%;
	height: 100%;
}

.dit-is-fw-image-spacing-right {
	margin-top: -60px !important;
	margin-right: 36px !important;
}

.dit-is-maasdam-cover-image {
	position: relative;
	min-height: 900px;
}

.dit-is-maasdam-cover-image:before {
	content: "";
	width: 60px;
	height: calc(100% + 60px);
	background: var(--wp--preset--color--yellow);
	position: absolute;
	left: -60px;
	top: -60px;
}


.dit-is-maasdam-cover-image:after {
	content: "";
	width: calc(60% + 60px);
	height: 60px;
	background: var(--wp--preset--color--yellow);
	position: absolute;
	left: 0;
	top: -60px;
	z-index: 3;
}

.dit-is-maasdam-cover-image-left {
	position: relative;
	min-height: 900px;
	display: flex;
	margin-top: 120px !important;
	margin-bottom: 60px !important;
}

.dit-is-maasdam-cover-image-left:before {
    content: "";
    position: absolute;
    top: -180px;
    right: 0;
    width: 720px;
    height: 180px;
    background: var(--wp--preset--color--beige);
}

.dit-is-maasdam-cover-image-left:after {
    content: "";
    position: absolute;
    top: -180px;
    right: 300px;
    width: 480px;
    height: 180px;
    background-image: url(/wp-content/uploads/2025/08/Raster-zalm.svg);
    background-size: cover;
}


/* Waar we vandaan komen */

.is-purple-block-centered--vandaan {
	position: relative;
	max-width: 60%;
    margin-top: -120px !important;
	z-index: 2;
	margin-bottom: calc(240px - var(--purple-block-height)) !important;
}

.is-purple-block-centered--vandaan:before {
	content: "";
    position: absolute;
    top: calc(100% - 60px);
    left: -240px;
    width: 480px;
    height: 480px;
    background-image: url(/wp-content/uploads/2025/08/Raster-grijs.svg);
    background-size: cover;
}

.is-pattern-beige-vandaan {
	position: relative;
/* 	padding-top: calc(2.5 * var(--wp--preset--spacing--4-xl)) !important; */
	padding-top: calc(var(--purple-block-height) - 120px) !important;
	padding-bottom: calc(60px + var(--wp--preset--spacing--4-xl)) !important;
}

.is-pattern-beige-vandaan:before {
	content: "";
	background: var(--wp--preset--color--off-white);
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
}

.vandaan-cover-image-left {
	position: relative;
	min-height: 900px;
	display: flex;
	margin-top: -60px !important;
	margin-bottom: 0 !important;
	padding-bottom: calc(120px + var(--wp--preset--spacing--l)) !important;
}

.pattern-vandaan-yellow {
	position: relative;
	margin-top: -60px !important;
	padding-top: calc(60px + var(--wp--preset--spacing--l)) !important;
	padding-bottom: calc(60px + var(--wp--preset--spacing--l)) !important;
}

.pattern-vandaan-yellow:before {
	content: "";
    position: absolute;
    top: -60px;
    right: -60px;
    width: 480px;
    height: 480px;
    background-image: url(/wp-content/uploads/2025/08/Raster-grijs.svg);
    background-size: cover;
}

.vandaan-cover-image {
	position: relative;
	min-height: 900px;
	margin-bottom: 60px !important;
}

.vandaan-cover-image:before {
	content: "";
	width: 60px;
	height: 100%;
	background: var(--wp--preset--color--light-green);
	position: absolute;
	left: -60px;
	top: -60px;
}

.vandaan-cover-image:after {
	content: "";
	width: 50%;
	height: 60px;
	background: var(--wp--preset--color--light-green);
	position: absolute;
	left: 0;
	top: -60px;
	z-index: 3;
}

/* 	Waar we staan */

.is-yellow-block-centered--staan {
	position: relative;
	max-width: 60%;
    margin-top: -120px !important;
	z-index: 2;
}

.is-yellow-block-centered--staan:before {
	content: "";
    position: absolute;
    left: -480px;
    top: calc(100% - 120px);
    width: 480px;
    height: 480px;
    background-image: url(/wp-content/uploads/2025/08/Raster-grijs.svg);
    background-size: cover;
	z-index: 2;
}

.pattern-staan-green {
	position: relative;
	margin-top: -60px !important;
	padding-top: calc(60px + var(--wp--preset--spacing--l)) !important;
	padding-bottom: calc(60px + var(--wp--preset--spacing--l)) !important;
}

.pattern-staan-green:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	left: -100%;
	top: 0;
	background: var(--wp--preset--color--light-green);
}

.is-green-block-centered--staan {
	position: relative;
	margin-top: -60px !important;
}

.is-green-block-centered--staan:before {
	content: "";
	width: 60px;
	height: calc(100% - 60px);
	position: absolute;
	left: -60px;
	top: 60px;
	background: var(--wp--preset--color--purple);
}

.is-green-block-centered--staan:after {
	content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 480px;
    height: 180px;
    background-image: url(/wp-content/uploads/2025/08/Raster-beige.svg);
    background-size: cover;
}

.staan-cover-image {
	position: relative;
	min-height: 900px;
	display: flex;
	align-items: center;
    align-content: center;

}

.staan-small-salmon {
	position: relative;
	margin-bottom: 60px !important;
}

.staan-small-salmon--box {
	position: relative;
	margin-top: -120px !important;
}

.staan-small-salmon--box:before {
	content: "";
    position: absolute;
    left: -300px;
    top: calc(100% - 180px);
    width: 480px;
    height: 240px;
    background-image: url(/wp-content/uploads/2025/08/Raster-beige.svg);
    background-size: cover;
}


/* Arrows */

.is-pattern-navigatie {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	width: 100%;
	z-index: 999;
	pointer-events: none;
}

.is-pattern-navigatie .navigatie-wrapper-prev,
.is-pattern-navigatie .navigatie-wrapper-next {
    pointer-events: auto;
}

.is-pattern-navigatie .wp-block-group__link {
    position: absolute; 
    inset: 0;
    z-index: 5;
}

.is-pattern-navigatie img {
	transition: .3s ease;
}

.is-pattern-navigatie .navigatie-wrapper-prev:hover img,
.is-pattern-navigatie .navigatie-wrapper-next:hover img {
    scale: 1.1;
}

.is-pattern-navigatie.nav-on-green .navigatie-wrapper-prev p,
.is-pattern-navigatie.nav-on-green .navigatie-wrapper-next p {
    color: #ffffff; 
}

.is-pattern-navigatie.nav-on-green img {
    filter: brightness(0) invert(1);
}


/* Responsive dit is maasdam - waar we vandaan komen - waar we staan */

@media (min-width: 769px) {
	/* 	Dit is maasdam */
	.dit-is-maasdam-cover-image-left {
		margin-left: 96px !important;	
	}
	.dit-is-maasdam-cover-image {
		margin-right: 36px !important;
		margin-left: 36px !important;
	}
	/* 	Waar we vandaan komen */
	.is-pattern-beige-vandaan {
		margin-right: 96px !important;
	}
	.vandaan-cover-image-left {
		margin-left: 36px !important;
	}
	.pattern-vandaan-yellow--col-right {
	margin-top: calc(var(--wp--preset--spacing--ms) + (var(--wp--preset--font-size--heading-2) * 2)) !important;
}
	.vandaan-cover-image {
		margin-right: 36px !important;
		margin-left: 36px !important;
	}
/* 	Waar we staan */
	.staan-full-width-img {
	margin-left: 36px !important;
}
	.staan-cover-image {
		margin-left: 36px !important;
		margin-right: 36px !important;
	}
	.staan-small-salmon {
		margin-right: 156px !important;
		padding-right: 0 !important;
	}
	.pattern-staan-green {
		margin-right: 96px !important;
	}
}

@media (max-width: 768px) {
	/* 	Dit is maasdam */
	.is-purple-block-centered:before {
    width: 120px;
    height: 240px;
    top: -120px;
    right: 0;
}
	.dit-is-maasdam-cover-image-left, .dit-is-maasdam-cover-image {
		min-height: 60vh;
	}
	.dit-is-maasdam-cover-image {
		padding-bottom: calc(180px + var(--wp--preset--spacing--l)) !important;
	}
	/* 	Waar we vandaan komen */
	.vandaan-cover-image-left, .vandaan-cover-image, .staan-cover-image {
		min-height: 60vh;
	}
	.is-purple-block-centered--vandaan {
		max-width: 80%;
	}
	.is-pattern-beige-vandaan {
		padding-top: calc(var(--purple-block-height) - 180px) !important;
	}
	/* 	Waar we staan */
	.staan-small-salmon--box {
		margin-top: -60px !important;
}
/* 	arrows */
	.is-pattern-navigatie p {
		font-size: 0.675rem;
	}
	.is-pattern-navigatie .navigatie-wrapper-prev {
    padding-left: 0.5rem;
}
	
	.is-pattern-navigatie .navigatie-wrapper-next {
		padding-right: 0.5rem;
	}
}

@media (max-width: 425px) {
/* 	Dit is maasdam */
	.is-green-block-centered {
		max-width: 80%;
	}
	.is-pattern-maas-beige {
		padding-left: var(--wp--preset--spacing--l) !important;
		padding-right: var(--wp--preset--spacing--l) !important;
	}
	.is-purple-block-centered {
		max-width: 90%;
	}
/* 	Waar we vandaan komen */
	.pattern-vandaan-yellow:before {
		display: none;
	}
	/* 	Waar we staan */
	.is-yellow-block-centered--staan {
		max-width: 80%;
	}
}



/* ------------------------------------ Responsive ------------------------------------ */

@media (min-width: 1920px) {
	 p.wp-block-paragraph.is-hover-text.has-green-color.has-text-color.has-link-color.has-font-l-font-size.wp-elements-48df396494713caa85a8f8ae5e48e24f {
		width: 66%;
		max-width: 66% !important;
	}
}

@media (min-width: 1800px) {
	.hero-2-inner {
		padding-left: 120px;
	}
}

@media (min-width: 769px) and (max-width: 1800px) {

  .entry-content > * {
    padding-inline: 60px;
    box-sizing: border-box;
  }

  .entry-content > :is(.alignfull, .wp-block-cover, .has-background, [style*="background"], [style*="background-image"]) {
    padding-inline: 0;
  }

  .entry-content > #is-testimonial-swiper, #is-testimonial-swiper, .is-pattern-computer-intro {
    padding-inline: 0 !important;
  }
	footer.wp-block-template-part > div, .is-hero-home > div, .wp-site-blocks header.wp-block-template-part > div, .entry-content .is-hero-home > div, .hero-2-inner, .is-hero-3-bottom-left, .hero-3-content-right, #onze-vloeren, .is-pattern-chat-slider, .is-pattern-3-column-text-image, .is-60-40-img-txt {
		padding-left: 60px !important;
   		padding-right: 60px !important;
		padding-inline: 60px !important;
}
	 .is-pattern-50-grid-img-text-wrapper, .is-referentie-archive, .is-contact-page, .is-pattern-hover-text, .is-pattern-diensten.diensten-container, .is-pattern-referenties-hero-top, .is-pattern-referenties-hero-bottom {
   		 padding-inline: 120px !important;
}
	.is-pattern-maas-beige {
		margin-left: 96px !important;	
	}
	
	.dit-is-fw-image-spacing-right {
		margin-right: 36px !important;
	}
	
	.pattern-vandaan-yellow, .is-green-block-centered--staan {
		margin-left: 96px !important;
		margin-right: 96px !important;
	}
	
	.is-green-block-centered--staan {
		margin-left: 156px !important;
		margin-right: 96px !important;
	}
	
	
	
	.hero-2-text-button-wrapper, .hero-2-inner, .hero-3-inner {
   		 padding-inline: 180px !important;
}
	.is-updates {
		padding-left: 36px !important;
   		padding-right: 36px !important;
		padding-inline: 36px !important;
	}
	#is-updates .swiper-navigation {
		right: 36px;
	}
	#is-updates .swiper-pagination {
		right: 84px;
	}
	.is-pattern-referenties-hero-top, .is-pattern-referenties-hero-bottom {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.is-pattern-quote-center {
		padding-inline: 240px !important;
	}
	.is-wide-space {
		padding-inline: 216px;
	}
	#is-swiper-fullwidth-image .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal {
    left: 60px;
}
	#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-prev {
		left: 0;
	}
	#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-next {
		right: 0;
	}
	.hero-2-inner:before, .hero-2-bottom-inner:before {
    left: calc(-100vw - -120px);
}
	.hero-2-bottom-left .hero-lines-wrapper {
		left: 240px !important;
	}
	
	.hero-3-lines-wrapper {
		    right: calc(100% - 134px) !important;
	}
	.is-hero-3-bottom-left {
		flex-basis: 34%;
		padding-right: 0 !important;
	}
	.hero-2-bottom-left {
		flex-basis: 66% !important;
	}
}

@media (min-width: 1681px) and (max-width: 1800px) {
	.is-hero-home > div {
		margin: 0 !important;
	}
}
	
	@media (min-width: 1024px) and (max-width: 1440px) {
		.is-pattern-hover-text {
			padding-inline: 240px !important;
		}
	}




@media (max-width: 1660px) {
/* 	.is-header-home-logo {
    left: 50%;
    transform: translate(-50%, -50%);
} */
	header.wp-block-template-part > div {
		padding-left: 1.5rem !important;
	padding-right: 1.5rem !important;
	}
	/* 	Hero home */
	.is-hero-home > div {
	padding-left: 1.5rem !important;
	padding-right: 1.5rem !important;
}
}

@media (max-width: 1400px) {
	.is-pattern-grid-images-text .hero-lines-wrapper-ti {
	position: static;
}

.is-pattern-grid-images-text .com--hero__grid-box-ti {
    position: absolute !important;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
}

.is-pattern-grid-images-text .grid-wrapper {
	gap: 60px;
	min-height: 650px;
	padding: 0;
}

.grid-image-top {
	width: 60%;
	top: 0;
	max-height: 300px;
	overflow: hidden;
    margin-left: 0 !important;
    margin-right: auto !important;
    z-index: 2;
    position: relative;
}

.grid-image-bottom {
	bottom: 0;
	width: 50%;
    position: relative;
    margin-left: auto !important;
}

}

@media (max-width: 1280px) {

/* 	Chat slider */
	.slider-chat-box p {
		font-size: 1.125rem !important;
	}
	.is-chat-left-col .wp-container-content-231d8afb {
    flex-basis: 300px;
}
/* 	Slider careers */
    .is-team-card-content p {
		font-size: 1.25rem;
	}
	.is-team-card-content p::before {
		font-size: 6rem;
		top: -2.9rem;
	}
	.is-careers-left {
		min-height: auto !important;
	}
	/* 	Updates slider */
	.is-updates-col-left {
		grid-column: span 12;
	}
	.is-update-img {
    	grid-column-start: 1;
		grid-column-end: -1;
	}
	#is-updates .swiper-navigation {
    position: absolute;
    right: 0;
    top: -4rem;
    width: 175px;
    display: flex;
    justify-content: space-between;
	}
	#is-updates .swiper-pagination {
		position: absolute;
		right: 0;
		top: calc(-4rem + 24px);
		width: 175px;
		transform: translateY(-50%);
	}
	.is-updates .wp-container-content-cec57fe4, .is-updates-purple .wp-container-content-cec57fe4 {
		grid-column: span 12;
	}
/* 	Header */
	.wp-block-blocknroll-mobile-menu .mobile-menu-container {
        position: fixed;
        inset: 0;
        z-index: 50;
        width: 100%;
        right: 0;
        left: auto;
        box-sizing: border-box;
        opacity: 0;
        visibility: hidden;
        transform: translateX(-100%);
        transition: .3s;
    }
    .mobile-menu-container > div {
        padding: 1.5rem !important;
    }

    .wp-block-blocknroll-mobile-menu[aria-expanded="true"] .mobile-menu-container {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
    }

    .wp-block-blocknroll-mobile-menu[aria-expanded="false"] .mobile-menu-container {
        opacity: 0;
        visibility: hidden;
        transform: translateX(-100%);
    }

    .wp-block-blocknroll-mobile-menu[aria-expanded=false] .mobile-menu-container {
        display: block !important;
    }
    header.header-scrolled
    .wp-block-navigation__container
    .wp-block-navigation-item__content,
    header.header-scrolled
    .wp-block-navigation__responsive-container-open {
        color: var(--wp--preset--color--white);
    }
    .wp-block-blocknroll-mobile-menu .mobile-menu-container>.wp-block-group {
        height: 100%;
        min-height: 100vh;
    }
	.is-pattern-header {
    padding: 1.5rem !important;
}
	.header-mobile {
		width: 100%;
    display: flex;
    justify-content: space-between;
	}
	.header-topbar {
		width: 100%;
	}
	.header-topbar-right {
		width: 100%;
    	display: flex;
    	justify-content: space-between;
	}
	.wp-block-blocknroll-mobile-menu .mobile-menu-open {
    padding: 0.5rem;
    border-radius: 999px;
    background: var(--wp--preset--color--yellow);
}
	.wp-block-blocknroll-mobile-menu .mobile-menu-close svg {
    max-width: 2rem !important;
    max-height: 2rem !important;
}
	.wp-block-group.has-green-background-color.has-background.has-global-padding.is-layout-constrained.wp-container-core-group-is-layout-b1422cec.wp-block-group-is-layout-constrained {
    padding: 1.5rem !important;
}
	/* Beginstate van elk menu-item: onzichtbaar, subtiel naar beneden */
.wp-block-blocknroll-mobile-menu .wp-block-navigation__container > li.menu-anim-ready {
  opacity: 0;
  transform: translateY(8px);
}

/* Fade-in state (wordt per item na een delay toegevoegd) */
.wp-block-blocknroll-mobile-menu .wp-block-navigation__container > li.fade-in {
  transition: opacity 280ms ease, transform 280ms ease;
  opacity: 1;
  transform: translateY(0);
}

/* (optioneel) klein extraatje: link zelf iets later tonen */
.wp-block-blocknroll-mobile-menu .wp-block-navigation__container > li.fade-in a {
  transition: opacity 240ms ease;
  opacity: 1;
}
/* 	Footer */
	
	
	/*EEN ANDERE KIJK*/

.is-artikelen-categories {
    list-style: none;
    display: flex;
	    flex-direction: column;
    gap: 1rem;
    padding-inline-start: 0;
}
		/* Full width image slider */

#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-prev {
    left: 0;
}

#is-swiper-fullwidth-image .swiper-navigation-button.swiper-button-next {
    right: 0;
}
	.is-mobile-flex-column {
		display: flex;
		flex-direction: column;
	}
}


@media (max-width: 1024px) {
    .is-referenties-bottom-left p {
        font-size: 0.8rem;
    }
/* 	hero yellow block computervloeren */
	.is-computer-yellow-block {
    display: flex;
    flex-direction: column;
    padding: 0 60px;
}
	.is-computer-yellow-block .is-hero-3-bottom-left {
		padding-top: 0 !important;
		transform: translateY(0) !important;
	}
	.image-margin-right {
		margin-right: 0 !important;
	}
}

@media (max-width: 992px) {
	 

}

@media (max-width: 768px) {
	/* 	Algemeen */
	.is-mobile-hidden {
		display: none;
	}
	.w-50, .w-75 {
	width: 100%;
}
	.is-font-small-mob {
		font-size: 2.5rem !important;
	}
	.wp-container-content-3b548ff9 {
    grid-column: span 12 !important;
    grid-row: span 1;
}
	.is-referentie-title-wrapper {
	flex-wrap: wrap;
}

.is-referentie-title-wrapper > div {
	display: flex;
	gap: 5px;
}
	
	.hero-logo {
		display: none;
	}
	#is-testimonial-swiper .swiper-pagination {
		left: 1.5rem;
	}
/* 	Footer */
	.wp-container-core-group-is-layout-d3d6d894 {
		justify-content: flex-start;
		gap: 2rem;
	}
	.footer-bottom-bar {
		display: flex;
		flex-direction: column;
	}
	.footer-bottom-bar * {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}
	.wp-container-core-group-is-layout-fd226b5e {
		justify-content: flex-start;
	}
/* 	Home team slider */
	.is-teams-grid {
		gap: 1rem !important;
	}
	
	
/* 	Chat slider */
	.is-chat-left-col {
    transform: translateX(2rem);
}
	.is-chat-left-col .wp-container-content-231d8afb {
    flex-basis: 300px;
}
	.slider-chat-box p {
        font-size: 0.75rem !important;
    }
/* 	Hero home */
	.hero-home {
		align-items: flex-end;
	}
	.is-hero-home-left {
    	justify-content: flex-end;
}
/* 	Hero 2 */
	.hero-2-inner {
		padding-bottom: 0 !important;
	}
	.hero-2-inner:before {
		left: -100vw;
	}
	.hero-2-inner h1 {
		margin-left: 1rem !important;
	}
	.hero-2-arrow img {
		width: 6rem;
	}
	.hero-bottom-2-left {
		margin-left: -1.5rem !important;
		z-index: 2;
		max-width: 90%;
	}
/* 	Hover text pattern */
	.is-pattern-hover-text:before {
    width: 100%;
    height: 2.5rem;
}
	.wrapper-hover img {
	  width: 200px !important;
	  max-width: 200px !important;
	  height: auto !important;
}
/* 	Diensten */
	.is-pattern-diensten:before {
		width: 100%;
		height: var(--wp--preset--spacing--l);
		top: calc(-1 * var(--wp--preset--spacing--l));
	}
	.is-pattern-diensten {
		margin-top: var(--wp--preset--spacing--l) !important;
	}
	.is-diensten-wrapper h2 {
		font-size: 1.5rem;
	}
	.is-img-arrow-wrapper {
		width: auto;
		height: auto;
	}
	.is-diensten-wrapper:hover .is-img-arrow-wrapper {
		width: auto !important;
		height: auto !important;
	}
	.is-img-arrow-wrapper--arrow {
		width: 3.5rem;
		position: static;
	}
	.is-img-arrow-wrapper--arrow > div.icon-container {
		width: auto !important;
	}
	.diensten-mobile-wrapper {
    	position: relative;
    	overflow: hidden;
		width: 100%;
       	height: auto;
		aspect-ratio: 1/1;
  }

  .diensten-mobile-wrapper--image {
   		position: absolute;
   		top: 0; 
		left: 0;
    	width: 100%; 
		height: 100%;
    	display: none;
    	transition: opacity .3s ease;
  }
	.diensten-mobile-wrapper--image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

  .diensten-mobile-wrapper--image-1 {
    	display: block;
  }

  .diensten-mobile-wrapper--image.active {
   		display: block;
  }

  .is-diensten-wrapper {
    	opacity: 0.7;
    	transition: opacity .3s ease;
    	cursor: pointer;
  }
  .is-diensten-wrapper.active {
    	opacity: 1;
  }
/* 	is pattern scroll */
	.is-scroll-arrow-down {
    position: absolute;
    left: 50%;
    bottom: 20rem;
    transform: translateX(-50%);
	 height: 400px;
}
/* 	Pattern slider testimonial */
	#is-testimonial-swiper figure {
		height: 100vh !important;
	}
	#is-testimonial-swiper img {
		height: 100%;
		object-fit: cover;
	}
	#is-testimonial-swiper .is-testimonial-content-inner {
		width: calc(100% - 3rem);
        margin-left: 0 !important;
	}
	#is-testimonial-swiper .is-testimonial-content {
		display: flex;
    	justify-content: space-between;
    	flex-direction: column;
    	align-items: flex-start;
		padding: 1.5rem;
	}
	#is-testimonial-swiper .wp-block-read-more {
		position: absolute;
        bottom: -2rem;
	}
	#is-testimonial-swiper .swiper-button-next, #is-testimonial-swiper .swiper-button-prev {
		bottom: 50%;
		height: 2.5rem;
		width: 1rem;
	}
	#is-testimonial-swiper .swiper-button-next {
		right: 0.25rem;
	}
	
	#is-testimonial-swiper .swiper-button-prev {
		left: 0.25rem;
	}
	#is-testimonial-swiper li {
/* 		margin-right: 0 !important; */
	}
	
	
/* 	Slider careers */
	.is-careers-left {
		grid-column: span 10;
		min-height: auto !important;
	}
	#is-team-swiper .swiper-navigation {
    	left: 0;
		top: 4rem;
}
	.is-careers-right {
    	grid-column: span 10;
}
	.is-pattern-team-swiper {
		overflow-x: hidden;
	}
	.is-pattern-team-swiper .is-grid {
		position: absolute;
        right: -12rem;
        top: 3rem;
        z-index: 0;
        width: 400px;
        height: 400px;
}
	.is-careers-right .is-team-title {
    	padding-bottom: 6rem;
	}
	.is-team-card-content p {
		font-size: 2rem;
	}
	.is-team-card-content p::before {
		font-size: 6rem;
		top: -3.7rem;
	}
	
	
/* 	Hero 2 (en deel 3) */
	.hero-2-inner:before, .hero-2-bottom-inner:before, .hero-3-inner:before, .hero-3-bottom-inner:before, .is-xtra-before:after {
		display: none;
	}
	
	.hero-2-image {
    	width: calc(100% - 5rem);
	}
	.is-computer-yellow-block .hero-2-image {
    	width: 100%;
		margin-right: 0 !important;
	}
	
	.is-pattern-hero-3 {
		overflow-x: clip;
	}
	
	.is-pattern-hero-2 .hero-lines-wrapper {
		z-index: -1;
        bottom: -214px;
        top: inherit;
        right: -6rem !important;
        width: 320px;
        left: inherit;
		opacity: 0.5;
	}
	.hero-2-arrow {
		position: absolute;
		right: 1rem;
		top: -3rem;
		width: 5rem;
	}
	.hero-2-content-wrapper {
		max-width: 100%;
		z-index: 2;
	}
	.hero-2-text-button-wrapper {
		padding: 0 !important;
	}
/* 	50 grid image text wrapper */
	.is-pattern-50-grid-img-text {
    display: flex;
    flex-direction: column;
	}
	.is-pattern-50-grid-img-text > * {
    width: 100%;
	}
	.is-pattern-50-grid-img-text-wrapper:before {
		width: 2.5rem;
		z-index: 2;
	}
	.com--hero__grid-box-ti {
    position: relative;
    width: 100%;
    max-width: 320px;
    margin: 0 !important;
    aspect-ratio: 1;
    top: -3rem;
	bottom: inherit;
	right: inherit;
    left: -75px;
    z-index: 0;
    opacity: 0.5;
    z-index: 0;
	}
	.is-50-grid-img-txt-img {
    position: absolute;
    left: 2rem;
    top: -24px;
	}
	.hero-lines-wrapper-ti {
		bottom: inherit;
		left: inherit;
	}
	.is-pattern-50-grid-img-text .image-grid-green-bg .is-50-grid-img-txt-img {
		transform: translateY(0);
		position: static;
	}
/* 	Updates slider Pagina totaalinrichting */
	.wp-container-content-cec57fe4 {
    grid-column: span 12;
	}
/* 	Contact form onderin */
	.contact-inner-2 {
    display: flex;
    flex-direction: column;
	}
	.is-contact-inner-wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.is-contact-right {
		padding: 0 !important;
		border-left: 0;
	}
	.gform_wrapper {
		width: 100%;
	}
	form#gform_1 {
    width: 100%;
	}
	.is-contact-wrapper-left--info {
    	border-top-width: 0 !important;
	}
/* 	Contact page */
	.is-contact-page * {
    z-index: 2;
}
	textarea#input_2_5 {
    background: transparent;
}
	.is-contact-column {
		padding: 0 1.5rem;
	}
/* 	Hero 3 */
	.is-pattern-hero-3 {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.hero-computer-image {
		margin-right: -1.5rem !important;
	}
	.is-hero-3-bottom-left {
    	padding: 0 !important;
		transform: translateY(0);
}
	.hero-3-content-right {
    padding: 0 1.5rem;
}
/* 	Knauf blauw pattern */
	.is-knauf-50-right {
		gap: 1rem;
	}
/* 	Knauf USP pattern */
	.is-knauf-usp-col-wrapper {
		margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
		margin-right: calc(var(--wp--style--root--padding-left) * -1) !important;
	}
	.is-knauf-usp-col-wrapper div {
		border-right-width: 0 !important;
	}
	.is-pattern-knauf-faq {
		gap: 0;
		margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
		margin-right: calc(var(--wp--style--root--padding-left) * -1) !important;
	}
	.is-knauf-usp-col-wrapper:first-child {
    padding-bottom: 0 !important;
}
/* 	image text wrapper groen */
	.is-pattern-50-grid-img-text-wrapper--green .com--hero__grid-box-ti {
		display: none;
	}
	.is-50-grid-img-txt-green {
		height: 320px;
		position: static;
		margin-bottom: 4rem !important;
		padding-left: 1.5rem;
	}
/* 	Referenties filter */
	.is-referentie-categories {
		flex-direction: column;
	}
	.is-row-referentie {
		display: flex;
		flex-direction: row;
    	align-items: flex-start;
	}
	.query-filter-links {
    display: flex;
    flex-direction: column;
	}
/* 	3 paarse uitschuif blokken */
	.my-special-swiper {
    display: flex;
    flex-direction: column;
    gap: 6rem;
}
	
/* 	Nieuw blok 2 images raster */
	.is-pattern-grid-images-text .grid-wrapper {
		min-height: auto;
	}
	.grid-image-top {
		height: auto;
	}
	.grid-image-bottom {
		height: auto;
		right: 0;
	}
	.is-vloeren-swiper-content.open {
		overflow-y: scroll;
	}
/* 	single referenties */
	.is-pattern-text-centered-arrow {
		padding-left: 0;
		padding-right: 0;
	}
}



@media (max-width: 560px) {
	/* 	50 grid image text wrapper */
	.is-60-40-img-txt-right {
    	margin-top: -6rem !important;
}
	/* 	Nieuw blok 2 images raster */
	.grid-image-top {
		height: auto;
		width: 80%;
	}
	.grid-image-bottom {
		height: auto;
		width: 65%;
	}
}

@media (max-width: 445px) {
	/* 	50 grid image text wrapper */
	.is-60-40-img-txt-right {
    	margin-top: -9rem !important;
	}
}

/* Jos 2025-09-01 */

.mix-blend-multiply	{
	mix-blend-mode: multiply;
}

.is-lottie-wrapper {
	position: absolute;
	left: 0;
	bottom: 0;
	right: -80%;
	top: -50%;
}