/**
 * Shop zpmall — zptheme/DSPro-inspired skin (optimized)
 * Loaded after default.css; prefer variables over !important.
 */
:root {
  --zp-accent: #2f6bff;
  --zp-accent-soft: color-mix(in srgb, var(--zp-accent) 12%, transparent);
  --zp-price: #ff5a36;
  --zp-text: #1f2937;
  --zp-muted: #6b7280;
  --zp-border: #e8ecf1;
  --zp-bg: #f4f6f9;
  --zp-card: #ffffff;
  --zp-header-bg: rgba(255, 255, 255, .94);
  --zp-radius: 12px;
  --zp-radius-sm: 8px;
  --zp-shadow: 0 8px 24px rgba(15, 23, 42, .06);
  --zp-shadow-hover: 0 14px 36px rgba(15, 23, 42, .1);
  --zp-container: 1560px;
  --zp-gap: 22px;
  --zp-header-h: 68px;
  --zp-ease: cubic-bezier(.22, 1, .36, 1);
  --zp-font: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;
}

body {
  font-family: var(--zp-font);
  background: var(--zp-bg);
  color: var(--zp-text);
  -webkit-font-smoothing: antialiased;
}

/* 页面宽窄 */
body.layout-wide {
  --zp-container: 1560px;
}
body.layout-narrow {
  --zp-container: 1200px;
}

body.shop-dark {
  --zp-bg: #0f1419;
  --zp-card: #1a222d;
  --zp-text: #e8eef5;
  --zp-muted: #9aa7b5;
  --zp-border: #2a3544;
  --zp-header-bg: rgba(26, 34, 45, .94);
  --zp-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  --zp-shadow-hover: 0 14px 36px rgba(0, 0, 0, .45);
  --zp-accent-soft: color-mix(in srgb, var(--zp-accent) 22%, transparent);
}

/* ---------- Layout ---------- */
.container,
.full-screen .container {
  max-width: var(--zp-container);
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
}

@media (min-width: 1230px) {
  .container { max-width: var(--zp-container); }
}

.posts-wrapper,
.cat-posts-wrapper {
  margin-left: calc(var(--zp-gap) / -2);
  margin-right: calc(var(--zp-gap) / -2);
}

.posts-wrapper > [class*="col-"],
.cat-posts-wrapper > [class*="col-"],
.zp-card-col {
  padding-left: calc(var(--zp-gap) / 2);
  padding-right: calc(var(--zp-gap) / 2);
  margin-bottom: var(--zp-gap);
  display: flex;
}

.posts-wrapper > [class*="col-"] > .zp-card,
.cat-posts-wrapper > [class*="col-"] > .zp-card,
.zp-card-col > .zp-card {
  width: 100%;
  margin: 0;
}

/* ---------- Header (fixed 吸顶跟随) ---------- */
/* default.css 的 .site{overflow:hidden} 会让 sticky 失效，改用 fixed */
.site {
  overflow: visible;
}

.site-header,
.site-header.zp-sticky-nav,
.site-header-headroom,
.site-header-headroom.headroom--pinned,
.site-header-headroom.headroom--unpinned,
.site-header-headroom.headroom--top,
.site-header.headroom--pinned,
.site-header.headroom--unpinned,
.site-header.headroom--top {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
  transform: none !important;
  will-change: auto !important;
  background: var(--zp-header-bg) !important;
  background-color: var(--zp-header-bg) !important;
  backdrop-filter: saturate(1.2) blur(12px);
  -webkit-backdrop-filter: saturate(1.2) blur(12px);
  border-bottom: 1px solid var(--zp-border);
  box-shadow: 0 1px 0 rgba(15, 23, 42, .04);
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* 首页未下滑：透明叠封面 */
body.home:not(.nav-scrolled) .site-header {
  background: transparent !important;
  background-color: transparent !important;
  border-bottom-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.home:not(.nav-scrolled) .navbar li > a,
body.home:not(.nav-scrolled) .navbar .nav-list > li > a,
body.home:not(.nav-scrolled) .navbar .actions .link,
body.home:not(.nav-scrolled) .navbar .actions .link span,
body.home:not(.nav-scrolled) .navbar .note-open,
body.home:not(.nav-scrolled) .navbar .user-pbtn,
body.home:not(.nav-scrolled) .navbar .user-pbtn span {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

body.home:not(.nav-scrolled) .navbar .nav-list > li > a:hover,
body.home:not(.nav-scrolled) .navbar .nav-list .current-menu-item > a {
  color: #fff !important;
  opacity: .85 !important;
}

body.home:not(.nav-scrolled) .navbar .sep:after { background-color: rgba(255, 255, 255, .45); }
body.home:not(.nav-scrolled) .navbar .sep { display: flex !important; }

body.home:not(.nav-scrolled) .navbar .actions .login-btn.navbar-button,
body.home:not(.nav-scrolled) .navbar .actions .navbar-button.common {
  background: rgba(255, 255, 255, .16) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .65) !important;
}

body.home:not(.nav-scrolled) .navbar .burger,
body.home:not(.nav-scrolled) .navbar .burger:before,
body.home:not(.nav-scrolled) .navbar .burger:after {
  background: #fff !important;
}

body.home:not(.nav-scrolled) .navbar .logo,
body.home:not(.nav-scrolled) .navbar img.tap-logo {
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35));
}

