:root {
  --first-color: #1e90ff;
  --second-color: #ffffff;
  --first-color-light: #f2f2f2;
  --color-zero: #c0b1c4;
  --color-one: #f3a48e;
  --color-two: #f7b67d;
  --color-three: #ffe5a0;
  --color-four: #91c7ba;
  --color-five: #a0d9f7;

  /* Font & Typography */
  --body-font: sans-serif;
  --normal-font-size: 1rem;
  --smaller-font-size: .750rem;

  /* Backdrop Filter */
  --tw-backdrop-blur: blur(64px);
  --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;

    --gl-color-white: #fff;
    --gl-color-black: #000;
    --gl-color-surface: #F3EFEA;
    --gl-color-surface-dark: #1A1A1A;
    --gl-color-surface-muted: #dadada;
    --gl-color-on-surface: #323232;
    --gl-color-on-surface-subtle: rgba(50, 50, 50, .8);
    --gl-color-on-surface-inverse: #D1D1D1;
    --gl-color-on-surface-contrast: #1A1A1A;
    --gl-color-border: #E8DFD5;
    --gl-color-gray-muted: #9AA0A6;
    --gl-color-gray-dim: #75777B;
    --gl-color-outline-dark: rgba(255, 255, 255, .15);
    --gl-cat-accent: #DDD3C7;
    --gl-cat-accent-soft: #E8DFD5;
    --gl-cat-bg: #F3EFEA;
    --gl-cat-bg-alt: #F3EFEA;
    --gl-cat-fill: #323232;
    --gl-cat-on-accent: var(--gl-color-black);
    --gl-cat-on-accent-soft: var(--gl-color-on-surface);
    --gl-cat-accent-on-dark: var(--gl-cat-accent);
    --gl-inset: 2.4rem;
    --gl-content-max-width: 187.2rem;
    --gl-anchor-offset: 4rem;
    --gl-radius-card: 2.4rem;
    --gl-radius-pill: 999rem;
    --gl-action-border-width: .2rem;
    --gl-space-3xs: .4rem;
    --gl-space-2xs: .8rem;
    --gl-space-xs: 1rem;
    --gl-space-sm: 1.2rem;
    --gl-space-md: 1.6rem;
    --gl-space-lg: 2rem;
    --gl-space-xl: 2.4rem;
    --gl-space-2xl: 3rem;
    --gl-space-3xl: 4rem;
    --gl-space-4xl: 4.8rem;
    --gl-space-5xl: 6rem;
    --gl-space-6xl: 9.6rem;
    --gl-transition-fast: .12s ease;
    --gl-transition-base: .2s ease;
    --gl-font-weight-light: 300;
    --gl-font-weight-regular: 400;
    --gl-font-weight-medium: 500;
    --gl-font-weight-bold: 700;
}



*{
	margin: 0;
    padding: 0;
	box-sizing: border-box;
	-webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
}

body{
	font-family: "Helvetica Neue", "Sans", "arial", "verdana";
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-weight: 300;
	min-height: 100vh;
	--fonts__family--title-fallback: Helvetica, sans-serif;
    --fonts__family--text-fallback: Helvetica, sans-serif;
}

b, strong{
	font-weight: bold;
}

div{
	font-family: system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
	--text-opacity: 1;
}


#container{
	height: 100vh;
	background: linear-gradient(100deg, rgb(250,254,255) 10%, rgb(250,251,255) 25%, rgb(250,245,255) 38%, rgb(254,246,246) 68%, rgb(255,253,231) 90%);
	display: flex;
	align-items: center;
}


.backdrop-blur-3xl{
	backdrop-filter: 
	var(--tw-backdrop-blur) 
	var(--tw-backdrop-brightness) 
	var(--tw-backdrop-contrast) 
	var(--tw-backdrop-grayscale) 
	var(--tw-backdrop-hue-rotate) 
	var(--tw-backdrop-invert) 
	var(--tw-backdrop-opacity) 
	var(--tw-backdrop-saturate) 
	var(--tw-backdrop-sepia);
}

.centering{
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	height: 100%;
}

.zero { background-color: var( --color-zero);}
.one  { background-color: var(--color-one);  }
.two  { background-color: var(--color-two);  }
.three{ background-color: var(--color-three);}
.four { background-color: var(--color-four); }
.five { background-color: var(--color-five); }


