/************************************************************************************************************
***** RESET ************************************************************************************************
**************************************************************************************************************/
*,
*:before,
*:after{
	margin: 0;
	padding: 0;
	border:0;
	box-sizing: border-box;
}

:focus,
*:focus,
a:focus,
input:focus,
textarea:focus,
select:focus,
button:focus{outline: none;}

a,
a:hover,
a:focus,
a:visited{
	text-decoration: none;
	color: inherit;
}

a,
input,
textarea,
button,
select{
	font:inherit;
}

.heading,
h1,.h1,.fs-900,
h2,.h2,.fs-800,
h3,.h3,.fs-700,
h4,.h4,.fs-600,
h5,.h5,.fs-500,
h6,.h6,.fs-400{
	width: 100%;
	margin: 0;
	display: block;
	word-break: break-word;
}

ul{list-style: none;}

img,
picture{max-width: 100%;}/*display: flex;*/
button{cursor: pointer;background: transparent;}
textarea {resize: none;}


section{padding: var(--padding-sectionY) var(--padding-pageX);}
/*section:first-child{padding-top: calc(var(--padding-sectionY) * 0.5);}*/
/*section:last-child{padding-bottom: calc(var(--padding-sectionY) * 0.5);}*/
section.py0{padding-block: 0;}
section.px0{padding-inline: 0;}


/* Remove animations for people who've turned them off*/
@media(prefers-reduced-motion: reduce){
	*,
	*::before,
	*::after{
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}



/*************************************************************************************************************
***** PLUGINS ************************************************************************************************
**************************************************************************************************************/
/*********/
/* Slick */
/*********/
.slick-list{width: 100%;margin: 0 -8px;}
.slick-slide{position: relative;margin: 0px 8px;}
.slick-track{display: flex;justify-content: center;align-items: center;}

/* -- Slick Arrows */
.slick-prev,
.slick-next{background-image: none !important;}
.slick-arrow.slick-disabled{opacity: 0 !important;}

/* -- Slick Dots */
.slick-dotted{--dots: 100px;padding-bottom: var(--dots);}
.slick-dotted .slick-dots{bottom: calc(var(--dots) * 0.5);}
.slick-dots{width: 100%;height: auto;position: absolute;bottom: 0;left: calc(50% + 0px);transform: translateX(-50%);display: flex;justify-content: center;}

.slick-dots li:only-child{display: none;}
.slick-dots li{margin: 0px 5px;display: flex;}
.slick-dots li button {font-size: 0;}
.slick-dots li button{width: 8px;height: 8px;background-color: hsl(var(--color-primary));border-radius: 100%;opacity: .2;}
.slick-dots li.slick-active button{background-color: hsl(var(--color-primary));opacity: 0.8;}


/* Slick - Center Mode*/
.slick-slider-center .slick-list{width: 100%;margin: 0px;}
.slick-slider-center .slick-slide{position: relative;margin: 0px 10vw;}
.slick-slider-center .slick-track{align-items: flex-start;}

/* Slick - Showcase Mode*/
.slick-slider-showcase .slick-list{width: 100%;margin: 0px;}
.slick-slider-showcase .slick-track{align-items: flex-start;}
.slick-slider-showcase .showcase__thumbnail{display: flex; justify-content: center;align-items: center;}
.slick-slider-showcase .showcase__thumbnail img{max-height: 150px;}


@media(max-width:767px){
	/* -- Slick Dots */
	.slick-dotted{--dots: 30px;}
}

/***********/
/* Select2 */
/***********/
.select2-container--default .select2-selection--single{position:relative;background-color: transparent;border: 0;border-radius: 0px;}
.select2-container .select2-selection--single{height: auto;}
.select2-container .select2-selection--single .select2-selection__rendered{padding-left: 0;}
.select2-container--default .select2-selection--single .select2-selection__rendered{color: hsl(var(--color-primary));}
.select2-container--default .select2-selection--single .select2-selection__placeholder {color: hsl(var(--color-primary));}
/*.select2-dropdown.select2-dropdown--below{margin-top: 32px;}*/


.select2-dropdown {
    background-color: hsl(var(--color-white));
    border: 1px solid hsl(var(--color-light-peach));
    border-radius: 0px;
}
.select2-results__option {
    padding: 15px 15px;
    color: hsl(var(--color-primary));
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: hsl(var(--color-light-peach) / 0.8);
    color: hsl(var(--color-secondary));
}
.select2-container--default .select2-results__option--selected {
   background-color: hsl(var(--color-light-peach));
   color: hsl(var(--color-secondary));
   font-weight: 700;
}

/*@media(max-width: 767px){
	.select2-dropdown.select2-dropdown--below {margin-top: 46px;}
}*/

/* Safari Only CSS here */
/*@supports (-webkit-appearance: none) {
  .select2-dropdown.select2-dropdown--below {margin-top: 0px;}
}*/

/***************/
/* COOKIES *****/
/***************/
.cli-style-v2 .cli-bar-message{width: 90%;}
#wt-cli-accept-all-btn{margin:0;padding: 10px 30px;border-radius: 30px;}
#cn-accept-cookie{background-color:hsl(var(--color-primary));color:white;margin:0;padding: 10px 30px;border-radius: 30px;}


/***********/
/* GSAP ****/
/***********/
.line,
.lineParent{overflow: hidden;width: 100%;}


/***************/
/* BARBA JS ****/
/***************/
.loading-screen {
	position: relative;
	background-color: hsl(var(--color-light-peach));
	width: 100%;
	height: 100%;
	opacity: 0;
}

.load-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	pointer-events: none;
	z-index: 3000;
}




