/* ==========================================================================
   WordPress / Kadence / WooCommerce 对接层
   设计系统（design-system.css）负责组件外观，这一层只负责把 WordPress 的
   实际 HTML 结构对齐到那套组件上。
   ========================================================================== */

/* ---- 基础排版：确保主题的标题样式不覆盖设计系统 ---- */
body.wecent-site h1,
body.wecent-site h2,
body.wecent-site h3,
body.wecent-site h4,
body.wecent-site .entry-content h1,
body.wecent-site .entry-content h2,
body.wecent-site .entry-content h3,
body.wecent-site .entry-content h4 {
  font-family: var(--font-head);
  color: var(--ink);
  line-height: 1.2;
  letter-spacing: -0.011em;
}

/* 深色区块里的标题必须保持白色：上面的规则选择器权重更高，
   会盖掉设计系统里 .page-hero h1 / .hero h1 / .cta-band h2 的白色，这里补回来。 */
body.wecent-site .page-hero h1,
body.wecent-site .page-hero h2,
body.wecent-site .hero h1,
body.wecent-site .cta-band h1,
body.wecent-site .cta-band h2,
body.wecent-site .cta-band h3 {
  color: #fff;
}

body.wecent-site .page-hero .page-hero__lead,
body.wecent-site .hero .hero__lead,
body.wecent-site .cta-band p {
  color: #b3c4d6;
}

body.wecent-site .page-hero .breadcrumb,
body.wecent-site .page-hero .breadcrumb a {
  color: #8ea3b8;
}

body.wecent-site a {
  text-decoration: none;
}

/* ---- 用我们的模板搭建的页面：放开主题的内容宽度与内边距 ---- */
body.wecent-canvas .entry-content,
body.wecent-canvas .content-area,
body.wecent-canvas .site-main,
body.wecent-canvas .content-container,
body.wecent-canvas .site-container,
body.wecent-canvas #primary,
body.wecent-canvas .wp-site-blocks > .wp-block-group {
  max-width: none;
  padding-inline: 0;
  margin-inline: 0;
}

/* Kadence 的内容容器还会加垂直方向的留白 —— 实测是 .content-area 的 80px 上边距
   加上 .entry-content-wrap 的 32px 上内边距，页头与首屏之间因此多出 112px 空白；
   页脚上方同样多 80px。整版页面必须把这两处清掉。 */
body.wecent-canvas .content-area,
body.wecent-canvas .content-container,
body.wecent-canvas .site-container,
body.wecent-canvas .site-main,
body.wecent-canvas .content-wrap,
body.wecent-canvas .entry-content-wrap,
body.wecent-canvas .entry,
body.wecent-canvas article.entry,
body.wecent-canvas .entry-content {
  margin-block: 0;
  padding-block: 0;
}

/* 我们的首屏 / 内容页 banner 直接顶住页头，不要任何额外间距 */
body.wecent-canvas .hero,
body.wecent-canvas .page-hero {
  margin-block-start: 0;
}

body.wecent-canvas .entry-header,
body.wecent-canvas .page-title {
  display: none; /* 页面标题由我们自己的 banner 承担，避免重复 H1 */
}

body.wecent-canvas .entry-content > .wp-block-html,
body.wecent-canvas .elementor-widget-html {
  margin-block: 0;
}

/* ---- 表格：小屏可横向滚动 ---- */
.table-wrap.is-scrollable {
  position: relative;
  border-color: #cfe0ee;
}

/* ==========================================================================
   WooCommerce — 集合页（B 模板）
   ========================================================================== */

.wecent-site .woocommerce-products-header {
  margin: 0;
}

.wecent-site .woocommerce-breadcrumb {
  font-size: 0.84rem;
  color: var(--muted);
  margin: 0 0 18px;
}

.wecent-site .woocommerce-breadcrumb a {
  color: var(--body);
}

.wecent-site .woocommerce-result-count,
.wecent-site .woocommerce-ordering {
  font-size: 0.9rem;
  color: var(--muted);
  margin: 0 0 18px;
}

.wecent-site .woocommerce-ordering select {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 12px;
  font: inherit;
  font-size: 0.87rem;
  color: var(--ink-2);
  background: #fff;
}

