@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
  --ft-family-regular: "Open Sans", sans-serif;;
  --ft-family-header: "Montserrat", sans-serif;;
  
  --fs-900: 3rem;
  --fs-800: 2.5rem;
  --fs-700: 2rem;
  --fs-400: 1rem;

  --fw-default: 300;
  --fw-sm-bold: 400;
  --fw-md-bold: 500;
  --fw-xl-bold: 600;
  --fw-xxl-bold: 700;

  --size-400: 1.5rem;
  --size-500: 3rem;
  --size-600: 6rem;

  --clr-neutral-900: hsl(0, 9%, 11%);
  --clr-neutral-200: hsl(36, 24%, 96%);
  --clr-neutral-100: hsl(0, 0%, 100%);

  --clr-primary-200: hsl(213, 43%, 79%);
  --clr-primary-300: hsl(190, 84%, 50%);
  --clr-primary-400: hsl(217, 100%, 50%);
  --clr-primary-500: hsl(190, 100%, 28%);
  
  --clr-bg-default:#424244;
  --clr-bg-dark: #34312d;
  
  --clr-white: #fff;
  --clr-green: #1C9229;
  --clr-green-dark: #1B9229;
  --clr-dark: #0c273c;
  --clr-orange: #ec6707;
  --clr-lightgrey: #ECECEC;
  --clr-yellow: #FAB90A; 
  
  --border-sm-radius: 5px;


  --container-full-width: 100%;
  /* --container-default-width: 1920px; */
  --container-default-width: 100%;
  --container-inner-width: 1920px;
  --container-xxl-width: 1767px;
  --container-xl-width: 1240px;
  --container-md-width: 1252px; /* 1160px */
  --container-sm-width: 670px
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

* {
	margin: 0;
	padding: 0;
	font: inherit;
}

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 24px;
  font-family: var(--ft-family-regular);
  font-optical-sizing: auto;
  font-weight: var(--fw-default);
  font-style: normal;
}

#wrapper {
    position: relative;
    z-index: 1;
    width: 100%;
	max-width:var(--container-default-width);
    min-height: 100%;
	padding:0;
	margin:0 auto
}

#wrapper:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 991;
    background: rgba(255, 255, 255, 1);
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: ease-out 0.2s;
    transition: ease-out 0.2s;
}


h1, h2, h3, h4 {
	font-family: var(--ft-family-header);
	/*text-wrap:balance*/
}

section {
	--section-top-gap:50px;	
	
	display:block;
	position:relative;
	
	margin:var(--section-top-gap) auto 0;
}

.layout-production section {
    --section-top-gap: 0;
}

.no-margin {
	margin:0 auto !important;
}

.white-txt {
	color:var(--clr-white) !important	
}


.btn {
	display:block;
	width:155px;
	padding:8px 0;
	font-size:14px;
	line-height:19px;
	text-align:center;
	background-color: var(--clr-orange);
	text-decoration:none;
	color:var(--clr-white) !important;
	text-transform: uppercase;
	border-radius: var(--border-sm-radius);
}

.flex-width {
	max-width: var(--container-sm-width);
	margin:0 auto;
	padding:0 0 0 100px
}

.bg-lightgrey {
	background: var(--clr-lightgrey)
}

.bg-yellow {
	background: var(--clr-yellow)
}

.bg-green {
	background: var(--clr-green);
	color: var(--clr-white)
}

.p-gap {
	padding-top:84px	
}

video {
	width: 100%;
	height: auto;
}

.video-frame {
	position: relative;
	max-width: 100% !important;
	padding: 0 0 0 clamp(25px, 5vw, 160px);
}

.video-frame-cta {
	position: relative;
	max-width: 100% !important;
	padding: 0;
}

.video-frame-cta iframe, 
.video-frame-cta video, 
.video-frame video {
	border: 2px solid var(--clr-white);
	border-radius: var(--border-sm-radius);	
}

#intro {	
	/* --gap:50px; */
	--gap:25px;
	
	display:flex;
	flex-direction: column;
    gap: var(--gap);
	
	position:relative;
	/* padding: 50px clamp(46px, 5%, 100px) 0; */
	padding: 50px clamp(15px, 5%, 100px) 0;
	/* margin:0 auto 100px; */
	margin:0 auto 50px;
	text-align:center
}

#intro p {
    font-size: 18px !important;
    line-height: 24px !important;
}

