/* Center the main container both vertically and horizontally */
html, body {
  height: 100%;
  margin: 0;
}
body {
  display: flex;
  align-items: center; /* vertical */
  justify-content: center; /* horizontal */
  font-family: 'Times New Roman', Times, serif;
  background: beige;
}
.container {
  text-align: center; /* center the text */
}

/* Reduce default h1 spacing and make the gap to icons smaller */
.container h1 {
  margin: 0 0 0.2rem; /* remove large default bottom margin */
  line-height: 1.05;
}

.icons {
  margin-top: 0.2rem; /* much smaller gap between name and icons */
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  align-items: center;
}
/* Make each anchor a fixed square so icons line up visually */
.icons a {
  display: flex;
  width: 56px;
  height: 56px;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.icons img {
  /* let the image scale to fit the square consistently */
  max-width: 80%;
  max-height: 80%;
  display: block; /* remove inline descender gaps */
  object-fit: contain;
  transition: transform 0.15s ease-in-out;
}

/* Make the LinkedIn icon a tiny bit larger than the others */
.icons img#linkedin {
  max-width: 90%;
  max-height: 90%;
}