body {
	margin: 0;
	background-color: #ffffff;
 }
 
.snap-container {
		perspective: 1000px; 
		background-color: #ffffff;
}
 
/* 
 a {
  color: #FFFFFF;
}
*/

/* ================================
   Fonts & Typography
================================ */


.fontDefault {
	font-size: clamp(1rem, 4vw, 0.8rem);

}
	
.font-medium {
	font-size: clamp(1rem, 4vw, 2rem);
}
	
.font-stroke {
	color: #00000052;
	-webkit-text-stroke: 1px #ffffff;
	text-stroke: 1px #ffffff;
}

.font-xl{
	font-size: clamp(2rem, 3vw, 3rem);

}
	
.font-white {
	color: white;
}
	
.letter-spacing-3 {
	letter-spacing: 0.3em;
}
	
		
.letter-spacing-1 {
	letter-spacing: 0.1em;
}

h1 {
  font-size: clamp(1rem, 8vw, 3rem);
  line-height: 1em;
}

h2 {
  font-size: clamp(1rem, 4vw, 1.8rem);
}

.montserrat-title {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}

.montserrat-300 {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.montserrat-600 {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.montserrat-400 {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.montserrat-100 {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
}

.orbitron-100 {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
}

.orbitron-200 {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}

.orbitron-300 {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

.orbitron-600 {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.orbitron-900 {
  font-family: "Orbitron", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}

.cinzel-400 {
  font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.cinzel-600 {
  font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.cinzel-800 {
  font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
}

.cinzel-900 {
  font-family: "Cinzel", serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
}

.italic {
  font-style: italic;
}


/* ================================
   Borders
================================ */


 
 .border-sides {
	border-style: solid; 
	border-width: 0px 5px 0px 5px !important; 
	border-color: white !important;
 }
 
 .border-top {
	border-style: solid; 
	border-width: 5px 0px 0px 0px !important; 
	border-color: white !important;
 }
 
 .border-none {
	 border: none !important;
	 
 }
 
 .border-faint {
	border-style: solid; 
	border-width: 1px 1px 1px 1px !important; 
	border-color: #ffffff1f !important;
 }
 
 .border-left-10 {
	 border-left: solid #ffffff4a 10px !important;
	 border-bottom-left-radius: 10px !important;
	 border-top-left-radius: 10px !important;
 }
 
 .border-right-10 {
	  border-right: solid #ffffff4a 10px !important;
	 border-bottom-right-radius: 10px !important;
	 border-top-right-radius: 10px !important;
 }
 
 .box-padding {
	 padding: 5em !important;
 }
 
 .gradient-btn {
  position: relative;
  padding: 14px 24px;
  border: none;
  background: linear-gradient(135deg, #6fffe9, #b388ff);
  color: #000;
  cursor: pointer;
  border-radius: 8px;
  overflow: hidden; /* required */
}

.gradient-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;                /* border thickness */
  height: 100%;
  background: linear-gradient(
    180deg,
    #00f5ff,
    #7cffcb,
    #b388ff
  );
}

 
 
/* ================================
   CONTACT FORM
================================ */


	.form-input {
		height: 3em;
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(255, 255, 255, 0.05);
		/* border-radius: 0.25em; */
		border: none;
		border: solid 1px rgb(132 132 132 / 15%);
		color: inherit;
		display: block;
		outline: 0;
		text-decoration: none;
		width: 100%;
		padding: 1%
	
	}

	form .form-field.form-half.form-first {
		padding: 0 4% 0 0;
	}
	
	form .form-field.form-half {
		width: 48%;
		float: left;
	}
	
	form .form-field {
		margin: 0 0 1em 0;
	}
	
	
	.form-textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background: rgba(255, 255, 255, 0.05);
		/* border-radius: 0.25em; */
		border: none;
		border: solid 1px rgb(132 132 132 / 15%);
		color: inherit;
		display: block;
		outline: 0;
		text-decoration: none;
		width: 99%;
		padding: 1%
	}
	
	.form-threequarters {
		width:75%;
		margin:auto;
	}

	.form-tcenter {
		text-align:center;
	}

	.tright {
		text-align:right;
	}

	.form-padl {
		padding:3em;
	}

	.form-padlxl {
		padding-left:4em
	}

	.form-padrxl {
		padding-right:4em
	}

	.form-padts {
		padding-top:1em;
	}

	.form-padbs {
		padding-bottom:1em;
	}

	h2.title {
		text-transform: uppercase;
		font-weight: 100;
		font-size:2em;
	}

	.form-bordert {
		border-top:1px solid rgba(255,255,255,0.2);
	}

	.form-clear {
		clear:both;
	}

	.form-secondaryt {
		font-size:0.8em;
	}

	

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

		.form-padl {
			padding:0em;
		}

		.form-threequarters {
			width:95%;
			margin:auto;
		}
		
		form .form-field.form-half.form-first {
			
		}
		
		form .form-field.form-half {
			width: 100%;
			float: none;
			padding: 0;
		}
		
		form .form-field.form-half.form-first {
			padding: 0;
		}
		
		

	}

 
 /* ================================
   Layout & Containers
================================ */



  
 canvas {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
	background: transparent !important;
 }
  
.container {
	  display: flex;
	  justify-content: center; 
	  align-items: center;   
	   width: 100%;           
}

.box {
  z-index: 1;
  display: flex;             
  justify-content: space-between; 
  /*gap: 30px;                  */
  padding: 20px;
  /*align-items: center;*/
  align-self: stretch;
}

.call-out {
	    min-height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.box-card {
	background-color: #ffffff33;
    padding: 30px;
    border-top: solid 1px white;
    border-bottom: solid 1px white;
	}
	
.box-card-dark {
	background-color: #FFFFFF;
    padding: 30px;

	border-radius: 10px;
}

.box-center {
  z-index: 1;
  gap: 1em;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: stretch;
  
}

.box-top {
  z-index: 1;
  display: flex;             
  justify-content: space-between; 
  gap: 30px;
  padding: 20px;
  align-self: flex-start;
}

.box-inner {
	padding: 2%;
    background-color: #ffffffa3;
}

.box20 {
    flex: 0 0 20%;
    min-width: 0;              /* 🔑 CRITICAL */
    padding: 1rem;

    overflow: hidden;          /* optional */
    word-break: break-word;    /* legacy support */
    overflow-wrap: anywhere;   /* modern, best */
    }
	
.box30 {
    flex: 0 0 30%;
    min-width: 0;              /* 🔑 CRITICAL */
    padding: 1rem;

    overflow: hidden;          /* optional */
    word-break: break-word;    /* legacy support */
    overflow-wrap: anywhere;   /* modern, best */
    }

.box15 {
    flex: 0 0 15%;   /* don’t grow, don’t shrink, fixed 15% */
    padding: 1rem;
    }

.flex-vertical {
	flex-direction: column;
}

.align-self-flex-start {
	align-self: flex-start;
}
	
.box100 {
      flex: 1 1 100%;  
      padding: 1rem;
    }
	
.box80 {
    flex: 1 1 80%;   /* don’t grow, don’t shrink, fixed 30% */
    padding: 1rem;
    }

.box70 {
      flex: 1 1 70%;   /* don’t grow, don’t shrink, fixed 70% */
      padding: 1rem;
    }


.box > #s1oa,
.box > #s1ob {
  flex: 1;
  min-width: 0;
}


.box > .opaque {
  position: relative; 
  width: 35%;
  height: 30dvh;
}

.gradient {
 /* background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);*/
	background: linear-gradient(-45deg, #7e3b26, #300d44, #0a3f53, #09493a);
  background-size: 400% 400%;
  animation: gradient 15s ease infinite;
  height: 100%;
}

.gradient-lux {
	background: linear-gradient(-45deg, #7e3b2657, #300d4478, #0a3f5375, #09493a75);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}


@keyframes gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


.gradient-border-bottom {
	border-bottom: 1px solid !important;
	border-image: linear-gradient(
	90deg,
	rgba(0, 183, 255, 1) 0%,
	rgba(87, 145, 199, 1) 50%,
	rgba(188, 83, 237, 1) 100%
  ) 1 !important;
  border-top:none !important;
}


.scene1-opaque {
	transform-origin: top center;
	transform-style: preserve-3d;
	transition: transform 0.1s ease-out;
	position: sticky;
	text-align: center;
	width: 60%;
	height: 50%;
	background: rgb(255 255 255 / 68%);
	color: #434242;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	padding: 20px;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	align-items: center; 
	border: solid 1px #ffffff36;
 }
 
 
 #s2oa {
	display: flex;
    align-items: center;
    min-height: 100vh;
    justify-content: center;
	width: 100%;
 }
 
 #s1o-bak {
	width: 100%;
    max-width: 1100px;
	z-index: 10000;
	height: 60vh;
    display: grid;
    align-content: center;
 }
 
  #s1o {
	width: 100%;
    max-width: 1100px;
	z-index: 10000;
	height: 60vh;
    display: grid;
    align-content: flex-start;
    top: 20%;
    position: absolute;
 }
 
 #sTo {
	width: 100%;
    max-width: 1100px;
	z-index: 10000;
	display: grid;
    align-content: flex-start;
    width: auto;
    position: absolute;
	text-align: center;
	top: 20%;
 }
 
 #thora-why {
	top: 20%;
    position: relative;
	text-align: center;
 }
 
 .thora-button {
	width: 100%;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
 }
 
 #s3oa {
	 display: grid;
	 justify-content: center;
 }
 
 #s4oa, #s5oa {
	display: flex;
    align-items: center;
    min-height: 800px;
    justify-content: center;
	width: 100%;
    max-width: 90%;
 }
 
#scene2 {
	    background: linear-gradient(180deg, #ffffff 0%, #d6e4f1 40%, #eef9f8 100%);
}	
 .scene2-opaque {
	transform-origin: top center;
    transform-style: preserve-3d;
    transition: transform 0.1s ease-out;
    position: sticky;
	text-align: center;
    height: auto;
    color: #434242;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    padding: 20px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;	 
 }
 
 
 .scene4-opaque {
	transform-origin: top center;
    transform-style: preserve-3d;
    transition: transform 0.1s ease-out;
    position: sticky;
	text-align: center;
    width: 60%;
    height: 50%;
    background: rgb(255 255 255 / 15%);
    color: #434242;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    padding: 20px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-right: solid 1px #e8e8e8;
    border-bottom: solid 1px #d3d3d366;
    border-top: 5px solid white;
	border-left: solid 1px #ffffff;
	 
 }
 
 .scene5-opaque {
	transform-origin: top center;
    transform-style: preserve-3d;
    transition: transform 0.1s ease-out;
    position: sticky;
	text-align: center;
    width: 60%;
    height: 50%;
    background: rgb(173 173 173 / 15%);
    color: #434242;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    padding: 20px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-right: solid 1px #e8e8e8;
    border-bottom: solid 1px #d3d3d366;
    border-top: 5px solid black;
	border-left: solid 1px #ffffff;
	 
 }
 
 .scene21-opaque {
	 transform-origin: top center;
    transform-style: preserve-3d;
    transition: transform 0.1s ease-out;
    position: sticky;
    text-align: center;
    width: 60%;
    height: 50%;
    background: rgb(173 173 173 / 10%);
    color: #434242;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 10px;
    padding: 20px;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-right: solid 1px #5d5d5d66;
    border-bottom: solid 1px #5d5d5d66;
    border-top: solid 1px #ffffff29;
    border-left: solid 1px #ffffff21;
	
 }
 
 .scene31-opaque {
	transform-origin: top center;
	transform-style: preserve-3d;
	transition: transform 0.1s ease-out;
	position: sticky;
	text-align: center;
	width: 60%;
	height: 50%;
	background: rgb(92 92 92 / 10%);
	color: white;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 10px;
	padding: 20px;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	align-items: center; 
	border: solid 1px #ffffff12;
	border-top: solid white 5px;
	border-bottom: solid white 5px;
 }
 
 .opaque-height-auto {
		height: auto !important;
	}
	
.opaque-small {
	width: 60% !important;
}

.shadow-light {
	box-shadow: 10px 13px 20px 0px rgb(0 0 0 / 3%);
}

 
 .opaque-left {
	/*left: 2%;*/
	position: absolute;
	width: 40%;
	border: solid 1px #f0f0f0;
	box-shadow: 10px 13px 20px 0px rgb(0 0 0 / 3%);
	background: rgb(92 92 92 / 0%);
	align-items: start; 
	height: auto;
}

.opaque-floating{
	text-align: left;
    width: 40% !important;
    top: 50px;
    margin-left: 50px;
    height: 80% !important;
    border-radius: 10px;
}

.margin-top-30 {
	margin-top:30px;
}


.pipe {
  display: none;
}


#slickwave {
	width: 100%;
	height: 60vh;    
	overflow: hidden;
	align-self: center;         
	justify-self: stretch;      
	z-index: 0;                 
	pointer-events: none;
	position: absolute;
	top:10%;
	opacity: 0.4;
}

