/* Meta AI–style clean top nav + single-line hero title + no floating ornaments */

/* —— Hide "灵感在这里" style decorations —— */
.hero-spark,
.hero-cursor,
.spark-one,
.spark-two,
.cursor-one,
.cursor-two {
  display: none !important;
}

/* —— Single-line large title —— */
body.home-page .hp .hp-hero .hp-h1 {
  white-space: nowrap;
  font-size: clamp(36px, 5.2vw, 72px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
  font-weight: 500 !important;
}
body.home-page .hp .hp-hero .hp-h1 .grad {
  display: inline !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-weight: inherit !important;
}
@media (max-width: 767px) {
  body.home-page .hp .hp-hero .hp-h1 {
    white-space: normal;
    font-size: clamp(32px, 9vw, 44px) !important;
  }
}

/* —— Meta-like header: flat, no pill tray —— */
body.home-page > header.sticky {
  background: rgba(17, 17, 18, 0.72) !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
body.home-page > header.sticky > div {
  max-width: 1280px !important;
  height: 64px !important;
  padding: 0 32px !important;
  gap: 28px !important;
}
body.home-page > header.sticky > div > a {
  gap: 10px !important;
  color: #fff !important;
}
body.home-page > header.sticky > div > a img {
  height: 28px !important;
  width: 28px !important;
  border-radius: 6px !important;
  background: transparent !important;
}
body.home-page > header.sticky > div > a span {
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: #fff !important;
}
/* Kill resin / ✳ brand-mark overrides */
body.home-page > header a > div.bg-gradient-to-br {
  background-image: none !important;
  background: #fff !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
}
body.home-page > header a > div.bg-gradient-to-br::after {
  content: none !important;
}
body.home-page > header.sticky > div > a .hero-brand-mark {
  display: none !important;
}

/* Flat text links — Meta style (no pill container) */
body.home-page > header.sticky nav {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  gap: 28px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
body.home-page > header.sticky nav a {
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.78) !important;
  transition: color .15s ease !important;
}
body.home-page > header.sticky nav a:hover,
body.home-page > header.sticky nav a[href="/"] {
  color: #fff !important;
  background: transparent !important;
}

/* Right cluster: hide theme toggle + divider; Meta-like CTA login */
body.home-page > header.sticky #themeToggle,
body.home-page > header.sticky .h-6.w-px {
  display: none !important;
}
body.home-page > header.sticky #loginBtn {
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: #fff !important;
  color: #111 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
body.home-page > header.sticky #loginBtn:hover {
  background: #f0f0f0 !important;
  color: #111 !important;
}
body.home-page > header.sticky .hero-contact {
  display: none !important;
}

/* After scroll into white Meta blocks */
body.home-page.hp-scrolled > header.sticky {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom: 1px solid #e8e8e8 !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
body.home-page.hp-scrolled > header.sticky > div > a,
body.home-page.hp-scrolled > header.sticky > div > a span {
  color: #111 !important;
}
body.home-page.hp-scrolled > header.sticky nav a {
  color: #5b5b5b !important;
  background: transparent !important;
}
body.home-page.hp-scrolled > header.sticky nav a:hover,
body.home-page.hp-scrolled > header.sticky nav a[href="/"] {
  color: #111 !important;
  background: transparent !important;
}
body.home-page.hp-scrolled > header.sticky #loginBtn {
  background: #0b0b0b !important;
  color: #fff !important;
}
body.home-page.hp-scrolled > header.sticky #loginBtn:hover {
  background: #222 !important;
  color: #fff !important;
}

@media (max-width: 1200px) {
  body.home-page > header.sticky > div { padding: 0 20px !important; gap: 16px !important; }
  body.home-page > header.sticky nav { gap: 18px !important; }
}
@media (max-width: 767px) {
  body.home-page > header.sticky > div { height: 56px !important; padding: 0 16px !important; }
  body.home-page > header.sticky nav {
    display: none;
  }
  body.home-page > header.sticky nav.is-open {
    display: flex !important;
    position: absolute;
    top: 56px;
    left: 12px;
    right: 12px;
    flex-wrap: wrap;
    gap: 8px !important;
    padding: 12px !important;
    border-radius: 12px !important;
    background: rgba(20, 20, 22, 0.96) !important;
    border: 1px solid #2a2a2c !important;
  }
  body.home-page.hp-scrolled > header.sticky nav.is-open {
    background: #fff !important;
    border-color: #eee !important;
  }
  body.home-page > header.sticky nav.is-open a {
    flex: 1 0 30%;
    text-align: center;
    padding: 10px 8px !important;
  }
}