/* Contact Button */
.contact-button {
  font-family: "Roboto Slab", "Roboto Mono", "Courier New", Courier, monospace;
  text-transform: capitalize;

  width: auto !important;
  font-weight: bold !important; /* Bold font for the button */
  height: 32px;
  line-height: 1; /* Matches font size */
  font-size: 15px;
  padding: 8px 12px; /* Padding for better appearance */
    margin: 0px 10px 0px 10px;
  color: whitesmoke;
  background-color: black !important;
  border: 1px solid whitesmoke !important;
  border-radius: 5px;
  outline: none;
  text-decoration: none !important; /* Ensures no decoration on hover */
  text-align: center; /* Centers the text inside */
  display: block; /* Ensures proper layout behavior */
  cursor: pointer; /* Adds pointer cursor for interactivity */
  position: relative; /* Ensures proper stacking for child elements */
  white-space: nowrap; /* Prevents text from breaking */
}

/* Make the link span the full button area */
.contact-button a {
  text-decoration: none !important; /* Ensures no decoration on hover */
  border: none; /* Ensures no border mimics underline */
  outline: none; /* Remove outline on hover */
  display: block; /* Makes the link take full button space */
  width: 100%; /* Spans the full width of the button */
  height: 100%; /* Spans the full height of the button */
  color: inherit; /* Inherit the button's text color */
  font-weight: bold !important; /* Explicitly ensure bold font */
  font-family: inherit; /* Inherit the font family */
  font-size: inherit; /* Inherit the font size */
  white-space: nowrap; /* Prevents text from breaking */
}

/* Hover effects for the button */
.contact-button:hover {
  color: black !important; /* Hover text color */
  text-decoration: none !important; /* Ensures no decoration on hover */
  border: none; /* Ensures no border mimics underline */
  outline: none; /* Remove outline on hover */
  background-color: white !important; /* Hover background color */
}

/* Ensure the link's hover state matches */
.contact-button a:hover {
  text-decoration: none !important; /* Ensures no decoration on hover */
  border: none; /* Ensures no border mimics underline */
  outline: none; /* Remove outline on hover */
  color: black !important; /* Hover text color */
}