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

p { 
  margin: 0; 
  white-space: normal;
}

:root {
  background-color: var(--white);

  /* animation */
  --cubic-default: cubic-bezier(0.65, 0.05, 0, 1);
  --duration-default: 0.735s;
  --animation-default: var(--duration-default) var(--cubic-default);
}


html,
body {
	color: var(--black);
	letter-spacing: 0 !important;
}

.list-unstyled {
	list-style: none;
	line-height: 1;
}

.ls-0 { letter-spacing: 0 !important; }

/* —————————————————— LAYOUT —————————————————— */

/* CONTAINERS */
.container-full-desktop {
	width: calc(100% - calc((var(--spacing-60))*2));
	margin: auto;
}

.container-narrow-desktop {
	width: calc(100% - 57.5rem);
	margin: auto;
}

@media only screen and (max-width: 900px) {

	.container-full-desktop,
	.container-narrow-desktop {
		width: calc(100% - calc((var(--spacing-20))*2));
		margin: auto;
	}
}

.w50 { width: 50%; }
.w75 { width: 75%; }
.w100 { width: 100%; }

.max-h-100 { max-height: 100vh; }
.h-100vh { height: 100vh; }

.AspectRatio img.ofit-cover { object-fit: cover !important; }

.lil-aspect-ratio img { object-fit: cover !important; }

.v-middle { vertical-align: middle; }

/* —————————————————— BACKGROUNDS —————————————————— */

.b-neutral-100 { background-color: var(--neutral-100); }
.b-neutral-200 { background-color: var(--neutral-200); }
.b-orange-650 { background-color: var(--orange-650); }
.b-blue-450 { background-color: var(--blue-450); }


/* —————————————————— FONTS —————————————————— */

.f-w-100{ font-weight:100; font-variation-settings:"wght" 100; }
.f-w-200{ font-weight:200; font-variation-settings:"wght" 200; }
.f-w-300{ font-weight:300; font-variation-settings:"wght" 300; }
.f-w-400{ font-weight:400; font-variation-settings:"wght" 400; }
.f-w-500{ font-weight:500; font-variation-settings:"wght" 500; }
.f-w-600{ font-weight:600; font-variation-settings:"wght" 600; }
.f-w-700{ font-weight:700; font-variation-settings:"wght" 700; }
.f-w-800{ font-weight:800; font-variation-settings:"wght" 800; }
.f-w-900{ font-weight:900; font-variation-settings:"wght" 900; }


.f-w-100-it{ font-weight:100; font-variation-settings:"wght" 100, "ital" 900; }
.f-w-200-it{ font-weight:200; font-variation-settings:"wght" 200, "ital" 900; }
.f-w-300-it{ font-weight:300; font-variation-settings:"wght" 300, "ital" 900; }
.f-w-400-it{ font-weight:400; font-variation-settings:"wght" 400, "ital" 900; }
.f-w-500-it{ font-weight:500; font-variation-settings:"wght" 500, "ital" 900; }
.f-w-600-it{ font-weight:600; font-variation-settings:"wght" 600, "ital" 900; }
.f-w-700-it{ font-weight:700; font-variation-settings:"wght" 700, "ital" 900; }
.f-w-800-it{ font-weight:800; font-variation-settings:"wght" 800, "ital" 900; }
.f-w-900-it{ font-weight:900; font-variation-settings:"wght" 900, "ital" 900; }


.t-lh-05 { line-height: 0.5 }
.t-lh-06 { line-height: 0.6 }
.t-lh-07 { line-height: 0.7 }
.t-lh-08 { line-height: 0.8 }
.t-lh-09 { line-height: 0.9 }
.t-lh-095 { line-height: 0.95 }
.t-lh-1 { line-height: 1 }
.t-lh-11 { line-height: 1.1 }
.t-lh-112 { line-height: 1.12 }
.t-lh-115 { line-height: 1.15 }
.t-lh-118 { line-height: 1.18 }
.t-lh-12 { line-height: 1.2 }
.t-lh-125 { line-height: 1.25 }
.t-lh-13 { line-height: 1.3 }
.t-lh-14 { line-height: 1.4 }
.t-lh-15 { line-height: 1.5 }
.t-lh-16 { line-height: 1.6 }
.t-lh-17 { line-height: 1.7 }
.t-lh-18 { line-height: 1.8 }
.t-lh-19 { line-height: 1.9 }
.t-lh-30 { line-height: 3rem }