#scene1 {
	/*background: url(/images/v4/butterfly.png) no-repeat left, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);*/
	background: url(https://storageozeast.blob.core.windows.net/public/external_content/website-images-container/hero.webp) no-repeat left, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);
	height: 110vh;
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#scene2 {
  display: grid;
  min-height: 600px; 
  position: relative;
  overflow: hidden;
  min-height: 110vh;
}

#scene2 .box { 
  z-index: 1;
  padding: 0px;
  padding-top: 30px;
  padding-bottom: 30px; 
  width: 80%;
  margin: auto;
 }

#scene3 {
  display: grid;
  min-height: 600px; 
  position: relative;
  overflow: hidden;
  height: 100vh;
}

#scene4 {
  display: grid;
  min-height: 600px; 
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  background: linear-gradient(180deg, #ffffff 0%, #d6e4f1 40%, #eef9f8 100%);
}

#scene5 {
  display: grid;
  min-height: 600px; 
  position: relative;
  overflow: hidden;
  min-height: 100vh;
}

#scene-thora {
	background: url(/images/v4/thora.webp) no-repeat left, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);
	height: 110vh;
	background-position: center;
	background-size: cover;
}

#sceneProvenate {
  display: grid;
  min-height: 600px; 
  position: relative;
  overflow: hidden;
  height: 100vh;
}

