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

a{
    text-decoration: none;
    color: inherit;
}

/* Slider Group */
.swiper-group{--padding: 100px;--offset: calc(var(--padding, 100px) * 0.75);position: relative;min-width: 0;min-height: 0;display: grid;}
.swiper-group .swiper{opacity: 0;transition: opacity 1s;max-width: 100%;}
.swiper-group .swiper.swiper-initialized{opacity: 1;}

@media(max-width:767px){.swiper-group{--offset:  calc(var(--padding, 100px) * 0.6);}}

/**********************************************************************************************************/
/* Slider *************************************************************************************************/
/**********************************************************************************************************/
.swiper-group{width: 100%;}
.swiper{width: 100%;}

/******************/
/* Item ***********/
/******************/
.swiper-slide.item{height: auto;margin-inline: 0;display: flex;flex-direction: column;-webkit-user-select: none; user-select: none;}

/**********************************************************/
/* Arrows *************************************************/
/**********************************************************/
.swiper-group .swiper-btn{
    position: relative;
}

.swiper-group[data-slider-arrows="false"] .swiper-btn{display: none;}

.swiper-group[data-slider-arrows]{
    --size: 50px;
}
.swiper-group[data-slider-arrows] .swiper-btn{
    width: var(--size, 50);
    height: var(--size, 50);
    position: relative;
    background-color: #FFFFFFFF;
    background-color: transparent;
    border: 1px solid var(--color-primary, #000000);
    border: 1px solid transparent;
    border-radius: 50%;
    border-radius: 0;
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
}
.swiper-group[data-slider-arrows] .swiper-btn-prev{
    left: calc(var(--size) * 0.25);
}
.swiper-group[data-slider-arrows] .swiper-btn-next{
    right: calc(var(--size) * 0.25);
}
.swiper-group[data-slider-arrows] .swiper-button-disabled{
    opacity: 0.5;
    cursor: not-allowed;
}

.swiper-group[data-slider-arrows] .swiper-btn,
.swiper-group[data-slider-arrows] .swiper-btn svg path{transition: var(--trans);}
.swiper-group[data-slider-arrows] .swiper-btn:hover,
.swiper-group[data-slider-arrows] .swiper-btn:focus{background-color: var(--color-accent, #000000);border-color: var(--color-accent, #000000);}
.swiper-group[data-slider-arrows] .swiper-btn:hover svg path,
.swiper-group[data-slider-arrows] .swiper-btn:focus svg path{
    /* fill: white; */
    stroke: white;
}

@media(max-width:1024px){
	/*.swiper-group[data-slider-arrows] .swiper-btn{display: none;}*/
}



/**********************************************************/
/* Dots ***************************************************/
/**********************************************************/
.swiper-group[data-slider-pagination]{padding-bottom: 0;}
.swiper-group[data-slider-pagination] .swiper-pagination-bullet{background-color: var(--color-primary, #000000);opacity: 0.20;transition: var(--trans);}
.swiper-group[data-slider-pagination] .swiper-pagination-bullet.swiper-pagination-bullet-active{opacity: 1;transform: scale(1);}

.swiper-group[data-slider-pagination] .swiper-pagination-bullet,
.swiper-group[data-slider-pagination] .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev,
.swiper-group[data-slider-pagination] .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next,
.swiper-group[data-slider-pagination] .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev,
.swiper-group[data-slider-pagination] .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform: scale(0.8);}


@media(min-width:1025px){
	.swiper-group[data-slider-pagination] .swiper-pagination{display: none;}

	.swiper-group[data-slider-pagination][data-pagination-desktop] .swiper{padding-bottom: var(--gap-700);}
	.swiper-group[data-slider-pagination][data-pagination-desktop] .swiper-pagination{display: block;}
}

@media(max-width:1024px){
	/******************/
	/* Dots ***********/
	/******************/
	/*
	 * .swiper-group[data-slider-pagination] .swiper,
	.swiper-group[data-slider-pagination][data-arrows-position="bottom"] .swiper{padding-bottom: var(--offset, 100px);}
	*/
	.swiper-group[data-slider-pagination] .swiper-pagination{display: block;bottom:var(--gap, 16px)}
}






/**********************/
/* Flex & Grid ********/
/**********************/
.flex,
.grid{gap: 0;}

.gap{gap: var(--gap-400, 16px);}
.gap.gap--800{gap: var(--gap-800, 64px);}
.gap.gap--700{gap: var(--gap-700, 48px);}
.gap.gap--600{gap: var(--gap-600, 32px);}
.gap.gap--500{gap: var(--gap-500, 24px);}

.gutter{gap: var(--gutter, 20px);}

@media(max-width:767px){
	.gap.gap--800,
	.gap.gap--700,
	.gap.gap--600,
	.gap.gap--500{gap: var(--gap-500, 24px);}
}

/* -- Flex */
.flex{display: flex;}
.flex-wrap{flex-wrap: wrap;}
.flex-nowrap{flex-wrap: nowrap;}
.flex-column{flex-direction: column;}
.flex-grow{flex-grow: 1;}

.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;}

.align-start{align-items: start;}
.align-center{align-items: center;}
.align-end{align-items: end;}

.justify-center{justify-content: center;}
.justify-end{justify-content: flex-end;}

/* -- Grid */
.grid{display: grid;}
.grid[data-columns="0"]{--min: 400px;grid-template-columns: repeat(auto-fit,minmax(var(--min),1fr));} /* auto */
.grid[data-columns="2"]{grid-template-columns: repeat(2, minmax(0, 1fr));}
.grid[data-columns="3"]{grid-template-columns: repeat(3, minmax(0, 1fr));}
.grid[data-columns="4"]{grid-template-columns: repeat(4, minmax(0, 1fr));}
.grid[data-columns="5"]{grid-template-columns: repeat(5, minmax(0, 1fr));}
.grid[data-columns="6"]{grid-template-columns: repeat(6, minmax(0, 1fr));}

.grid .grid-column{width: 100%;position: relative;}

@media(max-width: 1024px){
	.grid[data-columns="3"],
	.grid[data-columns="6"]{grid-template-columns: repeat(3, minmax(0, 1fr));}
	.grid[data-columns="4"],
	.grid[data-columns="5"]{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media(max-width: 767px){
	.grid[data-columns="0"],
	.grid[data-columns="2"],
	.grid[data-columns="3"],
	.grid[data-columns="4"],
	.grid[data-columns="5"],
	.grid[data-columns="6"]{grid-template-columns: 1fr;}

	.grid.gap{row-gap: var(--gap-700);}
}

/********************/
/* Button ***********/
/********************/


/********************/
/* Button Icon Move */
/********************/
[data-icon-move]{--delay: 100ms;--movement: 200%;}
[data-icon-move],
[data-icon-move] .btn__icon{
	display: flex;
	justify-content: center;
	align-items: center;
}
[data-icon-move] .btn__icon{
	position: relative;
	overflow: hidden;
}

[data-icon-move] .btn__icon svg{
	transition: var(--trans);
}
[data-icon-move] .btn__icon svg:first-child{
	position: absolute;top: 0;
	left: 0;
}
[data-icon-move] .btn__icon svg:last-child{transition-delay: var(--delay);}

[data-icon-move]:hover .btn__icon svg:last-child{transition-delay: 0ms;}
[data-icon-move]:hover .btn__icon svg:first-child{transition-delay: var(--delay);}

[data-icon-move="right"] .btn__icon svg:last-child {transform: translateX(0);}
[data-icon-move="right"] .btn__icon svg:first-child{top: 50%;left: 50%;transform: translate(calc(-1 * var(--movement) - 50%), -50%);}
[data-icon-move="right"]:hover .btn__icon svg:last-child{transform: translateX(calc(1 * var(--movement)));}
[data-icon-move="right"]:hover .btn__icon svg:first-child{transform: translate(-50% , -50%)}



/**************************************************************************************************************
***** HOMEPAGE GRID *******************************************************************************************
**************************************************************************************************************/
#homepage-grid{
    display: grid;
    gap: 10px;
    grid-template-areas:
        "position_1 position_1"
        "position_2 position_3"
        "position_4 position_4"
        "position_5 position_5";
}

#homepage-grid > *{min-width: 0;}


#homepage-grid #homepage-part-1{grid-area: position_1;}
#homepage-grid #homepage-part-2{grid-area: position_2;}
#homepage-grid #homepage-part-3{grid-area: position_3;}
#homepage-grid #homepage-part-4{grid-area: position_5;}
#homepage-grid #homepage-part-5{grid-area: position_4;}

#homepage-grid article .banner___title,
#homepage-grid .homepage__carousel .heading{
    font-family: var(--ff-heading);
    font-size: var(--fs-h-700, 50px);
    text-transform: uppercase;
    pointer-events: none;
}


#homepage-grid article.homepage__banner{
	position: relative;
	width: 100%;
	/*height: 100vh;*/
	height: calc(100vh - var(--navbar-height) - 28px);
	padding: var(--padding-container-inline);
	isolation: isolate;display: flex;
	align-items: flex-end;
	color: var(--color-heading-white);
}
#homepage-grid article.homepage__banner a{
	width: 100%;
	display: block;
}
#homepage-grid article .banner___image{width: 100%;
	height: 100%;
	display: flex;
	position: absolute;
	inset: 0;
	z-index: -1;}