@media only screen and (max-width: 900px) {
  .f-m-w-100{ font-weight:100; }
  .f-m-w-200{ font-weight:200; }
  .f-m-w-300{ font-weight:300; }
  .f-m-w-400{ font-weight:400; }
  .f-m-w-500{ font-weight:500; }
  .f-m-w-600{ font-weight:600; }
  .f-m-w-700{ font-weight:700; }
  .f-m-w-800{ font-weight:800; }
  .f-m-w-900{ font-weight:900; }

  .f-m-w-100-it{ font-weight:100; font-variation-settings:"wght" 100, "ital" 900; }
  .f-m-w-200-it{ font-weight:200; font-variation-settings:"wght" 200, "ital" 900; }
  .f-m-w-300-it{ font-weight:300; font-variation-settings:"wght" 300, "ital" 900; }
  .f-m-w-400-it{ font-weight:400; font-variation-settings:"wght" 400, "ital" 900; }
  .f-m-w-500-it{ font-weight:500; font-variation-settings:"wght" 500, "ital" 900; }
  .f-m-w-600-it{ font-weight:600; font-variation-settings:"wght" 600, "ital" 900; }
  .f-m-w-700-it{ font-weight:700; font-variation-settings:"wght" 700, "ital" 900; }
  .f-m-w-800-it{ font-weight:800; font-variation-settings:"wght" 800, "ital" 900; }
  .f-m-w-900-it{ font-weight:900; font-variation-settings:"wght" 900, "ital" 900; }


  .t-m-lh-05 { line-height: 0.5 }
  .t-m-lh-06 { line-height: 0.6 }
  .t-m-lh-07 { line-height: 0.7 }
  .t-m-lh-08 { line-height: 0.8 }
  .t-m-lh-09 { line-height: 0.9 }
  .t-m-lh-095 { line-height: 0.95 }
  .t-m-lh-1 { line-height: 1 }
  .t-m-lh-11 { line-height: 1.1 }
  .t-m-lh-115 { line-height: 1.15 }
  .t-m-lh-12 { line-height: 1.2 }
  .t-m-lh-125 { line-height: 1.25 }
  .t-m-lh-13 { line-height: 1.3 }
  .t-m-lh-14 { line-height: 1.4 }
  .t-m-lh-15 { line-height: 1.5 }
  .t-m-lh-16 { line-height: 1.6 }
  .t-m-lh-17 { line-height: 1.7 }
  .t-m-lh-18 { line-height: 1.8 }
  .t-m-lh-19 { line-height: 1.9 }
}

/* —————————————————— TEXT STYLES (DESK) —————————————————— */

body {
	font-size: 1.4rem;
	line-height: 1.5;
}

.c-grey-750 { color: var(--grey-750); }
.c-orange-650 { color: var(--orange-650); }
.c-blue-450 { color: var(--blue-450); }


/* —————————————————— TEXT STYLES (MOB) —————————————————— */
@media only screen and (max-width: 900px) {

  body {
	font-size: 1.3rem;
  	line-height: 1.5;
  }

}

/* —————————————————— MARGINS / PADDINGS —————————————————— */


.mx-auto { margin-left: auto; margin-right: auto; }
.my-auto { margin-top: auto; margin-bottom: auto; }
.ml-auto { margin-left: auto; }
.mr-auto { margin-right: auto; }
.mt-auto { margin-top: auto; }
.mb-auto { margin-bottom: auto; }



@media only screen and (max-width: 900px) {

  .mx-m-auto { margin-left: auto; margin-right: auto; }
  .px-m-auto { padding-left: auto; padding-right: auto; }
}


