:root {
    --delay: 300ms;
    --duration: 800ms;
    --iterations: 1;
	--nav-pc-h: calc(76.953px + 8px);
    --nav-tb-h: calc(59.984px + 16px);
    --nav-sp-h: calc(44.984px + 16px);
}
.pr {
    margin-top: var(--nav-sp-h);
}
.svgclip {
    width: 0;
    height: 0;
}

.carousel {
    position: relative;
    width:100%;
    height: 70vw;
	margin-bottom: 3rem;
}
.carousel-inner{
    position: absolute;
    -webkit-clip-path: url(#hero-clip);
    clip-path: url(#hero-clip);
    top:0;
	right: -20px;
    width:110%;
    height: auto;
    }
.carousel::after {
	content:'';
	position: absolute;
	width: 70px;
	height: 500px;
	top: 30px;
	right: -100px;
	transform: skew(20deg) ;
	height: -webkit-fill-available;
	background-color: rgba(3,67,158,0.5);
	-webkit-transform: skew(20deg) ;
	-moz-transform: skew(20deg) ;
	-ms-transform: skew(20deg) ;
	-o-transform: skew(20deg) ;
}
@media (min-width: 576px) {
	.carousel::after {width: 150px; right: -120px;}
}
@media (min-width: 768px) {
	.carousel::after {width: 80px; right: -40px;}
}
.carousel-indicators {
	position: absolute;
	left: 5%;
	top: 100%;
	height: fit-content;
	z-index: 2;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	width:100%;
	list-style: none;
	transform: translateY(-50%) ;
	-webkit-transform: translateY(-50%) ;
	-moz-transform: translateY(-50%) ;
	-ms-transform: translateY(-50%) ;
	-o-transform: translateY(-50%) ;
}
.carousel-indicators [data-bs-target] {
    box-sizing: content-box;
    flex: 0 1 auto;
    width: 100%;
    height: inherit;
    padding: 0;
    margin-right: 0;
    margin-left: 0;
    text-indent: 0;
    cursor: pointer;
    background-color: transparent;
    background-clip: none;
    border: none;
    border-top: none;
    border-bottom: none;
    opacity: 1;
    transition: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
}
.carousel-indicators li {
    font-size: 2rem;
    font-weight: bolder;
    display: none;
}
.carousel-indicators li:nth-child(2) {
    font-size: 2rem;
}
.carousel-indicators li:last-child {
    font-size: 2rem;
}
.carousel-indicators li.active {
    display: block;
}
@media(min-width: 768px) {
	.carousel {
		height: 43.75vw;
		margin-bottom: 0;
	}
	.carousel-inner{
		width: 63%;
		right:  0;
	}
	.carousel::after {
		/* content:'';
		position: absolute;
		-webkit-clip-path: url(#hero-clip2);
		clip-path: url(#hero-clip2);
		top:0;
		right: 0;
		width:63%;
		height: 43.75vw;
		height: -webkit-fill-available;
		background-color: rgba(3,67,158,0.5); */
		content:'';
		position: absolute;
		width: 10vw;
		height: 36.75vw;
		top: 3vw;
		right: -30px;
		transform: skew(20deg) ;
		background-color: rgba(3,67,158,0.5);
		-webkit-transform: skew(20deg) ;
		-moz-transform: skew(20deg) ;
		-ms-transform: skew(20deg) ;
		-o-transform: skew(20deg) ;
	}
	.carousel-indicators{
		width: 50%;
		left: 15%;
		top: 50%;
	}
	.carousel-indicators li {
		font-size: 5vw;
	}
	.carousel-indicators li:nth-child(2) {
		font-size: 5vw;
	}
	.carousel-indicators li:last-child {
		font-size: 5vw;
	}
}
.reveal-text,
.reveal-text::after {
	-webkit-animation-delay: var(--animation-delay, 2s);
	        animation-delay: var(--animation-delay, 2s);
	-webkit-animation-iteration-count: var(--iterations, 1);
	        animation-iteration-count: var(--iterations, 1);
	-webkit-animation-duration: var(--duration, 800ms);
	        animation-duration: var(--duration, 800ms);
	-webkit-animation-fill-mode: both;
	        animation-fill-mode: both;
	-webkit-animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
	        animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
}

.reveal-text {
	--animation-delay: var(--delay, 0);
	--animation-duration: var(--duration, 800ms);
	--animation-iterations: var(--iterations, 1);
	position: relative;
    display: block;
	-webkit-animation-name: clip-text;
	        animation-name: clip-text;
	color: #022193;
	white-space: nowrap;
	cursor: default;
    /* font-size: 5vw; */
    font-weight: 900;
	margin:0;
}
.reveal-text span{
	box-decoration-break: clone;	
	-webkit-box-decoration-break: clone;
	line-height:1.7;
	background: linear-gradient(#ffffff 100%, transparent 0%);
	padding: 0 10px 2px;
	display:inline;
}

	@media(min-width: 992px) {
		.reveal-text span{
			background:transparent;
			padding: 0;
			line-height: 1;
		}
	}

.reveal-text::after {
		content: "";
		position: absolute;
		z-index: 999;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #d5e1ee;
		transform: scaleX(0);
		transform-origin: 0 50%;
		pointer-events: none;
		-webkit-animation-name: text-revealer;
		        animation-name: text-revealer;
	}


@-webkit-keyframes clip-text {
	from {
		-webkit-clip-path: inset(0 100% 0 0);
		        clip-path: inset(0 100% 0 0);
	}
	to {
		-webkit-clip-path: inset(0 0 0 0);
		        clip-path: inset(0 0 0 0);
	}
}


@keyframes clip-text {
	from {
		-webkit-clip-path: inset(0 100% 0 0);
		        clip-path: inset(0 100% 0 0);
	}
	to {
		-webkit-clip-path: inset(0 0 0 0);
		        clip-path: inset(0 0 0 0);
	}
}


@-webkit-keyframes text-revealer {
	
	0%, 50% {
		transform-origin: 0 50%;
	}
	
	60%, 100% {
		transform-origin: 100% 50%;		
	}

	
	60% {
		transform: scaleX(1);
	}
	
	100% {
		transform: scaleX(0);
	}
}


@keyframes text-revealer {
	
	0%, 50% {
		transform-origin: 0 50%;
	}
	
	60%, 100% {
		transform-origin: 100% 50%;		
	}

	
	60% {
		transform: scaleX(1);
	}
	
	100% {
		transform: scaleX(0);
	}
}