:root {
  --color--black: #241f21;
  --typography--h1: 6.25rem;
  --typography--h2: 6.25rem;
  --typography--h3: 4.0625rem;
  --typography--h4: 2.5rem;
  --typography--h5: 2.0625rem;
  --typography--h6: 1.5625rem;
  --size--55: 3.4375rem;
  --icon--24: 1.5rem;
  --size--150: 9.375rem;
  --size--80: 5rem;
  --size--100: 6.25rem;
  --color--white: #fff;
  --color--neutral-white: #edebe8;
  --container--padding: 2.625rem;
  --container--width: 86.875rem;
  --size--30: 1.875rem;
  --size--20: 1.25rem;
  --size--25: 1.5625rem;
  --size--40: 2.5rem;
  --color--ashy: #666262;
  --color--tan: #b4ad9c;
  --size--48: 3rem;
  --typography--paragraph-l: 1.375rem;
  --radius--round: 100%;
  --color--grey: #979794;
  --radius--20: 1.25rem;
  --size--16: 1rem;
  --size--8: .5rem;
  --radius--2: .125rem;
  --typography--paragraph-s: 1.125rem;
  --size--10: .625rem;
  --typography--paragraph-xs: 1rem;
  --color--red: #ed6c35;
  --size--4: .25rem;
  --radius--6: .375rem;
  --typography--paragraph: 1.25rem;
  --icon--35: 2.1875rem;
  --size--32: 2rem;
  --typography--jumbo: 8.75rem;
  --size--12: .75rem;
  --size--15: .9375rem;
  --size--18: 1.125rem;
  --icon--30: 1.875rem;
  --icon--16: 1rem;
  --radius--pill: 62.5rem;
}

body {
  color: var(--color--black);
  --color--black: #241f21;
  --typography--h1: 6.25rem;
  --typography--h2: 6.25rem;
  --typography--h3: 4.0625rem;
  --typography--h4: 2.5rem;
  --typography--h5: 2.0625rem;
  --typography--h6: 1.5625rem;
  --size--55: 3.4375rem;
  --icon--24: 1.5rem;
  --size--150: 9.375rem;
  --size--80: 5rem;
  --size--100: 6.25rem;
  --color--white: #fff;
  --color--neutral-white: #edebe8;
  --container--padding: 2.625rem;
  --container--width: 86.875rem;
  --size--30: 1.875rem;
  --size--20: 1.25rem;
  --size--25: 1.5625rem;
  --size--40: 2.5rem;
  --color--ashy: #666262;
  --color--tan: #b4ad9c;
  --size--48: 3rem;
  --typography--paragraph-l: 1.375rem;
  --radius--round: 100%;
  --color--grey: #979794;
  --radius--20: 1.25rem;
  --size--16: 1rem;
  --size--8: .5rem;
  --radius--2: .125rem;
  --typography--paragraph-s: 1.125rem;
  --size--10: .625rem;
  --typography--paragraph-xs: 1rem;
  --color--red: #ed6c35;
  --size--4: .25rem;
  --radius--6: .375rem;
  --typography--paragraph: 1.25rem;
  --icon--35: 2.1875rem;
  --size--32: 2rem;
  --typography--jumbo: 8.75rem;
  --size--12: .75rem;
  --size--15: .9375rem;
  --size--18: 1.125rem;
  --icon--30: 1.875rem;
  --icon--16: 1rem;
  --radius--pill: 62.5rem;
  font-family: Articulat, Arial, sans-serif;
  font-size: .875rem;
  line-height: 1.5em;
}

h1 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h1);
  letter-spacing: -.02em;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 300;
  line-height: .9em;
}

h2 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h2);
  letter-spacing: -.03em;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 300;
  line-height: 1em;
}

h3 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h3);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 300;
  line-height: 1.077em;
}

h4 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h4);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1.375em;
}

h5 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h5);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1em;
}

h6 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h6);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1em;
}

p {
  margin-bottom: 0;
  line-height: 1.5em;
}

a {
  color: currentColor;
  text-decoration: none;
}

ul {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 1.5rem;
}

ol {
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 40px;
}

li {
  padding-left: .25rem;
}

label {
  margin-bottom: 0;
  font-family: Feature Text, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 300;
  display: block;
}

.hide {
  display: none;
}

.navbar {
  z-index: 1002;
  padding-top: var(--size--55);
  padding-bottom: var(--size--55);
  background-color: #0000;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0% 0% auto;
}

.page-wrapper {
  overflow: clip;
}