#scene1 canvas,
#sceneProvenate canvas
#scene3 canvas {
  pointer-events: none !important;
   background: transparent !important;
}

#sceneCase1 {
	padding:0px;
	background-color: #ebf4f6;
	display: flex;
    align-items: stretch;
}

#sceneCase3 {
	/*background-color: #3b1f77;*/
	background-color: #b4c2a9;
	color: #434242;
	padding:0px;
}

#sceneCase4 {
	background-color: #3b1f77;
	color: white;
	padding:0px;
}

#sceneCase1Info, #sceneCase3Info, #sceneCase4Info{
	/*min-height: 300px;
	width: 100%;
	background-repeat: no-repeat;
	border-radius: 10px;
	background-position: center;
	background-size: contain;
	display: flex;
	align-items: center;
	justify-content: center;*/
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	/*padding: clamp(2rem, 4vw, 6rem);*/
}

#sceneCase1Info video, #sceneCase3Info video {
	box-shadow: 0 0 20px 12px rgb(255 255 255 / 19%);
}


.section-title {
	height: auto !important;
	width: auto;
	top: 10%;
	position: relative;
		
}

button,
input[type="button"],
input[type="submit"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0;
    padding-inline: 0;
    padding: 0;
    background-color: #ffffff00;
    border: none;
}

