@font-face {
  font-family: 'freightneo_probook';
  src: url('../fonts/freight-neo-pro-book.woff2') format('woff2'),
    url('../fonts/freight-neo-pro-book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
*::-webkit-scrollbar {display: none;}
*{-ms-overflow-style: none;scrollbar-width: none;}

:focus,
:focus-visible {
  outline: none;
  box-shadow: none;
}

header {
  display: none;
}
.footer-navigation{
  display: none !important;
}

#container#container.body-container{
  padding: 0 !important;
}

body:has(.slide-page-container.five-screen.splash-loading.d-none) #container {
  width: 100%;
  height: 100% !important;
  background-color: #000059;
  background-image: url('../images/background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  justify-content: center;
  align-items: center;
  gap: 0px;
  position: relative;
  inset: 0;
  padding: 24px !important;
  display: block;
}

#container:not(.no-nav) {
  height:100% !important;
}
#container.no-nav {
  top: 0px !important;
  height: 100% !important;
}
.splash-screen {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 36px;
}
.language-box {
    padding-top: 24px;
}
.language-box select option {
    background: #ffe3e3;
    color: #000;
}
.splash-screen .logo {
  width: 100%;
}

.splash-screen.justify-center {
  justify-content: center;
}

#container .login-link {
  font-weight: 400;
  font-size: 12px;
  color: #fff;
  text-decoration: none;
  font-family: "Host Grotesk", sans-serif;
}

.language-box select {
  border-radius: 100px;
  border: 1px solid #FDE3E3;
  background-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  background-image: url("../images/logos/down-arrow.svg");
  background-repeat: no-repeat;
  background-position-x: 88%;
  background-position-y: 3px;
  color: #FDE3E3;
  font-family: "Host Grotesk", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0%;
  padding: 5px 35px 5px 10px;
}

.splash-screen h2 {
   font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
  font-weight: 500;
  font-size: 48px;
  line-height: 48px;
  text-align: left;
  color: #FDE3E3;
}

.bottom-btn-wrp {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  text-align: center;
  /* padding-bottom: 24px; */
}

.bottom-btn-wrp .lets-begin-btn {
  text-decoration: none;
  background: #FDE3E3;
  box-shadow: 0px 24px 54px 0px #01025A47;
  border-radius: 16px;
  color: #100F08;
  font-family: "Host Grotesk", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  padding: 20px;
  width: 100%;
  text-align: center;
}

.text-placeholder {
  background: #EFEFEF3D;
  border: 0;
  border-radius: 12px;
  width: 100%;
  padding: 24px 20px;
  font-family: Host Grotesk;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  color: #fff;
  margin-top: 24px;
}

.text-placeholder::placeholder {
  color: #fff;
}

.splace-slider-dot {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 8px;
}

.splace-slider-dot span {
  width: 8px;
  height: 8px;
  display: block;
  background: rgb(255 255 255 / 50%);
  border-radius: 100px;
  cursor: pointer;
}

.splace-slider-dot span.active {
  background: #fff;
  width: 18px;
}

/* .second-screen,
.third-screen,
.fourth-screen {
  display: none;
} */

/* .first-screen {
  animation: fadeOut 3s ease-in-out forwards;
} */

/* .first-screen,
.fourth-screen{
  animation: fadeOut 2s ease-in-out forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    display: none;
  }

} */

/* Fade-out class */
.fade-out {
  animation: fadeOut 2s ease-in-out forwards;
}

/* Fade-in class */
.fade-in {
  animation: fadeIn 1s ease-in-out forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Start Screen CSS */
/* #container .slide-page-container {
  width: 100%;
  max-width: 366px;
  inset: inherit !important;
} */
#container .slide-page-container .slide-page {
  width: 100%;
  min-width: 100%;
  padding: 0;
}
.slide-page-container .profile-box {
  display: block;
  width: 100%;
  background-image: none;
  border-radius: 0;
  padding: 0;
  margin: 0;
}
.slide-page-container .slide-page-title{
margin-bottom: 20px;
padding-top: 24px;
}
.slide-page-container .slide-page-title span{
 font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
font-weight: 500;
font-size: 24px;
line-height: 28px;
color: #FDE3E3;
margin-bottom: 20px;
}
.slide-page-container .slide-page-title h2{
 font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
font-weight: 500;
font-size: 48px;
line-height: 50px;
color: #FDE3E3;
margin: 0;
text-align: left;
}
.slide-page-container .profile-box form {
gap: 20px;
padding-bottom : 30px;
}
.slide-page-container form .form-row{
display: block;
}
.slide-page-container .form-row-lable{
font-family: Host Grotesk;
font-weight: 400;
font-size: 14px;
line-height: 16px;
color: #fff;
margin-bottom: 8px;
display: block;
}
.slide-page-container .form-col{
display: flex;
gap: 8px;
width: 100%;
}
.slide-page-container .form-col-field{
position: relative;
    width: 100%;
}

