.section-padding {
  padding: 4em 0;
}

#hero {
  padding-top: 6em;
}

.hero-bg {
  background-repeat: no-repeat !important;
  background-size: 100% !important;
  background: url("data:image/svg+xml,%3Csvg width='1440' height='1023' viewBox='0 0 1440 1023' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_3214_6116' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='-1' y='0' width='1441' height='1023'%3E%3Crect width='1440' height='1023' fill='%23161D6F'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_3214_6116)'%3E%3Cg style='mix-blend-mode:plus-darker' filter='url(%23filter0_f_3214_6116)'%3E%3Cellipse cx='702' cy='60' rx='806' ry='131' fill='url(%23paint0_linear_3214_6116)' style='mix-blend-mode:multiply'/%3E%3C/g%3E%3Cg style='mix-blend-mode:hard-light' filter='url(%23filter1_f_3214_6116)'%3E%3Cellipse cx='704.5' cy='-23.5' rx='514.5' ry='156.5' transform='rotate(-180 704.5 -23.5)' fill='url(%23paint1_linear_3214_6116)'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_f_3214_6116' x='-404' y='-371' width='2212' height='862' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='150' result='effect1_foregroundBlur_3214_6116'/%3E%3C/filter%3E%3Cfilter id='filter1_f_3214_6116' x='40' y='-330' width='1329' height='613' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='75' result='effect1_foregroundBlur_3214_6116'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_3214_6116' x1='185' y1='28.491' x2='1092.35' y2='549.868' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2398DED9'/%3E%3Cstop offset='1' stop-color='%2342A639'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_3214_6116' x1='1184.01' y1='-92.1007' x2='313.079' y2='-355.885' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FFEB00'/%3E%3Cstop offset='1' stop-color='%23009962'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
}

.hero-heading {
  font-size: clamp(2rem, 5.5vw, 4rem);
  letter-spacing: -0.03em;
  line-height: 1.03em;
  background: linear-gradient(225deg, yellow, #FF8225, yellow, #FF8225);
  mix-blend-mode: difference;
  background-size: 400% 400%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradient 8s ease infinite;
}

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

.showcase-wrap-content {
  padding: clamp(0.5rem, 4vw, 1.5rem);
}

.chips {
  display: inline-block;
  padding: 0.3em 0.8em;
  margin: 0.3em;
  color: var(--bs-body-color);
  border: var(--bs-border-width);
  border-style: var(--bs-border-style);
  border-color: var(--bs-border-color);
  border-radius: 0.5em;
}

.chips-hero {
  display: inline-block;
  font-size: clamp(1.2rem, 3vw, 1.8rem);
  letter-spacing: -0.03em;
  line-height: 1.03em;
  padding: 0.3em 0.8em;
  margin: 0.3em;
  color: var(--bs-body-color);
  border: var(--bs-border-width);
  border-style: var(--bs-border-style);
  border-color: var(--bs-border-color);
  border-radius: 0.5em;
}

.btn-primary {
  padding: 0.7em 1em;
  border: var(--bs-border-radius-sm);
  --bs-btn-color: var(--bs-body-bg);
  --bs-btn-bg: var(--bs-body-color);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: var(--bs-link-color);
  --bs-btn-hover-bg: var(--bs-link-hover-color);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-focus-shadow-rgb: var(--bs-link-hover-color);
  --bs-btn-active-color: transparent;
  --bs-btn-active-bg: transparent;
  --bs-btn-active-border-color: transparent;
  --bs-btn-active-shadow: var(--bs-link-hover-color);
  --bs-btn-disabled-color: transparent;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: transparent;
}

.text-links {
  text-decoration: var(--bs-link-decoration);
}

body {
  line-height: 1.6;
  font-family: Onest, sans-serif;
  overflow-x: hidden !important;
  margin: 0;
  padding: 0;
  width: 100%;
}

.separation-margin {
  margin-bottom: 1.5em;
  margin-top: 1.5em;
}

.packages-pricing {
  margin-top: calc(var(--bs-gutter-x) * .5);
  margin-bottom: calc(var(--bs-gutter-x) * .5);
  border: var(--bs-border-width);
  border-style: var(--bs-border-style);
  border-color: var(--bs-border-color);
  border-radius: 0.5em;
}

.logo {
  fill: var(--bs-body-color);
  width: 7rem;
  height: auto;
}

.link-animation:hover {
  transform: translateY(-.35em);
}

.link-animation {
  transition: transform 0.25s ease-in-out;
}

.card-icons {
  font-size: 36px;
  margin-bottom: 0.5em;
}

.hero-heading-self-typing {
  font-size: clamp(4rem, 9.2vw, 10rem);
  letter-spacing: -0.03em;
  line-height: 1.03em;
  padding-bottom: 0.1em;
  background: linear-gradient(225deg, yellow, #FF8225, yellow, #FF8225);
  mix-blend-mode: difference;
  background-size: 400% 400%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradient 8s ease infinite;
}

.card-check-mark {
  font-size: 2.5em;
}