/* 下滑后：实心吸顶跟随 */
body.home.nav-scrolled .site-header,
.site-header.is-scrolled {
  background: var(--zp-header-bg) !important;
  background-color: var(--zp-header-bg) !important;
  border-bottom: 1px solid var(--zp-border);
  box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
}

body.home.nav-scrolled .navbar li > a,
body.home.nav-scrolled .navbar .nav-list > li > a,
body.home.nav-scrolled .navbar .actions .link,
body.home.nav-scrolled .navbar .actions .link span,
body.home.nav-scrolled .navbar .note-open,
body.home.nav-scrolled .navbar .user-pbtn,
body.home.nav-scrolled .navbar .user-pbtn span {
  color: var(--zp-text) !important;
  text-shadow: none;
}

body.home.nav-scrolled .navbar .nav-list > li > a:hover,
body.home.nav-scrolled .navbar .nav-list .current-menu-item > a {
  color: var(--zp-accent) !important;
  opacity: 1 !important;
}

body.home.nav-scrolled .navbar .actions .login-btn.navbar-button,
body.home.nav-scrolled .navbar .actions .navbar-button.common {
  background: var(--zp-accent) !important;
  color: #fff !important;
  border-color: transparent !important;
}

body.home.nav-scrolled .navbar .burger,
body.home.nav-scrolled .navbar .burger:before,
body.home.nav-scrolled .navbar .burger:after {
  background: var(--zp-text) !important;
}

body.home.nav-scrolled .navbar .logo,
body.home.nav-scrolled .navbar img.tap-logo {
  filter: none;
}

body.home.nav-scrolled .navbar .sep { display: none !important; }

.header-gap {
  display: block !important;
  height: var(--zp-header-h) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  visibility: hidden;
  pointer-events: none;
}

/* 首页封面自行上探，不需要占位 */
body.home .header-gap {
  display: none !important;
  height: 0 !important;
}

.navbar {
  height: var(--zp-header-h);
  min-height: var(--zp-header-h);
}