.slide-page-container form .form-row .form-col-field input,
.slide-page-container form .form-row .form-col-field select,
.slide-page-container form .form-row .form-col-field input[type="radio"] + label{
  position: relative;
  background-color: rgb(239 239 239 / 24%);
  border-radius: 12px;
  border: 0;
  font-family: Host Grotesk;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  color: #fff;
  padding: 22px 20px;
  margin: 0;
  width: 100%;
  display: block;
  max-width: 100% !important;
  border: 2px solid transparent;
}
.slide-page-container form .form-row .form-col-field select{
background-image: url("../images/logos/down-arrow.svg");
background-repeat: no-repeat;
background-position-x: 88%;
background-position-y: 25px;
}
.slide-page-container form .form-row .form-col-field select option{
  color: #100F08;
}


.slide-page-container .form-col-field input::placeholder{
color: #fff;
}
.slide-page-container form .form-row .form-col-field input[type="radio"]{
display: none;
}
.slide-page-container form .form-row .form-col-field input[type="radio"]:checked + label {
border-color: #fff;
}
.slide-page-container .bottom-btn-wrp {
display: flex;
flex-direction: column;
gap: 12px;
width: 100%;
text-align: center;
margin-top: 50px;
}

.slide-page-container .bottom-btn-wrp .lets-begin-btn {
text-decoration: none;
background: #FDE3E3;
box-shadow: 0px 24px 54px 0px #01025A47;
border-radius: 16px;
color: #100F08;
font-family: "Host Grotesk", sans-serif;
font-weight: 500;
font-size: 16px;
line-height: 20px;
padding: 20px;
width: 100%;
text-align: center;
}
.slide-page-container .splace-slider-dot {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 8px;
  margin-bottom: 20px;
}
.slide-page-container .splace-slider-dot a {
width: 8px;
height: 8px;
display: block;
background: rgb(255 255 255 / 50%);
border-radius: 100px;
}

.slide-page-container .splace-slider-dot a.active {
  background: #fff;
  width: 18px;
}


/* body:has(.splash-loading.d-none) #container {
  width: 100%;
  height: 100% !important;
  background-color: #000059;
  background-image: url('../images/logos/start-light-bg.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  justify-content: flex-start;
  align-items: center;
  gap: 0px;
  position: relative;
  inset: 0;
  padding: 24px !important;
  overflow-y: auto;
} */

form .form-row .input-container:after{
  background-image: none !important;
}












/* header {
  display: none;
}
#container {
  top: 0;
  height: 100% !important;
  background-image: linear-gradient(45deg, #41c6c5 10%, #5b84fa 50%, #9a41f5 90%);
  justify-content: center;
  align-items: center;
  gap: 50px;
}
#container .login-link {
  font-weight: 300;
  font-size: 14px;
  color: #fff;
  text-decoration: none;
  margin-top: 25px;
}
#container .logo {
  margin-top: 120px;
}
#container .logo .image {
  width: 90px;
  height: 90px;
  background-image: url('../images/logos/splash-logo.png');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 0 auto;
}
#container .logo .text {
  width: 200px;
  height: 50px;
  background-image: url('../images/logos/splash-text.png');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 20px auto;
}
#container .language-box {
  margin-top: auto;
  margin-bottom: 50px;
}
#container .language-box span {
  display: inline-block;
  font-family: 'Existence';
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  border: 1px solid #fff;
  text-decoration: none;
  color: #fff;
  margin: 0 5px;
} */



/* === Splash Animation (Logo + Background) === */

/* Container background animation */
body:has(#first-screen) #container {
  /* Animate background movement */
  /* animation: bgFloat 8s ease-in-out infinite alternate; */
}

/* === Logo animation === */
.splash-screen .logo img {
  width: 305px;
  height: 69px;
  opacity: 1;
  /* transform: scale(0.8);
  animation: logoIntro 2.5s ease-in-out forwards, logoGlow 3s ease-in-out infinite alternate 2.5s; */
}

/* === Keyframes === */