/* 产品网格 → 我们的 .pcard 外观 */
.wecent-site ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 24px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.wecent-site ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.wecent-site ul.products li.product:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: #cfe0ee;
}

.wecent-site ul.products li.product a img {
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: var(--soft);
  padding: 20px;
  margin: 0;
  border-bottom: 1px solid var(--line);
}

.wecent-site ul.products li.product .woocommerce-loop-product__title {
  font-size: 1.05rem;
  padding: 20px 22px 6px;
  margin: 0;
}

.wecent-site ul.products li.product .pcard__excerpt {
  padding: 0 22px 18px;
  margin: 0;
  font-size: 0.9rem;
  color: var(--body);
}

.wecent-site ul.products li.product .button,
.wecent-site ul.products li.product .added_to_cart {
  margin: 0 22px 22px;
  align-self: flex-start;
}

.wecent-site ul.products li.product .price,
.wecent-site ul.products li.product .star-rating {
  display: none; /* 询盘模式 */
}

/* ==========================================================================
   WooCommerce — 产品页（D 模板）
   ========================================================================== */

.wecent-site .woocommerce div.product {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  gap: clamp(26px, 3.4vw, 56px);
  align-items: start;
}

.wecent-site .woocommerce div.product .woocommerce-product-gallery {
  width: 100% !important;
  float: none !important;
}

.wecent-site .woocommerce div.product .woocommerce-product-gallery__wrapper {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--soft);
}

.wecent-site .woocommerce div.product .woocommerce-product-gallery__image img {
  object-fit: contain;
}

.wecent-site .woocommerce div.product .flex-control-thumbs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 0;
}

.wecent-site .woocommerce div.product .flex-control-thumbs li {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}

.wecent-site .woocommerce div.product .flex-control-thumbs img {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 10px;
  aspect-ratio: 1;
  object-fit: contain;
}

.wecent-site .woocommerce div.product .summary {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

.wecent-site .woocommerce div.product .product_title {
  font-size: clamp(1.5rem, 2.35vw, 2.15rem);
  margin-bottom: 0.4em;
}

.wecent-site .woocommerce div.product .woocommerce-product-details__short-description p {
  font-size: 0.92rem;
  color: var(--muted);
}

.wecent-site .woocommerce div.product .product_meta {
  font-size: 0.86rem;
  color: var(--muted);
  margin-top: 18px;
}

/* 标签页 */
.wecent-site .woocommerce-tabs {
  margin-top: clamp(36px, 4vw, 64px);
}

.wecent-site .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  margin: 0 0 20px;
  list-style: none;
  border: 0;
}

.wecent-site .woocommerce-tabs ul.tabs::before,
.wecent-site .woocommerce-tabs ul.tabs li::before,
.wecent-site .woocommerce-tabs ul.tabs li::after {
  display: none !important;
}

.wecent-site .woocommerce-tabs ul.tabs li {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
}

.wecent-site .woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--ink-2);
}

.wecent-site .woocommerce-tabs ul.tabs li.active a {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

.wecent-site .woocommerce-Tabs-panel {
  max-width: 78ch;
}

/* 相关产品 */
.wecent-site .related.products > h2,
.wecent-site .upsells.products > h2 {
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  margin-bottom: 1em;
}

.wecent-site .related.products ul.products,
.wecent-site .upsells.products ul.products {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* 按钮统一到设计系统 */
.wecent-site .woocommerce a.button,
.wecent-site .woocommerce button.button,
.wecent-site .woocommerce input.button,
.wecent-site .woocommerce #respond input#submit,
.wecent-site .woocommerce .cart .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--blue);
  color: #fff;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1;
  transition: background 0.2s ease, transform 0.2s ease;
}

.wecent-site .woocommerce a.button:hover,
.wecent-site .woocommerce button.button:hover,
.wecent-site .woocommerce input.button:hover,
.wecent-site .woocommerce #respond input#submit:hover {
  background: var(--blue-dark);
  transform: translateY(-2px);
}