/*************************************************************************************************************
***** GENERAL ************************************************************************************************
**************************************************************************************************************/
html{overflow-x: hidden;}
html,
body{
	background-color: hsl(var(--color-white));
	scroll-behavior: smooth;
}

body {
	font-family: var(--ff-sans);
	font-size: var(--fs-400);
	color: hsl(var(--color-primary));
	background-color: hsl(var(--color-white));
	line-height: 1.40;
	min-height: 100vh;
}



/*************************************************************************************************************
***** CORE ***************************************************************************************************
**************************************************************************************************************/

/**********/
/* Header */
/**********/
header{
	width: 100%;
	position: sticky;
	top: 0;
	height:var(--height-header);
	padding: 20px var(--padding-pageX) 30px;
	z-index: 5000;
	transition: var(--trans);
	mix-blend-mode: difference;
}

header.fixed{position: fixed;top: 0;left: 0;}

header.sticky,
header #header-logo,
header .icon-path--burger,
header .icon-path--logo{transition: var(--trans);}

header #header-logo.active path.icon-path--logo{fill: hsl(var(--color-primary));}

header button#toggle-nav-xs{position: relative;width: 60px;height: 14px;}
header button#toggle-nav-xs div{background-color: hsl(var(--color-primary));width: 100%;height: 1px;position: absolute;pointer-events: none;transform-origin: center;transition: var(--trans);}

header button#toggle-nav-xs div:first-child{top: 0;}
header button#toggle-nav-xs div:last-child{top: 100%;}

header button#toggle-nav-xs.active div:first-child,
header button#toggle-nav-xs.active div:last-child{top: 50%;width: 60%;background-color: hsl(var(--color-primary));}

header button#toggle-nav-xs.active div:first-child{transform: rotate(45deg);right: 0%;}
header button#toggle-nav-xs.active div:last-child{transform: rotate(-45deg);right: 0%;}

/* -- White Icons (Logo & Burger) */
header.header-icons--white{}
header.header-icons--white button#toggle-nav-xs div{background-color: hsl(var(--color-white));}