.button-black-round {
	background: black;
    color: white;
    padding: 15px;
    border-radius: 30px;
    border: none;
}

.button-black-square {
	background: black;
    color: white;
    padding: 15px;
    border: none;
	border-left: white solid 4px;
    border-right: white solid 4px;
}
    
.button-white-square {
	background: white;
    color: black;
    padding: 15px;
    border: none;
	/*border: black solid 1px;*/
}

/*
#slickwave canvas {
  display: block;
  height: 100%;
  background: transparent;
	width: 100% !important;
	height: auto;
	max-width: 100vw; 
}
*/


.separator20 {
	margin-top: 20px;
}

.separator40 {
	margin-top: 40px;
}

.separator100 {
	margin-top: 100px;
}

.separator200 {
	margin-top: 200px;
}

.separator300 {
	margin-top: 300px;
}

.padding-20 {
	padding: 20px;
}

.padding-top-50 {
	padding-top: 50px;
}
.padding-bottom-50 {
	padding-bottom: 50px;
}

.tagline {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  text-align: center;
}



.text-gray {
	color: #4d4c4c;
}

.text-white {
	color: #ffffff;
}

ul, ol {
  margin: 0;        
  padding-left: 15px;  
  list-style-type: square;
}

.underline {
	text-decoration: underline;
	text-decoration-thickness: 0.1px;
	text-underline-offset: 4px;
	text-decoration-color: hsl(0deg 0% 100% / 34%);
}