.navbar .logo-wrapper {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.navbar .logo,
.navbar img.logo.regular,
.navbar img.tap-logo {
  display: block;
  max-width: 148px;
  max-height: 42px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.navbar .sep { display: none !important; }

.navbar li > a {
  color: var(--zp-text) !important;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 500;
}

.navbar .nav-list > li > a {
  font-size: 15px;
  line-height: var(--zp-header-h);
  margin: 0 12px;
  opacity: 1 !important;
}

.navbar .nav-list > li > a:hover,
.navbar .nav-list .current-menu-item > a,
.navbar .nav-list > .current_page_item > a {
  color: var(--zp-accent) !important;
  opacity: 1 !important;
}

.navbar li.menu-item-has-children > a:after { color: var(--zp-muted); }

.navbar .actions .link,
.navbar .actions .link span,
.navbar .note-open,
.navbar .user-pbtn,
.navbar .user-pbtn span {
  color: var(--zp-text) !important;
}

.navbar .actions .login-btn.navbar-button,
.navbar .actions .navbar-button.common {
  background: var(--zp-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  border-color: transparent !important;
  height: 36px;
  line-height: 36px;
  width: auto;
  min-width: 88px;
  padding: 0 16px;
  font-size: 13px;
}

.navbar .burger,
.navbar .burger:before,
.navbar .burger:after {
  background: var(--zp-text) !important;
  box-shadow: none !important;
}

.off-canvas .logo { background: transparent !important; }

/* ---------- Full-bleed cover hero ---------- */
.zp-cover {
  --zp-cover-h: 420px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--zp-cover-h);
  height: var(--zp-cover-h);
  max-height: 560px;
  margin: 0;
  overflow: hidden;
  background: #1a1f2e;
}

/* 首页封面上拉到导航下方，方便透明顶栏叠图 */
body.home .zp-cover {
  margin-top: calc(var(--zp-header-h) * -1);
}

.zp-cover-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.zp-cover-media img,
.zp-cover-media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  display: block;
  border: 0;
}

.zp-cover-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, .45) 0%, rgba(15, 23, 42, .25) 40%, rgba(15, 23, 42, .55) 100%);
}

.zp-cover-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  text-align: center;
  padding-top: calc(var(--zp-header-h) + 24px);
  padding-bottom: 40px;
}

.zp-cover-title {
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 600;
  letter-spacing: .12em;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .35);
}

.zp-cover-desc {
  margin: 0 auto 28px;
  max-width: 640px;
  color: rgba(255, 255, 255, .85);
  font-size: 15px;
  line-height: 1.6;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .3);
}

.zp-cover-search {
  display: flex;
  align-items: stretch;
  max-width: 720px;
  margin: 0 auto;
  padding: 10px;
  background: rgba(255, 255, 255, .16);
  border-radius: 10px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
}

.zp-cover-search input[type="text"],
.zp-cover-search input[type="search"] {
  flex: 1;
  height: 48px;
  border: 0;
  border-radius: 8px 0 0 8px;
  padding: 0 18px;
  background: #fff;
  color: var(--zp-text);
  font-size: 15px;
  outline: none;
  min-width: 0;
}

.zp-cover-search button,
.zp-cover-search input[type="submit"] {
  height: 48px;
  min-width: 108px;
  border: 0;
  border-radius: 0 8px 8px 0;
  background: var(--zp-accent) !important;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
}

.zp-cover-results {
  max-width: 720px;
  margin: 8px auto 0;
  text-align: left;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: var(--zp-shadow-hover);
}

.zp-cover-hot {
  justify-content: center;
  margin-top: 16px;
}

.zp-cover-hot > span,
.zp-cover-hot a {
  color: rgba(255, 255, 255, .88);
  border-color: rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .1);
  text-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}

.zp-cover-hot a:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, .7);
  background: rgba(255, 255, 255, .2);
}

/* ---------- Dual promo (optional) ---------- */
.zp-hero { padding: 20px 0 4px; }

.zp-hero-grid {
  display: grid;
  grid-template-columns: 1.65fr 1fr;
  gap: var(--zp-gap);
}

.zp-banner {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--zp-radius);
  min-height: 280px;
  background: #1e293b;
  color: #fff;
  text-decoration: none;
  box-shadow: var(--zp-shadow);
  transition: transform .35s var(--zp-ease), box-shadow .35s var(--zp-ease);
}

.zp-banner:hover,
.zp-banner:focus-visible {
  transform: translateY(-3px);
  box-shadow: var(--zp-shadow-hover);
  color: #fff;
  outline: none;
}

.zp-banner--sm { min-height: 280px; }

.zp-banner-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border: 0;
  max-width: none;
}

.zp-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(105deg, rgba(15, 23, 42, .72) 0%, rgba(15, 23, 42, .18) 72%);
  pointer-events: none;
}

.zp-banner-body {
  position: relative;
  z-index: 2;
  padding: 36px 40px;
  max-width: 72%;
  min-height: 280px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.zp-banner-kicker {
  display: inline-block;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .18);
  margin-bottom: 12px;
  width: fit-content;
  backdrop-filter: blur(4px);
}

