.home-projects {
  --studio-bg: #100d0b;
  --studio-panel: #171310;
  --studio-paper: #f2ede4;
  --studio-gold: #c9a56a;
  --studio-line: rgba(242, 237, 228, .14);
  --studio-soft: rgba(242, 237, 228, .62);
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-in-out: cubic-bezier(.77, 0, .175, 1);
  height: 420svh;
  border-block: 1px solid var(--studio-line);
  background:
    radial-gradient(circle at 14% 35%, rgba(201, 165, 106, .08), transparent 30rem),
    var(--studio-bg);
  color: var(--studio-paper);
}

.home-projects a { color: inherit; text-decoration: none; }

.home-projects .studio-archive__sticky {
  padding-top: 5.25rem;
}

.home-projects .studio-archive__header {
  grid-template-columns: 1fr minmax(15rem, .52fr) auto;
}

.home-projects .studio-project-nav {
  grid-template-columns: repeat(4, 1fr);
}

.home-projects .studio-archive__steps {
  grid-template-rows: repeat(4, 1fr);
}

.home-projects .studio-archive__header > a {
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .home-projects .studio-archive__header {
    grid-template-columns: 1fr auto;
  }
}

@media (max-width: 900px) {
  .home-projects {
    height: auto;
  }

  .home-projects .studio-archive__sticky {
    padding-top: 4.5rem;
    padding-bottom: 4rem;
  }
}

@media (max-width: 620px) {
  .home-projects .studio-archive__sticky {
    padding-top: 3.5rem;
    padding-bottom: 3rem;
  }

  .home-projects .studio-archive__header > a {
    width: 100%;
  }
}