@import url("common-fonts.css");

/* Home Button Styles */
.home-button-container {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 4vh;
  margin-bottom: 4vh;
  padding: 0 4vw;
}

.home-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1vh;
  background-color: var(--color-bg, #000000);
  color: var(--color-accent, #FF3E00);
  border: 2px solid var(--color-accent, #FF3E00);
  border-radius: 0; /* Swiss Modernist uses sharp edges */
  padding: 1.2vh 4vh;
  font-family: var(--font-main, sans-serif);
  font-size: 1.8vh;
  font-weight: 900; /* Bold typography */
  text-transform: uppercase;
  text-decoration: none;
  transition: all 0.2s ease;
  min-height: 44px;
  min-width: 44px;
}

.home-button:hover, .home-button:active {
  background-color: var(--color-accent, #FF3E00);
  color: var(--color-bg, #000000);
  transform: scale(0.98);
}

.home-button svg {
  width: 2.2vh;
  height: 2.2vh;
  stroke: currentColor;
  stroke-width: 2.5;
}