/* Logo entry: fade + scale */
/* @keyframes logoIntro {
  0% {
    opacity: 0;
    transform: scale(0.5) rotate(10deg);
    filter: blur(4px);
  }
  40% {
    opacity: 1;
    transform: scale(1.05) rotate(0);
    filter: blur(0);
  }
  70% {
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
} */

/* Gentle glowing effect after entry */
/* @keyframes logoGlow {
  0% {
    filter: drop-shadow(0 0 4px rgba(255,255,255,0.4));
  }
  100% {
    filter: drop-shadow(0 0 14px rgba(255,255,255,0.9));
  }
} */

/* Background movement (subtle) */
/* @keyframes bgFloat {
  0% {
    background-position: center;
    transform: scale(1);
  }
  100% {
    background-position: 48% 52%;
    transform: scale(1.05);
  }
} */


body:has(.first-screen.splash-loading.d-none) #container {
    animation: none !important;
}


/* NEW  */
.vera-call-you {
    display: flex;
    gap: 12px;
    align-items: start;
    width: 100%;
}
.splash-screen .vera-star-icon img {
    width: auto;
    height: auto;
    position: relative;
    top: 4px;
}
.vera-star-text p,
.vera-star-text h2{
color: #FDE3E3;
font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
font-weight: 700;
font-size: 24px;
line-height: 28px;
margin-bottom: 20px;
text-align: left;
}
.vera-star-text h2 br{
  display: none;
}
.vera-star-text h2{
  margin-bottom: 0px;
}
.vera-star-text .text-placeholder{
    border-radius: 24px;
    margin: 0px;
}
.arrow-btn-wrp {
    display: flex;
    margin-top: 12px;
    gap: 10px;
}

.arrow-btn-wrp .arrow-btn-send {
    width: 68px;
    height: 68px;
    flex-shrink: 0;
    border: 1px solid #FDE3E3;
    background: transparent;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.arrow-btn-wrp .arrow-btn-send img {
    width: auto;
    height: auto;
    filter: invert(1);
}
.splash-screen.third-screen {
    justify-content: flex-start;
}
.splash-birthtime-col {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}
.splash-birthtime-inputs {
    display: flex;
    gap: 12px;
    width: 100%;
}
.splash-birthtime-inputs .form-col-field {
    flex: 1;
}
.splash-birthtime-dont-know {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    width: 100%;
    padding-right: 4px;
}
.splash-birthtime-dont-know input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #100F08;
  cursor: pointer;
  flex: 0 0 18px;
}
.splash-birthtime-dont-know label {
    font-family: "Host Grotesk", sans-serif;
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    cursor: pointer;
    margin: 0;
}
.splash-birthtime-dont-know input[type="radio"]{
  border: 1px solid #fff;
  border-radius: 100px;
  min-width: 18px !important;
  height: 18px !important;  
  width: 18px !important;
  background-image: none !important;
}
.splash-birthtime-dont-know input[type="radio"]:checked:after {
  background: #fff !important;
}
.splash-birthtime-row input[readonly] {
    opacity: 0.85;
}
.slide-page-container .bottom-btn-wrp{
  margin-top: 0;
}
.slide-page-container .bottom-btn-wrp .lets-begin-btn{
  border: 0;
}

.vera-screen-page {
  padding-bottom: 380px;
  width: 100%;
  padding-left: 12px;
  padding-right: 12px;
}

#vera-screen.vera-screen-page {
  padding-top: 70px;
  height: 100%;
  max-height: 100vh;
  max-height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  justify-content: flex-start;
  align-items: stretch;
  overscroll-behavior: contain;
}
#vera-screen.vera-screen-page > * {
  flex-shrink: 0;
  width: 100%;
}