/* -- Sticky Header */
header.sticky{mix-blend-mode: difference;height:var(--height-header--sticky);transition: var(--trans);}
header.sticky #header-logo{width: 113px;height: 60px;}


/* -- Header SVGs Handler */

.icon-path--logo,
.header-icons--white.sticky .icon-path--logo{fill: hsl(var(--color-primary));}
.icon-path--burger,
.header-icons--white.sticky .icon-path--burger{stroke: hsl(var(--color-primary));}

.header-icons--white .icon-path--logo{fill: hsl(var(--color-white));}
.header-icons--white .icon-path--burger{fill: none;stroke: hsl(var(--color-white));}




/**********/
/* Footer */
/**********/
footer{width: 100%;position: relative;padding: var(--padding-sectionY) var(--padding-pageX) calc(var(--padding-sectionY) * 0.5);}

footer .footer__main{width: 100%;}

footer .grid.grid--footer{grid-template-columns: 1fr 3fr 2fr;grid-gap: var(--gap-600);}
/*footer .footer__heading{width: 100%;margin-bottom: var(--gap-600);}*/

/* -- Footer Navigation Menu */
footer nav.nav-menu{width: 100%;}
footer nav.nav-menu ul.nav-menu-list{display: flex;flex-wrap: wrap;}
footer nav.nav-menu li.menu-item{width: 100%;margin-bottom: var(--gap-300);}
footer nav.nav-menu li.menu-item a{font-family: var(--ff-sans);font-size: var(--fs-500);font-weight: 700;}

/* -- Footer Social */
footer nav.nav-social{width: 100%;position: relative;margin-top: var(--gap-700);}
footer nav.nav-social a{display: flex;align-items: center;margin-right: var(--gap-flow);color: hsl(var(--color-light-peach));transition: var(--trans);opacity: 0.75;}
footer nav.nav-social a + a{margin-left: var(--gap-400)}
footer nav.nav-social a:hover{opacity: 1;}

/* -- Footer Newsletter */
footer #subscription_form .form-row{margin-bottom: var(--gap-600);}
footer #subscription_form .form-row:last-child{margin-bottom: 0;}
footer #subscription_form .btn{min-width: 0;}

footer #subscription_form button.btn{color: hsl(0 0% 100%);border-color: hsl(var(--color-light-peach));display: flex;justify-content: center;align-items: center;}
footer #subscription_form button.btn:hover{background-color: hsl(var(--color-light-peach));border-color: hsl(var(--color-light-peach));color: hsl(var(--color-primary));}


/* -- Footer Bottom */
footer .grid.grid--footer-bottom{grid-template-columns: 4fr 2fr;grid-gap: var(--gap-600);margin-top: var(--gap-500);}
footer .footer__bottom .grid-column{width: 100%;display: flex;justify-content: space-between;align-items: center;}

footer .footer__bottom nav a + a{padding-left: 0.75rem;}
footer .footer__bottom nav a + a:before{content: '•';margin-right: 0.75rem;}
footer .footer__bottom a{transition: var(--trans);}
footer .footer__bottom a:hover{color: hsl(0, 0%, 100%);}
footer .footer__bottom a:hover:before{color: hsl(var(--color-light-peach));}



/*************************************************************************************************************
***** COLORS *************************************************************************************************
**************************************************************************************************************/
.bg-primary{	background-color: hsl( var(--color-primary) );}
.bg-secondary{ 	background-color: hsl( var(--color-secondary) );}
.bg-greyish{ 	background-color: hsl( var(--color-greyish) );}
.bg-light-peach{background-color: hsl( var(--color-light-peach) );}
.bg-white{ 		background-color: hsl( var(--color-white) );}
.bg-pure-white{	background-color: hsl( 0, 0%, 100%); }

.text-primary{		color: hsl( var(--color-primary) );}
.text-secondary{	color: hsl( var(--color-secondary) );}
.text-greyish{		color: hsl( var(--color-greyish) );}
.text-light-peach{	color: hsl( var(--color-light-peach) );}
.text-white{		color: hsl( var(--color-white) );}
.text-pure-white{	color: hsl( 0, 0%, 100%); }