#intro h1 {
	position:relative;
	display:block;
	font-size:28px;
	line-height:34px;
	font-weight: 600;
	text-transform:uppercase;
	text-align:center;
	
	margin:0;
	padding:0 0 20px
}

#intro h1::after {
	content:'';
	display:block;
	
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	
	width:60px;
	height:2px;
	background:#EC6707;
	margin:0 auto;
	padding:0
}

.intro--quote {
	padding:0;
	max-width:var(--container-sm-width);
	margin:0 auto;
}

.intro--quote {
	font-size:22px;
	line-height:30px;
	font-weight:600
}

.intro--quote span {
	display:block;
	padding-top:16px;
	font-size:16px;
	line-height:22px;
	
	color:var(--clr-green);
}

.intro--content {
	padding:0 10px;
	max-width:var(--container-md-width);
	margin:0 auto;
	
	font-size:18px;
	line-height:24px;
}




@media (max-width: 1200px) {
    p {
        font-size: 16px !important;
        line-height: 22px !important;
    }
}


#full-boxes {
	--gap:0;
	
	max-width:var(--container-default-width);
	display:flex;
	flex-direction: column;
    gap: var(--gap);
}

.full-boxes--box {
	/* --flex-gap:100px; */
	--flex-gap:50px;	
	--flex-gap-none:0;
	
	position:relative;
	display:flex;
	padding:var(--flex-gap)	100px;
	/* min-height:600px; */
	min-height:300px;
	align-items: center;
}


/*
 *	BACKGROUND
 */

.bg {
	--_color:var(--text-color, --clr-bg-default);
	
	background-repeat:no-repeat;
	background-size:cover;
	
	color:var(--text-color);
	z-index:1
}


.bg-box-1 {
	--text-color:var(--clr-white);
	
	background-image: url('../../assets/images/landing-page/green-textured-background-image-full-width.jpg');
	color: var(--clr-white);	
	/* background-repeat:no-repeat */
}

.bg-box-7 {
	--text-color:var(--clr-white);
	
	/* background-image:url('../../assets/images/landing-page/green-textured-background-image-half-width.jpg'); */
	/* background-position:center right; */
	background-color: #DFF4E2;
}

/* .bg-box-7 h2 {
	color:var(--clr-white) !important
} */

.bg-box-2 {
	background-image: url('../../assets/images/landing-page/leading-the-way-background-image.jpg');
}

.bg-box-3 {
	background-image: url('../../assets/images/landing-page/production-background-image.jpg') 
}

.bg-box-4 {
	background-image: url('../../assets/images/landing-page/eco-performance-in-use-background-image.jpg');
}

.bg-box-5 {
	background-image: url('../../assets/images/landing-page/repair-recycling-recovery-background-image.jpg');
}

.bg-box-6 {
	background-image: url('../../assets/images/landing-page/repair-recycling-recovery-background-image.jpg');
}

.bg-box-8 {
	background-image: url('../../assets/images/production/eco-design-background-image.jpg');
}

.bg-box-9 {
	background-image: url('../../assets/images/production/production-materials-background-image.jpg');
}

.bg-box-10 {
	background-image: url('../../assets/images/production/packaging-background-image.jpg');
}

.bg-box-11 {
	background-image: url('../../assets/images/production/transport-background-image.jpg');
}

.bg-box-12 {
	background-image: url('../../assets/images/eco/smart-features-background-image.jpg');
}

.bg-box-13 {
	background-image: url('../../assets/images/eco/maintenance-background-image.jpg');
}


.bg-box-14 {
	background-image: url('../../assets/images/repair/weee-regulations-background-image.jpg');
}

.bg-box-15 {
	background-image: url('../../assets/images/repair/recovery-of-materials-background-image.jpg');
}

.bg-box-16 {
	background-image: url('../../assets/images/repair/repair-background-image.jpg');
}


.bg:not(.bg-box-1, .bg-box-6, .bg-box-7 )::after {
	content: '';
	display: block;
	position: absolute;
	inset:0;
	opacity: 0.95;
	height: 100%;
	width: 100%;
	z-index:0
}

.bg-box-16::after,
.bg-box-15::after,
.bg-box-14::after,
.bg-box-13::after,
.bg-box-12::after,
.bg-box-11::after,
.bg-box-10::after,
.bg-box-9::after,
.bg-box-8::after,
.bg-box-5::after,
.bg-box-4::after,
.bg-box-3::after,
.bg-box-2::after {
	/*
	content: '';
	display: block;
	position: absolute;
	inset:0;
	opacity: 0.95;
	height: 100%;
	width: 100%;
	z-index:0
	*/
}

