@font-face {
  font-family: 'bsm-font';
  src: url('../fonts/bsm-font.ttf') format('truetype');
}  
.logo {
  max-width:600px;
  height: auto;
}
.logo text {
  font-family: "bsm-font";
  fill: rgb(0, 0, 0);
  stroke: none;
  transition: stroke-width 0.3s ease-out;
}
.logo rect{
    stroke: black;
    transition: stroke-width 0.3s linear; 
}
.logo line {
    stroke: black;
    transition: stroke-width 0.3s linear; 
}
.logo:hover text {
    stroke: rgb(0, 0, 0);
    stroke-width: 2px; /* Acts like font-weight 800+ */
    transition: stroke-width 0.3s linear; /* Violent hit */
}
.logo:hover rect {
    stroke-width: 16px;
}
.logo:hover line {
    stroke-width: 16px;
    transition: stroke-width 0.1s linear; /* violent */
}




/* 1. Full width background (requirement #3 & #5) */
.site-bg {
  background: #478E75;       /* full-width solid background */
  min-height: 100vh;
}

/* 2. Max-width container (requirement #4) */
.site {
  max-width: 1000px;         /* adjust as needed */
  margin: 0 auto;            /* center */
  padding: 20px;
  color: #000;
  background: #fff;          /* inner content background (optional) */
}

/* HEADER */
.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

/* Hamburger button (hidden on large screens) */
.hamburger {
  display: none;
  font-size: 26px;
  background: none;
  border: none;
  cursor: pointer;
}

/* 3. Layout = sidebar + content aligned horizontally */
.layout {
  display: flex;
  gap: 20px;
}

/* 4. Sidebar */
.sidebar {
  flex: 0 0 200px;           /* fixed width */
}

.sidebar ul {
  list-style: none;
  padding: 0;
}

.sidebar a {
  display: block;
  padding: 8px 0;
  color: #000;
  text-decoration: none;
}

/* 5. Content grows */
.content {
  flex: 1;
}

/* 6. Responsive breakpoint (wiki-style stacked layout) */
@media (max-width: 800px) {

  /* Show hamburger */
  .hamburger {
    display: block;
  }

  /* Sidebar collapses by default */
  .sidebar {
    display: none;
    flex: 1 1 auto;
    padding: 10px 0;
  }

  /* When “menu-open” class is added, sidebar shows */
  .sidebar.open {
    display: block;
  }

  /* Layout stacks vertically */
  .layout {
    flex-direction: column;
  }
}