/*************************************************************************************************************
***** TYPOGRAFY **********************************************************************************************
**************************************************************************************************************/
.heading em, .heading i,
.fs-900 em,.fs-900 i,
.fs-800 em,.fs-800 i,
.fs-700 em,.fs-700 i,
.fs-600 em,.fs-600 i,
.fs-500 em,.fs-500 i,
.fs-400 em,.fs-400 i,
h1 em,.h1 em,h1 i,.h1 i,
h2 em,.h2 em,h2 i,.h2 i,
h3 em,.h3 em,h3 i,.h3 i,
h4 em,.h4 em,h4 i,.h4 i,
h5 em,.h5 em,h5 i,.h5 i,
h6 em,.h6 em,h6 i,.h6 i{
	font-family: var(--ff-serif);
	font-weight: 400;
}

h1,.h1{font-size: var(--fs-800);}
h2,.h2{font-size: var(--fs-600);}

h1 em,.h1 em,.fs-800 em,h1 i,.h1 i,.fs-800 i{font-size: var(--fs-900);font-style: normal;}
h2 em,.h2 em,.fs-600 em,h2 i,.h2 i,.fs-600 i{font-size: var(--fs-700);font-style: normal;}

.ff-serif{ font-family: var(--ff-serif); font-style: normal;}
.ff-sans { font-family: var(--ff-sans);}

.fs-900{font-size: var(--fs-900);}
.fs-800{font-size: var(--fs-800);}
.fs-700{font-size: var(--fs-700);}
.fs-600{font-size: var(--fs-600);}
.fs-500{font-size: var(--fs-500);}
.fs-400{font-size: var(--fs-400);}

.fs-900,
.fs-800,
.fs-700,
.fs-600{
	line-height: 1.1;
}

.fs-900.ff-sans,
.fs-800.ff-sans,
.fs-700.ff-sans,
.fs-600.ff-sans{
	font-weight: 700;
}
.fs-500.ff-sans,
.fs-400.ff-sans{
	font-weight: 400;
}

blockquote{
	font-family: var(--ff-serif);
	font-size: var(--fs-700);
	line-height: 1.05;
}



/*************************************************************************************************************
***** UTILITY ************************************************************************************************
**************************************************************************************************************/
/*1600px = 100rem*//*1920px = 120rem*/
/* Layout */
.container-fluid{max-width: 160rem;margin-inline:auto;padding-inline: 0rem;}
.container{max-width: 120rem;margin-inline:auto;padding-inline: 0rem;}

.relative{position: relative;}

.hidden-xs,
.hidden-sm,
.hidden-lg{display: block;}
.visible-xs,
.visible-sm,
.visible-lg{display: none;}

.hide{display: none;}

.w100{width: 100%;}
.vh{min-height: 100vh;padding-block: calc(var(--padding-sectionY) * 1)}
.vh--first{min-height: calc(100vh - var(--height-header--sticky));}
.vh100{height: 100vh;}
.vh100min{min-height: 100vh;}


.flow > *:not(:first-child) {margin-top: var(--gap-flow, 1rem);}

/* -- Flex */
.flex{display: flex;gap: var(--gap-400, 1rem);}

.flex-center{justify-content: center;align-items: center;}
.flex-start{justify-content: flex-start;align-items: center;}
.flex-end{justify-content: flex-end;align-items: center;}
.flex-between{justify-content: space-between;align-items: center;}
.flex-around{justify-content: space-around;align-items: center;}

.flex-wrap{flex-wrap: wrap;}
.flex-dir-column{flex-direction: column;}