.underline-overline {
	text-decoration: underline overline;
	text-decoration-thickness: 0.1px;
	text-underline-offset: 4px;
	text-decoration-color: hsl(0deg 0% 100% / 34%);
}

.overline-desktop {
	text-decoration: overline;
}


	
.white-back{
	background-color: white;
}

.light-grey-back {
	background-color: #f9f9f9;
}

#s2ob {
		display: none;
	}

.visible-large {
	display: block;
}

.width-100-80 {
	width: 100%;  
  }	

.width-100-88 {
	width: 100%;  
  }

/* ================================
   Images
================================ */

.provenate {
	width: 100%;
	height: 100px;
    background-image: url(/images/v4/provenise.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	 align-self: flex-start;
}

.about-profiles {
	width: 98%;
    color: #ffffff;
    overflow-y: scroll;
    height: 80vh;
	margin-top: 20px;
}

.about-profiles__inner {
	width: 98%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.about-profile {
	display: flex;
	align-items: flex-start;
	gap: clamp(1.5rem, 4vw, 3rem);
	padding: clamp(1.5rem, 4vw, 3rem);
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06));
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 18px;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	max-height: min(78vh, 760px);
	/*overflow: hidden;*/
}

.about-profile__media {
	flex: 0 0 clamp(220px, 26vw, 300px);
}

.about-profile__image {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, 0.25);
	background: rgba(255, 255, 255, 0.08);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
}

.about-profile__image--placeholder {
	display: grid;
	place-items: center;
	background:
		linear-gradient(145deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.04)),
		linear-gradient(-45deg, rgba(126, 59, 38, 0.55), rgba(10, 63, 83, 0.55));
}

.about-profile__image--placeholder span {
	font-family: "Montserrat", sans-serif;
	font-size: clamp(3rem, 7vw, 5rem);
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #ffffff;
}

.about-profile__content {
	flex: 1 1 auto;
	text-align: left;
	min-width: 0;
	/*align-self: stretch;*/
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.about-profile__eyebrow {
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	color: #000000;
}

.about-profile__name {
	margin: 0;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1;
	color: #000000;
}

.about-profile__title {
	margin: 0.6rem 0 0;
	font-size: 1rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #000000;
}

.about-profile__intro {
	margin: 1.25rem 0 0;
	font-size: 1.15rem;
	line-height: 1.7;
	color: #000000;
}

.about-profile__body {
	font-size: 1rem;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.9);
	margin-top: 1.25rem;
	padding-right: 0.75rem;
	flex: 1 1 auto;
	min-height: 0;
	color: #000000;
}

.about-profile__paragraph {
	margin: 0;
}

.about-profile__paragraph:first-child {
	margin-top: 0;
}

.about-profile__body > .about-profile__paragraph + .about-profile__paragraph {
	margin-top: 1rem;
}

.terms-panel__body,
.privacy-panel__body {
	overflow-y: auto;
}

.terms-panel__body::-webkit-scrollbar,
.privacy-panel__body::-webkit-scrollbar {
	width: 10px;
}

.terms-panel__body::-webkit-scrollbar-track,
.privacy-panel__body::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.08);
	border-radius: 999px;
}

.terms-panel__body::-webkit-scrollbar-thumb,
.privacy-panel__body::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.28);
	border-radius: 999px;
}

.terms-panel__body::-webkit-scrollbar-thumb:hover,
.privacy-panel__body::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.4);
}

.ai-policy {
	width: 98%;
	margin-top: 20px;
}

.ai-policy__inner {
	width: 98%;
}

.ai-policy__panel {
	max-height: min(78vh, 760px);
}

.ai-policy__content {
	width: 100%;
}

.ai-policy__body {
	color: #000000;
}

.ai-policy__tagline {
	margin: 0 0 1.5rem;
	text-transform: uppercase;
	line-height: 1.4;
}

.ai-policy__lead {
	font-size: 1.05rem;
}

.ai-policy__divider {
	margin: 2rem 0;
	border: none;
	border-top: 1px solid rgba(0, 0, 0, 0.12);
}

.ai-policy__section + .ai-policy__section {
	margin-top: 2rem;
}

