/* Bids for Business © 2025 | All rights reserved */
/* Digital Fingerprint: b4b-addservices-css-secure-v1 */

/* Scroll progress bar */
#scroll-progress{
  position:fixed; top:0; left:0; height:4px; width:0; z-index:60;
  background:#2563eb; transition:width .2s;
}

/* Nav underline to match site */
a.nav-link{position:relative;text-decoration:none}
a.nav-link::after{content:"";position:absolute;width:0%;height:2px;bottom:0;left:0;background-color:#2563eb;transition:width .3s ease}
a.nav-link:hover::after{width:100%}

/* Navbar shrink */
.navbar-scrolled{background:rgba(255,255,255,.95);box-shadow:0 2px 6px rgba(0,0,0,.05);border-bottom:1px solid #e5e7eb}
#main-navbar{transition:padding 200ms ease}
#main-navbar.navbar-shrink{padding-top:.15rem !important;padding-bottom:.15rem !important}
@media (min-width:1024px){
  #main-navbar.navbar-shrink{
    padding-top:.1rem !important;
    padding-bottom:.1rem !important;
  }

  /* Force override of Tailwind md:w-36 / xl:w-40 */
  #main-navbar.navbar-shrink .navbar-logo{
    width:5.5rem !important;
    max-width:5.5rem !important;
    height:auto !important;
    transition:width .3s ease, max-width .3s ease;
  }
}

/* Logo transition */
.navbar-logo{transition:all .3s ease}

/* Hamburger lines */
.hamburger span{display:block;height:2px;background:#2563eb;transition:all .3s ease}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px, 5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px, -5px)}

/* Mobile strapline (base hidden) */
.mobile-strapline{
  display:none;
  font-size:.72rem; font-weight:600; color:#2563eb;
  white-space:nowrap; line-height:1.1;
}

/* MOBILE behavior: shrink + show strapline tight to logo */
@media (max-width:640px){
  #main-navbar.navbar-shrink{
    padding-top:.05rem !important; padding-bottom:.05rem !important;
  }

  /* Real shrink on phones: make the *image* narrower (not scale) */
  #main-navbar.navbar-shrink #navbar-logo{
    width:4.7rem !important; height:auto; transform:none !important;
  }

  /* Show strapline and add a tiny nudge away from the shrunken logo */
  #main-navbar.navbar-shrink .mobile-strapline{
    display:inline-flex !important; align-items:center;
    font-size:.69rem; line-height:1.1;
    margin-left:.18rem !important; /* ← tweak this number to taste */
    white-space:nowrap;
  }

  /* Kill any accidental row gaps */
  #main-navbar .max-w-7xl.mx-auto > .flex{gap:0 !important; column-gap:0 !important}
}

/* Info cards (balanced) */
.info-card{
  background:#fff;
  border-radius:.75rem;
  box-shadow:0 8px 22px rgba(0,0,0,.05);
  transition:box-shadow .2s ease, transform .2s ease;

  /* balance + alignment */
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  text-align:center;

  /* slightly more breathing room + equal height */
  padding:1.5rem 1rem;
  min-height:220px; /* adjust to taste: 200–240px */
}

.info-card h3 {
  color:#0f172a;
  font-weight:700;
  font-size:1.1rem;
  margin:0;                     /* remove browser + Tailwind default margins */
  padding:0;
  line-height:1.25;
}

.info-card p {
  margin:0.25rem 0 0 0;         /* tiny top gap only */
  color:#374151;
  font-size:.95rem;
  line-height:1.45;
  max-width:260px;
}
.info-card svg {
  margin-bottom: 0.35rem;
}
.info-card h3 {
  margin-top: 0;
  margin-bottom: 0.2rem;
}
.info-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,0,0,.08);
}
/* SEO chips/tags */
.chip{
  padding:.4rem .8rem; border:1px solid #dbeafe; border-radius:9999px;
  background:#fff; color:#1d4ed8; font-weight:600; font-size:.9rem;
}
.chip:hover{ background:#eff6ff }
.tag{ padding:.25rem .55rem; border-radius:.5rem; background:#eef2ff; color:#1e3a8a; }

/* Footer links */
.site-footer .footer-link { color:#1e3a8a; }
.site-footer .footer-link:hover { color:#1d4ed8; text-decoration:underline; }
/* === B4B_BIZNAME_MODAL_STYLES === */
.b4b-modal.hidden { display: none; }
.b4b-modal { position: fixed; inset: 0; z-index: 60; }
.b4b-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.35);
}
.b4b-modal-panel {
  position: relative; z-index: 61;
  width: min(92vw, 560px);
  margin: 10vh auto 0 auto;
  background: #fff; border-radius: .75rem;
  box-shadow: 0 14px 34px rgba(0,0,0,.18);
  padding: 1rem 1.1rem 1rem 1.1rem;
  border: 1px solid #e5e7eb;
}
.b4b-btn {
  display:inline-flex; align-items:center; justify-content:center;
  padding: .45rem .8rem; border-radius: .5rem; font-weight:600; font-size:.9rem;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.b4b-btn-secondary {
  background: #eef2ff; color:#1e3a8a; border:1px solid #c7d2fe;
}
.b4b-btn-secondary:hover { background:#e0e7ff; }