/* 提示信息 */
.wecent-site .woocommerce-message,
.wecent-site .woocommerce-info,
.wecent-site .woocommerce-error {
  border-top-color: var(--blue);
  background: var(--blue-soft);
  border-radius: var(--radius);
  font-size: 0.92rem;
}

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width: 1024px) {
  .wecent-site ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wecent-site .woocommerce div.product {
    grid-template-columns: 1fr;
  }

  .wecent-site .related.products ul.products,
  .wecent-site .upsells.products ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .wecent-site ul.products,
  .wecent-site .related.products ul.products,
  .wecent-site .upsells.products ul.products {
    grid-template-columns: 1fr;
  }

  .wecent-site .woocommerce div.product .flex-control-thumbs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ==========================================================================
   询盘表单（[wecent_quote_form]）
   ========================================================================== */

.wecent-quote {
  margin: 0;
}

.wecent-quote__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.wecent-quote__full {
  grid-column: 1 / -1;
}

.wecent-quote label {
  display: grid;
  gap: 7px;
  font-family: var(--font-body);
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--ink);
}

.wecent-quote input,
.wecent-quote select,
.wecent-quote textarea {
  width: 100%;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit;
  font-size: 0.94rem;
  font-weight: 400;
  color: var(--body);
  background: #fff;
}

.wecent-quote input:focus,
.wecent-quote select:focus,
.wecent-quote textarea:focus {
  outline: 2px solid var(--blue-soft);
  border-color: var(--blue);
}

.wecent-quote textarea {
  resize: vertical;
}

@media (max-width: 720px) {
  .wecent-quote__grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   Cookie 同意条
   ========================================================================== */

.cookie-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 95;
  background: rgba(6, 19, 32, 0.97);
  color: #c2d0de;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(6px);
}

.cookie-bar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  padding: 14px 0;
}

.cookie-bar p {
  margin: 0;
  font-size: 0.86rem;
  max-width: 70ch;
}

.cookie-bar a {
  color: #9fd0ff;
  text-decoration: underline;
}

.cookie-bar .btn {
  padding: 11px 20px;
  font-size: 0.86rem;
}

body.cookie-visible .wa-float {
  bottom: 96px;
}

@media (max-width: 720px) {
  body.cookie-visible .wa-float {
    bottom: 132px;
  }
}

/* ==========================================================================
   WooCommerce 页面骨架：去掉主题自带的标题区，让我们的 banner 接管
   ========================================================================== */

/* 1) 面包屑只保留我们自己的那一套，隐藏 Kadence 自带的面包屑（否则一页两个） */
#kadence-breadcrumbs,
.kadence-breadcrumbs {
  display: none !important;
}

/* 2) 主题容器的垂直留白全部清零：
      Kadence 的 .content-area 有 80px 上下外边距、.entry-content-wrap 有 32px 上内边距，
      不清掉就会出现"页头 → banner"和"最后一个区块 → 页脚"两处大空白。 */
body .content-area,
body .content-container,
body .site-container,
body .site-main,
body .content-wrap,
body .entry-content-wrap,
body .entry-content {
  margin-block: 0 !important;
  padding-block: 0 !important;
}

/* 3) 小标题（eyebrow）在 WooCommerce 页面里被拉成了几百像素高，这里强制回到一行高度 */
.sec-head {
  display: block !important;
}

.sec-head__kicker {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  align-self: start !important;
  line-height: 1.4 !important;
}

/* 4) 产品标签页配色：浅蓝底 + 蓝字，选中时蓝底 + 白字（原来是深底深字，看不见） */
.wecent-site .woocommerce-tabs ul.tabs li a {
  background: var(--blue-soft) !important;
  border-color: #cfe3f5 !important;
  color: var(--blue) !important;
}

.wecent-site .woocommerce-tabs ul.tabs li.active a {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: #fff !important;
}

.wecent-site .woocommerce-tabs ul.tabs li a:hover {
  border-color: var(--blue) !important;
}