.section {
  padding-top: var(--size--150);
  padding-bottom: var(--size--150);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.section.home-hero {
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  height: 300vw;
  padding-top: 0;
  padding-bottom: 0;
  overflow: clip;
}

.section.home-text-reveal {
  padding-top: var(--size--80);
  background-color: var(--color--black);
  justify-content: flex-start;
  align-items: center;
}

.section.home-projects {
  background-color: var(--color--white);
  padding-top: 10.875rem;
  padding-bottom: 10.875rem;
}

.section.home-tabs {
  background-color: var(--color--black);
  min-height: 100vh;
  color: var(--color--white);
}

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

.section.contact-hero {
  padding-top: 14.8125rem;
  padding-bottom: 1.25rem;
}

.section.project-template-hero {
  padding-top: 16rem;
}

.section.project-section-client-needs {
  padding-top: var(--size--100);
  padding-bottom: 0;
}

.section.project-section-intro {
  padding-top: 0;
  padding-bottom: 0;
}

.section.project-section-video {
  padding-top: var(--size--100);
  padding-bottom: 0;
}

.section.project-section-our-approach {
  padding-top: var(--size--100);
  padding-bottom: var(--size--100);
}

.section.project-section-outcomes {
  padding-top: 0;
  padding-bottom: 6.25rem;
}

.section.cta {
  padding-top: var(--size--100);
  padding-bottom: 0;
}

.section.footer {
  padding-top: var(--size--100);
  padding-bottom: var(--size--55);
}

.section.testimonials {
  background-color: var(--color--neutral-white);
  padding-top: 8.375rem;
  padding-bottom: 8.375rem;
}

.section.about-hero {
  padding-top: 22rem;
  padding-bottom: 41.125rem;
}

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

.container {
  width: 100%;
  padding-right: var(--container--padding);
  padding-left: var(--container--padding);
  max-width: calc(var(--container--width)  + 2 * var(--container--padding));
}

.container.nav {
  grid-column-gap: var(--size--55);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.container.grid {
  grid-column-gap: var(--size--20);
  grid-row-gap: var(--size--25);
  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;
}

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

.brand {
  z-index: 5;
  flex: none;
  width: 4.6875rem;
  height: 1.9375rem;
  transition: transform .2s, color .2s;
  position: relative;
}

.brand:hover {
  transform: scale(1.05);
}

.nav-links-list {
  grid-column-gap: var(--size--55);
  justify-content: flex-start;
  align-items: center;
  padding-left: 0;
  display: flex;
}

.nav-link {
  color: var(--color--ashy);
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.135rem;
  transition: color .2s;
  display: block;
}

.menu-button {
  background-color: #0000;
  border: 1px #000;
  border-radius: 0;
  flex-flow: column;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: none;
}

.contain-image {
  object-fit: contain;
  width: 100%;
  height: 100%;
  display: block;
}

.cover-image {
  -webkit-text-fill-color: inherit;
  object-fit: cover;
  background-clip: border-box;
  width: 100%;
  height: 100%;
  display: block;
  overflow: clip;
}

.nav-bg {
  z-index: -1;
  pointer-events: none;
  position: absolute;
  inset: 0%;
}

.margin-48 {
  margin-bottom: var(--size--48);
}

.text-color-ashy {
  color: var(--color--ashy);
}

.paragraph-l {
  font-size: var(--typography--paragraph-l);
  line-height: 1.5em;
}

.text-white {
  color: var(--color--white);
}

.text-white.text-italic {
  font-weight: 300;
}

.eyebrow-block {
  grid-column-gap: .625rem;
  grid-row-gap: .625rem;
  color: var(--color--white);
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h6);
  justify-content: flex-start;
  align-items: center;
  line-height: 1em;
  display: flex;
}

.eyebrow-icon {
  border-radius: var(--radius--round);
  background-color: var(--color--tan);
  flex: none;
  width: .625rem;
  height: .625rem;
}

.margin-150 {
  margin-bottom: var(--size--150);
}

.h5 {
  font-size: var(--typography--h5);
  line-height: 1.25em;
}

.h5.articulat-font.text-white, .h5.articulat-font.margin-32 {
  font-size: var(--typography--h6);
}

.h5.margin-25 {
  font-size: var(--typography--h6);
  font-weight: 400;
  font-size: var(--typography--h6);
  font-weight: 400;
}

.text-color-grey {
  color: var(--color--grey);
}

.max-width-880 {
  width: 100%;
  max-width: 55rem;
}

.cta-block {
  width: 100%;
  padding: var(--size--150) var(--size--48);
  border-radius: var(--radius--20);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: clip;
}

.cta-image-bg {
  z-index: -1;
  pointer-events: none;
  position: absolute;
  inset: 0%;
}

.cta-block-content {
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.button {
  padding: var(--size--16) 6.875rem;
  grid-column-gap: var(--size--8);
  grid-row-gap: var(--size--8);
  border-radius: var(--radius--2);
  background-color: var(--color--black);
  color: var(--color--neutral-white);
  font-size: var(--typography--paragraph-s);
  justify-content: center;
  align-items: center;
  line-height: 1em;
  display: flex;
}

.margin-10 {
  margin-bottom: var(--size--10);
}

.margin-40 {
  margin-bottom: var(--size--40);
}

.button-text {
  filter: drop-shadow(0 1.25rem 0);
  transition-property: transform;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.455, .03, .515, .955);
}

.button-text-inner, .nav-link-inner {
  overflow: clip;
}

.nav-link-text {
  filter: drop-shadow(0 1.25rem 0);
  transition-property: transform;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.455, .03, .515, .955);
}