.bg-shapes__slot {
    --slot-size: max(50%, 42rem);
}

.bg-shapes__slot--0 {
    top: 20%;
    left: 80%;
    --slot-tilt: -18deg;
    --slot-enter-delay: 0ms;
    --slot-rot-sign: 1;
}

.bg-shapes__slot--1 {
    top: 33%;
    left: 8%;
    --slot-tilt: 22deg;
    --slot-enter-delay: .17s;
    --slot-rot-sign: -1;
}

.bg-shapes__slot--2 {
    top: 50%;
    left: 98%;
    --slot-tilt: -25deg;
    --slot-enter-delay: .36s;
    --slot-rot-sign: 1;
}

.bg-shapes__slot--3 {
    top: 65%;
    left: 14%;
    --slot-tilt: 0deg;
    --slot-enter-delay: .54s;
    --slot-rot-sign: -1;
}





.bg-shapes .bg-shapes__slot--0 .shape {
    --gl-float-duration: 8s;
    --gl-float-amp-x: 8.5rem;
    --gl-float-amp-y: 11rem;
    --gl-float-amp-r: 32deg;
    animation: gl-float-x var(--gl-float-duration) ease-in-out -1.3s infinite, gl-float-y calc(var(--gl-float-duration) * 1.83) ease-in-out -4.7s infinite, gl-float-r calc(var(--gl-float-duration) * 1.45) ease-in-out -2.9s infinite;
}

.bg-shapes__slot .shape__path {
    transition: opacity .26s cubic-bezier(.4, 0, .2, 1) .28s;
}

.shape__path {
  opacity: 0;
}

.shape__path--active {
    opacity: 1;
}


@keyframes gl-float-x{
	0%,to{transform:translate(0)}
	25%{transform:translate(var(--gl-float-amp-x))}
	75%{transform:translate(calc(var(--gl-float-amp-x) * -1))}}


@keyframes gl-float-y{
	0%,to{transform:translate(0)}
	25%{transform:translateY(var(--gl-float-amp-y))}
	75%{transform:translateY(calc(var(--gl-float-amp-y) * -1))}
}

@keyframes gl-float-r{
	0%,to{transform:rotate(0)}
	25%{transform:rotate(var(--gl-float-amp-r))}
	75%{transform:rotate(calc(var(--gl-float-amp-r) * -1))}
}

.gl-float .shape{
	--gl-float-duration: 11s;
	--gl-float-amp-x: .8rem;
	--gl-float-amp-y: 1.6rem;
	--gl-float-amp-r: 3deg;
	--gl-float-delay: 0s;
	--gl-float-phase: 0s;
	--gl-float-state: running;
	animation:
	gl-float-x var(--gl-float-duration) ease-in-out calc(var(--gl-float-delay) + var(--gl-float-phase)) infinite,
	gl-float-y calc(var(--gl-float-duration) * 1.83) ease-in-out calc(var(--gl-float-delay) + var(--gl-float-phase) * .6) infinite,
	gl-float-r calc(var(--gl-float-duration) * 1.45) ease-in-out calc(var(--gl-float-delay) + var(--gl-float-phase)) infinite;
	animation-composition:add;
	animation-play-state:var(--gl-float-state)}

@supports (animation-duration: random(1s,2s)){
	.gl-float .shape{--gl-float-duration: random(6s, 10s);
		--gl-float-amp-x: random(-1.4rem, 1.4rem);
		--gl-float-amp-y: random(1.4rem, 2.6rem);
		--gl-float-amp-r: random(-7deg, 7deg);
		--gl-float-phase: random(-7s, 0s)}}

