:root {
  --white-200: #e6e2cf;
  --_typography---main-font: "Instrument Sans", sans-serif;
  --black-100: #1d1d1f;
  --_typography---font-size--paragraphs--body-base: 1rem;
  --_typography---line-height--line-height-reg: 160%;
  --_typography---font-weight--regular: 400;
  --_typography---font-size--headers--h1: 4.5rem;
  --_typography---line-height--line-height-sm: 120%;
  --_typography---font-weight--semibold: 600;
  --_typography---font-size--headers--h2: 3.5rem;
  --_typography---font-size--headers--h3: 2.75rem;
  --_typography---font-size--headers--h4: 2.25rem;
  --_typography---font-size--headers--h5: 1.75rem;
  --_typography---font-size--headers--h6: 1.5rem;
  --primary: #f0cc14;
  --_typography---font-size--paragraphs--body-lg: 1.25rem;
  --_typography---line-height--line-height-md: 140%;
  --_spacing---spacer-2xl: 6rem;
  --_typography---font-size--paragraphs--body-xl: 1.75rem;
  --white-100: white;
  --black-0-1: #0000001a;
  --black-0-6: #0009;
  --_spacing---spacer-xl: 4rem;
  --_typography---font-size--paragraphs--body-xs: .75rem;
  --_typography---font-size--headers--header-sm: 1.25rem;
  --_typography---font-weight--medium: 500;
  --_spacing---spacer-xs: .25rem;
  --_spacing---spacer-md: 1rem;
  --_typography---font-size--headers--header-lg: 2.5rem;
  --_typography---font-size--headers--header-xs: .875rem;
  --white-0-6: #ffffffb3;
  --_spacing---spacer-lg: 2rem;
  --_typography---font-size--paragraphs--body-sm: .875rem;
  --_typography---font-weight--bold: 700;
  --_spacing---spacer-3xl: 8rem;
  --_spacing---spacer-5xl: 12rem;
  --_spacing---spacer-4xl: 10rem;
  --accent-1: #c64073;
  --_borders---border-16px: 16px;
  --_borders---border-8px: 8px;
  --white-0-1: #ffffff1a;
  --_borders---border-32px: 32px;
  --_spacing---spacer-sm: .5rem;
  --_typography---header-font: "Inter Tight", sans-serif;
  --_typography---font-size--headers--header-md: 1.75rem;
  --white-0-8: #fffc;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  background-color: var(--white-200);
  font-family: var(--_typography---main-font);
  color: var(--black-100);
  font-size: var(--_typography---font-size--paragraphs--body-base);
  line-height: var(--_typography---line-height--line-height-reg);
  font-weight: var(--_typography---font-weight--regular);
  --_typography---main-font: "Instrument Sans", sans-serif;
  --_typography---font-size--paragraphs--body-base: 1rem;
  --_typography---line-height--line-height-reg: 160%;
  --_typography---font-weight--regular: 400;
  --_typography---font-size--headers--h1: 4.5rem;
  --_typography---line-height--line-height-sm: 120%;
  --_typography---font-weight--semibold: 600;
  --_typography---font-size--headers--h2: 3.5rem;
  --_typography---font-size--headers--h3: 2.75rem;
  --_typography---font-size--headers--h4: 2.25rem;
  --_typography---font-size--headers--h5: 1.75rem;
  --_typography---font-size--headers--h6: 1.5rem;
  --_typography---font-size--paragraphs--body-lg: 1.25rem;
  --_typography---line-height--line-height-md: 140%;
  --_typography---font-size--paragraphs--body-xl: 1.75rem;
  --_typography---font-size--paragraphs--body-xs: .75rem;
  --_typography---font-size--headers--header-sm: 1.25rem;
  --_typography---font-weight--medium: 500;
  --_typography---font-size--headers--header-lg: 2.5rem;
  --_typography---font-size--headers--header-xs: .875rem;
  --_typography---font-size--paragraphs--body-sm: .875rem;
  --_typography---font-weight--bold: 700;
  --_typography---header-font: "Inter Tight", sans-serif;
  --_typography---font-size--headers--header-md: 1.75rem;
  --_spacing---spacer-2xl: 6rem;
  --_spacing---spacer-xl: 4rem;
  --_spacing---spacer-xs: .25rem;
  --_spacing---spacer-md: 1rem;
  --_spacing---spacer-lg: 2rem;
  --_spacing---spacer-3xl: 8rem;
  --_spacing---spacer-5xl: 12rem;
  --_spacing---spacer-4xl: 10rem;
  --_spacing---spacer-sm: .5rem;
}

h1 {
  font-size: var(--_typography---font-size--headers--h1);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.01em;
  margin-top: 1.25rem;
  margin-bottom: .75rem;
}

h2 {
  font-size: var(--_typography---font-size--headers--h2);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: .01em;
  margin-top: 1rem;
  margin-bottom: .75rem;
}

h3 {
  font-size: var(--_typography---font-size--headers--h3);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.01em;
  margin-top: 1rem;
  margin-bottom: .75rem;
}

h4 {
  font-size: var(--_typography---font-size--headers--h4);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.01em;
  margin-top: .75rem;
  margin-bottom: .75rem;
}

h5 {
  font-size: var(--_typography---font-size--headers--h5);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.005em;
  margin-top: .75rem;
  margin-bottom: .75rem;
}

h6 {
  font-size: var(--_typography---font-size--headers--h6);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  margin-top: .75rem;
  margin-bottom: .75rem;
}

p {
  margin-bottom: 10px;
}

a {
  color: var(--black-100);
  text-decoration: none;
}

img {
  object-fit: cover;
  max-width: 100%;
  display: inline-block;
}

blockquote {
  border-left: 5px solid var(--primary);
  font-size: var(--_typography---font-size--paragraphs--body-lg);
  line-height: var(--_typography---line-height--line-height-md);
  margin-bottom: 10px;
  padding: 10px 20px;
}

.default-container {
  width: 100%;
  max-width: 86rem;
  padding-left: 1rem;
  padding-right: 1rem;
  position: relative;
}

.default-container.about-01 {
  height: 100svh;
  padding-top: 2rem;
  padding-bottom: 2rem;
  position: sticky;
  top: 0;
}

.default-container.about-02 {
  height: 100%;
}

.default-container.cta {
  padding-left: 0;
  padding-right: 0;
}

.template-body-fonts {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  flex-flow: column;
  display: flex;
}

.template-font-light {
  background-color: #f2f2f2;
  border-radius: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 12rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
}