/**
 * ----------------------------------------------------------------------------
 * Aspect ratio
 * ----------------------------------------------------------------------------
 */

 .AspectRatio {
	position: relative;
	margin-left: auto;
	margin-right: auto;
  }
  
  .AspectRatio::before {
	content: "";
	display: block;
  }
  
  .AspectRatio>img {
	max-height: 100%;
	max-width: 100%;
  }
  
  .AspectRatio--withFallback>img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
  }
  
  .no-js .AspectRatio>img {
	display: none !important;
  }
  
  @supports (--css: variables) {
  
	/* For dynamic one, we use CSS variables, which makes it only compatible for newer browsers */
	.AspectRatio--withFallback {
	  padding-bottom: 0 !important;
	  /* For older browsers we use the padding-bottom trick, so make sure to remove it here */
	}
  
	.AspectRatio::before {
	  padding-bottom: calc(100% / (var(--aspect-ratio)));
	}
  
	.AspectRatio>img,
	.no-js .AspectRatio>noscript img {
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 100%;
	  width: 100%;
	}
  }
  
  .AspectRatio--square::before {
	padding-bottom: 100%;
  }
  
  .AspectRatio--short::before {
	padding-bottom: 75%;
  }
  
  .AspectRatio--tall::before {
	padding-bottom: 130%;
  }
  .AspectRatio--taller::before {
   padding-bottom: 150%;
  }
  .AspectRatio--screen::before {
   padding-bottom: 180%;
  }
  
  .AspectRatio--square>img,
  .AspectRatio--short>img,
  .AspectRatio--tall>img,
  .AspectRatio--screen>img {
	position: absolute;
	width: auto;
	height: auto;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
  }
  
  @supports ((-o-object-fit: contain) or (object-fit: contain)) {
  
	.AspectRatio--square>img,
	.AspectRatio--short>img,
	.AspectRatio--tall>img,
	.AspectRatio--taller>img {
	  width: 100%;
	  height: 100%;
	  -o-object-fit: cover;
	  object-fit: cover;
	}
  }
  
  .Image--lazyLoad[data-sizes=auto] {
	width: 100%;
	/* this is needed to help LazySizes calculate the correct size */
  }

.stop {
	clear: both;
}

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

a:hover {
	text-decoration: none !important;
	/*color: inherit;*/
}

.trs-02 {
	transition: all 0.2s;
	-webkit-transition: all 0.2s;
}

.trs-05 {
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
}

.trs-1 {
	transition: all 1s;
	-webkit-transition: all 1s;
}

.trs-15 {
	transition: all 1.5s;
	-webkit-transition: all 1.5s;
}

.trs-2 {
	transition: all 2s;
	-webkit-transition: all 2s;
}

.align-c { text-align: center; }
.align-l { text-align: left; }
.align-r { text-align: right; }

@media only screen and (max-width: 900px) {
	.align-m-c { text-align: center; }
	.align-m-r { text-align: right; }
	.align-m-l { text-align: left; }
}


.t-u { text-transform: uppercase; }
.t-l { text-transform: lowercase; }
.t-cap { text-transform: capitalize; }
.t-underline { text-decoration: underline; }
.ital{ font-style:italic; }

.full-div { width: 100%; height: 100%; }

.back-cover {
	background-size: cover;
	background-position: center center;
}

.ofit-cover { object-fit: cover; }


.d-none { display: none !important; }
.d-ib { display: inline-block; }
.d-b { display: block; }
.d-f {
	display: flex;
	gap: var(--gutter);
}
.f-direction-c { flex-direction: column; }

.d-ig { display: inline-grid; }
.d-g { display: grid; }

.as{ align-items: start; }
.ac{ align-items: center; }
.ae{ align-items: end; }

.d-g.col-1{ grid-template-columns:repeat(1, 1fr); }
.d-g.col-2{ grid-template-columns:repeat(2, 1fr); }
.d-g.col-3{ grid-template-columns:repeat(3, 1fr); }
.d-g.col-4{ grid-template-columns:repeat(4, 1fr); }
.d-g.col-5{ grid-template-columns:repeat(5, 1fr); }
.d-g.col-6{ grid-template-columns:repeat(6, 1fr); }
.d-g.col-7{ grid-template-columns:repeat(7, 1fr); }
.d-g.col-8{ grid-template-columns:repeat(8, 1fr); }