.bg-box-15::after,
.bg-box-12::after,
.bg-box-10::after,
.bg-box-9::after,
.bg-box-2::after,
.bg-box-4::after {
	background: linear-gradient( to right, transparent 0,transparent 100px, #fff 40%);
}

.bg-box-16::after,
.bg-box-14::after,
.bg-box-13::after,
.bg-box-11::after,
.bg-box-8::after,
.bg-box-3::after,
.bg-box-5::after {
	background: linear-gradient( to left, transparent 0,transparent 100px, #fff 40%);
}





.full-boxes--box.bg-box-7 {
	padding:var(--flex-gap-none);
	min-height: auto;
	justify-content: flex-start !important;
}

.full-boxes--box.bg-box-7.reverse {
	justify-content: space-between  !important;;
}

.full-boxes--box h2 {
	display:block;
	margin-bottom:15px;
	text-transform:uppercase;
	font-size:28px;
	line-height:34px;
	font-weight:600	
}

.full-boxes--box p {
	line-height:22px;
	margin-bottom:20px
}

.full-boxes--box img.full {
	display:block;
	width:100%
}

.full-boxes--box > div {
	height:100%;
	align-self: center;
	z-index:5;
}

.full-boxes--box > div {
	max-width:796px;	
}

.full-boxes--box > div:has(img) {
	/* max-width:960px; */
	max-width:50%;
	padding:0;
	flex: 1;
}

.full-boxes--box > div:has(h2) {
	max-width:660px;
	flex: 1;
}

#full-boxes > div:nth-child(even) {
	justify-content: flex-end;
}

#full-boxes.reverse-mode > div:nth-child(odd) {
	justify-content: flex-end !important;
}

#full-boxes.reverse-mode > div:nth-child(even) {
	justify-content: flex-start !important;
}
 
 
.full-boxes--box__grid {
	display:grid;
	gap: 15px;
	grid-template-columns: repeat(5, minmax(90px, 100px) );
	text-align: center;
	margin-bottom:28px;
}

.full-boxes--box__grid > div {
	justify-self: center;
}

.full-boxes--box__grid img {
	display:block;
	width:100px;
	height:100px;
	object-fit:cover;
	border-radius:100%;
	border:	3px solid var(--clr-green-dark)
}

.full-boxes--box__grid span {
	display:block;
	font-size:12px;
	line-height:17px;
	font-weight:700;
	color: var(--clr-dark);
	padding:10px 0 0
}

.full-boxes--box__grid p {
	display:block;
	font-size:12px !important;
	line-height:14px !important;
	color: var(--clr-dark);
	padding:0
}


/**
* PRODUCTION *
**/

#cards-group {
	width: 100%;
    margin: 0 auto;
    padding: clamp(25px, 5%, 100px);
}

.cards-group--layout {
	--grid-gap: 0;
	--gap:39px;
    position: relative;
    display: grid;
	grid-gap: var(--gap);
	/* grid-template-columns: repeat(4, minmax(200px, 376px) ); */
	grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) ); /*312px*/
    padding: var(--grid-gap) 0;
	align-items: flex-start;
}

.cards-group--layout__card {
	--row-gap:10px;
	/* display:flex;
	flex-direction: column;
	flex-wrap: nowrap;
	row-gap: var(--row-gap);*/
	
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr 150px 36px;
	/*
	grid-template-columns: 1fr;
	grid-template-rows: repeat(3, 1fr);
	*/
	
	grid-column-gap: 0px;
	grid-row-gap: var(--row-gap);
}
/*
.cards-group--layout__card > * {
	flex:1;
	align-content: flex-end;
}
*/

.cards-group--layout__card >  {
	height:auto !important
}
/* 
.cards-group--layout__card div:nth-of-type(1) { grid-area: 1 / 1 / 2 / 2; }
.cards-group--layout__card div:nth-of-type(2) { grid-area: 2 / 1 / 3 / 2; }
.cards-group--layout__card div:nth-of-type(3) { grid-area: 3 / 1 / 4 / 2; }
.cards-group--layout__card div:nth-of-type(4) { grid-area: 4 / 1 / 5 / 2; align-content: end; }
*/

