/* $darkbrown: #332a29; */
@font-face {
  font-family: "Jost";
  src: url("../fonts/jost/Jost-VariableFont_wght.ttf");
}
.buttons {
  display: flex;
  gap: 1rem;
  margin-top: 2rem;
}
@media screen and (max-width: 600px) {
  .buttons {
    flex-direction: column;
  }
}
.buttons .hover-button p {
  display: none;
}
@media screen and (max-width: 600px) {
  .buttons .hover-button {
    padding-top: 1rem;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas: "icon title" "para para";
  }
  .buttons .hover-button svg {
    grid-area: icon;
  }
  .buttons .hover-button span {
    grid-area: title;
  }
  .buttons .hover-button p {
    grid-area: para;
    font-weight: normal;
    display: initial;
  }
}

.toggle-p {
  display: none;
  width: 50%;
}
@media screen and (min-width: 600px) {
  .toggle-p.visible {
    display: block;
  }
}

.socials {
  display: flex;
  gap: 1rem;
}
.socials .socials-icon,
.socials .socials-icon:visited {
  color: #e3cdcf;
  text-decoration: none;
}

body h1.site-title,
html h1.site-title {
  font-size: 2rem;
  margin-bottom: 1rem;
  opacity: 1;
}
body h1.site-title .title-logo,
html h1.site-title .title-logo {
  height: 1.4rem;
  width: 2rem;
  margin-bottom: 1px;
  margin-right: 0.1rem;
}