*{box-sizing: border-box;}

body {
  font-family: Arial, sans-serif;
  /*background: ;*/
  margin: 0 auto;
}

@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap");

.site-main-title {
  font-family: "Montserrat", sans-serif;
  color: #ab460c; /* Rust */
  /*background-color: #f0ead6; /* Pearl */
  text-align: center;
  padding: 0px;
  margin: 10px;
  border-radius: 8px;
  font-size: 3rem;
  text-shadow: 2px 2px 2px navy; /* 2px right, 2px down, 6px blur */
}
.title-menu{
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  background: beige;

}
.site-title { margin: auto;
padding: 10px;}

.meatball-btn {
    background: none;
    border: none;
    font-size: 24px; /* Adjust size as needed */
    cursor: pointer;
    padding: 0 8px;
    /* Optional: Style to look like actual dots if the font default is not desired */
    line-height: 1; 
    color: #333;
}

.meatball-btn:hover {
    color: #000;
}
.menu{
  display: grid;
  grid-template-rows: repeat(5, 1fr);
  gap: 10px;
  grid-auto-columns: minmax(50px, auto) ;
  background-image:linear-gradient(15deg, #f0ead6 5%, #ab460c 95%);
  display: none;
}
.menu.show {
  display: grid;
  /**/
}
@media screen and (min-width: 750px) {
.menu{
 display:flex;
 }
 .meatball-btn{
  display: none}
 }