.zp-banner h2 {
  margin: 0 0 10px;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.25;
  font-weight: 700;
  color: #fff;
}

.zp-banner p {
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .88);
}

.zp-banner-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 999px;
  background: #fff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 600;
  width: fit-content;
  transition: transform .2s var(--zp-ease);
}

.zp-banner:hover .zp-banner-cta { transform: translateX(2px); }

/* ---------- Search ---------- */
.zp-searchbar {
  margin: 18px 0 8px;
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  padding: 16px 18px;
  box-shadow: var(--zp-shadow);
}

.zp-searchbar form {
  display: flex;
  gap: 10px;
  align-items: stretch;
}

.zp-searchbar input[type="text"],
.zp-searchbar input[type="search"] {
  flex: 1;
  height: 46px;
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius-sm);
  padding: 0 16px;
  background: var(--zp-bg);
  color: var(--zp-text);
  font-size: 14px;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}

.zp-searchbar input:focus {
  border-color: var(--zp-accent);
  box-shadow: 0 0 0 3px var(--zp-accent-soft);
}

.zp-searchbar button,
.zp-searchbar input[type="submit"] {
  height: 46px;
  min-width: 108px;
  border: 0;
  border-radius: var(--zp-radius-sm);
  background: var(--zp-accent);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}

.zp-searchbar .home-search-results {
  margin-top: 10px;
  list-style: none;
  padding: 0;
}

.zp-hot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  align-items: center;
}

.zp-hot > span {
  color: var(--zp-muted);
  font-size: 13px;
}

.zp-hot a {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--zp-bg);
  border: 1px solid var(--zp-border);
  color: var(--zp-muted);
  font-size: 12px;
  text-decoration: none;
  transition: color .2s, border-color .2s, background .2s;
}

.zp-hot a:hover {
  color: var(--zp-accent);
  border-color: var(--zp-accent);
  background: var(--zp-accent-soft);
}

/* ---------- Sections ---------- */
.zp-section { padding: 28px 0 8px; }

.zp-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.zp-section-head h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--zp-text);
  line-height: 1.3;
}

.zp-section-head p {
  margin: 6px 0 0;
  color: var(--zp-muted);
  font-size: 13px;
}

.zp-section-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--zp-accent);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.zp-section-more em {
  font-style: normal;
  background: var(--zp-accent-soft);
  color: var(--zp-accent);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  margin-left: 4px;
}

/* Tabs — 分类筛选 */
.home-cat-nav-wrap {
  display: block !important;
  position: relative;
  margin: 0 0 22px;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.zp-tabs,
.home-cat-nav-wrap ul.cat-nav {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: 999px;
  box-shadow: var(--zp-shadow);
}

.zp-tabs::-webkit-scrollbar,
.home-cat-nav-wrap ul.cat-nav::-webkit-scrollbar {
  display: none;
}

.home-cat-nav-wrap ul.cat-nav > li {
  margin: 0;
  flex: 0 0 auto;
}

.zp-tabs button,
.home-cat-nav-wrap .btn.btn--white {
  border: 0;
  background: transparent;
  color: var(--zp-muted);
  border-radius: 999px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: none !important;
  white-space: nowrap;
  transition: background .2s var(--zp-ease), color .2s var(--zp-ease), transform .2s var(--zp-ease);
}

.zp-tabs button:hover,
.home-cat-nav-wrap ul li:hover .btn.btn--white,
.home-cat-nav-wrap .btn.btn--white:hover {
  background: var(--zp-accent-soft);
  color: var(--zp-accent);
}

.zp-tabs li.is-active button,
.zp-tabs button.is-active,
.home-cat-nav-wrap li.is-active .btn.btn--white,
.home-cat-nav-wrap .btn.btn--white.on,
.home-cat-nav-wrap .btn.btn--white.is-active {
  background: var(--zp-accent) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--zp-accent) 35%, transparent);
}

@media (max-width: 768px) {
  .home-cat-nav-wrap {
    display: block !important;
    margin: 0 -4px 18px;
  }
  .home-cat-nav-wrap ul.cat-nav {
    border-radius: 14px;
    padding: 5px;
  }
  .home-cat-nav-wrap .btn.btn--white {
    padding: 7px 14px;
    font-size: 12px;
  }
}