.vera-screen-page .chat-typing-box{
    width: 100%;
    padding: 12px;
    background: transparent;
}
.vera-screen-page .message-box {
  background: linear-gradient(180deg, rgba(121, 0, 249, 0.1) 0%, rgba(151, 123, 251, 0.35) 100%);
  box-shadow: 0px 0px 0px 3px #4856A9 inset;
  padding: 4px;
  border-radius: 28px;
  width: 100%;
  margin: 0;
  backdrop-filter: blur(40px);
}
.message-inside {
  background: linear-gradient(180deg, rgba(85, 75, 175, 0.9) 0%, rgba(85, 75, 175, 0) 100%);
    border-radius: 28px;
}
.message-inside textarea {
    height: 52px;
    background: transparent;
    border: 0;
    max-height: 92px;
    padding: 16px;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    font-family: "Host Grotesk";
    line-height: 20px;
    width: 100%;
}
.message-inside textarea::placeholder{
  color: #fff;
  opacity: 1;
}
.message-inside-ftr{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
}
.message-inside-ftr button{
  background: transparent;
  border: 0;
}
.message-inside-ftr button img{
  width: 24px;
  height: 24px;
}
.message-r.vera-send-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}
.consider-star {
    padding: 0;
    display: block;
    background: transparent;
}
.consider-star h5 {
    padding: 8px 12px 0;
    display: block;
    margin: 0;
    font-family: "Host Grotesk";
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    color: #fff;
}
.consider-star ul {
    width: 100%;
    overflow-x: auto;
    display: flex;
    gap: 12px;
    padding: 12px 12px;
}
.consider-div {
    background: #000059;
    border: 1px solid #9FADFF !important;
    padding: 10px 12px;
    width: max-content;
    border-radius: 12px;
    border: 0;
    font: inherit;
    text-align: left;
}
.consider-div.question-item {
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    min-height: 44px;
}
.consider-div h4 {
    margin: 0;
    padding: 0;
    display: block;
    color: #fff;
    font-family: "Host Grotesk";
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
}
.consider-div p {
    margin: 0;
    padding: 0;
    display: block;
    color: #fff;
    font-family: "Host Grotesk";
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
}
.enter-ask-btn{
  padding: 0 12px 12px;
}
.enter-ask-btn button{
  background: #919EAB3D;
  border-radius: 16px;
  border: 0;
  padding: 22px 16px;
  color: #fff;
  font-family: Host Grotesk;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
}
.action-bottom-side-wrp{
  position: fixed;
  width: 100%;
  bottom: 0px;
  left: 0;
  right: 0;
  background: #01025a;
  z-index: 99;
  padding-bottom: 50px;
  padding-top: 10px;
}
.vera-star-chat-wrp-main {
    position: relative;
    padding: 50px 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 36px;
}
.vera-star-chat-wrp {
    position: relative;
}