.ai-policy__section-title {
	margin: 0 0 1rem;
	font-size: 1.35rem;
	color: #000000;
}

.ai-policy__list {
	margin: 1rem 0 0;
	padding-left: 1.2rem;
	color: #000000;
}

.ai-policy__list li + li {
	margin-top: 0.6rem;
}

.terms-panel,
.privacy-panel {
	width: 98%;
	margin-top: 20px;
}

.terms-panel__inner,
.privacy-panel__inner {
	width: 98%;
}

.terms-panel__card,
.privacy-panel__card {
	max-height: min(78vh, 760px);
}

.terms-panel__content,
.privacy-panel__content {
	width: 100%;
}

.terms-panel__body,
.privacy-panel__body {
	color: #000000;
	white-space: normal;
}

.terms-panel__body a,
.privacy-panel__body a {
	color: #0a5c7a;
	text-decoration: underline;
	word-break: break-word;
}

.terms-panel__body img,
.privacy-panel__body img {
	display: block;
	max-width: 100%;
	height: auto;
	margin-top: 1.25rem;
	border-radius: 12px;
	border: 1px solid rgba(0, 0, 0, 0.12);
}

.terms-panel__body br + br,
.privacy-panel__body br + br {
	content: "";
}

/* ================================
   Responsive
================================ */


@media (max-width: 768px) {
	
	#scene1 {
		/*background: url(/images/v4/butterfly.png) no-repeat center, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);*/
		background: url(https://storageozeast.blob.core.windows.net/public/external_content/website-images-container/hero.webp) no-repeat left, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);
		height: 110vh;
		background-size: auto;
		background-position: top;
	}
	
	#scene-thora {
	background: url(/images/v4/thora_v.webp) no-repeat left, radial-gradient(circle at top center, #F7F4EF 0%, #F3EFE6 45%, #EFE9DC 100%);
	height: 110vh;
	background-position: center;
	background-size: contain;
}
	
	#s1o {
		top: 80px;
	}
	
	#sTo {
		max-width: 80% !important;
	}
	
	#s2oa {
		position: relative;
        margin-top: 80px;
        margin-bottom: 80px;
	}
	
	#sceneCase1Info {
		width: 92%;
		min-height: 50vh;
	}
	
	#sceneCase3Info {
		width: 92%;
		height: 100vh;
	}
	
	#slickwave {
		height: 30vh;    
		top:0px;
	}
	
	#s2ob {
		display: block;
	}
	
	#s3oa {
		 display: flex;
		 justify-content: center;
	 }
	
	.visible-large {
		display: none;
	}
	
	.mobile-padding-top-50 {
		margin-top: 50px;
	}
	
	.mobile-padding-top-30 {
		margin-top: 30px;
	}
	
	.scene1-opaque {
		width: 75%;
		height: 70%;
		margin-left: auto;
		margin-right: auto;
		background: rgb(255 255 255 / 68%);
		/*background: rgb(240 240 240 / 67%);*/
	}
	
	
	
	.scene2-opaque {
		text-align: -webkit-auto;
		height: auto;
		border-top: solid 1px #ffffff !important;
	}
	
	.scene4-opaque {
		text-align: -webkit-auto;
		width: 75%;
		height: 70%;
		border-top: solid 2px #ffffff !important;
	}
	
	.scene5-opaque {
		text-align: -webkit-auto;
		width: 75%;
		height: 70%;
		border-top: solid 1px #ffffff !important;
	}
	
	.opaque-height-auto {
		width: 75%;
		height: auto;
	}
	
	.opaque-small {
		width: 78% !important;
	}
	
	
  .box {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	
	.box-center, .box-top {
		display: flex;
		flex-direction: column;
		text-align: center;
		width: 100%;
		padding: 0px;
		align-items: stretch;
	}
	
	.box-inner {
		padding: 5%;
		background-color: #ffffffa3;
	}
  
  .box > .opaque {
	width: 80% !important;  
	position: relative;        
	height: auto; 
	background: rgb(0 0 0 / 24%);		
  }
  
  .provenate {
	  align-self: center;
  }

	.about-profile {
		flex-direction: column;
		max-height: none;
		overflow: visible;
	}

	.about-profile__media {
		flex: 1 1 auto;
		width: 100%;
		max-width: 340px;
	}

	.about-profile__content {
		width: 100%;
	}

	.about-profile__body {
		overflow: visible;
		padding-right: 0;
	}

	.ai-policy {
		width: 100%;
	}

	.ai-policy__inner {
		width: 100%;
	}

	.ai-policy__panel {
		max-height: none;
	}

	.terms-panel,
	.privacy-panel {
		width: 100%;
	}

	.terms-panel__inner,
	.privacy-panel__inner {
		width: 100%;
	}

	.terms-panel__card,
	.privacy-panel__card {
		max-height: none;
	}
  
  .width-100-80 {
	width: 80%;  
  }

	.width-100-88 {
	width: 88%;  
  }	
  
  .overline-desktop {
	text-decoration: none !important;
	}
	
	.shadow-light {
		box-shadow: 10px 13px 20px 0px rgb(0 0 0 / 10%);
	}
	
	.container {
	  flex-direction: column;           
	}
	
	.box1,
    .box2 {
        flex: 1 1 100%; /* let them fill full width */
        width: 100%;    /* ensures 100% width */
	}
	
	.box-padding {
		padding:3em !important;
	}
}