/* ---------- Cards ---------- */
.zp-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  overflow: hidden;
  box-shadow: var(--zp-shadow);
  transition: transform .28s var(--zp-ease), box-shadow .28s var(--zp-ease);
  content-visibility: auto;
  contain-intrinsic-size: 360px;
}

.zp-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--zp-shadow-hover);
}

.zp-card-media {
  position: relative;
  display: block;
  overflow: hidden;
  background: color-mix(in srgb, var(--zp-border) 70%, #c5d0de);
  flex-shrink: 0;
}

.zp-card-media.entry-media {
  margin-bottom: 0;
}

.zp-card-media .placeholder {
  position: relative;
  display: block;
  height: 0;
  padding-bottom: 62%;
  margin: 0;
  overflow: hidden;
  background: inherit;
}

.zp-card-media img,
.zp-card-media .placeholder img,
.post-grid .zp-card-media img {
  position: absolute !important;
  inset: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
  object-position: center;
  border-radius: 0 !important;
  transition: transform .45s var(--zp-ease), opacity .3s ease;
}

.zp-card-media img.lazyload:not(.lazyloaded) {
  opacity: .35;
}

.zp-card-media img.lazyloaded {
  opacity: 1;
}

.zp-card:hover .zp-card-media img { transform: scale(1.05); }

/* 长块：左图右文 */
.zp-card--list {
  flex-direction: row;
  align-items: stretch;
  contain-intrinsic-size: 180px;
}

.zp-card--list .zp-card-media {
  width: 42%;
  max-width: 260px;
  min-width: 120px;
}

.zp-card--list .zp-card-media .placeholder {
  height: 100%;
  min-height: 148px;
  padding-bottom: 0;
}

.zp-card--list .zp-card-body {
  flex: 1;
  min-width: 0;
  justify-content: center;
}

.zp-card--list .zp-card-excerpt {
  -webkit-line-clamp: 2;
}

.zp-card-col > .zp-card--list {
  width: 100%;
}

@media (max-width: 575px) {
  .zp-card--list .zp-card-media {
    width: 112px;
    max-width: 112px;
    min-width: 112px;
  }
  .zp-card--list .zp-card-media .placeholder {
    min-height: 112px;
  }
  .zp-card--list .zp-card-excerpt {
    display: none;
  }
  .zp-card--list .zp-card-title {
    font-size: 14px;
  }
}

.zp-card-price,
.zp-card-tip {
  position: absolute;
  top: 10px;
  z-index: 2;
  color: #fff;
  line-height: 1.3;
  border-radius: 6px;
  pointer-events: none;
}

.zp-card-price {
  left: 10px;
  background: linear-gradient(135deg, #ff7a45, var(--zp-price));
  font-size: 13px;
  font-weight: 700;
  padding: 4px 10px;
  box-shadow: 0 4px 12px rgba(255, 90, 54, .35);
}

.zp-card-price.is-free {
  background: linear-gradient(135deg, #34d399, #059669);
  box-shadow: 0 4px 12px rgba(5, 150, 105, .3);
}

.zp-card-tip {
  right: 10px;
  background: rgba(15, 23, 42, .72);
  font-size: 11px;
  padding: 3px 8px;
}

.zp-card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 14px 14px 12px;
  min-width: 0;
}

.zp-card-cat {
  display: inline-block;
  font-size: 12px;
  color: var(--zp-accent);
  margin-bottom: 6px;
  text-decoration: none;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.zp-card-title {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.45;
  font-weight: 600;
}

.zp-card-title a {
  color: var(--zp-text);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.zp-card-title a:hover { color: var(--zp-accent); }

.zp-card-excerpt {
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--zp-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
}

.zp-card-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--zp-border);
  font-size: 12px;
  color: var(--zp-muted);
}

.zp-card-meta span,
.zp-card-meta a {
  color: var(--zp-muted);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.zp-card-meta i { opacity: .75; }

/* Neutralize legacy .post chrome inside zp-card */
.zp-card.post {
  padding: 0;
  background: var(--zp-card);
  box-shadow: var(--zp-shadow);
}

.zp-card .entry-media,
.zp-card .entry-wrapper { margin: 0; }

/* ---------- Ads / Stats ---------- */
.zp-ads { padding: 12px 0 4px; }

.zp-ads-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--zp-gap);
}

.zp-ads-item {
  min-height: 120px;
  border-radius: var(--zp-radius);
  background: var(--zp-card);
  border: 1px dashed var(--zp-border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--zp-muted);
  overflow: hidden;
  padding: 12px;
}

.zp-ads-item img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: var(--zp-radius-sm);
}

