.gallery {
  height: 100%;
  display: flex;
  margin-top: 2rem;
  flex-direction: column;
  justify-content: center;
  scroll-snap-align: start;
  padding: var(--header-height) 2rem 2rem;
}
@media screen and (min-width: 768px) {
  .gallery {
    width: 100%;
    display: inline-flex;
    padding: var(--header-height) 20% 2rem;
  }
}

.gallery__title {
  font-size: 3.2rem;
  margin: 0 0 2.4rem;
  color: var(--color-secondary);
  font-family: var(--font-secondary);
}
@media screen and (min-width: 768px) {
  .gallery__title {
    font-size: 5rem;
  }
}

.gallery__action {
  margin: 2em 0 0;
  font-size: 1.6rem;
  align-self: center;
  padding: 1em 1.5em;
  align-items: center;
  display: inline-flex;
  text-decoration: none;
  justify-content: center;
  transform: translateX(20%);
  color: var(--color-secondary);
  background-color: transparent;
  border: var(--color-secondary) 1px solid;
}
@media screen and (min-width: 768px) {
  .gallery__action {
    transform: unset;
    align-self: flex-end;
  }
}
.gallery__action__icon {
  width: 2.5rem;
  height: 2.5rem;
  color: inherit;
  margin-left: 2rem;
  transform: rotate(180deg);
}