/* 5) 收尾 CTA：改成品牌蓝，与深色页脚形成层次（参考 auvolar：上蓝下黑） */
.cta-band {
  background: linear-gradient(135deg, #0a5c9e 0%, #0875d1 55%, #0a66b3 100%) !important;
}

.cta-band::before {
  background: radial-gradient(760px 420px at 85% 10%, rgba(255, 255, 255, 0.18), transparent 62%) !important;
}

/* 页脚顶部加一条细线，让蓝色区块与深色页脚的衔接更明确 */
.footer {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

body.single-product .cta-band,
body.post-type-archive-product .cta-band,
body.tax-product_cat .cta-band,
body.tax-product_tag .cta-band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

body.wecent-site.post-type-archive-product .entry-hero,
body.wecent-site.tax-product_cat .entry-hero,
body.wecent-site.tax-product_tag .entry-hero,
body.wecent-site.single-product .entry-hero,
body.wecent-site.post-type-archive-product .entry-header,
body.wecent-site.tax-product_cat .entry-header,
body.wecent-site.tax-product_tag .entry-header,
body.wecent-site.single-product .entry-header {
  display: none !important;
}

/* 深色横幅 / 浅色区块在主题容器里通栏显示 */
.wecent-bleed,
body.single-product .section--soft,
body.single-product .cta-band,
body.post-type-archive-product .section--soft,
body.tax-product_cat .section--soft,
body.tax-product_tag .section--soft {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* 结果统计 + 排序 工具栏 */
.wecent-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  align-items: center;
  justify-content: space-between;
  margin: 18px 0 22px;
}

.wecent-toolbar .woocommerce-result-count {
  margin: 0;
  font-size: 0.9rem;
  color: var(--muted);
}

.wecent-toolbar .woocommerce-ordering {
  margin: 0;
}

/* 分页 */
.wecent-site .woocommerce-pagination {
  margin-top: 34px;
}

.wecent-site .woocommerce-pagination ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}

.wecent-site .woocommerce-pagination ul li {
  margin: 0;
  border: 0;
  overflow: visible;
}

.wecent-site .woocommerce-pagination ul li a,
.wecent-site .woocommerce-pagination ul li span {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 0.9rem;
  color: var(--ink-2);
  background: #fff;
}

.wecent-site .woocommerce-pagination ul li span.current {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.wecent-site .woocommerce-pagination ul li a:hover {
  border-color: var(--blue);
  color: var(--blue);
}

/* 产品单页：摘要区补间距，标签页与区块不要挤在一起 */
body.single-product .wecent-site .woocommerce-tabs,
body.single-product .woocommerce-tabs {
  margin-top: 8px;
}

body.single-product .woocommerce div.product {
  padding-top: 8px;
}

/* ==========================================================================
   页面模板：集合页（选分类）/ 全宽空白页
   ========================================================================== */

body.page-template-template-catalog .entry-header,
body.page-template-template-catalog .entry-hero,
body.page-template-template-blank .entry-header,
body.page-template-template-blank .entry-hero {
  display: none !important;
}

body.page-template-template-blank .entry-content,
body.page-template-template-blank .content-area,
body.page-template-template-blank .content-container,
body.page-template-template-blank .site-container,
body.page-template-template-blank .site-main {
  max-width: none;
  padding-inline: 0;
  padding-block: 0;
  margin-inline: 0;
  margin-block: 0;
}

main.wecent-blank {
  padding: 0;
}

/* 集合页模板里的分页（paginate_links 输出 a / span） */
.pager a,
.pager span {
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 0.9rem;
  color: var(--ink-2);
  background: #fff;
}

.pager .current {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

/* ==========================================================================
   商品卡升级：规格要点 + 库存标 + 双 CTA（参考 Dakota 的卡片信息密度）
   ========================================================================== */

/* 视频页：嵌入式播放器 + 视频卡 + 频道卡 */
.video-embed {
  position: relative;
  padding-top: 56.25%;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--line);
  background: #000;
}

.video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-card {
  display: block;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: #fff;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

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

.video-card__thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--soft);
}

.video-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-card__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(6, 19, 32, 0.28);
}

.video-card__play span {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.94);
  display: grid;
  place-items: center;
}

.video-card__play svg {
  width: 20px;
  height: 20px;
  color: var(--blue);
  margin-left: 3px;
}

.video-card__body {
  padding: 16px 18px 20px;
}

.video-card__body h3 {
  margin: 0 0 0.3em;
  font-size: 1rem;
}