.zp-stats {
  margin: 0;
  padding: 22px 0;
  background: linear-gradient(120deg, #1e3a8a 0%, #2563eb 45%, #0ea5e9 100%);
  color: #fff;
}

/* 紧贴统计条：去掉上方区块底边距、下方页脚顶边距 */
.section.services {
  padding-bottom: 24px;
}
.site-main > .zp-stats {
  margin-top: 0;
}
body:has(.zp-stats) .site-footer {
  margin-top: 0;
}

.zp-stats-inner {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  text-align: center;
}

.zp-stats-item strong {
  display: block;
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 6px;
  font-variant-numeric: tabular-nums;
}

.zp-stats-item span {
  font-size: 13px;
  opacity: .88;
}

/* ---------- List / Detail ---------- */
.term-bar {
  background: linear-gradient(120deg, #1e3a8a, #2563eb);
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0;
  background-size: cover;
}

.term-bar .term-title {
  color: #fff;
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 700;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .25);
}

.filter--content {
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  padding: 14px 16px;
  margin: 20px 0;
  box-shadow: var(--zp-shadow);
}

.filter--content .filter-item a.on i { background: var(--zp-accent); }

.article-focusbox {
  min-height: 200px;
  background-color: #1e293b;
}

.article-focusbox .article-title {
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 700;
}

.breadcrumbs {
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius-sm);
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 13px;
  color: var(--zp-muted);
}

.article-content .entry-wrapper,
.content-column .site-main > article.article-content {
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  padding: 22px;
  box-shadow: var(--zp-shadow);
}

.sidebar .widget {
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  box-shadow: var(--zp-shadow);
}

.related-posts {
  margin-top: 24px;
  padding: 20px;
  background: var(--zp-card);
  border: 1px solid var(--zp-border);
  border-radius: var(--zp-radius);
  box-shadow: var(--zp-shadow);
}

.related-posts h3 {
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 700;
}

.related-posts .related-card-col {
  margin-bottom: 16px;
}

.related-posts .related-card {
  display: block;
  height: 100%;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
}

.related-posts .related-card-media {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  background: color-mix(in srgb, var(--zp-border) 70%, #c5d0de);
  aspect-ratio: 16 / 10;
}

.related-posts .related-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s var(--zp-ease), opacity .25s ease;
}

.related-posts .related-card-media img.lazyload:not(.lazyloaded) {
  opacity: .4;
}

.related-posts .related-card:hover .related-card-media img {
  transform: scale(1.04);
}

.related-posts .related-card-title {
  margin: 10px 0 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

.related-posts .related-card-title a {
  color: var(--zp-text, #1f2937);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.related-posts .related-card-title a:hover {
  color: var(--zp-accent);
}

/* ---------- Footer ---------- */
.site-footer {
  --ft-bg: #eef1f6;
  --ft-ink: #1f2937;
  --ft-muted: #6b7280;
  --ft-line: #dde3ec;
  --ft-chip: #ffffff;
  margin-top: 56px;
  padding: 0;
  background:
    radial-gradient(1200px 280px at 12% 0%, color-mix(in srgb, var(--zp-accent) 10%, transparent), transparent 60%),
    var(--ft-bg);
  color: var(--ft-muted);
  border-top: 1px solid var(--ft-line);
  text-align: left;
}

.site-footer a {
  color: var(--ft-muted);
  font-weight: 500;
  text-decoration: none;
  transition: color .2s ease;
}
.site-footer a:hover { color: var(--zp-accent); }

.zp-footer-top {
  display: grid;
  grid-template-columns: 1.35fr 1fr .95fr;
  gap: 40px 48px;
  padding: 52px 0 36px;
}

.zp-footer-logo {
  display: inline-block;
  margin-bottom: 14px;
}
.zp-footer-logo img {
  display: block;
  max-width: 148px;
  height: auto;
}

.zp-footer-des {
  margin: 0 0 10px;
  max-width: 34ch;
  font-size: 14px;
  line-height: 1.7;
  color: var(--ft-ink);
}

.zp-footer-note {
  margin: 0;
  max-width: 36ch;
  font-size: 12px;
  line-height: 1.65;
  color: var(--ft-muted);
}

.zp-footer-navs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px 28px;
}

.zp-footer-col h5,
.zp-footer-aside h5 {
  margin: 0 0 14px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ft-ink);
}