/* -- Grid */
.grid{display: grid;gap: var(--gap-400, 1rem);}
.grid--columns{grid-template-columns: repeat(auto-fit,minmax(350px,1fr));}
.grid--columns-two {grid-template-columns: repeat(2,1fr);}
.grid--columns-four{grid-template-columns: repeat(4,1fr);}
.grid--columns-side{grid-template-columns: 1fr 1.5fr;}


/* -- Common Flex & Grid */
.align-start{align-items: start;}
.align-content{align-content: center;}
.align-center{align-items: center;}

.no-gap{gap: 0;}
.gap-xl{gap: 150px;}
.gap-lg{gap: 100px;}
.gap-md{gap:  50px;}

.column{position: relative;padding: calc(var(--padding-sectionY) * 2) var(--padding-sectionX);}
.column--shrink{padding-block: calc(var(--padding-sectionY) * 1);}
.column--streched{padding-block: calc(var(--padding-sectionY) * 3);}


/* Margin Padding */
.m-0 {margin: 0;}
.my-0{margin-block: 0rem;}
.mt-0{margin-top: 0rem;}
.mb-0{margin-bottom: 0rem;}
.mx-0{margin-inline: 0rem;}
.ml-0{margin-left: 0rem;}
.mr-0{margin-right: 0rem;}

.p-0 {padding: 0;}
.py-0{padding-block: 0rem;}
.pt-0{padding-top: 0rem;}
.pb-0{padding-bottom: 0rem;}
.px-0{padding-inline: 0rem;}
.pl-0{padding-left: 0rem;}
.pr-0{padding-right: 0rem;}

.my-900{margin-block: 160px;}
.mt-900{margin-top: 160px;}
.mb-900{margin-bottom: 160px;}
.mx-900{margin-inline: 160px;}
.ml-900{margin-left: 160px;}
.mr-900{margin-right: 160px;}
.py-900{padding-block: 160px;}
.pt-900{padding-top: 160px;}
.pb-900{padding-bottom: 160px;}
.px-900{padding-inline: 160px;}
.pl-900{padding-left: 160px;}
.pr-900{padding-right: 160px;}

.my-800{margin-block: 120px;}
.mt-800{margin-top: 120px;}
.mb-800{margin-bottom: 120px;}
.mx-800{margin-inline: 120px;}
.ml-800{margin-left: 120px;}
.mr-800{margin-right: 120px;}
.py-800{padding-block: 120px;}
.pt-800{padding-top: 120px;}
.pb-800{padding-bottom: 120px;}
.px-800{padding-inline: 120px;}
.pl-800{padding-left: 120px;}
.pr-800{padding-right: 120px;}

.my-750{margin-block: 100px;}
.mt-750{margin-top: 100px;}
.mb-750{margin-bottom: 100px;}
.mx-750{margin-inline: 100px;}
.ml-750{margin-left: 100px;}
.mr-750{margin-right: 100px;}
.py-750{padding-block: 100px;}
.pt-750{padding-top: 100px;}
.pb-750{padding-bottom: 100px;}
.px-750{padding-inline: 100px;}
.pl-750{padding-left: 100px;}
.pr-750{padding-right: 100px;}

.my-700{margin-block: 80px;}
.mt-700{margin-top: 80px;}
.mb-700{margin-bottom: 80px;}
.mx-700{margin-inline: 80px;}
.ml-700{margin-left: 80px;}
.mr-700{margin-right: 80px;}
.py-700{padding-block: 80px;}
.pt-700{padding-top: 80px;}
.pb-700{padding-bottom: 80px;}
.px-700{padding-inline: 80px;}
.pl-700{padding-left: 80px;}
.pr-700{padding-right: 80px;}

.my-600{margin-block: 60px;}
.mt-600{margin-top: 60px;}
.mb-600{margin-bottom: 60px;}
.mx-600{margin-inline: 60px;}
.ml-600{margin-left: 60px;}
.mr-600{margin-right: 60px;}
.py-600{padding-block: 60px;}
.pt-600{padding-top: 60px;}
.pb-600{padding-bottom: 60px;}
.px-600{padding-inline: 60px;}
.pl-600{padding-left: 60px;}
.pr-600{padding-right: 60px;}

