/* BaoLong Lab · Public-Site Weekly Value Bar · v1.1.0-rc1
   Shared across the exact public sitemap scope.
   Weekly truth remains data/home-weekly-value.json. */

:root{
  --bl-home-value-bar-h:36px;
}

.home-value-bar,
.home-value-bar *{
  box-sizing:border-box;
}

.home-value-bar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:var(--bl-home-value-bar-h);
  z-index:10040;
  background:rgba(247,246,242,.97);
  border-bottom:1px solid rgba(0,0,0,.055);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  color:#242321;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
}

.home-value-bar__inner{
  position:relative;
  width:100%;
  max-width:1500px;
  height:100%;
  margin:0 auto;
  padding:0 24px;
  overflow:hidden;
}

.home-value-bar__slide{
  position:absolute;
  inset:0 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  opacity:0;
  pointer-events:none;
  transition:opacity .32s ease;
  font-size:13px;
  line-height:1.2;
  letter-spacing:.01em;
  white-space:nowrap;
}

.home-value-bar__slide.is-active{
  opacity:1;
  pointer-events:auto;
}

.home-value-bar__text{
  color:#34312d;
}

.home-value-bar__separator{
  width:1px;
  height:13px;
  background:rgba(28,28,28,.42);
  flex:0 0 auto;
}

.home-value-bar__cta{
  color:#242321;
  text-decoration:none;
  border-bottom:1px solid rgba(36,35,33,.62);
  padding-bottom:1px;
  transition:border-color .18s ease,opacity .18s ease;
}

.home-value-bar__cta:hover,
.home-value-bar__cta:focus-visible{
  border-bottom-color:#111;
  opacity:.72;
}

.home-value-bar__cta:focus-visible{
  outline:1px solid rgba(28,28,28,.34);
  outline-offset:4px;
  border-radius:2px;
}

/* Standard BaoLong public-site shell: exact behavior already browser-accepted
   on the homepage P1 release. */
.site-header{
  top:var(--bl-home-value-bar-h) !important;
}

body:not(.bl-weekly-value-bar-no-site-header){
  padding-top:calc(86px + var(--bl-home-value-bar-h)) !important;
}

/* Public sitemap pages without .site-header keep their own pre-existing
   body padding and add only the bar height. JS measures the pre-bar value. */
body.bl-weekly-value-bar-no-site-header{
  padding-top:calc(var(--bl-weekly-value-base-body-pad-top,0px) + var(--bl-home-value-bar-h)) !important;
}

@media (max-width:980px){
  :root{
    --bl-home-value-bar-h:48px;
  }

  body:not(.bl-weekly-value-bar-no-site-header){
    padding-top:calc(72px + var(--bl-home-value-bar-h)) !important;
  }

  .mobile-menu-panel{
    top:calc(86px + var(--bl-home-value-bar-h)) !important;
  }

  .home-value-bar__inner{
    padding:0 14px;
  }

  .home-value-bar__slide{
    inset:0 14px;
    gap:8px;
    padding:4px 0;
    flex-wrap:wrap;
    align-content:center;
    font-size:12px;
    line-height:1.2;
    white-space:normal;
    text-align:center;
  }

  .home-value-bar__separator{
    height:11px;
  }
}

@media (max-width:520px){
  .mobile-menu-panel{
    top:calc(82px + var(--bl-home-value-bar-h)) !important;
  }

  .home-value-bar__slide{
    gap:3px 8px;
    font-size:11.5px;
  }

  .home-value-bar__separator{
    display:none;
  }

  .home-value-bar__cta{
    font-size:11.5px;
  }
}

@media (prefers-reduced-motion:reduce){
  .home-value-bar__slide{
    transition:none;
  }
}