.zp-footer-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.zp-footer-col li {
  margin: 0 0 10px;
}
.zp-footer-col a {
  display: inline-block;
  font-size: 14px;
  color: var(--ft-muted);
}
.zp-footer-col a:hover { color: var(--zp-accent); }

.zp-footer-search {
  position: relative;
  display: flex;
  align-items: center;
}
.zp-footer-search input {
  width: 100%;
  height: 46px;
  border: 1px solid var(--ft-line);
  border-radius: 12px;
  background: var(--ft-chip);
  color: var(--ft-ink);
  padding: 0 48px 0 16px;
  font-size: 14px;
  outline: 0;
  box-shadow: 0 1px 0 rgba(15, 23, 42, .02);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.zp-footer-search input::placeholder { color: #9aa3af; }
.zp-footer-search input:focus {
  border-color: color-mix(in srgb, var(--zp-accent) 55%, var(--ft-line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--zp-accent) 14%, transparent);
}
.zp-footer-search button {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: var(--zp-accent);
  color: #fff;
  cursor: pointer;
  padding: 0;
  line-height: 34px;
  transition: opacity .2s ease;
}
.zp-footer-search button:hover { opacity: .9; }

.zp-footer-friends {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 0;
  border-top: 1px dashed var(--ft-line);
}
.zp-footer-friends-label {
  flex: 0 0 auto;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  color: #94a3b8;
}
.zp-footer-friends-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.zp-footer-friends-list a {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--ft-chip);
  border: 1px solid var(--ft-line);
  font-size: 12px;
  color: var(--ft-muted);
}
.zp-footer-friends-list a:hover {
  color: var(--zp-accent);
  border-color: color-mix(in srgb, var(--zp-accent) 35%, var(--ft-line));
  background: #fff;
}
.zp-footer-friends-apply {
  color: #c2410c !important;
  border-color: #fdba74 !important;
  background: #fff7ed !important;
}

.zp-footer-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0 28px;
  border-top: 1px solid var(--ft-line);
  font-size: 12px;
  color: #94a3b8;
}
.zp-footer-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}
.zp-footer-copy a { color: #94a3b8; }
.zp-footer-copy a:hover { color: var(--zp-accent); }
.zp-footer-powered a {
  color: #94a3b8;
  white-space: nowrap;
}

/* kill legacy footer styles bleeding through */
.site-footer .footer-widget,
.site-footer .site-info,
.site-footer .links {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  text-align: left;
}

body.shop-dark .site-footer {
  --ft-bg: #121820;
  --ft-ink: #e8eef5;
  --ft-muted: #9aa7b5;
  --ft-line: #243041;
  --ft-chip: #1a222d;
}

@media (max-width: 991px) {
  .zp-footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 28px 24px;
    padding: 40px 0 28px;
  }
  .zp-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 576px) {
  .site-footer { margin-top: 36px; }
  .zp-footer-top {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 32px 0 24px;
  }
  .zp-footer-navs { gap: 20px; }
  .zp-footer-friends {
    flex-direction: column;
    gap: 10px;
  }
  .zp-footer-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding-bottom: 22px;
  }
}

body.shop-dark .home-cat-nav-wrap,
body.shop-dark .home-cat-nav-wrap ul.cat-nav {
  background: var(--zp-card);
}
body.shop-dark .home-cat-nav-wrap .btn--white {
  background: transparent;
  color: var(--zp-muted);
}