.cards-group--layout__card div:nth-of-type(1) { 
	grid-area: 1 / 1 / 2 / 2
}
.cards-group--layout__card div:nth-of-type(2) { 
	grid-area: 2 / 1 / 3 / 2; 
	overflow:hidden 
}
.cards-group--layout__card div:nth-of-type(3) { 
	grid-area: 3 / 1 / 4 / 2; 
	align-content: end
}

.cards-group--layout__card img {
	display:block;
	width:100%;
	height:auto;
	border-radius:var(--border-sm-radius);
	
	height:250px;
	object-fit:cover
}


@media screen and (max-width:600px) {
	.cards-group--layout__card img {
		height:150px;
	}
}

.cards-group--layout__card h3 {
	display:block;
	font-size:clamp(18px, 2vw, 20px);
	line-height:33px;
	font-weight:600;
	
	margin-bottom:10px;
	margin-top:0;
}



.no-margin {
	margin:0 auto !important;
}

.full-boxes--box:has(.white-txt) a:not(.btn) {
	color:var(--white-txt) !important;
	font-weight:700;
}




#image-group {
	margin: 0 auto -50px !important;
	width: 100%;
    padding: 50px clamp(25px, 5%, 100px) 100px;
}


.flex-group {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap:15px;
	justify-content: normal;
	align-items: baseline;
	align-content: normal;
}

.flex-group > * {
	flex:1	
}


.image-group--title {
	padding:0;
	margin:0 auto;
	margin-bottom:36px;
	text-align:center
}

.image-group--title h2 {
	display:inline-block;
	font-weight: 600;
	font-size: 28px;
	line-height: 34px;
	padding:0;
}

.image-group--layout {
    --grid-gap: 0;
    --gap: 20px;
    position: relative;
    display: grid;
    grid-gap: var(--gap);
    /* grid-template-columns: repeat(4, minmax(200px, 382px)); */
	grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) );
    padding: var(--grid-gap) 100px;

	max-width:var(--container-xxl-width);
	margin:0 auto
}

.image-group--layout__card {
	position:relative	
}

.image-group--layout__card:hover::before {
	content:'';
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	cursor:pointer;
	
	inset:0;
	z-index:5;
	background:	var(--clr-green) !important;
	border-radius:var(--border-sm-radius);
}

.image-group--layout__card.bg-yellow:hover::before {
	content:'';
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	cursor:pointer;
	
	inset:0;
	z-index:5;
	background:	var(--clr-yellow) !important;
	border-radius:var(--border-sm-radius);
}

.image-group--layout__card img {
	display:block;
	max-width:100%;
	height:auto;
	border-radius:var(--border-sm-radius);
	z-index:1
}

.image-group--layout__card::after {
	content:'';
	display:block;
	width:25px;
	height:25px;
	background-image:url('../../assets/images/eco/tap-icon-green.png');	
	background-size:cover;
	
	position:absolute;
	bottom:50px;
	left:0;
	right:0;
	margin:0 auto;
	z-index:2
}

.image-group--layout__card.bg-yellow::after {
	background-image:url('../../assets/images/repair/tap-icon-yellow.png');	
}

.image-group--layout__card span {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
  	-moz-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	
	width:215px;
	padding:8px 0;
	text-align:center;
	font-size:22px;
	line-height:30px;
	font-weight:600;
	background-color:var(--clr-green);
	color:#fff;
	border-radius:var(--border-sm-radius);
	
	z-index:7
}

.image-group--layout__card.bg-yellow span {
	background-color:var(--clr-yellow) !important;	
}

.image-group--layout__card.bg-yellow span {
	background-color: transparent;
	color:	var(--clr-dark)
}

.image-group--header {
    --grid-gap: 0;
    --gap: 20px;
    position: relative;
    display: grid;
    grid-gap: var(--gap);
    /* grid-template-columns: repeat(2, 1fr); */
	grid-template-columns: repeat(1, 1fr);
    /* padding: var(--grid-gap) 100px; */
}

.image-group--header > div {
	border-radius:var(--border-sm-radius);
	text-align:center;
	font-size:22px;
	line-height:30px;
	padding:5px;
	
	font-weight:600
}

#image-group:has(.image-group--title) .image-group--layout {
    /* padding: 20px 100px var(--grid-gap); */
    padding: 20px 0 var(--grid-gap);
}