.stats-header {
  font-size: var(--_typography---font-size--headers--h1);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: 500;
}

.template-button-container {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.space-2xl {
  height: var(--_spacing---spacer-2xl);
  width: 100%;
}

.button-item-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  padding: 12px;
  display: flex;
}

.body-xl {
  font-size: var(--_typography---font-size--paragraphs--body-xl);
  line-height: var(--_typography---line-height--line-height-reg);
}

.color {
  border-radius: 10px;
  width: 100%;
  height: 6.5rem;
}

.color.black {
  background-color: var(--black-100);
  border: 1px solid #1d1d1f;
}

.color.primary-100 {
  background-color: var(--primary);
}

.color.primary-200 {
  background-color: var(--white-200);
}

.color.white {
  background-color: var(--white-100);
  border: 1px solid #0f0f101a;
}

.color.black-0-1 {
  background-color: var(--black-0-1);
}

.color.black-0-6 {
  background-color: var(--black-0-6);
}

.color-item-wrapper {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.body-lg {
  font-size: var(--_typography---font-size--paragraphs--body-lg);
  line-height: var(--_typography---line-height--line-height-md);
  letter-spacing: -.3px;
}

.body-lg.has-indent {
  text-indent: 100px;
}

.body-lg.color-white-0-6 {
  color: #fffc;
}

.styleguide-title {
  text-transform: uppercase;
  padding-bottom: 1rem;
  font-size: 3rem;
  font-weight: 600;
  line-height: 120%;
}

.styleguide-header-light {
  border-bottom: 1px solid #646466;
  margin-top: 3rem;
  margin-bottom: 2rem;
  padding-left: .5rem;
}

.space-sm {
  width: 100%;
  height: .5rem;
}

.space-xl {
  height: var(--_spacing---spacer-xl);
  width: 100%;
}

.body-xs {
  color: var(--black-0-6);
  font-size: var(--_typography---font-size--paragraphs--body-xs);
  line-height: var(--_typography---line-height--line-height-reg);
}

.body-xs.template-style-header {
  color: #1d1d1f;
  background-color: #f2f2f2;
  align-self: flex-start;
  padding: .25rem .5rem;
}

.body-base {
  margin-bottom: 0;
}

.body-base.color-black-0-7 {
  color: var(--black-0-6);
}

.body-base.color-white-0-6 {
  color: #fff9;
  font-weight: 400;
}

.header-sm {
  font-size: var(--_typography---font-size--headers--header-sm);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--medium);
  letter-spacing: -.01em;
}

.section {
  padding-top: 10rem;
  padding-bottom: 10rem;
  position: relative;
  overflow: hidden;
}

.section.footer {
  padding-top: 6rem;
  padding-bottom: 1rem;
}

.section.hero {
  padding-top: 0;
  padding-bottom: 0;
}

.section.has-overflow {
  overflow: visible;
}

.section.other-pg-hero {
  padding-top: 6rem;
}

.template-fonts {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.header-md {
  font-size: var(--_typography---font-size--headers--h5);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--medium);
  letter-spacing: -.01em;
}

