:root {
  --sb-navy: #143D67;
  --sb-blue: #2B90F4;
  --sb-ease: cubic-bezier(.16,1,.3,1);
}
body.sb-body {
  background: #2787EA;
}
.sb-page {
  position: relative;
  isolation: isolate;
  margin-top: calc(-1 * var(--nav-h));
  padding: calc(var(--nav-h) + 40px) 0 128px;
  color: #fff;
}
.sb-bg {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  background:
    linear-gradient(
      180deg,
      #2B90F4 0%,
      #2A8DF1 55%,
      #2787EA 100%);
}
@media (min-width: 960px) {
  .sb-page {
    padding: calc(var(--nav-h) + 72px) 0 120px;
  }
}
.sb-bg .hb-bg {
  position: absolute;
  inset: 0;
}
.sb-bg .hb-sky {
  height: 104px;
}
@media (min-width: 960px) {
  .sb-bg .hb-sky {
    height: min(420px, 52%);
  }
}
.sb-bg .hb-sky-b path {
  opacity: .3;
}
.sb-bg .hb-sky-win path {
  opacity: .11;
}
.sb-bg .hb-sky .hb-ground {
  opacity: .3;
}
.sb-grid {
  display: grid;
  gap: 30px;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}
@media (min-width: 960px) {
  .sb-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, .94fr);
    gap: 72px;
  }
}
.sb-copy {
  position: relative;
  max-width: 560px;
}
.sb-eyebrow {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 8px;
  background: #F5F5F5;
  color: #5B6472;
  font-size: 12.5px;
  font-weight: 500;
  margin-bottom: 20px;
}
.sb-page h1 {
  margin: 0;
  color: #fff;
  font-size: clamp(40px, 4.8vw, 64px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.03;
}
.sb-l {
  display: block;
  overflow: hidden;
  padding: 0 .04em .1em;
  margin: 0 -.04em -.1em;
}
.sb-l > span {
  display: inline-block;
}
.sb-sub {
  margin: 20px 0 0;
  max-width: 520px;
  font-size: clamp(16.5px, 1.4vw, 18.5px);
  line-height: 1.55;
  color: rgba(255, 255, 255, .92);
}
.sb-need-h {
  margin: 34px 0 14px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .72);
}
.sb-need {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.sb-need li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15.5px;
  font-weight: 500;
  color: #fff;
  transition: transform .35s var(--sb-ease);
}
.sb-need li:hover {
  transform: translateX(3px);
}
.sb-need svg {
  flex: none;
  width: 30px;
  height: 30px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sb-need svg * {
  vector-effect: non-scaling-stroke;
}
.sb-need small {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: rgba(255, 255, 255, .75);
}
.sb-alt {
  margin: 14px 0 0;
  text-align: center;
  font-size: 13.5px;
  line-height: 1.55;
  color: #5B6B80;
}
.sb-alt a {
  color: #143D67;
  font-weight: 600;
  text-decoration: none;
  background: linear-gradient(#2B90F4, #2B90F4) 0 100% / 100% 1.5px no-repeat;
  padding-bottom: 1px;
  transition: background-size .3s ease, color .2s ease;
}
.sb-alt a:hover {
  color: #2B90F4;
}
.sb-alt a:hover {
  background-size: 0 1.5px;
  background-position: 100% 100%;
}
.sb-card {
  position: relative;
  background: #fff;
  color: var(--sb-navy);
  border-radius: 22px;
  padding: 32px 32px 26px;
  border: 0;
  box-shadow: 0 40px 80px -28px rgba(9, 46, 96, .42), 0 12px 30px rgba(9, 46, 96, .10);
  transition: box-shadow .4s ease;
}
.sb-card:focus-within {
  box-shadow: 0 44px 90px -28px rgba(9, 46, 96, .48), 0 12px 30px rgba(9, 46, 96, .12);
}
.sb-card h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--sb-navy);
}
.sb-card .card-sub {
  margin: 4px 0 20px;
  font-size: 14px;
  color: #5B6B80;
  white-space: normal;
}
.sb-card .field input,
.sb-card .field select {
  transition:
    border-color .2s ease,
    box-shadow .25s ease,
    background-color .2s ease;
}
.sb-card .field input:hover,
.sb-card .field select:hover {
  border-color: #A9CFF6;
}
.sb-card .field input:focus,
.sb-card .field select:focus {
  border-color: var(--sb-blue);
  box-shadow: 0 0 0 4px rgba(43, 144, 244, .14);
}
.sb-card .btn-blue {
  transition:
    transform .3s var(--sb-ease),
    box-shadow .3s ease,
    background-color .2s ease;
  box-shadow: 0 10px 24px -10px rgba(43, 144, 244, .7);
}
.sb-card .btn-blue:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 30px -12px rgba(43, 144, 244, .75);
}
.sb-card .btn-blue:active {
  transform: translateY(0) scale(.99);
}
.sb-card .form-fine {
  white-space: normal;
}
@media (max-width: 559px) {
  .sb-card {
    padding: 24px 20px 20px;
    border-radius: 18px;
  }
}
@keyframes sbRise {
  from {
    opacity: .65;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes sbUp {
  from {
    opacity: .65;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes sbFade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes sbDraw {
  from {
    stroke-dashoffset: 1;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes sbCard {
  0% {
    opacity: .65;
    transform: translate3d(14px, 0, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .sb-page .sb-eyebrow {
    animation: sbUp .32s var(--sb-ease) both;
  }
  .sb-page .sb-l > span {
    animation: sbRise .34s var(--sb-ease) both;
  }
  .sb-page .sb-l:nth-child(1) > span {
    animation-delay: .03s;
  }
  .sb-page .sb-l:nth-child(2) > span {
    animation-delay: .06s;
  }
  .sb-page .sb-sub {
    animation: sbUp .34s var(--sb-ease) .09s both;
  }
  .sb-card .sb-alt {
    animation: sbUp .32s var(--sb-ease) .16s both;
  }
  .sb-page .sb-need-h {
    animation: sbUp .32s var(--sb-ease) .12s both;
  }
  .sb-page .sb-need li {
    animation: sbUp .32s var(--sb-ease) both;
    animation-delay: calc(.12s + var(--i) * .03s);
  }
  .sb-page .sb-need svg * {
    stroke-dasharray: 1;
    animation: sbDraw .45s cubic-bezier(.65, 0, .35, 1) both;
    animation-delay: calc(.15s + var(--i) * .04s);
  }
  .sb-bg .hb-g1 {
    animation: hbD1 24s ease-in-out infinite alternate;
  }
  .sb-bg .hb-g2 {
    animation: hbD2 30s ease-in-out infinite alternate;
  }
  .sb-bg .hb-g3 {
    animation: hbD3 34s ease-in-out infinite alternate;
  }
  .sb-bg .hb-sky path {
    stroke-dasharray: 1;
    animation: sbDraw .5s cubic-bezier(.45, 0, .25, 1) both;
    animation-delay: calc(.04s + var(--i, 0) * .012s);
  }
  .sb-bg .hb-sky .hb-ground {
    animation-duration: .5s;
    animation-delay: 0s;
  }
  .sb-bg .hb-sky-win path {
    animation: sbFade .4s ease both;
    animation-delay: calc(.45s + var(--i, 0) * .01s);
    stroke-dasharray: none;
  }
  .sb-card {
    animation: sbCard .38s var(--sb-ease) .05s both;
  }
  .sb-card > h2,
  .sb-card > .card-sub,
  .sb-card .form-grid,
  .sb-card .btn-blue,
  .sb-card .form-fine {
    animation: sbUp .3s var(--sb-ease) both;
  }
  .sb-card > h2 {
    animation-delay: .08s;
  }
  .sb-card > .card-sub {
    animation-delay: .1s;
  }
  .sb-card .form-grid:nth-of-type(1) {
    animation-delay: .12s;
  }
  .sb-card .form-grid:nth-of-type(2) {
    animation-delay: .14s;
  }
  .sb-card .form-grid:nth-of-type(3) {
    animation-delay: .16s;
  }
  .sb-card .form-grid:nth-of-type(4) {
    animation-delay: .18s;
  }
  .sb-card .btn-blue {
    animation-delay: .2s;
  }
  .sb-card .form-fine {
    animation-delay: .22s;
  }
}
.sb-card .btn-blue {
  animation-fill-mode: backwards !important;
}
@media (prefers-reduced-motion: reduce) {
  .sb-bg .hb-glow {
    animation: none;
  }
  .sb-need li,
  .sb-card .btn-blue {
    transition: none;
  }
  .sb-need li:hover,
  .sb-card .btn-blue:hover {
    transform: none;
  }
}
@media (min-width: 960px) {
  .sb-card {
    margin-top: 48px;
  }
}
.footer {
  margin-top: 0;
}