/* NVC 液态玻璃 2.0 — 叠加层，原 style.css 不动 */
:root {
  --g-ivo: #fbf7f0;
  --g-teal: #5b9ea6;
  --g-teal-deep: #2f6b75;
  --g-apricot: #f2c078;
  --g-lilac: #b7a9dd;
  --g-blur: 22px;
  --g-sat: 1.5;
  --g-r: 26px;
  --g-sh: 0 18px 44px -18px rgba(47, 107, 117, 0.28), 0 2px 10px rgba(47, 107, 117, 0.06);
  --g-sh-hover: 0 28px 64px -20px rgba(47, 107, 117, 0.36), 0 4px 14px rgba(47, 107, 117, 0.08);
  --g-in: inset 0 1px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 0 rgba(255, 255, 255, 0.35);
}

/* 1. 极光底：玻璃必须有可折射的东西 */
body {
  background-color: var(--g-ivo);
  background-image:
    radial-gradient(46rem 32rem at 8% -4%, rgba(242, 192, 120, 0.42), transparent 60%),
    radial-gradient(40rem 28rem at 92% 2%, rgba(183, 169, 221, 0.40), transparent 58%),
    radial-gradient(50rem 34rem at 78% 46%, rgba(157, 199, 180, 0.30), transparent 62%),
    radial-gradient(44rem 30rem at 4% 62%, rgba(229, 160, 190, 0.26), transparent 60%),
    radial-gradient(56rem 38rem at 50% 108%, rgba(91, 158, 166, 0.32), transparent 64%),
    linear-gradient(168deg, #fdf9f2 0%, #f7f2ea 46%, #f2f4f0 100%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}
.nv-cmp-page, .cmp-page {
  background-color: var(--g-ivo);
  background-image:
    radial-gradient(40rem 28rem at 14% -2%, rgba(242, 192, 120, 0.30), transparent 58%),
    radial-gradient(38rem 26rem at 88% 4%, rgba(91, 158, 166, 0.40), transparent 56%),
    radial-gradient(34rem 24rem at 20% 70%, rgba(157, 199, 180, 0.30), transparent 60%),
    radial-gradient(30rem 22rem at 82% 92%, rgba(183, 169, 221, 0.28), transparent 58%),
    linear-gradient(170deg, #fbfaf6 0%, #eef4f2 100%);
  background-attachment: fixed;
}

/* 2. 导航 */
#siteNav {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.80), rgba(255, 255, 255, 0.55));
  -webkit-backdrop-filter: blur(26px) saturate(1.8);
  backdrop-filter: blur(26px) saturate(1.8);
  border-bottom: 1px solid rgba(255, 255, 255, 0.85);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 14px 40px -22px rgba(47, 107, 117, 0.45);
}
#siteNav .nav-links a {
  border-radius: 999px;
  padding: 7px 13px;
  transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
#siteNav .nav-links a:hover {
  background: rgba(255, 255, 255, 0.85);
  box-shadow: var(--g-in), 0 6px 16px -8px rgba(47, 107, 117, 0.4);
  transform: translateY(-1px);
}
.lang-switch, .nav-toggle {
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
  box-shadow: var(--g-in);
}
.mobile-menu {
  background: rgba(255, 255, 255, 0.86);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
  backdrop-filter: blur(24px) saturate(1.6);
  border: 1px solid rgba(255, 255, 255, 0.75);
}

/* 3. 首页 Hero：浮起来的玻璃舞台 */
.nv-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(30rem 20rem at 18% 8%, rgba(242, 192, 120, 0.35), transparent 62%),
    radial-gradient(26rem 18rem at 84% 12%, rgba(183, 169, 221, 0.34), transparent 60%),
    radial-gradient(30rem 22rem at 50% 100%, rgba(91, 158, 166, 0.24), transparent 64%);
}
.nv-hero::before, .nv-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  filter: blur(46px);
  opacity: 0.75;
}
.nv-hero::before {
  width: 34rem; height: 34rem; left: -8rem; top: -10rem;
  background: radial-gradient(circle at 35% 35%, rgba(242, 192, 120, 0.85), rgba(242, 192, 120, 0) 68%);
  animation: nvc-float-a 22s ease-in-out infinite alternate;
}
.nv-hero::after {
  width: 30rem; height: 30rem; right: -7rem; top: -6rem;
  background: radial-gradient(circle at 60% 40%, rgba(183, 169, 221, 0.85), rgba(183, 169, 221, 0) 68%);
  animation: nvc-float-b 26s ease-in-out infinite alternate;
}
@keyframes nvc-float-a {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(3rem, 2.5rem, 0) scale(1.08); }
}
@keyframes nvc-float-b {
  from { transform: translate3d(0, 0, 0) scale(1.05); }
  to { transform: translate3d(-3rem, 3rem, 0) scale(0.95); }
}
.nv-hero-inner {
  position: relative;
  max-width: 1080px;
  margin: clamp(1.6rem, 4vw, 3.2rem) auto;
  padding: clamp(2rem, 4.6vw, 3.6rem) clamp(1.4rem, 4vw, 3.4rem);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.44) 100%);
  -webkit-backdrop-filter: blur(30px) saturate(1.7);
  backdrop-filter: blur(30px) saturate(1.7);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 40px;
  box-shadow: 0 40px 90px -40px rgba(47, 107, 117, 0.42), var(--g-in);
}
.nv-hero-kicker {
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 999px;
  padding: 10px 20px;
  display: inline-block;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: var(--g-in);
}
.nv-hero-title {
  font-size: clamp(2.1rem, 5.2vw, 3.6rem);
  line-height: 1.22;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
}
.nv-hero-btns { gap: 16px; margin-top: 2rem; }
.nv-btn {
  border-radius: 999px;
  padding: 15px 34px;
  font-weight: 500;
  transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.3s ease, background 0.3s ease;
}
.nv-btn-solid {
  background: linear-gradient(135deg, #6fb3ba 0%, var(--g-teal-deep) 100%);
  box-shadow: 0 14px 34px -12px rgba(47, 107, 117, 0.6), var(--g-in);
  color: #fff;
}
.nv-btn-solid:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px -14px rgba(47, 107, 117, 0.7), var(--g-in);
}
.nv-btn-outline {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.95);
  color: var(--g-teal-deep);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
  box-shadow: var(--g-in), 0 8px 22px -12px rgba(47, 107, 117, 0.45);
}
.nv-hero-whisper {
  display: inline-block;
  margin-top: 1.4rem;
  padding: 11px 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: var(--g-in);
}