.template-padding {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.space-xs {
  height: var(--_spacing---spacer-xs);
  width: 100%;
}

.figure {
  justify-content: flex-start;
  align-items: flex-start;
}

.styleguide-spacing-div-light {
  background-color: #f2f2f2;
  width: 100%;
  height: 100%;
}

.space-md {
  height: var(--_spacing---spacer-md);
  width: 100%;
}

.template-spacing-wrapper {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.header-lg {
  font-size: var(--_typography---font-size--headers--header-lg);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.01em;
}

.header-lg.parallax {
  font-weight: var(--_typography---font-weight--semibold);
}

.header-xs {
  font-size: var(--_typography---font-size--headers--header-xs);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--medium);
  text-transform: uppercase;
}

.header-xs.title-tag {
  color: var(--black-0-6);
  font-weight: var(--_typography---font-weight--semibold);
}

.header-xs.project-item {
  font-weight: var(--_typography---font-weight--semibold);
}

.header-xs.nav-title {
  color: var(--white-0-6);
}

.headline-container-centred {
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.template-colors {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: wrap;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  justify-items: start;
  display: grid;
}

.space-lg {
  height: var(--_spacing---spacer-lg);
  width: 100%;
}

.body-sm {
  font-size: var(--_typography---font-size--paragraphs--body-sm);
  line-height: var(--_typography---line-height--line-height-reg);
}

.body-sm.white-0-6 {
  color: var(--white-0-6);
}

.body-sm.color-yellow {
  color: var(--primary);
  font-weight: var(--_typography---font-weight--bold);
}

.space-3xl {
  height: var(--_spacing---spacer-3xl);
  width: 100%;
}

.space-5xl {
  height: var(--_spacing---spacer-5xl);
  width: 100%;
}

.space-4xl {
  height: var(--_spacing---spacer-4xl);
  width: 100%;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 80rem;
  display: flex;
}

.lottie-animation-02 {
  height: 220px;
}

.image-cover {
  width: 100%;
  height: 100%;
}

.vertical-flex {
  flex-flow: column;
  display: flex;
}

.vertical-flex.left-align {
  justify-content: flex-start;
  align-items: flex-start;
}

.vertical-flex.left-align.template-support-page {
  padding-right: 6rem;
}

.horizontal-flex {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.horizontal-flex.x-stretch, .horizontal-flex.project-item {
  justify-content: space-between;
}

.title-tag {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.corner-div {
  border-top: 2px solid var(--accent-1);
  border-right: 2px solid var(--accent-1);
  width: 10px;
  height: 8px;
}

.stats-card {
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  display: flex;
}

.feature-card {
  z-index: 999;
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border: 1px solid var(--black-100);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  padding: 2rem;
  display: flex;
}

.accordion {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  border-bottom: 1px solid var(--black-0-1);
  cursor: pointer;
  transform-style: preserve-3d;
  justify-content: space-between;
  width: 100%;
  padding: 3rem 2rem;
  transition: transform .3s;
  display: flex;
}

.accordion:hover {
  transform: scale3d(.96, .96, 1.01);
}

.icon-wrapper {
  justify-content: center;
  align-items: center;
  display: flex;
}

.primary-button {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  border: 1px solid var(--black-100);
  border-radius: var(--_borders---border-8px);
  background-color: var(--white-200);
  box-shadow: 4px 4px 0 0 var(--black-100);
  font-weight: var(--_typography---font-weight--medium);
  flex-flow: column;
  padding: 12px 16px 12px 12px;
  transition: all .3s cubic-bezier(.445, .05, .55, .95);
  overflow: hidden;
}

.primary-button:hover {
  box-shadow: none;
  transform: translate(4px, 4px);
}

.btn-text-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  justify-content: flex-start;
  align-items: center;
  padding-left: .25rem;
  padding-right: .25rem;
  display: flex;
}

.button-icon-wrapper {
  justify-content: center;
  align-items: center;
  display: flex;
}

.solution-card {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  border-top: 1.5px solid var(--white-0-1);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  padding: 4rem 1rem;
  display: grid;
}

.solution-content {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: flex;
}

.footer-section-container {
  grid-column-gap: var(--_spacing---spacer-4xl);
  grid-row-gap: var(--_spacing---spacer-4xl);
  flex-flow: column;
  justify-content: flex-end;
  align-items: stretch;
  display: flex;
}

.footer-link {
  letter-spacing: -.01em;
  padding-bottom: .5rem;
  padding-left: 0;
  padding-right: 0;
  font-size: 2.25rem;
  font-weight: 500;
  line-height: 100%;
}

.link-line-wrapper {
  background-color: var(--black-0-1);
  width: 100%;
  height: 1px;
  margin-top: .5rem;
}

.link-line {
  background-color: var(--black-100);
  width: 30%;
  height: 1.5px;
}

.footer-nav-links {
  margin-bottom: .5rem;
  font-size: 1.125rem;
  transition: all .3s;
}

.footer-nav-links:hover {
  font-weight: var(--_typography---font-weight--medium);
  text-decoration: underline;
  transform: translate(0, 3px);
}

.footer-copyright-wrapper {
  border-top: 1px solid #ffffff1a;
  justify-content: space-between;
  align-items: flex-end;
  padding: 1rem;
  display: flex;
}

.footer-copyright-item {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  justify-content: center;
  align-items: center;
  display: flex;
}

.footer-grid-wrapper {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  display: grid;
}

.footer-links-wrapper {
  grid-column-gap: var(--_spacing---spacer-lg);
  grid-row-gap: var(--_spacing---spacer-lg);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  display: flex;
}

.hero-container {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  color: var(--white-200);
  grid-template-rows: auto auto auto auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 100svh;
  display: grid;
}

.hero-bg-video-wrapper {
  border-radius: var(--_borders---border-16px);
  background-image: url('../images/hero-img.avif');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  margin: .75rem;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.hero-bg-video {
  opacity: .12;
  width: 100%;
  height: 100%;
}

.hero-headline-wrapper {
  z-index: 5;
  color: var(--white-100);
  text-align: center;
  padding-top: 3rem;
  padding-left: 3rem;
  position: relative;
}

.hero-subheader-wrapper {
  z-index: 2;
  justify-content: space-between;
  align-items: stretch;
  padding-left: 3rem;
  display: flex;
  position: relative;
}

.hero-button {
  padding-right: 3rem;
  position: relative;
}

.btn-circle-div {
  background-color: var(--accent-1);
  border-radius: 100%;
  width: 8px;
  height: 8px;
}

.btn-wrapper {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.grid-12-column {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.grid-12-column.about-01 {
  min-height: 100%;
  max-height: 100%;
}

.grid-12-column.about-02 {
  height: 100%;
}

.h2-header {
  font-size: var(--_typography---font-size--headers--h2);
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--semibold);
  letter-spacing: -.01em;
}

.about-image-wrapper {
  border-radius: var(--_borders---border-16px);
  height: 100%;
  overflow: hidden;
}

.stats-wrapper {
  border: 1px solid var(--black-100);
  border-radius: var(--_borders---border-16px);
  background-color: var(--white-200);
  height: 100%;
  padding: 2rem 2rem 1rem;
}

.about-subheader-wrapper {
  width: 75%;
}

.stats-description {
  color: var(--black-0-6);
  font-size: var(--_typography---font-size--paragraphs--body-xs);
  font-weight: var(--_typography---font-weight--semibold);
  text-align: right;
  text-transform: uppercase;
}

.stats-container {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  height: 100%;
  display: grid;
}

.h1-header {
  font-size: 7rem;
  line-height: var(--_typography---line-height--line-height-sm);
  font-weight: var(--_typography---font-weight--medium);
  letter-spacing: -.03em;
  margin-top: 0;
  margin-bottom: 0;
}

.services-wrapper {
  border-radius: var(--_borders---border-32px);
  background-color: var(--black-100);
  color: var(--white-100);
  margin-left: 1rem;
  margin-right: 1rem;
  padding-top: 6rem;
  padding-bottom: 6rem;
  position: relative;
}

.services-tag-wrapper {
  grid-column-gap: var(--_spacing---spacer-md);
  grid-row-gap: var(--_spacing---spacer-md);
  display: flex;
}

.services-tag {
  border-radius: var(--_borders---border-32px);
  background-color: var(--primary);
  color: var(--black-100);
  font-size: var(--_typography---font-size--paragraphs--body-sm);
  padding: 4px 16px;
}

.solution-number {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  display: flex;
}

.project-container-01 {
  grid-column-gap: var(--_spacing---spacer-md);
  grid-row-gap: var(--_spacing---spacer-md);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.card-reveal-container {
  height: 100%;
  position: relative;
  overflow: hidden;
}

.card-reveal-img-wrapper {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.card-reveal-img {
  width: 100%;
  height: 100%;
}

.card-reveal-mask-wrapper {
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 100%;
  display: grid;
  position: absolute;
  inset: 0%;
}

.card-reveal-mask-overflow {
  width: 100%;
  height: 100%;
  position: relative;
}

.card-reveal-top-mask {
  background-color: var(--black-100);
  width: 100%;
  height: 100%;
  transform: translate(0, -100%);
}

.card-reveal-bottom-mask {
  background-color: var(--black-100);
  width: 100%;
  height: 100%;
  transform: translate(0, 100%);
}

.sticky-container {
  grid-column-gap: var(--_spacing---spacer-lg);
  grid-row-gap: var(--_spacing---spacer-lg);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
  position: relative;
}

.sticky-left-wrapper {
  position: sticky;
  top: 2rem;
}

.about-section-wrapper {
  border-radius: var(--_borders---border-32px);
  background-color: var(--black-100);
  color: var(--white-200);
  height: 90svh;
  margin-left: 1rem;
  margin-right: 1rem;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.feature-image-wrapper {
  border-radius: var(--_borders---border-16px);
  width: 3rem;
  height: 3rem;
  overflow: hidden;
}

.center-card-wrapper {
  border: 1.5px solid var(--white-0-1);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  min-height: 100%;
  max-height: 100%;
  padding: 8px;
  display: flex;
  position: relative;
}

.projects-button {
  padding-top: 2rem;
}

.feature-lottie {
  width: 100%;
  height: 100%;
}

.process-item-wrapper._01 {
  border-radius: var(--_borders---border-16px);
  background-color: #ffc6c8;
  position: sticky;
  top: 1rem;
  overflow: hidden;
}

.process-item-wrapper._02 {
  border-radius: var(--_borders---border-16px);
  background-color: #c2edaf;
  position: sticky;
  top: 1.5rem;
  transform: translate(-1rem);
}

.process-item-wrapper._03 {
  border-radius: var(--_borders---border-16px);
  background-color: #ffda9e;
  position: sticky;
  top: 2rem;
  transform: translate(-2rem);
}

.process-item-wrapper._04 {
  border-radius: var(--_borders---border-16px);
  background-color: #e4d5e9;
  position: sticky;
  top: 2.5rem;
  transform: translate(-3rem);
}

.sticky-right-wrapper {
  grid-column-gap: var(--_spacing---spacer-2xl);
  grid-row-gap: var(--_spacing---spacer-2xl);
  flex-flow: column;
  display: flex;
}

.about-01-container {
  grid-column-gap: var(--_spacing---spacer-3xl);
  grid-row-gap: var(--_spacing---spacer-3xl);
  flex-flow: column;
  display: flex;
}

.feature-image-02 {
  border-radius: var(--_borders---border-16px);
  height: 100%;
  overflow: hidden;
}

.text-img-span {
  vertical-align: baseline;
  width: 8rem;
  height: 5rem;
  display: inline-block;
  position: relative;
}

.grid-2-row {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.testimonial-card {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border: 1px solid var(--white-0-1);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  padding: 2rem 1.5rem;
  display: flex;
  position: relative;
}

.testimonial-card._02 {
  background-color: var(--accent-1);
}

.title-tag-about {
  padding-top: 1rem;
}

.title-services {
  color: var(--white-0-6);
  padding-top: 1rem;
}

.projects-grid-wrapper {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.img01-reveal-wrapper {
  flex-flow: column;
  justify-content: flex-end;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.img01-reveal {
  width: 100%;
  height: 100%;
}

.img01-reveal-mask {
  background-color: var(--white-200);
  position: absolute;
  inset: auto 0% 0%;
}

.projects-item {
  border: 1px solid var(--white-200);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding: .5rem .5rem 1.5rem;
  display: flex;
  position: relative;
}

.project-name {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-left: .5rem;
  padding-right: .5rem;
  display: flex;
}

.project-image-wrapper {
  border-radius: var(--_borders---border-8px);
  width: 100%;
  height: 70vh;
  overflow: hidden;
}

.project-item-btn {
  border-radius: var(--_borders---border-32px);
  background-color: var(--primary);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  padding: .5rem 1rem;
  position: absolute;
}

.project-item-02 {
  transform: translate(0, 4rem);
}

.cta-text-wrapper {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 24rem;
  margin-bottom: 4rem;
  padding-right: 1rem;
  display: flex;
  position: absolute;
  inset: auto 0% 0% auto;
}

.button-primary {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  flex-flow: column;
  padding-top: .5rem;
  font-weight: 500;
  overflow: hidden;
}

.button-underline {
  background-color: #0000001a;
  margin-top: .25rem;
}

.button-underline-div {
  background-color: #0c0c0c;
  width: 20%;
  height: 1.25px;
}

.semi-bold-span {
  color: var(--white-100);
  font-weight: var(--_typography---font-weight--medium);
}

.projects-subheader-wrapper {
  width: 75%;
}

.project-tag-text {
  font-size: .75rem;
  font-weight: var(--_typography---font-weight--medium);
  text-transform: uppercase;
}

.navbar {
  z-index: 999999;
  border-bottom: 1px dashed var(--black-0-6);
  justify-content: space-between;
  max-width: 86rem;
  margin-left: auto;
  margin-right: auto;
  padding: .75rem .5rem;
  display: flex;
}

.navbar.home-page {
  border-radius: var(--_borders---border-8px);
  background-color: var(--white-200);
  border-bottom-style: none;
  margin-top: 2rem;
  margin-right: 2rem;
  position: absolute;
  inset: 0% 0% auto auto;
}

.hamburger-wrapper {
  z-index: 3;
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  cursor: pointer;
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  width: 3.5rem;
  height: 2rem;
  padding-left: .5rem;
  padding-right: .5rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.hamburger-line-top, .hamburger-line-bottom {
  background-color: var(--black-100);
  width: 100%;
  height: 2px;
}

.brand-logo {
  justify-content: center;
  align-items: center;
  width: 80px;
  transition: transform .4s cubic-bezier(.645, .045, .355, 1);
  display: flex;
}

.brand-logo:hover {
  transform: translate(0, 4px)scale(.94);
}

.nav-menu-wrapper {
  z-index: 9;
  width: 40vw;
  height: 100svh;
  padding: .75rem;
  display: none;
  position: fixed;
  inset: 0% 0% auto auto;
}

.nav-menu-container {
  border-radius: var(--_borders---border-32px);
  background-color: var(--black-100);
  perspective-origin: 100% 0;
  transform-origin: 100% 0;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: clip;
}

.nav-menu-content {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  height: 100%;
  min-height: 100%;
  padding: 4rem 2rem;
  display: flex;
  position: relative;
  overflow: auto;
}

.nav-menu-links {
  grid-column-gap: var(--_spacing---spacer-lg);
  grid-row-gap: var(--_spacing---spacer-lg);
  flex-flow: column;
  display: flex;
}

.nav-link {
  color: var(--white-200);
  font-size: 3rem;
  line-height: var(--_typography---line-height--line-height-sm);
  letter-spacing: -1.5px;
  transition: all .3s ease-in-out;
}

.nav-link:hover {
  color: var(--primary);
  transform: translate(0, 3px);
}

.nav-socials-item {
  color: var(--white-200);
}

.email-nav-link {
  color: var(--white-200);
  font-size: var(--_typography---font-size--paragraphs--body-lg);
  transition: all .3s ease-in-out;
}

.email-nav-link:hover {
  color: var(--primary);
  transform: translate(0, 3px);
}

.nav-socials {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  display: flex;
}

.nav-menu-socials-wrapper {
  grid-column-gap: var(--_spacing---spacer-xl);
  grid-row-gap: var(--_spacing---spacer-xl);
  flex-flow: column;
  display: flex;
}

.nav-menu-close {
  aspect-ratio: 1;
  background-color: var(--primary);
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 3.5rem;
  display: flex;
  position: absolute;
  inset: 1rem 1rem auto auto;
}

.nav-menu-bg-blur {
  z-index: 5;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background-color: #fff3;
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  inset: 0%;
}

.text-link-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.contact-pg-image {
  border-radius: var(--_borders---border-16px);
  justify-content: flex-start;
  align-items: flex-start;
  overflow: hidden;
}

.contact-pg-hero-header {
  text-align: center;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.templates-grid-wrapper {
  grid-column-gap: var(--_spacing---spacer-lg);
  grid-row-gap: var(--_spacing---spacer-lg);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.template-item {
  border: 1px solid var(--white-200);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: .5rem .5rem 1rem;
  display: flex;
  position: relative;
}

.template-image-wrapper {
  border-radius: var(--_borders---border-16px);
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.template-item-card {
  width: 100%;
  height: 70vh;
}

.template-item-details {
  grid-column-gap: var(--_spacing---spacer-xs);
  grid-row-gap: var(--_spacing---spacer-xs);
  flex-flow: column;
  width: 100%;
  padding-left: .5rem;
  padding-right: .5rem;
  display: flex;
}

.template-name {
  justify-content: space-between;
  align-items: flex-end;
  display: flex;
}

.template-price-text {
  color: var(--black-0-6);
  font-size: var(--_typography---font-size--headers--header-xs);
  font-weight: var(--_typography---font-weight--medium);
}

.title-testimonials {
  color: var(--white-0-6);
}

.main-project-img {
  border: 1.5px solid var(--black-100);
  border-radius: var(--_borders---border-16px);
  height: 90svh;
  overflow: hidden;
}

.other-project-images {
  border: 1px solid var(--black-100);
  border-radius: var(--_borders---border-16px);
  height: 70svh;
  overflow: hidden;
}

.heart {
  width: 24px;
  height: 24px;
}

.bold-text {
  color: var(--black-100);
}

.italic-span {
  font-family: PT Serif, serif;
}

.testimony-bg-image {
  opacity: .16;
  width: 100px;
  margin: 8px;
  display: block;
  position: absolute;
  inset: 0% auto auto 0%;
  overflow: hidden;
}

.testimony-text-wrapper {
  z-index: 99;
  flex-flow: column;
  justify-content: center;
  height: 100%;
  display: flex;
  position: relative;
}

.overlay-text-wrapper {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  border-radius: var(--_borders---border-16px);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background-image: linear-gradient(0deg, #000c 28%, #0000);
  flex-flow: column;
  padding: 3rem 1rem 1rem;
  display: flex;
  position: absolute;
  inset: auto 8px 8px;
}

.body-2lg {
  font-size: 1.5rem;
  line-height: var(--_typography---line-height--line-height-md);
}

.cta2-img-wrapper {
  border-radius: var(--_borders---border-32px);
  overflow: hidden;
}

.cta-wrapper {
  position: relative;
}

.web-devlopment {
  width: 100%;
}

.lottie-wrap {
  justify-content: center;
  align-items: center;
  display: flex;
}

.services02-card-wrapper {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  border: 1px solid var(--white-0-1);
  border-radius: var(--_borders---border-16px);
  flex-flow: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: 2rem 2rem .5rem;
  display: flex;
}

.services02-header-wrapper {
  grid-column-gap: var(--_spacing---spacer-lg);
  grid-row-gap: var(--_spacing---spacer-lg);
  color: var(--white-200);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.services02-img-wrapper {
  justify-content: flex-end;
  align-self: flex-end;
  align-items: center;
  width: 200px;
  height: 200px;
  display: flex;
}

.square-div {
  background-color: var(--white-0-1);
  width: 8px;
  height: 8px;
}

.square-div-wrapper {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  display: flex;
}

.registration-of-animated-illustrations {
  width: 100%;
  height: 60vh;
  margin-top: -10rem;
}

@media screen and (max-width: 991px) {
  body {
    --_typography---main-font: "Instrument Sans", sans-serif;
    --_typography---font-size--paragraphs--body-base: 1rem;
    --_typography---line-height--line-height-reg: 160%;
    --_typography---font-weight--regular: 400;
    --_typography---font-size--headers--h1: 4.5rem;
    --_typography---line-height--line-height-sm: 120%;
    --_typography---font-weight--semibold: 600;
    --_typography---font-size--headers--h2: 3.5rem;
    --_typography---font-size--headers--h3: 2.75rem;
    --_typography---font-size--headers--h4: 2.25rem;
    --_typography---font-size--headers--h5: 1.75rem;
    --_typography---font-size--headers--h6: 1.5rem;
    --_typography---font-size--paragraphs--body-lg: 1.25rem;
    --_typography---line-height--line-height-md: 140%;
    --_typography---font-size--paragraphs--body-xl: 1.75rem;
    --_typography---font-size--paragraphs--body-xs: .75rem;
    --_typography---font-size--headers--header-sm: 1.25rem;
    --_typography---font-weight--medium: 500;
    --_typography---font-size--headers--header-lg: 2.5rem;
    --_typography---font-size--headers--header-xs: .875rem;
    --_typography---font-size--paragraphs--body-sm: .875rem;
    --_typography---font-weight--bold: 700;
    --_typography---header-font: "Inter Tight", sans-serif;
    --_typography---font-size--headers--header-md: 1.75rem;
    --_spacing---spacer-2xl: 5rem;
    --_spacing---spacer-xl: 3rem;
    --_spacing---spacer-xs: .25rem;
    --_spacing---spacer-md: 1rem;
    --_spacing---spacer-lg: 2rem;
    --_spacing---spacer-3xl: 6rem;
    --_spacing---spacer-5xl: 9rem;
    --_spacing---spacer-4xl: 8rem;
    --_spacing---spacer-sm: .5rem;
  }

  .default-container {
    max-width: 80rem;
  }

  .default-container.cta {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .section {
    padding-top: 8rem;
    padding-bottom: 8rem;
  }

  .template-fonts, .template-colors {
    grid-template-columns: 1fr 1fr;
  }

  .space-3xl {
    height: 4rem;
  }

  .space-4xl {
    height: 6rem;
  }

  .vertical-flex.left-align.template-support-page {
    padding-right: 0;
  }

  .solution-card {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .footer-link {
    font-size: 1.75rem;
  }

  .footer-copyright-wrapper {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0;
  }

  .footer-grid-wrapper {
    justify-content: space-between;
  }

  .hero-container {
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    padding-left: .75rem;
    padding-right: .75rem;
  }

  .hero-headline-wrapper, .hero-subheader-wrapper {
    padding-left: 2rem;
  }

  .hero-button {
    padding-right: 2rem;
  }

  .grid-12-column {
    flex-flow: column;
    display: flex;
  }

  .about-subheader-wrapper {
    width: 100%;
  }

  .h1-header {
    line-height: var(--_typography---line-height--line-height-sm);
  }

  .project-container-01, .sticky-container {
    grid-template-columns: 1fr 1fr;
  }

  .about-section-wrapper {
    height: auto;
  }

  .projects-button {
    padding-top: 0;
  }

  .text-img-span {
    height: 3.5rem;
  }

  .title-tag-about {
    padding-top: 0;
  }

  .projects-grid-wrapper {
    grid-template-columns: 1fr;
  }

  .project-item-02 {
    transform: translate(0);
  }

  .cta-text-wrapper {
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
    padding-right: 0;
    bottom: auto;
    right: auto;
  }

  .nav-menu-wrapper {
    width: 80vw;
  }

  .contact-pg-image {
    height: 30rem;
  }

  .contact-pg-hero-header {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .contact-pg-hero-wrapper {
    flex-flow: column;
  }

  .templates-grid-wrapper {
    grid-template-columns: 1fr;
  }

  .main-project-img {
    height: 60svh;
  }

  .cta2-img-wrapper {
    height: 60vh;
  }

  .cta-wrapper {
    justify-content: center;
    align-items: center;
    display: flex;
  }
}

@media screen and (max-width: 767px) {
  body {
    --_typography---main-font: "Instrument Sans", sans-serif;
    --_typography---font-size--paragraphs--body-base: 1rem;
    --_typography---line-height--line-height-reg: 160%;
    --_typography---font-weight--regular: 400;
    --_typography---font-size--headers--h1: 3.5rem;
    --_typography---line-height--line-height-sm: 120%;
    --_typography---font-weight--semibold: 600;
    --_typography---font-size--headers--h2: 2.75rem;
    --_typography---font-size--headers--h3: 2.25rem;
    --_typography---font-size--headers--h4: 1.875rem;
    --_typography---font-size--headers--h5: 1.5rem;
    --_typography---font-size--headers--h6: 1.25rem;
    --_typography---font-size--paragraphs--body-lg: 1.25rem;
    --_typography---line-height--line-height-md: 140%;
    --_typography---font-size--paragraphs--body-xl: 1.75rem;
    --_typography---font-size--paragraphs--body-xs: .75rem;
    --_typography---font-size--headers--header-sm: 1.25rem;
    --_typography---font-weight--medium: 500;
    --_typography---font-size--headers--header-lg: 2rem;
    --_typography---font-size--headers--header-xs: .875rem;
    --_typography---font-size--paragraphs--body-sm: .875rem;
    --_typography---font-weight--bold: 700;
    --_typography---header-font: "Inter Tight", sans-serif;
    --_typography---font-size--headers--header-md: 1.75rem;
    --_spacing---spacer-2xl: 4rem;
    --_spacing---spacer-xl: 2.75rem;
    --_spacing---spacer-xs: .25rem;
    --_spacing---spacer-md: 1rem;
    --_spacing---spacer-lg: 2rem;
    --_spacing---spacer-3xl: 4.5rem;
    --_spacing---spacer-5xl: 7rem;
    --_spacing---spacer-4xl: 6rem;
    --_spacing---spacer-sm: .5rem;
  }

  h2 {
    letter-spacing: -1.5px;
  }

  .default-container {
    max-width: 80rem;
  }

  .styleguide-header-light {
    margin-top: 3rem;
  }

  .section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .template-fonts {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .header-md {
    letter-spacing: -.6px;
  }

  .template-padding {
    grid-template-columns: 1fr;
  }

  .header-lg {
    letter-spacing: -.8px;
  }

  .template-colors {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .stats-card {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .accordion {
    padding: 2rem 1.5rem;
  }

  .solution-card {
    flex-flow: column;
    padding-left: 0;
    padding-right: 0;
    display: flex;
  }

  .footer-grid-wrapper {
    flex-flow: column;
    display: flex;
  }

  .footer-links-wrapper {
    justify-content: space-between;
    padding-right: 5rem;
  }

  .hero-headline-wrapper {
    padding-left: 1rem;
  }

  .hero-subheader-wrapper, .hero-button {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .h2-header {
    letter-spacing: -.5px;
  }

  .stats-wrapper {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .h1-header {
    font-size: var(--_typography---font-size--headers--h1);
  }

  .services-wrapper {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .project-container-01, .sticky-container {
    flex-flow: column;
    display: flex;
  }

  .process-item-wrapper._02 {
    transform: translate(-.2rem);
  }

  .process-item-wrapper._03 {
    transform: translate(-.4rem);
  }

  .process-item-wrapper._04 {
    transform: translate(-.6rem);
  }

  .text-img-span {
    width: 6rem;
    height: 2.5rem;
  }

  .testimonial-card {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .project-image-wrapper {
    height: 40vh;
  }

  .projects-subheader-wrapper {
    width: 100%;
  }

  .nav-menu-wrapper {
    width: 100vw;
  }

  .contact-pg-image {
    height: 25rem;
  }

  .template-item-card {
    height: 50vh;
  }

  .main-project-img, .other-project-images {
    height: 30rem;
  }

  .cta2-img-wrapper {
    height: 40vh;
  }
}

@media screen and (max-width: 479px) {
  body {
    --_typography---main-font: "Instrument Sans", sans-serif;
    --_typography---font-size--paragraphs--body-base: 1rem;
    --_typography---line-height--line-height-reg: 160%;
    --_typography---font-weight--regular: 400;
    --_typography---font-size--headers--h1: 2.5rem;
    --_typography---line-height--line-height-sm: 120%;
    --_typography---font-weight--semibold: 600;
    --_typography---font-size--headers--h2: 2rem;
    --_typography---font-size--headers--h3: 1.75rem;
    --_typography---font-size--headers--h4: 1.5rem;
    --_typography---font-size--headers--h5: 1.25rem;
    --_typography---font-size--headers--h6: 1.125rem;
    --_typography---font-size--paragraphs--body-lg: 1.25rem;
    --_typography---line-height--line-height-md: 140%;
    --_typography---font-size--paragraphs--body-xl: 1.5rem;
    --_typography---font-size--paragraphs--body-xs: .75rem;
    --_typography---font-size--headers--header-sm: 1.25rem;
    --_typography---font-weight--medium: 500;
    --_typography---font-size--headers--header-lg: 1.5rem;
    --_typography---font-size--headers--header-xs: .875rem;
    --_typography---font-size--paragraphs--body-sm: .875rem;
    --_typography---font-weight--bold: 700;
    --_typography---header-font: "Inter Tight", sans-serif;
    --_typography---font-size--headers--header-md: 1.25rem;
    --_spacing---spacer-2xl: 3rem;
    --_spacing---spacer-xl: 2.25rem;
    --_spacing---spacer-xs: .25rem;
    --_spacing---spacer-md: 1rem;
    --_spacing---spacer-lg: 2rem;
    --_spacing---spacer-3xl: 4rem;
    --_spacing---spacer-5xl: 5rem;
    --_spacing---spacer-4xl: 4.5rem;
    --_spacing---spacer-sm: .5rem;
  }

  .template-font-light {
    height: 8rem;
  }

  .template-button-container {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    flex-flow: column;
    align-items: flex-start;
  }

  .color {
    width: 100%;
  }

  .color.white {
    background-color: var(--white-100);
  }

  .body-lg.has-indent {
    text-indent: 50px;
  }

  .styleguide-title {
    font-size: 2rem;
  }

  .template-fonts {
    grid-template-columns: 1fr;
  }

  .template-colors {
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 1fr;
  }

  .space-4xl {
    height: 5rem;
  }

  .utility-page-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }

  .lottie-animation-02 {
    height: 200px;
  }

  .feature-card {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .solution-card {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .footer-link {
    font-size: 1.5rem;
  }

  .footer-copyright-wrapper {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
  }

  .footer-grid-wrapper {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .footer-links-wrapper {
    flex-flow: wrap;
    padding-right: 0;
  }

  .hero-subheader-wrapper {
    padding-left: 1rem;
  }

  .stats-wrapper {
    padding-top: 1rem;
  }

  .stats-description {
    line-height: var(--_typography---line-height--line-height-sm);
  }

  .services-tag-wrapper {
    flex-flow: wrap;
  }

  .services-tag {
    font-size: var(--_typography---font-size--paragraphs--body-xs);
  }

  .text-img-span {
    width: 3rem;
    height: 2rem;
  }

  .project-image-wrapper {
    height: 30vh;
  }

  .cta-text-wrapper {
    width: auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .nav-link {
    font-size: 2.5rem;
  }

  .email-nav-link {
    font-size: 1rem;
  }

  .contact-pg-image {
    height: 20rem;
  }

  .template-item-card {
    height: 50vh;
  }

  .main-project-img, .other-project-images {
    height: 16rem;
  }
}

#w-node-_12bf357c-eb48-8358-5ff4-17905ca7d901-2ad26277 {
  grid-area: 1 / 1 / 2 / 3;
}

#w-node-_5881a8e0-1e13-1da5-e7a0-4d83ccf7b322-2ad26277 {
  grid-area: 6 / 1 / 7 / 3;
}

#w-node-_23c2255a-4889-e3d0-ac61-84cefb5dd76c-2ad26277 {
  grid-area: 6 / 6 / 7 / 7;
  place-self: center end;
}

#w-node-_5c1ab6b5-2f74-fa39-6155-464654cc8113-2ad26277 {
  align-self: start;
}

#w-node-_5f875fe2-7b3f-ff16-b8de-6f8c41d96e29-2ad26277 {
  grid-area: 1 / 4 / 2 / 11;
}

#w-node-_88de03d6-7464-774b-0cd7-6ded8f08ec1d-2ad26277 {
  grid-area: 3 / 1 / 4 / 4;
}

#w-node-_4bb86307-1b35-b54c-444e-0699baf10f3c-2ad26277 {
  grid-area: 3 / 6 / 4 / 13;
}

#w-node-_930b497d-cde3-2131-64c6-b53a709dbf58-2ad26277 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_307c0f3b-8a6b-8d86-5a58-d338927b6217-2ad26277 {
  grid-area: 1 / 4 / 2 / 11;
}

#w-node-f35bc57d-fe21-b38d-cdf5-810ce0408edb-2ad26277 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_425187b2-3126-2a1e-d117-77c24b00b264-2ad26277 {
  grid-area: 1 / 4 / 2 / 10;
}

#w-node-_8a5bc74d-f5d2-dc4b-1c5b-68f90b777952-2ad26277 {
  grid-area: 1 / 11 / 2 / 13;
  place-self: start end;
}

#w-node-d3cf97b7-9578-41c4-c668-dc0ee6e97083-2ad26277 {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-d3cf97b7-9578-41c4-c668-dc0ee6e97087-2ad26277 {
  grid-area: 1 / 4 / 2 / 5;
}

#w-node-_0342d885-00e9-d23f-69ef-54d275ce8819-2ad26277 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-a04fc368-3ec6-bacd-81e6-fe6a0f8b4655-2ad26277 {
  grid-area: 1 / 7 / 2 / 13;
}

#w-node-_44323d5b-7c4f-83de-a107-37849b3387f3-2ad26277 {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_6ab630ae-f7c0-e65e-c9c1-2ae9d9f4297d-2ad26277 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_3a74b197-60bf-006e-58d3-5bf15b00f60d-2ad26277 {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_88beea1f-94c4-507c-ed59-b482d95c3b40-d95c3b3c {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-c64354f1-0d17-3efc-7066-fd9ffa991e79-d95c3b3c {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_88beea1f-94c4-507c-ed59-b482d95c3b53-d95c3b3c {
  grid-area: 1 / 10 / 2 / 13;
}

#w-node-_84cc8b75-e752-af3a-7002-c8b818cebdad-a8fae236 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-f0bd4437-3149-18f0-30c6-864da8fae239-a8fae236 {
  grid-area: 1 / 4 / 2 / 10;
}

#w-node-f0bd4437-3149-18f0-30c6-864da8fae23e-a8fae236 {
  grid-area: 1 / 11 / 2 / 13;
}

#w-node-deffa1c3-772b-a88a-d69f-2318ab203375-f21559d8 {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-deffa1c3-772b-a88a-d69f-2318ab20337b-f21559d8 {
  grid-area: 1 / 10 / 2 / 13;
  place-self: start end;
}

#w-node-_797559f4-faee-e551-05d6-ec093fc217a8-371b376d {
  grid-area: 1 / 3 / 2 / 11;
}

#w-node-_797559f4-faee-e551-05d6-ec093fc217cc-371b376d {
  grid-area: 1 / 5 / 2 / 13;
}

#w-node-deffa1c3-772b-a88a-d69f-2318ab203375-306afafa {
  grid-area: span 1 / span 7 / span 1 / span 7;
}

#w-node-deffa1c3-772b-a88a-d69f-2318ab20337b-306afafa {
  grid-area: 1 / 10 / 2 / 13;
  place-self: start end;
}

#w-node-e84ed308-f1eb-5434-57b8-b14295b38803-cfe46d9e {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-b3c5a1e7-384c-1eeb-027c-cb8660aad243-cfe46d9e {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_4c5098fb-2632-3204-aee3-71cb6f7a1d64-cfe46d9e {
  grid-area: 1 / 6 / 2 / 13;
}

#w-node-_3cab4d23-3775-0953-207a-2471180837b0-cfe46d9e {
  grid-area: span 1 / span 9 / span 1 / span 9;
}

#w-node-_4fc4f17d-f12c-f157-2b99-7688553822ed-cfe46d9e, #w-node-_7b7db42c-41b0-285d-c818-f4bac4d7b177-cfe46d9e {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_7b7db42c-41b0-285d-c818-f4bac4d7b179-cfe46d9e {
  grid-area: span 1 / span 9 / span 1 / span 9;
}

#w-node-e84ed308-f1eb-5434-57b8-b14295b38803-7bc91a2e {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-b3c5a1e7-384c-1eeb-027c-cb8660aad243-7bc91a2e {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_4c5098fb-2632-3204-aee3-71cb6f7a1d64-7bc91a2e {
  grid-area: 1 / 6 / 2 / 13;
}

#w-node-_56c80a78-b6ca-4f94-663f-9cf189b6ef31-7bc91a2e, #w-node-_56c80a78-b6ca-4f94-663f-9cf189b6ef33-7bc91a2e, #w-node-_3cab4d23-3775-0953-207a-2471180837b0-7bc91a2e, #w-node-_4fc4f17d-f12c-f157-2b99-7688553822ed-7bc91a2e {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_797559f4-faee-e551-05d6-ec093fc217a8-1f1d7fc2 {
  grid-area: 1 / 1 / 2 / 7;
}

#w-node-f4051c78-b7e7-a871-515f-23564db9d980-1f1d7fc2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_425513a7-abbe-112b-be73-ec86b3b78001-1f1d7fc2 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_425513a7-abbe-112b-be73-ec86b3b78006-1f1d7fc2 {
  grid-area: 1 / 4 / 2 / 11;
}

#w-node-_81fd226f-1dc3-8107-f0c8-76eb9bd60cd3-1f1d7fc2 {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

#w-node-_76fcbc24-ff1f-0478-0ed0-e1e404931da3-1f1d7fc2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_4aa1469f-1278-cedc-254f-3bf25e081f9a-1f1d7fc2 {
  grid-area: 1 / 10 / 3 / 13;
}

#w-node-_860011f4-b084-0839-e76e-9c20367856d1-1f1d7fc2 {
  grid-area: 2 / 1 / 3 / 7;
}

#w-node-d048e73c-a142-027b-badb-fb7254a52d8b-1f1d7fc2 {
  grid-area: 2 / 7 / 3 / 10;
}

#w-node-bc915d57-ac18-773d-d307-e486c3436ee7-1f1d7fc2 {
  grid-area: 3 / 7 / 4 / 13;
}

