/* Generated by custom/apply-custom.mjs. Edit custom/site.yml, then run pnpm custom:apply. */

#page-header.not-home-page {
  height: 400px;
  background: linear-gradient(180deg, rgba(45, 28, 18, 0.42) 0%, rgba(45, 28, 18, 0.26) 100%), url(/img/custom/home-banner.jpg) center / cover no-repeat !important;
  background-attachment: scroll !important;
}

@media (max-width: 768px) {
  #page-header.not-home-page {
    height: 280px;
  }
}


#home_top #random-banner {
  height: 310px;
  background: linear-gradient(135deg, rgba(255, 248, 239, 0.96), rgba(255, 238, 221, 0.92));
}

#home_top #random-banner #skills-tags-group-all {
  width: 160%;
  transform: rotate(-45deg) translateX(-4%);
  transform-origin: center;
  pointer-events: none;
}

#home_top #random-banner #skills-tags-group-all .tags-group-wrapper {
  margin-top: 18px;
  animation-duration: 48s;
}

#home_top #random-banner:hover #skills-tags-group-all .tags-group-wrapper {
  animation-play-state: paused;
}

#home_top #random-banner #skills-tags-group-all .tags-group-icon {
  width: 104px;
  height: 104px;
  border-radius: 24px;
  box-shadow: 0 14px 30px rgba(103, 63, 35, 0.18);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.72);
}

#home_top #random-banner #skills-tags-group-all .tags-group-icon img {
  width: 76px;
  max-height: 76px;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(78, 46, 25, 0.16));
}

#home_top #random-banner #skills-tags-group-all .tags-group-icon-pair {
  margin-left: 18px;
}

#home_top #random-banner #skills-tags-group-all .tags-group-icon-pair .tags-group-icon:nth-child(even) {
  margin-top: 14px;
}

[data-theme="dark"] #home_top #random-banner {
  background: linear-gradient(135deg, rgba(42, 32, 27, 0.94), rgba(61, 39, 31, 0.9));
}

[data-theme="dark"] #home_top #random-banner #skills-tags-group-all .tags-group-icon {
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.34);
}

@media (max-width: 1200px) {
  #home_top #random-banner {
    display: none !important;
  }
}

@media (max-width: 768px) {
  #home_top #random-banner {
    height: 190px;
  }

  #home_top #random-banner #skills-tags-group-all .tags-group-icon {
    width: 86px;
    height: 86px;
    border-radius: 18px;
  }

  #home_top #random-banner #skills-tags-group-all .tags-group-icon img {
    width: 64px;
    max-height: 64px;
  }
}


@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 600;
  font-display: block;
  src: url("/img/fontawesome-free/webfonts/fa-solid-900.woff2") format("woff2");
}

@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url("/img/fontawesome-free/webfonts/fa-solid-900.woff2") format("woff2");
}

#page-header.nav-fixed #nav #page-name:hover {
  background: var(--anzhiyu-main) !important;
}

#page-header.nav-fixed #nav #page-name:hover::after {
  background: var(--anzhiyu-main);
  border-radius: 100px;
}