.video-card__body p {
  margin: 0;
  font-size: 0.86rem;
  color: var(--muted);
}

.channel-card {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

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

.channel-card h3 {
  margin: 0;
  font-size: 1rem;
}

.channel-card p {
  margin: 0;
  font-size: 0.88rem;
  color: var(--body);
}

.pcard__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.pcard__stock {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #1a7f37;
  background: #eaf7ee;
  padding: 5px 10px;
  border-radius: 999px;
}

.pcard__specs {
  display: grid;
  gap: 8px;
  margin: 4px 0 16px;
  padding: 0;
  list-style: none;
}

.pcard__specs li {
  display: flex;
  gap: 9px;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--body);
}

.pcard__specs svg {
  width: 15px;
  height: 15px;
  flex: none;
  margin-top: 4px;
  color: var(--blue);
}

.pcard__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: auto;
  padding-top: 4px;
}

.pcard__actions .btn {
  padding: 11px 18px;
  font-size: 0.85rem;
}

/* 同级分类切换条：当前项高亮 */
.subnav a.is-active {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

.subnav a.is-active:hover {
  background: var(--ink);
  color: #fff;
}

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT —— 0.9.1 修正补丁（可直接粘贴到 外观 → 自定义 → 额外 CSS）
   --------------------------------------------------------------------------
   这一步解决 4 件事：
   1. 产品页 "Technical" 与 "Specifications" 之间 600px 的大空白（根因：浮动图库）
   2. 集合页 / 产品页 页头与 banner 之间的多余留白
   3. 右侧约 8px 的横向滚动条
   4. 参考 auvolar：收尾区块用品牌蓝 + 页脚近黑色，两块无缝相连
   粘贴后点「发布」即可，不用重新上传主题。
   ========================================================================== */

/* ==========================================================================
   WECENT 子主题 0.9.1 —— 修正
   1) 产品页两栏布局：根因是 Kadence 的单产品模板没有 .woocommerce 包裹层，
      旧的 `.wecent-site .woocommerce div.product ...` 选择器全部失配，
      WooCommerce 默认 float 布局保留下来（图库 float:left、摘要 float:right）。
      浮动的图库一路压进描述区，把描述区第一行文字挤到 600px 以下，
      于是 "Technical" 和 "Specifications" 之间出现一大片空白。
      这里改成不依赖 .woocommerce 的 grid 两栏，浮动彻底消失。
   2) 通栏区块用 100vw 铺满，会把纵向滚动条宽度也算进去，
      页面右侧因此多出约 8px 的横向滚动条 → 用 overflow-x: clip 收掉
      （clip 不建立滚动容器，不会像 hidden 那样破坏页内目录的 sticky）。
   3) 参考 auvolar：内容区收尾用品牌蓝，页脚用近黑色，两块无缝相连。
   ========================================================================== */

/* --- 1. 产品页两栏 ------------------------------------------------------- */

/* 1a. 小标题（eyebrow）曾被拉成几百像素高：这里做一次彻底归一化。
      即使后台「额外 CSS」里还留着旧的那段修正，也会被这段覆盖。 */
.sec-head {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.sec-head__kicker {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 0 0.7rem 0 !important;
  line-height: 1.4 !important;
  align-self: start !important;
}

/* 1b. 两栏 */

/* 1b-2. 产品图库的"幽灵高度"。
        10Web Booster 把 WooCommerce 的 CSS/JS 延迟到用户交互之后加载，
        flexslider 在样式还没到位时就初始化，按"缩略图竖排"算出一个 1263px 的
        高度写进内联样式（实测 div.woocommerce-product-gallery[style*="height: 1263.38px"]），
        之后不再重算。图库比右边摘要高出 500 多像素，于是摘要文字下面出现一大片空白，
        描述区（Technical / Specifications）被推到 1482px 才开始 —— 这就是产品页
        "产品图和右边文字是一块，它和下面这一块之间有很大空白"的原因。
        这里把高度交还给内容，并且自己定义缩略图排布，初始化前后都正常。 */
body.single-product div.product > .woocommerce-product-gallery,
.wecent-site .woocommerce-product-gallery {
  height: auto !important;
  max-height: none !important;
  opacity: 1 !important;
}

.woocommerce-product-gallery .flex-viewport {
  max-height: none !important;
}

/* 缩略图：一行四个正方形，不论 flexslider 有没有初始化都一致 */
.woocommerce-product-gallery .flex-control-thumbs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.woocommerce-product-gallery .flex-control-thumbs li {
  width: auto !important;
  height: auto !important;
  float: none !important;
  margin: 0 !important;
}

.woocommerce-product-gallery .flex-control-thumbs img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: 8px;
}

/* 1b-3. 产品摘要区：报价按钮上下的留白。
       原来按钮和上面的价格说明只隔 22px，和下面的 SKU / Categories 那行是 **0px**
       （`.product_meta{margin-top:18px}` 写在一条带 .woocommerce 的选择器里，
        而 Kadence 单产品模板没有 .woocommerce 包裹层，所以一直是失效的），
        按钮框的边缘几乎贴着下面的小字。这里补齐上下间距。 */
body.single-product .summary .price-note {
  margin-bottom: 32px !important;
}

body.single-product .summary .btn-row {
  margin: 0 0 26px 0 !important;
}

body.single-product .summary .product_meta {
  margin-top: 0 !important;
  margin-bottom: 16px;
  font-size: 0.86rem;
  color: var(--muted);
}

body.single-product .summary .product_meta a {
  color: var(--body);
}

body.single-product .summary .product_meta a:hover {
  color: var(--blue);
}

@media (min-width: 1025px) {
  body.single-product div.product {
    display: grid !important;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr) !important;
    column-gap: clamp(26px, 3.4vw, 56px) !important;
    row-gap: 0 !important;
    align-items: start !important;
  }
}