#homepage-grid article .banner___image::after{
    content: "";
    position: absolute;
    inset: 0;
    /* width: 100%;
    height: 100%; */
    background-image: linear-gradient(0deg, #0000001A 10%, transparent);
    z-index: 1;
    pointer-events: none;
}
#homepage-grid article .banner___image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#homepage-grid article .banner___content{
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: var(--gutter);
}
#homepage-grid article .banner___action .btn{
    display: flex;
    align-items: center;
    gap: var(--gap-300);
    font-family: var(--ff-heading);
    font-size: var(--fs-btn, 16px);
    flex-shrink: 0;
}

#homepage-grid .homepage__carousel{
    position: relative;
    height: 80vh;
    height: 80svh;
}
#homepage-grid .homepage__carousel .swiper-group,
#homepage-grid .homepage__carousel .swiper-group .item__thumbnail,
#homepage-grid .homepage__carousel .swiper-group .item__thumbnail img
{height: 100%;}
#homepage-grid .homepage__carousel .swiper-group .item__thumbnail img{
    width: 100%;
    object-fit: cover;
}



#homepage-grid .homepage__carousel .heading{
    position: absolute;
    bottom: 0;
    padding: var(--padding-container-inline);
    z-index: 10;
}




@media(max-width: 991px){
    #homepage-grid{
        gap: 4px;
        grid-template-areas:
            "position_1"
            "position_2"
            "position_3"
            "position_4"
            "position_5"
        ;
    }
    #homepage-grid article.homepage__banner{
        height: auto;
        min-height: 50vh;
        min-height: 50svh;
    }
    #homepage-grid .homepage__carousel .heading{
        bottom: 0px;
    }
}



#homepage-grid a{
	color: inherit !important;
	text-decoration: none;
}
#homepage-grid article .banner___action .btn{
	color: var(--color-white);
}
@media(min-width: 768px) {
    #homepage-grid .homepage__carousel .swiper-wrapper {
        margin-top: 0 !important;
    }
}