.ab-c-b,
.full-boxes--box span.ab-c-b {
	position: absolute;
	bottom: -20%;
	left: 100px;
	
	background:rgba(0,0,0,.5);
	max-width:var(--container-sm-width);
	border-radius: var(--border-sm-radius);
	
	z-index:4;
	color:var(--clr-white);
	font-size:14px;
	line-height:16px;
	padding:12px 10px;
	
	width:40%
}


#case-studies {
}

.case-studies--layout {
	width: 100%;
    margin: 0 auto;
}
            	
.case-studies--layout__card {
	--grid-gap: 100px;
    --gap: 100px;
	
    position: relative;
    display: grid;
    grid-gap: var(--gap);
    grid-template-columns: repeat(2, 1fr);
	align-items: center;
	
    padding: var(--grid-gap) 100px;
	margin:0 auto
}

.case-studies--layout__card > div {
	position:relative	
}

.case-studies--layout__card img {
	display:block;
	max-width:100%;
    /* height: 100%; */
    height: auto;
    object-fit: cover;
	border-radius:var(--border-sm-radius);
	border:2px solid var(--clr-white)
}

.case-studies--layout__card h3 {
	font-size:28px;
	line-height:34px;
	font-weight:600	;
	margin-bottom:12px
}

.case-studies--layout__card p {
	font-size:16px;
	line-height:22px;
	margin-bottom:22px	
}

.case-studies--layout__card > div:has(img) {
	position:relative
}

.case-studies--layout__card > div:has(img)::after {
	content:'';
	
	display:block;
	
	width:156px;
	height:156px;
	
	position:absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
  	-moz-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	
	background-color:rgba(255,255,255,.4);
	background-image:url('../../assets/images/case-studies/video-play.png');
	background-repeat: no-repeat;
    border-radius: 100%;
    background-size: 63px auto;
    background-position: center center;
	
	border-radius:100%	
}



/*
 * FAQS *
*/


#faqs {
    max-width: var(--container-md-width);
	
	position:relative;
	padding:0 clamp(25px, 5%,46px);;
	margin:0 auto
} 

#faqs > h2 {
	display: block;
	
	font-size:28px;
	line-height:34px;
	font-weight:600;
	
	padding:0;
	margin-bottom:15px
}

.faqs--tabs {
    --gap: 15px;
    position: relative;
    /* 
	display: grid;
    grid-gap: var(--gap);
    grid-template-columns: repeat(auto-fit, minmax(278px, 1fr));
	*/
	
	display: flex;
	flex-wrap:wrap;
	gap:var(--gap);
	
	padding-bottom:30px;
	margin-bottom:30px;

	border-bottom:2px solid var(--clr-dark)
}

.faqs--tabs > div {
	flex: 1 1 0;
	
	font-size:22px;
	line-height:30px;
	font-weight:600;
	text-align:center;
	background-color:var(--clr-orange);
	border-radius:var(--border-sm-radius);
	
	padding:17px 20px;
	color:var(--clr-white);
	
	display: grid;
    align-items: center;
}


.faqs--content__acc--header {
	--gap: 30px;
	display:grid;
	grid-gap: var(--gap);
    grid-template-columns: 100px 1fr;
	align-items: center;
	margin-bottom:30px
}

.faqs--content__acc--header img {
	display: block;
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 100%;
    border: 3px solid var(--clr-green-dark);
}

.faqs--content__acc--header h2 {
	display: block;
    font-size: 28px;
    line-height: 34px;
    color: var(--clr-green);
	
	font-weight:600
}


/**
 * ACCORDION
 *
 **/

.accordion-container--set {
	position: relative;
	width: 100%;
	height: auto;
	background-color: var(--clr-lightgrey);
	margin-bottom:10px;
}

.accordion-container--set > span {
	padding: 18px 22px 14px 22px;
	text-decoration: none;
	font-weight: 600;
	-webkit-transition:all 0.2s linear;
	-moz-transition:all 0.2s linear;
	transition:all 0.2s linear;
	
	font-size:24px;
	line-height:33px;
	
	display: grid;
	grid-template-columns: 1fr 20px;
	align-items: center;
	border-radius:var(--border-sm-radius);
	
	cursor:pointer;
}

.accordion-container--set__content {
	background-color: var(--clr-lightgrey);
	display:none;
	padding: 18px 102px 14px 22px;
}

.accordion-container--set__content p {
	font-size:16px;
	line-height:22px;
	margin-bottom:20px
}