body.single-product div.product > * {
  grid-column: 1 / -1 !important;
  min-width: 0;
}

body.single-product div.product > .woocommerce-product-gallery {
  grid-column: 1 !important;
  grid-row: 1 !important;
  float: none !important;
  width: 100% !important;
}

body.single-product div.product > .summary.entry-summary {
  grid-column: 2 !important;
  grid-row: 1 !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}

/* 兜底：任何残留浮动都不允许再压进下面的区块 */
body.single-product div.product > .section,
body.single-product div.product > .woocommerce-tabs,
body.single-product div.product > .related,
body.single-product div.product > .upsells {
  clear: both;
}

/* 1c. 通栏区块：.hero / .page-hero（深色大横幅）、.subnav（页内导航条）、
       .cta-band（收尾蓝色区块）都必须铺满视口宽度。
       Kadence 的 .entry-content-wrap 有 32px 左右内边距，会把它们缩到 1337px，
       两侧露出白色边条 —— 蓝色收尾区块和黑色页脚宽度不一致时最明显
       （就像 auvolar 那样"上面一块不是全屏、最边栏没颜色"，接缝会很难看）。
       集合页因为用了 .wecent-bleed 本来就是通栏，所以这里只针对内容页。 */
body.wecent-canvas .hero,
body.wecent-canvas .page-hero,
body.wecent-canvas .subnav,
body.wecent-canvas .cta-band {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* --- 2. 通栏不再撑出横向滚动条 ------------------------------------------- */

body.wecent-site {
  overflow-x: clip !important;
}

/* --- 3. auvolar 式配色：上蓝下黑 ----------------------------------------- */

/* --- 4. 折叠式 SEO 长文（页面底部） -------------------------------------
       <details> 原生折叠：点摘要行展开，展开后右侧按钮变成 "Know less"，点一下收起。
       长文用两栏排版（参考电商站底部 SEO 段落），小屏自动变单栏。 */
.seo-long {
  background: #fff;
  border-top: 1px solid var(--line);
}

.seo-long__box {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: #fff;
  overflow: hidden;
}

.seo-long__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
}

.seo-long__head::-webkit-details-marker {
  display: none;
}

.seo-long__title {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: clamp(1rem, 1.5vw, 1.18rem);
  color: var(--ink);
  line-height: 1.35;
}