#w-node-af253e0f-ef56-af3e-82ce-097481454dae-1f1d7fc2 {
  grid-area: 3 / 1 / 4 / 4;
}

#w-node-_2ec64f09-92e7-4606-caa7-9ba4185aa53a-1f1d7fc2 {
  grid-area: 3 / 4 / 4 / 7;
}

@media screen and (max-width: 991px) {
  #w-node-_5881a8e0-1e13-1da5-e7a0-4d83ccf7b322-2ad26277 {
    grid-row: 4 / 5;
    grid-column-end: 3;
    align-self: center;
  }

  #w-node-_23c2255a-4889-e3d0-ac61-84cefb5dd76c-2ad26277 {
    grid-area: 4 / 3 / 5 / 5;
  }

  #w-node-d3cf97b7-9578-41c4-c668-dc0ee6e97083-2ad26277, #w-node-d3cf97b7-9578-41c4-c668-dc0ee6e97087-2ad26277 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_0342d885-00e9-d23f-69ef-54d275ce8819-2ad26277 {
    grid-column: span 1 / span 1;
  }

  #w-node-a04fc368-3ec6-bacd-81e6-fe6a0f8b4655-2ad26277 {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_88beea1f-94c4-507c-ed59-b482d95c3b53-d95c3b3c {
    grid-column: 7 / 9;
  }

  #w-node-f0bd4437-3149-18f0-30c6-864da8fae239-a8fae236 {
    grid-area: 2 / 1 / 3 / 6;
  }

  #w-node-f0bd4437-3149-18f0-30c6-864da8fae23e-a8fae236 {
    grid-area: 2 / 6 / 3 / 9;
  }
}

