@media only screen and (max-width: 990px) {

  .pt64 {padding-top:48px;}

  .pb80 {padding-bottom:64px;}

  .mb32 {
    margin-bottom:24px;
  }

  li {
    margin-bottom:12px;
  }

  .display-1 {
    font-size:28.8px;
    line-height:124%;
    letter-spacing:.1745px;
  }

  .display-2 {
    font-size:25.6px;
    line-height:93%;
  }

  .display-3 {
    font-size:22.8px;
    line-height:106%;
  }

  .display-4 {
    font-size:20.3px;
    line-height:118%;
  }

  .body-large {
    font-size:18px;
    line-height:132%;
  }

  p, li, .body-normal {
    font-size:16px;
    line-height:150%;
  }

  .caption {
    font-size:14.2px;
    line-height:86%;
  }

  .desktop-nav {display:none;}

  #mobile-nav-open {display:block;
                    height:24px;
                    width:24px;
                    opacity:1;
                    transition:opacity 0.3s;}

  #mobile-nav-close {display:none;
                    height:24px;
                    width:24px;
                    opacity:0;
                    transition:opacity 0.3s;}

#header {
  left: 0;
  transform: translateX(0);
  background-color:#fafafa;
  border-bottom:1px solid #B0CAEA;
  height:77px;
}


  #phonehand {max-width:calc( 100% - 24px );}

  #header-top {
      padding:24px 16px;
  }


  #header-bottom {
    display:flex;
    flex-direction:column;
    gap:32px;
    padding:32px 16px;
    width:100%;
    background-color:#fafafa;
    transform: translatex(-100svw);
    transition: transform 0.5s ease-out;
    box-shadow: 0px 20px 20px rgb(0 0 0 / 10%);
  }

  #content-block {transition:opacity 0.6ts;}

  .nav-link {
    font-size:24px;
  }

  .name-hero {
    font-size:28.8px;
  }

  #header-wrapper {
              padding:103px 24px 0px 24px;}

  .home-body-wrapper {
                            padding:0;
                            margin:416px auto 0 auto;
                            background-color:#FAFAFA;
                          }

  #header-box {height:416px;}

  .case-study-card {
    padding:0 24px 32px 24px;
    flex-direction:column;
    width:100%;
    align-items: baseline;
    justify-content:flex-start;
    gap:24px;
  }

  .case-study-preview-image {
    flex: 0 0 100%;
    width:100%;
    min-width:0;
  }

  .case-study-card-copy {
    flex: 0 1 100%;
    flex-basis: 100%;
    padding:0;
    gap:24px;
  }

  .case-study-featured-image {
    max-width:100%;
  }

  .selected-visual-design-wrapper {
      padding:0 24px 64px 24px;
  }

  #footer {
    grid-template-columns:repeat(2, minmax(120px, 192px));
    padding:48px 24px 24px 24px;
    justify-content: start;
  }

  #footer > *:first-child, #footer > *:last-child {
  grid-column: 1 / 3;
  }

  #footer > *:last-child {
  padding-top:24px;
  }

  .mobile-hide {display:none;}

  .chips {
    padding:48px 0 0 0;
    gap:8px;
    display:grid;
    grid-template-columns: 1fr 1fr;
  }

  .header-offset {
    margin-top:77px
  }

  .page-wrapper {
        padding:0 24px 64px 24px;
        display:flex;
        flex-direction:column;
        gap:48px;
    }

    .copy-row, .experience-row {
      width:100%;
      display:flex;
      gap:24px;
      justify-content: start;
      flex-direction:column;
    }

    .page-copy-primary, .experience-copy-primary {
      flex: 1 1 auto;
      max-width:100%;
    }

    .page-copy-secondary {
      flex: 1 1 auto;
      max-width:100%;
    }

    .experience-copy-primary {
      display:flex;
      flex-direction:column;
      gap:48px;
    }

    .experience-copy-primary, .short-space {
      gap:16px;
    }

    .experience-info-primary {
      display:flex;
      flex-direction:column;
      gap:48px;
    }

    .page-info-primary, .experience-info-primary {
      max-width:100%;
    }

    .page-icon {
      max-width:80px;
    }

    .copy-row.mobile-reverse {flex-direction:column-reverse;}

    .hero-row {
      width:100%;
      max-width:1440px;
      background-color:#F5F5F5;
      padding:16px;
      border-radius:16px;
      text-align: center;
      display:grid;
      gap:16px;
      grid-template-columns: 1;
    }

    .hero-row figure {
      width:100%;
      height:auto;
      display:block;
      border-radius:8px;
      overflow:hidden;
    }

    .hero-desktop img:first-child  {
      aspect-ratio: auto;
    }

    .hero-desktop img:last-child  {
      aspect-ratio: auto;
    }

    .hero-row img {
      width:100%;
      height:auto;
    }

    .photo-row {
      width:100%;
      max-width:1440px;
      display:grid;
      gap:16px;
      justify-content: space-between;
    }

    .three-col-grid {
      grid-template-columns: 100%;
      background-color:#F5F5F5;
      border-radius:16px;
      padding:16px;
      width:100%;
      display:grid;
      gap:16px;
    }

    .three-col-grid img {
      border-radius:8px;
      overflow:hidden;
      width:100%;
      height:auto;
    }

    .large-left img, .large-right img {border-radius:8px;}

    .large-left {
      grid-template-columns: 243fr 117fr;
    }

    .large-left div:first-child  {
      aspect-ratio: 243 / 182;
    }

    .large-left div:last-child  {
      aspect-ratio: 117 / 182;
    }

    .large-left.mobile-stack {grid-template-columns:100%;}

    .large-left.mobile-stack div:first-child  {
      aspect-ratio: auto;
    }

    .large-left.mobile-stack div:last-child  {
      aspect-ratio: auto;
    }

    .large-left.mobile-stack .stacked-column {gap:16px;}

    .large-right {
      grid-template-columns: 117fr 243fr;
    }

    .large-right div:first-child  {
      aspect-ratio: 117 / 182;
    }

    .large-right div:last-child  {
      aspect-ratio: 243 / 182;
    }

    .large-right.mobile-stack {grid-template-columns:100%;}

    .large-right.mobile-stack div:first-child  {
      aspect-ratio: auto;
    }

    .large-right.mobile-stack div:last-child  {
      aspect-ratio: auto;
    }

    .large-right.mobile-stack .stacked-column {gap:16px;}

    .even-split {
      grid-template-columns: 100%;
    }


    .img-fix img {
      width:100%;
      height:auto;
      display:block;
    }

    .stacked-column {
      gap:0px;
      display:flex;
      flex-direction:column;
      justify-content: space-between;
    }

    .img-backdrop {
      padding:16px;
      background-color:#F5F5F5;
      border-radius:16px;
    }

  .img-backdrop img {
    border-radius:8px;
  }

  .featured-img-backdrop {
    padding:16px;
    background-color:#F5F5F5;
    border-radius:8px;
  }

  .photo-rounding img {border-radius:12px;}



}