@charset "UTF-8";

/* --------------------------------------------
FOOTER
--------------------------------------------- */
#footer{
	position : relative;
	z-index : 1;
	overflow : clip;
	color : white;
	background-color : var( --primary );
	&::before{
		position : absolute;
		z-index : 0;
		font-size : 0;
		pointer-events : none;
		content : "";
		background-color : color-mix( in sRGB , white 10% , transparent );
		rotate : -135deg;
	}
	a{
		color : white;
	}
	.logo{
		display : block;
		width : fit-content;
		font-weight : 700;
	}
	li + li{
		margin-top : calc( 10 * var( --remBase ) );
	}
	li a{
		display : grid;
		grid-template-columns : auto auto;
		align-items : center;
		justify-content : start;
		font-size : 1.4rem;
		font-weight : 700;
		line-height : calc( 17 / 14 );
		&::before{
			display : block;
			width : auto;
			aspect-ratio : 1;
			clip-path : polygon( 0 0 , 100% 50% , 0 100% );
			font-size : 0;
			content : "";
			background-color : currentColor;
		}
	}
	@media screen and ( width <= 750px ){
		padding-block : calc( 40 * var( --remBase ) );
		&::before{
			top : calc( 91.18 * var( --remBase ) );
			left : calc( -115.19 * var( --viewportBase ) );
			width : calc( 745.02 * var( --viewportBase ) );
			height : calc( 226.27 * var( --remBase ) );
		}
		.logo{
			img{
				height : calc( 62.05 * var( --remBase ) );
			}
		}
		ul{
			margin-top : calc( 24 * var( --remBase ) );
		}
		li a{
			column-gap : calc( 5 * var( --percentBase ) );
			&::before{
				height : calc( 10 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 750px ){
		display : grid;
		grid-template-columns : auto auto;
		align-items : center;
		justify-content : space-between;
		padding-block : calc( 30 * var( --remBase ) );
		&::before{
			top : calc( -6.64 * var( --remBase ) );
			left : max( calc( 50% - 651px ) , calc( ( -245 + 69 ) * var( --viewportBase ) ) );
			width : min( 745.02px , calc( 745.02 * var( --viewportBase ) ) );
			height : calc( 293.91 * var( --remBase ) );
		}
		.logo{
			img{
				height : calc( 54.27 * var( --remBase ) );
			}
		}
		li a{
			column-gap : calc( 5 * var( --remBase ) );
			&::before{
				height : calc( 10 * var( --remBase ) );
			}
		}
	}
}