@media screen and (max-width: 767px) {
  #w-node-_12bf357c-eb48-8358-5ff4-17905ca7d901-2ad26277 {
    grid-row-start: 1;
  }

  #w-node-_5881a8e0-1e13-1da5-e7a0-4d83ccf7b322-2ad26277 {
    grid-row: 3 / 4;
    grid-column-end: 5;
    align-self: end;
  }

  #w-node-_23c2255a-4889-e3d0-ac61-84cefb5dd76c-2ad26277 {
    grid-column-start: 1;
    justify-self: start;
  }

  #w-node-_88beea1f-94c4-507c-ed59-b482d95c3b40-d95c3b3c {
    grid-column: span 6 / span 6;
  }

  #w-node-c64354f1-0d17-3efc-7066-fd9ffa991e79-d95c3b3c {
    grid-area: 2 / 1 / 3 / 4;
  }

  #w-node-_88beea1f-94c4-507c-ed59-b482d95c3b53-d95c3b3c {
    grid-area: 2 / 4 / 3 / 7;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_88beea1f-94c4-507c-ed59-b482d95c3b40-d95c3b3c {
    grid-column: span 4 / span 4;
  }

  #w-node-c64354f1-0d17-3efc-7066-fd9ffa991e79-d95c3b3c {
    grid-column-end: 3;
  }

  #w-node-_88beea1f-94c4-507c-ed59-b482d95c3b53-d95c3b3c {
    grid-column: 3 / 5;
  }
}