/* 4. 卡片：真玻璃 */
.hero-card, .buy-card, .article-card, .book-card, .cause-card,
.breath-quote, .cert, .cc-ic, .price-placeholder,
.nv-woo ul.products li.product, .nv-woo .shop_table,
.nvc-page--woo form.login, .nvc-page--woo form.register {
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.74) 0%, rgba(255, 255, 255, 0.46) 100%);
  -webkit-backdrop-filter: blur(var(--g-blur)) saturate(var(--g-sat));
  backdrop-filter: blur(var(--g-blur)) saturate(var(--g-sat));
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: var(--g-r);
  box-shadow: var(--g-sh), var(--g-in);
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.35s ease;
}
.hero-card:hover, .buy-card:hover, .article-card:hover, .book-card:hover,
.cause-card:hover, .nv-woo ul.products li.product:hover {
  transform: translateY(-5px);
  box-shadow: var(--g-sh-hover), var(--g-in);
}
.kicker, .badge, .ac-tag, .bc-tag, .cert-badge {
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.95);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  backdrop-filter: blur(12px) saturate(1.4);
  box-shadow: var(--g-in), 0 6px 18px -10px rgba(47, 107, 117, 0.4);
}
.btn, .btn-ghost {
  -webkit-backdrop-filter: blur(10px) saturate(1.3);
  backdrop-filter: blur(10px) saturate(1.3);
}
.btn-ghost {
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.95);
  box-shadow: var(--g-in);
}