.show-on-mobile {
	display:none	
}

embed, iframe, object, video {
	margin-bottom:0 !important	
}

/*
 * NEW GRID *
*/

.section-box {
	position:relative;
	margin:0 auto	
}

.section-box:after {
	content:'';
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:2;
}


.section-box:nth-child(odd):after { /*.section-box.right:after  */
	background: linear-gradient(to right, transparent 0, transparent 100px, rgba(255,255,255,.9) 60%);
}

.section-box.ctr-none:after, 
.section-box:nth-child(even):after { /* .section-box.left:after */
	background: linear-gradient(to left, transparent 0, transparent 100px, rgba(255,255,255,.9) 60%);
}

.section-box h2 {
	display: block;
	margin-bottom: 15px;
	text-transform: uppercase;
	font-size: 28px;
	line-height: 34px;
	font-weight: 600;
}

.section-box p {
	line-height: 22px;
	margin-bottom: 20px;
}

.section-box--grid_picture > img {
	display:block;
	
	width:100%;
	/* height:660px; */
	height:auto;
	object-fit:cover;
}

.section-box--grid {
	display: grid;
	grid-template-columns: 100px repeat(4, 1fr) 100px;
	/* grid-template-columns: 25px repeat(4, 1fr) 25px; */
	/* grid-template-rows: 100px 1fr 0; */
	grid-template-rows: 10px 1fr 10px;
	grid-column-gap: 0;
	grid-row-gap: 0;
	
	align-items: center;
}

.section-box--grid_picture  { 
	grid-area: 1 / 1 / 4 / 7; 
	z-index: 1
}

.section-box:nth-child(odd) .section-box--grid_content { 
	grid-area: 2 / 4 / 3 / 6; 
	z-index: 3
}

.section-box:nth-child(even) .section-box--grid_content { 
	grid-area: 2 / 2 / 3 / 4;
	z-index: 3
}

.section-box.ctr-none .section-box--grid_content { 
	grid-area: 2 / 2 / 3 / 4 !important;
	z-index: 3 !important
}


.section-box--grid_content > br {
	display:none !important	
}



.section-box {
	background-size:cover;
	background-repeat:no-repeat;
	background-position: top center;
	
	object-fit: cover;
	
	padding:100px 0;
	width: 100%;
}

#production-materials {
	background-position: center center !important;
}

.section-box .section-box--grid_picture img {
	display:none;
	height:0	
}

.full-boxes--box__grid img {
    display: inline-block
}


.inner--wrapper {
	position:relative;
	margin:0 auto;
	padding:0;
	
	max-width:var(--container-inner-width);
}


@media screen and (max-width:1150px) {
	.section-box--grid {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr;
		/* grid-template-columns: 100px repeat(3, 1fr) 100px;
		grid-template-rows: 100px repeat(2, 1fr) 100px; */
		grid-column-gap: 0px;
		grid-row-gap: 0px;
		align-items: unset;
	}
	
	.section-box--grid_picture { 
		grid-area: 1 / 1; 
		max-height: 350px;
    	overflow: hidden;
	}
	
	
	.section-box--grid_picture.ctr--specific { 
		grid-area: 1 / 1 / 1 / 4 !important; 
	}
	
	.section-box.ctr-none .section-box--grid_content {
		grid-area: 2 / 2 / 3 / 1 !important;
		z-index: 3 !important;
	}
	
	
	
	.section-box--grid_content { 
		grid-area: 2 / 1 !important;
		padding: 25px clamp(36px, 5%, 46px) !important;
        max-width: 100%;
	}

	.section-box--grid_content > div {
		max-width: var(--container-sm-width);
    	margin: 0 auto;
	}
	
	.section-box:nth-child(odd) .section-box--grid_content { 
		grid-area: 1 / 1; 
		z-index: 3
	}
	
	.section-box:nth-child(even) .section-box--grid_content { 
		grid-area: 2 / 1 !important;
		padding: 25px clamp(36px, 5%, 46px) !important;
        max-width: 100%;
	}
	
	.full-boxes--box > div:has(img) {
		max-width: 100%;
		padding: 0;
	}
	
	.full-boxes--box > div:nth-child(3),
	.full-boxes--box > div:nth-child(2) {
		padding:10px clamp(36px, 5%, 46px) 50px !important;
		max-width: 100%;
	}
	
	.full-boxes--box  {
		display: block !important;
		padding: 0;
		min-height: auto;
	}
}