.my-500{margin-block: 40px;}
.mt-500{margin-top: 40px;}
.mb-500{margin-bottom: 40px;}
.mx-500{margin-inline: 40px;}
.ml-500{margin-left: 40px;}
.mr-500{margin-right: 40px;}
.py-500{padding-block: 40px;}
.pt-500{padding-top: 40px;}
.pb-500{padding-bottom: 40px;}
.px-500{padding-inline: 40px;}
.pl-500{padding-left: 40px;}
.pr-500{padding-right: 40px;}

.my-400{margin-block: 20px;}
.mt-400{margin-top: 20px;}
.mb-400{margin-bottom: 20px;}
.mx-400{margin-inline: 20px;}
.ml-400{margin-left: 20px;}
.mr-400{margin-right: 20px;}
.py-400{padding-block: 20px;}
.pt-400{padding-top: 20px;}
.pb-400{padding-bottom: 20px;}
.px-400{padding-inline: 20px;}
.pl-400{padding-left: 20px;}
.pr-400{padding-right: 20px;}

.my-300{margin-block: 15px;}
.mt-300{margin-top: 15px;}
.mb-300{margin-bottom: 15px;}
.mx-300{margin-inline: 15px;}
.ml-300{margin-left: 15px;}
.mr-300{margin-right: 15px;}
.py-300{padding-block: 15px;}
.pt-300{padding-top: 15px;}
.pb-300{padding-bottom: 15px;}
.px-300{padding-inline: 15px;}
.pl-300{padding-left: 15px;}
.pr-300{padding-right: 15px;}

.padding-pageX{padding-inline: var(--padding-pageX);}


/* Max Width */
.mxw-xxl,
.mxw-xl,
.mxw-lg,
.mxw-md,
.mxw-sm,
.mxw-xs{width: 100%;margin-left: auto;margin-right: auto;}

.mxw-left{margin-left: 0;}
.mxw-right{margin-right: 0;}

.mxw-xxl{max-width: 1400px;}
.mxw-xl{max-width:  1200px;}
.mxw-lg{max-width:  935px;}
.mxw-md{max-width:  765px;}
.mxw-sm{max-width:  565px;}
.mxw-xs{max-width:  400px;}


/* Typography */
.text-center{text-align: center;}
.text-left{text-align: left;}
.text-right{text-align: right;}

.bold{font-weight: 700;}
.italic{font-style: italic;}
.uppercase{text-transform: uppercase;}


/* -- Custom Scroll */
.scrolly{overflow-x: hidden;overflow-y:auto;word-wrap:break-word;}
.scrolly::-webkit-scrollbar {width: 12px;height: 10px;}
.scrolly::-webkit-scrollbar:vertical {background-color:hsl(var(--color-background));}
.scrolly::-webkit-scrollbar-track:vertical {background-color:hsl(var(--color-background));}
.scrolly::-webkit-scrollbar-thumb {height:10px;max-height:10px;}
.scrolly::-webkit-scrollbar-thumb:vertical {background-color:hsl(var(--color-greyish));border-radius: 30px;}
.scrolly::-webkit-scrollbar-thumb:active {background-color:hsl(var(--color-greyish));}

.inner-scrolly::-webkit-scrollbar-track {background: linear-gradient(to right,hsl(var(--color-background)) 0%,hsl(var(--color-background)) 35%,hsl(var(--color-light-peach)) 55%,hsl(var(--color-background)) 65%,hsl(var(--color-background)) 100%);}
.inner-scrolly::-webkit-scrollbar{width: 8px;}
.inner-scrolly::-webkit-scrollbar-thumb {background-color: hsl(var(--color-greyish));border-radius: 35px;}


/* Images */
.bg-image{
	background-repeat: no-repeat;
	background-position: center; /* top center */
	background-size: 110%;
}