.star-chat-show-box {
    background: #FFFFFF47;
    border-radius: 20px 20px 4px 20px;
    box-shadow: 0px 0px 14px 0px #FFFFFF40 inset, 0px 5px 24px 0px #00000040;
    padding: 16px;
    color: #fff;
    font-family: 'Host Grotesk';
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    max-width: fit-content;
    margin-left: auto;
    margin-bottom: 36px;
    width: 250px;
}
.vera-star-chat-wrp .vera-star-text p {
    font-family: Host Grotesk;
    font-weight: 400;
    font-size: 15px;
    color: white;
    line-height: 1.4;
}
.vera-star-chat-wrp .vera-star-text .vera-response-content {
    position: relative;
    font-family: Host Grotesk;
    font-weight: 400;
    font-size: 15px;
    color: white;
    line-height: 1.4;
}
.vera-star-chat-wrp .vera-star-text.is-collapsed .vera-response-content{
  max-height: 146px;
  overflow: hidden;
}
/* .vera-star-chat-wrp .vera-star-text.is-collapsed .vera-response-content:after{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48px;
  background: linear-gradient(180deg, rgba(30, 26, 101, 0) 0%, rgba(30, 26, 101, 1) 100%);
  pointer-events: none;
} */
.vera-star-chat-wrp .vera-star-text .vera-read-more-btn{
  border: 0;
  background: transparent;
  color: #FDE3E3;
  font-family: "Host Grotesk";
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  padding: 0;
  margin-top: 6px;
  cursor: pointer;
}
.continue-replay-vera-box{
  background: linear-gradient(180deg, rgba(85, 75, 175, 0.9) 0%, rgba(85, 75, 175, 0) 50%);
  border-radius: 32px;
  padding: 24px;
}
.continue-replay-vera-box h2{
  padding-bottom: 20px;
  font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
  font-weight: 700;
  font-size: 24px;
  line-height: 28px;
  color: #FDE3E3;
}
.continue-replay-vera-box button{
background: #FDE3E3;
border: 0;
border-radius: 16px;
padding: 20px 14px;
color: #100F08;
text-align: center;
width: 100%;
font-family: Host Grotesk;
font-weight: 500;
font-size: 16px;
line-height: 20px;
}
.continue-replay-vera-box .vera-star-icon{
  margin-bottom: 20px;
}
.continue-replay-vera-box .vera-star-icon img{
  width: 38px;
}
.vera-star-text.vera-first-text {
  width: 100%;
}
.splash-sign-inline{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.splash-sign-inline svg{
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}
#first-screen {
  background-image: url('../images/background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

#second-screen{
  background-image: url('../images/background.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 140px 24px 24px 24px;
}

#third-screen{
  background-image: url('../images/logos/start-light-bg.svg');
  padding: 70px 24px 24px;
  align-items: start;
  background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.home-onboarding-actions{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 0 12px 12px;
}
.home-onboarding-actions button{
  background: transparent;
  border: 1px solid #919EABA3;
  border-radius: 16px;
  padding: 19px 14px;
  color: #fff;
  font-family: Host Grotesk;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  width: 50%;
  text-align: center;
  cursor: pointer;
}
.Onboarding-Q1-screen{
  padding: 70px 24px 24px;
  align-items: start;
  justify-content: flex-start;
}
body.ask-onb-q1-vera-stacked #container {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: block;
  height: 100% !important;
}
body.ask-onb-q1-vera-stacked #Onboarding-Q1-screen.splash-screen,
body.ask-onb-q1-vera-stacked #vera-screen.vera-screen-page {
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
}
body.ask-onb-q1-vera-stacked #Onboarding-Q1-screen.splash-screen {
  padding-top: 70px;
  padding-bottom: 12px;
  justify-content: flex-start;
}
body.ask-onb-q1-vera-stacked #vera-screen.vera-screen-page {
  padding-top: 12px;
}
.onboarding-q1-options{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.onboarding-q1-options button{
  background: #EFEFEF3D;
  border: 1px solid transparent;
  border-radius: 24px;
  padding: 23px 14px;
  color: #fff;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  font-family: Host Grotesk;
  width: 100%;
  text-align: center;
  cursor: pointer;
}
.onboarding-q1-options button.selected{
  border-color: #fff;
  background: #FDE3E33D;
}
.continue-to-vera-options{
  display: flex;
  gap: 12px;
  position: relative;
  z-index: 2;
}
.continue-to-vera-options button{
  pointer-events: auto;
}
.vera-partner-outcome{
  margin-top: 60px;
}
.continue-to-vera-options button{
  background: #EFEFEF3D;
  border: 1px solid transparent;
  border-radius: 24px;
  padding: 23px 14px;
  color: #fff;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  font-family: Host Grotesk;
  width: 100%;
  text-align: center;
  cursor: pointer;
}
.continue-to-vera-options button:hover,
.continue-to-vera-options button.selected{
  border-color: #fff;
  background: #FDE3E33D;
}
.Onboarding-Relationships{
  padding: 70px 24px 24px;
  align-items: start;
}
.Onboarding-Relationships .onboarding-q1-options button:hover,
.Onboarding-Relationships .onboarding-q1-options button.selected{
 border-color: #fff;
 background: #FDE3E33D;
}

/* Select2 (registration: country/state/city) */
#third-screen .select2-container {
  width: 100% !important;
}

#third-screen .select2-container .select2-selection--single {
  height: 68px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgb(239 239 239 / 24%);
  color: #fff;
  display: flex;
  align-items: center;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

#third-screen .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #fff;
  line-height: normal;
  padding-left: 14px;
  padding-right: 42px;
  font-family: Host Grotesk;
  font-size: 16px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

#third-screen .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: rgb(255 255 255 / 70%);
}

#third-screen .select2-container--default.select2-container--open .select2-selection--single,
#third-screen .select2-container--default.select2-container--focus .select2-selection--single {
  border-color: rgb(255 255 255 / 45%);
  background: rgb(253 227 227 / 24%);
  box-shadow: 0 0 0 2px rgb(255 255 255 / 12%);
}

#third-screen .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  right: 10px;
}

#third-screen .select2-container--default .select2-selection--single .select2-selection__arrow b {
  width: 8px !important;
  height: 8px !important;
  border-right: 2px solid #fff !important;
  border-bottom: 2px solid #fff !important;
  transform: rotate(45deg) !important;
  border-left: 0 !important;
  border-top: 0 !important;
  margin: 0 !important;
  top: 28px !important;
  left: auto !important;
  right: 10px !important;
}

.select2-dropdown {
  background: #0c1463 !important;
  border-radius: 12px !important;
  border: 1px solid rgb(255 255 255 / 18%) !important;
  overflow: hidden;
  margin-top: 8px;
  padding: 10px;
  box-shadow: 0 16px 36px rgb(4 7 44 / 52%);
}