.d-g.gap-5{ grid-gap:0.5rem; }
.d-g.gap-10{ grid-gap:1rem; }
.d-g.gap-15{ grid-gap:1.5rem; }
.d-g.gap-20{ grid-gap:2rem; }
.d-g.gap-25{ grid-gap:2.5rem; }
.d-g.gap-30{ grid-gap:3rem; }
.d-g.gap-35{ grid-gap:3.5rem; }
.d-g.gap-40{ grid-gap:4rem; }
.d-g.gap-45{ grid-gap:4.5rem; }
.d-g.gap-50{ grid-gap:5rem; }
.d-g.gap-55{ grid-gap:5.5rem; }
.d-g.gap-60{ grid-gap:6rem; }
.d-g.gap-640{ grid-gap:64rem; }
.d-g.gap-675{ grid-gap:67.5rem; }
.d-g.gap-710{ grid-gap:71rem; }
.d-g.gap-1820{ grid-gap:182rem; }


.d-f.gap-5{ grid-gap:0.5rem; }
.d-f.gap-10{ grid-gap:1rem; }
.d-f.gap-15{ grid-gap:1.5rem; }
.d-f.gap-20{ grid-gap:2rem; }
.d-f.gap-25{ grid-gap:2.5rem; }
.d-f.gap-30{ grid-gap:3rem; }
.d-f.gap-35{ grid-gap:3.5rem; }
.d-f.gap-40{ grid-gap:4rem; }
.d-f.gap-45{ grid-gap:4.5rem; }
.d-f.gap-50{ grid-gap:5rem; }
.d-f.gap-55{ grid-gap:5.5rem; }
.d-f.gap-60{ grid-gap:6rem; }

@media only screen and (max-width: 900px) {
  .d-g.col-m-1{ grid-template-columns:repeat(1, 1fr); }
  .d-g.col-m-2{ grid-template-columns:repeat(2, 1fr); }
  .d-g.col-m-3{ grid-template-columns:repeat(3, 1fr); }
  .d-g.col-m-4{ grid-template-columns:repeat(4, 1fr); }
  .d-g.col-m-5{ grid-template-columns:repeat(5, 1fr); }
  .d-g.col-m-6{ grid-template-columns:repeat(6, 1fr); }
  .d-g.col-m-7{ grid-template-columns:repeat(7, 1fr); }
  .d-g.col-m-8{ grid-template-columns:repeat(8, 1fr); }

  .d-g.gap-m-0{ grid-gap:0rem; }
  .d-g.gap-m-5{ grid-gap:0.5rem; }
  .d-g.gap-m-7{ grid-gap:0.7rem; }
  .d-g.gap-m-8{ grid-gap:0.8rem; }
  .d-g.gap-m-10{ grid-gap:1rem; }
  .d-g.gap-m-15{ grid-gap:1.5rem; }
  .d-g.gap-m-20{ grid-gap:2rem; }
  .d-g.gap-m-25{ grid-gap:2.5rem; }
  .d-g.gap-m-30{ grid-gap:3rem; }
  .d-g.gap-m-35{ grid-gap:3.5rem; }
  .d-g.gap-m-40{ grid-gap:4rem; }
  .d-g.gap-m-45{ grid-gap:4.5rem; }
  .d-g.gap-m-50{ grid-gap:5rem; }
  .d-g.gap-m-55{ grid-gap:5.5rem; }
  .d-g.gap-m-60{ grid-gap:6rem; }
  .d-g.gap-m-90{ grid-gap:9rem; }

  .d-f.gap-m-5{ grid-gap:0.5rem; }
  .d-f.gap-m-7{ grid-gap:0.7rem; }
  .d-f.gap-m-8{ grid-gap:0.8rem; }
  .d-f.gap-m-10{ grid-gap:1rem; }
  .d-f.gap-m-15{ grid-gap:1.5rem; }
  .d-f.gap-m-20{ grid-gap:2rem; }
  .d-f.gap-m-25{ grid-gap:2.5rem; }
  .d-f.gap-m-30{ grid-gap:3rem; }
  .d-f.gap-m-35{ grid-gap:3.5rem; }
  .d-f.gap-m-40{ grid-gap:4rem; }
  .d-f.gap-m-45{ grid-gap:4.5rem; }
  .d-f.gap-m-50{ grid-gap:5rem; }
  .d-f.gap-m-55{ grid-gap:5.5rem; }
  .d-f.gap-m-60{ grid-gap:6rem; }
}


