/* === 🐝 BusyBee Secondary Button — "Let's Connect!" === */
.bb-secondary-btn {
  display: inline-block;
  background-color: #000;            /* black background */
  color: #fff;                       /* white text */
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  padding: 12px 28px;
  border-radius: 999px;              /* pill shape */
  border: 2px solid #000;
  transition: all 0.3s ease;
  text-align: center;
  white-space: nowrap;
}


/* Hover + focus states */
.bb-secondary-btn:hover,
.bb-secondary-btn:focus {
  background-color: #ffcc00;         /* BusyBee yellow */
  color: #000;                       /* text flips to black */
  border-color: #ffcc00;
  transform: translateY(-2px);
}


/* Responsive sizing */
@media screen and (max-width: 640px) {
  .bb-secondary-btn {
    font-size: 0.95rem;
    padding: 10px 22px;
  }
}
html {
  scroll-behavior: smooth !important;
}


<section class="bb-filters">
  <!-- filter buttons -->
</section>


<!-- other HTML sections -->


<style>
/* FINAL OVERRIDE: STOP PARENT CONTAINER FROM DIMMING CODE BLOCK */
.sqs-block-code,
.sqs-block-code * {
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  color: #000 !important;
}
/* Blog Anchor Navigation Text Styling */


.blog-anchor-nav a,
.blog-anchor-nav {
  font-size: 14px;          /* Smaller text */
  letter-spacing: 1px;      /* Clean spacing */
  font-weight: 500;         /* Slightly lighter weight */
  color: #ffffff !important;  /* Pure bright white */
  text-transform: uppercase; /* Keeps it sharp */
}


/* Optional: Hover effect for polish */
.blog-anchor-nav a:hover {
  color: #FFD700 !important;  /* Your brand gold */
  transition: color 0.2s ease-in-out;
}
/* Target the black blog anchor navigation row */


section a[href^="#"] {
  font-size: 12px !important;   /* Smaller text */
  letter-spacing: 1.5px;        /* Cleaner spacing */
  color: #ffffff !important;    /* Bright white */
  font-weight: 500 !important;
}
/* Your existing CSS above */




/* Blog Anchor Navigation Styling */
section a[href^="#"] {
  font-size: 11px !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ffffff !important;
}
// Smooth scroll //


html { 
  scroll-behavior: smooth!important;
}
/* === Equal Width Navigation Buttons === */


.header-nav-list {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
}


.header-nav-item {
  flex: 1 1 180px !important;   /* equal width */
  max-width: 220px !important;
  text-align: center !important;
}


.header-nav-item a {
  display: block !important;
  padding: 14px 16px !important;
  border: 2px solid #ffffff !important;
  border-radius: 12px !important;
  text-align: center !important;
}
.header-nav-item a {
  min-height: 70px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html {
  scroll-behavior: smooth;
}
/* floating mobile header from insidethesquare.co */
@media only screen and (max-width: 767px){
  .header{
    margin:15px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    position:fixed!important;
    z-index:9999!important;
  }
  #page {
    position: relative;
    z-index: 1;
  }
}
/* floating mobile menu from insidethesquare.co */
.header-menu {
  margin: 15px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
}

/* Floating mobile header */
@media only screen and (max-width: 767px) {
  .header {
    margin: 15px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    position: fixed !important;
    z-index: 9999 !important;
  }

  #page {
    position: relative;
    z-index: 1;
  }
}

/* Floating mobile menu */
.header-menu {
  margin: 15px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
}