.home-section {
  min-height: 100svh;
  justify-content: center;
  flex-direction: column;
  gap: 3rem;
}

.home-section-content {
  align-items: center;
  gap: 0;
}

.home-section-content__title {
  display: grid;
  grid-template-areas:
    "school name"
    "portfolio portfolio";
}

/*trying to get when you are hovering H1*,
then school changes color to that color*/

.home-section-content__title-school,
.home-section-content__title-name {
  color: white;

  font-family: "Cabin Sketch";
  font-size: clamp(25px, 5vw, 55px);
}

.home-section-content__title-school {
  grid-area: school;
  /* color: #ffaf52; */
  font-family: "Cabin Sketch";
  font-size: clamp(25px, 5vw, 60px);
}

.home-section-content__title-name {
  grid-area: name;
  place-self: end;

  display: flex;
  align-items: center;
  gap: 16px;

  transition: margin 0.3s ease-in-out;
  margin-right: 0;
}

.home-section-content__title-name > img {
  display: none;

  width: clamp(125px, 15vw, 225px);
}

.home-section-content__title-name > p {
  transition: rotate 0.3s ease-in-out;
  rotate: 0;
}

@media (min-width: 850px) {
  .home-section-content__title-name {
    margin-right: -20%;
  }

  .home-section-content__title-name > img {
    display: block;
  }

  .home-section-content__title-name > p {
    rotate: -14deg;
  }
}

.home-section-content__title-portfolio {
  grid-area: portfolio;

  font-size: clamp(64px, 20vw, 300px);
  line-height: 75%;
}

.home-section-content__subtitles {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;

  font-size: clamp(16px, 5vw, 20px);
  text-align: center;
}

.home-section-content__subtitles-group {
  display: flex;
  gap: 0.25rem;
}

.home-section-content__subtitles-group:last-of-type {
  display: contents;
}

.home-section-content__subtitles-spacer {
  display: none;
}

.home-section-content__subtitles-group:first-of-type
  > .home-section-content__subtitles-spacer {
  display: block;
}

@media (min-width: 450px) {
  .home-section-content__subtitles-group:last-of-type {
    display: flex;
  }

  .home-section-content__subtitles-group:last-of-type
    > .home-section-content__subtitles-spacer {
    display: block;
  }
}

@media (min-width: 850px) {
  .home-section-content__subtitles {
    flex-direction: row;
  }

  .home-section-content__subtitles-spacer {
    display: block;
  }
}

.home-section-links {
  display: flex;
  align-items: center;
  gap: 6rem;
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(48px, 10vw, 80px);
  color: whitesmoke;
}

.home-section-links_item {
  position: relative;
  cursor: pointer;
}

.home-section-links_item > img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  width: clamp(90px, 15vw, 150px);
}

.home-section-links_item:hover > img,
.home-section-links_item:focus > img,
.home-section-links_item:active > img {
  opacity: 1;
}