@media(prefers-reduced-motion:reduce){
	.gl-float .shape{animation:none}}:where(.is-liquid){
		position:relative}.liquid-button__svg{
			position:absolute;
			inset:var(--liquid-svg-inset, 0);
			width:auto;
			height:auto;
			overflow:visible;
			pointer-events:none;
			z-index:-1}
			.liquid-button__svg path{
				fill:var(--liquid-fill, currentColor);
				stroke:var(--liquid-stroke, transparent);
				stroke-width:var(--liquid-stroke-width, 0);
				vector-effect:non-scaling-stroke;
				transition: fill var(--gl-transition-base, .2s ease),stroke var(--gl-transition-base, .2s ease)}.swiper-button-prev:after,
				.swiper-button-next:after{
					color:#fff;
					font-size:1.5rem}
				.swiper-button-prev,
				.swiper-button-next{
					border:1px solid #aba9a9;
					border-radius:50%;
					background:#7c7a7a;
					width:6rem;height:6rem;top:45%}

				@media(width<1024px){.swiper-button-prev,.swiper-button-next{display:none}}.cdk-overlay-container{--mat-dialog-container-max-width: 946px;--mat-dialog-with-actions-content-padding: 0;--mdc-dialog-container-color: #fff;--mat-dialog-headline-padding: 2rem}
				@media(width<768px){.cdk-overlay-container{--mat-dialog-headline-padding: 2rem 1rem 1rem 1rem}}

				html{
					font-family:Google Sans,Helvetica,Arial,sans-serif;
					box-sizing:border-box;
					-webkit-font-smoothing:antialiased;
					-moz-osx-font-smoothing:grayscale;
					font-size:62.5%;
					overflow-x:clip
				}
				
				*,*:before,*:after{box-sizing:inherit}*{margin:0;padding:0}
				html,body{height:100%}ul{list-style-type:none}a{text-decoration:none;color:inherit}


.home-carousel__title[_ngcontent-ng-c2039944287], .home-carousel__about-container[_ngcontent-ng-c2039944287]{
	    position: relative;
    z-index: 1;
    text-align: center;
    font-size: 4.4rem;
    letter-spacing: -1px;
    line-height: 110%;
    font-weight: 500;
    margin-bottom: 5rem;
    max-width: 80%;
    text-wrap-style: balance;
    margin-inline: auto;

    
    color: #fff;
    mix-blend-mode: difference;
    scroll-margin-top: var(--gl-anchor-offset);
}


@media (width > 1024px) {
	.home-carousel__title[_ngcontent-ng-c2039944287] {
    	    font-size: 10rem;
    letter-spacing: -1.133px;
    line-height: 110%;
    margin-bottom: 7.7rem;
  }

    .bg-shapes__slot--0 {
        top: 20%;
        left: 78%;
    }

		.bg-shapes__slot--1 {
        top: 30%;
        left: 8%;
		}

    .bg-shapes__slot--2 {
        top: 47%;
        left: 92%;
    }

    .bg-shapes__slot--3 {
        top: 65%;
        left: 8%;
    }

}


.shape--hexagon {
  color: #48f08b;
}
.bg-shapes__slot {
    position: absolute;
    width: var(--slot-size);
    aspect-ratio: 1;
    rotate: calc(var(--slot-tilt, 0deg) + var(--slot-rot-sign, 1) * var(--morph-twist, 0deg));
    translate: -50% -50%;
    transform: rotateY(var(--shapes-rot, 0deg));
    transform-origin: center;
    transform-style: preserve-3d;
    contain: layout style;
    transition: transform .9s cubic-bezier(.65, 0, .35, 1);
}



--morph-twist {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

--desc-mask-stop {
    syntax: "<percentage>";
    inherits: true;
    initial-value: 100%;
}

--overlay-stop-end {
    syntax: "<percentage>";
    inherits: true;
    initial-value: 100%;
}


.shape--hexagon {
    color: #48f08b;
}

.shape--circle {
    color: #5e9bff;
}

.shape--square {
    color: #ffbdf9;
}

.shape--clover {
    color: #fcc934;
}


.bg-shapes .bg-shapes__slot--0 .shape.shape--hexagon {
  --gl-float-duration: 8s;
  --gl-float-amp-x: 8.5rem;
  --gl-float-amp-y: 11rem;
  --gl-float-amp-r: 32deg;

  animation:
    gl-float-x var(--gl-float-duration) ease-in-out -1.3s infinite,
    gl-float-y calc(var(--gl-float-duration) * 1.83) ease-in-out -4.7s infinite,
    gl-float-r calc(var(--gl-float-duration) * 1.45) ease-in-out -2.9s infinite,
    hexagon-color 3s ease-in-out 0s infinite alternate;
}

@keyframes hexagon-color {
  0% {
    color: #48f08b;
  }

  50% {
    color: #004b05;;
  }

  100% {
    color: #000;
  }
}