/* ---------- Chrome ---------- */
.button,
.navigation .nav-next a,
.navigation .nav-previous a,
button[type="submit"],
input[type="submit"],
.infinite-scroll-button.button {
  background-color: var(--zp-accent);
  border-radius: var(--zp-radius-sm);
}

.entry-tipss { background: var(--zp-accent); }

.shop-color,
a:hover,
.on { color: var(--zp-accent); }

.rollbar-item {
  background: var(--zp-card);
  color: var(--zp-text);
  border: 1px solid var(--zp-border);
  box-shadow: var(--zp-shadow);
}

.category-boxes .category-box {
  border-radius: var(--zp-radius);
  overflow: hidden;
  box-shadow: var(--zp-shadow);
}

.section.bgcolor-fff {
  background: transparent;
  padding-top: 12px;
  padding-bottom: 0;
}

.section.services {
  background: var(--zp-card);
  border-top: 1px solid var(--zp-border);
  padding-top: 28px;
  padding-bottom: 24px;
}

.service-single {
  background: var(--zp-bg);
  border-radius: var(--zp-radius);
  padding: 20px;
  border: 1px solid var(--zp-border);
}

.numeric-pagination .page-numbers a,
.numeric-pagination .page-numbers span {
  border-radius: var(--zp-radius-sm);
}

/* ---------- Mobile nav ---------- */
.zp-mnav {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  background: var(--zp-card);
  border-top: 1px solid var(--zp-border);
  padding: 6px 0 calc(6px + env(safe-area-inset-bottom, 0px));
  grid-template-columns: repeat(4, 1fr);
  box-shadow: 0 -6px 20px rgba(15, 23, 42, .06);
}

.zp-mnav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-size: 11px;
  color: var(--zp-muted);
  text-decoration: none;
  padding: 6px;
}

.zp-mnav a i { font-size: 18px; }

.zp-mnav a:hover,
.zp-mnav a.is-active { color: var(--zp-accent); }

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
  :root,
  body.layout-wide,
  body.layout-narrow { --zp-container: 1140px; --zp-gap: 18px; }
  .zp-stats-inner { grid-template-columns: repeat(3, 1fr); gap: 18px; }
}

@media (max-width: 991px) {
  .zp-cover {
    height: auto;
    min-height: 320px;
    max-height: none;
  }
  .zp-cover-inner { padding-top: calc(var(--zp-header-h) + 16px); padding-bottom: 28px; }
  .zp-cover-search { margin-left: 12px; margin-right: 12px; }
  .zp-hero-grid { grid-template-columns: 1fr; }
  .zp-banner,
  .zp-banner--sm,
  .zp-banner-body { min-height: 200px; }
  .zp-banner-body {
    max-width: 92%;
    padding: 24px;
  }
  .zp-ads-grid { grid-template-columns: 1fr; }
  .zp-mnav { display: grid; }
  body { padding-bottom: 68px; }
  .navbar .nav-list { display: none; }
  .rollbar { bottom: 72px; }
}

@media (max-width: 575px) {
  :root { --zp-gap: 12px; --zp-header-h: 58px; }
  .container { padding-left: 12px; padding-right: 12px; }
  .zp-cover { min-height: 300px; }
  .zp-cover-title { letter-spacing: .06em; }
  .zp-cover-search {
    flex-direction: column;
    gap: 8px;
    padding: 12px;
  }
  .zp-cover-search input[type="text"],
  .zp-cover-search button {
    width: 100%;
    border-radius: 8px !important;
  }
  .zp-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .zp-section-head h2 { font-size: 20px; }
  .zp-card-title { font-size: 14px; }
  .zp-card-excerpt { display: none; }
}

/* ---------- A11y / motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .zp-card:hover,
  .zp-banner:hover { transform: none; }
  .zp-card:hover .zp-card-media img { transform: none; }
}

@supports not (color: color-mix(in srgb, red 10%, transparent)) {
  :root { --zp-accent-soft: rgba(47, 107, 255, .12); }
  body.shop-dark { --zp-accent-soft: rgba(47, 107, 255, .22); }
}
