.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #7B2FFF;
  --bs-btn-border-color: #7B2FFF;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #6928d9;
  --bs-btn-hover-border-color: #6226cc;
  --bs-btn-focus-shadow-rgb: 143, 78, 255;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #6226cc;
  --bs-btn-active-border-color: #5c23bf;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #7B2FFF;
  --bs-btn-disabled-border-color: #7B2FFF;
}

@media (min-width:0px) {
  .app-screenshots img {
    height: 182px;
  }

  .movegroove-purple-bg {
    height: calc(23em - 10vw);
  }

  .movegroove-pattern-bg {
    padding-top: 100px;
  }

  .movegroove-shapes-bg {
    background-position-y: 100% !important;
  }

  .section1 {
    width: 100%;
  }

  .ios-badge-adjust {
    padding: 10px 29px;
  }
  .android-badge-adjust {
    padding: 10px 13px;
  }

  .movegroove-values-card h2 {
    font-size: calc(1rem + .8vw);
  }

  .movegroove-values-card p {
    font-size: calc(0.7rem + .3vw);
  }
  
  .movegroove-ios-badge {
    height: 42.5px;
  }
  
  .movegroove-android-badge {
    height: 42.5px;
  }

  .movegroove-download-box {
    padding: 2em 1em !important;
  }

  .col-values-connection,
  .col-values-innovation {
    flex: 1 0 0%;
  }

  .browser_link_row {
    margin: 1em auto 0em auto !important;
    width: fit-content;
  }
  .browser_link_row a {
    font-size: 0.8rem;
  }
}

@media (min-width:576px) {
  .app-screenshots img {
    height: 364px;
  }

  .movegroove-purple-bg {
    height: 460px;
  }

  .movegroove-pattern-bg {
    padding-top: 120px;
  }

  .section1 {
    width: 90%;
  }
  
  .movegroove-ios-badge {
    height: 85px;
  }
  
  .movegroove-android-badge {
    height: 85px;
  }

  .movegroove-download-box {
    padding: 3em !important;
  }

  .col-values-connection {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-values-innovation {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
}

@media (min-width:768px) {
  .app-screenshots img {
    height: 486px;
  }

  .movegroove-purple-bg {
    height: 540px;
  }

  .movegroove-pattern-bg {
    padding-top: 161px;
  }

  .movegroove-shapes-bg {
    background-position-y: 130% !important;
  }

  .section1 {
    width: 80%;
  }

  .movegroove-download-box {
    padding: 4em !important;
  }
}

@media (min-width:992px) {
  .app-screenshots img {
    height: 632px;
  }

  .movegroove-purple-bg {
    height: 613px;
  }

  .movegroove-pattern-bg {
    padding-top: 210px;
  }

  .section1 {
    width: 70%;
  }

  .ios-badge-adjust {
    padding: 20px 61px 20px 30px;
  }
  .android-badge-adjust {
    padding: 20px 30px 20px 30px;
  }
}

@media (min-width:1200px) {
  .app-screenshots img {
    height: 771px;
  }

  .movegroove-purple-bg {
    height: 748px;
  }

  .movegroove-pattern-bg {
    padding-top: 255px;
  }

  .section1 {
    width: 60%;
  }

  .movegroove-values-card h2 {
    font-size: 1.5em;
  }

  .movegroove-values-card p {
    font-size: 0.9em;
  }
}

@media (min-width:1400px) {
  .app-screenshots img {
    height: 908px;
  }

  .movegroove-purple-bg {
    height: 880px;
  }

  .movegroove-pattern-bg {
    padding-top: 300px;
  }

  .section1 {
    width: 50%;
  }
}

body {
  background-color: #FAF6F4;
  font-family: 'Hanken Grotesk', Arial, Helvetica, sans-serif;
}

.movegroove-purple {
  color: #7B2FFF !important;
}

.movegroove-orange {
  color: #F37925 !important;
}

.movegroove-purple-bg {
  background-color: #7B2FFF;
}

.movegroove-pattern-bg {
  background-image: url('../images/background_bottom.svg');
  height: auto;
}

.movegroove-shapes-bg {
  background-image: url('../images/background_shapes.svg');
  background-repeat: no-repeat;
  background-size: 90%;
  background-position-x: center;
}

.movegroove-card {
  border-radius: 20px;
  background: white;
  padding: 2.5em;
}

.movegroove-values-card {
  border-radius: 20px;
  background: #F6F4F1;
  padding: 1em;
  margin: 0.8em;
}

.movegroove-download-button {
  border-radius: 20px;
  font-size: 1.5em;
  padding: 0.5em 1.5em;
}

.title1 {
  text-align: center;
  font-weight: bold;
  letter-spacing: -0.1rem;
  color: #000000;
  opacity: 1;
  font-size: calc(2rem + 1.5vw) !important;
  line-height: 120% !important;
}

.subtitle {
  text-align: center;
  font: normal normal 1.5rem/2.2rem Hanken Grotesk;
  letter-spacing: 0px;
  color: #000000;
  opacity: 1;
  font-size: calc(1rem + 0.3vw) !important;
  line-height: 115% !important;
}

.title2 {
  text-align: center;
  font-weight: bold;
  letter-spacing: -0.05rem;
  color: #FFFFFF;
  opacity: 1;
  font-size: calc(2rem + .9vw) !important;
  line-height: 105% !important;
}

.title3 {
  text-align: center;
  font-weight: 900;
  letter-spacing: 0px;
  color: #000000;
  opacity: 1;
  font-size: calc(1.5rem + .6vw) !important;
  line-height: 120% !important;
}

.normal-text {
  text-align: start;
  font: normal normal 1.2rem/2rem Hanken Grotesk;
  letter-spacing: 0px;
  color: #000000;
  opacity: 1;
  font-size: calc(0.8rem + 0.3vw) !important;
  line-height: 115% !important;
}

.navbar {
  --bs-navbar-nav-link-padding-x: 1em;
}
.nav-link {
  --bs-nav-link-font-size: 1.1em;
}