.footer-block {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.footer-logo {
  width: 9.375rem;
  transition: color .2s;
}

.footer-logo:hover {
  color: var(--color--grey);
}

.paragraph-xs {
  font-size: var(--typography--paragraph-xs);
  line-height: 1.2em;
}

.icon-24 {
  width: var(--icon--24);
  height: var(--icon--24);
  display: block;
}

.footer-social-block {
  grid-column-gap: var(--size--10);
  grid-row-gap: var(--size--10);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.overflow-clip {
  overflow: clip;
}

.hover-grey {
  transition: color .2s;
}

.hover-grey:hover {
  color: var(--color--grey);
}

.letter-spacing-negative-1 {
  letter-spacing: -.01em;
}

.swiper {
  width: 100%;
}

.swiper.testimonials {
  position: relative;
}

.swiper-wrapper {
  display: flex;
}

.swiper-wrapper.testimonials {
  width: 100%;
}

.swiper-wrapper.testimonials-control {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

.swiper-slide {
  flex: none;
}

.swiper-slide.testimonials {
  width: 100%;
}

.swiper-slide.testimonials-control {
  width: 100%;
  max-width: 10.9375rem;
}

.testimonials-block {
  grid-row-gap: 4rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 59.6875rem;
  display: flex;
  position: relative;
}

.testimonial-item {
  grid-column-gap: var(--size--30);
  grid-row-gap: var(--size--30);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding-left: 3.75rem;
  padding-right: 3.75rem;
  display: flex;
}

.flex-horizontal-center {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.testimonials-rate-icon {
  border-radius: var(--radius--round);
  background-color: var(--color--red);
  width: .625rem;
  height: .625rem;
}

.gap-4 {
  row-gap: var(--size--4);
  column-gap: var(--size--4);
}

.gap-20 {
  row-gap: var(--size--20);
  column-gap: var(--size--20);
}

.paragraph {
  color: var(--color--ashy);
  font-size: var(--typography--paragraph-s);
  line-height: 1.65em;
}

.h4 {
  font-size: var(--typography--h4);
}

.h3 {
  font-family: Feature Text, Arial, sans-serif;
  font-size: var(--typography--h3);
  font-weight: 300;
  line-height: 1em;
}

.h3.margin-25 {
  font-size: var(--typography--h4);
  letter-spacing: 1px;
}

.testimonial-author-image {
  border-radius: var(--radius--round);
  width: 4.0625rem;
  height: 4.0625rem;
  overflow: clip;
}

.gap-16 {
  row-gap: var(--size--16);
  column-gap: var(--size--16);
}

.text-all-caps {
  text-transform: uppercase;
}

.text-medium {
  font-weight: 500;
}

.testimonials-company-logo {
  border: .0625rem solid var(--color--tan);
  border-radius: var(--radius--6);
  width: 100%;
  box-shadow: none;
  cursor: pointer;
  padding: 0;
  transition: box-shadow .2s, background-color .2s;
  overflow: clip;
}

.testimonials-company-logo:hover {
  background-color: rgb(from var(--color--white) r g b / .3);
}

.align-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.flex-horizontal-center-wrap {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.testimonials-arrow {
  width: 2.1875rem;
  height: 1.875rem;
  color: var(--color--tan);
  background-color: #0000;
  padding: 0;
  transition: color .2s;
  position: absolute;
  top: 8rem;
  right: 100%;
}

.testimonials-arrow:hover {
  color: var(--color--black);
}

.testimonials-arrow.is-right {
  left: 100%;
  right: auto;
  transform: rotate(180deg);
}

.margin-25 {
  margin-bottom: var(--size--25);
}

.about-hero-image {
  width: 19rem;
  height: 12.5rem;
  position: absolute;
  top: 15%;
  right: 40%;
  overflow: clip;
}

.about-hero-image._2 {
  width: 25.3125rem;
  height: 18.75rem;
  inset: auto auto 10% 15%;
}

.about-hero-image._3 {
  width: 29.4375rem;
  height: 19.625rem;
  inset: auto 5% 24% auto;
}

.max-width-320 {
  width: 100%;
  max-width: 20rem;
}

.hide-on-desktop {
  display: none;
}

.our-code-block {
  grid-column-gap: var(--size--48);
  grid-row-gap: var(--size--48);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.our-code-icon {
  flex: none;
  width: 3rem;
  height: 3rem;
  display: block;
}

.our-code-card {
  grid-column-gap: var(--size--25);
  grid-row-gap: var(--size--25);
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.our-code-content {
  grid-row-gap: var(--size--20);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.h6 {
  font-size: var(--typography--h6);
}

.divider {
  background-color: var(--color--ashy);
  width: 100%;
  height: .0625rem;
}

.letter-spacing-1 {
  letter-spacing: .01em;
}

.swiper-testimonials-control-wrapper {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
  overflow: clip;
}

.testimonials-control-arrow {
  z-index: 5;
  width: 2.1875rem;
  height: 1.875rem;
  color: var(--color--tan);
  background-color: #0000;
  flex: none;
  padding: 0;
  transition: color .2s;
  position: absolute;
  left: 0%;
}

.testimonials-control-arrow:hover {
  color: var(--color--black);
}

.testimonials-control-arrow.is-right {
  left: auto;
  right: 0%;
  transform: rotate(180deg);
}

.max-width-614 {
  width: 100%;
  max-width: 38.375rem;
}

.h2 {
  font-size: var(--typography--h3);
  letter-spacing: 0;
}

.centered {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.text-block, .text-block-2 {
  letter-spacing: 1px;
  font-weight: 300;
}

@media screen and (max-width: 991px) {
  body {
    --color--black: #241f21;
    --typography--h1: 4.6875rem;
    --typography--h2: 3.5rem;
    --typography--h3: 3.125rem;
    --typography--h4: 2.25rem;
    --typography--h5: 1.75rem;
    --typography--h6: 1.375rem;
    --size--55: 3.125rem;
    --icon--24: 1.5rem;
    --size--150: 8.25rem;
    --size--80: 4rem;
    --size--100: 5.5rem;
    --color--white: #fff;
    --color--neutral-white: #edebe8;
    --container--padding: 2.625rem;
    --container--width: 86.875rem;
    --size--30: 1.75rem;
    --size--20: 1.125rem;
    --size--25: 1.375rem;
    --size--40: 2.25rem;
    --color--ashy: #666262;
    --color--tan: #b4ad9c;
    --size--48: 2.5rem;
    --typography--paragraph-l: 1.25rem;
    --radius--round: 100%;
    --color--grey: #979794;
    --radius--20: 1.125rem;
    --size--16: 1rem;
    --size--8: .5rem;
    --radius--2: .125rem;
    --typography--paragraph-s: 1.0625rem;
    --size--10: .625rem;
    --typography--paragraph-xs: 1rem;
    --color--red: #ed6c35;
    --size--4: .25rem;
    --radius--6: .375rem;
    --typography--paragraph: 1.0625rem;
    --icon--35: 2.1875rem;
    --size--32: 1.75rem;
    --typography--jumbo: 7.25rem;
    --size--12: .75rem;
    --size--15: .9375rem;
    --size--18: 1.125rem;
    --icon--30: 1.875rem;
    --icon--16: 1rem;
    --radius--pill: 62.5rem;
  }

  .navbar {
    padding-top: var(--icon--24);
    padding-bottom: var(--icon--24);
    position: fixed;
  }

  .section.home-hero {
    justify-content: center;
    align-items: center;
    height: 100dvh;
    padding-bottom: 3.75rem;
  }

  .section.work-hero {
    padding-top: 12rem;
  }

  .section.about-hero {
    padding-bottom: 30rem;
  }

  .section.project-template-hero {
    padding-top: 10rem;
  }

  .container.nav {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .brand {
    width: 3.5rem;
    height: 1.5rem;
  }

  .nav-menu {
    background-color: var(--color--white);
    height: 100dvh;
  }

  .nav-menu-inner {
    width: 100%;
    height: 100%;
    padding: 4rem 1.25rem 1.25rem;
  }

  .nav-links-list {
    grid-column-gap: 0rem;
    grid-row-gap: var(--size--40);
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .nav-link {
    font-size: 2rem;
    line-height: 1.1em;
  }

  .menu-button {
    z-index: 5;
    color: var(--color--tan);
    margin-top: -.25rem;
    margin-bottom: -.25rem;
    padding-top: .25rem;
    padding-bottom: .25rem;
    display: flex;
    position: relative;
  }

  .menu-button.w--open {
    background-color: #0000;
  }

  .burger {
    width: 1.8125rem;
    height: 1.25rem;
    color: var(--color--tan);
    flex-flow: column;
    flex: none;
    justify-content: space-between;
    align-items: flex-end;
    display: flex;
  }

  .burger-line {
    background-color: currentColor;
    border-radius: .1875rem;
    flex: none;
    width: 100%;
    height: .1875rem;
    padding: 0;
  }

  .burger-line._1 {
    width: 75%;
  }

  .burger-line._3 {
    width: 55%;
  }

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

  .home-hero-title {
    text-align: center;
  }

  .home-hero-video-block {
    justify-content: center;
    align-items: center;
  }

  .nav-link-text {
    filter: none;
  }

  .projects-list {
    grid-row-gap: 6rem;
  }

  .home-projects-more-link {
    bottom: 30vw;
    right: 10vw;
  }

  .horizontal-camera {
    width: 100%;
    height: auto;
    padding-top: 0;
    position: static;
    overflow: clip;
  }

  .horizontal-frame {
    flex-flow: column;
  }

  .home-heading-span {
    display: inline;
  }

  .hide-on-tablet {
    display: none;
  }

  .home-tabs-block {
    grid-column-gap: 3rem;
    grid-row-gap: 3rem;
    grid-template-columns: .75fr 1fr;
  }

  .home-tabs-content {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column-reverse;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: flex-start;
    align-items: stretch;
    display: flex;
  }

  .home-tabs-image {
    width: 100%;
    max-width: none;
    height: 55vw;
  }

  .tab-question {
    font-size: var(--typography--paragraph);
    text-align: left;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .home-tabs-content-wrapper {
    min-height: 75vw;
  }

  .works-item-visual {
    aspect-ratio: auto;
    width: 100%;
    height: 10rem;
    display: block;
    position: static;
  }

  .preview-follower {
    display: none;
  }

  .about-hero-image {
    right: 20%;
  }

  .about-hero-image._2 {
    width: 20rem;
    height: 14rem;
    left: 5%;
  }

  .about-hero-image._3 {
    width: 20rem;
    height: 15rem;
    bottom: 35%;
  }

  .hide-on-desktop {
    display: block;
  }

  .project-hero-image {
    height: 60vw;
  }

  .project-template-section-1-row {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    justify-content: space-between;
    align-items: center;
    padding-left: 0;
  }

  .clients-needs-section-images-1 {
    margin-bottom: 4rem;
  }

  .clients-needs-section-images-2 {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .clients-needs-section-image-2 {
    height: 25rem;
  }

  .outcomes-section-images-2 {
    grid-column-gap: 4rem;
    grid-row-gap: 4rem;
    flex-flow: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .our-aproach-section-image-2 {
    max-width: 20rem;
    height: 50vw;
  }

  .our-aproach-section-image-3 {
    max-width: 20rem;
  }

  .outcomes-section-images-1 {
    grid-column-gap: 4rem;
    grid-row-gap: 4rem;
  }

  .outcomes-section-image-3 {
    height: 25rem;
  }

  .next-article-image {
    width: 15rem;
    height: 9rem;
  }

  .client-needs-photos, .our-approach-photos {
    grid-column-gap: 2rem;
  }
}

@media screen and (max-width: 767px) {
  body {
    --color--black: #241f21;
    --typography--h1: 4.6875rem;
    --typography--h2: 2.875rem;
    --typography--h3: 2.5rem;
    --typography--h4: 2rem;
    --typography--h5: 1.5625rem;
    --typography--h6: 1.125rem;
    --size--55: 2.8125rem;
    --icon--24: 1.5rem;
    --size--150: 6rem;
    --size--80: 3rem;
    --size--100: 5rem;
    --color--white: #fff;
    --color--neutral-white: #edebe8;
    --container--padding: 1.25rem;
    --container--width: 86.875rem;
    --size--30: 1.5625rem;
    --size--20: 1.125rem;
    --size--25: 1.25rem;
    --size--40: 1.875rem;
    --color--ashy: #666262;
    --color--tan: #b4ad9c;
    --size--48: 2.25rem;
    --typography--paragraph-l: 1.0625rem;
    --radius--round: 100%;
    --color--grey: #979794;
    --radius--20: 1rem;
    --size--16: 1rem;
    --size--8: .5rem;
    --radius--2: .125rem;
    --typography--paragraph-s: 1.0625rem;
    --size--10: .625rem;
    --typography--paragraph-xs: 1rem;
    --color--red: #ed6c35;
    --size--4: .25rem;
    --radius--6: .375rem;
    --typography--paragraph: 1.0625rem;
    --icon--35: 2.1875rem;
    --size--32: 1.5rem;
    --typography--jumbo: 5.75rem;
    --size--12: .75rem;
    --size--15: .9375rem;
    --size--18: 1.125rem;
    --icon--30: 1.875rem;
    --icon--16: 1rem;
    --radius--pill: 62.5rem;
  }

  .section.home-projects, .section.testimonials {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

  .section.home-hero {
    justify-content: center;
    align-items: center;
    height: auto;
    padding-bottom: 3.125rem;
  }

  .section.home-text-reveal {
    height: auto;
    padding-bottom: var(--size--80);
  }

  .section.cta {
    padding-top: 0;
  }

  .section.home-projects, .section.testimonials {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

  .section.home-tabs {
    min-height: auto;
  }

  .section.work-hero {
    padding-top: 8.75rem;
    padding-bottom: 6.25rem;
  }

  .section.contact-hero {
    padding-top: 7rem;
  }

  .container.margin-150.margin-30-mobile {
    margin-bottom: var(--size--30);
    margin-bottom: var(--size--30);
  }

  .container.grid {
    grid-row-gap: var(--size--25);
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .brand {
    width: 3.125rem;
    height: 1.25rem;
  }

  .home-hero-title {
    text-align: center;
    font-size: 2rem;
    line-height: 1em;
  }

  .home-hero-video-block {
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .cta-block {
    width: 100vw;
    margin-left: calc(-1 * var(--container--padding));
    border-radius: 0;
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }

  .button {
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .footer-block {
    grid-column-gap: 1.625rem;
    grid-row-gap: 1.625rem;
    flex-flow: wrap;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: center;
    place-items: center;
    display: grid;
  }

  .footer-logo.w--current {
    width: 7.5rem;
  }

  .projects-block {
    overflow: visible;
  }

  .projects-list {
    grid-row-gap: 3.75rem;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .home-projects-heading-block {
    margin-bottom: 3.75rem;
    position: static;
  }

  .home-projects-heading-inner {
    position: static;
  }

  .home-projects-more-link {
    justify-content: center;
    align-items: center;
    margin-top: 3.75rem;
    position: static;
  }

  .swiper.testimonials-control {
    display: none;
  }

  .swiper-slide.testimonials {
    width: 80%;
  }

  .testimonial-item {
    padding-left: 0;
    padding-right: 0;
  }

  .testimonial-author-image {
    flex: none;
  }

  .horizontal-camera {
    width: 100%;
    height: auto;
    padding-top: 6.25rem;
  }

  .horizontal-frame {
    flex-flow: column;
  }

  .hide-on-landscape {
    display: none;
  }

  .home-heading-span {
    font-size: 5rem;
    line-height: 1em;
  }

  .text-center-mobile {
    text-align: center;
  }

  .testimonials-arrow {
    z-index: 5;
    top: 0;
    left: auto;
    right: 0;
  }

  .testimonials-arrow.is-left {
    right: 2.5rem;
  }

  .testimonials-arrow.is-right {
    left: auto;
    right: 0;
  }

  .home-tabs-block {
    flex-flow: column;
    display: flex;
  }

  .home-tabs-content {
    position: static;
  }

  .home-tabs-content.active {
    flex-flow: column;
  }

  .tab-question {
    width: 100%;
    color: var(--color--white);
    justify-content: space-between;
    align-items: center;
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    font-size: 1.5625rem;
  }

  .tab-answer {
    width: 100%;
    display: block;
    overflow: clip;
  }

  .home-tabs-content-wrapper {
    display: none;
  }

  .tab-accordion {
    border-top: .0625rem solid var(--color--ashy);
    width: 100%;
  }

  .tab-question-icon {
    width: 1rem;
    height: 1rem;
    transition: color .2s;
    display: block;
  }

  .works-list {
    flex-flow: column;
  }

  .works-item-block {
    padding: 0 1rem;
  }

  .works-item-row-col.large {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex: 0 auto;
    width: auto;
    max-width: none;
    font-size: 1.25rem;
  }

  .works-item-row-col.medium {
    flex: none;
    width: 9.375rem;
    max-width: none;
    height: 5rem;
  }

  .works-item-row {
    justify-content: space-between;
    align-items: center;
  }

  .works-item-visual {
    height: 100%;
  }

  .about-hero-image {
    width: 15rem;
    height: 10rem;
  }

  .about-hero-image._2 {
    width: 16rem;
    height: 12rem;
    bottom: 19%;
  }

  .about-hero-image._3 {
    width: 15rem;
    height: 10rem;
  }

  .no-max-w-mobile {
    max-width: none;
  }

  .our-code-block {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex;
  }

  .form-radio-group {
    grid-column-gap: 2rem;
    grid-row-gap: 1rem;
  }

  .project-hero-image {
    width: 100vw;
    height: 20rem;
    margin-left: calc(-1 * var(--container--padding));
  }

  .project-template-hero-cards-block {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .project-template-section-1-row._2nd {
    grid-column-gap: 4rem;
    grid-row-gap: 4rem;
    flex-flow: column;
  }

  .project-template-section-1-row._1st {
    grid-column-gap: 4rem;
    grid-row-gap: 4rem;
    flex-flow: column;
    margin-bottom: 4rem;
  }

  .project-template-image._2, .project-template-image._3 {
    width: 100%;
  }

  .project-template-image._1 {
    width: 100%;
    height: auto;
  }

  .project-template-image._4 {
    width: 100%;
    margin-top: 0;
  }

  .project-template-image._2, .project-template-image._3 {
    width: 100%;
  }

  .clients-needs-numbers-block {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .clients-needs-section-image-2 {
    height: 50vw;
  }

  .our-aproach-section-images-1 {
    margin-bottom: 4rem;
  }

  .our-aproach-section-image-2 {
    max-width: none;
    height: auto;
  }

  .our-aproach-section-image-3 {
    max-width: none;
    margin-left: auto;
  }

  .our-aproach-section-image-4 {
    max-width: none;
    margin-right: auto;
  }

  .our-aproach-column {
    grid-column-gap: 4rem;
    grid-row-gap: 4rem;
    flex-flow: wrap;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
  }

  .outcomes-section-images-1 {
    flex-flow: column;
    margin-bottom: 4rem;
  }

  .outcomes-section-image-1 {
    max-width: none;
    height: 70vw;
  }

  .outcomes-section-image-2 {
    max-width: none;
    margin-top: 0;
  }

  .project-intro-video-block {
    width: 100vw;
    margin-left: calc(-1 * var(--container--padding));
  }

  .next-article-block {
    margin-top: 6rem;
  }

  .client-needs-photos {
    grid-row-gap: 2rem;
    flex-flow: column;
    align-items: stretch;
  }

  .our-approach-photos {
    grid-row-gap: 2rem;
    flex-flow: column;
    display: flex;
  }

  .outcomes-photos {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
    align-items: stretch;
  }

  .testimonials-control-arrow {
    z-index: 5;
    top: 0;
    left: auto;
    right: 0;
  }

  .testimonials-control-arrow.is-left {
    right: 2.5rem;
  }

  .testimonials-control-arrow.is-right {
    left: auto;
    right: 0;
  }
}

@media screen and (max-width: 479px) {
  body {
    --color--black: #241f21;
    --typography--h1: 4.6875rem;
    --typography--h2: 2.1875rem;
    --typography--h3: 2.0625rem;
    --typography--h4: 1.875rem;
    --typography--h5: 1.5625rem;
    --typography--h6: 1rem;
    --size--55: 2.5rem;
    --icon--24: 1.5rem;
    --size--150: 5rem;
    --size--80: 3rem;
    --size--100: 5rem;
    --color--white: #fff;
    --color--neutral-white: #edebe8;
    --container--padding: 1.25rem;
    --container--width: 86.875rem;
    --size--30: 1.5625rem;
    --size--20: 1.125rem;
    --size--25: 1.25rem;
    --size--40: 1.875rem;
    --color--ashy: #666262;
    --color--tan: #b4ad9c;
    --size--48: 2.25rem;
    --typography--paragraph-l: 1.0625rem;
    --radius--round: 100%;
    --color--grey: #979794;
    --radius--20: 1rem;
    --size--16: 1rem;
    --size--8: .5rem;
    --radius--2: .125rem;
    --typography--paragraph-s: 1.0625rem;
    --size--10: .625rem;
    --typography--paragraph-xs: 1rem;
    --color--red: #ed6c35;
    --size--4: .25rem;
    --radius--6: .375rem;
    --typography--paragraph: 1.0625rem;
    --icon--35: 2.1875rem;
    --size--32: 1.5rem;
    --typography--jumbo: 4.6875rem;
    --size--12: .75rem;
    --size--15: .9375rem;
    --size--18: 1.125rem;
    --icon--30: 1.875rem;
    --icon--16: 1rem;
    --radius--pill: 62.5rem;
  }

  .section.home-hero {
    justify-content: center;
    align-items: flex-start;
    padding-top: 5.875rem;
    padding-bottom: 3.125rem;
  }

  .section.footer {
    padding-top: var(--size--80);
  }

  .section.about-hero {
    padding-top: 8.8125rem;
    padding-bottom: 14.0625rem;
  }

  .home-hero-title {
    font-size: 1.5625rem;
  }

  .cta-block {
    padding-right: var(--size--40);
    padding-left: var(--size--40);
  }

  .cta-image-bg {
    left: -52%;
  }

  .cta-block-content {
    width: 100%;
  }

  .button {
    width: 100%;
    padding-right: var(--size--16);
    padding-left: var(--size--16);
    justify-content: center;
    align-items: center;
  }

  .footer-block {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .swiper-slide.testimonials {
    width: 100%;
  }

  .horizontal-camera {
    padding-top: 0;
  }

  .home-heading-span {
    font-size: 5rem;
  }

  .home-tabs-image {
    height: 100vw;
  }

  .works-item-block {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .works-item-row-col.large {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .about-hero-image {
    width: 6.25rem;
    height: 4.1875rem;
  }

  .about-hero-image._2 {
    width: 8.3125rem;
    height: 6.25rem;
  }

  .about-hero-image._3 {
    width: 9.6875rem;
    height: 6.5rem;
    right: calc(-1 * var(--container--padding));
  }

  .form-field-row {
    grid-column-gap: var(--size--25);
  }

  .form-radio-group {
    grid-template-rows: auto;
    grid-template-columns: 1fr;
  }

  .project-hero-image {
    height: 14.5rem;
  }

  .project-template-hero-cards-block {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .utility-page-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .project-template-section-1-row {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .project-template-section-1-row._2nd {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    justify-content: space-between;
    align-items: flex-start;
  }

  .project-template-section-1-row._1st {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    align-items: stretch;
    margin-bottom: 2rem;
  }

  .project-template-image._4 {
    width: 100%;
    height: auto;
  }

  .project-template-image._2 {
    width: 100%;
    height: auto;
    margin-right: -2.625rem;
  }

  .project-template-image._3 {
    width: 100%;
    height: auto;
    margin-left: 0;
  }

  .clients-needs-numbers-block {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .clients-needs-section-image-1 {
    height: auto;
  }

  .clients-needs-section-images-1 {
    margin-bottom: 2rem;
  }

  .clients-needs-section-images-2 {
    grid-template-columns: 1fr;
  }

  .our-approach-section-image-1 {
    height: auto;
  }

  .our-aproach-section-images-1 {
    margin-bottom: 2rem;
  }

  .outcomes-section-images-2, .our-aproach-column {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .outcomes-section-images-1 {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    margin-bottom: 2rem;
  }

  .outcomes-section-image-1, .outcomes-section-image-2 {
    height: 15rem;
  }

  .project-intro-video-block {
    width: 100vw;
    height: 8.125rem;
    margin-left: calc(-1 * var(--container--padding));
  }

  .next-article-link {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    flex-flow: column;
  }

  .next-article-block {
    margin-top: 5rem;
  }
}

#w-node-faed73bb-02da-ca24-aa7e-2a50fbb6deb7-fcdc8fff {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-f20540bf-057f-bd87-f52e-6270d01fb3b4-fcdc8fff {
  grid-area: 1 / 7 / 2 / 12;
}

#w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe33-fcdc8fff, #w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe3c-fcdc8fff, #w-node-_5f6c00b8-0d13-bc54-7483-f341215e7c5e-fcdc8fff, #w-node-_5f6c00b8-0d13-bc54-7483-f341215e7c61-fcdc8fff, #w-node-d6acf96c-7164-6a4c-7b3b-a0c8534c8ed0-fcdc8fff {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-d6acf96c-7164-6a4c-7b3b-a0c8534c8ed9-fcdc8fff {
  grid-area: 1 / 7 / 2 / 13;
}

@media screen and (max-width: 991px) {
  #w-node-f20540bf-057f-bd87-f52e-6270d01fb3b4-fcdc8fff {
    grid-column-end: 13;
  }

  #w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe33-fcdc8fff, #w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe3c-fcdc8fff {
    grid-column: span 12 / span 12;
  }
}

@media screen and (max-width: 767px) {
  #w-node-faed73bb-02da-ca24-aa7e-2a50fbb6deb7-fcdc8fff, #w-node-f20540bf-057f-bd87-f52e-6270d01fb3b4-fcdc8fff, #w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe33-fcdc8fff, #w-node-c86ce465-dcb3-e3a7-7a09-22d502a8fe3c-fcdc8fff, #w-node-_5f6c00b8-0d13-bc54-7483-f341215e7c5e-fcdc8fff, #w-node-_5f6c00b8-0d13-bc54-7483-f341215e7c61-fcdc8fff, #w-node-d6acf96c-7164-6a4c-7b3b-a0c8534c8ed9-fcdc8fff {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-_914d98c9-1ea6-6f52-2877-63c2cdb23973-cdb2393e {
    order: 9999;
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_914d98c9-1ea6-6f52-2877-63c2cdb23973-cdb2393e {
    grid-column: span 1 / span 1;
  }
}