/* 5. 陪伴页 */
.nv-cmp-shell {
  background: linear-gradient(168deg, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.52) 100%);
  -webkit-backdrop-filter: blur(30px) saturate(1.6);
  backdrop-filter: blur(30px) saturate(1.6);
  border: 1px solid rgba(255, 255, 255, 0.92);
  border-radius: 34px;
  box-shadow: 0 50px 100px -50px rgba(47, 107, 117, 0.6), var(--g-in);
  overflow: hidden;
}
.nv-cmp-topbar {
  background: rgba(255, 255, 255, 0.62);
  -webkit-backdrop-filter: blur(16px) saturate(1.5);
  backdrop-filter: blur(16px) saturate(1.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.8);
}
.nv-cmp-id-avatar, .cmp-id-avatar {
  background: linear-gradient(150deg, rgba(242, 192, 120, 0.7), rgba(91, 158, 166, 0.45));
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: var(--g-in), 0 6px 18px -8px rgba(47, 107, 117, 0.45);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.nv-cmp-thread-wrap { background: linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.42)); }
.nv-cmp-composer {
  background: rgba(255, 255, 255, 0.66);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  backdrop-filter: blur(20px) saturate(1.5);
  border-top: 1px solid rgba(255, 255, 255, 0.85);
}
.nv-cmp-composer textarea, .nv-cmp-composer input[type="text"] {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 20px;
  box-shadow: var(--g-in), 0 4px 14px -8px rgba(47, 107, 117, 0.35);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.nv-cmp-composer textarea:focus, .nv-cmp-composer input[type="text"]:focus {
  outline: none;
  background: #fff;
  border-color: rgba(91, 158, 166, 0.55);
  box-shadow: 0 0 0 5px rgba(91, 158, 166, 0.16), var(--g-in);
}
.nv-cmp-send, .cmp-send {
  background: linear-gradient(135deg, #74b8bf, var(--g-teal-deep));
  border-radius: 50%;
  box-shadow: 0 12px 26px -10px rgba(47, 107, 117, 0.65), var(--g-in);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.nv-cmp-send:hover, .cmp-send:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 18px 34px -12px rgba(47, 107, 117, 0.7), var(--g-in);
}
.nv-cmp-chips .cmp-chip, .cmp-chips .cmp-chip {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.95);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  backdrop-filter: blur(12px) saturate(1.4);
  box-shadow: var(--g-in), 0 6px 16px -10px rgba(47, 107, 117, 0.4);
  border-radius: 999px;
  transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.nv-cmp-chips .cmp-chip:hover, .cmp-chips .cmp-chip:hover {
  background: var(--g-teal-deep);
  color: #fff;
  transform: translateY(-2px);
}
.cmp-bubble, .nv-cmp-bubble {
  border-radius: 22px;
  line-height: 1.8;
  box-shadow: 0 6px 20px -12px rgba(47, 107, 117, 0.5);
}
.cmp-intro, .cmp-intro-inner {
  background: rgba(255, 255, 255, 0.5);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 26px;
  box-shadow: var(--g-in);
}

/* 6. 表单 */
input[type="text"], input[type="email"], input[type="search"],
input[type="tel"], input[type="password"], textarea, select {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 16px;
  box-shadow: var(--g-in), 0 4px 12px -8px rgba(47, 107, 117, 0.35);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
input:focus, textarea:focus, select:focus {
  border-color: rgba(91, 158, 166, 0.55);
  box-shadow: 0 0 0 4px rgba(91, 158, 166, 0.15), var(--g-in);
}

/* 7. 页脚 */
.nv-footer {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62) 0%, rgba(246, 241, 232, 0.86) 100%);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  backdrop-filter: blur(18px) saturate(1.4);
  border-top: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 -20px 50px -40px rgba(47, 107, 117, 0.5);
}

/* 8. 排版与可访问性 */
h1, h2, h3, .nv-sec-title, .cmp-wtitle { letter-spacing: 0.01em; }
p, li, .cmp-bubble, .nv-cmp-thread { line-height: 1.78; }
.nv-hero-title, .nv-sec-title { text-wrap: balance; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, .cmp-chip:focus-visible {
  outline: 2px solid var(--g-teal-deep);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .nv-hero::before, .nv-hero::after { animation: none !important; }
  .hero-card, .buy-card, .article-card, .book-card, .cause-card,
  .btn, .btn-main, .btn-ghost, .nv-btn, .nv-cmp-send, .cmp-send { transition: none !important; }
  .hero-card:hover, .buy-card:hover, .article-card:hover, .book-card:hover,
  .cause-card:hover, .btn-main:hover, .nv-btn:hover { transform: none !important; }
}
@media (max-width: 720px) {
  body, .nv-cmp-page, .cmp-page { background-attachment: scroll; }
  .nv-hero-inner {
    border-radius: 26px;
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
    backdrop-filter: blur(18px) saturate(1.4);
  }
  .nv-cmp-shell { border-radius: 24px; }
  .hero-card, .buy-card, .article-card, .book-card, .cause-card {
    -webkit-backdrop-filter: blur(14px) saturate(1.25);
    backdrop-filter: blur(14px) saturate(1.25);
  }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hero-card, .buy-card, .article-card, .book-card, .cause-card,
  .nv-cmp-shell, #siteNav, .nv-hero-inner { background: rgba(255, 253, 249, 0.97); }
}