@media screen and (max-width:980px) {
	.bg:not(.bg-box-1, .bg-box-6, .bg-box-7 )::after {
		content: '';
		display: none !important;
		opacity: 1 !important;
	}
	
	.show-on-mobile {
		display:block !important;	
	}
	
	.hide-on-desktop {
		display:none;
		height:0	
	}
	
	.show-on-mobile > img  {
		display:block;
		width:100% !important;
		max-width:100% !important;
		height:auto !important
	}

	.bg:not(.bg-box-1, .bg-box-7) {
		background-image:none !important
	}
	
	.full-boxes--box.bg-box-15 > div:nth-child(2) {
		padding:0 !important;
		max-width: 100%;
	}
	
	.ab-c-b,
	.full-boxes--box span.ab-c-b {
		position: absolute;
		bottom:unset;
		top: 50px;
		left: 0;
		right:0;
		margin:0 auto;
		width:90%;
	}
	
	.case-studies--layout__card {
		position: relative;
		display: grid;
		grid-gap: 0;
		grid-template-columns: repeat(1, 1fr);
		padding: 0;
		margin: 0 auto;
	}	
	
	.case-studies--layout__card img {
		display: block;
		max-width:unset;
		width:100%;
		/* height: 100%; */
		height: auto;
		object-fit: cover;
		border-radius: 0;
		border: none;
	}
	
	.video-frame {
		padding: 0;
	}
	
	.full-boxes--box > div:has(video) {
		max-width: 100% !important;
	}
	
	.full-boxes--box > div:has(video) video {
		border-radius: 0 !important;
		border:none !important
	}
	
	.order-1 {
		order:2;
		padding:70px 46px;
	}
	
	.order-2 {
		order:1
	}
	
	.flex-width {
		padding: 0;
	}
	
	.section-box:after {
		background: none !important;
	
	
	
}



@media screen and (max-width:980px) {
	.section-box {
		background:none !important;
		padding:0 0 25px
	}
	
	.section-box .section-box--grid_picture img {
		display:block;
		height:auto	
	}	
	
	.accordion-container--set__content {
		padding: 18px 22px 14px 22px;
	}
	
	.flex-width.reverse {
		padding: 0 !important;
	}
	
	.float--content {
		top: 25px !important;
	}
}


@media (max-width:650px) {
	.full-boxes--box__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	
	.flex-group {
		flex-direction: column;
	}
	.image-group--layout {
		--grid-gap: 0;
		--gap: 20px;
		grid-template-columns: repeat(1, 1fr);
		margin: 0 auto;
		padding:0 10px !important
	}
	
	.image-group--header {
		margin-bottom: 20px;
	}
	
	.full-boxes--box > div.ctr--mobile:nth-child(2) {
        padding: 0 0 50px !important;
    }
}

@media (max-width:598px) {
	.cards-group--layout__card {
		--row-gap: 10px;
		display: flex;
		flex-direction: column;
	}
}

@media (max-width:440px) {
	.full-boxes--box__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	p {
        font-size: 14px !important;
        line-height: 19px !important;
    }
	
	.btn {
		padding: 13.5px 0;	
	}
	
	.full-boxes--box > div.ctr--mobile:nth-child(2) {
        padding: 0 0 50px !important;
    }
	
	.float--content {
		width: 100% !important;
		background-color: rgba(0, 0, 0, .8) !important;
		position: relative !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		transform: none !important;
		padding: 15px clamp(36px, 5%, 46px) !important;
		border-radius:0 !important
	}
	
}

p a, ul li a,
body.page-template-sustainability strong, 
body.page-template-sustainability-children strong {
    color: var(--clr-green) !important;
}


body.page-template-sustainability strong, 
.intro--quote strong {
	font-weight:800;
	color: var(--clr-dark) !important
}

.breadcumb-wrapper.stricky.stricky-fixed {
	position: fixed;
    top: 54px;
    left: 0;
    width: 100%;
    z-index: 9999;
    animation-name: menu_sticky;
    animation-duration: 0.60s;
    animation-timing-function: ease-out;
    -webkit-box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 13px 30px -12px rgba(0, 0, 0, 0.75);
}

@media screen and (max-width:780px) {
	.breadcumb-wrapper.stricky.stricky-fixed {
    	top: 45px;
	}
}