* {
  scrollbar-color: #ffffff #1e3342;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 84px;
}

.fullpage-body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.fullpage-main {
  flex-grow: 1;
}
.fullpage-footer {
  flex-shrink: 0;
}

.input-wrapper {
  position: relative;
}

.input-wrapper .custom-placeholder {
  position: absolute;
  left: 32px;
  top: 20px;
  transition: all 0.4s ease;
  pointer-events: none;
  color: #ffffff;
  font-size: 24px;
  font-weight: 500;

  @media (width < 1024px) {
    font-size: 14px;
    left: 24px;
    top: 12px;
  }
}

.input-wrapper input:focus + .custom-placeholder,
.input-wrapper input:not(:placeholder-shown) + .custom-placeholder {
  top: -12px;
  font-size: 16px;
  border-radius: 12px;
  padding-inline: 16px;
  font-weight: 500;

  @media (width < 1024px) {
    top: -8px;
    font-size: 10px;
    padding-inline: 8px;
  }
}

.input-wrapper input:focus + .custom-placeholder.blue,
.input-wrapper input:not(:placeholder-shown) + .custom-placeholder.blue {
  background: #4B5E6B;
  color: #FFFFFF;
}
.input-wrapper input:focus + .custom-placeholder.white,
.input-wrapper input:not(:placeholder-shown) + .custom-placeholder.white {
  background: #FFFFFF;
  color: #4B5E6B;
}

option {
  background-color: #1E3342;
  color: #FFFFFF;
}