.seo-long__toggle {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--blue);
  background: var(--blue-soft);
  border: 1px solid #cfe3f5;
  border-radius: 999px;
  padding: 9px 16px;
  white-space: nowrap;
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.seo-long__head:hover .seo-long__toggle {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.seo-long__less {
  display: none;
}

.seo-long__box[open] .seo-long__more {
  display: none;
}

.seo-long__box[open] .seo-long__less {
  display: inline;
}

.seo-long__box[open] .seo-long__toggle {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

.seo-long__body {
  border-top: 1px solid var(--line);
  padding: 24px 24px 28px;
  column-count: 2;
  column-gap: 48px;
}

.seo-long__body h3 {
  font-size: 1.02rem;
  margin: 1.5em 0 0.5em;
  break-after: avoid;
}

.seo-long__body h3:first-child {
  margin-top: 0;
}

.seo-long__body p {
  font-size: 0.93rem;
  line-height: 1.72;
  color: var(--body);
  margin: 0 0 1em;
  break-inside: avoid;
}

.seo-long__body ul {
  margin: 0 0 1em;
  padding-left: 1.1em;
  display: grid;
  gap: 0.5em;
  break-inside: avoid;
}

.seo-long__body li {
  font-size: 0.93rem;
  line-height: 1.65;
  color: var(--body);
}

.seo-long__body strong {
  color: var(--ink);
}

@media (max-width: 900px) {
  .seo-long__body {
    column-count: 1;
  }
}

@media (max-width: 640px) {
  .seo-long__head {
    flex-wrap: wrap;
  }

  .seo-long__toggle {
    width: 100%;
  }
}

.cta-band {
  background: linear-gradient(135deg, #0a5c9e 0%, #0875d1 55%, #0a66b3 100%) !important;
}

.cta-band::before {
  background: radial-gradient(760px 420px at 85% 10%, rgba(255, 255, 255, 0.16), transparent 62%) !important;
}

.cta-band h2,
.cta-band h3 {
  color: #fff !important;
}

.cta-band p,
.cta-band li {
  color: #dbe9f7;
}

.footer {
  /* 首页有一份 10Web 生成的内联"关键 CSS"，位置在样式表之后，
     里面还留着旧的页脚底色 #061320；这里用 !important 把它压过去。 */
  background: #0a0c11 !important;
  border-top: 0 !important;
}

.footer__bottom {
  border-top-color: rgba(255, 255, 255, 0.09);
}

/* 深色区块直接贴住页脚：中间不留任何白色空隙 */
body.wecent-site .cta-band + .footer,
body.wecent-site .cta-band + * + .footer {
  margin-top: 0 !important;
}

/* --- 5. 文章列表页（/blog/）卡片与话题卡 ---------------------------------- */

/* banner 标题一行放下：原来 .page-hero h1 限宽 30ch，中等长度的标题会被折成两行
   （博客页 "…from the Charger Factory" 的 Factory 被挤到第二行；目录页同理）。
   放宽到 46ch，短标题一行、长标题才折行。 */
.page-hero h1 {
  max-width: 46ch;
}

.blog-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.blog-topics a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #cfe0f0;
  font-size: 0.85rem;
  font-weight: 600;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.blog-topics a:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.blog-topic-card {
  display: block;
  text-decoration: none;
}

.blog-topic-card h3 {
  font-size: 1.05rem;
  margin: 0 0 0.5em;
}

.blog-topic-card p {
  font-size: 0.9rem;
  color: var(--body);
  margin: 0 0 1em;
}

.blog-topic-card__more {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--blue);
}

/* Kadence 博客列表 → 我们的卡片外观 */
ul.kadence-posts-list,
.kadence-posts-list {
  list-style: none;
  /* Kadence 自带 ul.kadence-posts-list{margin:0} 权重更高，这里必须 !important 才能生效 */
  margin: clamp(26px, 3vw, 38px) 0 0 !important;
  padding: 0;
  gap: clamp(16px, 2vw, 24px);
}

/* 卡片里的层次：分类标签 → 标题 → 作者/日期 → 摘要 → Read more。
   原来 Kadence 的 .entry-header 下边距(16px) + .entry-meta 下边距(12.8px) + 弹性间距(12px)
   叠成 40.8px，"作者/日期"那行和正文拉得太开，这里收紧到 12px。 */
.kadence-posts-list .entry-header {
  margin-bottom: 0 !important;
}

.kadence-posts-list .entry-meta {
  margin-bottom: 0 !important;
}

/* 分类标签和标题之间留一点，不然胶囊紧贴标题文字 */
.kadence-posts-list .entry-taxonomies {
  margin-bottom: 10px !important;
}

/* 文章详情页同理：标题+作者行和正文之间收紧一点 */
.single-post .entry-header {
  margin-bottom: 20px !important;
}

.single-post .entry-meta {
  margin-bottom: 0 !important;
}

.kadence-posts-list .entry-list-item {
  margin: 0;
  display: flex;
}

.kadence-posts-list .entry-list-item > article.loop-entry {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.kadence-posts-list .entry-list-item > article.loop-entry:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: #cfe0ee;
}

.kadence-posts-list .entry-content-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
  flex: 1;
}

.kadence-posts-list .entry-taxonomies {
  margin: 0;
}

.kadence-posts-list .entry-taxonomies a {
  display: inline-block;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
}

.kadence-posts-list .entry-title {
  font-size: 1.06rem;
  line-height: 1.35;
  margin: 0;
}

.kadence-posts-list .entry-title a {
  color: var(--ink);
  font-weight: 500;
  letter-spacing: -0.004em;
}

.kadence-posts-list .entry-title a:hover {
  color: var(--blue);
}

.kadence-posts-list .entry-meta {
  font-size: 0.8rem;
  color: var(--muted);
  margin: 0;
}

.kadence-posts-list .entry-summary {
  margin: 0;
}

.kadence-posts-list .entry-summary p {
  font-size: 0.92rem;
  line-height: 1.65;
  color: var(--body);
  margin: 0;
}

.kadence-posts-list .entry-actions {
  margin-top: auto;
  padding-top: 4px;
}

.kadence-posts-list .post-more-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.87rem;
  font-weight: 600;
  color: var(--blue);
}