@media (min-width: 768px) {

	
  .tagline {
	flex-direction: row;
  }

  .pipe {
	display: inline;
	margin: 0 0.5rem;
  }
}


/* ================================
   Utilities
================================ */


#epik-global-loader {
	position: fixed;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.2); /* optional dim */
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
	z-index: 9999;
}

#epik-global-loader.active {
	opacity: 1;
	pointer-events: all;
}

.epik-global-loader-inner {
	background: white;
	padding: 20px;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.epik-spinner {
	width: 32px;
	height: 32px;
	border: 3px solid rgba(0,0,0,0.1);
	border-top: 3px solid #333;
	border-radius: 50%;
	animation: epik-spin 0.8s linear infinite;
}

@keyframes epik-spin {
	to { transform: rotate(360deg); }
}

.flex1 {
	flex:1;
}

.hide-me {
	display: none !important;
}

.unhide-me {
	display: block !important;
}
.cursor {
 cursor:pointer;
}
	
.scroll-chevron {
  position: relative;
 /* bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  z-index: 10; */
  cursor: pointer;
}

.scroll-chevron span {
  display: block;
  width: 20px;
  height: 20px;
  border-bottom: 2px solid black;
  border-right: 2px solid black;
  transform: rotate(45deg);
  opacity: 0;
  animation: chevronBounce 2s infinite;
}

.scroll-chevron span:nth-child(1) {
  animation-delay: 0s;
}
.scroll-chevron span:nth-child(2) {
  animation-delay: 0.2s;
}
.scroll-chevron span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes chevronBounce {
  0% {
	opacity: 0;
	transform: rotate(45deg) translateY(0);
  }
  50% {
	opacity: 1;
	transform: rotate(45deg) translateY(5px);
  }
  100% {
	opacity: 0;
	transform: rotate(45deg) translateY(10px);
  }
}

.eye-ball-white {
	padding: 10px;
    border-radius: 20px;
    background-color: #ffffffa3;
    border: solid white 1px;
	width: fit-content;
}


.eye-ball-orange {
	padding: 10px;
    border-radius: 20px;
    background-color: #ff6600;
    width: fit-content;
    color: white;
}

.eye-ball-turquoise {
	padding: 10px;
    border-radius: 20px;
    background-color: #2ca3d3;
    width: fit-content;
    color: white;
}

.corner-box {
  position: relative;
}


/* ================================
   Button Borders
================================ */


.text-positive {
	/*text-decoration: overline;
    text-decoration-color: rgb(32 225 28);
    text-decoration-thickness: 2px;*/
	border-radius: 50px;
    background-color: rgb(32 225 28 / 38%);
    padding: 5px;
    padding-left: 8px;
    padding-right: 8px;
}

.text-negative {
	/*text-decoration: overline;
    text-decoration-color: rgb(32 225 28);
    text-decoration-thickness: 2px;*/
	border-radius: 50px;
    background-color: #ff000070;
    padding: 5px;
    padding-left: 8px;
    padding-right: 8px;
}


/* Top-left & bottom-right */
.corner-box::before,
.corner-box::after {
  content: "";
  position: absolute;
  width: 15px;  /* length of corner line */
  height: 15px;
  border: 2px solid black;
}

.corner-box::before {
  top: -2px;
  left: -2px;
  border-right: none;
  border-bottom: none;
}

.corner-box::after {
  bottom: -2px;
  right: -2px;
  border-left: none;
  border-top: none;
}

/* Top-right & bottom-left */
.corner-inner::before,
.corner-inner::after {
  content: "";
  position: absolute;
  width: 15px;
  height: 15px;
  border: 2px solid black;
}

.corner-inner::before {
  top: -2px;
  right: -2px;
  border-left: none;
  border-bottom: none;
}

.corner-inner::after {
  bottom: -2px;
  left: -2px;
  border-right: none;
  border-top: none;
}


.inset-border::before {
  content: "";
  position: absolute;
  top: 2px;    /* shift in from top */
  left: 2px;   /* shift in from left */
  right: 2px;  /* shift in from right */
  bottom: 2px; /* shift in from bottom */
  border: 2px solid black;
  pointer-events: none; /* don’t block clicks */
}


/* ================================
   MODALS
================================ */
body.modal-open {
  overflow: hidden;
  touch-action: none;
  position: fixed; /* Prevents scroll jump in some browsers */
  width: 100%; /* Ensures the fixed body still occupies full width */
  height: 100vh; /* Ensures the fixed body still occupies full height */
}


 /* Overlay behind the modal */
  .modal-overlay {
    position: fixed;
    inset: 0; /* top/right/bottom/left: 0 */
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    display: grid;
    place-items: center;
  }

  /* The modal itself: fixed size & position */
  .modal {
    position: fixed;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  width: 98vw;
	  height: 94vh;
	  background-color: rgba(0, 0, 0, 0.6); /* semi-transparent backdrop */
	  z-index: 1000;
	  align-items: center;
	  justify-content: center;
	background-color: black;
  }

  /* Internal scrolling for long content */
  .modal-content {
    padding: 1em;
  width: 100%;
  height: 90%;
  overflow: auto;
  border-radius: 8px;
  box-shadow: 0 0 20px rgba(0,0,0,0.4);
  position: relative;l remaining height */
  }

  .modal-header, .modal-footer {
    flex: 0 0 auto;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid #eee;
  }
  .modal-footer { border-top: 1px solid #eee; border-bottom: 0; }

  .modal-title {
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.2;
  }

  .modal-close {
    margin-left: auto;
    background: transparent;
    border: 0;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
  }

/* ================================
   Button Flip
================================ */


.btn-flip {
  position: relative;          
  display: inline-block;      
  white-space: nowrap;         
  height: 40px;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-decoration: none;
  color: #fff;
  outline: 0;

  perspective: 800px;
  transform-style: preserve-3d;
  box-sizing: border-box;
}


.btn-flip::before {
  content: attr(data-front);
  position: static;           
  display: block;
  padding: 0 30px;
  background: #017a91;
  color: #FFFFFF;
  opacity: 1;
  transform: rotateX(0deg);
  z-index: 2;
  transition: transform 0.5s ease, opacity 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.btn-white-purple::before {
	background-color: #ffffff00;
    color: white;
    border: solid 1px white;
}

.btn-white-turquoise::before {
	background-color: #03A9F4;
    color: black;
    border: solid 2px #ffffff;
}

.btn-flip::after {
  content: attr(data-back);
  position: absolute;          
  inset: 0;                    
  display: grid;
  place-items: center;       
  background: #ffffff;
  color: #000000;
  opacity: 0;
  transform: translateY(-50%) rotateX(90deg);
  z-index: 1;
  transition: transform 0.5s ease, opacity 0.5s ease;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  box-sizing: border-box;
}

.btn-white-purple::after {
	background: #b6c2ab;;
}


.btn-flip:hover::before,
.btn-flip:focus-visible::before {
  opacity: 0;
  transform: translateY(50%) rotateX(90deg);
}
.btn-flip:hover::after,
.btn-flip:focus-visible::after {
  opacity: 1;
  transform: rotateX(0deg);
}


.btn-flip:focus-visible {
  outline: 2px solid #000;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .btn-flip::before,
  .btn-flip::after {
    transition: none;
    transform: none !important;
    opacity: 1 !important;
  }
}

@media (max-width: 768px) {
	.btn-flip {
		width: 100%;
	}
}