.select2-search--dropdown {
  padding: 0 0 8px !important;
  border-radius: 8px;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: #fff !important;
  font-family: Host Grotesk;
  font-size: 15px;
  line-height: 20px;
  font-weight: 500;
  width: 100%;
  box-shadow: 0 0 0px 3px #3a3b7d !important;
  padding: 10px 14px !important;
}

.select2-container--default .select2-results > .select2-results__options {
  max-height: 248px;
  padding-right: 2px;
  scrollbar-width: thin;
  scrollbar-color: #6d76d6 transparent;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {
  width: 6px;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-track {
  background: transparent;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb {
  background: #6d76d6;
  border-radius: 99px;
}

.select2-results__option {
  padding: 10px 12px !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  background: transparent !important;
  border-radius: 8px !important;
  border: 0 !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: Host Grotesk;
  font-size: 14px;
  line-height: 18px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: #3a3b7d !important;
  color: #fff !important;
  border-color: #3a3b7d !important;
}

.select2-container--default .select2-results__option[aria-selected=true] {
  background: #3a3b7d !important;
  border-color: #3a3b7d !important;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
  color: #c1c1c1 !important;
  background: #3a3b7d !important;
}

.relationship-meaningful-box {
  background: #ffffff;
  border-radius: 28px;
  padding: 14px;
  position: relative;
  z-index: 1;
  width: 100%;
  margin-top: 12px;
  min-height: 540px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.relationship-meaningful-box .meaningful-content-video{
  width: 100%;
  height: 435px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  overflow: hidden;
  border-radius: 24px;
}
.relationship-meaningful-box .meaningful-content-video video{
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 24px;
  position: relative;
  top: -50px;
}

.relationship-meaningful-box .meaningful-content h2{
  font-size: 40px;
  line-height: 44px;
  color: #100F08;
  font-weight: 700;
  font-family: 'freightneo_probook'; font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "locl" 0, "salt" 0, "ss01" 0, "ss02" 0; font-variant-ligatures: none;
  margin: 0;
  text-align: left;
}
.relationship-meaningful-box .meaningful-content p{
  font-size: 14px;
  line-height: 18px;
  color: #100F08B2;
  font-weight: 400;
  font-family: Host Grotesk;
  text-align: left;
}
.relationship-meaningful-box .meaningful-content-buttons{
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 12px;
}
.meaningful-content-buttons button{
  background: transparent;
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 15px 14px;
  color: #fff;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  font-family: Host Grotesk;
  width: 100%;
  text-align: center;
  cursor: pointer;
}
.meaningful-content-buttons .explore-senses-btn{
  border-color: #fff;
  background: #100F08;
}
.meaningful-content-buttons .hide-senses-btn{
  border-color: #fff;
  background: #fff;
  color: #100F08;
}

/* Inline partner form rendered inside vera-screen and Onboarding-Relationships */
.onboarding-partner-form-wrp {
  width: 100%;
  margin-top: 12px;
}
.onboarding-partner-form-wrp .onboarding-partner-form {
  width: 100%;
}
.onboarding-partner-form-wrp .profile-box form,
.onboarding-partner-form-wrp form {
  gap: 20px;
  padding-bottom: 30px;
  display: flex;
  flex-direction: column;
}
.onboarding-partner-form-wrp .bottom-btn-wrp {
  margin-top: 24px;
}
#vera-screen .onboarding-partner-form-wrp {
  padding: 0;
  background: transparent;
}
#Onboarding-Relationships .onboarding-partner-form-wrp {
  padding-top: 8px;
}
#Onboarding-Relationships-Content-Form-2{
  padding-left: 24px !important;
}
#partner2-form .profile-box,
#partner1-form .profile-box{
  display: flex;
  flex-direction: column;
  gap: 20px
}

/* >>> sprite-icons-compat (auto-generated) >>> */
/* === Logo animation === */
.splash-screen .logo svg.icon { opacity: 1; /* transform: scale(0.8); animation: logoIntro 2.5s ease-in-out forwards, logoGlow 3s ease-in-out infinite alternate 2.5s; */ }
.arrow-btn-wrp .arrow-btn-send svg.icon { width: auto; height: auto; filter: invert(1); }
.message-inside-ftr button svg.icon { width: 24px; height: 24px; }
.continue-replay-vera-box .vera-star-icon svg.icon { width: 38px; height:auto; }
/* <<< sprite-icons-compat <<< */