/* 文章详情页：正文行宽与图片 */
.single-post .entry-content {
  max-width: 78ch;
  margin-inline: auto;
}

/* --- 6. 文章详情页模板（hero / 目录 / 分享 / 相关推荐） ------------------- */

.post-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-top: 22px;
  font-size: 0.88rem;
  color: #9fb4c8;
}

.post-hero__meta .dot {
  opacity: 0.5;
}

.post-hero__btn {
  margin-left: auto;
}

/* 正文目录 */
.post-toc {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--soft);
  padding: 20px 24px;
  margin: 0 0 30px;
}

.post-toc__title {
  display: block;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue);
  margin-bottom: 12px;
}

.post-toc ol {
  margin: 0;
  padding-left: 1.2em;
  display: grid;
  gap: 7px;
}

.post-toc li {
  font-size: 0.93rem;
  color: var(--body);
}

.post-toc a {
  color: var(--ink-2);
}

.post-toc a:hover {
  color: var(--blue);
}

/* 正文之后：分享 + 相关 + 推荐 */
.post-foot {
  max-width: 78ch;
  margin: 0 auto;
  padding-top: 34px;
}

.post-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.post-share__label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  margin-right: 4px;
}

.post-share a {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--blue);
  border: 1px solid #cfe3f5;
  background: var(--blue-soft);
  border-radius: 999px;
  padding: 7px 14px;
}

.post-share a:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.post-foot__head {
  margin-top: 40px;
}

.post-card {
  display: block;
  text-decoration: none;
}

.post-card__date {
  display: block;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 8px;
}

.post-card h3 {
  font-size: 1.02rem;
  font-weight: 500;
  margin: 0 0 0.5em;
}

.post-card p {
  font-size: 0.9rem;
  color: var(--body);
  margin: 0 0 1em;
}

.post-card__more {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--blue);
}

.post-card--rec h3 {
  font-size: 1.05rem;
}

.single-post .entry-content h2 {
  margin-top: 1.6em;
}

.single-post .entry-content h3 {
  margin-top: 1.3em;
}

.single-post .entry-content p,
.single-post .entry-content li {
  font-size: 0.98rem;
  line-height: 1.75;
}