.w0 { width: 0%;}
.w10 { width: 10%;}
.w20 { width: 20%;}
.w30 { width: 30%;}
.w31 { width: 31%;}
.w32 { width: 32%;}
.w33 { width: 33%;}
.w34 { width: 34%;}
.w35 { width: 35%;}
.w36 { width: 36%;}
.w37 { width: 37%;}
.w38 { width: 38%;}
.w39 { width: 39%;}
.w40 { width: 40%;}
.w45 { width: 45%;}
.w50 { width: 50%;}
.w55 { width: 55%;}
.w60 { width: 60%;}
.w65 { width: 65%;}
.w70 { width: 70%;}
.w75 { width: 75%;}
.w80 { width: 80%;}
.w85 { width: 85%;}
.w90 { width: 90%;}
.w95 { width: 95%;}
.w100 { width: 100%;}
.vw100 { width: 100vw; width: 100dwh; }
.w-fit { width: fit-content;}

.h0 { height: 0%;}
.h100 { height: 100%;}
.vh100 { height: 100vh; height: 100dvh; }
.h-max { height: max-content;}

@media only screen and (max-width: 900px) {
  .m-h-fit-content { height: fit-content; }

  .w-m-0 { width: 0%;}
  .w-m-10 { width: 10%;}
  .w-m-20 { width: 20%;}
  .w-m-30 { width: 30%;}
  .w-m-31 { width: 31%;}
  .w-m-32 { width: 32%;}
  .w-m-33 { width: 33%;}
  .w-m-34 { width: 34%;}
  .w-m-35 { width: 35%;}
  .w-m-36 { width: 36%;}
  .w-m-37 { width: 37%;}
  .w-m-38 { width: 38%;}
  .w-m-39 { width: 39%;}
  .w-m-40 { width: 40%;}
  .w-m-45 { width: 45%;}
  .w-m-50 { width: 50%;}
  .w-m-55 { width: 55%;}
  .w-m-60 { width: 60%;}
  .w-m-65 { width: 65%;}
  .w-m-70 { width: 70%;}
  .w-m-75 { width: 75%;}
  .w-m-80 { width: 80%;}
  .w-m-85 { width: 85%;}
  .w-m-90 { width: 90%;}
  .w-m-95 { width: 95%;}
  .w-m-100 { width: 100%;}

}



/* CURSOR */
.c-pointer { cursor: pointer; }
.pe-none { pointer-events: none; }

/* POSITION */
.p-r { position: relative;}
.p-a { position: absolute; }
.p-f { position: fixed;}
.p-s { position: sticky;}

.p-0 { top: 0; left: 0; }
.p-t-0 { top: 0;}
.p-r-0 { right: 0;}
.p-b-0 { bottom: 0;}
.p-l-0 { left: 0;}