img.image-bg-effect{position: absolute;top: 0%;left: 0;width: 100%;height: 100%;object-fit: cover;transform-origin: top;transform: scale(1.1);}
img.image-bg-effect.post-featured-image{position: relative;width: 100%;height: auto;}

img.logo-icon--xs{width: 64px;}
img.image--hero-header{width: 100%;
	height: calc(100vh - var(--height-header--sticky));
	height: 100vh;
	object-fit: cover;}
img.image--portrait-lg{max-height: 500px;}
img.image--portrait-xl{max-height: 750px;}


/* Accesibility */
.sr-only{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0,0,0,0);white-space: nowrap;border: 0;}


/* Misc */
.sticky{position: sticky;top: 0;transition: var(--trans);}
.sticky.top-header{top: var(--height-header);}
.sticky.top-header-sticky{top: var(--height-header--sticky);}

.grab{cursor: -webkit-grab;cursor: -moz-grab;cursor: grab;}
.grab:active{cursor: -webkit-grabbing;cursor: -moz-grabbing;cursor: grabbing;}

.pointer-none{pointer-events: none;}
.overflow{overflow: hidden;}

.opacity-0{opacity: 0;}
.opacity-1{opacity: 1;}

.aspect-ratio{aspect-ratio:16/9;}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


@media(max-width: 767px){
	.mobile-reverse-content{}
	.mobile-reverse-content > div:first-child{order: 2;}
	.mobile-reverse-content > div:last-child{order: 1;}

	/*********************************************** extra class for new logo *******************************/
	.mobmarginlogo {margin-top:40px}
}


/*************************************************************************************************************
***** COMPONENTS *********************************************************************************************
**************************************************************************************************************/

.hero__inner{min-height: calc(100vh - var(--padding-sectionY) * 2);}


/*************************************************************************************************************
***** EFFECTS ************************************************************************************************
**************************************************************************************************************/
/***********/
/* Overlay */
/***********/
.overlay{position: relative;}
.overlay::before,
.overlay::after{--deg: 0deg;content: "";position: absolute;bottom: -1px;height: 100%;background-image: linear-gradient(var(--deg), transparent, hsl(var(--color-white) / 0.8) 80%);pointer-events: none;z-index: 1;}
.overlay--bottom::before{width: 100%;max-height: 400px;transform: scaleY(-1);}

.overlay--left::before,
.overlay--right::after{--deg: 90deg;width: 25%;max-width: 400px;}
.overlay--left::before{left: 0;transform: scaleX(-1);}
.overlay--right::after{right: 0;}


/***************************/
/* Heading - Vertical Line */
/***************************/
.heading--effect{margin-bottom: calc(var(--gap-500, 48px) * 0.5);padding-bottom: var(--gap-500, 48px);position: relative;}
.heading--effect:after{content: "";position: absolute;bottom: 0;left: 50%;width: 1px;height: 20px;background-color: hsl(var(--color-primary));}
.text-white .heading--effect:after{background-color: hsl(var(--color-white));}


/***************************/
/* Section - Vertical Line */
/***************************/
.spider-web{position: relative;}
.spider-web:before{
	--color: var(--color-light-peach);
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 1px;
	height: var(--padding-sectionY);
	background-color: hsl(var(--color));
	z-index: 1;
}


/*************************************************************************************************************
**************************************************************************************************************
***** MEDIA QUERIES ******************************************************************************************
**************************************************************************************************************
**************************************************************************************************************/