/* Z-INDEX */
.l-0 { z-index: 0; }
.l-1 { z-index: 1; }
.l-2 { z-index: 2; }
.l-3 { z-index: 3; }
.l-4 { z-index: 4; }
.l-5 { z-index: 5; }
.l-6 { z-index: 6; }
.l-7 { z-index: 7; }
.l-8 { z-index: 8; }
.l-9 { z-index: 9; }
.l-10 { z-index: 10; }
.l-11 { z-index: 11; }
.l-12 { z-index: 12; }
.l-13 { z-index: 13; }
.l-14 { z-index: 14; }
.l-15 { z-index: 15; }
.l-100 { z-index: 100; }
.l-101 { z-index: 101; }
.l-102 { z-index: 102; }
.l-103 { z-index: 103; }
.l-104 { z-index: 104; }
.l-105 { z-index: 105; }
.l-110 { z-index: 110; }
.l-999 { z-index: 999; }
.l-1000 { z-index: 1000; }
.l-1001 { z-index: 1001; }
.l-1002 { z-index: 1002; }
.l-1003 { z-index: 1003; }
.l-1004 { z-index: 1004; }
.l-1005 { z-index: 1005; }

.d-ib { display: inline-block; }
.d-b { display: block; }
.d-none { display: none; }
.d-grid { display: grid; }
.grid-full-align { align-items: center; }
.grid-vert-align { align-items: center; }

.op-0 { opacity: 0; }
.op-01 { opacity: 0.1; }
.op-02 { opacity: 0.2; }
.op-03 { opacity: 0.3; }
.op-04 { opacity: 0.4; }
.op-05 { opacity: 0.5; }
.op-06 { opacity: 0.6; }
.op-07 { opacity: 0.7; }
.op-08 { opacity: 0.8; }
.op-09 { opacity: 0.9; }
.op-1 { opacity: 1; }

.of-h { overflow: hidden; }
.of-s { overflow: scroll; }
.of-y-s { overflow-y: scroll; }


/* BLOCK ALIGN */
.ver-align {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: block;
}

.hor-align {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	display: block;
}

.full-align {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


.f-left { float: left }
.f-right { float: right; }
.stop { clear: both; }



.circle { border-radius: 50%; }

.br-5 { border-radius: 0.5rem; }
.br-10 { border-radius: 1rem; }
.br-15 { border-radius: 1.5rem; }
.br-20 { border-radius: 2rem; }
.br-25 { border-radius: 2.5rem; }
.br-30 { border-radius: 3rem; }
.br-35 { border-radius: 3.5rem; }
.br-50 { border-radius: 5rem; }
.br-70 { border-radius: 7rem; }

@media only screen and (max-width: 900px) {
  .br-m-0 { border-radius: 0rem; }
  .br-m-5 { border-radius: 0.5rem; }
  .br-m-10 { border-radius: 1rem; }
  .br-m-15 { border-radius: 1.5rem; }
  .br-m-20 { border-radius: 2rem; }
  .br-m-25 { border-radius: 2.5rem; }
  .br-m-30 { border-radius: 3rem; }
  .br-m-35 { border-radius: 3.5rem; }
  .br-m-50 { border-radius: 5rem; }
  .br-m-70 { border-radius: 7rem; }
}

.br-t-25 { border-radius: 25px 25px 0 0; }
.br-t-30 { border-radius: 30px 30px 0 0; }
.br-t-35 { border-radius: 35px 35px 0 0; }

.br-2b { border-radius: 2vw; }
.br-3b { border-radius: 3vw; }
.br-4b { border-radius: 4vw; }

.horizontal-scroll-father {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
}

.horizontal-scroll-child {
	scroll-snap-align: center;
	flex-shrink: 0;
}


.sw-linear{ transition-timing-function: linear; }
.ss-auto{ width: fit-content; }


/* —— SCROLL ANIMATION —— */

.anime[data-scroll]{
  opacity:0;
  transition:all 0s;
  transition-delay:0;
  will-change: opacity, filter, transform;
}

.anime[data-scroll].is-inview{
  transform:translateY(0rem) !important;
  filter:blur(0px) !important;
  opacity:1;
  transition:all 1s;
  transition-delay:var(--anime-delay-time, 0ms);
}


.ellipsis{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}



.video-full-responsive{
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100vw;
  min-height:100vh;
  transform: translate(-50%, -50%);
  border:0;
}
.video-full-responsive.p_16_9{
  aspect-ratio:16 / 9;
}
.video-full-responsive.p_9_16{
  aspect-ratio:9 / 16;
}




img.full-div[data-scroll]{
  height:120%;
  margin-top:-5%;
}



.ls-001{ letter-spacing:0.01rem }
.ls-002{ letter-spacing:0.02rem }
.ls-003{ letter-spacing:0.03rem }
.ls-004{ letter-spacing:0.04rem }
.ls-005{ letter-spacing:0.05rem }

.ls--001{ letter-spacing:-0.01rem }
.ls--002{ letter-spacing:-0.02rem }
.ls--003{ letter-spacing:-0.03rem }
.ls--004{ letter-spacing:-0.04rem }
.ls--005{ letter-spacing:-0.05rem }































/* —————————————————— PROJECT —————————————————— */

.tk-the-seasons { font-family: "the-seasons",sans-serif; }
.inter { font-family: "Inter",serif; }




html{
  background-color:var(--white);
  color:var(--black);
}

body{
  width:100%;
  opacity:0;
  transition:all 1s;
  background-color:var(--white);
  overflow-x:hidden;
}
body.loaded{
  opacity:1;
}

.scroll-text-enter{
  transform:translateY(6rem);
  opacity:0;
  transition:all 0s;
}
.scroll-text-enter.is-inview{
  transform:translateY(0rem);
  opacity:1;
  transition:all 2s;
}
.scroll-text-enter.is-inview.delay-01{ transition-delay:0.1s; }
.scroll-text-enter.is-inview.delay-02{ transition-delay:0.2s; }
.scroll-text-enter.is-inview.delay-03{ transition-delay:0.3s; }
.scroll-text-enter.is-inview.delay-04{ transition-delay:0.4s; }


.scroll-img-enter.delay-01 img{ transition-delay:0.1s; }
.scroll-img-enter.delay-02 img{ transition-delay:0.2s; }
.scroll-img-enter.delay-03 img{ transition-delay:0.3s; }
.scroll-img-enter.delay-04 img{ transition-delay:0.4s; }

.scroll-img-enter{
  overflow:hidden;
}
.scroll-img-enter img{
  transform:translateY(100%);
  transition:all 1.2s;
}
.scroll-img-enter.is-inview img{
  transform:translateY(0%);
}



.wrapper{
  width:calc(100% - (12rem * 2));
  margin-right:auto;
  margin-left:auto;
}


@media only screen and (max-width: 900px) {
  .wrapper{
    width:calc(100% - (2.4rem * 2));
  }
}















/*  -------------------------------- */
/*  --------- BUTTON --------------- */
/*  -------------------------------- */


.btn{
  display: grid;
  grid-template-columns: max-content max-content max-content;
  border: 1px solid var(--green);
  width: max-content;
  align-items: center;
  font-size:1.6rem;
  line-height:1;
  padding:1rem 1rem 1rem 1.5rem; 
  grid-gap:1.5rem;
  color:var(--green);
  transition:all 0.3s;
  overflow:hidden;
}
.btn .label{
  padding-right:2rem;
}
.btn .line{
  width:1px;
  height:2rem;
  background-color:var(--green);
  transition:all 0.3s;
}


.btn.greenc{
  border: 1px solid var(--greenc);
  color:var(--white);
  background-color:var(--greenc);
}

.btn.type-2 .label{
  padding-right:0rem;
  padding-left:1.5rem;
}

.arrow{
  width:2rem;
  display:block;
}

.btn:hover{
  background-color:var(--green);
  color:var(--white);

}
.btn:hover .line{
  background-color:var(--white);
}

.btn .label{
  position:relative;
  transition:all 0.3s;
}
.btn .label:after{
  content:attr(data-label);
  position:absolute;
  top:0;
  display:block;
  transform:translateY(8rem) skewy(15deg);
  transition:all 0.3s;
}

.btn:hover .label{
  transform:translateY(-8rem);
}
.btn:hover .label:after{
  transform:translateY(8rem) skewy(0deg);
}


@media only screen and (max-width: 900px) {
  .btn{
    font-size:1.8rem;
  }
  .btn .label{
    padding-right:1.5rem;
  }
  .btn .line{
    height:1.8rem;
  }
  .arrow{
    width: 1.8rem;
  }
  
  .btn.small{
    padding:0.8rem 0.5rem 0.8rem 0.5rem; 
  }
  .btn.small .label{
    padding-right:0rem;
    padding-left:0rem;
    font-size:1.2rem;
  }
}



/*  -------------------------------- */
/*  --------- SUBTITLE ------------- */
/*  -------------------------------- */
.subtitle{
  grid-template-columns:max-content auto;
  grid-gap:1.5rem;
  color:var(--greenc);
}
.subtitle .icon svg{
  width:1.6rem;
}
.subtitle .text{
  font-size:1.8rem;
  line-height:1;
}

.subtitle.big .icon svg{
  width:2.4rem;
}

.subtitle.big .text{
  font-size:2.8rem;
}

@media only screen and (max-width: 900px) {
  .subtitle{
    grid-gap:0.8rem;
  }

  .subtitle .icon svg{
    width:1.4rem;
  }

  .subtitle .text{
    font-size:1.6rem;
    line-height:1;
  }

  .subtitle.big .icon svg{
    width:1.4rem;
  }

  .subtitle.big .text{
    font-size:1.6rem;
    line-height:1;
  }
}



/*  -------------------------------- */
/*  --------- CONTROL ARROWS ------- */
/*  -------------------------------- */
.control-arrows .arrow{
  background-color:var(--lightgreen);
  color:var(--green);
  transition:all 0.3s;
  cursor:pointer;
}
.control-arrows .arrow:hover{
  background-color:var(--green);
  color:var(--white);
}
.control-arrows .arrow-left{
  transform:rotate(-180deg);
}



/*  -------------------------------- */
/*  --------- FORM ----------------- */
/*  -------------------------------- */


form .i{
  width:100%;
  display:block;
  border-radius:5rem;
  border:0.3rem solid var(--black);
  font-size:2.4rem;
  padding:1.5rem 4rem;
  background-color:transparent;
  font-family: "franklin-gothic-urw",sans-serif;
}

form .text-area{
  min-height:35rem;
}

@media only screen and (max-width: 900px) {
  form .i{
    font-size:1.8rem;
    padding:1.5rem 3rem;
  }

  form .text-area{
    min-height:17rem;
    border-radius:2rem;
  }
}



/*  -------------------------------- */
/*  --------- EVENT CARD ----------- */
/*  -------------------------------- */

.event-card{
  grid-template-columns: 82.6rem auto;
  grid-gap:3rem;
}

.event-card .cover{
  height:40.5rem;
}

.event-card .text-box{
  background-color:var(--white);
  padding:3.5rem;
  display:grid;
}

.event-card .text-box .info .luogo{
  border-top:1px solid var(--green);
}
.event-card .text-box .location{
  align-self: end;
}
.event-card .text-box .location .location-2{
  border-top:1px solid var(--green);
}


@media only screen and (max-width: 900px) {

  .event-card{
    grid-template-columns:100%;
    grid-gap:1.5rem;
  }

  .event-card .cover{
    height:31.5rem;
  }


  .event-card .text-box{
    height:31.5rem;
    padding:3rem;
  }
}



/*  -------------------------------- */
/*  --------- BLOG CARD ----------- */
/*  -------------------------------- */

.blog-card{
  border:1px solid var(--green);
}


/*  -------------------------------- */
/*  --------- BLOG ROW ------------- */
/*  -------------------------------- */
.blog-row{
  grid-template-columns:max-content auto max-content;
  border-bottom:1px solid var(--green);
}

/*  -------------------------------- */
/*  --------- BLOG NEWS ------------ */
/*  -------------------------------- */
.blog-news{
  border-top:1px solid var(--green);
}

.blog-news .content{
  grid-template-columns:max-content auto;
}



[data-speed]{
  --speed:attr(data-speed-desk);
}

@media only screen and (max-width: 900px) {
  [data-speed]{
    --speed:attr(data-speed-mobi);
  }
}