@media(max-width: 1024px){
	/*************************************************************************************************************
	***** CORE ***************************************************************************************************
	**************************************************************************************************************/
	/**********/
	/* Header */
	/**********/
	header{background-color: hsl(var(--color-background));padding-block: 20px;mix-blend-mode: normal;}
	header.fixed{position: sticky;}

	header.sticky{mix-blend-mode: normal;box-shadow: 0 0 10px hsl(0 0% 0% / 0.1);}

	.header-icons--white .icon-path--logo{fill: hsl(var(--color-primary));}
	.header-icons--white .icon-path--burger{stroke: hsl(var(--color-primary));}

	/**********/
	/* Footer */
	/**********/
	footer .grid.grid--footer,
	footer .grid.grid--footer-bottom{grid-template-columns: 1fr;}

	/*************************************************************************************************************
	***** UTILITY ************************************************************************************************
	**************************************************************************************************************/
	/* Layout */
	.hidden-sm{display: none;}
	.visible-sm{display: block;}

	.grid--columns-two,
	.grid--columns-side{grid-template-columns: 1fr;}
}



@media(max-width: 767px){
	/************************************************************************************************************
	***** RESET *************************************************************************************************
	*************************************************************************************************************/


	/*************************************************************************************************************
	***** PLUGINS ************************************************************************************************
	**************************************************************************************************************/
	/*********/
	/* Slick */
	/*********/
	.slick-list{margin: 0;}
	.slick-track {padding-left: 25vw;}
	.slick-slide{max-width: 60vw;}

	/* Slick - Showcase Mode*/
	.slick-slider-showcase .slick-track {padding-left: 0;}
	.slick-slider-showcase .slick-slide{max-width: 100%;}



	/*************************************************************************************************************
	***** CORE ***************************************************************************************************
	**************************************************************************************************************/
	/**********/
	/* Header */
	/**********/
	header #header-logo,
	header.sticky #header-logo,
	#nav-control #menu-logo{width: 60px;height: 30px;}
	header #header-burger-icon,
	header.sticky #header-burger-icon,
	#nav-control #toggle-nav-control svg{width: 32px;}

	header button#toggle-nav-xs{width: 40px;height: 10px;}
	header.header-icons--white button#toggle-nav-xs div{background-color: hsl(var(--color-primary));}

	/**********/
	/* Footer */
	/**********/
	footer .grid.grid--footer,
	footer .grid.grid--footer-bottom{grid-template-columns: 1fr;}
	footer .footer__inner{flex-wrap: wrap;}
	footer nav.nav-social{flex-wrap: wrap;}
	footer nav.nav-social a + a{margin-left: 15px;}

	footer .footer__main img {width: 80px;}
	footer #subscription_form button.btn{border: 0;}
	footer #subscription_form button.btn:hover{background-color: transparent;}

	footer .footer__bottom .grid-column{flex-wrap: wrap;gap: 20px;}
	footer .footer__bottom .grid-column nav,
	footer .footer__bottom .grid-column span{width: 100%;}


	/*************************************************************************************************************
	***** UTILITY ************************************************************************************************
	**************************************************************************************************************/
	/* Layout */
	.hidden-xs{display: none;}
	.visible-xs{display: block;}

	/*.vh,*/
	/*.vh--first{min-height: 50vh;}*/
	.vh,
	.vh--first{min-height:max(500px, 50vh);}
	.hero__inner{min-height: calc(100vh - var(--height-header) - var(--padding-sectionY) * 2);}

	/* -- Common Flex & Grid */
	.column{padding-inline: var(--padding-sectionX);padding-block: var(--padding-sectionY);}
	.column--streched{padding-block: calc(var(--padding-sectionY) * 2);}
	.column.p-0{padding: 0;}
	.column.bg-image,
	.recipe__header_thumbnail{min-height: 350px;}


	/* Typography */
	.text-center.text-xs-left,
	.text-right.text-xs-left{text-align: left;}

	.text-left.text-xs-center,
	.text-right.text-xs-center{text-align: center;}


	/* Images */
	img.image--hero-header{height: max(500px, 50vh);}

	/* Misc */
	section.section--slider-overflow{padding-right:0;}
	section.section--slider-overflow .container > div:first-child{padding-right: var(--padding-sectionX);}

}
